@atlaskit/ds-explorations 4.0.0 → 4.0.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (35) hide show
  1. package/CHANGELOG.md +365 -361
  2. package/README.md +4 -3
  3. package/afm-jira/tsconfig.json +24 -0
  4. package/dist/cjs/components/interaction-surface.partial.js +1 -1
  5. package/dist/cjs/internal/color-map.js +1 -1
  6. package/dist/es2019/components/interaction-surface.partial.js +1 -1
  7. package/dist/es2019/internal/color-map.js +1 -1
  8. package/dist/esm/components/interaction-surface.partial.js +1 -1
  9. package/dist/esm/internal/color-map.js +1 -1
  10. package/dist/types/components/interaction-surface.partial.d.ts +1 -1
  11. package/dist/types/internal/color-map.d.ts +1 -1
  12. package/dist/types-ts4.5/components/interaction-surface.partial.d.ts +1 -1
  13. package/dist/types-ts4.5/internal/color-map.d.ts +1 -1
  14. package/docs/01-basic.tsx +11 -13
  15. package/examples/99-interactions.tsx +173 -172
  16. package/package.json +3 -5
  17. package/report.api.md +127 -126
  18. package/scripts/__tests__/__snapshots__/codegen.test.tsx.snap +540 -540
  19. package/scripts/__tests__/codegen.test.tsx +15 -17
  20. package/scripts/codegen-styles.tsx +22 -27
  21. package/scripts/color-codegen-template.tsx +69 -82
  22. package/scripts/color-map-template.tsx +24 -29
  23. package/scripts/dimension-codegen-template.tsx +32 -35
  24. package/scripts/interaction-codegen.tsx +61 -74
  25. package/scripts/misc-codegen-template.tsx +23 -25
  26. package/scripts/utils.tsx +30 -34
  27. package/src/components/__tests__/unit/interaction-suface.test.tsx +60 -60
  28. package/src/components/interaction-surface.partial.tsx +412 -416
  29. package/src/components/surface-provider.tsx +1 -1
  30. package/src/components/types.tsx +10 -10
  31. package/src/constants.tsx +9 -9
  32. package/src/internal/color-map.tsx +28 -28
  33. package/src/internal/role-to-element.tsx +21 -21
  34. package/tsconfig.app.json +44 -44
  35. package/tsconfig.dev.json +71 -71
package/README.md CHANGED
@@ -1,8 +1,9 @@
1
1
  # Design System Foundations
2
2
 
3
- An experimental private package for exploration and validation of the foundations for the Atlassian Design System.
3
+ An experimental private package for exploration and validation of the foundations for the Atlassian
4
+ Design System.
4
5
 
5
6
  **WARNING!**
6
7
 
