10.23.0 • Published 6 months ago

@atlaskit/eslint-plugin-design-system v10.23.0

Weekly downloads
-
License
Apache-2.0
Repository
bitbucket
Last release
6 months ago

Design System ESLint Plugin

This plugin contains rules that should be used when working with the Atlassian Design System.

Installation

yarn add @atlaskit/eslint-plugin-design-system -D

Configuration

Use the recommended config to get reasonable defaults recommended by the Atlassian Design System:

module.exports = {
  extends: [
+    'plugin:@atlaskit/design-system/recommended',
  ],
};

We don't recommended maintaining your own configuration. If you do not use our config you will need to specify individual rules and configuration. Add the plugin to your .eslintrc.js file.

module.exports = {
  plugins: [
+    '@atlaskit/design-system',
  ],
};

Enable the rules that you would like to use.

module.exports = {
  rules: [
+    '@atlaskit/design-system/no-deprecated-apis': 'error',
  ],
};

Rules

RuleDescriptionRecommendedFixableSuggestions
consistent-css-prop-usageEnsures consistency with css and xcss prop usagesYesYes
ensure-design-token-usageEnforces usage of design tokens rather than hard-coded values.YesYesYes
ensure-design-token-usage/previewEnforces usage of pre-release design tokens rather than hard-coded values.YesYes
ensure-icon-colorEnforces that upcoming icon components have a color prop set, to enable a migration of the default value.
icon-labelEnforces accessible usage of icon labels when composed with Atlassian Design System components.YesYes
no-banned-importsDisallow importing banned modules.Yes
no-css-tagged-template-expressionDisallows any css tagged template expressions that originate from Emotion, Styled Components or CompiledYes
no-custom-iconsEnforces custom glyph icons are used.
no-dark-theme-vr-testsDisallow using dark colorScheme in VR tests.Yes
no-deprecated-apisDisallow using deprecated APIs.Yes
no-deprecated-design-token-usageDisallow using deprecated design tokens.YesYes
no-deprecated-importsDisallow importing deprecated modules.Yes
no-direct-use-of-web-platform-drag-and-dropDisallow using direct use of native drag and drop (please use Pragmatic drag and drop)Yes
no-empty-styled-expressionForbids any styled expression to be used when passing empty arguments to styled.div() (or other JSX elements).
no-exported-cssForbid exporting css function calls. Exporting css function calls can result in unexpected behaviour at runtime, and is not statically analysable.
no-exported-keyframesForbid exporting keyframes function calls. Exporting css function calls can result in unexpected behaviour at runtime, and is not statically analysable.
no-html-anchorDiscourage direct usage of HTML anchor elements in favor of Atlassian Design System link components.YesYes
no-html-buttonDiscourage direct usage of HTML button elements in favor of Atlassian Design System button components.Yes
no-invalid-css-mapChecks the validity of a CSS map created through cssMap. This is intended to be used alongside TypeScript's type-checking.Yes
no-keyframes-tagged-template-expressionDisallows any keyframe tagged template expressions that originate from Emotion, Styled Components or CompiledYes
no-legacy-iconsEnforces no legacy icons are used.YesYes
no-marginDisallow using the margin CSS property.
no-nested-stylesDisallows use of nested styles in css functions.Yes
no-physical-propertiesDisallow physical properties and values in css function calls.Yes
no-separator-with-list-elementsWarn when the separator prop is used with as="li", as="ol", or as="dl" in the Inline component.Yes
no-styled-tagged-template-expressionDisallows any styled tagged template expressions that originate from Emotion, Styled Components or CompiledYes
no-unsafe-design-token-usageEnforces design token usage is statically and locally analyzable.YesYes
no-unsafe-style-overridesDiscourage usage of unsafe style overrides used against the Atlassian Design System.Yes
no-unsupported-drag-and-drop-librariesDisallow importing unsupported drag and drop modules.Yes
prefer-primitivesIncrease awareness of primitive components via code hints. Strictly used for education purposes and discoverability. To enforce usage please refer to the use-primitives rule.
use-button-group-labelEnsures button groups are described to assistive technology by a direct label or by another element.YesYes
use-drawer-labelEncourages to provide accessible name for Atlassian Design System Drawer component.YesYes
use-headingEncourage the usage of heading components.YesYes
use-heading-level-in-spotlight-cardInform developers of eventual requirement of headingLevel prop in SpotlightCard component. The heading level should be the appropriate level according to the surrounding context.YesYes
use-href-in-link-itemInform 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.YesYesYes
use-latest-xcss-syntaxEnforces usage of space design tokens rather than hard-coded values in xcss.YesYes
use-latest-xcss-syntax-typographyProhibits use of unsafe styling properties in xcss. Please use Text/Heading primitives instead.YesYes
use-menu-section-titleEncourages makers to provide accessible title for Atlassian Design System Menu Section component.YesYes
use-popup-labelEncourages to provide accessible name for Atlassian Design System Popup component.YesYes
use-primitivesEncourage the usage of primitives components.YesYes
use-primitives-textEncourage the usage of text components.YesYes
use-tag-group-labelEnsures tag groups are described to assistive technology by a direct label or by another element.YesYes
use-tokens-spaceEnforces usage of space design tokens rather than hard-coded values.YesYes
use-tokens-typographyEnforces usage of design tokens for typography properties rather than hard-coded values.YesYes
use-visually-hiddenEnforce usage of the visually hidden component.YesYes
@atlaskit/eslint-utils@atlaskit/icon@atlaskit/tokens@babel/runtime@typescript-eslint/utilsajveslint-codemod-utilsesqueryestraverselodashsemver
@atlaskit/eslint-plugin-ui-styling-standard@atlassian-partner-engineering/eslint-config
10.22.1

