ESLint plugin
The essential plugin for use with the Atlassian Design System.no-deprecated-design-token-usage
Using deprecated design tokens is dangerous as they will eventually be deleted after the sunset period. This rule helps you move to non-deprecated design tokens.
Examples
This rule will mark usage of deprecated design tokens as violations.
Incorrect
import { token } from '@atlaskit/tokens';
css({ color: token('i.am.deprecated') });
^^^^^^^^^^^^^^^
css({ color: token('i.am.a.token') });
^^^^^^^^^^^^^Options
It's recommended to set this rule to "warn" to allow for new and old tokens to exist side-by-side for the duration of the deprecation period and avoid big-bang migrations.
Once the deprecation period is over for a design token it will be moved into deleted state at
which point the counterpart of this rule no-unsafe-design-token-usage will mark violations as
errors.
Replacement tokens are offered as editor suggestions when present.
Primitive component props
The rule also checks explicit string props on imported @atlaskit/primitives components, including
aliases, namespaces, component subpaths, and /compiled imports. It covers the token-valued spacing
and color props, as well as Text.size, Text.weight, MetricText.size, and Bleed's
positive-to-negative spacing mapping. See
no-unsafe-design-token-usage
for the full prop list and static-analysis limits.
Deprecated tokens produce warnings according to this rule's configured severity. Suggestions
preserve semantic prop values (such as size="small") and are only offered when the replacement is
supported by the prop. Tokens without a replacement, raw CSS replacements, and incompatible token
families are reported without a suggestion.