@atlaskit/primitives 0.9.2 → 0.9.3
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.
- package/CHANGELOG.md +7 -0
- package/dist/cjs/version.json +1 -1
- package/dist/cjs/xcss/style-maps.partial.js +27 -3
- package/dist/cjs/xcss/xcss.js +1 -0
- package/dist/es2019/version.json +1 -1
- package/dist/es2019/xcss/style-maps.partial.js +25 -2
- package/dist/es2019/xcss/xcss.js +2 -1
- package/dist/esm/version.json +1 -1
- package/dist/esm/xcss/style-maps.partial.js +25 -2
- package/dist/esm/xcss/xcss.js +2 -1
- package/dist/types/xcss/style-maps.partial.d.ts +27 -2
- package/dist/types-ts4.5/components/box.d.ts +18 -0
- package/dist/types-ts4.5/components/inline.d.ts +75 -0
- package/dist/types-ts4.5/components/internal/base-box.d.ts +84 -0
- package/dist/types-ts4.5/components/stack.d.ts +61 -0
- package/dist/types-ts4.5/components/types.d.ts +18 -0
- package/dist/types-ts4.5/constants.d.ts +12 -0
- package/dist/types-ts4.5/helpers/responsive/build-media-query-css.d.ts +57 -0
- package/dist/types-ts4.5/helpers/responsive/constants.d.ts +31 -0
- package/dist/types-ts4.5/helpers/responsive/index.d.ts +4 -0
- package/dist/types-ts4.5/helpers/responsive/media-helper.d.ts +45 -0
- package/dist/types-ts4.5/helpers/responsive/types.d.ts +47 -0
- package/dist/types-ts4.5/index.d.ts +4 -0
- package/dist/types-ts4.5/xcss/style-maps.partial.d.ts +474 -0
- package/dist/types-ts4.5/xcss/xcss.d.ts +57 -0
- package/package.json +3 -3
- package/report.api.md +29 -0
- package/scripts/color-codegen-template.tsx +7 -0
- package/tmp/api-report-tmp.d.ts +29 -0
- package/tsconfig.node.json +7 -0
|
@@ -0,0 +1,45 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* This is an object of usable media query helpers using our internal breakpoints configuration.
|
|
3
|
+
*
|
|
4
|
+
* @experimental Unsafe for usage as the API is not finalized.
|
|
5
|
+
*/
|
|
6
|
+
export declare const UNSAFE_media: {
|
|
7
|
+
readonly above: {
|
|
8
|
+
/**
|
|
9
|
+
* `above.xxs` is redundant and no media query should be used, but it's included for programatic purposes…
|
|
10
|
+
*
|
|
11
|
+
* Eg. this is `@media (min-width: 0px)`
|
|
12
|
+
*/
|
|
13
|
+
readonly xxs: `@media (min-width: ${number}px)`;
|
|
14
|
+
readonly xs: `@media (min-width: ${number}px)`;
|
|
15
|
+
readonly sm: `@media (min-width: ${number}px)`;
|
|
16
|
+
readonly md: `@media (min-width: ${number}px)`;
|
|
17
|
+
readonly lg: `@media (min-width: ${number}px)`;
|
|
18
|
+
readonly xl: `@media (min-width: ${number}px)`;
|
|
19
|
+
readonly xxl: `@media (min-width: ${number}px)`;
|
|
20
|
+
};
|
|
21
|
+
readonly below: {
|
|
22
|
+
/**
|
|
23
|
+
* A media query to target viewports below the min width of a given breakpoint.
|
|
24
|
+
* Note that `media.below.xxs` is intentionally omitted as this would be `@media (max-width: 0px)`
|
|
25
|
+
*/
|
|
26
|
+
readonly xs: `@media (max-width: ${number}px)`;
|
|
27
|
+
readonly sm: `@media (max-width: ${number}px)`;
|
|
28
|
+
readonly md: `@media (max-width: ${number}px)`;
|
|
29
|
+
readonly lg: `@media (max-width: ${number}px)`;
|
|
30
|
+
readonly xl: `@media (max-width: ${number}px)`;
|
|
31
|
+
readonly xxl: `@media (max-width: ${number}px)`;
|
|
32
|
+
};
|
|
33
|
+
};
|
|
34
|
+
/**
|
|
35
|
+
* With these types:
|
|
36
|
+
* ```
|
|
37
|
+
* type MediaQuery = `@media (${string})`;
|
|
38
|
+
* type ResponsiveMediaObject = Record<Breakpoint, MediaQuery>;
|
|
39
|
+
* ```
|
|
40
|
+
*
|
|
41
|
+
* TODO: This `media` object as of typescript@4.9, would benefit from satisfies, eg.:
|
|
42
|
+
* ```
|
|
43
|
+
* const UNSAFE_media = { … } satisfies Record<'above' | 'only', ResponsiveMediaObject> & { below: Omit<ResponsiveMediaObject, 'xxs'> }
|
|
44
|
+
* ```
|
|
45
|
+
*/
|
|
@@ -0,0 +1,47 @@
|
|
|
1
|
+
import { SerializedStyles } from '@emotion/react';
|
|
2
|
+
import { token } from '@atlaskit/tokens';
|
|
3
|
+
/**
|
|
4
|
+
* The breakpoints we have for responsiveness.
|
|
5
|
+
*/
|
|
6
|
+
export type Breakpoint = 'xxs' | 'xs' | 'sm' | 'md' | 'lg' | 'xl' | 'xxl';
|
|
7
|
+
/**
|
|
8
|
+
* An object type mapping a value to each breakpoint (optionally)
|
|
9
|
+
*/
|
|
10
|
+
export type ResponsiveObject<T> = Partial<Record<Breakpoint, T>>;
|
|
11
|
+
/**
|
|
12
|
+
* A map of breakpoints to CSS, commonly used to build maps given a responsive object
|
|
13
|
+
* so we can statically compile CSS upfront, but dynamically apply it.
|
|
14
|
+
*
|
|
15
|
+
* @example Here we could conditionally load margins based a `setMarginBreakpoints={['xs', 'md']}` type prop.
|
|
16
|
+
* ```tsx
|
|
17
|
+
* const marginMediaQueries = {
|
|
18
|
+
* xxs: css({ [media.above.xxs]: margin: 0 } }),
|
|
19
|
+
* xs: css({ [media.above.xs]: margin: 4 } }),
|
|
20
|
+
* //…
|
|
21
|
+
* }
|
|
22
|
+
*
|
|
23
|
+
* return <div css={setMarginBreakpoints.map(breakpoint => marginMediaQueries[breakpoint])} />
|
|
24
|
+
* ```
|
|
25
|
+
*/
|
|
26
|
+
export type ResponsiveCSSObject = ResponsiveObject<SerializedStyles>;
|
|
27
|
+
/**
|
|
28
|
+
* Our internal breakpoint config used to build media queries and define attributes for certain components.
|
|
29
|
+
*/
|
|
30
|
+
export type BreakpointConfig = {
|
|
31
|
+
/**
|
|
32
|
+
* The gap between a `GridItem`.
|
|
33
|
+
*/
|
|
34
|
+
gridItemGutter: ReturnType<typeof token>;
|
|
35
|
+
/**
|
|
36
|
+
* The outer whitespace of a `Grid` item.
|
|
37
|
+
*/
|
|
38
|
+
gridMargin: ReturnType<typeof token>;
|
|
39
|
+
/**
|
|
40
|
+
* The min-width used in media queries
|
|
41
|
+
*/
|
|
42
|
+
min: number;
|
|
43
|
+
/**
|
|
44
|
+
* The max-width used in media queries
|
|
45
|
+
*/
|
|
46
|
+
max: number;
|
|
47
|
+
};
|
|
@@ -0,0 +1,474 @@
|
|
|
1
|
+
import { SerializedStyles } from '@emotion/react';
|
|
2
|
+
/**
|
|
3
|
+
* THIS SECTION WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
|
|
4
|
+
* @codegen <<SignedSource::7d4a8604dc454e30c0fec5c1330ea7c5>>
|
|
5
|
+
* @codegenId dimensions
|
|
6
|
+
* @codegenCommand yarn codegen-styles
|
|
7
|
+
* @codegenParams ["dimensions"]
|
|
8
|
+
* @codegenDependency ../../scripts/codegen-file-templates/dimensions.tsx <<SignedSource::dbad5eb9ef292d4ec59f90459a81e1d6>>
|
|
9
|
+
*/
|
|
10
|
+
export declare const dimensionMap: {
|
|
11
|
+
readonly '100%': "100%";
|
|
12
|
+
readonly 'size.100': "16px";
|
|
13
|
+
readonly 'size.200': "24px";
|
|
14
|
+
readonly 'size.300': "32px";
|
|
15
|
+
readonly 'size.400': "40px";
|
|
16
|
+
readonly 'size.500': "48px";
|
|
17
|
+
readonly 'size.600': "96px";
|
|
18
|
+
readonly 'size.1000': "192px";
|
|
19
|
+
};
|
|
20
|
+
type Dimension = keyof typeof dimensionMap;
|
|
21
|
+
export type Width = Dimension;
|
|
22
|
+
export type Height = Dimension;
|
|
23
|
+
export type MinWidth = Dimension;
|
|
24
|
+
export type MaxWidth = Dimension;
|
|
25
|
+
export type MinHeight = Dimension;
|
|
26
|
+
export type MaxHeight = Dimension;
|
|
27
|
+
export type Top = Dimension;
|
|
28
|
+
export type Left = Dimension;
|
|
29
|
+
export type Bottom = Dimension;
|
|
30
|
+
export type Right = Dimension;
|
|
31
|
+
export type BlockSize = Dimension;
|
|
32
|
+
export type InlineSize = Dimension;
|
|
33
|
+
export type MaxBlockSize = Dimension;
|
|
34
|
+
export type MaxInlineSize = Dimension;
|
|
35
|
+
export type MinBlockSize = Dimension;
|
|
36
|
+
export type MinInlineSize = Dimension;
|
|
37
|
+
/**
|
|
38
|
+
* @codegenEnd
|
|
39
|
+
*/
|
|
40
|
+
/**
|
|
41
|
+
* THIS SECTION WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
|
|
42
|
+
* @codegen <<SignedSource::9fbc4dfcd8f43f52bff6b3bb666397fe>>
|
|
43
|
+
* @codegenId spacing
|
|
44
|
+
* @codegenCommand yarn codegen-styles
|
|
45
|
+
* @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-spacing.tsx <<SignedSource::167d3b69b159ae33e74d4ea5ab7eade6>>
|
|
46
|
+
*/
|
|
47
|
+
export declare const spaceMap: {
|
|
48
|
+
'space.0': "var(--ds-space-0)";
|
|
49
|
+
'space.025': "var(--ds-space-025)";
|
|
50
|
+
'space.050': "var(--ds-space-050)";
|
|
51
|
+
'space.075': "var(--ds-space-075)";
|
|
52
|
+
'space.100': "var(--ds-space-100)";
|
|
53
|
+
'space.150': "var(--ds-space-150)";
|
|
54
|
+
'space.200': "var(--ds-space-200)";
|
|
55
|
+
'space.250': "var(--ds-space-250)";
|
|
56
|
+
'space.300': "var(--ds-space-300)";
|
|
57
|
+
'space.400': "var(--ds-space-400)";
|
|
58
|
+
'space.500': "var(--ds-space-500)";
|
|
59
|
+
'space.600': "var(--ds-space-600)";
|
|
60
|
+
'space.800': "var(--ds-space-800)";
|
|
61
|
+
'space.1000': "var(--ds-space-1000)";
|
|
62
|
+
};
|
|
63
|
+
export type Space = keyof typeof spaceMap;
|
|
64
|
+
/**
|
|
65
|
+
* @codegenEnd
|
|
66
|
+
*/
|
|
67
|
+
/**
|
|
68
|
+
* THIS SECTION WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
|
|
69
|
+
* @codegen <<SignedSource::aa1cfa3cd24f141a85ac1e0b70dbd8a8>>
|
|
70
|
+
* @codegenId colors
|
|
71
|
+
* @codegenCommand yarn codegen-styles
|
|
72
|
+
* @codegenParams ["border", "background", "shadow", "text", "fill"]
|
|
73
|
+
* @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-light.tsx <<SignedSource::10aa7e87eca39e4d6594a764e78e0698>>
|
|
74
|
+
*/
|
|
75
|
+
export declare const borderColorMap: {
|
|
76
|
+
readonly 'color.border': "var(--ds-border)";
|
|
77
|
+
readonly 'accent.red': "var(--ds-border-accent-red)";
|
|
78
|
+
readonly 'accent.orange': "var(--ds-border-accent-orange)";
|
|
79
|
+
readonly 'accent.yellow': "var(--ds-border-accent-yellow)";
|
|
80
|
+
readonly 'accent.green': "var(--ds-border-accent-green)";
|
|
81
|
+
readonly 'accent.teal': "var(--ds-border-accent-teal)";
|
|
82
|
+
readonly 'accent.blue': "var(--ds-border-accent-blue)";
|
|
83
|
+
readonly 'accent.purple': "var(--ds-border-accent-purple)";
|
|
84
|
+
readonly 'accent.magenta': "var(--ds-border-accent-magenta)";
|
|
85
|
+
readonly 'accent.gray': "var(--ds-border-accent-gray)";
|
|
86
|
+
readonly disabled: "var(--ds-border-disabled)";
|
|
87
|
+
readonly focused: "var(--ds-border-focused)";
|
|
88
|
+
readonly input: "var(--ds-border-input)";
|
|
89
|
+
readonly inverse: "var(--ds-border-inverse)";
|
|
90
|
+
readonly selected: "var(--ds-border-selected)";
|
|
91
|
+
readonly brand: "var(--ds-border-brand)";
|
|
92
|
+
readonly danger: "var(--ds-border-danger)";
|
|
93
|
+
readonly warning: "var(--ds-border-warning)";
|
|
94
|
+
readonly success: "var(--ds-border-success)";
|
|
95
|
+
readonly discovery: "var(--ds-border-discovery)";
|
|
96
|
+
readonly information: "var(--ds-border-information)";
|
|
97
|
+
readonly bold: "var(--ds-border-bold)";
|
|
98
|
+
};
|
|
99
|
+
export type BorderColor = keyof typeof borderColorMap;
|
|
100
|
+
export declare const backgroundColorMap: {
|
|
101
|
+
readonly 'accent.red.subtlest': "var(--ds-background-accent-red-subtlest)";
|
|
102
|
+
readonly 'accent.red.subtler': "var(--ds-background-accent-red-subtler)";
|
|
103
|
+
readonly 'accent.red.subtle': "var(--ds-background-accent-red-subtle)";
|
|
104
|
+
readonly 'accent.red.bolder': "var(--ds-background-accent-red-bolder)";
|
|
105
|
+
readonly 'accent.orange.subtlest': "var(--ds-background-accent-orange-subtlest)";
|
|
106
|
+
readonly 'accent.orange.subtler': "var(--ds-background-accent-orange-subtler)";
|
|
107
|
+
readonly 'accent.orange.subtle': "var(--ds-background-accent-orange-subtle)";
|
|
108
|
+
readonly 'accent.orange.bolder': "var(--ds-background-accent-orange-bolder)";
|
|
109
|
+
readonly 'accent.yellow.subtlest': "var(--ds-background-accent-yellow-subtlest)";
|
|
110
|
+
readonly 'accent.yellow.subtler': "var(--ds-background-accent-yellow-subtler)";
|
|
111
|
+
readonly 'accent.yellow.subtle': "var(--ds-background-accent-yellow-subtle)";
|
|
112
|
+
readonly 'accent.yellow.bolder': "var(--ds-background-accent-yellow-bolder)";
|
|
113
|
+
readonly 'accent.green.subtlest': "var(--ds-background-accent-green-subtlest)";
|
|
114
|
+
readonly 'accent.green.subtler': "var(--ds-background-accent-green-subtler)";
|
|
115
|
+
readonly 'accent.green.subtle': "var(--ds-background-accent-green-subtle)";
|
|
116
|
+
readonly 'accent.green.bolder': "var(--ds-background-accent-green-bolder)";
|
|
117
|
+
readonly 'accent.teal.subtlest': "var(--ds-background-accent-teal-subtlest)";
|
|
118
|
+
readonly 'accent.teal.subtler': "var(--ds-background-accent-teal-subtler)";
|
|
119
|
+
readonly 'accent.teal.subtle': "var(--ds-background-accent-teal-subtle)";
|
|
120
|
+
readonly 'accent.teal.bolder': "var(--ds-background-accent-teal-bolder)";
|
|
121
|
+
readonly 'accent.blue.subtlest': "var(--ds-background-accent-blue-subtlest)";
|
|
122
|
+
readonly 'accent.blue.subtler': "var(--ds-background-accent-blue-subtler)";
|
|
123
|
+
readonly 'accent.blue.subtle': "var(--ds-background-accent-blue-subtle)";
|
|
124
|
+
readonly 'accent.blue.bolder': "var(--ds-background-accent-blue-bolder)";
|
|
125
|
+
readonly 'accent.purple.subtlest': "var(--ds-background-accent-purple-subtlest)";
|
|
126
|
+
readonly 'accent.purple.subtler': "var(--ds-background-accent-purple-subtler)";
|
|
127
|
+
readonly 'accent.purple.subtle': "var(--ds-background-accent-purple-subtle)";
|
|
128
|
+
readonly 'accent.purple.bolder': "var(--ds-background-accent-purple-bolder)";
|
|
129
|
+
readonly 'accent.magenta.subtlest': "var(--ds-background-accent-magenta-subtlest)";
|
|
130
|
+
readonly 'accent.magenta.subtler': "var(--ds-background-accent-magenta-subtler)";
|
|
131
|
+
readonly 'accent.magenta.subtle': "var(--ds-background-accent-magenta-subtle)";
|
|
132
|
+
readonly 'accent.magenta.bolder': "var(--ds-background-accent-magenta-bolder)";
|
|
133
|
+
readonly 'accent.gray.subtlest': "var(--ds-background-accent-gray-subtlest)";
|
|
134
|
+
readonly 'accent.gray.subtler': "var(--ds-background-accent-gray-subtler)";
|
|
135
|
+
readonly 'accent.gray.subtle': "var(--ds-background-accent-gray-subtle)";
|
|
136
|
+
readonly 'accent.gray.bolder': "var(--ds-background-accent-gray-bolder)";
|
|
137
|
+
readonly disabled: "var(--ds-background-disabled)";
|
|
138
|
+
readonly input: "var(--ds-background-input)";
|
|
139
|
+
readonly 'input.hovered': "var(--ds-background-input-hovered)";
|
|
140
|
+
readonly 'input.pressed': "var(--ds-background-input-pressed)";
|
|
141
|
+
readonly 'inverse.subtle': "var(--ds-background-inverse-subtle)";
|
|
142
|
+
readonly 'inverse.subtle.hovered': "var(--ds-background-inverse-subtle-hovered)";
|
|
143
|
+
readonly 'inverse.subtle.pressed': "var(--ds-background-inverse-subtle-pressed)";
|
|
144
|
+
readonly neutral: "var(--ds-background-neutral)";
|
|
145
|
+
readonly 'neutral.hovered': "var(--ds-background-neutral-hovered)";
|
|
146
|
+
readonly 'neutral.pressed': "var(--ds-background-neutral-pressed)";
|
|
147
|
+
readonly 'neutral.subtle': "var(--ds-background-neutral-subtle)";
|
|
148
|
+
readonly 'neutral.subtle.hovered': "var(--ds-background-neutral-subtle-hovered)";
|
|
149
|
+
readonly 'neutral.subtle.pressed': "var(--ds-background-neutral-subtle-pressed)";
|
|
150
|
+
readonly 'neutral.bold': "var(--ds-background-neutral-bold)";
|
|
151
|
+
readonly 'neutral.bold.hovered': "var(--ds-background-neutral-bold-hovered)";
|
|
152
|
+
readonly 'neutral.bold.pressed': "var(--ds-background-neutral-bold-pressed)";
|
|
153
|
+
readonly selected: "var(--ds-background-selected)";
|
|
154
|
+
readonly 'selected.hovered': "var(--ds-background-selected-hovered)";
|
|
155
|
+
readonly 'selected.pressed': "var(--ds-background-selected-pressed)";
|
|
156
|
+
readonly 'selected.bold': "var(--ds-background-selected-bold)";
|
|
157
|
+
readonly 'selected.bold.hovered': "var(--ds-background-selected-bold-hovered)";
|
|
158
|
+
readonly 'selected.bold.pressed': "var(--ds-background-selected-bold-pressed)";
|
|
159
|
+
readonly 'brand.bold': "var(--ds-background-brand-bold)";
|
|
160
|
+
readonly 'brand.bold.hovered': "var(--ds-background-brand-bold-hovered)";
|
|
161
|
+
readonly 'brand.bold.pressed': "var(--ds-background-brand-bold-pressed)";
|
|
162
|
+
readonly danger: "var(--ds-background-danger)";
|
|
163
|
+
readonly 'danger.hovered': "var(--ds-background-danger-hovered)";
|
|
164
|
+
readonly 'danger.pressed': "var(--ds-background-danger-pressed)";
|
|
165
|
+
readonly 'danger.bold': "var(--ds-background-danger-bold)";
|
|
166
|
+
readonly 'danger.bold.hovered': "var(--ds-background-danger-bold-hovered)";
|
|
167
|
+
readonly 'danger.bold.pressed': "var(--ds-background-danger-bold-pressed)";
|
|
168
|
+
readonly warning: "var(--ds-background-warning)";
|
|
169
|
+
readonly 'warning.hovered': "var(--ds-background-warning-hovered)";
|
|
170
|
+
readonly 'warning.pressed': "var(--ds-background-warning-pressed)";
|
|
171
|
+
readonly 'warning.bold': "var(--ds-background-warning-bold)";
|
|
172
|
+
readonly 'warning.bold.hovered': "var(--ds-background-warning-bold-hovered)";
|
|
173
|
+
readonly 'warning.bold.pressed': "var(--ds-background-warning-bold-pressed)";
|
|
174
|
+
readonly success: "var(--ds-background-success)";
|
|
175
|
+
readonly 'success.hovered': "var(--ds-background-success-hovered)";
|
|
176
|
+
readonly 'success.pressed': "var(--ds-background-success-pressed)";
|
|
177
|
+
readonly 'success.bold': "var(--ds-background-success-bold)";
|
|
178
|
+
readonly 'success.bold.hovered': "var(--ds-background-success-bold-hovered)";
|
|
179
|
+
readonly 'success.bold.pressed': "var(--ds-background-success-bold-pressed)";
|
|
180
|
+
readonly discovery: "var(--ds-background-discovery)";
|
|
181
|
+
readonly 'discovery.hovered': "var(--ds-background-discovery-hovered)";
|
|
182
|
+
readonly 'discovery.pressed': "var(--ds-background-discovery-pressed)";
|
|
183
|
+
readonly 'discovery.bold': "var(--ds-background-discovery-bold)";
|
|
184
|
+
readonly 'discovery.bold.hovered': "var(--ds-background-discovery-bold-hovered)";
|
|
185
|
+
readonly 'discovery.bold.pressed': "var(--ds-background-discovery-bold-pressed)";
|
|
186
|
+
readonly information: "var(--ds-background-information)";
|
|
187
|
+
readonly 'information.hovered': "var(--ds-background-information-hovered)";
|
|
188
|
+
readonly 'information.pressed': "var(--ds-background-information-pressed)";
|
|
189
|
+
readonly 'information.bold': "var(--ds-background-information-bold)";
|
|
190
|
+
readonly 'information.bold.hovered': "var(--ds-background-information-bold-hovered)";
|
|
191
|
+
readonly 'information.bold.pressed': "var(--ds-background-information-bold-pressed)";
|
|
192
|
+
readonly 'color.blanket': "var(--ds-blanket)";
|
|
193
|
+
readonly 'color.blanket.selected': "var(--ds-blanket-selected)";
|
|
194
|
+
readonly 'color.blanket.danger': "var(--ds-blanket-danger)";
|
|
195
|
+
readonly 'elevation.surface': "var(--ds-surface)";
|
|
196
|
+
readonly 'elevation.surface.hovered': "var(--ds-surface-hovered)";
|
|
197
|
+
readonly 'elevation.surface.pressed': "var(--ds-surface-pressed)";
|
|
198
|
+
readonly 'elevation.surface.overlay': "var(--ds-surface-overlay)";
|
|
199
|
+
readonly 'elevation.surface.overlay.hovered': "var(--ds-surface-overlay-hovered)";
|
|
200
|
+
readonly 'elevation.surface.overlay.pressed': "var(--ds-surface-overlay-pressed)";
|
|
201
|
+
readonly 'elevation.surface.raised': "var(--ds-surface-raised)";
|
|
202
|
+
readonly 'elevation.surface.raised.hovered': "var(--ds-surface-raised-hovered)";
|
|
203
|
+
readonly 'elevation.surface.raised.pressed': "var(--ds-surface-raised-pressed)";
|
|
204
|
+
readonly 'elevation.surface.sunken': "var(--ds-surface-sunken)";
|
|
205
|
+
};
|
|
206
|
+
export type BackgroundColor = keyof typeof backgroundColorMap;
|
|
207
|
+
export declare const shadowMap: {
|
|
208
|
+
readonly overflow: "var(--ds-shadow-overflow)";
|
|
209
|
+
readonly 'overflow.perimeter': "var(--ds-shadow-overflow-perimeter)";
|
|
210
|
+
readonly 'overflow.spread': "var(--ds-shadow-overflow-spread)";
|
|
211
|
+
readonly overlay: "var(--ds-shadow-overlay)";
|
|
212
|
+
readonly raised: "var(--ds-shadow-raised)";
|
|
213
|
+
};
|
|
214
|
+
export type Shadow = keyof typeof shadowMap;
|
|
215
|
+
export declare const textColorMap: {
|
|
216
|
+
readonly 'color.text': "var(--ds-text)";
|
|
217
|
+
readonly 'accent.red': "var(--ds-text-accent-red)";
|
|
218
|
+
readonly 'accent.red.bolder': "var(--ds-text-accent-red-bolder)";
|
|
219
|
+
readonly 'accent.orange': "var(--ds-text-accent-orange)";
|
|
220
|
+
readonly 'accent.orange.bolder': "var(--ds-text-accent-orange-bolder)";
|
|
221
|
+
readonly 'accent.yellow': "var(--ds-text-accent-yellow)";
|
|
222
|
+
readonly 'accent.yellow.bolder': "var(--ds-text-accent-yellow-bolder)";
|
|
223
|
+
readonly 'accent.green': "var(--ds-text-accent-green)";
|
|
224
|
+
readonly 'accent.green.bolder': "var(--ds-text-accent-green-bolder)";
|
|
225
|
+
readonly 'accent.teal': "var(--ds-text-accent-teal)";
|
|
226
|
+
readonly 'accent.teal.bolder': "var(--ds-text-accent-teal-bolder)";
|
|
227
|
+
readonly 'accent.blue': "var(--ds-text-accent-blue)";
|
|
228
|
+
readonly 'accent.blue.bolder': "var(--ds-text-accent-blue-bolder)";
|
|
229
|
+
readonly 'accent.purple': "var(--ds-text-accent-purple)";
|
|
230
|
+
readonly 'accent.purple.bolder': "var(--ds-text-accent-purple-bolder)";
|
|
231
|
+
readonly 'accent.magenta': "var(--ds-text-accent-magenta)";
|
|
232
|
+
readonly 'accent.magenta.bolder': "var(--ds-text-accent-magenta-bolder)";
|
|
233
|
+
readonly 'accent.gray': "var(--ds-text-accent-gray)";
|
|
234
|
+
readonly 'accent.gray.bolder': "var(--ds-text-accent-gray-bolder)";
|
|
235
|
+
readonly disabled: "var(--ds-text-disabled)";
|
|
236
|
+
readonly inverse: "var(--ds-text-inverse)";
|
|
237
|
+
readonly selected: "var(--ds-text-selected)";
|
|
238
|
+
readonly brand: "var(--ds-text-brand)";
|
|
239
|
+
readonly danger: "var(--ds-text-danger)";
|
|
240
|
+
readonly warning: "var(--ds-text-warning)";
|
|
241
|
+
readonly 'warning.inverse': "var(--ds-text-warning-inverse)";
|
|
242
|
+
readonly success: "var(--ds-text-success)";
|
|
243
|
+
readonly discovery: "var(--ds-text-discovery)";
|
|
244
|
+
readonly information: "var(--ds-text-information)";
|
|
245
|
+
readonly subtlest: "var(--ds-text-subtlest)";
|
|
246
|
+
readonly subtle: "var(--ds-text-subtle)";
|
|
247
|
+
};
|
|
248
|
+
export type TextColor = keyof typeof textColorMap;
|
|
249
|
+
export declare const fillMap: {
|
|
250
|
+
readonly 'color.icon': "var(--ds-icon)";
|
|
251
|
+
readonly 'accent.red': "var(--ds-icon-accent-red)";
|
|
252
|
+
readonly 'accent.orange': "var(--ds-icon-accent-orange)";
|
|
253
|
+
readonly 'accent.yellow': "var(--ds-icon-accent-yellow)";
|
|
254
|
+
readonly 'accent.green': "var(--ds-icon-accent-green)";
|
|
255
|
+
readonly 'accent.teal': "var(--ds-icon-accent-teal)";
|
|
256
|
+
readonly 'accent.blue': "var(--ds-icon-accent-blue)";
|
|
257
|
+
readonly 'accent.purple': "var(--ds-icon-accent-purple)";
|
|
258
|
+
readonly 'accent.magenta': "var(--ds-icon-accent-magenta)";
|
|
259
|
+
readonly 'accent.gray': "var(--ds-icon-accent-gray)";
|
|
260
|
+
readonly disabled: "var(--ds-icon-disabled)";
|
|
261
|
+
readonly inverse: "var(--ds-icon-inverse)";
|
|
262
|
+
readonly selected: "var(--ds-icon-selected)";
|
|
263
|
+
readonly brand: "var(--ds-icon-brand)";
|
|
264
|
+
readonly danger: "var(--ds-icon-danger)";
|
|
265
|
+
readonly warning: "var(--ds-icon-warning)";
|
|
266
|
+
readonly 'warning.inverse': "var(--ds-icon-warning-inverse)";
|
|
267
|
+
readonly success: "var(--ds-icon-success)";
|
|
268
|
+
readonly discovery: "var(--ds-icon-discovery)";
|
|
269
|
+
readonly information: "var(--ds-icon-information)";
|
|
270
|
+
readonly subtle: "var(--ds-icon-subtle)";
|
|
271
|
+
};
|
|
272
|
+
export type Fill = keyof typeof fillMap;
|
|
273
|
+
/**
|
|
274
|
+
* @codegenEnd
|
|
275
|
+
*/
|
|
276
|
+
/**
|
|
277
|
+
* THIS SECTION WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
|
|
278
|
+
* @codegen <<SignedSource::64f7b08cdbce710fba3157594ea695a8>>
|
|
279
|
+
* @codegenId misc
|
|
280
|
+
* @codegenCommand yarn codegen-styles
|
|
281
|
+
* @codegenParams ["align-self", "border-style", "display", "flex-direction", "flex-grow", "flex-shrink", "flex", "layer", "overflow", "position"]
|
|
282
|
+
* @codegenDependency ../../scripts/codegen-file-templates/align-self.tsx <<SignedSource::074079802534462de54bf882bb2073e5>>
|
|
283
|
+
* @codegenDependency ../../scripts/codegen-file-templates/border-style.tsx <<SignedSource::87e7e289ffeaac901997c4af98084a5f>>
|
|
284
|
+
* @codegenDependency ../../scripts/codegen-file-templates/dimensions.tsx <<SignedSource::dbad5eb9ef292d4ec59f90459a81e1d6>>
|
|
285
|
+
* @codegenDependency ../../scripts/codegen-file-templates/display.tsx <<SignedSource::04ea30fcb3c02f2545af7fdc0206e645>>
|
|
286
|
+
* @codegenDependency ../../scripts/codegen-file-templates/flex-direction.tsx <<SignedSource::19809ba11675679c188b0d98fb651dc1>>
|
|
287
|
+
* @codegenDependency ../../scripts/codegen-file-templates/flex-grow.tsx <<SignedSource::b8a06b122cb609170f1f42778a6c270e>>
|
|
288
|
+
* @codegenDependency ../../scripts/codegen-file-templates/flex-shrink.tsx <<SignedSource::bf6626972898bf22d2eeee2130693d47>>
|
|
289
|
+
* @codegenDependency ../../scripts/codegen-file-templates/flex.tsx <<SignedSource::ffa0189d14f1f00a16ec1e9f43a17ce9>>
|
|
290
|
+
* @codegenDependency ../../scripts/codegen-file-templates/layer.tsx <<SignedSource::79d24a1e558f12d671c06a7609f90dc1>>
|
|
291
|
+
* @codegenDependency ../../scripts/codegen-file-templates/overflow.tsx <<SignedSource::ccb841f2f51525aed895c06e00f15089>>
|
|
292
|
+
* @codegenDependency ../../scripts/codegen-file-templates/position.tsx <<SignedSource::8709494ef16c48046c1784a9aaec6d80>>
|
|
293
|
+
*/
|
|
294
|
+
export declare const alignSelfMap: {
|
|
295
|
+
readonly center: "center";
|
|
296
|
+
readonly start: "start";
|
|
297
|
+
readonly stretch: "stretch";
|
|
298
|
+
readonly end: "end";
|
|
299
|
+
readonly baseline: "baseline";
|
|
300
|
+
};
|
|
301
|
+
export type AlignSelf = keyof typeof alignSelfMap;
|
|
302
|
+
export declare const borderStyleMap: {
|
|
303
|
+
readonly none: "none";
|
|
304
|
+
readonly solid: "solid";
|
|
305
|
+
};
|
|
306
|
+
export type BorderStyle = keyof typeof borderStyleMap;
|
|
307
|
+
export declare const displayMap: {
|
|
308
|
+
readonly flex: "flex";
|
|
309
|
+
readonly block: "block";
|
|
310
|
+
readonly inline: "inline";
|
|
311
|
+
readonly inlineBlock: "inline-block";
|
|
312
|
+
readonly inlineFlex: "inline-flex";
|
|
313
|
+
};
|
|
314
|
+
export type Display = keyof typeof displayMap;
|
|
315
|
+
export declare const flexDirectionMap: {
|
|
316
|
+
readonly row: "row";
|
|
317
|
+
readonly column: "column";
|
|
318
|
+
};
|
|
319
|
+
export type FlexDirection = keyof typeof flexDirectionMap;
|
|
320
|
+
export declare const flexGrowMap: {
|
|
321
|
+
readonly '0': 0;
|
|
322
|
+
readonly '1': 1;
|
|
323
|
+
};
|
|
324
|
+
export type FlexGrow = keyof typeof flexGrowMap;
|
|
325
|
+
export declare const flexShrinkMap: {
|
|
326
|
+
readonly '0': 0;
|
|
327
|
+
readonly '1': 1;
|
|
328
|
+
};
|
|
329
|
+
export type FlexShrink = keyof typeof flexShrinkMap;
|
|
330
|
+
export declare const flexMap: {
|
|
331
|
+
readonly '1': 1;
|
|
332
|
+
};
|
|
333
|
+
export type Flex = keyof typeof flexMap;
|
|
334
|
+
export declare const layerMap: {
|
|
335
|
+
readonly card: 100;
|
|
336
|
+
readonly navigation: 200;
|
|
337
|
+
readonly dialog: 300;
|
|
338
|
+
readonly layer: 400;
|
|
339
|
+
readonly blanket: 500;
|
|
340
|
+
readonly modal: 510;
|
|
341
|
+
readonly flag: 600;
|
|
342
|
+
readonly spotlight: 700;
|
|
343
|
+
readonly tooltip: 800;
|
|
344
|
+
};
|
|
345
|
+
export type Layer = keyof typeof layerMap;
|
|
346
|
+
export declare const overflowMap: {
|
|
347
|
+
readonly auto: "auto";
|
|
348
|
+
readonly hidden: "hidden";
|
|
349
|
+
};
|
|
350
|
+
export type Overflow = keyof typeof overflowMap;
|
|
351
|
+
export declare const overflowInlineMap: {
|
|
352
|
+
readonly auto: "auto";
|
|
353
|
+
readonly hidden: "hidden";
|
|
354
|
+
};
|
|
355
|
+
export type OverflowInline = keyof typeof overflowInlineMap;
|
|
356
|
+
export declare const overflowBlockMap: {
|
|
357
|
+
readonly auto: "auto";
|
|
358
|
+
readonly hidden: "hidden";
|
|
359
|
+
};
|
|
360
|
+
export type OverflowBlock = keyof typeof overflowBlockMap;
|
|
361
|
+
export declare const positionMap: {
|
|
362
|
+
readonly absolute: "absolute";
|
|
363
|
+
readonly fixed: "fixed";
|
|
364
|
+
readonly relative: "relative";
|
|
365
|
+
readonly static: "static";
|
|
366
|
+
};
|
|
367
|
+
export type Position = keyof typeof positionMap;
|
|
368
|
+
/**
|
|
369
|
+
* @codegenEnd
|
|
370
|
+
*/
|
|
371
|
+
/**
|
|
372
|
+
* THIS SECTION WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
|
|
373
|
+
* @codegen <<SignedSource::e3e1d54f37a0f8c524ccc5c8e22ad5bf>>
|
|
374
|
+
* @codegenId border
|
|
375
|
+
* @codegenCommand yarn codegen-styles
|
|
376
|
+
* @codegenParams ["width", "radius"]
|
|
377
|
+
* @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-shape.tsx <<SignedSource::a4f70bd83edd3dd448c6eccda60abdf7>>
|
|
378
|
+
*/
|
|
379
|
+
export declare const borderWidthMap: {
|
|
380
|
+
readonly 'width.0': "var(--ds-width-0)";
|
|
381
|
+
readonly 'width.050': "var(--ds-width-050)";
|
|
382
|
+
readonly 'width.100': "var(--ds-width-100)";
|
|
383
|
+
};
|
|
384
|
+
export type BorderWidth = keyof typeof borderWidthMap;
|
|
385
|
+
export declare const borderRadiusMap: {
|
|
386
|
+
readonly 'radius.050': "var(--ds-radius-050)";
|
|
387
|
+
readonly 'radius.100': "var(--ds-radius-100)";
|
|
388
|
+
readonly 'radius.200': "var(--ds-radius-200)";
|
|
389
|
+
readonly 'radius.300': "var(--ds-radius-300)";
|
|
390
|
+
readonly 'radius.400': "var(--ds-radius-400)";
|
|
391
|
+
readonly 'radius.round': "var(--ds-radius-round)";
|
|
392
|
+
};
|
|
393
|
+
export type BorderRadius = keyof typeof borderRadiusMap;
|
|
394
|
+
/**
|
|
395
|
+
* @codegenEnd
|
|
396
|
+
*/
|
|
397
|
+
export type TokenisedProps = {
|
|
398
|
+
alignSelf?: AlignSelf;
|
|
399
|
+
backgroundColor?: BackgroundColor;
|
|
400
|
+
blockSize?: BlockSize;
|
|
401
|
+
borderColor?: BorderColor;
|
|
402
|
+
borderRadius?: BorderRadius;
|
|
403
|
+
borderStyle?: BorderStyle;
|
|
404
|
+
borderWidth?: BorderWidth;
|
|
405
|
+
bottom?: Bottom;
|
|
406
|
+
boxShadow?: Shadow;
|
|
407
|
+
color?: TextColor;
|
|
408
|
+
columnGap?: Space;
|
|
409
|
+
display?: Display;
|
|
410
|
+
fill?: Fill;
|
|
411
|
+
flex?: Flex;
|
|
412
|
+
flexDirection?: FlexDirection;
|
|
413
|
+
flexGrow?: FlexGrow;
|
|
414
|
+
flexShrink?: FlexShrink;
|
|
415
|
+
gap?: Space;
|
|
416
|
+
height?: Height;
|
|
417
|
+
inlineSize?: InlineSize;
|
|
418
|
+
inset?: Space;
|
|
419
|
+
insetBlock?: Space;
|
|
420
|
+
insetBlockEnd?: Space;
|
|
421
|
+
insetBlockStart?: Space;
|
|
422
|
+
insetInline?: Space;
|
|
423
|
+
insetInlineEnd?: Space;
|
|
424
|
+
insetInlineStart?: Space;
|
|
425
|
+
left?: Left;
|
|
426
|
+
maxBlockSize?: MaxBlockSize;
|
|
427
|
+
maxHeight?: MaxHeight;
|
|
428
|
+
maxInlineSize?: MaxInlineSize;
|
|
429
|
+
maxWidth?: MaxWidth;
|
|
430
|
+
minBlockSize?: MinBlockSize;
|
|
431
|
+
minHeight?: MinHeight;
|
|
432
|
+
minInlineSize?: MinInlineSize;
|
|
433
|
+
minWidth?: MinWidth;
|
|
434
|
+
outlineColor?: BorderColor;
|
|
435
|
+
outlineOffset?: Space;
|
|
436
|
+
outlineWidth?: BorderWidth;
|
|
437
|
+
overflow?: Overflow;
|
|
438
|
+
overflowBlock?: OverflowBlock;
|
|
439
|
+
overflowInline?: OverflowInline;
|
|
440
|
+
padding?: Space;
|
|
441
|
+
paddingBlock?: Space;
|
|
442
|
+
paddingBlockEnd?: Space;
|
|
443
|
+
paddingBlockStart?: Space;
|
|
444
|
+
paddingInline?: Space;
|
|
445
|
+
paddingInlineEnd?: Space;
|
|
446
|
+
paddingInlineStart?: Space;
|
|
447
|
+
position?: Position;
|
|
448
|
+
right?: Right;
|
|
449
|
+
rowGap?: Space;
|
|
450
|
+
top?: Top;
|
|
451
|
+
width?: Width;
|
|
452
|
+
zIndex?: Layer;
|
|
453
|
+
};
|
|
454
|
+
declare const spacingProperties: readonly [
|
|
455
|
+
"padding",
|
|
456
|
+
"paddingBlock",
|
|
457
|
+
"paddingBlockStart",
|
|
458
|
+
"paddingBlockEnd",
|
|
459
|
+
"paddingInline",
|
|
460
|
+
"paddingInlineStart",
|
|
461
|
+
"paddingInlineEnd",
|
|
462
|
+
"gap",
|
|
463
|
+
"rowGap",
|
|
464
|
+
"columnGap"
|
|
465
|
+
];
|
|
466
|
+
type SpacingProperty = (typeof spacingProperties)[number];
|
|
467
|
+
type SpacingToken = keyof typeof spaceMap;
|
|
468
|
+
type BackgroundColorToken = keyof typeof backgroundColorMap;
|
|
469
|
+
type SpacingStyleMap = Record<SpacingProperty, Record<SpacingToken, SerializedStyles>>;
|
|
470
|
+
type BackgroundColorStyleMap = Record<BackgroundColorToken, SerializedStyles>;
|
|
471
|
+
export declare const paddingStylesMap: SpacingStyleMap;
|
|
472
|
+
export declare const spaceStylesMap: SpacingStyleMap;
|
|
473
|
+
export declare const backgroundColorStylesMap: BackgroundColorStyleMap;
|
|
474
|
+
export {};
|
|
@@ -0,0 +1,57 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
import { css as cssEmotion } from '@emotion/react';
|
|
3
|
+
import { CSSPropertiesWithMultiValues, SerializedStyles } from '@emotion/serialize';
|
|
4
|
+
import type * as CSS from 'csstype';
|
|
5
|
+
import { Box, Inline } from '../index';
|
|
6
|
+
import { TokenisedProps } from './style-maps.partial';
|
|
7
|
+
declare const uniqueSymbol: unique symbol;
|
|
8
|
+
/**
|
|
9
|
+
* @internal used in primitives
|
|
10
|
+
* @returns a collection of styles that can be applied to the respective primitive
|
|
11
|
+
*/
|
|
12
|
+
type ParsedXcss = ReturnType<typeof cssEmotion> | ReturnType<typeof cssEmotion>[];
|
|
13
|
+
export declare const parseXcss: (args: XCSS | Array<XCSS | false | undefined>) => ParsedXcss;
|
|
14
|
+
type CSSPseudos = {
|
|
15
|
+
[Pseudo in CSS.Pseudos]?: SafeCSSObject;
|
|
16
|
+
};
|
|
17
|
+
type SafeCSSObject = CSSPseudos & TokenisedProps & Omit<CSSPropertiesWithMultiValues, keyof TokenisedProps>;
|
|
18
|
+
type ScopedSafeCSSObject<T extends keyof SafeCSSObject> = Pick<SafeCSSObject, T>;
|
|
19
|
+
declare const boxWrapper: (style: any) => {
|
|
20
|
+
readonly [uniqueSymbol]: BoxStyles;
|
|
21
|
+
};
|
|
22
|
+
declare const inlineWrapper: (style: any) => {
|
|
23
|
+
readonly [uniqueSymbol]: InlineStyles;
|
|
24
|
+
};
|
|
25
|
+
type XCSS = ReturnType<typeof boxWrapper> | ReturnType<typeof inlineWrapper>;
|
|
26
|
+
type AllowedBoxStyles = keyof SafeCSSObject;
|
|
27
|
+
type AllowedInlineStyles = 'backgroundColor' | 'padding';
|
|
28
|
+
/**
|
|
29
|
+
* ### xcss
|
|
30
|
+
*
|
|
31
|
+
* `xcss` is a safer, tokens-first approach to CSS-in-JS. It allows token-backed values for
|
|
32
|
+
* CSS application.
|
|
33
|
+
*
|
|
34
|
+
* ```tsx
|
|
35
|
+
* const styles = xcss({
|
|
36
|
+
* padding: 'space.100'
|
|
37
|
+
* })
|
|
38
|
+
* ```
|
|
39
|
+
*/
|
|
40
|
+
export declare function xcss<Primitive extends typeof Box | typeof Inline = typeof Box>(style: Primitive extends typeof Box ? ScopedSafeCSSObject<AllowedBoxStyles> | ScopedSafeCSSObject<AllowedBoxStyles>[] : Primitive extends typeof Inline ? ScopedSafeCSSObject<AllowedInlineStyles> | ScopedSafeCSSObject<AllowedInlineStyles>[] : never): {
|
|
41
|
+
readonly [uniqueSymbol]: Primitive extends (<T extends import("react").ElementType<any> = "div">(props: import("../index").BoxProps<T>) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>> | null) & import("react").FC<import("../index").BoxProps<"div">> ? BoxStyles : Primitive extends import("react").MemoExoticComponent<import("react").ForwardRefExoticComponent<Pick<import("../index").InlineProps<import("react").ElementType<any>>, "as" | "children" | "testId" | "alignInline" | "alignBlock" | "shouldWrap" | "spread" | "grow" | "space" | "rowSpace" | "separator"> & import("react").RefAttributes<any>>> ? InlineStyles : never;
|
|
42
|
+
};
|
|
43
|
+
declare const boxTag: unique symbol;
|
|
44
|
+
export type BoxStyles = SerializedStyles & {
|
|
45
|
+
[boxTag]: true;
|
|
46
|
+
};
|
|
47
|
+
export type BoxXCSS = {
|
|
48
|
+
readonly [uniqueSymbol]: BoxStyles;
|
|
49
|
+
};
|
|
50
|
+
declare const inlineTag: unique symbol;
|
|
51
|
+
export type InlineStyles = SerializedStyles & {
|
|
52
|
+
[inlineTag]: true;
|
|
53
|
+
};
|
|
54
|
+
export type InlineXCSS = {
|
|
55
|
+
readonly [uniqueSymbol]: InlineStyles;
|
|
56
|
+
};
|
|
57
|
+
export {};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@atlaskit/primitives",
|
|
3
|
-
"version": "0.9.
|
|
3
|
+
"version": "0.9.3",
|
|
4
4
|
"description": "Primitives are token-backed low-level building blocks.",
|
|
5
5
|
"author": "Atlassian Pty Ltd",
|
|
6
6
|
"license": "Apache-2.0",
|
|
@@ -69,7 +69,7 @@
|
|
|
69
69
|
}
|
|
70
70
|
},
|
|
71
71
|
"scripts": {
|
|
72
|
-
"codegen-styles": "ts-node --project
|
|
72
|
+
"codegen-styles": "ts-node --project ./tsconfig.node.json ./scripts/codegen-styles"
|
|
73
73
|
},
|
|
74
74
|
"main": "dist/cjs/index.js",
|
|
75
75
|
"module": "dist/esm/index.js",
|
|
@@ -124,7 +124,7 @@
|
|
|
124
124
|
"@atlaskit/webdriver-runner": "*",
|
|
125
125
|
"@atlassian/atlassian-frontend-prettier-config-1.0.1": "npm:@atlassian/atlassian-frontend-prettier-config@1.0.1",
|
|
126
126
|
"@atlassian/codegen": "^0.1.0",
|
|
127
|
-
"@atlassian/gemini-visual-regression": "^0.0.
|
|
127
|
+
"@atlassian/gemini-visual-regression": "^0.0.16",
|
|
128
128
|
"@testing-library/react": "^12.1.5",
|
|
129
129
|
"csstype": "^3.1.0",
|
|
130
130
|
"prettier": "^2.8.0",
|