6 months ago

10.23.0

6 months ago

10.22.0

7 months ago

10.19.0

7 months ago

10.20.0

7 months ago

10.17.3

8 months ago

10.17.1

8 months ago

10.17.2

8 months ago

10.21.0

7 months ago

10.18.2

8 months ago

10.18.0

8 months ago

10.18.1

8 months ago

10.8.0

10 months ago

10.8.1

10 months ago

10.8.2

10 months ago

10.15.0

9 months ago

10.7.0

11 months ago

10.7.1

10 months ago

10.7.2

10 months ago

10.16.0

8 months ago

10.13.0

9 months ago

10.9.0

10 months ago

10.14.0

9 months ago

10.4.1

11 months ago

10.4.2

11 months ago

10.4.3

11 months ago

10.4.4

11 months ago

10.4.5

11 months ago

10.4.0

11 months ago

10.11.1

9 months ago

10.11.2

9 months ago

10.11.0

9 months ago

10.3.0

11 months ago

10.3.1

11 months ago

10.12.4

9 months ago

10.12.5

9 months ago

10.12.2

9 months ago

10.12.3

9 months ago

10.12.0

9 months ago

10.12.1

9 months ago

10.6.0

11 months ago

10.6.1

11 months ago

10.17.0

8 months ago

10.5.0

11 months ago

10.10.2

9 months ago

10.10.0

10 months ago

10.10.1

10 months ago

10.2.1

11 months ago

10.2.0

11 months ago

10.1.0

12 months ago

10.0.1

12 months ago

10.0.0

12 months ago

9.7.0

12 months ago

9.6.0

12 months ago

9.5.2

12 months ago

9.5.1

1 year ago

9.5.0

1 year ago

9.4.1

1 year ago

9.4.0

1 year ago

9.3.1

1 year ago

9.3.0

1 year ago

9.2.5

1 year ago

9.2.4

1 year ago

9.2.3

1 year ago

9.2.2

1 year ago

9.2.1

1 year ago

9.1.0

1 year ago

9.2.0

1 year ago

9.0.0

1 year ago

8.38.0

1 year ago

8.37.3

1 year ago

8.37.2

1 year ago

8.37.1

1 year ago

8.36.2

1 year ago

8.36.3

1 year ago

8.37.0

1 year ago

8.36.1

1 year ago

8.36.0

1 year ago

8.34.0

1 year ago

8.33.0

1 year ago

8.32.2

1 year ago

8.32.1

1 year ago

8.32.0

1 year ago

8.30.0

1 year ago

8.31.0

1 year ago

8.29.1

1 year ago

8.28.0

1 year ago

8.29.0

1 year ago

8.27.0

1 year ago

8.26.0

1 year ago

8.25.2

1 year ago

8.25.1

1 year ago

8.24.0

1 year ago

8.25.0

1 year ago

8.23.4

1 year ago

8.23.3

1 year ago

8.23.2

1 year ago

8.23.0

1 year ago

8.23.1

1 year ago

8.22.0

