fix(xds): add 'x' prefix on all classes usages

empathyco · Nov 22, 2024 · 88ca398 · 88ca398
1 parent 7c7f7b4
commit 88ca398
Show file tree

Hide file tree

Showing 5 changed files with 7 additions and 7 deletions.
diff --git a/packages/x-tailwindcss/src/types.ts b/packages/x-tailwindcss/src/types.ts
@@ -24,7 +24,7 @@ type CssVariable = `--${string}`;
  *
  * @example
  * ```typescript
- * const btnClass: CssClassSelector = '.btn';
+ * const btnClass: CssClassSelector = '.x-btn';
  * ```
  *
  * @internal
@@ -60,7 +60,7 @@ type CssPseudoSelector = `:${string}`;
  * ```typescript
  * const cssOptions: CssStyleOptions = {
  *   '--color-lead': 'blue',
- *   '.btn': {
+ *   '.x-btn': {
  *     '&--lead': {
  *       color: 'var(--color-lead)',
  *       gap: theme('x.spacing.2')

diff --git a/packages/x-tailwindcss/src/x-tailwind-plugin/components/input-group/default.ts b/packages/x-tailwindcss/src/x-tailwind-plugin/components/input-group/default.ts
@@ -28,7 +28,7 @@ export function inputGroupDefault(helpers: TailwindHelpers) {
       marginInlineEnd: theme('x.spacing.16')
     },
 
-    '.input, input': {
+    '.x-input, input': {
       flex: '1 1 auto',
       minWidth: '0',
       padding: '0',

diff --git a/packages/x-tailwindcss/src/x-tailwind-plugin/components/picture/overlay.ts b/packages/x-tailwindcss/src/x-tailwind-plugin/components/picture/overlay.ts
@@ -13,7 +13,7 @@ export function overlay(helpers: TailwindHelpers) {
       '&:hover': {
         mixBlendMode: 'multiply'
       },
-      '.picture-image': {
+      '.x-picture-image': {
         '&:hover': {
           maskImage: `linear-gradient(to top, transparent, 20%, ${theme('x.colors.neutral.100')})`
         }

diff --git a/packages/x-tailwindcss/src/x-tailwind-plugin/components/suggestion-group/default.ts b/packages/x-tailwindcss/src/x-tailwind-plugin/components/suggestion-group/default.ts
@@ -35,7 +35,7 @@ export function suggestionGroupDefault(helpers: TailwindHelpers) {
       textDecoration: 'underline'
     },
 
-    '.suggestion': {
+    '.x-suggestion': {
       color: 'currentColor',
       minHeight: 'inherit',
       fontSize: 'inherit',

diff --git a/packages/x-tailwindcss/src/x-tailwind-plugin/utilities.ts b/packages/x-tailwindcss/src/x-tailwind-plugin/utilities.ts
@@ -11,13 +11,13 @@ import { TailwindHelpers } from '../types';
 export default function utilities({ theme }: TailwindHelpers) {
   return {
     // TODO: replace this example styles with actual design styles
-    '.border-large': {
+    '.x-border-large': {
       borderStyle: 'solid',
       borderWidth: theme('x.borderWidth.4'),
       borderColor: theme('x.colors.neutral.100')
     },
     // This is here to not include it in the bundle if it is not being used
-    '.disable-icon-offset *': {
+    '.x-disable-icon-offset *': {
       '--enableIconOffset': 'var(--OFF)'
     }
   };