7
- This is an internal package with common functionality used in the Atlassian Design System Team.
8
- This package comes with no support and semver guarantees, your app will break if you use this directly!
8
+ This is an internal package with common functionality used in the Atlassian Design System Team. This
9
+ package comes with no support and semver guarantees, your app will break if you use this directly!
package/afm-jira/tsconfig.json ADDED
@@ -0,0 +1,24 @@
1
+ {
2
+ "extends": "../../../../tsconfig.products.json",
3
+ "compilerOptions": {
4
+ "target": "es5",
5
+ "outDir": "../../../../../tsDist/@atlaskit__ds-explorations/app",
6
+ "composite": true,
7
+ "rootDir": "../",
8
+ "baseUrl": "../"
9
+ },
10
+ "include": [
11
+ "../src/**/*.tsx"
12
+ ],
13
+ "exclude": [
14
+ "../src/**/__tests__/*",
15
+ "../src/**/*.test.*",
16
+ "../src/**/test.*",
17
+ "../src/**/examples.*"
18
+ ],
19
+ "references": [
20
+ {
21
+ "path": "../../tokens/afm-jira/tsconfig.json"
22
+ }
23
+ ]
24
+ }
package/dist/cjs/components/interaction-surface.partial.js CHANGED
@@ -53,7 +53,7 @@ var InteractionSurface = function InteractionSurface(_ref) {
53
53
  var _default = exports.default = InteractionSurface;
54
54
  /**
55
55
  * THIS SECTION WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
56
- * @codegen <<SignedSource::700f09143685cc887dba88cc11533b9c>>
56
+ * @codegen <<SignedSource::20a64bcc5ec33a2c6ae1165f4a723310>>
57
57
  * @codegenId interactions
58
58
  * @codegenCommand yarn codegen-styles
59
59
  * @codegenParams ["background"]
package/dist/cjs/internal/color-map.js CHANGED
@@ -9,7 +9,7 @@ exports.default = void 0;
9
9
  *
10
10
  * The color map is used to map a background color token to a matching text color that will meet contrast.
11
11
  *
12
- * @codegen <<SignedSource::4069cec92f6504471d42a7c6cc0f7930>>
12
+ * @codegen <<SignedSource::7d0040ba6b7bc80f7ebca42192d566ab>>
13
13
  * @codegenCommand yarn codegen-styles
14
14
  * @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-light.tsx <<SignedSource::f27d1519d51cc4a85383a00907847774>>
15
15
  */
package/dist/es2019/components/interaction-surface.partial.js CHANGED
@@ -48,7 +48,7 @@ export default InteractionSurface;
48
48
 
49
49
  /**
50
50
  * THIS SECTION WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
51
- * @codegen <<SignedSource::700f09143685cc887dba88cc11533b9c>>
51
+ * @codegen <<SignedSource::20a64bcc5ec33a2c6ae1165f4a723310>>
52
52
  * @codegenId interactions
53
53
  * @codegenCommand yarn codegen-styles
54
54
  * @codegenParams ["background"]
package/dist/es2019/internal/color-map.js CHANGED
@@ -3,7 +3,7 @@
3
3
  *
4
4
  * The color map is used to map a background color token to a matching text color that will meet contrast.
5
5
  *
6
- * @codegen <<SignedSource::4069cec92f6504471d42a7c6cc0f7930>>
6
+ * @codegen <<SignedSource::7d0040ba6b7bc80f7ebca42192d566ab>>
7
7
  * @codegenCommand yarn codegen-styles
8
8
  * @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-light.tsx <<SignedSource::f27d1519d51cc4a85383a00907847774>>
9
9
  */
package/dist/esm/components/interaction-surface.partial.js CHANGED
@@ -47,7 +47,7 @@ export default InteractionSurface;
47
47
 
48
48
  /**
49
49
  * THIS SECTION WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
50
- * @codegen <<SignedSource::700f09143685cc887dba88cc11533b9c>>
50
+ * @codegen <<SignedSource::20a64bcc5ec33a2c6ae1165f4a723310>>
51
51
  * @codegenId interactions
52
52
  * @codegenCommand yarn codegen-styles
53
53
  * @codegenParams ["background"]
package/dist/esm/internal/color-map.js CHANGED
@@ -3,7 +3,7 @@
3
3
  *
4
4
  * The color map is used to map a background color token to a matching text color that will meet contrast.
5
5
  *
6
- * @codegen <<SignedSource::4069cec92f6504471d42a7c6cc0f7930>>
6
+ * @codegen <<SignedSource::7d0040ba6b7bc80f7ebca42192d566ab>>
7
7
  * @codegenCommand yarn codegen-styles
8
8
  * @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-light.tsx <<SignedSource::f27d1519d51cc4a85383a00907847774>>
9
9
  */
package/dist/types/components/interaction-surface.partial.d.ts CHANGED
@@ -18,7 +18,7 @@ interface InteractionSurfaceProps extends BasePrimitiveProps {
18
18
  * </Box>
19
19
  * ```
20
20
  */
21
- declare const InteractionSurface: ({ appearance, children, testId, }: InteractionSurfaceProps) => jsx.JSX.Element;
21
+ declare const InteractionSurface: ({ appearance, children, testId }: InteractionSurfaceProps) => jsx.JSX.Element;
22
22
  export default InteractionSurface;
23
23
  declare const backgroundHoverColorMap: {
24
24
  'accent.lime.subtlest': import("@emotion/react").SerializedStyles;
package/dist/types/internal/color-map.d.ts CHANGED
@@ -3,7 +3,7 @@
3
3
  *
4
4
  * The color map is used to map a background color token to a matching text color that will meet contrast.
5
5
  *
6
- * @codegen <<SignedSource::4069cec92f6504471d42a7c6cc0f7930>>
6
+ * @codegen <<SignedSource::7d0040ba6b7bc80f7ebca42192d566ab>>
7
7
  * @codegenCommand yarn codegen-styles
8
8
  * @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-light.tsx <<SignedSource::f27d1519d51cc4a85383a00907847774>>
9
9
  */
package/dist/types-ts4.5/components/interaction-surface.partial.d.ts CHANGED
@@ -18,7 +18,7 @@ interface InteractionSurfaceProps extends BasePrimitiveProps {
18
18
  * </Box>
19
19
  * ```
20
20
  */
21
- declare const InteractionSurface: ({ appearance, children, testId, }: InteractionSurfaceProps) => jsx.JSX.Element;
21
+ declare const InteractionSurface: ({ appearance, children, testId }: InteractionSurfaceProps) => jsx.JSX.Element;
22
22
  export default InteractionSurface;
23
23
  declare const backgroundHoverColorMap: {
24
24
  'accent.lime.subtlest': import("@emotion/react").SerializedStyles;
package/dist/types-ts4.5/internal/color-map.d.ts CHANGED
@@ -3,7 +3,7 @@
3
3
  *
4
4
  * The color map is used to map a background color token to a matching text color that will meet contrast.
5
5
  *
6
- * @codegen <<SignedSource::4069cec92f6504471d42a7c6cc0f7930>>
6
+ * @codegen <<SignedSource::7d0040ba6b7bc80f7ebca42192d566ab>>
7
7
  * @codegenCommand yarn codegen-styles
8
8
  * @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-light.tsx <<SignedSource::f27d1519d51cc4a85383a00907847774>>
9
9
  */
package/docs/01-basic.tsx CHANGED
@@ -1,20 +1,18 @@
1
1
  import React from 'react';
2
2
 
3
- import {
4
- AtlassianInternalWarning,
5
- DevPreviewWarning,
6
- md,
7
- } from '@atlaskit/docs';
3
+ import { AtlassianInternalWarning, DevPreviewWarning, md } from '@atlaskit/docs';
8
4
  import { token } from '@atlaskit/tokens';
9
5
 
10
6
  export default md`
11
7
  ${(
12
- <>
13
- <div style={{ marginBottom: token('space.100', '8px') }}>
14
- <AtlassianInternalWarning />
15
- </div>
16
- <div style={{ marginTop: token('space.100', '8px') }}>
17
- <DevPreviewWarning />
18
- </div>
19
- </>
8
+ <>
9
+ {/* eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766 */}
10
+ <div style={{ marginBottom: token('space.100', '8px') }}>
11
+ <AtlassianInternalWarning />
12
+ </div>
13
+ {/* eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766 */}
14
+ <div style={{ marginTop: token('space.100', '8px') }}>
15
+ <DevPreviewWarning />
16
+ </div>
17
+ </>
20
18
  )}`;
package/examples/99-interactions.tsx CHANGED
@@ -12,184 +12,185 @@ import { Box, Inline, Stack, Text, xcss } from '@atlaskit/primitives';
12
12
  import Textfield from '@atlaskit/textfield';
13
13
  import { token } from '@atlaskit/tokens';
14
14
 
15
- import {
16
- UNSAFE_InteractionSurface as InteractionSurface,
17
- } from '../src';
15
+ import { UNSAFE_InteractionSurface as InteractionSurface } from '../src';
18
16
 
19
17
  const fieldsetStyles = xcss({
20
- flex: '1 1 100%',
21
- borderStyle: 'solid',
22
- borderWidth: 'border.width',
23
- borderColor: 'color.border',
24
- ':hover': {
25
- backgroundColor: 'color.background.input.hovered',
26
- },
27
- ':invalid': {
28
- borderColor: 'color.border.danger',
29
- },
30
- ':focus': {
31
- backgroundColor: 'color.background.input',
32
- borderColor: 'color.border.focused',
33
- },
34
- ':focus-within': {
35
- backgroundColor: 'color.background.input',
36
- borderColor: 'color.border.focused',
37
- },
18
+ flex: '1 1 100%',
19
+ borderStyle: 'solid',
20
+ borderWidth: 'border.width',
21
+ borderColor: 'color.border',
22
+ ':hover': {
23
+ backgroundColor: 'color.background.input.hovered',
24
+ },
25
+ ':invalid': {
26
+ borderColor: 'color.border.danger',
27
+ },
28
+ ':focus': {
29
+ backgroundColor: 'color.background.input',
30
+ borderColor: 'color.border.focused',
31
+ },
32
+ ':focus-within': {
33
+ backgroundColor: 'color.background.input',
34
+ borderColor: 'color.border.focused',
35
+ },
38
36
  });
39
37
 
40
38
  const focusRingBoxStyles = xcss({
41
- borderRadius: 'border.radius',
42
- position: 'relative',
39
+ borderRadius: 'border.radius',
40
+ position: 'relative',
43
41
  });
44
42
 
45
43
  export default () => {
46
- return (
47
- <Box padding="space.100" testId="all">
48
- <Stack space="space.200">
49
- <Heading level="h400">Current ADS Buttons</Heading>
50
- <Inline space="space.200">
51
- <Button appearance="primary">brand.bold</Button>
52
- <Button appearance="default">neutral</Button>
53
- <Button appearance="warning">warning.bold</Button>
54
- </Inline>
55
- <Heading level="h400">
56
- Buttons with <Code>InteractionSurface</Code>
57
- </Heading>
58
- <Inline space="space.200" testId="buttons">
59
- {(
60
- [
61
- 'color.background.brand.bold',
62
- 'color.background.neutral',
63
- 'color.background.warning.bold',
64
- ] as const
65
- ).map((app) => (
66
- <FocusRing key={app}>
67
- <Box
68
- as="button"
69
- onClick={() => console.log('hello')}
70
- xcss={focusRingBoxStyles}
71
- paddingInline="space.150"
72
- backgroundColor={app}
73
- >
74
- <InteractionSurface>
75
- <Text
76
- align="center"
77
- weight="medium"
78
- >
79
- {app}
80
- </Text>
81
- </InteractionSurface>
82
- </Box>
83
- </FocusRing>
84
- ))}
85
- </Inline>
86
- <Heading level="h400">
87
- Icon Buttons with <Code>InteractionSurface</Code>
88
- </Heading>
89
- <Inline space="space.200" testId="icon-buttons">
90
- <FocusRing>
91
- <Box
92
- as="button"
93
- backgroundColor="color.background.brand.bold"
94
- onClick={() => console.log('hello')}
95
- padding="space.050"
96
- xcss={focusRingBoxStyles}
97
- >
98
- <InteractionSurface>
99
- <WarningIcon
100
- label="icon button"
101
- primaryColor={token('color.icon.inverse')}
102
- secondaryColor={token('color.background.brand.bold')}
103
- />
104
- </InteractionSurface>
105
- </Box>
106
- </FocusRing>
107
- <FocusRing>
108
- <Box
109
- as="button"
110
- backgroundColor="color.background.neutral"
111
- onClick={() => console.log('hello')}
112
- xcss={focusRingBoxStyles}
113
- padding="space.050"
114
- >
115
- <InteractionSurface>
116
- <WarningIcon label="icon button" />
117
- </InteractionSurface>
118
- </Box>
119
- </FocusRing>
120
- <FocusRing>
121
- <Box
122
- as="button"
123
- backgroundColor="color.background.warning.bold"
124
- onClick={() => console.log('hello')}
125
- xcss={focusRingBoxStyles}
126
- padding="space.050"
127
- >
128
- <InteractionSurface>
129
- <WarningIcon
130
- label="icon button"
131
- primaryColor={token('color.icon.warning.inverse')}
132
- secondaryColor={token('color.background.warning.bold')}
133
- />
134
- </InteractionSurface>
135
- </Box>
136
- </FocusRing>
137
- </Inline>
138
- <Heading level="h400">
139
- Progress Indicator with <Code>InteractionSurface</Code>
140
- </Heading>
141
- <Inline space="space.200" testId="progress-indicators">
142
- {(
143
- [
144
- 'color.background.brand.bold',
145
- 'color.background.neutral',
146
- 'color.background.warning.bold',
147
- ] as const
148
- ).map((app) => (
149
- <FocusRing>
150
- <Box
151
- key={app}
152
- as="button"
153
- backgroundColor={app}
154
- onClick={() => console.log('hello')}
155
- xcss={focusRingBoxStyles}
156
- padding="space.050"
157
- aria-label="progress indicator"
158
- >
159
- <InteractionSurface>
160
- <Fragment />
161
- </InteractionSurface>
162
- </Box>
163
- </FocusRing>
164
- ))}
165
- </Inline>
166
- <Heading level="h400">Textfield / input spikes</Heading>
167
- <Stack space="space.200">
168
- <label htmlFor="textfield">Textfield</label>
169
- <Textfield id="textfield" />
170
- <label htmlFor="input">Input</label>
171
- <Box
172
- as="fieldset"
173
- padding="space.100"
174
- tabIndex={-1}
175
- backgroundColor="color.background.input"
176
- xcss={fieldsetStyles}
177
- >
178
- <input
179
- id="input"
180
- pattern="\d+"
181
- style={{
182
- padding: 0,
183
- border: 'none',
184
- fontSize: 14,
185
- background: 'transparent',
186
- appearance: 'none',
187
- outline: 'none',
188
- }}
189
- />
190
- </Box>
191
- </Stack>
192
- </Stack>
193
- </Box>
194
- );
44
+ return (
45
+ <Box padding="space.100" testId="all">
46
+ <Stack space="space.200">
47
+ <Heading level="h400">Current ADS Buttons</Heading>
48
+ <Inline space="space.200">
49
+ <Button appearance="primary">brand.bold</Button>
50
+ <Button appearance="default">neutral</Button>
51
+ <Button appearance="warning">warning.bold</Button>
52
+ </Inline>
53
+ <Heading level="h400">
54
+ Buttons with <Code>InteractionSurface</Code>
55
+ </Heading>
56
+ <Inline space="space.200" testId="buttons">
57
+ {(
58
+ [
59
+ 'color.background.brand.bold',
60
+ 'color.background.neutral',
61
+ 'color.background.warning.bold',
62
+ ] as const
63
+ ).map((app) => (
64
+ <FocusRing key={app}>
65
+ <Box
66
+ as="button"
67
+ onClick={() => console.log('hello')}
68
+ xcss={focusRingBoxStyles}
69
+ paddingInline="space.150"
70
+ backgroundColor={app}
71
+ >
72
+ <InteractionSurface>
73
+ <Text align="center" weight="medium">
74
+ {app}
75
+ </Text>
76
+ </InteractionSurface>
77
+ </Box>
78
+ </FocusRing>
79
+ ))}
80
+ </Inline>
81
+ <Heading level="h400">
82
+ Icon Buttons with <Code>InteractionSurface</Code>
83
+ </Heading>
84
+ <Inline space="space.200" testId="icon-buttons">
85
+ <FocusRing>
86
+ <Box
87
+ as="button"
88
+ backgroundColor="color.background.brand.bold"
89
+ onClick={() => console.log('hello')}
90
+ padding="space.050"
91
+ xcss={focusRingBoxStyles}
92
+ >
93
+ <InteractionSurface>
94
+ <WarningIcon
95
+ label="icon button"
96
+ primaryColor={token('color.icon.inverse')}
97
+ secondaryColor={token('color.background.brand.bold')}
98
+ />
99
+ </InteractionSurface>
100
+ </Box>
101
+ </FocusRing>
102
+ <FocusRing>
103
+ <Box
104
+ as="button"
105
+ backgroundColor="color.background.neutral"
106
+ onClick={() => console.log('hello')}
107
+ xcss={focusRingBoxStyles}
108
+ padding="space.050"
109
+ >
110
+ <InteractionSurface>
111
+ <WarningIcon label="icon button" />
112
+ </InteractionSurface>
113
+ </Box>
114
+ </FocusRing>
115
+ <FocusRing>
116
+ <Box
117
+ as="button"
118
+ backgroundColor="color.background.warning.bold"
119
+ onClick={() => console.log('hello')}
120
+ xcss={focusRingBoxStyles}
121
+ padding="space.050"
122
+ >
123
+ <InteractionSurface>
124
+ <WarningIcon
125
+ label="icon button"
126
+ primaryColor={token('color.icon.warning.inverse')}
127
+ secondaryColor={token('color.background.warning.bold')}
128
+ />
129
+ </InteractionSurface>
130
+ </Box>
131
+ </FocusRing>
132
+ </Inline>
133
+ <Heading level="h400">
134
+ Progress Indicator with <Code>InteractionSurface</Code>
135
+ </Heading>
136
+ <Inline space="space.200" testId="progress-indicators">
137
+ {(
138
+ [
139
+ 'color.background.brand.bold',
140
+ 'color.background.neutral',
141
+ 'color.background.warning.bold',
142
+ ] as const
143
+ ).map((app) => (
144
+ <FocusRing>
145
+ <Box
146
+ key={app}
147
+ as="button"
148
+ backgroundColor={app}
149
+ onClick={() => console.log('hello')}
150
+ xcss={focusRingBoxStyles}
151
+ padding="space.050"
152
+ aria-label="progress indicator"
153
+ >
154
+ <InteractionSurface>
155
+ <Fragment />
156
+ </InteractionSurface>
157
+ </Box>
158
+ </FocusRing>
159
+ ))}
160
+ </Inline>
161
+ <Heading level="h400">Textfield / input spikes</Heading>
162
+ <Stack space="space.200">
163
+ <label htmlFor="textfield">Textfield</label>
164
+ <Textfield id="textfield" />
165
+ <label htmlFor="input">Input</label>
166
+ <Box
167
+ as="fieldset"
168
+ padding="space.100"
169
+ tabIndex={-1}
170
+ backgroundColor="color.background.input"
171
+ xcss={fieldsetStyles}
172
+ >
173
+ <input
174
+ id="input"
175
+ pattern="\d+"
176
+ style={{
177
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
178
+ padding: 0,
179
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
180
+ border: 'none',
181
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
182
+ fontSize: 14,
183
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
184
+ background: 'transparent',
185
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
186
+ appearance: 'none',
187
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
188
+ outline: 'none',
189
+ }}
190
+ />
191
+ </Box>
192
+ </Stack>
193
+ </Stack>
194
+ </Box>
195
+ );
195
196
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/ds-explorations",
3
- "version": "4.0.0",
3
+ "version": "4.0.1",
4
4
  "description": "DEPRECATED. Use @atlaskit/primitives. An experimental package for exploration and validation of spacing / typography foundations.",
5
5
  "publishConfig": {
6
6
  "registry": "https://registry.npmjs.org/"
@@ -26,7 +26,7 @@
26
26
  "prepare": "yarn ak-postbuild"
27
27
  },
28
28
  "dependencies": {
29
- "@atlaskit/tokens": "^1.49.0",
29
+ "@atlaskit/tokens": "^1.50.0",
30
30
  "@babel/runtime": "^7.0.0",
31
31
  "@emotion/react": "^11.7.1"
32
32
  },
@@ -36,10 +36,9 @@
36
36
  "devDependencies": {
37
37
  "@af/formatting": "*",
38
38
  "@atlaskit/ds-lib": "*",
39
- "@atlaskit/primitives": "^6.3.0",
39
+ "@atlaskit/primitives": "^7.0.0",
40
40
  "@atlaskit/textfield": "^6.3.0",
41
41
  "@atlaskit/visual-regression": "*",
42
- "@atlassian/atlassian-frontend-prettier-config-1.0.1": "npm:@atlassian/atlassian-frontend-prettier-config@1.0.1",
43
42
  "@atlassian/codegen": "^0.1.0",
44
43
  "@testing-library/react": "^12.1.5",
45
44
  "fs-extra": "^4.0.2",
@@ -76,6 +75,5 @@
76
75
  "af:exports": {
77
76
  ".": "./src/index.tsx"
78
77
  },
79
- "prettier": "@atlassian/atlassian-frontend-prettier-config-1.0.1",
80
78
  "homepage": "https://atlaskit.atlassian.com"
81
79
  }