@atlaskit/eslint-plugin-design-system 13.20.0 → 13.21.0

package/dist/es2019/rules/use-tokens-shape/transformers/index.js

@@ -0,0 +1,120 @@
+/* eslint-disable @repo/internal/react/require-jsdoc */
+
+import { isNodeOfType } from 'eslint-codemod-utils';
+import * as ast from '../../../ast-nodes';
+import { isStringOrNumber } from '../../use-tokens-space/utils';
+import { styleMap } from './style-map';
+import supported from './supported';
+const messageId = 'noRawShapeValues';
+export const StyleProperty = {
+  lint(node, {
+    context
+  }) {
+    // Check whether all criteria needed to make a transformation are met
+    const {
+      success,
+      ref
+    } = StyleProperty._check(node);
+    if (!success) {
+      return;
+    }
+    context.report({
+      node: ref.node.value,
+      messageId,
+      fix: ref.token ? StyleProperty._fix(ref, context) : undefined
+    });
+  },
+  _check(node) {
+    if (!isNodeOfType(node, 'Property')) {
+      return {
+        success: false,
+        ref: undefined
+      };
+    }
+
+    /**
+     * Currently, we support values like:
+     * ```
+     * {
+     *   borderRadius: '8px', // value.type is Literal
+     *   borderWidth: 2, // value.type is UnaryExpression
+     * }
+     * ```
+     */
+    if (!(isNodeOfType(node.value, 'Literal') || isNodeOfType(node.value, 'UnaryExpression'))) {
+      return {
+        success: false,
+        ref: undefined
+      };
+    }
+    const {
+      value: property
+    } = ast.ObjectEntry.getProperty(node);
+
+    // Bail if the property is not `borderRadius`, `borderWidth`, etc
+    if (!property || !styleMap[property]) {
+      return {
+        success: false,
+        ref: undefined
+      };
+    }
+    const value = ast.ObjectEntry.getValue(node);
+
+    // This is mainly useful as a type guard, so the checks after don't have to have duplicate checks for other types.
+    if (!isStringOrNumber(value)) {
+      return {
+        success: false,
+        ref: undefined
+      };
+    }
+
+    // ignore CSS vars. See: https://stash.atlassian.com/projects/ATLASSIAN/repos/atlassian-frontend-monorepo/pull-requests/74844/overview?commentId=6741571
+    if (value.toString().startsWith('var(')) {
+      return {
+        success: false,
+        ref: undefined
+      };
+    }
+
+    // There are valid values to ignore, such as `margin: auto`
+    if (supported.values.ignore.includes(value)) {
+      return {
+        success: false,
+        ref: undefined
+      };
+    }
+
+    // Don't report on stuff like `borderRadius: '3px 8px'`.
+    // We may iterate to handle values like this in future.
+    if (value.toString().includes(' ')) {
+      return {
+        success: false,
+        ref: undefined
+      };
+    }
+    const ref = {
+      node,
+      token: styleMap[property][value],
+      fallback: value
+    };
+    return {
+      success: true,
+      ref
+    };
+  },
+  /**
+   * All required validation steps have been taken care of before this
+   * transformer is called, so it just goes ahead providing all necessary fixes
+   */
+  _fix(ref, context) {
+    return fixer => {
+      const importFix = ast.Root.upsertNamedImportDeclaration({
+        module: '@atlaskit/tokens',
+        specifiers: ['token']
+      }, context, fixer);
+      const tokenCall = `token('${ref.token}')`;
+      const tokenFix = fixer.replaceText(ref.node.value, tokenCall);
+      return [importFix, tokenFix].filter(fix => Boolean(fix)); // Some of the transformers can return arrays with undefined, so filter them out
+    };
+  }
+};

package/dist/es2019/rules/use-tokens-shape/transformers/style-map.js

