add eslint rule and deprecate className in box

Telefonica · Oct 3, 2024 · 6dd3540 · 6dd3540
1 parent 390db17
commit 6dd3540
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 2 deletions.
diff --git a/.eslintrc.yml b/.eslintrc.yml
@@ -23,8 +23,11 @@ overrides:
       rules:
           no-restricted-imports:
               - error
-              - name: '@vanilla-extract/css'
-                message: This package should only be imported in css files
+              - patterns:
+                    - group:
+                          - '@vanilla-extract/css'
+                          - '**/sprinkles.css'
+                      message: This package should only be imported in css files
 rules:
     import/extensions:
         - error

diff --git a/src/box.tsx b/src/box.tsx
@@ -19,6 +19,10 @@ type Props = {
     paddingRight?: ByBreakpoint<PadSize>;
     as?: React.ComponentType<any> | string;
     children?: React.ReactNode;
+    /**
+     * @deprecated this component is meant to be used only to add padding.
+     * Consider using a div (or similar) instead if you need to add extra styles
+     */
     className?: string;
     role?: string;
     /** "data-" prefix is automatically added. For example, use "testid" instead of "data-testid" */