@atlaskit/primitives 19.0.2 → 20.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.
- package/CHANGELOG.md +35 -0
- package/anchor/package.json +1 -8
- package/bleed/package.json +1 -8
- package/box/package.json +1 -8
- package/compiled/anchor/package.json +1 -8
- package/compiled/bleed/package.json +1 -8
- package/compiled/box/package.json +1 -8
- package/compiled/components/types/package.json +1 -8
- package/compiled/flex/package.json +1 -8
- package/compiled/focusable/package.json +1 -8
- package/compiled/grid/package.json +1 -8
- package/compiled/hide/package.json +1 -8
- package/compiled/inline/package.json +1 -8
- package/compiled/media-helper/package.json +1 -8
- package/compiled/metric-text/package.json +1 -8
- package/compiled/package.json +1 -8
- package/compiled/pressable/package.json +1 -8
- package/compiled/show/package.json +1 -8
- package/compiled/stack/package.json +1 -8
- package/compiled/surface-provider/package.json +1 -8
- package/compiled/text/package.json +1 -8
- package/compiled/types/package.json +1 -8
- package/compiled/use-media-query/package.json +1 -8
- package/compiled/utils/types/package.json +1 -8
- package/components/flex/package.json +1 -8
- package/constants/package.json +1 -8
- package/constellation/pressable/examples.mdx +15 -9
- package/dist/cjs/compiled/components/anchor.js +1 -1
- package/dist/cjs/compiled/components/pressable.js +1 -1
- package/dist/cjs/components/anchor.js +1 -1
- package/dist/cjs/components/pressable.js +1 -1
- package/dist/cjs/xcss/style-maps.partial.js +18 -10
- package/dist/es2019/compiled/components/anchor.js +1 -1
- package/dist/es2019/compiled/components/pressable.js +1 -1
- package/dist/es2019/components/anchor.js +1 -1
- package/dist/es2019/components/pressable.js +1 -1
- package/dist/es2019/xcss/style-maps.partial.js +18 -10
- package/dist/esm/compiled/components/anchor.js +1 -1
- package/dist/esm/compiled/components/pressable.js +1 -1
- package/dist/esm/components/anchor.js +1 -1
- package/dist/esm/components/pressable.js +1 -1
- package/dist/esm/xcss/style-maps.partial.js +18 -10
- package/dist/types/compiled/components/types.d.ts +1 -1
- package/dist/types/utils/types.d.ts +1 -1
- package/dist/types/xcss/style-maps.partial.d.ts +16 -8
- package/flex/package.json +1 -8
- package/grid/package.json +1 -8
- package/inline/package.json +1 -8
- package/media-helper/package.json +1 -8
- package/metric-text/package.json +1 -8
- package/package.json +31 -39
- package/pressable/package.json +1 -8
- package/responsive/build-media-query-css/package.json +1 -8
- package/responsive/constants/package.json +1 -8
- package/responsive/hide/package.json +1 -8
- package/responsive/media-helper/package.json +1 -8
- package/responsive/package.json +1 -8
- package/responsive/show/package.json +1 -8
- package/responsive/types/package.json +1 -8
- package/responsive/use-media-query/package.json +1 -8
- package/scripts/color-codegen-template.tsx +2 -1
- package/stack/package.json +1 -8
- package/surface-provider/package.json +1 -8
- package/text/package.json +1 -8
- package/types/package.json +1 -8
- package/xcss/package.json +1 -8
- package/dist/types-ts4.5/compiled/components/anchor.d.ts +0 -63
- package/dist/types-ts4.5/compiled/components/bleed.d.ts +0 -34
- package/dist/types-ts4.5/compiled/components/box.d.ts +0 -109
- package/dist/types-ts4.5/compiled/components/flex.d.ts +0 -71
- package/dist/types-ts4.5/compiled/components/focusable.d.ts +0 -36
- package/dist/types-ts4.5/compiled/components/grid.d.ts +0 -80
- package/dist/types-ts4.5/compiled/components/inline.d.ts +0 -70
- package/dist/types-ts4.5/compiled/components/metric-text.d.ts +0 -49
- package/dist/types-ts4.5/compiled/components/pressable.d.ts +0 -49
- package/dist/types-ts4.5/compiled/components/stack.d.ts +0 -57
- package/dist/types-ts4.5/compiled/components/text.d.ts +0 -101
- package/dist/types-ts4.5/compiled/components/types.d.ts +0 -45
- package/dist/types-ts4.5/compiled/index.d.ts +0 -16
- package/dist/types-ts4.5/compiled/responsive/hide.d.ts +0 -39
- package/dist/types-ts4.5/compiled/responsive/index.d.ts +0 -5
- package/dist/types-ts4.5/compiled/responsive/media-helper.d.ts +0 -35
- package/dist/types-ts4.5/compiled/responsive/show.d.ts +0 -39
- package/dist/types-ts4.5/compiled/responsive/types.d.ts +0 -10
- package/dist/types-ts4.5/compiled/responsive/use-media-query.d.ts +0 -23
- package/dist/types-ts4.5/components/anchor.d.ts +0 -106
- package/dist/types-ts4.5/components/bleed.d.ts +0 -36
- package/dist/types-ts4.5/components/box.d.ts +0 -85
- package/dist/types-ts4.5/components/flex.d.ts +0 -105
- package/dist/types-ts4.5/components/grid.d.ts +0 -137
- package/dist/types-ts4.5/components/inline.d.ts +0 -74
- package/dist/types-ts4.5/components/metric-text.d.ts +0 -16
- package/dist/types-ts4.5/components/pressable.d.ts +0 -92
- package/dist/types-ts4.5/components/stack.d.ts +0 -61
- package/dist/types-ts4.5/components/text.d.ts +0 -75
- package/dist/types-ts4.5/components/types.d.ts +0 -33
- package/dist/types-ts4.5/constants.d.ts +0 -12
- package/dist/types-ts4.5/entry-points/anchor.d.ts +0 -2
- package/dist/types-ts4.5/entry-points/bleed.d.ts +0 -2
- package/dist/types-ts4.5/entry-points/box.d.ts +0 -3
- package/dist/types-ts4.5/entry-points/compiled-anchor.d.ts +0 -2
- package/dist/types-ts4.5/entry-points/compiled-bleed.d.ts +0 -2
- package/dist/types-ts4.5/entry-points/compiled-box.d.ts +0 -2
- package/dist/types-ts4.5/entry-points/compiled-components-types.d.ts +0 -1
- package/dist/types-ts4.5/entry-points/compiled-flex.d.ts +0 -2
- package/dist/types-ts4.5/entry-points/compiled-focusable.d.ts +0 -2
- package/dist/types-ts4.5/entry-points/compiled-grid.d.ts +0 -2
- package/dist/types-ts4.5/entry-points/compiled-hide.d.ts +0 -1
- package/dist/types-ts4.5/entry-points/compiled-inline.d.ts +0 -2
- package/dist/types-ts4.5/entry-points/compiled-media-helper.d.ts +0 -1
- package/dist/types-ts4.5/entry-points/compiled-metric-text.d.ts +0 -2
- package/dist/types-ts4.5/entry-points/compiled-pressable.d.ts +0 -2
- package/dist/types-ts4.5/entry-points/compiled-show.d.ts +0 -1
- package/dist/types-ts4.5/entry-points/compiled-stack.d.ts +0 -2
- package/dist/types-ts4.5/entry-points/compiled-surface-provider.d.ts +0 -1
- package/dist/types-ts4.5/entry-points/compiled-text.d.ts +0 -2
- package/dist/types-ts4.5/entry-points/compiled-types.d.ts +0 -1
- package/dist/types-ts4.5/entry-points/compiled-use-media-query.d.ts +0 -1
- package/dist/types-ts4.5/entry-points/compiled-utils-types.d.ts +0 -1
- package/dist/types-ts4.5/entry-points/constants.d.ts +0 -1
- package/dist/types-ts4.5/entry-points/flex.d.ts +0 -2
- package/dist/types-ts4.5/entry-points/grid.d.ts +0 -2
- package/dist/types-ts4.5/entry-points/inline.d.ts +0 -2
- package/dist/types-ts4.5/entry-points/media-helper.d.ts +0 -1
- package/dist/types-ts4.5/entry-points/metric-text.d.ts +0 -2
- package/dist/types-ts4.5/entry-points/pressable.d.ts +0 -2
- package/dist/types-ts4.5/entry-points/responsive-build-media-query-css.d.ts +0 -1
- package/dist/types-ts4.5/entry-points/responsive-constants.d.ts +0 -1
- package/dist/types-ts4.5/entry-points/responsive-hide.d.ts +0 -1
- package/dist/types-ts4.5/entry-points/responsive-media-helper.d.ts +0 -1
- package/dist/types-ts4.5/entry-points/responsive-show.d.ts +0 -1
- package/dist/types-ts4.5/entry-points/responsive-types.d.ts +0 -1
- package/dist/types-ts4.5/entry-points/responsive-use-media-query.d.ts +0 -1
- package/dist/types-ts4.5/entry-points/stack.d.ts +0 -2
- package/dist/types-ts4.5/entry-points/surface-provider.d.ts +0 -1
- package/dist/types-ts4.5/entry-points/text.d.ts +0 -2
- package/dist/types-ts4.5/entry-points/types.d.ts +0 -1
- package/dist/types-ts4.5/entry-points/xcss.d.ts +0 -2
- package/dist/types-ts4.5/index.d.ts +0 -27
- package/dist/types-ts4.5/responsive/build-media-query-css.d.ts +0 -2
- package/dist/types-ts4.5/responsive/constants.d.ts +0 -67
- package/dist/types-ts4.5/responsive/hide.d.ts +0 -41
- package/dist/types-ts4.5/responsive/index.d.ts +0 -7
- package/dist/types-ts4.5/responsive/media-helper.d.ts +0 -29
- package/dist/types-ts4.5/responsive/media.d.ts +0 -25
- package/dist/types-ts4.5/responsive/show.d.ts +0 -40
- package/dist/types-ts4.5/responsive/types.d.ts +0 -32
- package/dist/types-ts4.5/responsive/unsafe-build-above-media-query-css.d.ts +0 -33
- package/dist/types-ts4.5/responsive/unsafe-build-below-media-query-css.d.ts +0 -32
- package/dist/types-ts4.5/responsive/use-media-query.d.ts +0 -23
- package/dist/types-ts4.5/utils/has-text-ancestor-context.d.ts +0 -9
- package/dist/types-ts4.5/utils/surface-context.d.ts +0 -8
- package/dist/types-ts4.5/utils/surface-provider.d.ts +0 -10
- package/dist/types-ts4.5/utils/types.d.ts +0 -6
- package/dist/types-ts4.5/xcss/style-maps.partial.d.ts +0 -793
- package/dist/types-ts4.5/xcss/xcss.d.ts +0 -143
|
@@ -86,7 +86,7 @@ const Pressable = /*#__PURE__*/forwardRef(({
|
|
|
86
86
|
action: 'clicked',
|
|
87
87
|
componentName: componentName || 'Pressable',
|
|
88
88
|
packageName: "@atlaskit/primitives",
|
|
89
|
-
packageVersion: "
|
|
89
|
+
packageVersion: "20.0.0",
|
|
90
90
|
analyticsData: analyticsContext,
|
|
91
91
|
actionSubject: 'button'
|
|
92
92
|
});
|
|
@@ -67,10 +67,10 @@ export const allSpaceMap = {
|
|
|
67
67
|
|
|
68
68
|
/**
|
|
69
69
|
* THIS SECTION WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
|
|
70
|
-
* @codegen <<SignedSource::
|
|
70
|
+
* @codegen <<SignedSource::e8d2ee8bd083c5b6e6d3b0bec7a275a5>>
|
|
71
71
|
* @codegenId inverse-colors
|
|
72
72
|
* @codegenCommand yarn workspace @atlaskit/primitives codegen-styles
|
|
73
|
-
* @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-light.tsx <<SignedSource::
|
|
73
|
+
* @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-light.tsx <<SignedSource::89430472c8668e635450d1233437a9ca>>
|
|
74
74
|
*/
|
|
75
75
|
export const inverseColorMap = {
|
|
76
76
|
'color.background.neutral.bold': 'color.text.inverse',
|
|
@@ -99,7 +99,10 @@ export const inverseColorMap = {
|
|
|
99
99
|
'color.background.discovery.bold.pressed': 'color.text.inverse',
|
|
100
100
|
'color.background.information.bold': 'color.text.inverse',
|
|
101
101
|
'color.background.information.bold.hovered': 'color.text.inverse',
|
|
102
|
-
'color.background.information.bold.pressed': 'color.text.inverse'
|
|
102
|
+
'color.background.information.bold.pressed': 'color.text.inverse',
|
|
103
|
+
'color.rovo.background.brand.bold': 'color.text.inverse',
|
|
104
|
+
'color.rovo.background.brand.bold.hovered': 'color.text.inverse',
|
|
105
|
+
'color.rovo.background.brand.bold.pressed': 'color.text.inverse'
|
|
103
106
|
};
|
|
104
107
|
|
|
105
108
|
/**
|
|
@@ -108,11 +111,11 @@ export const inverseColorMap = {
|
|
|
108
111
|
|
|
109
112
|
/**
|
|
110
113
|
* THIS SECTION WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
|
|
111
|
-
* @codegen <<SignedSource::
|
|
114
|
+
* @codegen <<SignedSource::617e401f8358136781549b9d42338882>>
|
|
112
115
|
* @codegenId elevation
|
|
113
116
|
* @codegenCommand yarn workspace @atlaskit/primitives codegen-styles
|
|
114
117
|
* @codegenParams ["opacity", "shadow", "surface"]
|
|
115
|
-
* @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-light.tsx <<SignedSource::
|
|
118
|
+
* @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-light.tsx <<SignedSource::89430472c8668e635450d1233437a9ca>>
|
|
116
119
|
*/
|
|
117
120
|
export const opacityMap = {
|
|
118
121
|
'opacity.disabled': "var(--ds-opacity-disabled, 0.4)",
|
|
@@ -129,6 +132,7 @@ export const surfaceColorMap = {
|
|
|
129
132
|
'elevation.surface': "var(--ds-surface, #FFFFFF)",
|
|
130
133
|
'elevation.surface.hovered': "var(--ds-surface-hovered, #F0F1F2)",
|
|
131
134
|
'elevation.surface.pressed': "var(--ds-surface-pressed, #DDDEE1)",
|
|
135
|
+
'elevation.surface.container': "var(--ds-surface-container, #F0F1F2)",
|
|
132
136
|
'elevation.surface.overlay': "var(--ds-surface-overlay, #FFFFFF)",
|
|
133
137
|
'elevation.surface.overlay.hovered': "var(--ds-surface-overlay-hovered, #F0F1F2)",
|
|
134
138
|
'elevation.surface.overlay.pressed': "var(--ds-surface-overlay-pressed, #DDDEE1)",
|
|
@@ -143,11 +147,11 @@ export const surfaceColorMap = {
|
|
|
143
147
|
|
|
144
148
|
/**
|
|
145
149
|
* THIS SECTION WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
|
|
146
|
-
* @codegen <<SignedSource::
|
|
150
|
+
* @codegen <<SignedSource::ca867a1010665c5ed92cd318dcf507ae>>
|
|
147
151
|
* @codegenId colors
|
|
148
152
|
* @codegenCommand yarn workspace @atlaskit/primitives codegen-styles
|
|
149
153
|
* @codegenParams ["border", "background", "text", "fill"]
|
|
150
|
-
* @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-light.tsx <<SignedSource::
|
|
154
|
+
* @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-light.tsx <<SignedSource::89430472c8668e635450d1233437a9ca>>
|
|
151
155
|
*/
|
|
152
156
|
export const borderColorMap = {
|
|
153
157
|
'color.border': "var(--ds-border, #0B120E24)",
|
|
@@ -170,7 +174,7 @@ export const borderColorMap = {
|
|
|
170
174
|
'color.border.accent.magenta': "var(--ds-border-accent-magenta, #CD519D)",
|
|
171
175
|
'color.border.accent.magenta.subtle': "var(--ds-border-accent-magenta-subtle, #F797D2)",
|
|
172
176
|
'color.border.accent.gray': "var(--ds-border-accent-gray, #7D818A)",
|
|
173
|
-
'color.border.accent.gray.subtle': "var(--ds-border-accent-gray-subtle, #
|
|
177
|
+
'color.border.accent.gray.subtle': "var(--ds-border-accent-gray-subtle, #B7B9BE)",
|
|
174
178
|
'color.border.disabled': "var(--ds-border-disabled, #0515240F)",
|
|
175
179
|
'color.border.focused': "var(--ds-border-focused, #4688EC)",
|
|
176
180
|
'color.border.input': "var(--ds-border-input, #8C8F97)",
|
|
@@ -391,14 +395,18 @@ export const backgroundColorMap = {
|
|
|
391
395
|
'color.background.information.bold': "var(--ds-background-information-bold, #1868DB)",
|
|
392
396
|
'color.background.information.bold.hovered': "var(--ds-background-information-bold-hovered, #1558BC)",
|
|
393
397
|
'color.background.information.bold.pressed': "var(--ds-background-information-bold-pressed, #144794)",
|
|
398
|
+
'color.skeleton': "var(--ds-skeleton, #0515240F)",
|
|
399
|
+
'color.skeleton.subtle': "var(--ds-skeleton-subtle, #17171708)",
|
|
394
400
|
'color.blanket': "var(--ds-blanket, #050C1F75)",
|
|
395
401
|
'color.blanket.selected': "var(--ds-blanket-selected, #388BFF14)",
|
|
396
402
|
'color.blanket.danger': "var(--ds-blanket-danger, #EF5C4814)",
|
|
397
|
-
'color.
|
|
398
|
-
'color.
|
|
403
|
+
'color.rovo.background.brand.bold': "var(--ds-rovo-background-brand-bold, #000000)",
|
|
404
|
+
'color.rovo.background.brand.bold.hovered': "var(--ds-rovo-background-brand-bold-hovered, #1E1F21)",
|
|
405
|
+
'color.rovo.background.brand.bold.pressed': "var(--ds-rovo-background-brand-bold-pressed, #292A2E)",
|
|
399
406
|
'elevation.surface': "var(--ds-surface, #FFFFFF)",
|
|
400
407
|
'elevation.surface.hovered': "var(--ds-surface-hovered, #F0F1F2)",
|
|
401
408
|
'elevation.surface.pressed': "var(--ds-surface-pressed, #DDDEE1)",
|
|
409
|
+
'elevation.surface.container': "var(--ds-surface-container, #F0F1F2)",
|
|
402
410
|
'elevation.surface.overlay': "var(--ds-surface-overlay, #FFFFFF)",
|
|
403
411
|
'elevation.surface.overlay.hovered': "var(--ds-surface-overlay-hovered, #F0F1F2)",
|
|
404
412
|
'elevation.surface.overlay.pressed': "var(--ds-surface-overlay-pressed, #DDDEE1)",
|
|
@@ -61,7 +61,7 @@ var AnchorNoRef = function AnchorNoRef(_ref, ref) {
|
|
|
61
61
|
action: 'clicked',
|
|
62
62
|
componentName: componentName || 'Anchor',
|
|
63
63
|
packageName: "@atlaskit/primitives",
|
|
64
|
-
packageVersion: "
|
|
64
|
+
packageVersion: "20.0.0",
|
|
65
65
|
analyticsData: analyticsContext,
|
|
66
66
|
actionSubject: 'link'
|
|
67
67
|
});
|
|
@@ -52,7 +52,7 @@ var Pressable = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
|
52
52
|
action: 'clicked',
|
|
53
53
|
componentName: componentName || 'Pressable',
|
|
54
54
|
packageName: "@atlaskit/primitives",
|
|
55
|
-
packageVersion: "
|
|
55
|
+
packageVersion: "20.0.0",
|
|
56
56
|
analyticsData: analyticsContext,
|
|
57
57
|
actionSubject: 'button'
|
|
58
58
|
});
|
|
@@ -99,7 +99,7 @@ var AnchorNoRef = function AnchorNoRef(_ref, ref) {
|
|
|
99
99
|
action: 'clicked',
|
|
100
100
|
componentName: componentName || 'Anchor',
|
|
101
101
|
packageName: "@atlaskit/primitives",
|
|
102
|
-
packageVersion: "
|
|
102
|
+
packageVersion: "20.0.0",
|
|
103
103
|
analyticsData: analyticsContext,
|
|
104
104
|
actionSubject: 'link'
|
|
105
105
|
});
|
|
@@ -91,7 +91,7 @@ var Pressable = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
|
91
91
|
action: 'clicked',
|
|
92
92
|
componentName: componentName || 'Pressable',
|
|
93
93
|
packageName: "@atlaskit/primitives",
|
|
94
|
-
packageVersion: "
|
|
94
|
+
packageVersion: "20.0.0",
|
|
95
95
|
analyticsData: analyticsContext,
|
|
96
96
|
actionSubject: 'button'
|
|
97
97
|
});
|
|
@@ -67,10 +67,10 @@ export var allSpaceMap = _objectSpread(_objectSpread({}, positiveSpaceMap), nega
|
|
|
67
67
|
|
|
68
68
|
/**
|
|
69
69
|
* THIS SECTION WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
|
|
70
|
-
* @codegen <<SignedSource::
|
|
70
|
+
* @codegen <<SignedSource::e8d2ee8bd083c5b6e6d3b0bec7a275a5>>
|
|
71
71
|
* @codegenId inverse-colors
|
|
72
72
|
* @codegenCommand yarn workspace @atlaskit/primitives codegen-styles
|
|
73
|
-
* @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-light.tsx <<SignedSource::
|
|
73
|
+
* @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-light.tsx <<SignedSource::89430472c8668e635450d1233437a9ca>>
|
|
74
74
|
*/
|
|
75
75
|
export var inverseColorMap = {
|
|
76
76
|
'color.background.neutral.bold': 'color.text.inverse',
|
|
@@ -99,7 +99,10 @@ export var inverseColorMap = {
|
|
|
99
99
|
'color.background.discovery.bold.pressed': 'color.text.inverse',
|
|
100
100
|
'color.background.information.bold': 'color.text.inverse',
|
|
101
101
|
'color.background.information.bold.hovered': 'color.text.inverse',
|
|
102
|
-
'color.background.information.bold.pressed': 'color.text.inverse'
|
|
102
|
+
'color.background.information.bold.pressed': 'color.text.inverse',
|
|
103
|
+
'color.rovo.background.brand.bold': 'color.text.inverse',
|
|
104
|
+
'color.rovo.background.brand.bold.hovered': 'color.text.inverse',
|
|
105
|
+
'color.rovo.background.brand.bold.pressed': 'color.text.inverse'
|
|
103
106
|
};
|
|
104
107
|
|
|
105
108
|
/**
|
|
@@ -108,11 +111,11 @@ export var inverseColorMap = {
|
|
|
108
111
|
|
|
109
112
|
/**
|
|
110
113
|
* THIS SECTION WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
|
|
111
|
-
* @codegen <<SignedSource::
|
|
114
|
+
* @codegen <<SignedSource::617e401f8358136781549b9d42338882>>
|
|
112
115
|
* @codegenId elevation
|
|
113
116
|
* @codegenCommand yarn workspace @atlaskit/primitives codegen-styles
|
|
114
117
|
* @codegenParams ["opacity", "shadow", "surface"]
|
|
115
|
-
* @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-light.tsx <<SignedSource::
|
|
118
|
+
* @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-light.tsx <<SignedSource::89430472c8668e635450d1233437a9ca>>
|
|
116
119
|
*/
|
|
117
120
|
export var opacityMap = {
|
|
118
121
|
'opacity.disabled': "var(--ds-opacity-disabled, 0.4)",
|
|
@@ -129,6 +132,7 @@ export var surfaceColorMap = {
|
|
|
129
132
|
'elevation.surface': "var(--ds-surface, #FFFFFF)",
|
|
130
133
|
'elevation.surface.hovered': "var(--ds-surface-hovered, #F0F1F2)",
|
|
131
134
|
'elevation.surface.pressed': "var(--ds-surface-pressed, #DDDEE1)",
|
|
135
|
+
'elevation.surface.container': "var(--ds-surface-container, #F0F1F2)",
|
|
132
136
|
'elevation.surface.overlay': "var(--ds-surface-overlay, #FFFFFF)",
|
|
133
137
|
'elevation.surface.overlay.hovered': "var(--ds-surface-overlay-hovered, #F0F1F2)",
|
|
134
138
|
'elevation.surface.overlay.pressed': "var(--ds-surface-overlay-pressed, #DDDEE1)",
|
|
@@ -143,11 +147,11 @@ export var surfaceColorMap = {
|
|
|
143
147
|
|
|
144
148
|
/**
|
|
145
149
|
* THIS SECTION WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
|
|
146
|
-
* @codegen <<SignedSource::
|
|
150
|
+
* @codegen <<SignedSource::ca867a1010665c5ed92cd318dcf507ae>>
|
|
147
151
|
* @codegenId colors
|
|
148
152
|
* @codegenCommand yarn workspace @atlaskit/primitives codegen-styles
|
|
149
153
|
* @codegenParams ["border", "background", "text", "fill"]
|
|
150
|
-
* @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-light.tsx <<SignedSource::
|
|
154
|
+
* @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-light.tsx <<SignedSource::89430472c8668e635450d1233437a9ca>>
|
|
151
155
|
*/
|
|
152
156
|
export var borderColorMap = {
|
|
153
157
|
'color.border': "var(--ds-border, #0B120E24)",
|
|
@@ -170,7 +174,7 @@ export var borderColorMap = {
|
|
|
170
174
|
'color.border.accent.magenta': "var(--ds-border-accent-magenta, #CD519D)",
|
|
171
175
|
'color.border.accent.magenta.subtle': "var(--ds-border-accent-magenta-subtle, #F797D2)",
|
|
172
176
|
'color.border.accent.gray': "var(--ds-border-accent-gray, #7D818A)",
|
|
173
|
-
'color.border.accent.gray.subtle': "var(--ds-border-accent-gray-subtle, #
|
|
177
|
+
'color.border.accent.gray.subtle': "var(--ds-border-accent-gray-subtle, #B7B9BE)",
|
|
174
178
|
'color.border.disabled': "var(--ds-border-disabled, #0515240F)",
|
|
175
179
|
'color.border.focused': "var(--ds-border-focused, #4688EC)",
|
|
176
180
|
'color.border.input': "var(--ds-border-input, #8C8F97)",
|
|
@@ -391,14 +395,18 @@ export var backgroundColorMap = {
|
|
|
391
395
|
'color.background.information.bold': "var(--ds-background-information-bold, #1868DB)",
|
|
392
396
|
'color.background.information.bold.hovered': "var(--ds-background-information-bold-hovered, #1558BC)",
|
|
393
397
|
'color.background.information.bold.pressed': "var(--ds-background-information-bold-pressed, #144794)",
|
|
398
|
+
'color.skeleton': "var(--ds-skeleton, #0515240F)",
|
|
399
|
+
'color.skeleton.subtle': "var(--ds-skeleton-subtle, #17171708)",
|
|
394
400
|
'color.blanket': "var(--ds-blanket, #050C1F75)",
|
|
395
401
|
'color.blanket.selected': "var(--ds-blanket-selected, #388BFF14)",
|
|
396
402
|
'color.blanket.danger': "var(--ds-blanket-danger, #EF5C4814)",
|
|
397
|
-
'color.
|
|
398
|
-
'color.
|
|
403
|
+
'color.rovo.background.brand.bold': "var(--ds-rovo-background-brand-bold, #000000)",
|
|
404
|
+
'color.rovo.background.brand.bold.hovered': "var(--ds-rovo-background-brand-bold-hovered, #1E1F21)",
|
|
405
|
+
'color.rovo.background.brand.bold.pressed': "var(--ds-rovo-background-brand-bold-pressed, #292A2E)",
|
|
399
406
|
'elevation.surface': "var(--ds-surface, #FFFFFF)",
|
|
400
407
|
'elevation.surface.hovered': "var(--ds-surface-hovered, #F0F1F2)",
|
|
401
408
|
'elevation.surface.pressed': "var(--ds-surface-pressed, #DDDEE1)",
|
|
409
|
+
'elevation.surface.container': "var(--ds-surface-container, #F0F1F2)",
|
|
402
410
|
'elevation.surface.overlay': "var(--ds-surface-overlay, #FFFFFF)",
|
|
403
411
|
'elevation.surface.overlay.hovered': "var(--ds-surface-overlay-hovered, #F0F1F2)",
|
|
404
412
|
'elevation.surface.overlay.pressed': "var(--ds-surface-overlay-pressed, #DDDEE1)",
|
|
@@ -37,7 +37,7 @@ export type BleedSpaceToken = 'space.025' | 'space.050' | 'space.100' | 'space.1
|
|
|
37
37
|
export type PositiveSpaceToken = 'space.0' | 'space.025' | 'space.050' | 'space.075' | 'space.100' | 'space.150' | 'space.200' | 'space.250' | 'space.300' | 'space.400' | 'space.500' | 'space.600' | 'space.800' | 'space.1000';
|
|
38
38
|
export type PaddingToken = PositiveSpaceToken;
|
|
39
39
|
export type GapToken = PositiveSpaceToken;
|
|
40
|
-
export type SurfaceColorToken = 'utility.elevation.surface.current' | 'elevation.surface' | 'elevation.surface.overlay' | 'elevation.surface.raised' | 'elevation.surface.sunken';
|
|
40
|
+
export type SurfaceColorToken = 'utility.elevation.surface.current' | 'elevation.surface' | 'elevation.surface.container' | 'elevation.surface.overlay' | 'elevation.surface.raised' | 'elevation.surface.sunken';
|
|
41
41
|
export type TextAlign = 'center' | 'end' | 'start';
|
|
42
42
|
export type TextColor = 'color.text' | 'color.text.accent.lime' | 'color.text.accent.lime.bolder' | 'color.text.accent.red' | 'color.text.accent.red.bolder' | 'color.text.accent.orange' | 'color.text.accent.orange.bolder' | 'color.text.accent.yellow' | 'color.text.accent.yellow.bolder' | 'color.text.accent.green' | 'color.text.accent.green.bolder' | 'color.text.accent.teal' | 'color.text.accent.teal.bolder' | 'color.text.accent.blue' | 'color.text.accent.blue.bolder' | 'color.text.accent.purple' | 'color.text.accent.purple.bolder' | 'color.text.accent.magenta' | 'color.text.accent.magenta.bolder' | 'color.text.accent.gray' | 'color.text.accent.gray.bolder' | 'color.text.disabled' | 'color.text.inverse' | 'color.text.selected' | 'color.text.brand' | 'color.text.danger' | 'color.text.warning' | 'color.text.warning.inverse' | 'color.text.success' | 'color.text.discovery' | 'color.text.information' | 'color.text.subtlest' | 'color.text.subtle' | 'color.link' | 'color.link.pressed' | 'color.link.visited' | 'color.link.visited.pressed';
|
|
43
43
|
export type FontSize = 'small' | 'medium' | 'large';
|
|
@@ -3,4 +3,4 @@
|
|
|
3
3
|
* as we typically want to remove these from allowed elements.
|
|
4
4
|
*/
|
|
5
5
|
export type SVGElements = 'svg' | 'animate' | 'animateMotion' | 'animateTransform' | 'circle' | 'clipPath' | 'defs' | 'desc' | 'ellipse' | 'feBlend' | 'feColorMatrix' | 'feComponentTransfer' | 'feComposite' | 'feConvolveMatrix' | 'feDiffuseLighting' | 'feDisplacementMap' | 'feDistantLight' | 'feDropShadow' | 'feFlood' | 'feFuncA' | 'feFuncB' | 'feFuncG' | 'feFuncR' | 'feGaussianBlur' | 'feImage' | 'feMerge' | 'feMergeNode' | 'feMorphology' | 'feOffset' | 'fePointLight' | 'feSpecularLighting' | 'feSpotLight' | 'feTile' | 'feTurbulence' | 'filter' | 'foreignObject' | 'g' | 'image' | 'line' | 'linearGradient' | 'marker' | 'mask' | 'metadata' | 'mpath' | 'path' | 'pattern' | 'polygon' | 'polyline' | 'radialGradient' | 'rect' | 'stop' | 'switch' | 'symbol' | 'text' | 'textPath' | 'tspan' | 'use' | 'view';
|
|
6
|
-
export type BackgroundColorToken = 'color.background.accent.lime.subtlest' | 'color.background.accent.lime.subtlest.hovered' | 'color.background.accent.lime.subtlest.pressed' | 'color.background.accent.lime.subtler' | 'color.background.accent.lime.subtler.hovered' | 'color.background.accent.lime.subtler.pressed' | 'color.background.accent.lime.subtle' | 'color.background.accent.lime.subtle.hovered' | 'color.background.accent.lime.subtle.pressed' | 'color.background.accent.lime.bolder' | 'color.background.accent.lime.bolder.hovered' | 'color.background.accent.lime.bolder.pressed' | 'color.background.accent.red.subtlest' | 'color.background.accent.red.subtlest.hovered' | 'color.background.accent.red.subtlest.pressed' | 'color.background.accent.red.subtler' | 'color.background.accent.red.subtler.hovered' | 'color.background.accent.red.subtler.pressed' | 'color.background.accent.red.subtle' | 'color.background.accent.red.subtle.hovered' | 'color.background.accent.red.subtle.pressed' | 'color.background.accent.red.bolder' | 'color.background.accent.red.bolder.hovered' | 'color.background.accent.red.bolder.pressed' | 'color.background.accent.orange.subtlest' | 'color.background.accent.orange.subtlest.hovered' | 'color.background.accent.orange.subtlest.pressed' | 'color.background.accent.orange.subtler' | 'color.background.accent.orange.subtler.hovered' | 'color.background.accent.orange.subtler.pressed' | 'color.background.accent.orange.subtle' | 'color.background.accent.orange.subtle.hovered' | 'color.background.accent.orange.subtle.pressed' | 'color.background.accent.orange.bolder' | 'color.background.accent.orange.bolder.hovered' | 'color.background.accent.orange.bolder.pressed' | 'color.background.accent.yellow.subtlest' | 'color.background.accent.yellow.subtlest.hovered' | 'color.background.accent.yellow.subtlest.pressed' | 'color.background.accent.yellow.subtler' | 'color.background.accent.yellow.subtler.hovered' | 'color.background.accent.yellow.subtler.pressed' | 'color.background.accent.yellow.subtle' | 'color.background.accent.yellow.subtle.hovered' | 'color.background.accent.yellow.subtle.pressed' | 'color.background.accent.yellow.bolder' | 'color.background.accent.yellow.bolder.hovered' | 'color.background.accent.yellow.bolder.pressed' | 'color.background.accent.green.subtlest' | 'color.background.accent.green.subtlest.hovered' | 'color.background.accent.green.subtlest.pressed' | 'color.background.accent.green.subtler' | 'color.background.accent.green.subtler.hovered' | 'color.background.accent.green.subtler.pressed' | 'color.background.accent.green.subtle' | 'color.background.accent.green.subtle.hovered' | 'color.background.accent.green.subtle.pressed' | 'color.background.accent.green.bolder' | 'color.background.accent.green.bolder.hovered' | 'color.background.accent.green.bolder.pressed' | 'color.background.accent.teal.subtlest' | 'color.background.accent.teal.subtlest.hovered' | 'color.background.accent.teal.subtlest.pressed' | 'color.background.accent.teal.subtler' | 'color.background.accent.teal.subtler.hovered' | 'color.background.accent.teal.subtler.pressed' | 'color.background.accent.teal.subtle' | 'color.background.accent.teal.subtle.hovered' | 'color.background.accent.teal.subtle.pressed' | 'color.background.accent.teal.bolder' | 'color.background.accent.teal.bolder.hovered' | 'color.background.accent.teal.bolder.pressed' | 'color.background.accent.blue.subtlest' | 'color.background.accent.blue.subtlest.hovered' | 'color.background.accent.blue.subtlest.pressed' | 'color.background.accent.blue.subtler' | 'color.background.accent.blue.subtler.hovered' | 'color.background.accent.blue.subtler.pressed' | 'color.background.accent.blue.subtle' | 'color.background.accent.blue.subtle.hovered' | 'color.background.accent.blue.subtle.pressed' | 'color.background.accent.blue.bolder' | 'color.background.accent.blue.bolder.hovered' | 'color.background.accent.blue.bolder.pressed' | 'color.background.accent.purple.subtlest' | 'color.background.accent.purple.subtlest.hovered' | 'color.background.accent.purple.subtlest.pressed' | 'color.background.accent.purple.subtler' | 'color.background.accent.purple.subtler.hovered' | 'color.background.accent.purple.subtler.pressed' | 'color.background.accent.purple.subtle' | 'color.background.accent.purple.subtle.hovered' | 'color.background.accent.purple.subtle.pressed' | 'color.background.accent.purple.bolder' | 'color.background.accent.purple.bolder.hovered' | 'color.background.accent.purple.bolder.pressed' | 'color.background.accent.magenta.subtlest' | 'color.background.accent.magenta.subtlest.hovered' | 'color.background.accent.magenta.subtlest.pressed' | 'color.background.accent.magenta.subtler' | 'color.background.accent.magenta.subtler.hovered' | 'color.background.accent.magenta.subtler.pressed' | 'color.background.accent.magenta.subtle' | 'color.background.accent.magenta.subtle.hovered' | 'color.background.accent.magenta.subtle.pressed' | 'color.background.accent.magenta.bolder' | 'color.background.accent.magenta.bolder.hovered' | 'color.background.accent.magenta.bolder.pressed' | 'color.background.accent.gray.subtlest' | 'color.background.accent.gray.subtlest.hovered' | 'color.background.accent.gray.subtlest.pressed' | 'color.background.accent.gray.subtler' | 'color.background.accent.gray.subtler.hovered' | 'color.background.accent.gray.subtler.pressed' | 'color.background.accent.gray.subtle' | 'color.background.accent.gray.subtle.hovered' | 'color.background.accent.gray.subtle.pressed' | 'color.background.accent.gray.bolder' | 'color.background.accent.gray.bolder.hovered' | 'color.background.accent.gray.bolder.pressed' | 'color.background.disabled' | 'color.background.input' | 'color.background.input.hovered' | 'color.background.input.pressed' | 'color.background.inverse.subtle' | 'color.background.inverse.subtle.hovered' | 'color.background.inverse.subtle.pressed' | 'color.background.neutral' | 'color.background.neutral.hovered' | 'color.background.neutral.pressed' | 'color.background.neutral.subtle' | 'color.background.neutral.subtle.hovered' | 'color.background.neutral.subtle.pressed' | 'color.background.neutral.bold' | 'color.background.neutral.bold.hovered' | 'color.background.neutral.bold.pressed' | 'color.background.selected' | 'color.background.selected.hovered' | 'color.background.selected.pressed' | 'color.background.selected.bold' | 'color.background.selected.bold.hovered' | 'color.background.selected.bold.pressed' | 'color.background.brand.subtlest' | 'color.background.brand.subtlest.hovered' | 'color.background.brand.subtlest.pressed' | 'color.background.brand.bold' | 'color.background.brand.bold.hovered' | 'color.background.brand.bold.pressed' | 'color.background.brand.boldest' | 'color.background.brand.boldest.hovered' | 'color.background.brand.boldest.pressed' | 'color.background.danger' | 'color.background.danger.hovered' | 'color.background.danger.pressed' | 'color.background.danger.subtler' | 'color.background.danger.subtler.hovered' | 'color.background.danger.subtler.pressed' | 'color.background.danger.subtle' | 'color.background.danger.bold' | 'color.background.danger.bold.hovered' | 'color.background.danger.bold.pressed' | 'color.background.warning' | 'color.background.warning.hovered' | 'color.background.warning.pressed' | 'color.background.warning.subtler' | 'color.background.warning.subtler.hovered' | 'color.background.warning.subtler.pressed' | 'color.background.warning.subtle' | 'color.background.warning.bold' | 'color.background.warning.bold.hovered' | 'color.background.warning.bold.pressed' | 'color.background.success' | 'color.background.success.hovered' | 'color.background.success.pressed' | 'color.background.success.subtler' | 'color.background.success.subtler.hovered' | 'color.background.success.subtler.pressed' | 'color.background.success.subtle' | 'color.background.success.bold' | 'color.background.success.bold.hovered' | 'color.background.success.bold.pressed' | 'color.background.discovery' | 'color.background.discovery.hovered' | 'color.background.discovery.pressed' | 'color.background.discovery.subtler' | 'color.background.discovery.subtler.hovered' | 'color.background.discovery.subtler.pressed' | 'color.background.discovery.subtle' | 'color.background.discovery.bold' | 'color.background.discovery.bold.hovered' | 'color.background.discovery.bold.pressed' | 'color.background.information' | 'color.background.information.hovered' | 'color.background.information.pressed' | 'color.background.information.subtler' | 'color.background.information.subtler.hovered' | 'color.background.information.subtler.pressed' | 'color.background.information.subtle' | 'color.background.information.bold' | 'color.background.information.bold.hovered' | 'color.background.information.bold.pressed' | 'color.blanket' | 'color.blanket.selected' | 'color.blanket.danger' | 'color.skeleton' | 'color.skeleton.subtle' | 'elevation.surface' | 'elevation.surface.hovered' | 'elevation.surface.pressed' | 'elevation.surface.overlay' | 'elevation.surface.overlay.hovered' | 'elevation.surface.overlay.pressed' | 'elevation.surface.raised' | 'elevation.surface.raised.hovered' | 'elevation.surface.raised.pressed' | 'elevation.surface.sunken' | 'utility.elevation.surface.current';
|
|
6
|
+
export type BackgroundColorToken = 'color.rovo.background.brand.bold' | 'color.rovo.background.brand.bold.hovered' | 'color.rovo.background.brand.bold.pressed' | 'color.background.accent.lime.subtlest' | 'color.background.accent.lime.subtlest.hovered' | 'color.background.accent.lime.subtlest.pressed' | 'color.background.accent.lime.subtler' | 'color.background.accent.lime.subtler.hovered' | 'color.background.accent.lime.subtler.pressed' | 'color.background.accent.lime.subtle' | 'color.background.accent.lime.subtle.hovered' | 'color.background.accent.lime.subtle.pressed' | 'color.background.accent.lime.bolder' | 'color.background.accent.lime.bolder.hovered' | 'color.background.accent.lime.bolder.pressed' | 'color.background.accent.red.subtlest' | 'color.background.accent.red.subtlest.hovered' | 'color.background.accent.red.subtlest.pressed' | 'color.background.accent.red.subtler' | 'color.background.accent.red.subtler.hovered' | 'color.background.accent.red.subtler.pressed' | 'color.background.accent.red.subtle' | 'color.background.accent.red.subtle.hovered' | 'color.background.accent.red.subtle.pressed' | 'color.background.accent.red.bolder' | 'color.background.accent.red.bolder.hovered' | 'color.background.accent.red.bolder.pressed' | 'color.background.accent.orange.subtlest' | 'color.background.accent.orange.subtlest.hovered' | 'color.background.accent.orange.subtlest.pressed' | 'color.background.accent.orange.subtler' | 'color.background.accent.orange.subtler.hovered' | 'color.background.accent.orange.subtler.pressed' | 'color.background.accent.orange.subtle' | 'color.background.accent.orange.subtle.hovered' | 'color.background.accent.orange.subtle.pressed' | 'color.background.accent.orange.bolder' | 'color.background.accent.orange.bolder.hovered' | 'color.background.accent.orange.bolder.pressed' | 'color.background.accent.yellow.subtlest' | 'color.background.accent.yellow.subtlest.hovered' | 'color.background.accent.yellow.subtlest.pressed' | 'color.background.accent.yellow.subtler' | 'color.background.accent.yellow.subtler.hovered' | 'color.background.accent.yellow.subtler.pressed' | 'color.background.accent.yellow.subtle' | 'color.background.accent.yellow.subtle.hovered' | 'color.background.accent.yellow.subtle.pressed' | 'color.background.accent.yellow.bolder' | 'color.background.accent.yellow.bolder.hovered' | 'color.background.accent.yellow.bolder.pressed' | 'color.background.accent.green.subtlest' | 'color.background.accent.green.subtlest.hovered' | 'color.background.accent.green.subtlest.pressed' | 'color.background.accent.green.subtler' | 'color.background.accent.green.subtler.hovered' | 'color.background.accent.green.subtler.pressed' | 'color.background.accent.green.subtle' | 'color.background.accent.green.subtle.hovered' | 'color.background.accent.green.subtle.pressed' | 'color.background.accent.green.bolder' | 'color.background.accent.green.bolder.hovered' | 'color.background.accent.green.bolder.pressed' | 'color.background.accent.teal.subtlest' | 'color.background.accent.teal.subtlest.hovered' | 'color.background.accent.teal.subtlest.pressed' | 'color.background.accent.teal.subtler' | 'color.background.accent.teal.subtler.hovered' | 'color.background.accent.teal.subtler.pressed' | 'color.background.accent.teal.subtle' | 'color.background.accent.teal.subtle.hovered' | 'color.background.accent.teal.subtle.pressed' | 'color.background.accent.teal.bolder' | 'color.background.accent.teal.bolder.hovered' | 'color.background.accent.teal.bolder.pressed' | 'color.background.accent.blue.subtlest' | 'color.background.accent.blue.subtlest.hovered' | 'color.background.accent.blue.subtlest.pressed' | 'color.background.accent.blue.subtler' | 'color.background.accent.blue.subtler.hovered' | 'color.background.accent.blue.subtler.pressed' | 'color.background.accent.blue.subtle' | 'color.background.accent.blue.subtle.hovered' | 'color.background.accent.blue.subtle.pressed' | 'color.background.accent.blue.bolder' | 'color.background.accent.blue.bolder.hovered' | 'color.background.accent.blue.bolder.pressed' | 'color.background.accent.purple.subtlest' | 'color.background.accent.purple.subtlest.hovered' | 'color.background.accent.purple.subtlest.pressed' | 'color.background.accent.purple.subtler' | 'color.background.accent.purple.subtler.hovered' | 'color.background.accent.purple.subtler.pressed' | 'color.background.accent.purple.subtle' | 'color.background.accent.purple.subtle.hovered' | 'color.background.accent.purple.subtle.pressed' | 'color.background.accent.purple.bolder' | 'color.background.accent.purple.bolder.hovered' | 'color.background.accent.purple.bolder.pressed' | 'color.background.accent.magenta.subtlest' | 'color.background.accent.magenta.subtlest.hovered' | 'color.background.accent.magenta.subtlest.pressed' | 'color.background.accent.magenta.subtler' | 'color.background.accent.magenta.subtler.hovered' | 'color.background.accent.magenta.subtler.pressed' | 'color.background.accent.magenta.subtle' | 'color.background.accent.magenta.subtle.hovered' | 'color.background.accent.magenta.subtle.pressed' | 'color.background.accent.magenta.bolder' | 'color.background.accent.magenta.bolder.hovered' | 'color.background.accent.magenta.bolder.pressed' | 'color.background.accent.gray.subtlest' | 'color.background.accent.gray.subtlest.hovered' | 'color.background.accent.gray.subtlest.pressed' | 'color.background.accent.gray.subtler' | 'color.background.accent.gray.subtler.hovered' | 'color.background.accent.gray.subtler.pressed' | 'color.background.accent.gray.subtle' | 'color.background.accent.gray.subtle.hovered' | 'color.background.accent.gray.subtle.pressed' | 'color.background.accent.gray.bolder' | 'color.background.accent.gray.bolder.hovered' | 'color.background.accent.gray.bolder.pressed' | 'color.background.disabled' | 'color.background.input' | 'color.background.input.hovered' | 'color.background.input.pressed' | 'color.background.inverse.subtle' | 'color.background.inverse.subtle.hovered' | 'color.background.inverse.subtle.pressed' | 'color.background.neutral' | 'color.background.neutral.hovered' | 'color.background.neutral.pressed' | 'color.background.neutral.subtle' | 'color.background.neutral.subtle.hovered' | 'color.background.neutral.subtle.pressed' | 'color.background.neutral.bold' | 'color.background.neutral.bold.hovered' | 'color.background.neutral.bold.pressed' | 'color.background.selected' | 'color.background.selected.hovered' | 'color.background.selected.pressed' | 'color.background.selected.bold' | 'color.background.selected.bold.hovered' | 'color.background.selected.bold.pressed' | 'color.background.brand.subtlest' | 'color.background.brand.subtlest.hovered' | 'color.background.brand.subtlest.pressed' | 'color.background.brand.bold' | 'color.background.brand.bold.hovered' | 'color.background.brand.bold.pressed' | 'color.background.brand.boldest' | 'color.background.brand.boldest.hovered' | 'color.background.brand.boldest.pressed' | 'color.background.danger' | 'color.background.danger.hovered' | 'color.background.danger.pressed' | 'color.background.danger.subtler' | 'color.background.danger.subtler.hovered' | 'color.background.danger.subtler.pressed' | 'color.background.danger.subtle' | 'color.background.danger.bold' | 'color.background.danger.bold.hovered' | 'color.background.danger.bold.pressed' | 'color.background.warning' | 'color.background.warning.hovered' | 'color.background.warning.pressed' | 'color.background.warning.subtler' | 'color.background.warning.subtler.hovered' | 'color.background.warning.subtler.pressed' | 'color.background.warning.subtle' | 'color.background.warning.bold' | 'color.background.warning.bold.hovered' | 'color.background.warning.bold.pressed' | 'color.background.success' | 'color.background.success.hovered' | 'color.background.success.pressed' | 'color.background.success.subtler' | 'color.background.success.subtler.hovered' | 'color.background.success.subtler.pressed' | 'color.background.success.subtle' | 'color.background.success.bold' | 'color.background.success.bold.hovered' | 'color.background.success.bold.pressed' | 'color.background.discovery' | 'color.background.discovery.hovered' | 'color.background.discovery.pressed' | 'color.background.discovery.subtler' | 'color.background.discovery.subtler.hovered' | 'color.background.discovery.subtler.pressed' | 'color.background.discovery.subtle' | 'color.background.discovery.bold' | 'color.background.discovery.bold.hovered' | 'color.background.discovery.bold.pressed' | 'color.background.information' | 'color.background.information.hovered' | 'color.background.information.pressed' | 'color.background.information.subtler' | 'color.background.information.subtler.hovered' | 'color.background.information.subtler.pressed' | 'color.background.information.subtle' | 'color.background.information.bold' | 'color.background.information.bold.hovered' | 'color.background.information.bold.pressed' | 'color.blanket' | 'color.blanket.selected' | 'color.blanket.danger' | 'color.skeleton' | 'color.skeleton.subtle' | 'elevation.surface' | 'elevation.surface.hovered' | 'elevation.surface.pressed' | 'elevation.surface.container' | 'elevation.surface.overlay' | 'elevation.surface.overlay.hovered' | 'elevation.surface.overlay.pressed' | 'elevation.surface.raised' | 'elevation.surface.raised.hovered' | 'elevation.surface.raised.pressed' | 'elevation.surface.sunken' | 'utility.elevation.surface.current';
|
|
@@ -90,10 +90,10 @@ export type AllSpace = keyof typeof allSpaceMap;
|
|
|
90
90
|
*/
|
|
91
91
|
/**
|
|
92
92
|
* THIS SECTION WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
|
|
93
|
-
* @codegen <<SignedSource::
|
|
93
|
+
* @codegen <<SignedSource::e8d2ee8bd083c5b6e6d3b0bec7a275a5>>
|
|
94
94
|
* @codegenId inverse-colors
|
|
95
95
|
* @codegenCommand yarn workspace @atlaskit/primitives codegen-styles
|
|
96
|
-
* @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-light.tsx <<SignedSource::
|
|
96
|
+
* @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-light.tsx <<SignedSource::89430472c8668e635450d1233437a9ca>>
|
|
97
97
|
*/
|
|
98
98
|
export declare const inverseColorMap: {
|
|
99
99
|
'color.background.neutral.bold': 'color.text.inverse';
|
|
@@ -123,17 +123,20 @@ export declare const inverseColorMap: {
|
|
|
123
123
|
'color.background.information.bold': 'color.text.inverse';
|
|
124
124
|
'color.background.information.bold.hovered': 'color.text.inverse';
|
|
125
125
|
'color.background.information.bold.pressed': 'color.text.inverse';
|
|
126
|
+
'color.rovo.background.brand.bold': 'color.text.inverse';
|
|
127
|
+
'color.rovo.background.brand.bold.hovered': 'color.text.inverse';
|
|
128
|
+
'color.rovo.background.brand.bold.pressed': 'color.text.inverse';
|
|
126
129
|
};
|
|
127
130
|
/**
|
|
128
131
|
* @codegenEnd
|
|
129
132
|
*/
|
|
130
133
|
/**
|
|
131
134
|
* THIS SECTION WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
|
|
132
|
-
* @codegen <<SignedSource::
|
|
135
|
+
* @codegen <<SignedSource::617e401f8358136781549b9d42338882>>
|
|
133
136
|
* @codegenId elevation
|
|
134
137
|
* @codegenCommand yarn workspace @atlaskit/primitives codegen-styles
|
|
135
138
|
* @codegenParams ["opacity", "shadow", "surface"]
|
|
136
|
-
* @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-light.tsx <<SignedSource::
|
|
139
|
+
* @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-light.tsx <<SignedSource::89430472c8668e635450d1233437a9ca>>
|
|
137
140
|
*/
|
|
138
141
|
export declare const opacityMap: {
|
|
139
142
|
'opacity.disabled': 'var(--ds-opacity-disabled)';
|
|
@@ -152,6 +155,7 @@ export declare const surfaceColorMap: {
|
|
|
152
155
|
'elevation.surface': 'var(--ds-surface)';
|
|
153
156
|
'elevation.surface.hovered': 'var(--ds-surface-hovered)';
|
|
154
157
|
'elevation.surface.pressed': 'var(--ds-surface-pressed)';
|
|
158
|
+
'elevation.surface.container': 'var(--ds-surface-container)';
|
|
155
159
|
'elevation.surface.overlay': 'var(--ds-surface-overlay)';
|
|
156
160
|
'elevation.surface.overlay.hovered': 'var(--ds-surface-overlay-hovered)';
|
|
157
161
|
'elevation.surface.overlay.pressed': 'var(--ds-surface-overlay-pressed)';
|
|
@@ -166,11 +170,11 @@ export type SurfaceColor = keyof typeof surfaceColorMap;
|
|
|
166
170
|
*/
|
|
167
171
|
/**
|
|
168
172
|
* THIS SECTION WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
|
|
169
|
-
* @codegen <<SignedSource::
|
|
173
|
+
* @codegen <<SignedSource::ca867a1010665c5ed92cd318dcf507ae>>
|
|
170
174
|
* @codegenId colors
|
|
171
175
|
* @codegenCommand yarn workspace @atlaskit/primitives codegen-styles
|
|
172
176
|
* @codegenParams ["border", "background", "text", "fill"]
|
|
173
|
-
* @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-light.tsx <<SignedSource::
|
|
177
|
+
* @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-light.tsx <<SignedSource::89430472c8668e635450d1233437a9ca>>
|
|
174
178
|
*/
|
|
175
179
|
export declare const borderColorMap: {
|
|
176
180
|
'color.border': 'var(--ds-border)';
|
|
@@ -415,14 +419,18 @@ export declare const backgroundColorMap: {
|
|
|
415
419
|
'color.background.information.bold': 'var(--ds-background-information-bold)';
|
|
416
420
|
'color.background.information.bold.hovered': 'var(--ds-background-information-bold-hovered)';
|
|
417
421
|
'color.background.information.bold.pressed': 'var(--ds-background-information-bold-pressed)';
|
|
422
|
+
'color.skeleton': 'var(--ds-skeleton)';
|
|
423
|
+
'color.skeleton.subtle': 'var(--ds-skeleton-subtle)';
|
|
418
424
|
'color.blanket': 'var(--ds-blanket)';
|
|
419
425
|
'color.blanket.selected': 'var(--ds-blanket-selected)';
|
|
420
426
|
'color.blanket.danger': 'var(--ds-blanket-danger)';
|
|
421
|
-
'color.
|
|
422
|
-
'color.
|
|
427
|
+
'color.rovo.background.brand.bold': 'var(--ds-rovo-background-brand-bold)';
|
|
428
|
+
'color.rovo.background.brand.bold.hovered': 'var(--ds-rovo-background-brand-bold-hovered)';
|
|
429
|
+
'color.rovo.background.brand.bold.pressed': 'var(--ds-rovo-background-brand-bold-pressed)';
|
|
423
430
|
'elevation.surface': 'var(--ds-surface)';
|
|
424
431
|
'elevation.surface.hovered': 'var(--ds-surface-hovered)';
|
|
425
432
|
'elevation.surface.pressed': 'var(--ds-surface-pressed)';
|
|
433
|
+
'elevation.surface.container': 'var(--ds-surface-container)';
|
|
426
434
|
'elevation.surface.overlay': 'var(--ds-surface-overlay)';
|
|
427
435
|
'elevation.surface.overlay.hovered': 'var(--ds-surface-overlay-hovered)';
|
|
428
436
|
'elevation.surface.overlay.pressed': 'var(--ds-surface-overlay-pressed)';
|
package/flex/package.json
CHANGED
|
@@ -6,12 +6,5 @@
|
|
|
6
6
|
"sideEffects": [
|
|
7
7
|
"**/*.compiled.css"
|
|
8
8
|
],
|
|
9
|
-
"types": "../dist/types/entry-points/flex.d.ts"
|
|
10
|
-
"typesVersions": {
|
|
11
|
-
">=4.5 <5.9": {
|
|
12
|
-
"*": [
|
|
13
|
-
"../dist/types-ts4.5/entry-points/flex.d.ts"
|
|
14
|
-
]
|
|
15
|
-
}
|
|
16
|
-
}
|
|
9
|
+
"types": "../dist/types/entry-points/flex.d.ts"
|
|
17
10
|
}
|
package/grid/package.json
CHANGED
|
@@ -6,12 +6,5 @@
|
|
|
6
6
|
"sideEffects": [
|
|
7
7
|
"**/*.compiled.css"
|
|
8
8
|
],
|
|
9
|
-
"types": "../dist/types/entry-points/grid.d.ts"
|
|
10
|
-
"typesVersions": {
|
|
11
|
-
">=4.5 <5.9": {
|
|
12
|
-
"*": [
|
|
13
|
-
"../dist/types-ts4.5/entry-points/grid.d.ts"
|
|
14
|
-
]
|
|
15
|
-
}
|
|
16
|
-
}
|
|
9
|
+
"types": "../dist/types/entry-points/grid.d.ts"
|
|
17
10
|
}
|
package/inline/package.json
CHANGED
|
@@ -6,12 +6,5 @@
|
|
|
6
6
|
"sideEffects": [
|
|
7
7
|
"**/*.compiled.css"
|
|
8
8
|
],
|
|
9
|
-
"types": "../dist/types/entry-points/inline.d.ts"
|
|
10
|
-
"typesVersions": {
|
|
11
|
-
">=4.5 <5.9": {
|
|
12
|
-
"*": [
|
|
13
|
-
"../dist/types-ts4.5/entry-points/inline.d.ts"
|
|
14
|
-
]
|
|
15
|
-
}
|
|
16
|
-
}
|
|
9
|
+
"types": "../dist/types/entry-points/inline.d.ts"
|
|
17
10
|
}
|
|
@@ -6,12 +6,5 @@
|
|
|
6
6
|
"sideEffects": [
|
|
7
7
|
"**/*.compiled.css"
|
|
8
8
|
],
|
|
9
|
-
"types": "../dist/types/entry-points/media-helper.d.ts"
|
|
10
|
-
"typesVersions": {
|
|
11
|
-
">=4.5 <5.9": {
|
|
12
|
-
"*": [
|
|
13
|
-
"../dist/types-ts4.5/entry-points/media-helper.d.ts"
|
|
14
|
-
]
|
|
15
|
-
}
|
|
16
|
-
}
|
|
9
|
+
"types": "../dist/types/entry-points/media-helper.d.ts"
|
|
17
10
|
}
|
package/metric-text/package.json
CHANGED
|
@@ -6,12 +6,5 @@
|
|
|
6
6
|
"sideEffects": [
|
|
7
7
|
"**/*.compiled.css"
|
|
8
8
|
],
|
|
9
|
-
"types": "../dist/types/entry-points/metric-text.d.ts"
|
|
10
|
-
"typesVersions": {
|
|
11
|
-
">=4.5 <5.9": {
|
|
12
|
-
"*": [
|
|
13
|
-
"../dist/types-ts4.5/entry-points/metric-text.d.ts"
|
|
14
|
-
]
|
|
15
|
-
}
|
|
16
|
-
}
|
|
9
|
+
"types": "../dist/types/entry-points/metric-text.d.ts"
|
|
17
10
|
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@atlaskit/primitives",
|
|
3
|
-
"version": "
|
|
3
|
+
"version": "20.0.1",
|
|
4
4
|
"description": "Primitives are token-backed low-level building blocks.",
|
|
5
5
|
"publishConfig": {
|
|
6
6
|
"registry": "https://registry.npmjs.org/"
|
|
@@ -139,13 +139,14 @@
|
|
|
139
139
|
"codegen-styles": "ts-node -r tsconfig-paths/register ./scripts/codegen-styles.tsx"
|
|
140
140
|
},
|
|
141
141
|
"dependencies": {
|
|
142
|
-
"@atlaskit/analytics-next": "^
|
|
143
|
-
"@atlaskit/app-provider": "^
|
|
144
|
-
"@atlaskit/css": "^0.
|
|
145
|
-
"@atlaskit/ds-lib": "^
|
|
146
|
-
"@atlaskit/interaction-context": "^
|
|
147
|
-
"@atlaskit/tokens": "^
|
|
148
|
-
"@atlaskit/visually-hidden": "^
|
|
142
|
+
"@atlaskit/analytics-next": "^12.0.0",
|
|
143
|
+
"@atlaskit/app-provider": "^5.0.0",
|
|
144
|
+
"@atlaskit/css": "^1.0.0",
|
|
145
|
+
"@atlaskit/ds-lib": "^8.0.0",
|
|
146
|
+
"@atlaskit/interaction-context": "^4.0.0",
|
|
147
|
+
"@atlaskit/tokens": "^15.0.0",
|
|
148
|
+
"@atlaskit/visually-hidden": "^4.0.0",
|
|
149
|
+
"@atlassian/react-compiler-gating": "^0.2.0",
|
|
149
150
|
"@babel/runtime": "^7.0.0",
|
|
150
151
|
"@compiled/react": "^0.20.0",
|
|
151
152
|
"@emotion/react": "^11.7.1",
|
|
@@ -161,30 +162,29 @@
|
|
|
161
162
|
"@af/formatting": "workspace:^",
|
|
162
163
|
"@af/integration-testing": "workspace:^",
|
|
163
164
|
"@af/visual-regression": "workspace:^",
|
|
164
|
-
"@atlaskit/avatar": "^
|
|
165
|
-
"@atlaskit/button": "^
|
|
166
|
-
"@atlaskit/checkbox": "^
|
|
167
|
-
"@atlaskit/code": "^
|
|
168
|
-
"@atlaskit/docs": "^
|
|
169
|
-
"@atlaskit/dropdown-menu": "^
|
|
170
|
-
"@atlaskit/flag": "^
|
|
171
|
-
"@atlaskit/form": "^
|
|
172
|
-
"@atlaskit/heading": "^
|
|
173
|
-
"@atlaskit/icon": "^
|
|
174
|
-
"@atlaskit/image": "^
|
|
175
|
-
"@atlaskit/link": "^
|
|
176
|
-
"@atlaskit/logo": "^
|
|
177
|
-
"@atlaskit/lozenge": "^
|
|
178
|
-
"@atlaskit/motion": "^
|
|
179
|
-
"@atlaskit/object": "^
|
|
180
|
-
"@atlaskit/range": "^
|
|
181
|
-
"@atlaskit/section-message": "^
|
|
182
|
-
"@atlaskit/textfield": "^
|
|
183
|
-
"@atlaskit/toggle": "^
|
|
184
|
-
"@atlaskit/tooltip": "^
|
|
165
|
+
"@atlaskit/avatar": "^26.0.0",
|
|
166
|
+
"@atlaskit/button": "^24.1.0",
|
|
167
|
+
"@atlaskit/checkbox": "^18.0.0",
|
|
168
|
+
"@atlaskit/code": "^18.0.0",
|
|
169
|
+
"@atlaskit/docs": "^12.0.0",
|
|
170
|
+
"@atlaskit/dropdown-menu": "^17.0.0",
|
|
171
|
+
"@atlaskit/flag": "^18.0.0",
|
|
172
|
+
"@atlaskit/form": "^16.0.0",
|
|
173
|
+
"@atlaskit/heading": "^6.0.0",
|
|
174
|
+
"@atlaskit/icon": "^36.0.0",
|
|
175
|
+
"@atlaskit/image": "^4.0.0",
|
|
176
|
+
"@atlaskit/link": "^4.0.0",
|
|
177
|
+
"@atlaskit/logo": "^21.1.0",
|
|
178
|
+
"@atlaskit/lozenge": "^14.0.0",
|
|
179
|
+
"@atlaskit/motion": "^7.1.0",
|
|
180
|
+
"@atlaskit/object": "^2.0.0",
|
|
181
|
+
"@atlaskit/range": "^11.0.0",
|
|
182
|
+
"@atlaskit/section-message": "^9.1.0",
|
|
183
|
+
"@atlaskit/textfield": "^9.0.0",
|
|
184
|
+
"@atlaskit/toggle": "^17.0.0",
|
|
185
|
+
"@atlaskit/tooltip": "^23.0.0",
|
|
185
186
|
"@atlassian/analytics-bridge": "^0.8.0",
|
|
186
187
|
"@atlassian/codegen": "^0.2.0",
|
|
187
|
-
"@atlassian/react-compiler-gating": "workspace:^",
|
|
188
188
|
"@atlassian/ssr-tests": "workspace:^",
|
|
189
189
|
"@atlassian/structured-docs-types": "workspace:^",
|
|
190
190
|
"@testing-library/react": "^16.3.0",
|
|
@@ -196,13 +196,5 @@
|
|
|
196
196
|
"react-resource-router": "^0.20.0",
|
|
197
197
|
"ts-node": "^10.9.1"
|
|
198
198
|
},
|
|
199
|
-
"homepage": "https://atlassian.design/components/primitives/overview/"
|
|
200
|
-
"typesVersions": {
|
|
201
|
-
">=4.5 <4.9": {
|
|
202
|
-
"*": [
|
|
203
|
-
"dist/types-ts4.5/*",
|
|
204
|
-
"dist/types-ts4.5/index.d.ts"
|
|
205
|
-
]
|
|
206
|
-
}
|
|
207
|
-
}
|
|
199
|
+
"homepage": "https://atlassian.design/components/primitives/overview/"
|
|
208
200
|
}
|
package/pressable/package.json
CHANGED
|
@@ -6,12 +6,5 @@
|
|
|
6
6
|
"sideEffects": [
|
|
7
7
|
"**/*.compiled.css"
|
|
8
8
|
],
|
|
9
|
-
"types": "../dist/types/entry-points/pressable.d.ts"
|
|
10
|
-
"typesVersions": {
|
|
11
|
-
">=4.5 <5.9": {
|
|
12
|
-
"*": [
|
|
13
|
-
"../dist/types-ts4.5/entry-points/pressable.d.ts"
|
|
14
|
-
]
|
|
15
|
-
}
|
|
16
|
-
}
|
|
9
|
+
"types": "../dist/types/entry-points/pressable.d.ts"
|
|
17
10
|
}
|
|
@@ -6,12 +6,5 @@
|
|
|
6
6
|
"sideEffects": [
|
|
7
7
|
"**/*.compiled.css"
|
|
8
8
|
],
|
|
9
|
-
"types": "../../dist/types/entry-points/responsive-build-media-query-css.d.ts"
|
|
10
|
-
"typesVersions": {
|
|
11
|
-
">=4.5 <5.9": {
|
|
12
|
-
"*": [
|
|
13
|
-
"../../dist/types-ts4.5/entry-points/responsive-build-media-query-css.d.ts"
|
|
14
|
-
]
|
|
15
|
-
}
|
|
16
|
-
}
|
|
9
|
+
"types": "../../dist/types/entry-points/responsive-build-media-query-css.d.ts"
|
|
17
10
|
}
|
|
@@ -6,12 +6,5 @@
|
|
|
6
6
|
"sideEffects": [
|
|
7
7
|
"**/*.compiled.css"
|
|
8
8
|
],
|
|
9
|
-
"types": "../../dist/types/entry-points/responsive-constants.d.ts"
|
|
10
|
-
"typesVersions": {
|
|
11
|
-
">=4.5 <5.9": {
|
|
12
|
-
"*": [
|
|
13
|
-
"../../dist/types-ts4.5/entry-points/responsive-constants.d.ts"
|
|
14
|
-
]
|
|
15
|
-
}
|
|
16
|
-
}
|
|
9
|
+
"types": "../../dist/types/entry-points/responsive-constants.d.ts"
|
|
17
10
|
}
|
|
@@ -6,12 +6,5 @@
|
|
|
6
6
|
"sideEffects": [
|
|
7
7
|
"**/*.compiled.css"
|
|
8
8
|
],
|
|
9
|
-
"types": "../../dist/types/entry-points/responsive-hide.d.ts"
|
|
10
|
-
"typesVersions": {
|
|
11
|
-
">=4.5 <5.9": {
|
|
12
|
-
"*": [
|
|
13
|
-
"../../dist/types-ts4.5/entry-points/responsive-hide.d.ts"
|
|
14
|
-
]
|
|
15
|
-
}
|
|
16
|
-
}
|
|
9
|
+
"types": "../../dist/types/entry-points/responsive-hide.d.ts"
|
|
17
10
|
}
|