@@ -0,0 +1,43 @@
+const radiusTokenMap = {
+  '2px': 'radius.xsmall',
+  '3px': 'radius.small',
+  '4px': 'radius.small',
+  '6px': 'radius.medium',
+  '8px': 'radius.large',
+  '12px': 'radius.xlarge',
+  '50%': 'radius.full',
+  '100%': 'radius.full',
+  2: 'radius.xsmall',
+  3: 'radius.small',
+  4: 'radius.small',
+  6: 'radius.medium',
+  8: 'radius.large',
+  12: 'radius.xlarge',
+  '0.125rem': 'radius.xsmall',
+  '0.25rem': 'radius.small',
+  '0.375rem': 'radius.medium',
+  '0.5rem': 'radius.large',
+  '0.75rem': 'radius.xlarge'
+};
+const borderWidthTokenMap = {
+  '1px': 'border.width'
+};
+export const styleMap = {
+  borderRadius: radiusTokenMap,
+  borderTopLeftRadius: radiusTokenMap,
+  borderTopRightRadius: radiusTokenMap,
+  borderBottomRightRadius: radiusTokenMap,
+  borderBottomLeftRadius: radiusTokenMap,
+  borderStartStartRadius: radiusTokenMap,
+  borderStartEndRadius: radiusTokenMap,
+  borderEndStartRadius: radiusTokenMap,
+  borderEndEndRadius: radiusTokenMap,
+  borderWidth: borderWidthTokenMap,
+  borderBottomWidth: borderWidthTokenMap,
+  borderLeftWidth: borderWidthTokenMap,
+  borderRightWidth: borderWidthTokenMap,
+  borderTopWidth: borderWidthTokenMap,
+  borderBlockWidth: borderWidthTokenMap,
+  borderInlineWidth: borderWidthTokenMap,
+  outlineWidth: borderWidthTokenMap
+};

package/dist/es2019/rules/use-tokens-shape/transformers/supported.js

@@ -0,0 +1,9 @@
+const supported = {
+  values: {
+    ignore: ['initial', 'inherit', 'unset', 'revert', 'revert-layer', 'none',
+    // outline-offset can be set to none
+    // Currently the DST opinion is that 0 is valid.
+    0, '0', '0px', '0em', '0rem']
+  }
+};
+export default supported;

package/dist/esm/presets/all-flat.codegen.js

@@ -1,6 +1,6 @@
 /**
  * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::e075ab709ebd382d6f5e39fd78de9d6d>>
+ * @codegen <<SignedSource::c8428e53319286fb2b37a107968f2be8>>
  * @codegenCommand yarn workspace @atlaskit/eslint-plugin-design-system codegen
  */
 
