@atlaskit/tabs 17.2.0 → 17.2.2
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 +14 -36
- package/dist/cjs/components/tab-list.compiled.css +8 -2
- package/dist/cjs/components/tab-list.js +1 -2
- package/dist/cjs/components/tabs.js +1 -1
- package/dist/es2019/components/tab-list.compiled.css +8 -2
- package/dist/es2019/components/tab-list.js +1 -1
- package/dist/es2019/components/tabs.js +1 -1
- package/dist/esm/components/tab-list.compiled.css +8 -2
- package/dist/esm/components/tab-list.js +1 -2
- package/dist/esm/components/tabs.js +1 -1
- package/dist/types/components/tab-panel.d.ts +2 -2
- package/dist/types-ts4.5/components/tab-panel.d.ts +2 -2
- package/package.json +2 -3
- package/codemods/13.0.0-lite-mode.tsx +0 -31
- package/codemods/__tests__/13.0.0-lite-mode.tsx +0 -569
- package/codemods/__tests__/add-id-prop.tsx +0 -77
- package/codemods/__tests__/map-tabs-prop.tsx +0 -299
- package/codemods/__tests__/on-select-to-on-change.tsx +0 -541
- package/codemods/__tests__/remove-components-prop.tsx +0 -151
- package/codemods/__tests__/remove-is-selected-test-prop.tsx +0 -147
- package/codemods/__tests__/remove-tab-item-tab-content.tsx +0 -86
- package/codemods/__tests__/remove-types.tsx +0 -162
- package/codemods/__tests__/rename-is-content-persisted-to-should-unmount-tab-panel-on-change.tsx +0 -311
- package/codemods/migrations/add-id-prop.tsx +0 -51
- package/codemods/migrations/map-tabs-prop.tsx +0 -171
- package/codemods/migrations/on-select-to-on-change.tsx +0 -91
- package/codemods/migrations/remove-components-prop.tsx +0 -20
- package/codemods/migrations/remove-is-selected-test-prop.tsx +0 -17
- package/codemods/migrations/remove-tab-item-tab-content.tsx +0 -26
- package/codemods/migrations/remove-types.tsx +0 -45
- package/codemods/migrations/rename-is-content-persisted-to-should-unmount-tab-panel-on-change.tsx +0 -62
- package/codemods/utils.tsx +0 -39
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,19 @@
|
|
|
1
1
|
# @atlaskit/tabs
|
|
2
2
|
|
|
3
|
+
## 17.2.2
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- [#110415](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/110415)
|
|
8
|
+
[`f082418019174`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/f082418019174) -
|
|
9
|
+
Remove old codemods from package.
|
|
10
|
+
|
|
11
|
+
## 17.2.1
|
|
12
|
+
|
|
13
|
+
### Patch Changes
|
|
14
|
+
|
|
15
|
+
- Updated dependencies
|
|
16
|
+
|
|
3
17
|
## 17.2.0
|
|
4
18
|
|
|
5
19
|
### Minor Changes
|
|
@@ -804,42 +818,6 @@
|
|
|
804
818
|
`TabContentComponentProvided`, `TabItemType`, `TabContentType`, `SelectedProp`,
|
|
805
819
|
`IsSelectedTestFunction`, `OnSelectCallback`, `TabsState`, `TabsNavigationProps` and `Mode`.
|
|
806
820
|
|
|
807
|
-
### Automatic upgrading
|
|
808
|
-
|
|
809
|
-
There is a codemod that assists you in upgrading most of the changes from above. Depending on your
|
|
810
|
-
usage, you will most likely have to do a manual step as this is a fairly big change in API. The
|
|
811
|
-
codemod will do its best job at making sure everything functions but you may want to clean up your
|
|
812
|
-
usage of `@atlaskit/tabs`. It does these following changes:
|
|
813
|
-
|
|
814
|
-
- Adds a randomly generated ID
|
|
815
|
-
- Changes `onSelect` to `onChange` and defines a new inline function that will functionally work
|
|
816
|
-
the same as it used to. It is however a messy solution and you may want to change the function
|
|
817
|
-
to only use the selected index.
|
|
818
|
-
- Remove the `TabItem` and `TabContent` imports.
|
|
819
|
-
- Map the array you supplied as a `tabs` prop to create `Tab`'s and `TabPanel`'s.
|
|
820
|
-
- Remove the `component` and `isSelectedTest` prop.
|
|
821
|
-
- Removes types that no longer exist.
|
|
822
|
-
- Migrates your usage of `isContentPersisted` to one of `shouldUnmountTabPanelOnChange`.
|
|
823
|
-
|
|
824
|
-
To run the codemod: **You first need to have the latest version installed**
|
|
825
|
-
|
|
826
|
-
```bash
|
|
827
|
-
yarn upgrade @atlaskit/tabs@^13.0.0
|
|
828
|
-
```
|
|
829
|
-
|
|
830
|
-
Once upgraded, use `@atlaskit/codemod-cli`:
|
|
831
|
-
|
|
832
|
-
```bash
|
|
833
|
-
npx @atlaskit/codemod-cli --parser babel --extensions ts,tsx,js [relativePath]
|
|
834
|
-
```
|
|
835
|
-
|
|
836
|
-
The CLI will show a list of components and versions so select `@atlaskit/tabs@^13.0.0` and you
|
|
837
|
-
will automatically be upgraded.
|
|
838
|
-
|
|
839
|
-
Run `npx @atlaskit/codemod-cli -h` for more details on usage. For Atlassians, refer to the
|
|
840
|
-
[documentation](https://hello.atlassian.net/wiki/spaces/AF/pages/2627171992/Codemods) for more
|
|
841
|
-
details on the codemod CLI.
|
|
842
|
-
|
|
843
821
|
### Patch Changes
|
|
844
822
|
|
|
845
823
|
- [`4a969d5c40f`](https://bitbucket.org/atlassian/atlassian-frontend/commits/4a969d5c40f) - Fix a
|
|
@@ -1,8 +1,6 @@
|
|
|
1
1
|
|
|
2
|
-
._13xajb7m [role=tab]{padding:var(--_1xs0znw)}
|
|
3
2
|
._17hygqwt [role=tab]:hover:after{border-radius:var(--ds-border-radius-050,2px)}
|
|
4
3
|
._1jakgqwt [role=tab]:active:after{border-radius:var(--ds-border-radius-050,2px)}
|
|
5
|
-
._1yt4ze3t{padding:var(--ds-space-0,0)}
|
|
6
4
|
._9r9ugqwt [role=tab][aria-selected=true]:after{border-radius:var(--ds-border-radius-050,2px)}
|
|
7
5
|
._rfx3gqwt:before{border-radius:var(--ds-border-radius-050,2px)}
|
|
8
6
|
._1b8d1hjo [role=tab]:active:after{border-block-end:var(--_1nddtxm)}
|
|
@@ -17,6 +15,7 @@
|
|
|
17
15
|
._166qidpf [role=tab]:hover:after{margin-left:0}
|
|
18
16
|
._16u6b3bt [role=tab]:active:after{content:""}
|
|
19
17
|
._170tidpf [role=tab]:active:after{margin-right:0}
|
|
18
|
+
._1a85u2gc [role=tab]{padding-inline-end:var(--ds-space-100,8px)}
|
|
20
19
|
._1c9uu2gc [role=tab]:active:after{inset-inline-start:var(--ds-space-100,8px)}
|
|
21
20
|
._1cs8stnw:before{position:absolute}
|
|
22
21
|
._1dze1l2s [role=tab]{text-overflow:ellipsis}
|
|
@@ -35,8 +34,10 @@
|
|
|
35
34
|
._1mp41kw7:before{width:inherit}
|
|
36
35
|
._1n121kw7 [role=tab]:active:after{width:inherit}
|
|
37
36
|
._1nvfidpf [role=tab]:active:after{margin-left:0}
|
|
37
|
+
._1ofh12x7 [role=tab]{padding-block-end:var(--ds-space-075,6px)}
|
|
38
38
|
._1olcu2gc [role=tab]:hover:after{inset-inline-start:var(--ds-space-100,8px)}
|
|
39
39
|
._1p9sidpf [role=tab][aria-selected=true]:after{inset-block-end:0}
|
|
40
|
+
._1q51ze3t{padding-block-start:var(--ds-space-0,0)}
|
|
40
41
|
._1qa1u2gc [role=tab][aria-selected=true]:after{inset-inline-end:var(--ds-space-100,8px)}
|
|
41
42
|
._1quz1425 [role=tab]{color:var(--_13a5t4u)}
|
|
42
43
|
._1russudh:before{background-color:var(--_lvpq93)}
|
|
@@ -47,9 +48,11 @@
|
|
|
47
48
|
._24g71kw7 [role=tab]:hover:after{width:inherit}
|
|
48
49
|
._7hip15vq [role=tab]{overflow-x:hidden}
|
|
49
50
|
._7p9oidpf [role=tab]:active:after{height:0}
|
|
51
|
+
._85i5ze3t{padding-block-end:var(--ds-space-0,0)}
|
|
50
52
|
._93pdidpf [role=tab][aria-selected=true]:after{height:0}
|
|
51
53
|
._ahbqx0bf{margin-inline-start:var(--ds-space-negative-100,-8px)}
|
|
52
54
|
._bb0mh2mm [role=tab]{position:relative}
|
|
55
|
+
._bozgze3t{padding-inline-start:var(--ds-space-0,0)}
|
|
53
56
|
._bppridpf [role=tab][aria-selected=true]:after{margin-top:0}
|
|
54
57
|
._eid3idpf:before{margin-right:0}
|
|
55
58
|
._fiemln51 [role=tab][aria-selected=true]{color:var(--_1hfkvbo)}
|
|
@@ -64,12 +67,15 @@
|
|
|
64
67
|
._lycustnw [role=tab]:hover:after{position:absolute}
|
|
65
68
|
._o2e1stnw [role=tab]:active:after{position:absolute}
|
|
66
69
|
._pascidpf:before{margin-top:0}
|
|
70
|
+
._pryi12x7 [role=tab]{padding-block-start:var(--ds-space-075,6px)}
|
|
71
|
+
._rmpau2gc [role=tab]{padding-inline-start:var(--ds-space-100,8px)}
|
|
67
72
|
._rzxytlke [role=tab]{cursor:pointer}
|
|
68
73
|
._w9ewidpf [role=tab]:active:after{margin-top:0}
|
|
69
74
|
._wd7eu2gc [role=tab]:hover:after{inset-inline-end:var(--ds-space-100,8px)}
|
|
70
75
|
._wsgdidpf [role=tab][aria-selected=true]:after{margin-left:0}
|
|
71
76
|
._xyihidpf [role=tab]:hover:after{margin-bottom:0}
|
|
72
77
|
._y1g1idpf [role=tab]:active:after{margin-bottom:0}
|
|
78
|
+
._y4tize3t{padding-inline-end:var(--ds-space-0,0)}
|
|
73
79
|
._z5wtu2gc:before{inset-inline-start:var(--ds-space-100,8px)}
|
|
74
80
|
._zr3eidpf:before{margin-bottom:0}
|
|
75
81
|
._1oaz1fgx [role=tab]:hover{color:var(--_kkbq40)}
|
|
@@ -102,9 +102,8 @@ var TabList = function TabList(_ref) {
|
|
|
102
102
|
ref: ref
|
|
103
103
|
// eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage
|
|
104
104
|
,
|
|
105
|
-
className: (0, _runtime.ax)(["
|
|
105
|
+
className: (0, _runtime.ax)(["_1e0c1txw _kqswh2mm _85i5ze3t _1q51ze3t _y4tize3t _bozgze3t", (0, _platformFeatureFlags.fg)('platform-component-visual-refresh') ? "_k48p1wq8 _ahbqx0bf _gpbcidpf _10vzidpf _1mmwidpf _15plidpf _7hip15vq _1fud15vq _bb0mh2mm _1quz1425 _rzxytlke _1ofh12x7 _pryi12x7 _1a85u2gc _rmpau2gc _1dze1l2s _1tms1q9c _fiizidpf _1xrmidpf _xyihidpf _166qidpf _1lzu1hjo _24g71kw7 _140sidpf _lycustnw _15d8b3bt _1fztidpf _wd7eu2gc _1olcu2gc _1oaz1fgx _w9ewidpf _170tidpf _y1g1idpf _1nvfidpf _1b8d1hjo _1n121kw7 _7p9oidpf _o2e1stnw _16u6b3bt _1yk1idpf _1lbou2gc _1c9uu2gc _1i2072d1 _bppridpf _1mbxidpf _kn0bidpf _wsgdidpf _rsmzmfou _1m0e1kw7 _93pdidpf _1sglstnw _1ksob3bt _1p9sidpf _1qa1u2gc _1jjcu2gc _fiemln51 _pascidpf _eid3idpf _zr3eidpf _fntnidpf _1mp41kw7 _kfgte4h9 _1cs8stnw _1russudh _1kt9b3bt _1fkridpf _1enwidpf _z5wtu2gc" : "_k48p1wq8 _ahbqx0bf _gpbcidpf _10vzidpf _1mmwidpf _15plidpf _7hip15vq _1fud15vq _bb0mh2mm _1quz1425 _rzxytlke _1ofh12x7 _pryi12x7 _1a85u2gc _rmpau2gc _1dze1l2s _1tms1q9c _fiizidpf _1xrmidpf _xyihidpf _166qidpf _17hygqwt _1lzupl7t _24g71kw7 _140sidpf _lycustnw _15d8b3bt _1fztidpf _wd7eu2gc _1olcu2gc _1oaz1fgx _w9ewidpf _170tidpf _y1g1idpf _1nvfidpf _1jakgqwt _1b8dpl7t _1n121kw7 _7p9oidpf _o2e1stnw _16u6b3bt _1yk1idpf _1lbou2gc _1c9uu2gc _1i2072d1 _bppridpf _1mbxidpf _kn0bidpf _wsgdidpf _9r9ugqwt _rsmz8hos _1m0e1kw7 _93pdidpf _1sglstnw _1ksob3bt _1p9sidpf _1qa1u2gc _1jjcu2gc _fiemln51 _pascidpf _eid3idpf _zr3eidpf _fntnidpf _rfx3gqwt _1mp41kw7 _kfgt1bk5 _1cs8stnw _1russudh _1kt9b3bt _1fkridpf _1enwidpf _z5wtu2gc"]),
|
|
106
106
|
style: {
|
|
107
|
-
"--_1xs0znw": (0, _runtime.ix)("var(--ds-space-075, 6px)".concat(" ", "var(--ds-space-100, 8px)")),
|
|
108
107
|
"--_13a5t4u": (0, _runtime.ix)("var(--ds-text-subtle, ".concat(_colors.N500, ")")),
|
|
109
108
|
"--_kkbq40": (0, _runtime.ix)("var(--ds-text-subtle, ".concat(_colors.B400, ")")),
|
|
110
109
|
"--_1nddtxm": (0, _runtime.ix)("var(--ds-border-width-indicator, 3px)".concat(" solid ", "var(--ds-border, transparent)")),
|
|
@@ -25,7 +25,7 @@ var tabsStyles = null;
|
|
|
25
25
|
var analyticsAttributes = {
|
|
26
26
|
componentName: 'tabs',
|
|
27
27
|
packageName: "@atlaskit/tabs",
|
|
28
|
-
packageVersion: "17.2.
|
|
28
|
+
packageVersion: "17.2.2"
|
|
29
29
|
};
|
|
30
30
|
var getTabPanelWithContext = function getTabPanelWithContext(_ref) {
|
|
31
31
|
var tabPanel = _ref.tabPanel,
|
|
@@ -1,8 +1,6 @@
|
|
|
1
1
|
|
|
2
|
-
._13xael4l [role=tab]{padding:var(--ds-space-075,6px) var(--ds-space-100,8px)}
|
|
3
2
|
._17hygqwt [role=tab]:hover:after{border-radius:var(--ds-border-radius-050,2px)}
|
|
4
3
|
._1jakgqwt [role=tab]:active:after{border-radius:var(--ds-border-radius-050,2px)}
|
|
5
|
-
._1yt4ze3t{padding:var(--ds-space-0,0)}
|
|
6
4
|
._9r9ugqwt [role=tab][aria-selected=true]:after{border-radius:var(--ds-border-radius-050,2px)}
|
|
7
5
|
._rfx3gqwt:before{border-radius:var(--ds-border-radius-050,2px)}
|
|
8
6
|
._1b8d1ec3 [role=tab]:active:after{border-block-end:var(--ds-border-width-indicator,3px) solid var(--ds-border,transparent)}
|
|
@@ -17,6 +15,7 @@
|
|
|
17
15
|
._166qidpf [role=tab]:hover:after{margin-left:0}
|
|
18
16
|
._16u6b3bt [role=tab]:active:after{content:""}
|
|
19
17
|
._170tidpf [role=tab]:active:after{margin-right:0}
|
|
18
|
+
._1a85u2gc [role=tab]{padding-inline-end:var(--ds-space-100,8px)}
|
|
20
19
|
._1c9uu2gc [role=tab]:active:after{inset-inline-start:var(--ds-space-100,8px)}
|
|
21
20
|
._1cs8stnw:before{position:absolute}
|
|
22
21
|
._1dze1l2s [role=tab]{text-overflow:ellipsis}
|
|
@@ -35,8 +34,10 @@
|
|
|
35
34
|
._1mp41kw7:before{width:inherit}
|
|
36
35
|
._1n121kw7 [role=tab]:active:after{width:inherit}
|
|
37
36
|
._1nvfidpf [role=tab]:active:after{margin-left:0}
|
|
37
|
+
._1ofh12x7 [role=tab]{padding-block-end:var(--ds-space-075,6px)}
|
|
38
38
|
._1olcu2gc [role=tab]:hover:after{inset-inline-start:var(--ds-space-100,8px)}
|
|
39
39
|
._1p9sidpf [role=tab][aria-selected=true]:after{inset-block-end:0}
|
|
40
|
+
._1q51ze3t{padding-block-start:var(--ds-space-0,0)}
|
|
40
41
|
._1qa1u2gc [role=tab][aria-selected=true]:after{inset-inline-end:var(--ds-space-100,8px)}
|
|
41
42
|
._1quzjjyb [role=tab]{color:var(--ds-text-subtle,#42526e)}
|
|
42
43
|
._1rushloo:before{background-color:var(--ds-border,#ebecf0)}
|
|
@@ -47,9 +48,11 @@
|
|
|
47
48
|
._24g71kw7 [role=tab]:hover:after{width:inherit}
|
|
48
49
|
._7hip15vq [role=tab]{overflow-x:hidden}
|
|
49
50
|
._7p9oidpf [role=tab]:active:after{height:0}
|
|
51
|
+
._85i5ze3t{padding-block-end:var(--ds-space-0,0)}
|
|
50
52
|
._93pdidpf [role=tab][aria-selected=true]:after{height:0}
|
|
51
53
|
._ahbqx0bf{margin-inline-start:var(--ds-space-negative-100,-8px)}
|
|
52
54
|
._bb0mh2mm [role=tab]{position:relative}
|
|
55
|
+
._bozgze3t{padding-inline-start:var(--ds-space-0,0)}
|
|
53
56
|
._bppridpf [role=tab][aria-selected=true]:after{margin-top:0}
|
|
54
57
|
._eid3idpf:before{margin-right:0}
|
|
55
58
|
._fiem1ldt [role=tab][aria-selected=true]{color:var(--ds-text-selected,#0052cc)}
|
|
@@ -64,12 +67,15 @@
|
|
|
64
67
|
._lycustnw [role=tab]:hover:after{position:absolute}
|
|
65
68
|
._o2e1stnw [role=tab]:active:after{position:absolute}
|
|
66
69
|
._pascidpf:before{margin-top:0}
|
|
70
|
+
._pryi12x7 [role=tab]{padding-block-start:var(--ds-space-075,6px)}
|
|
71
|
+
._rmpau2gc [role=tab]{padding-inline-start:var(--ds-space-100,8px)}
|
|
67
72
|
._rzxytlke [role=tab]{cursor:pointer}
|
|
68
73
|
._w9ewidpf [role=tab]:active:after{margin-top:0}
|
|
69
74
|
._wd7eu2gc [role=tab]:hover:after{inset-inline-end:var(--ds-space-100,8px)}
|
|
70
75
|
._wsgdidpf [role=tab][aria-selected=true]:after{margin-left:0}
|
|
71
76
|
._xyihidpf [role=tab]:hover:after{margin-bottom:0}
|
|
72
77
|
._y1g1idpf [role=tab]:active:after{margin-bottom:0}
|
|
78
|
+
._y4tize3t{padding-inline-end:var(--ds-space-0,0)}
|
|
73
79
|
._z5wtu2gc:before{inset-inline-start:var(--ds-space-100,8px)}
|
|
74
80
|
._zr3eidpf:before{margin-bottom:0}
|
|
75
81
|
._1oazdud1 [role=tab]:hover{color:var(--ds-text-subtle,#0052cc)}
|
|
@@ -92,7 +92,7 @@ const TabList = ({
|
|
|
92
92
|
ref: ref
|
|
93
93
|
// eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage
|
|
94
94
|
,
|
|
95
|
-
className: ax(["
|
|
95
|
+
className: ax(["_1e0c1txw _kqswh2mm _85i5ze3t _1q51ze3t _y4tize3t _bozgze3t", fg('platform-component-visual-refresh') ? "_k48p1wq8 _ahbqx0bf _gpbcidpf _10vzidpf _1mmwidpf _15plidpf _7hip15vq _1fud15vq _bb0mh2mm _1quzjjyb _rzxytlke _1ofh12x7 _pryi12x7 _1a85u2gc _rmpau2gc _1dze1l2s _1tms1q9c _fiizidpf _1xrmidpf _xyihidpf _166qidpf _1lzu1ec3 _24g71kw7 _140sidpf _lycustnw _15d8b3bt _1fztidpf _wd7eu2gc _1olcu2gc _1oazdud1 _w9ewidpf _170tidpf _y1g1idpf _1nvfidpf _1b8d1ec3 _1n121kw7 _7p9oidpf _o2e1stnw _16u6b3bt _1yk1idpf _1lbou2gc _1c9uu2gc _1i201ouy _bppridpf _1mbxidpf _kn0bidpf _wsgdidpf _rsmz174y _1m0e1kw7 _93pdidpf _1sglstnw _1ksob3bt _1p9sidpf _1qa1u2gc _1jjcu2gc _fiem1ldt _pascidpf _eid3idpf _zr3eidpf _fntnidpf _1mp41kw7 _kfgte4h9 _1cs8stnw _1rushloo _1kt9b3bt _1fkridpf _1enwidpf _z5wtu2gc" : "_k48p1wq8 _ahbqx0bf _gpbcidpf _10vzidpf _1mmwidpf _15plidpf _7hip15vq _1fud15vq _bb0mh2mm _1quzjjyb _rzxytlke _1ofh12x7 _pryi12x7 _1a85u2gc _rmpau2gc _1dze1l2s _1tms1q9c _fiizidpf _1xrmidpf _xyihidpf _166qidpf _17hygqwt _1lzu990c _24g71kw7 _140sidpf _lycustnw _15d8b3bt _1fztidpf _wd7eu2gc _1olcu2gc _1oazdud1 _w9ewidpf _170tidpf _y1g1idpf _1nvfidpf _1jakgqwt _1b8d990c _1n121kw7 _7p9oidpf _o2e1stnw _16u6b3bt _1yk1idpf _1lbou2gc _1c9uu2gc _1i201ouy _bppridpf _1mbxidpf _kn0bidpf _wsgdidpf _9r9ugqwt _rsmz1gcm _1m0e1kw7 _93pdidpf _1sglstnw _1ksob3bt _1p9sidpf _1qa1u2gc _1jjcu2gc _fiem1ldt _pascidpf _eid3idpf _zr3eidpf _fntnidpf _rfx3gqwt _1mp41kw7 _kfgt1bk5 _1cs8stnw _1rushloo _1kt9b3bt _1fkridpf _1enwidpf _z5wtu2gc"])
|
|
96
96
|
}, childrenArray.map((child, index) => getTabWithContext({
|
|
97
97
|
tab: child,
|
|
98
98
|
index,
|
|
@@ -1,8 +1,6 @@
|
|
|
1
1
|
|
|
2
|
-
._13xajb7m [role=tab]{padding:var(--_1xs0znw)}
|
|
3
2
|
._17hygqwt [role=tab]:hover:after{border-radius:var(--ds-border-radius-050,2px)}
|
|
4
3
|
._1jakgqwt [role=tab]:active:after{border-radius:var(--ds-border-radius-050,2px)}
|
|
5
|
-
._1yt4ze3t{padding:var(--ds-space-0,0)}
|
|
6
4
|
._9r9ugqwt [role=tab][aria-selected=true]:after{border-radius:var(--ds-border-radius-050,2px)}
|
|
7
5
|
._rfx3gqwt:before{border-radius:var(--ds-border-radius-050,2px)}
|
|
8
6
|
._1b8d1hjo [role=tab]:active:after{border-block-end:var(--_1nddtxm)}
|
|
@@ -17,6 +15,7 @@
|
|
|
17
15
|
._166qidpf [role=tab]:hover:after{margin-left:0}
|
|
18
16
|
._16u6b3bt [role=tab]:active:after{content:""}
|
|
19
17
|
._170tidpf [role=tab]:active:after{margin-right:0}
|
|
18
|
+
._1a85u2gc [role=tab]{padding-inline-end:var(--ds-space-100,8px)}
|
|
20
19
|
._1c9uu2gc [role=tab]:active:after{inset-inline-start:var(--ds-space-100,8px)}
|
|
21
20
|
._1cs8stnw:before{position:absolute}
|
|
22
21
|
._1dze1l2s [role=tab]{text-overflow:ellipsis}
|
|
@@ -35,8 +34,10 @@
|
|
|
35
34
|
._1mp41kw7:before{width:inherit}
|
|
36
35
|
._1n121kw7 [role=tab]:active:after{width:inherit}
|
|
37
36
|
._1nvfidpf [role=tab]:active:after{margin-left:0}
|
|
37
|
+
._1ofh12x7 [role=tab]{padding-block-end:var(--ds-space-075,6px)}
|
|
38
38
|
._1olcu2gc [role=tab]:hover:after{inset-inline-start:var(--ds-space-100,8px)}
|
|
39
39
|
._1p9sidpf [role=tab][aria-selected=true]:after{inset-block-end:0}
|
|
40
|
+
._1q51ze3t{padding-block-start:var(--ds-space-0,0)}
|
|
40
41
|
._1qa1u2gc [role=tab][aria-selected=true]:after{inset-inline-end:var(--ds-space-100,8px)}
|
|
41
42
|
._1quz1425 [role=tab]{color:var(--_13a5t4u)}
|
|
42
43
|
._1russudh:before{background-color:var(--_lvpq93)}
|
|
@@ -47,9 +48,11 @@
|
|
|
47
48
|
._24g71kw7 [role=tab]:hover:after{width:inherit}
|
|
48
49
|
._7hip15vq [role=tab]{overflow-x:hidden}
|
|
49
50
|
._7p9oidpf [role=tab]:active:after{height:0}
|
|
51
|
+
._85i5ze3t{padding-block-end:var(--ds-space-0,0)}
|
|
50
52
|
._93pdidpf [role=tab][aria-selected=true]:after{height:0}
|
|
51
53
|
._ahbqx0bf{margin-inline-start:var(--ds-space-negative-100,-8px)}
|
|
52
54
|
._bb0mh2mm [role=tab]{position:relative}
|
|
55
|
+
._bozgze3t{padding-inline-start:var(--ds-space-0,0)}
|
|
53
56
|
._bppridpf [role=tab][aria-selected=true]:after{margin-top:0}
|
|
54
57
|
._eid3idpf:before{margin-right:0}
|
|
55
58
|
._fiemln51 [role=tab][aria-selected=true]{color:var(--_1hfkvbo)}
|
|
@@ -64,12 +67,15 @@
|
|
|
64
67
|
._lycustnw [role=tab]:hover:after{position:absolute}
|
|
65
68
|
._o2e1stnw [role=tab]:active:after{position:absolute}
|
|
66
69
|
._pascidpf:before{margin-top:0}
|
|
70
|
+
._pryi12x7 [role=tab]{padding-block-start:var(--ds-space-075,6px)}
|
|
71
|
+
._rmpau2gc [role=tab]{padding-inline-start:var(--ds-space-100,8px)}
|
|
67
72
|
._rzxytlke [role=tab]{cursor:pointer}
|
|
68
73
|
._w9ewidpf [role=tab]:active:after{margin-top:0}
|
|
69
74
|
._wd7eu2gc [role=tab]:hover:after{inset-inline-end:var(--ds-space-100,8px)}
|
|
70
75
|
._wsgdidpf [role=tab][aria-selected=true]:after{margin-left:0}
|
|
71
76
|
._xyihidpf [role=tab]:hover:after{margin-bottom:0}
|
|
72
77
|
._y1g1idpf [role=tab]:active:after{margin-bottom:0}
|
|
78
|
+
._y4tize3t{padding-inline-end:var(--ds-space-0,0)}
|
|
73
79
|
._z5wtu2gc:before{inset-inline-start:var(--ds-space-100,8px)}
|
|
74
80
|
._zr3eidpf:before{margin-bottom:0}
|
|
75
81
|
._1oaz1fgx [role=tab]:hover{color:var(--_kkbq40)}
|
|
@@ -93,9 +93,8 @@ var TabList = function TabList(_ref) {
|
|
|
93
93
|
ref: ref
|
|
94
94
|
// eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage
|
|
95
95
|
,
|
|
96
|
-
className: ax(["
|
|
96
|
+
className: ax(["_1e0c1txw _kqswh2mm _85i5ze3t _1q51ze3t _y4tize3t _bozgze3t", fg('platform-component-visual-refresh') ? "_k48p1wq8 _ahbqx0bf _gpbcidpf _10vzidpf _1mmwidpf _15plidpf _7hip15vq _1fud15vq _bb0mh2mm _1quz1425 _rzxytlke _1ofh12x7 _pryi12x7 _1a85u2gc _rmpau2gc _1dze1l2s _1tms1q9c _fiizidpf _1xrmidpf _xyihidpf _166qidpf _1lzu1hjo _24g71kw7 _140sidpf _lycustnw _15d8b3bt _1fztidpf _wd7eu2gc _1olcu2gc _1oaz1fgx _w9ewidpf _170tidpf _y1g1idpf _1nvfidpf _1b8d1hjo _1n121kw7 _7p9oidpf _o2e1stnw _16u6b3bt _1yk1idpf _1lbou2gc _1c9uu2gc _1i2072d1 _bppridpf _1mbxidpf _kn0bidpf _wsgdidpf _rsmzmfou _1m0e1kw7 _93pdidpf _1sglstnw _1ksob3bt _1p9sidpf _1qa1u2gc _1jjcu2gc _fiemln51 _pascidpf _eid3idpf _zr3eidpf _fntnidpf _1mp41kw7 _kfgte4h9 _1cs8stnw _1russudh _1kt9b3bt _1fkridpf _1enwidpf _z5wtu2gc" : "_k48p1wq8 _ahbqx0bf _gpbcidpf _10vzidpf _1mmwidpf _15plidpf _7hip15vq _1fud15vq _bb0mh2mm _1quz1425 _rzxytlke _1ofh12x7 _pryi12x7 _1a85u2gc _rmpau2gc _1dze1l2s _1tms1q9c _fiizidpf _1xrmidpf _xyihidpf _166qidpf _17hygqwt _1lzupl7t _24g71kw7 _140sidpf _lycustnw _15d8b3bt _1fztidpf _wd7eu2gc _1olcu2gc _1oaz1fgx _w9ewidpf _170tidpf _y1g1idpf _1nvfidpf _1jakgqwt _1b8dpl7t _1n121kw7 _7p9oidpf _o2e1stnw _16u6b3bt _1yk1idpf _1lbou2gc _1c9uu2gc _1i2072d1 _bppridpf _1mbxidpf _kn0bidpf _wsgdidpf _9r9ugqwt _rsmz8hos _1m0e1kw7 _93pdidpf _1sglstnw _1ksob3bt _1p9sidpf _1qa1u2gc _1jjcu2gc _fiemln51 _pascidpf _eid3idpf _zr3eidpf _fntnidpf _rfx3gqwt _1mp41kw7 _kfgt1bk5 _1cs8stnw _1russudh _1kt9b3bt _1fkridpf _1enwidpf _z5wtu2gc"]),
|
|
97
97
|
style: {
|
|
98
|
-
"--_1xs0znw": ix("var(--ds-space-075, 6px)".concat(" ", "var(--ds-space-100, 8px)")),
|
|
99
98
|
"--_13a5t4u": ix("var(--ds-text-subtle, ".concat(N500, ")")),
|
|
100
99
|
"--_kkbq40": ix("var(--ds-text-subtle, ".concat(B400, ")")),
|
|
101
100
|
"--_1nddtxm": ix("var(--ds-border-width-indicator, 3px)".concat(" solid ", "var(--ds-border, transparent)")),
|
|
@@ -15,7 +15,7 @@ var tabsStyles = null;
|
|
|
15
15
|
var analyticsAttributes = {
|
|
16
16
|
componentName: 'tabs',
|
|
17
17
|
packageName: "@atlaskit/tabs",
|
|
18
|
-
packageVersion: "17.2.
|
|
18
|
+
packageVersion: "17.2.2"
|
|
19
19
|
};
|
|
20
20
|
var getTabPanelWithContext = function getTabPanelWithContext(_ref) {
|
|
21
21
|
var tabPanel = _ref.tabPanel,
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
|
|
1
|
+
import React from 'react';
|
|
2
2
|
import { type TabPanelProps } from '../types';
|
|
3
3
|
/**
|
|
4
4
|
* __TabPanel__
|
|
@@ -9,5 +9,5 @@ import { type TabPanelProps } from '../types';
|
|
|
9
9
|
* - [Code](https://atlassian.design/components/tabs/code)
|
|
10
10
|
* - [Usage](https://atlassian.design/components/tabs/usage)
|
|
11
11
|
*/
|
|
12
|
-
declare const TabPanel: ({ children, testId }: TabPanelProps) => JSX.Element;
|
|
12
|
+
declare const TabPanel: ({ children, testId }: TabPanelProps) => React.JSX.Element;
|
|
13
13
|
export default TabPanel;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
|
|
1
|
+
import React from 'react';
|
|
2
2
|
import { type TabPanelProps } from '../types';
|
|
3
3
|
/**
|
|
4
4
|
* __TabPanel__
|
|
@@ -9,5 +9,5 @@ import { type TabPanelProps } from '../types';
|
|
|
9
9
|
* - [Code](https://atlassian.design/components/tabs/code)
|
|
10
10
|
* - [Usage](https://atlassian.design/components/tabs/usage)
|
|
11
11
|
*/
|
|
12
|
-
declare const TabPanel: ({ children, testId }: TabPanelProps) => JSX.Element;
|
|
12
|
+
declare const TabPanel: ({ children, testId }: TabPanelProps) => React.JSX.Element;
|
|
13
13
|
export default TabPanel;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@atlaskit/tabs",
|
|
3
|
-
"version": "17.2.
|
|
3
|
+
"version": "17.2.2",
|
|
4
4
|
"description": "Tabs are used to organize content by grouping similar information on the same page.",
|
|
5
5
|
"publishConfig": {
|
|
6
6
|
"registry": "https://registry.npmjs.org/"
|
|
@@ -37,7 +37,7 @@
|
|
|
37
37
|
"@atlaskit/codemod-utils": "^4.2.0",
|
|
38
38
|
"@atlaskit/css": "^0.8.0",
|
|
39
39
|
"@atlaskit/focus-ring": "^2.1.0",
|
|
40
|
-
"@atlaskit/platform-feature-flags": "^0.
|
|
40
|
+
"@atlaskit/platform-feature-flags": "^1.0.0",
|
|
41
41
|
"@atlaskit/primitives": "^13.4.0",
|
|
42
42
|
"@atlaskit/theme": "^14.1.0",
|
|
43
43
|
"@atlaskit/tokens": "^3.3.0",
|
|
@@ -56,7 +56,6 @@
|
|
|
56
56
|
"@atlaskit/tooltip": "^19.1.0",
|
|
57
57
|
"@atlaskit/visual-regression": "*",
|
|
58
58
|
"@testing-library/react": "^13.4.0",
|
|
59
|
-
"jscodeshift": "^0.13.0",
|
|
60
59
|
"react-dom": "^18.2.0",
|
|
61
60
|
"react-lorem-component": "^0.13.0",
|
|
62
61
|
"storybook-addon-performance": "^0.17.3",
|
|
@@ -1,31 +0,0 @@
|
|
|
1
|
-
import { type JSCodeshift } from 'jscodeshift';
|
|
2
|
-
import { type Collection } from 'jscodeshift/src/Collection';
|
|
3
|
-
|
|
4
|
-
import { createTransformer, hasImportDeclaration } from '@atlaskit/codemod-utils';
|
|
5
|
-
|
|
6
|
-
import { addIdProp } from './migrations/add-id-prop';
|
|
7
|
-
import { mapTabsProp, removeTabsProp } from './migrations/map-tabs-prop';
|
|
8
|
-
import { migrateOnSelectType } from './migrations/on-select-to-on-change';
|
|
9
|
-
import { removeComponentsProp } from './migrations/remove-components-prop';
|
|
10
|
-
import { removeIsSelectedTestProp } from './migrations/remove-is-selected-test-prop';
|
|
11
|
-
import { removeTabItemTabContent } from './migrations/remove-tab-item-tab-content';
|
|
12
|
-
import { removeTypes } from './migrations/remove-types';
|
|
13
|
-
import { renameIsContentPersistedToShouldUnmountTabPanelOnChange } from './migrations/rename-is-content-persisted-to-should-unmount-tab-panel-on-change';
|
|
14
|
-
|
|
15
|
-
const transformer = createTransformer(
|
|
16
|
-
[
|
|
17
|
-
// Note these first 2 must be done first while there is one JSX element for tabs
|
|
18
|
-
addIdProp,
|
|
19
|
-
renameIsContentPersistedToShouldUnmountTabPanelOnChange,
|
|
20
|
-
migrateOnSelectType,
|
|
21
|
-
removeTabItemTabContent,
|
|
22
|
-
mapTabsProp,
|
|
23
|
-
removeTabsProp,
|
|
24
|
-
removeComponentsProp,
|
|
25
|
-
removeIsSelectedTestProp,
|
|
26
|
-
removeTypes,
|
|
27
|
-
],
|
|
28
|
-
(j: JSCodeshift, source: Collection<Node>) => hasImportDeclaration(j, source, '@atlaskit/tabs'),
|
|
29
|
-
);
|
|
30
|
-
|
|
31
|
-
export default transformer;
|