@atlaskit/primitives 14.15.5 → 15.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 +19 -13
- package/constellation/xcss/usage.mdx +1 -1
- 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 +3 -23
- 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 +3 -23
- 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 +3 -23
- package/dist/types/xcss/style-maps.partial.d.ts +2 -12
- package/dist/types-ts4.5/xcss/style-maps.partial.d.ts +2 -12
- package/package.json +10 -10
- package/scripts/shape-codegen-template.tsx +3 -4
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,24 @@
|
|
|
1
1
|
# @atlaskit/primitives
|
|
2
2
|
|
|
3
|
+
## 15.0.1
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- [`75ba0401c1743`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/75ba0401c1743) -
|
|
8
|
+
Internal changes.
|
|
9
|
+
- Updated dependencies
|
|
10
|
+
|
|
11
|
+
## 15.0.0
|
|
12
|
+
|
|
13
|
+
### Major Changes
|
|
14
|
+
|
|
15
|
+
- [`d65b31774de31`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/d65b31774de31) -
|
|
16
|
+
Removed deprecated border radius and border width tokens from xcss type.
|
|
17
|
+
|
|
18
|
+
### Patch Changes
|
|
19
|
+
|
|
20
|
+
- Updated dependencies
|
|
21
|
+
|
|
3
22
|
## 14.15.5
|
|
4
23
|
|
|
5
24
|
### Patch Changes
|
|
@@ -725,7 +744,6 @@
|
|
|
725
744
|
Box no longer supports usage as an anchor tag (`<a>`). Use
|
|
726
745
|
[the Anchor primitive](https://atlassian.design/components/primitives/anchor/examples) instead,
|
|
727
746
|
which is more specialized. This has benefits including:
|
|
728
|
-
|
|
729
747
|
- Built-in event tracking support
|
|
730
748
|
- Default text underlines
|
|
731
749
|
- Automatic router link configuration from `@atlaskit/app-provider`
|
|
@@ -733,7 +751,6 @@
|
|
|
733
751
|
- Warning screen-readers when links open in new windows
|
|
734
752
|
|
|
735
753
|
**Migrating to Anchor**
|
|
736
|
-
|
|
737
754
|
- First consider if another ADS link component such as `@atlaskit/link` is better suited rather
|
|
738
755
|
than building a custom anchor.
|
|
739
756
|
- Anchor has focus ring styles built-in, so remove existing styles including
|
|
@@ -825,7 +842,6 @@
|
|
|
825
842
|
[`80c46fcb18957`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/80c46fcb18957) -
|
|
826
843
|
Increased type safety for `xcss`. In general, non-token values for the following properties are no
|
|
827
844
|
longer allowed:
|
|
828
|
-
|
|
829
845
|
- `margin`
|
|
830
846
|
- `marginBlock`
|
|
831
847
|
- `marginBlockEnd`
|
|
@@ -854,7 +870,6 @@
|
|
|
854
870
|
```
|
|
855
871
|
|
|
856
872
|
A few additional non-token values are still accepted:
|
|
857
|
-
|
|
858
873
|
- `margin`: `'0 auto'` | `'auto'` | `'0'`
|
|
859
874
|
- `marginBlock`: `'auto'` | `'0'`
|
|
860
875
|
- `marginBlockEnd`: `'auto'` | `'0'`
|
|
@@ -952,7 +967,6 @@
|
|
|
952
967
|
Box no longer supports usage as a button. Use
|
|
953
968
|
[the Pressable primitive](https://atlassian.design/components/primitives/pressable/examples)
|
|
954
969
|
instead, which is more specialized and has built-in event tracking support.
|
|
955
|
-
|
|
956
970
|
- Pressable has focus ring styles built-in, so remove existing styles including
|
|
957
971
|
`@atlaskit/focus-ring`
|
|
958
972
|
- Pressable has a default cursor (`cursor: pointer`) built-in, so existing styles can be removed.
|
|
@@ -1069,7 +1083,6 @@
|
|
|
1069
1083
|
- [#110975](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/110975)
|
|
1070
1084
|
[`c462a22b33940`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/c462a22b33940) -
|
|
1071
1085
|
Removed type hinting for size values in the following properties in XCSS:
|
|
1072
|
-
|
|
1073
1086
|
- blockSize
|
|
1074
1087
|
- height
|
|
1075
1088
|
- inlineSize
|
|
@@ -1116,7 +1129,6 @@
|
|
|
1116
1129
|
- [#108387](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/108387)
|
|
1117
1130
|
[`0f3b7b4c63c6d`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/0f3b7b4c63c6d) -
|
|
1118
1131
|
`xcss`: Restrict valid chained pseudo-selectors a limited subset:
|
|
1119
|
-
|
|
1120
1132
|
- `:visited:active`
|
|
1121
1133
|
- `:active:visited`
|
|
1122
1134
|
- `:hover::before`
|
|
@@ -1342,7 +1354,6 @@
|
|
|
1342
1354
|
`"small"`, `"medium"` (default), and `"large"`.
|
|
1343
1355
|
|
|
1344
1356
|
Migration guide:
|
|
1345
|
-
|
|
1346
1357
|
- `variant="body.small"` -> `size="small"`
|
|
1347
1358
|
- `variant="body"` -> `size="medium"` (Note: Since medium is the default, the size prop can be
|
|
1348
1359
|
omitted here)
|
|
@@ -1786,7 +1797,6 @@
|
|
|
1786
1797
|
- [#39412](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/39412)
|
|
1787
1798
|
[`c2e55a9b782`](https://bitbucket.org/atlassian/atlassian-frontend/commits/c2e55a9b782) - Adds
|
|
1788
1799
|
surface detection support to the Box primitive:
|
|
1789
|
-
|
|
1790
1800
|
- Enable a `Box` background colour to be set to the `utility.elevation.surface.current` token.
|
|
1791
1801
|
- Internally set the current surface CSS variable value when the background color of a Box is set
|
|
1792
1802
|
to a surface token (e.g. `elevation.surface.raised`).
|
|
@@ -2041,7 +2051,6 @@
|
|
|
2041
2051
|
without writing a dozen lines for just one `display: none` css rule.
|
|
2042
2052
|
|
|
2043
2053
|
Additionally:
|
|
2044
|
-
|
|
2045
2054
|
- Adds some further examples, tests, and VRs.
|
|
2046
2055
|
- Tweaks some internals around building these reusable media query maps.
|
|
2047
2056
|
|
|
@@ -2320,12 +2329,10 @@
|
|
|
2320
2329
|
- [#32296](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/32296)
|
|
2321
2330
|
[`4d19bdd2218`](https://bitbucket.org/atlassian/atlassian-frontend/commits/4d19bdd2218) -
|
|
2322
2331
|
**Inline**:
|
|
2323
|
-
|
|
2324
2332
|
- `space` prop now accepts values in the form `space.XXX`. For example: `space="space.100"`.
|
|
2325
2333
|
- `rowSpace` prop now accepts values in the form `space.XXX`. For example: `rowSpace="space.100"`.
|
|
2326
2334
|
|
|
2327
2335
|
**Stack**:
|
|
2328
|
-
|
|
2329
2336
|
- `space` prop now accepts values in the form `space.XXX`. For example: `space="space.100"`.
|
|
2330
2337
|
|
|
2331
2338
|
## 0.7.1
|
|
@@ -2342,7 +2349,6 @@
|
|
|
2342
2349
|
|
|
2343
2350
|
- [#31841](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/31841)
|
|
2344
2351
|
[`7e17a8b8934`](https://bitbucket.org/atlassian/atlassian-frontend/commits/7e17a8b8934) - Box:
|
|
2345
|
-
|
|
2346
2352
|
- Add xcss prop to enable token powered styling.
|
|
2347
2353
|
|
|
2348
2354
|
## 0.6.0
|
|
@@ -15,7 +15,7 @@ import SectionMessage from '@atlaskit/section-message';
|
|
|
15
15
|
</SectionMessage>
|
|
16
16
|
|
|
17
17
|
XCSS is an Atlassian Design System styling API that natively integrates with Atlassian's
|
|
18
|
-
[design tokens](/tokens) and [primitives](/components/primitives/overview).
|
|
18
|
+
[design tokens](/foundations/tokens) and [primitives](/components/primitives/overview).
|
|
19
19
|
|
|
20
20
|
To ensure future compliance with XCSS as it evolves over time, we highly recommend you enable our
|
|
21
21
|
ESLint plugins and adhere to the
|
|
@@ -70,7 +70,7 @@ var AnchorNoRef = function AnchorNoRef(_ref, ref) {
|
|
|
70
70
|
action: 'clicked',
|
|
71
71
|
componentName: componentName || 'Anchor',
|
|
72
72
|
packageName: "@atlaskit/primitives",
|
|
73
|
-
packageVersion: "
|
|
73
|
+
packageVersion: "0.0.0-development",
|
|
74
74
|
analyticsData: analyticsContext,
|
|
75
75
|
actionSubject: 'link'
|
|
76
76
|
});
|
|
@@ -61,7 +61,7 @@ var Pressable = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
|
|
|
61
61
|
action: 'clicked',
|
|
62
62
|
componentName: componentName || 'Pressable',
|
|
63
63
|
packageName: "@atlaskit/primitives",
|
|
64
|
-
packageVersion: "
|
|
64
|
+
packageVersion: "0.0.0-development",
|
|
65
65
|
analyticsData: analyticsContext,
|
|
66
66
|
actionSubject: 'button'
|
|
67
67
|
});
|
|
@@ -105,7 +105,7 @@ var AnchorNoRef = function AnchorNoRef(_ref, ref) {
|
|
|
105
105
|
action: 'clicked',
|
|
106
106
|
componentName: componentName || 'Anchor',
|
|
107
107
|
packageName: "@atlaskit/primitives",
|
|
108
|
-
packageVersion: "
|
|
108
|
+
packageVersion: "0.0.0-development",
|
|
109
109
|
analyticsData: analyticsContext,
|
|
110
110
|
actionSubject: 'link'
|
|
111
111
|
});
|
|
@@ -97,7 +97,7 @@ var Pressable = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
|
|
|
97
97
|
action: 'clicked',
|
|
98
98
|
componentName: componentName || 'Pressable',
|
|
99
99
|
packageName: "@atlaskit/primitives",
|
|
100
|
-
packageVersion: "
|
|
100
|
+
packageVersion: "0.0.0-development",
|
|
101
101
|
analyticsData: analyticsContext,
|
|
102
102
|
actionSubject: 'button'
|
|
103
103
|
});
|
|
@@ -474,20 +474,14 @@ var layerMap = exports.layerMap = {
|
|
|
474
474
|
|
|
475
475
|
/**
|
|
476
476
|
* THIS SECTION WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
|
|
477
|
-
* @codegen <<SignedSource::
|
|
477
|
+
* @codegen <<SignedSource::a9118f8ed93d943746fd7e932ce5a639>>
|
|
478
478
|
* @codegenId border
|
|
479
479
|
* @codegenCommand yarn workspace @atlaskit/primitives codegen-styles
|
|
480
480
|
* @codegenParams ["width", "radius"]
|
|
481
|
-
* @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-shape.tsx <<SignedSource::
|
|
481
|
+
* @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-shape.tsx <<SignedSource::45e4ecb92a72445f508219ea6a5f056a>>
|
|
482
482
|
*/
|
|
483
483
|
var borderWidthMap = exports.borderWidthMap = {
|
|
484
484
|
'border.width': "var(--ds-border-width, 1px)",
|
|
485
|
-
// @deprecated
|
|
486
|
-
'border.width.0': "var(--ds-border-width-0, 0px)",
|
|
487
|
-
// @deprecated
|
|
488
|
-
'border.width.indicator': "var(--ds-border-width-indicator, 3px)",
|
|
489
|
-
// @deprecated
|
|
490
|
-
'border.width.outline': "var(--ds-border-width-outline, 2px)",
|
|
491
485
|
'border.width.selected': "var(--ds-border-width-selected, 2px)",
|
|
492
486
|
'border.width.focused': "var(--ds-border-width-focused, 2px)"
|
|
493
487
|
};
|
|
@@ -498,21 +492,7 @@ var borderRadiusMap = exports.borderRadiusMap = {
|
|
|
498
492
|
'radius.large': "var(--ds-radius-large, 8px)",
|
|
499
493
|
'radius.xlarge': "var(--ds-radius-xlarge, 12px)",
|
|
500
494
|
'radius.full': "var(--ds-radius-full, 9999px)",
|
|
501
|
-
'radius.tile': "var(--ds-radius-tile, 25%)"
|
|
502
|
-
// @deprecated
|
|
503
|
-
'border.radius': "var(--ds-border-radius, 3px)",
|
|
504
|
-
// @deprecated
|
|
505
|
-
'border.radius.050': "var(--ds-border-radius-050, 2px)",
|
|
506
|
-
// @deprecated
|
|
507
|
-
'border.radius.100': "var(--ds-border-radius-100, 3px)",
|
|
508
|
-
// @deprecated
|
|
509
|
-
'border.radius.200': "var(--ds-border-radius-200, 8px)",
|
|
510
|
-
// @deprecated
|
|
511
|
-
'border.radius.300': "var(--ds-border-radius-300, 12px)",
|
|
512
|
-
// @deprecated
|
|
513
|
-
'border.radius.400': "var(--ds-border-radius-400, 16px)",
|
|
514
|
-
// @deprecated
|
|
515
|
-
'border.radius.circle': "var(--ds-border-radius-circle, 9999px)"
|
|
495
|
+
'radius.tile': "var(--ds-radius-tile, 25%)"
|
|
516
496
|
};
|
|
517
497
|
/**
|
|
518
498
|
* @codegenEnd
|
|
@@ -56,7 +56,7 @@ const AnchorNoRef = ({
|
|
|
56
56
|
action: 'clicked',
|
|
57
57
|
componentName: componentName || 'Anchor',
|
|
58
58
|
packageName: "@atlaskit/primitives",
|
|
59
|
-
packageVersion: "
|
|
59
|
+
packageVersion: "0.0.0-development",
|
|
60
60
|
analyticsData: analyticsContext,
|
|
61
61
|
actionSubject: 'link'
|
|
62
62
|
});
|
|
@@ -48,7 +48,7 @@ const Pressable = /*#__PURE__*/forwardRef(({
|
|
|
48
48
|
action: 'clicked',
|
|
49
49
|
componentName: componentName || 'Pressable',
|
|
50
50
|
packageName: "@atlaskit/primitives",
|
|
51
|
-
packageVersion: "
|
|
51
|
+
packageVersion: "0.0.0-development",
|
|
52
52
|
analyticsData: analyticsContext,
|
|
53
53
|
actionSubject: 'button'
|
|
54
54
|
});
|
|
@@ -94,7 +94,7 @@ const AnchorNoRef = ({
|
|
|
94
94
|
action: 'clicked',
|
|
95
95
|
componentName: componentName || 'Anchor',
|
|
96
96
|
packageName: "@atlaskit/primitives",
|
|
97
|
-
packageVersion: "
|
|
97
|
+
packageVersion: "0.0.0-development",
|
|
98
98
|
analyticsData: analyticsContext,
|
|
99
99
|
actionSubject: 'link'
|
|
100
100
|
});
|
|
@@ -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: "0.0.0-development",
|
|
90
90
|
analyticsData: analyticsContext,
|
|
91
91
|
actionSubject: 'button'
|
|
92
92
|
});
|
|
@@ -469,20 +469,14 @@ export const layerMap = {
|
|
|
469
469
|
|
|
470
470
|
/**
|
|
471
471
|
* THIS SECTION WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
|
|
472
|
-
* @codegen <<SignedSource::
|
|
472
|
+
* @codegen <<SignedSource::a9118f8ed93d943746fd7e932ce5a639>>
|
|
473
473
|
* @codegenId border
|
|
474
474
|
* @codegenCommand yarn workspace @atlaskit/primitives codegen-styles
|
|
475
475
|
* @codegenParams ["width", "radius"]
|
|
476
|
-
* @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-shape.tsx <<SignedSource::
|
|
476
|
+
* @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-shape.tsx <<SignedSource::45e4ecb92a72445f508219ea6a5f056a>>
|
|
477
477
|
*/
|
|
478
478
|
export const borderWidthMap = {
|
|
479
479
|
'border.width': "var(--ds-border-width, 1px)",
|
|
480
|
-
// @deprecated
|
|
481
|
-
'border.width.0': "var(--ds-border-width-0, 0px)",
|
|
482
|
-
// @deprecated
|
|
483
|
-
'border.width.indicator': "var(--ds-border-width-indicator, 3px)",
|
|
484
|
-
// @deprecated
|
|
485
|
-
'border.width.outline': "var(--ds-border-width-outline, 2px)",
|
|
486
480
|
'border.width.selected': "var(--ds-border-width-selected, 2px)",
|
|
487
481
|
'border.width.focused': "var(--ds-border-width-focused, 2px)"
|
|
488
482
|
};
|
|
@@ -493,21 +487,7 @@ export const borderRadiusMap = {
|
|
|
493
487
|
'radius.large': "var(--ds-radius-large, 8px)",
|
|
494
488
|
'radius.xlarge': "var(--ds-radius-xlarge, 12px)",
|
|
495
489
|
'radius.full': "var(--ds-radius-full, 9999px)",
|
|
496
|
-
'radius.tile': "var(--ds-radius-tile, 25%)"
|
|
497
|
-
// @deprecated
|
|
498
|
-
'border.radius': "var(--ds-border-radius, 3px)",
|
|
499
|
-
// @deprecated
|
|
500
|
-
'border.radius.050': "var(--ds-border-radius-050, 2px)",
|
|
501
|
-
// @deprecated
|
|
502
|
-
'border.radius.100': "var(--ds-border-radius-100, 3px)",
|
|
503
|
-
// @deprecated
|
|
504
|
-
'border.radius.200': "var(--ds-border-radius-200, 8px)",
|
|
505
|
-
// @deprecated
|
|
506
|
-
'border.radius.300': "var(--ds-border-radius-300, 12px)",
|
|
507
|
-
// @deprecated
|
|
508
|
-
'border.radius.400': "var(--ds-border-radius-400, 16px)",
|
|
509
|
-
// @deprecated
|
|
510
|
-
'border.radius.circle': "var(--ds-border-radius-circle, 9999px)"
|
|
490
|
+
'radius.tile': "var(--ds-radius-tile, 25%)"
|
|
511
491
|
};
|
|
512
492
|
/**
|
|
513
493
|
* @codegenEnd
|
|
@@ -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: "0.0.0-development",
|
|
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: "0.0.0-development",
|
|
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: "0.0.0-development",
|
|
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: "0.0.0-development",
|
|
95
95
|
analyticsData: analyticsContext,
|
|
96
96
|
actionSubject: 'button'
|
|
97
97
|
});
|
|
@@ -469,20 +469,14 @@ export var layerMap = {
|
|
|
469
469
|
|
|
470
470
|
/**
|
|
471
471
|
* THIS SECTION WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
|
|
472
|
-
* @codegen <<SignedSource::
|
|
472
|
+
* @codegen <<SignedSource::a9118f8ed93d943746fd7e932ce5a639>>
|
|
473
473
|
* @codegenId border
|
|
474
474
|
* @codegenCommand yarn workspace @atlaskit/primitives codegen-styles
|
|
475
475
|
* @codegenParams ["width", "radius"]
|
|
476
|
-
* @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-shape.tsx <<SignedSource::
|
|
476
|
+
* @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-shape.tsx <<SignedSource::45e4ecb92a72445f508219ea6a5f056a>>
|
|
477
477
|
*/
|
|
478
478
|
export var borderWidthMap = {
|
|
479
479
|
'border.width': "var(--ds-border-width, 1px)",
|
|
480
|
-
// @deprecated
|
|
481
|
-
'border.width.0': "var(--ds-border-width-0, 0px)",
|
|
482
|
-
// @deprecated
|
|
483
|
-
'border.width.indicator': "var(--ds-border-width-indicator, 3px)",
|
|
484
|
-
// @deprecated
|
|
485
|
-
'border.width.outline': "var(--ds-border-width-outline, 2px)",
|
|
486
480
|
'border.width.selected': "var(--ds-border-width-selected, 2px)",
|
|
487
481
|
'border.width.focused': "var(--ds-border-width-focused, 2px)"
|
|
488
482
|
};
|
|
@@ -493,21 +487,7 @@ export var borderRadiusMap = {
|
|
|
493
487
|
'radius.large': "var(--ds-radius-large, 8px)",
|
|
494
488
|
'radius.xlarge': "var(--ds-radius-xlarge, 12px)",
|
|
495
489
|
'radius.full': "var(--ds-radius-full, 9999px)",
|
|
496
|
-
'radius.tile': "var(--ds-radius-tile, 25%)"
|
|
497
|
-
// @deprecated
|
|
498
|
-
'border.radius': "var(--ds-border-radius, 3px)",
|
|
499
|
-
// @deprecated
|
|
500
|
-
'border.radius.050': "var(--ds-border-radius-050, 2px)",
|
|
501
|
-
// @deprecated
|
|
502
|
-
'border.radius.100': "var(--ds-border-radius-100, 3px)",
|
|
503
|
-
// @deprecated
|
|
504
|
-
'border.radius.200': "var(--ds-border-radius-200, 8px)",
|
|
505
|
-
// @deprecated
|
|
506
|
-
'border.radius.300': "var(--ds-border-radius-300, 12px)",
|
|
507
|
-
// @deprecated
|
|
508
|
-
'border.radius.400': "var(--ds-border-radius-400, 16px)",
|
|
509
|
-
// @deprecated
|
|
510
|
-
'border.radius.circle': "var(--ds-border-radius-circle, 9999px)"
|
|
490
|
+
'radius.tile': "var(--ds-radius-tile, 25%)"
|
|
511
491
|
};
|
|
512
492
|
/**
|
|
513
493
|
* @codegenEnd
|
|
@@ -493,17 +493,14 @@ export type Layer = keyof typeof layerMap;
|
|
|
493
493
|
*/
|
|
494
494
|
/**
|
|
495
495
|
* THIS SECTION WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
|
|
496
|
-
* @codegen <<SignedSource::
|
|
496
|
+
* @codegen <<SignedSource::a9118f8ed93d943746fd7e932ce5a639>>
|
|
497
497
|
* @codegenId border
|
|
498
498
|
* @codegenCommand yarn workspace @atlaskit/primitives codegen-styles
|
|
499
499
|
* @codegenParams ["width", "radius"]
|
|
500
|
-
* @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-shape.tsx <<SignedSource::
|
|
500
|
+
* @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-shape.tsx <<SignedSource::45e4ecb92a72445f508219ea6a5f056a>>
|
|
501
501
|
*/
|
|
502
502
|
export declare const borderWidthMap: {
|
|
503
503
|
'border.width': 'var(--ds-border-width)';
|
|
504
|
-
'border.width.0': 'var(--ds-border-width-0)';
|
|
505
|
-
'border.width.indicator': 'var(--ds-border-width-indicator)';
|
|
506
|
-
'border.width.outline': 'var(--ds-border-width-outline)';
|
|
507
504
|
'border.width.selected': 'var(--ds-border-width-selected)';
|
|
508
505
|
'border.width.focused': 'var(--ds-border-width-focused)';
|
|
509
506
|
};
|
|
@@ -516,13 +513,6 @@ export declare const borderRadiusMap: {
|
|
|
516
513
|
'radius.xlarge': 'var(--ds-radius-xlarge)';
|
|
517
514
|
'radius.full': 'var(--ds-radius-full)';
|
|
518
515
|
'radius.tile': 'var(--ds-radius-tile)';
|
|
519
|
-
'border.radius': 'var(--ds-border-radius)';
|
|
520
|
-
'border.radius.050': 'var(--ds-border-radius-050)';
|
|
521
|
-
'border.radius.100': 'var(--ds-border-radius-100)';
|
|
522
|
-
'border.radius.200': 'var(--ds-border-radius-200)';
|
|
523
|
-
'border.radius.300': 'var(--ds-border-radius-300)';
|
|
524
|
-
'border.radius.400': 'var(--ds-border-radius-400)';
|
|
525
|
-
'border.radius.circle': 'var(--ds-border-radius-circle)';
|
|
526
516
|
};
|
|
527
517
|
export type BorderRadius = keyof typeof borderRadiusMap;
|
|
528
518
|
/**
|
|
@@ -493,17 +493,14 @@ export type Layer = keyof typeof layerMap;
|
|
|
493
493
|
*/
|
|
494
494
|
/**
|
|
495
495
|
* THIS SECTION WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
|
|
496
|
-
* @codegen <<SignedSource::
|
|
496
|
+
* @codegen <<SignedSource::a9118f8ed93d943746fd7e932ce5a639>>
|
|
497
497
|
* @codegenId border
|
|
498
498
|
* @codegenCommand yarn workspace @atlaskit/primitives codegen-styles
|
|
499
499
|
* @codegenParams ["width", "radius"]
|
|
500
|
-
* @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-shape.tsx <<SignedSource::
|
|
500
|
+
* @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-shape.tsx <<SignedSource::45e4ecb92a72445f508219ea6a5f056a>>
|
|
501
501
|
*/
|
|
502
502
|
export declare const borderWidthMap: {
|
|
503
503
|
'border.width': 'var(--ds-border-width)';
|
|
504
|
-
'border.width.0': 'var(--ds-border-width-0)';
|
|
505
|
-
'border.width.indicator': 'var(--ds-border-width-indicator)';
|
|
506
|
-
'border.width.outline': 'var(--ds-border-width-outline)';
|
|
507
504
|
'border.width.selected': 'var(--ds-border-width-selected)';
|
|
508
505
|
'border.width.focused': 'var(--ds-border-width-focused)';
|
|
509
506
|
};
|
|
@@ -516,13 +513,6 @@ export declare const borderRadiusMap: {
|
|
|
516
513
|
'radius.xlarge': 'var(--ds-radius-xlarge)';
|
|
517
514
|
'radius.full': 'var(--ds-radius-full)';
|
|
518
515
|
'radius.tile': 'var(--ds-radius-tile)';
|
|
519
|
-
'border.radius': 'var(--ds-border-radius)';
|
|
520
|
-
'border.radius.050': 'var(--ds-border-radius-050)';
|
|
521
|
-
'border.radius.100': 'var(--ds-border-radius-100)';
|
|
522
|
-
'border.radius.200': 'var(--ds-border-radius-200)';
|
|
523
|
-
'border.radius.300': 'var(--ds-border-radius-300)';
|
|
524
|
-
'border.radius.400': 'var(--ds-border-radius-400)';
|
|
525
|
-
'border.radius.circle': 'var(--ds-border-radius-circle)';
|
|
526
516
|
};
|
|
527
517
|
export type BorderRadius = keyof typeof borderRadiusMap;
|
|
528
518
|
/**
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@atlaskit/primitives",
|
|
3
|
-
"version": "
|
|
3
|
+
"version": "15.0.1",
|
|
4
4
|
"description": "Primitives are token-backed low-level building blocks.",
|
|
5
5
|
"publishConfig": {
|
|
6
6
|
"registry": "https://registry.npmjs.org/"
|
|
@@ -134,14 +134,14 @@
|
|
|
134
134
|
"dependencies": {
|
|
135
135
|
"@atlaskit/analytics-next": "^11.1.0",
|
|
136
136
|
"@atlaskit/app-provider": "^3.2.0",
|
|
137
|
-
"@atlaskit/css": "^0.
|
|
137
|
+
"@atlaskit/css": "^0.15.0",
|
|
138
138
|
"@atlaskit/ds-lib": "^5.1.0",
|
|
139
139
|
"@atlaskit/interaction-context": "^3.1.0",
|
|
140
140
|
"@atlaskit/platform-feature-flags": "^1.1.0",
|
|
141
|
-
"@atlaskit/tokens": "^
|
|
141
|
+
"@atlaskit/tokens": "^7.0.0",
|
|
142
142
|
"@atlaskit/visually-hidden": "^3.0.0",
|
|
143
143
|
"@babel/runtime": "^7.0.0",
|
|
144
|
-
"@compiled/react": "^0.18.
|
|
144
|
+
"@compiled/react": "^0.18.6",
|
|
145
145
|
"@emotion/react": "^11.7.1",
|
|
146
146
|
"@emotion/serialize": "^1.1.0",
|
|
147
147
|
"bind-event-listener": "^3.0.0",
|
|
@@ -155,20 +155,20 @@
|
|
|
155
155
|
"@af/formatting": "workspace:^",
|
|
156
156
|
"@af/integration-testing": "workspace:^",
|
|
157
157
|
"@af/visual-regression": "workspace:^",
|
|
158
|
-
"@atlaskit/avatar": "^25.
|
|
158
|
+
"@atlaskit/avatar": "^25.4.0",
|
|
159
159
|
"@atlaskit/button": "^23.5.0",
|
|
160
160
|
"@atlaskit/checkbox": "^17.1.0",
|
|
161
161
|
"@atlaskit/code": "^17.2.0",
|
|
162
|
-
"@atlaskit/docs": "^11.
|
|
162
|
+
"@atlaskit/docs": "^11.2.0",
|
|
163
163
|
"@atlaskit/dropdown-menu": "^16.3.0",
|
|
164
|
-
"@atlaskit/flag": "^17.
|
|
164
|
+
"@atlaskit/flag": "^17.5.0",
|
|
165
165
|
"@atlaskit/form": "^14.2.0",
|
|
166
166
|
"@atlaskit/heading": "^5.2.0",
|
|
167
|
-
"@atlaskit/icon": "^28.
|
|
168
|
-
"@atlaskit/icon-object": "^7.
|
|
167
|
+
"@atlaskit/icon": "^28.5.0",
|
|
168
|
+
"@atlaskit/icon-object": "^7.3.0",
|
|
169
169
|
"@atlaskit/image": "^3.0.0",
|
|
170
170
|
"@atlaskit/link": "^3.2.0",
|
|
171
|
-
"@atlaskit/logo": "^19.
|
|
171
|
+
"@atlaskit/logo": "^19.9.0",
|
|
172
172
|
"@atlaskit/lozenge": "^13.0.0",
|
|
173
173
|
"@atlaskit/motion": "^5.3.0",
|
|
174
174
|
"@atlaskit/range": "^9.2.0",
|
|
@@ -14,15 +14,14 @@ const tokenStyles = {
|
|
|
14
14
|
objectName: 'borderWidth',
|
|
15
15
|
filterPrefix: 'border.width',
|
|
16
16
|
cssProperty: 'borderWidth',
|
|
17
|
-
filterFn: <T extends Token>(t: T)
|
|
18
|
-
t.token.startsWith(tokenStyles.width.filterPrefix),
|
|
17
|
+
filterFn: <T extends Token>(t: T) =>
|
|
18
|
+
t.token.startsWith(tokenStyles.width.filterPrefix) && !t.isDeprecated,
|
|
19
19
|
},
|
|
20
20
|
radius: {
|
|
21
21
|
objectName: 'borderRadius',
|
|
22
22
|
filterPrefix: 'radius',
|
|
23
23
|
cssProperty: 'borderRadius',
|
|
24
|
-
filterFn: <T extends Token>(t: T)
|
|
25
|
-
t.token.startsWith(tokenStyles.radius.filterPrefix) || t.token.startsWith('border.radius'),
|
|
24
|
+
filterFn: <T extends Token>(t: T) => t.token.startsWith(tokenStyles.radius.filterPrefix),
|
|
26
25
|
},
|
|
27
26
|
} as const;
|
|
28
27
|
|