@atlaskit/eslint-plugin-design-system 10.9.0 → 10.10.1

package/constellation/use-primitives/usage.mdx

@@ -1,78 +0,0 @@
-# use-primitives
-
-Using primitives allows you to delete bespoke component code and replace it with ready made
-solutions made by the Atlassian Design System Team.
-
-## Examples
-
-This rule marks code as violations when it can be replaced 1:1 with a primitive component.
-
-### Incorrect
-
-```jsx
-const someStyles = css({
-  padding: '8px';
-})
-
-<div css={someStyles}>
-^^^^^^^^^^^^^^^^^^^^^^
-  // ...
-</div>
-```
-
-### Correct
-
-```jsx
-const someStyles = xcss({
-  padding: 'space.100';
-})
-
-<Box xcss={someStyles}>
-  // ...
-</Box>
-```
-
-Currently, the rule is extremely defensive, only reporting on `css` styles that contain:
-
-- one, and only one, style property from this list:
-
-  - padding
-  - paddingBlock
-  - paddingBlockEnd
-  - paddingBlockStart
-  - paddingBottom
-  - paddingInline
-  - paddingInlineEnd
-  - paddingInlineStart
-  - paddingLeft
-  - paddingRight
-  - paddingTop
-  - margin
-  - marginBlock
-  - marginBlockEnd
-  - marginBlockStart
-  - marginBottom
-  - marginInline
-  - marginInlineEnd
-  - marginInlineStart
-  - marginLeft
-  - marginRight
-  - marginTop
-
-- and where the style value is one of:
-  - 0px
-  - 2px
-  - 4px
-  - 6px
-  - 8px
-  - 12px
-  - 16px
-  - 20px
-  - 24px
-  - 32px
-  - 40px
-  - 48px
-  - 64px
-  - 80px
-
-If these conditions are not met, then no violation will be reported.

package/constellation/use-primitives-text/usage.mdx

@@ -1,35 +0,0 @@
-# use-primitives-text
-
-Using primitives allows you to delete bespoke component code and replace it with ready made
-solutions made by the Atlassian Design System Team.
-
-## Examples
-
-This rule marks code as violations when it can be replaced 1:1 with one or multiple primitive
-components.
-
-### Incorrect
-
-```jsx
-<span>text</span>
-^^^^^^
-<p>text</p>
-^^^
-<strong>text</strong>
-^^^^^^^^
-<em>text</em>
-^^^^
-```
-
-### Correct
-
-```jsx
-<Text>text</Text>
-<Text as="p">text</Text>
-<Text as="strong">text</Text>
-<Text as="em">text</Text>
-```
-
-Currently, the rule is extremely defensive, only reporting on `span`, `p`, `strong` and `em`
-elements that don't have any props outside of `key`, `id` and `data-testid`. For `span` elements
-we're only targeting instances that almost certainly only have text as children.

package/constellation/use-tokens-space/usage.mdx

@@ -1,34 +0,0 @@
-# use-tokens-space
-
-## Examples
-
-This rule marks code as violations when a space token should be used. It will auto-fix values that
-can be mapped 1:1 with an ADS space token. Values that can't be mapped to a token will still be
-reported, however no auto-fix will happen.
-
-### Incorrect
-
-```jsx
-const someStyles = css({
-  padding: '8px';
-           ^^^^^
-})
-```
-
-### Correct
-
-```jsx
-import { token } from '@atlaskit/tokens'
-
-const someStyles = css({
-  padding: token('space.100');
-})
-```
-
-See the list of available space tokens on the
-[ADS website](https://atlassian.design/foundations/spacing#space-tokens).
-
-For Atlassians:
-
-- See the [Token Migration Guide](https://go.atlassian.com/space-token-migration) for instructions
-  on how to migrate to tokens when a suggestion is not provided by the ESLint rule.

package/constellation/use-tokens-typography/usage.mdx

@@ -1,55 +0,0 @@
-# use-tokens-typography
-
-Enforces the use of design tokens for typography properties.
-
-Using design tokens results in a harmonious experience for end users whilst providing theming and
-consistency. Typography tokens are strongly recommended to further align our experiences and make
-future changes easier.
-
-Note: This rule is fairly defensive when it comes to replacing values with tokens. It will only run
-over style blocks that contain a fontSize property. It will then attempt to match that font size to
-a token. If multiple matching tokens are found it then tries to match on font weight. If a token can
-be found to match the font size but not font weight, the token is applied and then a font weight
-token override is applied to ensure the tokenised styles match the original. One main exception is
-line height - **this rule will match against tokens that have a different line height**. Letter
-spacing values are also ignored.
-
-## Examples
-
-Using anything other than design tokens such as hardcoded values or legacy theme constants will be
-considered violations.
-
-### Incorrect
-
-```js
-import { fontSize } from '@atlaskit/theme/constants';
-
-css({ fontSize: fontSize() });
-                ^^^^^^^^^^
-
-css({ fontSize: '14px' });
-                ^^^^^^
-
-css({
-  fontSize: '14px',
-            ^^^^^^
-  lineHeight: '20px',
-  fontWeight: 600
-});
-
-```
-
-### Correct
-
-```js
-import { token } from '@atlaskit/tokens';
-
-css({ font: token('font.heading.large') });
-
-css({ font: token('font.body') });
-```
-
-## Options
-
-`shouldEnforceFallbacks`: Set to `false` to ensure token fallback values are not added. Defaults to
-`true`.

package/constellation/use-visually-hidden/usage.mdx

@@ -1,35 +0,0 @@
-# use-visually-hidden
-
-Using the visually hidden component allows you to delete bespoke or legacy theme code and replace it
-with a ready made solution by the Atlassian Design System Team.
-
-## Examples
-
-This rule marks code as violations when it can be replaced 1:1 with the visually hidden component.
-
-### Incorrect
-
-```js
-import { css } from '@emotion/core';
-import { visuallyHidden } from '@atlaskit/theme/constants';
-
-const visuallyHiddenStyles = css({
-  width: '1px',
-  height: '1px',
-  padding: '0',
-  position: 'absolute',
-  border: '0',
-  clip: 'rect(1px, 1px, 1px, 1px)',
-  overflow: 'hidden',
-  whiteSpace: 'nowrap',
-});
-
-const VisuallyHidden = styled.span`${visuallyHidden()}`;
-                                     ^^^^^^^^^^^^^^
-```
-
-### Correct
-
-```js
-import VisuallyHidden from '@atlaskit/visually-hidden';
-```