@@ -70,6 +70,7 @@ export default {
     '@atlaskit/design-system/use-primitives-text': 'warn',
     '@atlaskit/design-system/use-should-render-to-parent': 'warn',
     '@atlaskit/design-system/use-tag-group-label': 'warn',
+    '@atlaskit/design-system/use-tokens-shape': 'error',
     '@atlaskit/design-system/use-tokens-space': 'error',
     '@atlaskit/design-system/use-tokens-typography': 'warn',
     '@atlaskit/design-system/use-visually-hidden': 'error'

package/dist/esm/presets/all.codegen.js

@@ -1,6 +1,6 @@
 /**
  * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::d78f5649534c2e153e3ce48063649a8a>>
+ * @codegen <<SignedSource::a739ba6d63b1aa39d462906ee1876ce6>>
  * @codegenCommand yarn workspace @atlaskit/eslint-plugin-design-system codegen
  */
 
@@ -69,6 +69,7 @@ export default {
     '@atlaskit/design-system/use-primitives-text': 'warn',
     '@atlaskit/design-system/use-should-render-to-parent': 'warn',
     '@atlaskit/design-system/use-tag-group-label': 'warn',
+    '@atlaskit/design-system/use-tokens-shape': 'error',
     '@atlaskit/design-system/use-tokens-space': 'error',
     '@atlaskit/design-system/use-tokens-typography': 'warn',
     '@atlaskit/design-system/use-visually-hidden': 'error'

package/dist/esm/rules/ensure-design-token-usage/shape.js

@@ -1,18 +1,14 @@
 import { isNodeOfType } from 'eslint-codemod-utils';
 import { shape as shapeTokens } from '@atlaskit/tokens/tokens-raw';
-var shapeProperties = ['borderTopLeftRadius', 'borderTopRightRadius', 'borderBottomRightRadius', 'borderBottomLeftRadius', 'borderRadius'];
+var shapeProperties = ['borderTopLeftRadius', 'borderTopRightRadius', 'borderBottomRightRadius', 'borderBottomLeftRadius', 'borderRadius', 'borderStartStartRadius', 'borderStartEndRadius', 'borderEndStartRadius', 'borderEndEndRadius'];
 var borderSizeProperties = ['borderWidth', 'outlineWidth', 'borderRightWidth', 'borderLeftWidth', 'borderTopWidth', 'borderBottomWidth', 'borderInlineWidth', 'borderBlockWidth'];
 export var radiusValueToToken = Object.fromEntries(shapeTokens.filter(function (t) {
-  return t.name.startsWith('border.radius');
-})
-// we prefer using the default (border.radius) over its aliases
-.filter(function (t) {
-  return !t.name.startsWith('border.radius.100');
+  return t.name.startsWith('radius');
 }).map(function (t) {
   return [t.value, t.cleanName];
-}).concat([['3px', 'border.radius']]) // add in an extra entry to resolve 3px to border.radius (normally 4px)
-.concat([['50%', 'border.radius.circle']]) // add in an extra entry to resolve 50% to border.radius.circle (normally 2002rem)
-);
+})
+// add in extra entries to resolve 3px, 50%, and 100% to tokens
+.concat([['3px', 'radius.small'], ['50%', 'radius.full'], ['100%', 'radius.full']]));
 export var borderWidthValueToToken = Object.fromEntries(shapeTokens.filter(function (t) {
   return t.name.startsWith('border.width');
 }).map(function (t) {

package/dist/esm/rules/index.codegen.js

@@ -1,6 +1,6 @@
 /**
  * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::53ad66d79f989ce9beb46ee0186685b2>>
+ * @codegen <<SignedSource::5fbd59fcd3fd6cb0602821de4a0a32aa>>
  * @codegenCommand yarn workspace @atlaskit/eslint-plugin-design-system codegen
  */
 import consistentCssPropUsage from './consistent-css-prop-usage';
@@ -66,6 +66,7 @@ import usePrimitives from './use-primitives';
 import usePrimitivesText from './use-primitives-text';
 import useShouldRenderToParent from './use-should-render-to-parent';
 import useTagGroupLabel from './use-tag-group-label';
+import useTokensShape from './use-tokens-shape';
 import useTokensSpace from './use-tokens-space';
 import useTokensTypography from './use-tokens-typography';
 import useVisuallyHidden from './use-visually-hidden';
@@ -133,6 +134,7 @@ export var rules = {
   'use-primitives-text': usePrimitivesText,
   'use-should-render-to-parent': useShouldRenderToParent,
   'use-tag-group-label': useTagGroupLabel,
+  'use-tokens-shape': useTokensShape,
   'use-tokens-space': useTokensSpace,
   'use-tokens-typography': useTokensTypography,
   'use-visually-hidden': useVisuallyHidden

package/dist/esm/rules/no-custom-icons/index.js

@@ -24,11 +24,12 @@ var rule = createLintRule({
       additionalProperties: false
     }],
     messages: {
-      noCustomIcons: "Custom icons from {{importSource}} are no longer supported. Migrate to an icon from '@atlaskit/(icon-labs|icon/core|icon/utility)'{{locationMessage}}.\n[Migration guide](https://hello.atlassian.net/wiki/spaces/DST/pages/3748692796/New+ADS+iconography+-+Code+migration+guide)."
+      noCustomIcons: "Custom icons/svgs from {{importSource}} are no longer supported. Migrate to an icon from '@atlaskit/(icon-labs|icon/core|icon/utility)'{{locationMessage}}.\n[Migration guide](https://hello.atlassian.net/wiki/spaces/DST/pages/3748692796/New+ADS+iconography+-+Code+migration+guide)."
     }
   },
   create: function create(context) {
     var _context$options$;
+    var isIconSvg = createIsFromImportSourceFor('@atlaskit/icon/svg');
     var isIconBase = createIsFromImportSourceFor('@atlaskit/icon', '@atlaskit/icon/base');
 
     // TODO: JFP-2823 - this type cast was added due to Jira's ESLint v9 migration
@@ -37,14 +38,25 @@ var rule = createLintRule({
       centralLocation = _ref$centralLocation === void 0 ? '' : _ref$centralLocation,
       _ref$failSilently = _ref.failSilently,
       failSilently = _ref$failSilently === void 0 ? false : _ref$failSilently;
+    function checkNode(node) {
+      isIconBase.importDeclarationHook(node);
+      isIconSvg.importDeclarationHook(node);
+    }
     var locationMessage = centralLocation ? ", move the icon to '".concat(centralLocation, "', or, if it's a third party logo, migrate to a standard <svg> element with a `label`.") : '';
     return errorBoundary({
       JSXElement: function JSXElement(node) {
-        var _isIconBase$getImport;
-        if (!isIconBase(node) || !hasProp(node, 'glyph')) {
+        var isSvg = isIconSvg(node);
+        var isBase = isIconBase(node);
+        // Not an icon import
+        if (!isSvg && (!isBase || !hasProp(node, 'glyph'))) {
           return;
         }
-        var importSource = (_isIconBase$getImport = isIconBase.getImportSource(node)) !== null && _isIconBase$getImport !== void 0 ? _isIconBase$getImport : '';
+        var importSource = '';
+        if (isSvg) {
+          importSource = isIconSvg.getImportSource(node);
+        } else if (isBase) {
+          importSource = isIconBase.getImportSource(node);
+        }
         context.report({
           node: node.openingElement,
           messageId: 'noCustomIcons',
@@ -54,7 +66,7 @@ var rule = createLintRule({
           }
         });
       },
-      ImportDeclaration: isIconBase.importDeclarationHook
+      ImportDeclaration: checkNode
     }, failSilently);
   }
 });

package/dist/esm/rules/use-tokens-shape/index.js

@@ -0,0 +1,48 @@
+import { createLintRule } from '../utils/create-rule';
+import { StyleProperty } from './transformers';
+var rule = createLintRule({
+  meta: {
+    name: 'use-tokens-shape',
+    type: 'problem',
+    fixable: 'code',
+    hasSuggestions: true,
+    docs: {
+      description: 'Enforces usage of shape design tokens rather than hard-coded values.',
+      recommended: false,
+      severity: 'error'
+    },
+    messages: {
+      noRawShapeValues: 'The use of shape tokens is preferred over the direct application of border radius and border width properties.'
+    }
+  },
+  create: function create(context) {
+    return {
+      'CallExpression[callee.name="css"] ObjectExpression Property': function CallExpressionCalleeNameCss_ObjectExpression_Property(node) {
+        return StyleProperty.lint(node, {
+          context: context
+        });
+      },
+      'CallExpression[callee.name="keyframes"] ObjectExpression Property': function CallExpressionCalleeNameKeyframes_ObjectExpression_Property(node) {
+        return StyleProperty.lint(node, {
+          context: context
+        });
+      },
+      'CallExpression[callee.name="cssMap"] ObjectExpression Property': function CallExpressionCalleeNameCssMap_ObjectExpression_Property(node) {
+        return StyleProperty.lint(node, {
+          context: context
+        });
+      },
+      'CallExpression[callee.object.name=styled] ObjectExpression Property': function CallExpressionCalleeObjectNameStyled_ObjectExpression_Property(node) {
+        return StyleProperty.lint(node, {
+          context: context
+        });
+      },
+      'CallExpression[callee.object.name=styled2] ObjectExpression Property': function CallExpressionCalleeObjectNameStyled2_ObjectExpression_Property(node) {
+        return StyleProperty.lint(node, {
+          context: context
+        });
+      }
+    };
+  }
+});
+export default rule;

package/dist/esm/rules/use-tokens-shape/transformers/index.js

@@ -0,0 +1,119 @@
+/* eslint-disable @repo/internal/react/require-jsdoc */
+
+import { isNodeOfType } from 'eslint-codemod-utils';
+import * as ast from '../../../ast-nodes';
+import { isStringOrNumber } from '../../use-tokens-space/utils';
+import { styleMap } from './style-map';
+import supported from './supported';
+var messageId = 'noRawShapeValues';
+export var StyleProperty = {
+  lint: function lint(node, _ref) {
+    var context = _ref.context;
+    // Check whether all criteria needed to make a transformation are met
+    var _StyleProperty$_check = StyleProperty._check(node),
+      success = _StyleProperty$_check.success,
+      ref = _StyleProperty$_check.ref;
+    if (!success) {
+      return;
+    }
+    context.report({
+      node: ref.node.value,
+      messageId: messageId,
+      fix: ref.token ? StyleProperty._fix(ref, context) : undefined
+    });
+  },
+  _check: function _check(node) {
+    if (!isNodeOfType(node, 'Property')) {
+      return {
+        success: false,
+        ref: undefined
+      };
+    }
+
+    /**
+     * Currently, we support values like:
+     * ```
+     * {
+     *   borderRadius: '8px', // value.type is Literal
+     *   borderWidth: 2, // value.type is UnaryExpression
+     * }
+     * ```
+     */
+    if (!(isNodeOfType(node.value, 'Literal') || isNodeOfType(node.value, 'UnaryExpression'))) {
+      return {
+        success: false,
+        ref: undefined
+      };
+    }
+    var _ast$ObjectEntry$getP = ast.ObjectEntry.getProperty(node),
+      property = _ast$ObjectEntry$getP.value;
+
+    // Bail if the property is not `borderRadius`, `borderWidth`, etc
+    if (!property || !styleMap[property]) {
+      return {
+        success: false,
+        ref: undefined
+      };
+    }
+    var value = ast.ObjectEntry.getValue(node);
+
+    // This is mainly useful as a type guard, so the checks after don't have to have duplicate checks for other types.
+    if (!isStringOrNumber(value)) {
+      return {
+        success: false,
+        ref: undefined
+      };
+    }
+
+    // ignore CSS vars. See: https://stash.atlassian.com/projects/ATLASSIAN/repos/atlassian-frontend-monorepo/pull-requests/74844/overview?commentId=6741571
+    if (value.toString().startsWith('var(')) {
+      return {
+        success: false,
+        ref: undefined
+      };
+    }
+
+    // There are valid values to ignore, such as `margin: auto`
+    if (supported.values.ignore.includes(value)) {
+      return {
+        success: false,
+        ref: undefined
+      };
+    }
+
+    // Don't report on stuff like `borderRadius: '3px 8px'`.
+    // We may iterate to handle values like this in future.
+    if (value.toString().includes(' ')) {
+      return {
+        success: false,
+        ref: undefined
+      };
+    }
+    var ref = {
+      node: node,
+      token: styleMap[property][value],
+      fallback: value
+    };
+    return {
+      success: true,
+      ref: ref
+    };
+  },
+  /**
+   * All required validation steps have been taken care of before this
+   * transformer is called, so it just goes ahead providing all necessary fixes
+   */
+  _fix: function _fix(ref, context) {
+    return function (fixer) {
+      var importFix = ast.Root.upsertNamedImportDeclaration({
+        module: '@atlaskit/tokens',
+        specifiers: ['token']
+      }, context, fixer);
+      var tokenCall = "token('".concat(ref.token, "')");
+      var tokenFix = fixer.replaceText(ref.node.value, tokenCall);
+      return [importFix, tokenFix].filter(function (fix) {
+        return Boolean(fix);
+      }); // Some of the transformers can return arrays with undefined, so filter them out
+    };
+  }
+};

package/dist/esm/rules/use-tokens-shape/transformers/style-map.js

@@ -0,0 +1,43 @@
+var radiusTokenMap = {
+  '2px': 'radius.xsmall',
+  '3px': 'radius.small',
+  '4px': 'radius.small',
+  '6px': 'radius.medium',
+  '8px': 'radius.large',
+  '12px': 'radius.xlarge',
+  '50%': 'radius.full',
+  '100%': 'radius.full',
+  2: 'radius.xsmall',
+  3: 'radius.small',
+  4: 'radius.small',
+  6: 'radius.medium',
+  8: 'radius.large',
+  12: 'radius.xlarge',
+  '0.125rem': 'radius.xsmall',
+  '0.25rem': 'radius.small',
+  '0.375rem': 'radius.medium',
+  '0.5rem': 'radius.large',
+  '0.75rem': 'radius.xlarge'
+};
+var borderWidthTokenMap = {
+  '1px': 'border.width'
+};
+export var styleMap = {
+  borderRadius: radiusTokenMap,
+  borderTopLeftRadius: radiusTokenMap,
+  borderTopRightRadius: radiusTokenMap,
+  borderBottomRightRadius: radiusTokenMap,
+  borderBottomLeftRadius: radiusTokenMap,
+  borderStartStartRadius: radiusTokenMap,
+  borderStartEndRadius: radiusTokenMap,
+  borderEndStartRadius: radiusTokenMap,
+  borderEndEndRadius: radiusTokenMap,
+  borderWidth: borderWidthTokenMap,
+  borderBottomWidth: borderWidthTokenMap,
+  borderLeftWidth: borderWidthTokenMap,
+  borderRightWidth: borderWidthTokenMap,
+  borderTopWidth: borderWidthTokenMap,
+  borderBlockWidth: borderWidthTokenMap,
+  borderInlineWidth: borderWidthTokenMap,
+  outlineWidth: borderWidthTokenMap
+};

package/dist/esm/rules/use-tokens-shape/transformers/supported.js

@@ -0,0 +1,9 @@
+var supported = {
+  values: {
+    ignore: ['initial', 'inherit', 'unset', 'revert', 'revert-layer', 'none',
+    // outline-offset can be set to none
+    // Currently the DST opinion is that 0 is valid.
+    0, '0', '0px', '0em', '0rem']
+  }
+};
+export default supported;

package/dist/types/index.codegen.d.ts

@@ -78,6 +78,7 @@ export declare const plugin: {
         'use-primitives-text': import("eslint").Rule.RuleModule;
         'use-should-render-to-parent': import("eslint").Rule.RuleModule;
         'use-tag-group-label': import("eslint").Rule.RuleModule;
+        'use-tokens-shape': import("eslint").Rule.RuleModule;
         'use-tokens-space': import("eslint").Rule.RuleModule;
         'use-tokens-typography': import("eslint").Rule.RuleModule;
         'use-visually-hidden': import("eslint").Rule.RuleModule;
@@ -148,6 +149,7 @@ export declare const plugin: {
                 '@atlaskit/design-system/use-primitives-text': "warn";
                 '@atlaskit/design-system/use-should-render-to-parent': "warn";
                 '@atlaskit/design-system/use-tag-group-label': "warn";
+                '@atlaskit/design-system/use-tokens-shape': "error";
                 '@atlaskit/design-system/use-tokens-space': "error";
                 '@atlaskit/design-system/use-tokens-typography': "warn";
                 '@atlaskit/design-system/use-visually-hidden': "error";
@@ -220,6 +222,7 @@ export declare const plugin: {
                 '@atlaskit/design-system/use-primitives-text': "warn";
                 '@atlaskit/design-system/use-should-render-to-parent': "warn";
                 '@atlaskit/design-system/use-tag-group-label': "warn";
+                '@atlaskit/design-system/use-tokens-shape': "error";
                 '@atlaskit/design-system/use-tokens-space': "error";
                 '@atlaskit/design-system/use-tokens-typography': "warn";
                 '@atlaskit/design-system/use-visually-hidden': "error";
@@ -397,6 +400,7 @@ declare const configs: {
             '@atlaskit/design-system/use-primitives-text': "warn";
             '@atlaskit/design-system/use-should-render-to-parent': "warn";
             '@atlaskit/design-system/use-tag-group-label': "warn";
+            '@atlaskit/design-system/use-tokens-shape': "error";
             '@atlaskit/design-system/use-tokens-space': "error";
             '@atlaskit/design-system/use-tokens-typography': "warn";
             '@atlaskit/design-system/use-visually-hidden': "error";
@@ -469,6 +473,7 @@ declare const configs: {
             '@atlaskit/design-system/use-primitives-text': "warn";
             '@atlaskit/design-system/use-should-render-to-parent': "warn";
             '@atlaskit/design-system/use-tag-group-label': "warn";
+            '@atlaskit/design-system/use-tokens-shape': "error";
             '@atlaskit/design-system/use-tokens-space': "error";
             '@atlaskit/design-system/use-tokens-typography': "warn";
             '@atlaskit/design-system/use-visually-hidden': "error";

package/dist/types/presets/all-flat.codegen.d.ts

@@ -63,6 +63,7 @@ declare const _default: {
         '@atlaskit/design-system/use-primitives-text': "warn";
         '@atlaskit/design-system/use-should-render-to-parent': "warn";
         '@atlaskit/design-system/use-tag-group-label': "warn";
+        '@atlaskit/design-system/use-tokens-shape': "error";
         '@atlaskit/design-system/use-tokens-space': "error";
         '@atlaskit/design-system/use-tokens-typography': "warn";
         '@atlaskit/design-system/use-visually-hidden': "error";

package/dist/types/presets/all.codegen.d.ts

@@ -63,6 +63,7 @@ declare const _default: {
         '@atlaskit/design-system/use-primitives-text': "warn";
         '@atlaskit/design-system/use-should-render-to-parent': "warn";
         '@atlaskit/design-system/use-tag-group-label': "warn";
+        '@atlaskit/design-system/use-tokens-shape': "error";
         '@atlaskit/design-system/use-tokens-space': "error";
         '@atlaskit/design-system/use-tokens-typography': "warn";
         '@atlaskit/design-system/use-visually-hidden': "error";

package/dist/types/rules/index.codegen.d.ts

@@ -62,6 +62,7 @@ export declare const rules: {
     'use-primitives-text': import("eslint").Rule.RuleModule;
     'use-should-render-to-parent': import("eslint").Rule.RuleModule;
     'use-tag-group-label': import("eslint").Rule.RuleModule;
+    'use-tokens-shape': import("eslint").Rule.RuleModule;
     'use-tokens-space': import("eslint").Rule.RuleModule;
     'use-tokens-typography': import("eslint").Rule.RuleModule;
     'use-visually-hidden': import("eslint").Rule.RuleModule;

package/dist/types/rules/use-tokens-shape/index.d.ts

@@ -0,0 +1,3 @@
+import type { Rule } from 'eslint';
+declare const rule: Rule.RuleModule;
+export default rule;

package/dist/types/rules/use-tokens-shape/transformers/index.d.ts

@@ -0,0 +1,26 @@
+import type { Rule } from 'eslint';
+import { type Property } from 'eslint-codemod-utils';
+type Ref = {
+    node: Property;
+    token?: string;
+    fallback?: string | number;
+};
+type Check = {
+    success: false;
+    ref: undefined;
+} | {
+    success: true;
+    ref: Ref;
+};
+export declare const StyleProperty: {
+    lint(node: Rule.Node, { context }: {
+        context: Rule.RuleContext;
+    }): void;
+    _check(node: Rule.Node): Check;
+    /**
+     * All required validation steps have been taken care of before this
+     * transformer is called, so it just goes ahead providing all necessary fixes
+     */
+    _fix(ref: Ref, context: Rule.RuleContext): (fixer: Rule.RuleFixer) => Rule.Fix[];
+};
+export {};

package/dist/types/rules/use-tokens-shape/transformers/style-map.d.ts

@@ -0,0 +1,10 @@
+declare const radiusTokenMap: {
+    [key: string]: string;
+};
+declare const borderWidthTokenMap: {
+    [key: string]: string;
+};
+export declare const styleMap: {
+    [key: string]: typeof radiusTokenMap | typeof borderWidthTokenMap;
+};
+export {};

package/dist/types/rules/use-tokens-shape/transformers/supported.d.ts

@@ -0,0 +1,6 @@
+declare const supported: {
+    values: {
+        ignore: (string | number)[];
+    };
+};
+export default supported;