1 year ago

8.20.0

1 year ago

8.21.0

1 year ago

8.19.2

1 year ago

8.19.1

1 year ago

8.19.0

1 year ago

8.18.0

1 year ago

8.18.1

1 year ago

8.17.0

1 year ago

8.15.5

1 year ago

8.16.0

1 year ago

8.15.4

1 year ago

8.15.3

1 year ago

8.15.2

1 year ago

8.15.1

1 year ago

8.15.0

1 year ago

8.14.0

1 year ago

8.14.1

1 year ago

8.11.0

2 years ago

8.2.2

2 years ago

8.6.0

2 years ago

8.1.0

2 years ago

8.12.0

2 years ago

8.12.1

2 years ago

8.7.1

2 years ago

8.7.0

2 years ago

7.0.0

2 years ago

7.0.3

2 years ago

7.0.2

2 years ago

7.0.1

2 years ago

8.2.1

2 years ago

8.2.0

2 years ago

8.13.1

2 years ago

8.13.0

2 years ago

8.8.1

2 years ago

8.4.5

2 years ago

8.8.0

2 years ago

8.4.4

2 years ago

8.4.1

2 years ago

8.4.0

2 years ago

8.4.3

2 years ago

8.4.2

2 years ago

8.3.0

2 years ago

8.10.0

2 years ago

8.10.1

2 years ago

8.9.0

2 years ago

8.5.0

2 years ago

8.0.1

2 years ago

8.0.0

2 years ago

8.0.2

2 years ago

6.2.1

2 years ago

5.5.0

2 years ago

6.1.0

2 years ago

5.4.2

2 years ago

5.4.1

2 years ago

5.4.0

2 years ago

6.0.1

2 years ago

6.0.0

2 years ago

6.2.0

2 years ago

5.3.2

2 years ago

5.3.1

2 years ago

5.3.0

2 years ago

5.1.0

2 years ago

4.19.0

2 years ago

4.19.1

2 years ago

5.0.3

2 years ago

5.2.0

2 years ago

5.0.2

2 years ago

5.0.1

2 years ago

5.0.0

2 years ago

4.20.0

2 years ago

4.16.3

2 years ago

4.16.4

2 years ago

4.16.5

2 years ago

4.16.0

2 years ago

4.16.1

2 years ago

4.18.0

2 years ago

4.16.2

2 years ago

4.15.4

2 years ago

4.15.5

2 years ago

4.15.6

2 years ago

4.15.0

2 years ago

4.15.1

2 years ago

4.17.0

2 years ago

4.15.2

2 years ago

4.17.1

2 years ago

4.15.3

2 years ago

4.14.1

2 years ago

4.14.0

2 years ago

4.13.10

2 years ago

4.13.9

2 years ago

4.12.3

2 years ago

4.12.4

2 years ago

4.12.0

3 years ago

4.12.1

3 years ago

4.12.2

2 years ago

4.13.6

2 years ago

4.13.7

2 years ago

4.13.8

2 years ago

4.13.2

2 years ago

4.13.3

2 years ago

4.13.4

2 years ago

4.13.5

2 years ago

4.13.0

2 years ago

4.11.2

3 years ago

4.13.1

2 years ago

4.11.1

3 years ago

4.9.0

3 years ago

4.8.1

3 years ago

4.8.0

3 years ago

4.8.2

3 years ago

4.11.0

3 years ago

4.10.1

3 years ago

4.10.0

3 years ago

4.7.2

3 years ago

4.7.1

3 years ago

4.5.0

3 years ago

4.7.0

3 years ago

4.6.0

3 years ago

4.4.5

3 years ago

4.4.4

3 years ago

4.4.6

3 years ago

4.4.3

3 years ago

4.4.1

3 years ago

4.4.0

3 years ago

4.4.2

3 years ago

4.3.0

3 years ago

4.2.1

3 years ago

4.1.0

3 years ago

4.0.1

3 years ago

4.2.0

3 years ago

4.1.1

3 years ago

3.2.0

3 years ago

4.0.0

3 years ago

3.1.0

3 years ago

3.0.0

3 years ago

2.0.1

4 years ago

2.0.0

4 years ago

1.1.0

4 years ago

1.0.0

4 years ago

0.0.6

4 years ago

0.0.5

4 years ago

0.0.3

4 years ago

0.0.4

4 years ago

0.0.2

4 years ago