@atlaskit/eslint-plugin-design-system 10.8.0 → 10.8.1

package/CHANGELOG.md

@@ -1,5 +1,15 @@
 # @atlaskit/eslint-plugin-design-system
 
+## 10.8.1
+
+### Patch Changes
+
+- [#113465](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/113465)
+  [`1b198cf33c32e`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/1b198cf33c32e) -
+  Create `use-latest-xcss-syntax-typography` rule. Bans the use of 'fontSize', 'lineHeight',
+  'fontWeight' on xcss.
+- Updated dependencies
+
 ## 10.8.0
 
 ### Minor Changes

package/README.md

@@ -81,6 +81,7 @@ module.exports = {
 | <a href="./src/rules/use-heading-level-in-spotlight-card/README.md">use-heading-level-in-spotlight-card</a>                 | Inform developers of eventual requirement of `headingLevel` prop in `SpotlightCard` component. The heading level should be the appropriate level according to the surrounding context.                                                                                                                              | Yes         | Yes     |             |
 | <a href="./src/rules/use-href-in-link-item/README.md">use-href-in-link-item</a>                                             | Inform developers of eventual requirement of `href` prop in `LinkItem` component. Elements with a `link` role require an `href` attribute for users to properly navigate, particularly those using assistive technologies. If no valid `href` is required for your use case, consider using a `ButtonItem` instead. | Yes         | Yes     | Yes         |
 | <a href="./src/rules/use-latest-xcss-syntax/README.md">use-latest-xcss-syntax</a>                                           | Enforces usage of space design tokens rather than hard-coded values in xcss.                                                                                                                                                                                                                                        | Yes         | Yes     |             |
+| <a href="./src/rules/use-latest-xcss-syntax-typography/README.md">use-latest-xcss-syntax-typography</a>                     | Prohibits use of unsafe styling properties in xcss. Please use Text/Heading primitives instead.                                                                                                                                                                                                                     | Yes         | Yes     |             |
 | <a href="./src/rules/use-menu-section-title/README.md">use-menu-section-title</a>                                           | Encourages makers to provide accessible title for Atlassian Design System Menu Section component.                                                                                                                                                                                                                   | Yes         |         | Yes         |
 | <a href="./src/rules/use-popup-label/README.md">use-popup-label</a>                                                         | Encourages to provide accessible name for Atlassian Design System Popup component.                                                                                                                                                                                                                                  | Yes         |         | Yes         |
 | <a href="./src/rules/use-primitives/README.md">use-primitives</a>                                                           | Encourage the usage of primitives components.                                                                                                                                                                                                                                                                       |             | Yes     | Yes         |

package/constellation/index/usage.mdx

@@ -44,6 +44,7 @@ This plugin contains rules that should be used when working with the
 | <a href="/components/eslint-plugin-design-system/use-heading-level-in-spotlight-card/usage">use-heading-level-in-spotlight-card</a>                 | Inform developers of eventual requirement of `headingLevel` prop in `SpotlightCard` component. The heading level should be the appropriate level according to the surrounding context.                                                                                                                              | Yes         | Yes     |             |
 | <a href="/components/eslint-plugin-design-system/use-href-in-link-item/usage">use-href-in-link-item</a>                                             | Inform developers of eventual requirement of `href` prop in `LinkItem` component. Elements with a `link` role require an `href` attribute for users to properly navigate, particularly those using assistive technologies. If no valid `href` is required for your use case, consider using a `ButtonItem` instead. | Yes         | Yes     | Yes         |
 | <a href="/components/eslint-plugin-design-system/use-latest-xcss-syntax/usage">use-latest-xcss-syntax</a>                                           | Enforces usage of space design tokens rather than hard-coded values in xcss.                                                                                                                                                                                                                                        | Yes         | Yes     |             |
+| <a href="/components/eslint-plugin-design-system/use-latest-xcss-syntax-typography/usage">use-latest-xcss-syntax-typography</a>                     | Prohibits use of unsafe styling properties in xcss. Please use Text/Heading primitives instead.                                                                                                                                                                                                                     | Yes         | Yes     |             |
 | <a href="/components/eslint-plugin-design-system/use-menu-section-title/usage">use-menu-section-title</a>                                           | Encourages makers to provide accessible title for Atlassian Design System Menu Section component.                                                                                                                                                                                                                   | Yes         |         | Yes         |
 | <a href="/components/eslint-plugin-design-system/use-popup-label/usage">use-popup-label</a>                                                         | Encourages to provide accessible name for Atlassian Design System Popup component.                                                                                                                                                                                                                                  | Yes         |         | Yes         |
 | <a href="/components/eslint-plugin-design-system/use-primitives/usage">use-primitives</a>                                                           | Encourage the usage of primitives components.                                                                                                                                                                                                                                                                       |             | Yes     | Yes         |

package/constellation/use-latest-xcss-syntax-typography/usage.mdx

@@ -0,0 +1,34 @@
+# use-latest-xcss-syntax-typography
+
+## Description
+
+Soon, applying `fontSize`, `lineHeight`, `fontWeight` with `xcss` will be deprecated. Please refrain
+from adding new usages, as you will need to remove them soon anyway. As an alternative, you can use
+the `Text` and `Heading` primitives.
+
+## Examples
+
+### Incorrect
+
+```jsx
+const myStyles = xcss({
+	fontSize: '14px',
+	^^^^^^^^^^^^^^^^
+	lineHeight: '20px',
+	^^^^^^^^^^^^^^^^^^
+	fontWeight: 500,
+	^^^^^^^^^^^^^^^
+});
+
+<Box as="p" xcss={myStyles}>
+	...
+</Box>;
+```
+
+### Correct
+
+```jsx
+import { Text } from '@atlaskit/primitives';
+
+<Text weight="medium">...</Text>;
+```

package/dist/cjs/ast-nodes/object-entry.js

@@ -66,7 +66,8 @@ var ObjectEntry = exports.ObjectEntry = {
       return undefined;
     }
     if ((0, _eslintCodemodUtils.isNodeOfType)(node.key, 'Literal')) {
-      return node.key.raw;
+      var _node$key$value;
+      return (_node$key$value = node.key.value) === null || _node$key$value === void 0 ? void 0 : _node$key$value.toString();
     }
     if ((0, _eslintCodemodUtils.isNodeOfType)(node.key, 'Identifier')) {
       return node.key.name;

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

@@ -6,7 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = void 0;
 /**
  * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::837556032f39113ae86785a120bb9ccb>>
+ * @codegen <<SignedSource::9bb5329713677543f16019954484ae2f>>
  * @codegenCommand yarn workspace @atlaskit/eslint-plugin-design-system codegen
  */
 var _default = exports.default = {
@@ -44,6 +44,7 @@ var _default = exports.default = {
     '@atlaskit/design-system/use-heading-level-in-spotlight-card': 'warn',
     '@atlaskit/design-system/use-href-in-link-item': 'warn',
     '@atlaskit/design-system/use-latest-xcss-syntax': 'error',
+    '@atlaskit/design-system/use-latest-xcss-syntax-typography': 'warn',
     '@atlaskit/design-system/use-menu-section-title': 'warn',
     '@atlaskit/design-system/use-popup-label': 'warn',
     '@atlaskit/design-system/use-primitives': 'warn',

package/dist/cjs/presets/recommended.codegen.js

@@ -6,7 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = void 0;
 /**
  * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::b7ed527a03208f0bc68f9d34e4ef2260>>
+ * @codegen <<SignedSource::76bee1648b1b78d3ad253f0704a9cac7>>
  * @codegenCommand yarn workspace @atlaskit/eslint-plugin-design-system codegen
  */
 var _default = exports.default = {
@@ -34,6 +34,7 @@ var _default = exports.default = {
     '@atlaskit/design-system/use-heading-level-in-spotlight-card': 'warn',
     '@atlaskit/design-system/use-href-in-link-item': 'warn',
     '@atlaskit/design-system/use-latest-xcss-syntax': 'error',
+    '@atlaskit/design-system/use-latest-xcss-syntax-typography': 'warn',
     '@atlaskit/design-system/use-menu-section-title': 'warn',
     '@atlaskit/design-system/use-popup-label': 'warn',
     '@atlaskit/design-system/use-visually-hidden': 'error'

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

@@ -37,6 +37,7 @@ var _useHeading = _interopRequireDefault(require("./use-heading"));
 var _useHeadingLevelInSpotlightCard = _interopRequireDefault(require("./use-heading-level-in-spotlight-card"));
 var _useHrefInLinkItem = _interopRequireDefault(require("./use-href-in-link-item"));
 var _useLatestXcssSyntax = _interopRequireDefault(require("./use-latest-xcss-syntax"));
+var _useLatestXcssSyntaxTypography = _interopRequireDefault(require("./use-latest-xcss-syntax-typography"));
 var _useMenuSectionTitle = _interopRequireDefault(require("./use-menu-section-title"));
 var _usePopupLabel = _interopRequireDefault(require("./use-popup-label"));
 var _usePrimitives = _interopRequireDefault(require("./use-primitives"));
@@ -46,7 +47,7 @@ var _useTokensTypography = _interopRequireDefault(require("./use-tokens-typograp
 var _useVisuallyHidden = _interopRequireDefault(require("./use-visually-hidden"));
 /**
  * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::287628b11d396c2bcbcf6f4a175a3d3a>>
+ * @codegen <<SignedSource::b359d356c482db0087ddfce5bd105403>>
  * @codegenCommand yarn workspace @atlaskit/eslint-plugin-design-system codegen
  */
 var _default = exports.default = {
@@ -82,6 +83,7 @@ var _default = exports.default = {
   'use-heading-level-in-spotlight-card': _useHeadingLevelInSpotlightCard.default,
   'use-href-in-link-item': _useHrefInLinkItem.default,
   'use-latest-xcss-syntax': _useLatestXcssSyntax.default,
+  'use-latest-xcss-syntax-typography': _useLatestXcssSyntaxTypography.default,
   'use-menu-section-title': _useMenuSectionTitle.default,
   'use-popup-label': _usePopupLabel.default,
   'use-primitives': _usePrimitives.default,

package/dist/cjs/rules/use-latest-xcss-syntax-typography/index.js

@@ -0,0 +1,40 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.error = exports.default = void 0;
+var _createRule = require("../utils/create-rule");
+var _linters = require("./linters");
+var error = exports.error = "Don't set fontSize, lineHeight, fontWeight properties on xcss. They are unsafe as they allow invalid combinations of typography tokens. There is ongoing work to make this a TypeScript error. Once that happens, you will have to delete/refactor anyway.";
+var rule = (0, _createRule.createLintRule)({
+  meta: {
+    name: 'use-latest-xcss-syntax-typography',
+    type: 'problem',
+    fixable: 'code',
+    hasSuggestions: false,
+    docs: {
+      description: 'Prohibits use of unsafe styling properties in xcss. Please use Text/Heading primitives instead.',
+      recommended: true,
+      severity: 'warn'
+    },
+    messages: {
+      noUnsafeTypographyProperties: error
+    }
+  },
+  create: function create(context) {
+    return {
+      'CallExpression[callee.name="xcss"] ObjectExpression > Property > Identifier[name=/(fontSize|lineHeight|fontWeight)/]': function CallExpressionCalleeNameXcssObjectExpressionPropertyIdentifierNameFontSizeLineHeightFontWeight(node) {
+        return _linters.BannedProperty.lint(node, {
+          context: context
+        });
+      },
+      'CallExpression[callee.name="xcss"] ObjectExpression > Property > Literal[value=/(fontSize|lineHeight|fontWeight)/]': function CallExpressionCalleeNameXcssObjectExpressionPropertyLiteralValueFontSizeLineHeightFontWeight(node) {
+        return _linters.BannedProperty.lint(node, {
+          context: context
+        });
+      }
+    };
+  }
+});
+var _default = exports.default = rule;

package/dist/cjs/rules/use-latest-xcss-syntax-typography/linters/banned-property/index.js

@@ -0,0 +1,18 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.BannedProperty = void 0;
+/* eslint-disable @repo/internal/react/require-jsdoc */
+
+var messageId = 'noUnsafeTypographyProperties';
+var BannedProperty = exports.BannedProperty = {
+  lint: function lint(node, _ref) {
+    var context = _ref.context;
+    context.report({
+      node: node,
+      messageId: messageId
+    });
+  }
+};

package/dist/cjs/rules/use-latest-xcss-syntax-typography/linters/index.js

@@ -0,0 +1,12 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "BannedProperty", {
+  enumerable: true,
+  get: function get() {
+    return _bannedProperty.BannedProperty;
+  }
+});
+var _bannedProperty = require("./banned-property");

package/dist/es2019/ast-nodes/object-entry.js

@@ -60,7 +60,8 @@ export const ObjectEntry = {
       return undefined;
     }
     if (isNodeOfType(node.key, 'Literal')) {
-      return node.key.raw;
+      var _node$key$value;
+      return (_node$key$value = node.key.value) === null || _node$key$value === void 0 ? void 0 : _node$key$value.toString();
     }
     if (isNodeOfType(node.key, 'Identifier')) {
       return node.key.name;

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

@@ -1,6 +1,6 @@
 /**
  * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::837556032f39113ae86785a120bb9ccb>>
+ * @codegen <<SignedSource::9bb5329713677543f16019954484ae2f>>
  * @codegenCommand yarn workspace @atlaskit/eslint-plugin-design-system codegen
  */
 export default {
@@ -38,6 +38,7 @@ export default {
     '@atlaskit/design-system/use-heading-level-in-spotlight-card': 'warn',
     '@atlaskit/design-system/use-href-in-link-item': 'warn',
     '@atlaskit/design-system/use-latest-xcss-syntax': 'error',
+    '@atlaskit/design-system/use-latest-xcss-syntax-typography': 'warn',
     '@atlaskit/design-system/use-menu-section-title': 'warn',
     '@atlaskit/design-system/use-popup-label': 'warn',
     '@atlaskit/design-system/use-primitives': 'warn',

package/dist/es2019/presets/recommended.codegen.js

@@ -1,6 +1,6 @@
 /**
  * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::b7ed527a03208f0bc68f9d34e4ef2260>>
+ * @codegen <<SignedSource::76bee1648b1b78d3ad253f0704a9cac7>>
  * @codegenCommand yarn workspace @atlaskit/eslint-plugin-design-system codegen
  */
 export default {
@@ -28,6 +28,7 @@ export default {
     '@atlaskit/design-system/use-heading-level-in-spotlight-card': 'warn',
     '@atlaskit/design-system/use-href-in-link-item': 'warn',
     '@atlaskit/design-system/use-latest-xcss-syntax': 'error',
+    '@atlaskit/design-system/use-latest-xcss-syntax-typography': 'warn',
     '@atlaskit/design-system/use-menu-section-title': 'warn',
     '@atlaskit/design-system/use-popup-label': 'warn',
     '@atlaskit/design-system/use-visually-hidden': 'error'

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

@@ -1,6 +1,6 @@
 /**
  * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::287628b11d396c2bcbcf6f4a175a3d3a>>
+ * @codegen <<SignedSource::b359d356c482db0087ddfce5bd105403>>
  * @codegenCommand yarn workspace @atlaskit/eslint-plugin-design-system codegen
  */
 import consistentCssPropUsage from './consistent-css-prop-usage';
@@ -35,6 +35,7 @@ import useHeading from './use-heading';
 import useHeadingLevelInSpotlightCard from './use-heading-level-in-spotlight-card';
 import useHrefInLinkItem from './use-href-in-link-item';
 import useLatestXcssSyntax from './use-latest-xcss-syntax';
+import useLatestXcssSyntaxTypography from './use-latest-xcss-syntax-typography';
 import useMenuSectionTitle from './use-menu-section-title';
 import usePopupLabel from './use-popup-label';
 import usePrimitives from './use-primitives';
@@ -75,6 +76,7 @@ export default {
   'use-heading-level-in-spotlight-card': useHeadingLevelInSpotlightCard,
   'use-href-in-link-item': useHrefInLinkItem,
   'use-latest-xcss-syntax': useLatestXcssSyntax,
+  'use-latest-xcss-syntax-typography': useLatestXcssSyntaxTypography,
   'use-menu-section-title': useMenuSectionTitle,
   'use-popup-label': usePopupLabel,
   'use-primitives': usePrimitives,

package/dist/es2019/rules/use-latest-xcss-syntax-typography/index.js

@@ -0,0 +1,30 @@
+import { createLintRule } from '../utils/create-rule';
+import { BannedProperty } from './linters';
+export const error = `Don't set fontSize, lineHeight, fontWeight properties on xcss. They are unsafe as they allow invalid combinations of typography tokens. There is ongoing work to make this a TypeScript error. Once that happens, you will have to delete/refactor anyway.`;
+const rule = createLintRule({
+  meta: {
+    name: 'use-latest-xcss-syntax-typography',
+    type: 'problem',
+    fixable: 'code',
+    hasSuggestions: false,
+    docs: {
+      description: 'Prohibits use of unsafe styling properties in xcss. Please use Text/Heading primitives instead.',
+      recommended: true,
+      severity: 'warn'
+    },
+    messages: {
+      noUnsafeTypographyProperties: error
+    }
+  },
+  create(context) {
+    return {
+      'CallExpression[callee.name="xcss"] ObjectExpression > Property > Identifier[name=/(fontSize|lineHeight|fontWeight)/]': node => BannedProperty.lint(node, {
+        context
+      }),
+      'CallExpression[callee.name="xcss"] ObjectExpression > Property > Literal[value=/(fontSize|lineHeight|fontWeight)/]': node => BannedProperty.lint(node, {
+        context
+      })
+    };
+  }
+});
+export default rule;

package/dist/es2019/rules/use-latest-xcss-syntax-typography/linters/banned-property/index.js

@@ -0,0 +1,13 @@
+/* eslint-disable @repo/internal/react/require-jsdoc */
+
+const messageId = 'noUnsafeTypographyProperties';
+export const BannedProperty = {
+  lint(node, {
+    context
+  }) {
+    context.report({
+      node,
+      messageId
+    });
+  }
+};

package/dist/es2019/rules/use-latest-xcss-syntax-typography/linters/index.js

@@ -0,0 +1 @@
+export { BannedProperty } from './banned-property';

package/dist/esm/ast-nodes/object-entry.js

@@ -60,7 +60,8 @@ export var ObjectEntry = {
       return undefined;
     }
     if (isNodeOfType(node.key, 'Literal')) {
-      return node.key.raw;
+      var _node$key$value;
+      return (_node$key$value = node.key.value) === null || _node$key$value === void 0 ? void 0 : _node$key$value.toString();
     }
     if (isNodeOfType(node.key, 'Identifier')) {
       return node.key.name;

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::837556032f39113ae86785a120bb9ccb>>
+ * @codegen <<SignedSource::9bb5329713677543f16019954484ae2f>>
  * @codegenCommand yarn workspace @atlaskit/eslint-plugin-design-system codegen
  */
 export default {
@@ -38,6 +38,7 @@ export default {
     '@atlaskit/design-system/use-heading-level-in-spotlight-card': 'warn',
     '@atlaskit/design-system/use-href-in-link-item': 'warn',
     '@atlaskit/design-system/use-latest-xcss-syntax': 'error',
+    '@atlaskit/design-system/use-latest-xcss-syntax-typography': 'warn',
     '@atlaskit/design-system/use-menu-section-title': 'warn',
     '@atlaskit/design-system/use-popup-label': 'warn',
     '@atlaskit/design-system/use-primitives': 'warn',

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

@@ -1,6 +1,6 @@
 /**
  * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::b7ed527a03208f0bc68f9d34e4ef2260>>
+ * @codegen <<SignedSource::76bee1648b1b78d3ad253f0704a9cac7>>
  * @codegenCommand yarn workspace @atlaskit/eslint-plugin-design-system codegen
  */
 export default {
@@ -28,6 +28,7 @@ export default {
     '@atlaskit/design-system/use-heading-level-in-spotlight-card': 'warn',
     '@atlaskit/design-system/use-href-in-link-item': 'warn',
     '@atlaskit/design-system/use-latest-xcss-syntax': 'error',
+    '@atlaskit/design-system/use-latest-xcss-syntax-typography': 'warn',
     '@atlaskit/design-system/use-menu-section-title': 'warn',
     '@atlaskit/design-system/use-popup-label': 'warn',
     '@atlaskit/design-system/use-visually-hidden': 'error'

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::287628b11d396c2bcbcf6f4a175a3d3a>>
+ * @codegen <<SignedSource::b359d356c482db0087ddfce5bd105403>>
  * @codegenCommand yarn workspace @atlaskit/eslint-plugin-design-system codegen
  */
 import consistentCssPropUsage from './consistent-css-prop-usage';
@@ -35,6 +35,7 @@ import useHeading from './use-heading';
 import useHeadingLevelInSpotlightCard from './use-heading-level-in-spotlight-card';
 import useHrefInLinkItem from './use-href-in-link-item';
 import useLatestXcssSyntax from './use-latest-xcss-syntax';
+import useLatestXcssSyntaxTypography from './use-latest-xcss-syntax-typography';
 import useMenuSectionTitle from './use-menu-section-title';
 import usePopupLabel from './use-popup-label';
 import usePrimitives from './use-primitives';
@@ -75,6 +76,7 @@ export default {
   'use-heading-level-in-spotlight-card': useHeadingLevelInSpotlightCard,
   'use-href-in-link-item': useHrefInLinkItem,
   'use-latest-xcss-syntax': useLatestXcssSyntax,
+  'use-latest-xcss-syntax-typography': useLatestXcssSyntaxTypography,
   'use-menu-section-title': useMenuSectionTitle,
   'use-popup-label': usePopupLabel,
   'use-primitives': usePrimitives,

package/dist/esm/rules/use-latest-xcss-syntax-typography/index.js

@@ -0,0 +1,34 @@
+import { createLintRule } from '../utils/create-rule';
+import { BannedProperty } from './linters';
+export var error = "Don't set fontSize, lineHeight, fontWeight properties on xcss. They are unsafe as they allow invalid combinations of typography tokens. There is ongoing work to make this a TypeScript error. Once that happens, you will have to delete/refactor anyway.";
+var rule = createLintRule({
+  meta: {
+    name: 'use-latest-xcss-syntax-typography',
+    type: 'problem',
+    fixable: 'code',
+    hasSuggestions: false,
+    docs: {
+      description: 'Prohibits use of unsafe styling properties in xcss. Please use Text/Heading primitives instead.',
+      recommended: true,
+      severity: 'warn'
+    },
+    messages: {
+      noUnsafeTypographyProperties: error
+    }
+  },
+  create: function create(context) {
+    return {
+      'CallExpression[callee.name="xcss"] ObjectExpression > Property > Identifier[name=/(fontSize|lineHeight|fontWeight)/]': function CallExpressionCalleeNameXcssObjectExpressionPropertyIdentifierNameFontSizeLineHeightFontWeight(node) {
+        return BannedProperty.lint(node, {
+          context: context
+        });
+      },
+      'CallExpression[callee.name="xcss"] ObjectExpression > Property > Literal[value=/(fontSize|lineHeight|fontWeight)/]': function CallExpressionCalleeNameXcssObjectExpressionPropertyLiteralValueFontSizeLineHeightFontWeight(node) {
+        return BannedProperty.lint(node, {
+          context: context
+        });
+      }
+    };
+  }
+});
+export default rule;

package/dist/esm/rules/use-latest-xcss-syntax-typography/linters/banned-property/index.js

@@ -0,0 +1,12 @@
+/* eslint-disable @repo/internal/react/require-jsdoc */
+
+var messageId = 'noUnsafeTypographyProperties';
+export var BannedProperty = {
+  lint: function lint(node, _ref) {
+    var context = _ref.context;
+    context.report({
+      node: node,
+      messageId: messageId
+    });
+  }
+};

package/dist/esm/rules/use-latest-xcss-syntax-typography/linters/index.js

@@ -0,0 +1 @@
+export { BannedProperty } from './banned-property';

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

@@ -35,6 +35,7 @@ export declare const configs: {
             '@atlaskit/design-system/use-heading-level-in-spotlight-card': string;
             '@atlaskit/design-system/use-href-in-link-item': string;
             '@atlaskit/design-system/use-latest-xcss-syntax': string;
+            '@atlaskit/design-system/use-latest-xcss-syntax-typography': string;
             '@atlaskit/design-system/use-menu-section-title': string;
             '@atlaskit/design-system/use-popup-label': string;
             '@atlaskit/design-system/use-primitives': string;
@@ -69,6 +70,7 @@ export declare const configs: {
             '@atlaskit/design-system/use-heading-level-in-spotlight-card': string;
             '@atlaskit/design-system/use-href-in-link-item': string;
             '@atlaskit/design-system/use-latest-xcss-syntax': string;
+            '@atlaskit/design-system/use-latest-xcss-syntax-typography': string;
             '@atlaskit/design-system/use-menu-section-title': string;
             '@atlaskit/design-system/use-popup-label': string;
             '@atlaskit/design-system/use-visually-hidden': string;

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

@@ -1,6 +1,6 @@
 /**
  * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::837556032f39113ae86785a120bb9ccb>>
+ * @codegen <<SignedSource::9bb5329713677543f16019954484ae2f>>
  * @codegenCommand yarn workspace @atlaskit/eslint-plugin-design-system codegen
  */
 declare const _default: {
@@ -38,6 +38,7 @@ declare const _default: {
         '@atlaskit/design-system/use-heading-level-in-spotlight-card': string;
         '@atlaskit/design-system/use-href-in-link-item': string;
         '@atlaskit/design-system/use-latest-xcss-syntax': string;
+        '@atlaskit/design-system/use-latest-xcss-syntax-typography': string;
         '@atlaskit/design-system/use-menu-section-title': string;
         '@atlaskit/design-system/use-popup-label': string;
         '@atlaskit/design-system/use-primitives': string;

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

@@ -1,6 +1,6 @@
 /**
  * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::b7ed527a03208f0bc68f9d34e4ef2260>>
+ * @codegen <<SignedSource::76bee1648b1b78d3ad253f0704a9cac7>>
  * @codegenCommand yarn workspace @atlaskit/eslint-plugin-design-system codegen
  */
 declare const _default: {
@@ -28,6 +28,7 @@ declare const _default: {
         '@atlaskit/design-system/use-heading-level-in-spotlight-card': string;
         '@atlaskit/design-system/use-href-in-link-item': string;
         '@atlaskit/design-system/use-latest-xcss-syntax': string;
+        '@atlaskit/design-system/use-latest-xcss-syntax-typography': string;
         '@atlaskit/design-system/use-menu-section-title': string;
         '@atlaskit/design-system/use-popup-label': string;
         '@atlaskit/design-system/use-visually-hidden': string;

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

@@ -35,6 +35,7 @@ declare const _default: {
     'use-heading-level-in-spotlight-card': import("eslint").Rule.RuleModule;
     'use-href-in-link-item': import("eslint").Rule.RuleModule;
     'use-latest-xcss-syntax': import("eslint").Rule.RuleModule;
+    'use-latest-xcss-syntax-typography': import("eslint").Rule.RuleModule;
     'use-menu-section-title': import("eslint").Rule.RuleModule;
     'use-popup-label': import("eslint").Rule.RuleModule;
     'use-primitives': import("eslint").Rule.RuleModule;

package/dist/types/rules/use-latest-xcss-syntax-typography/index.d.ts

@@ -0,0 +1,4 @@
+import type { Rule } from 'eslint';
+export declare const error = "Don't set fontSize, lineHeight, fontWeight properties on xcss. They are unsafe as they allow invalid combinations of typography tokens. There is ongoing work to make this a TypeScript error. Once that happens, you will have to delete/refactor anyway.";
+declare const rule: Rule.RuleModule;
+export default rule;

package/dist/types/rules/use-latest-xcss-syntax-typography/linters/banned-property/index.d.ts

@@ -0,0 +1,6 @@
+import type { Rule } from 'eslint';
+export declare const BannedProperty: {
+    lint(node: Rule.Node, { context }: {
+        context: Rule.RuleContext;
+    }): void;
+};

package/dist/types/rules/use-latest-xcss-syntax-typography/linters/index.d.ts

@@ -0,0 +1 @@
+export { BannedProperty } from './banned-property';

package/dist/types-ts4.5/index.codegen.d.ts

@@ -35,6 +35,7 @@ export declare const configs: {
             '@atlaskit/design-system/use-heading-level-in-spotlight-card': string;
             '@atlaskit/design-system/use-href-in-link-item': string;
             '@atlaskit/design-system/use-latest-xcss-syntax': string;
+            '@atlaskit/design-system/use-latest-xcss-syntax-typography': string;
             '@atlaskit/design-system/use-menu-section-title': string;
             '@atlaskit/design-system/use-popup-label': string;
             '@atlaskit/design-system/use-primitives': string;
@@ -69,6 +70,7 @@ export declare const configs: {
             '@atlaskit/design-system/use-heading-level-in-spotlight-card': string;
             '@atlaskit/design-system/use-href-in-link-item': string;
             '@atlaskit/design-system/use-latest-xcss-syntax': string;
+            '@atlaskit/design-system/use-latest-xcss-syntax-typography': string;
             '@atlaskit/design-system/use-menu-section-title': string;
             '@atlaskit/design-system/use-popup-label': string;
             '@atlaskit/design-system/use-visually-hidden': string;

package/dist/types-ts4.5/presets/all.codegen.d.ts

@@ -1,6 +1,6 @@
 /**
  * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::837556032f39113ae86785a120bb9ccb>>
+ * @codegen <<SignedSource::9bb5329713677543f16019954484ae2f>>
  * @codegenCommand yarn workspace @atlaskit/eslint-plugin-design-system codegen
  */
 declare const _default: {
@@ -38,6 +38,7 @@ declare const _default: {
         '@atlaskit/design-system/use-heading-level-in-spotlight-card': string;
         '@atlaskit/design-system/use-href-in-link-item': string;
         '@atlaskit/design-system/use-latest-xcss-syntax': string;
+        '@atlaskit/design-system/use-latest-xcss-syntax-typography': string;
         '@atlaskit/design-system/use-menu-section-title': string;
         '@atlaskit/design-system/use-popup-label': string;
         '@atlaskit/design-system/use-primitives': string;

package/dist/types-ts4.5/presets/recommended.codegen.d.ts

@@ -1,6 +1,6 @@
 /**
  * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::b7ed527a03208f0bc68f9d34e4ef2260>>
+ * @codegen <<SignedSource::76bee1648b1b78d3ad253f0704a9cac7>>
  * @codegenCommand yarn workspace @atlaskit/eslint-plugin-design-system codegen
  */
 declare const _default: {
@@ -28,6 +28,7 @@ declare const _default: {
         '@atlaskit/design-system/use-heading-level-in-spotlight-card': string;
         '@atlaskit/design-system/use-href-in-link-item': string;
         '@atlaskit/design-system/use-latest-xcss-syntax': string;
+        '@atlaskit/design-system/use-latest-xcss-syntax-typography': string;
         '@atlaskit/design-system/use-menu-section-title': string;
         '@atlaskit/design-system/use-popup-label': string;
         '@atlaskit/design-system/use-visually-hidden': string;

package/dist/types-ts4.5/rules/index.codegen.d.ts

@@ -39,6 +39,7 @@ declare const _default: {
     'use-heading-level-in-spotlight-card': import("eslint").Rule.RuleModule;
     'use-href-in-link-item': import("eslint").Rule.RuleModule;
     'use-latest-xcss-syntax': import("eslint").Rule.RuleModule;
+    'use-latest-xcss-syntax-typography': import("eslint").Rule.RuleModule;
     'use-menu-section-title': import("eslint").Rule.RuleModule;
     'use-popup-label': import("eslint").Rule.RuleModule;
     'use-primitives': import("eslint").Rule.RuleModule;

package/dist/types-ts4.5/rules/use-latest-xcss-syntax-typography/index.d.ts

@@ -0,0 +1,4 @@
+import type { Rule } from 'eslint';
+export declare const error = "Don't set fontSize, lineHeight, fontWeight properties on xcss. They are unsafe as they allow invalid combinations of typography tokens. There is ongoing work to make this a TypeScript error. Once that happens, you will have to delete/refactor anyway.";
+declare const rule: Rule.RuleModule;
+export default rule;

package/dist/types-ts4.5/rules/use-latest-xcss-syntax-typography/linters/banned-property/index.d.ts

@@ -0,0 +1,6 @@
+import type { Rule } from 'eslint';
+export declare const BannedProperty: {
+    lint(node: Rule.Node, { context }: {
+        context: Rule.RuleContext;
+    }): void;
+};

package/dist/types-ts4.5/rules/use-latest-xcss-syntax-typography/linters/index.d.ts

@@ -0,0 +1 @@
+export { BannedProperty } from './banned-property';

package/package.json

@@ -1,7 +1,7 @@
 {
 	"name": "@atlaskit/eslint-plugin-design-system",
 	"description": "The essential plugin for use with the Atlassian Design System.",
-	"version": "10.8.0",
+	"version": "10.8.1",
 	"author": "Atlassian Pty Ltd",
 	"license": "Apache-2.0",
 	"publishConfig": {
@@ -55,7 +55,7 @@
 	"devDependencies": {
 		"@af/formatting": "*",
 		"@atlaskit/ds-lib": "^2.3.0",
-		"@atlaskit/theme": "^12.10.0",
+		"@atlaskit/theme": "^12.11.0",
 		"@atlassian/codegen": "*",
 		"@atlassian/eslint-utils": "^0.5.0",
 		"@emotion/react": "^11.7.1",