@alfalab/core-components-tabs 9.1.1 → 9.2.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/components/primary-tablist/index.css +131 -131
- package/components/primary-tablist/index.module.css.js +1 -1
- package/components/primary-tablist/mobile.css +219 -219
- package/components/primary-tablist/mobile.module.css.js +1 -1
- package/components/scroll-controls/index.css +11 -11
- package/components/scroll-controls/index.module.css.js +1 -1
- package/components/scrollable-container/index.css +5 -5
- package/components/scrollable-container/index.module.css.js +1 -1
- package/components/secondary-tablist/index.css +18 -18
- package/components/secondary-tablist/index.module.css.js +1 -1
- package/components/secondary-tablist/mobile.css +22 -22
- package/components/secondary-tablist/mobile.module.css.js +1 -1
- package/components/tab/index.css +2 -2
- package/components/tab/index.module.css.js +1 -1
- package/components/tabs/Component.d.ts +1 -1
- package/components/tabs/Component.js +2 -11
- package/components/tabs/Component.js.map +1 -1
- package/cssm/components/tabs/Component.d.ts +1 -1
- package/cssm/components/tabs/Component.js +2 -11
- package/cssm/components/tabs/Component.js.map +1 -1
- package/cssm/hooks/use-tablist-titles.d.ts +49 -0
- package/cssm/typings.d.ts +11 -1
- package/esm/components/primary-tablist/index.css +131 -131
- package/esm/components/primary-tablist/index.module.css.js +1 -1
- package/esm/components/primary-tablist/mobile.css +219 -219
- package/esm/components/primary-tablist/mobile.module.css.js +1 -1
- package/esm/components/scroll-controls/index.css +11 -11
- package/esm/components/scroll-controls/index.module.css.js +1 -1
- package/esm/components/scrollable-container/index.css +5 -5
- package/esm/components/scrollable-container/index.module.css.js +1 -1
- package/esm/components/secondary-tablist/index.css +18 -18
- package/esm/components/secondary-tablist/index.module.css.js +1 -1
- package/esm/components/secondary-tablist/mobile.css +22 -22
- package/esm/components/secondary-tablist/mobile.module.css.js +1 -1
- package/esm/components/tab/index.css +2 -2
- package/esm/components/tab/index.module.css.js +1 -1
- package/esm/components/tabs/Component.d.ts +1 -1
- package/esm/components/tabs/Component.js +2 -11
- package/esm/components/tabs/Component.js.map +1 -1
- package/esm/hooks/use-tablist-titles.d.ts +49 -0
- package/esm/typings.d.ts +11 -1
- package/hooks/use-tablist-titles.d.ts +49 -0
- package/modern/components/primary-tablist/index.css +131 -131
- package/modern/components/primary-tablist/index.module.css.js +1 -1
- package/modern/components/primary-tablist/mobile.css +219 -219
- package/modern/components/primary-tablist/mobile.module.css.js +1 -1
- package/modern/components/scroll-controls/index.css +11 -11
- package/modern/components/scroll-controls/index.module.css.js +1 -1
- package/modern/components/scrollable-container/index.css +5 -5
- package/modern/components/scrollable-container/index.module.css.js +1 -1
- package/modern/components/secondary-tablist/index.css +18 -18
- package/modern/components/secondary-tablist/index.module.css.js +1 -1
- package/modern/components/secondary-tablist/mobile.css +22 -22
- package/modern/components/secondary-tablist/mobile.module.css.js +1 -1
- package/modern/components/tab/index.css +2 -2
- package/modern/components/tab/index.module.css.js +1 -1
- package/modern/components/tabs/Component.d.ts +1 -1
- package/modern/components/tabs/Component.js +2 -1
- package/modern/components/tabs/Component.js.map +1 -1
- package/modern/hooks/use-tablist-titles.d.ts +49 -0
- package/modern/typings.d.ts +11 -1
- package/moderncssm/components/tabs/Component.d.ts +1 -1
- package/moderncssm/components/tabs/Component.js +2 -1
- package/moderncssm/components/tabs/Component.js.map +1 -1
- package/moderncssm/hooks/use-tablist-titles.d.ts +49 -0
- package/moderncssm/typings.d.ts +11 -1
- package/package.json +6 -6
- package/src/components/tabs/Component.tsx +3 -0
- package/src/typings.ts +24 -1
- package/typings.d.ts +11 -1
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
|
|
3
3
|
require('./mobile.css');
|
|
4
4
|
|
|
5
|
-
var mobileStyles = {"title":"
|
|
5
|
+
var mobileStyles = {"title":"tabs__title_1uj9p tabs__title_vpnkp","mobile":"tabs__mobile_1uj9p","paragraph-primary-large":"tabs__paragraph-primary-large_1uj9p","paragraph-primary-medium":"tabs__paragraph-primary-medium_1uj9p","paragraph-primary-small":"tabs__paragraph-primary-small_1uj9p","action-primary-large":"tabs__action-primary-large_1uj9p","action-primary-medium":"tabs__action-primary-medium_1uj9p","action-primary-small":"tabs__action-primary-small_1uj9p","accent-primary-large":"tabs__accent-primary-large_1uj9p","accent-primary-medium":"tabs__accent-primary-medium_1uj9p","accent-primary-small":"tabs__accent-primary-small_1uj9p","pickerWrapper":"tabs__pickerWrapper_1uj9p","option":"tabs__option_1uj9p","scrollControls":"tabs__scrollControls_1uj9p","headline-system-xlarge":"tabs__headline-system-xlarge_1uj9p","headline-system-large":"tabs__headline-system-large_1uj9p","headline-system-medium":"tabs__headline-system-medium_1uj9p","headline-system-small":"tabs__headline-system-small_1uj9p","headline-system-xsmall":"tabs__headline-system-xsmall_1uj9p","headline-xlarge":"tabs__headline-xlarge_1uj9p","headline-large":"tabs__headline-large_1uj9p","headline-medium":"tabs__headline-medium_1uj9p","headline-small":"tabs__headline-small_1uj9p","headline-xsmall":"tabs__headline-xsmall_1uj9p"};
|
|
6
6
|
|
|
7
7
|
module.exports = mobileStyles;
|
|
8
8
|
//# sourceMappingURL=mobile.module.css.js.map
|
|
@@ -9,14 +9,14 @@
|
|
|
9
9
|
--gap-8: var(--gap-xs);
|
|
10
10
|
} :root {
|
|
11
11
|
--primary-tablist-bottom-border-color: var(--color-light-neutral-translucent-500);
|
|
12
|
-
} .
|
|
12
|
+
} .tabs__component_1mor2 {
|
|
13
13
|
position: relative;
|
|
14
14
|
display: flex;
|
|
15
15
|
flex-shrink: 0;
|
|
16
|
-
} .
|
|
16
|
+
} .tabs__primary_1mor2 {
|
|
17
17
|
align-items: flex-start;
|
|
18
18
|
justify-content: flex-end;
|
|
19
|
-
} .
|
|
19
|
+
} .tabs__primary_1mor2:after {
|
|
20
20
|
content: '';
|
|
21
21
|
display: block;
|
|
22
22
|
position: absolute;
|
|
@@ -24,18 +24,18 @@
|
|
|
24
24
|
height: 1px;
|
|
25
25
|
width: 100%;
|
|
26
26
|
background-color: var(--primary-tablist-bottom-border-color);
|
|
27
|
-
} .
|
|
27
|
+
} .tabs__primary_1mor2 {
|
|
28
28
|
|
|
29
|
-
.
|
|
29
|
+
.tabs__button_1mor2:first-child {
|
|
30
30
|
padding-left: var(--gap-8);
|
|
31
31
|
margin-right: var(--gap-8);
|
|
32
32
|
}
|
|
33
|
-
} .
|
|
33
|
+
} .tabs__primary_1mor2.tabs__xl_1mor2 .tabs__button_1mor2:first-child {
|
|
34
34
|
margin-right: var(--gap-4);
|
|
35
|
-
} .
|
|
35
|
+
} .tabs__secondary_1mor2 {
|
|
36
36
|
align-items: center;
|
|
37
37
|
justify-content: center;
|
|
38
|
-
} .
|
|
38
|
+
} .tabs__secondary_1mor2:before {
|
|
39
39
|
content: '';
|
|
40
40
|
display: block;
|
|
41
41
|
position: absolute;
|
|
@@ -45,12 +45,12 @@
|
|
|
45
45
|
background-color: transparent;
|
|
46
46
|
transition: background-color 0.3s ease;
|
|
47
47
|
bottom: var(--gap-0);
|
|
48
|
-
} .
|
|
48
|
+
} .tabs__secondary_1mor2.tabs__xs_1mor2 {
|
|
49
49
|
width: 76px;
|
|
50
50
|
|
|
51
|
-
.
|
|
51
|
+
.tabs__button_1mor2:first-child {
|
|
52
52
|
margin-right: var(--gap-4);
|
|
53
53
|
}
|
|
54
|
-
} .
|
|
54
|
+
} .tabs__borderVisible_1mor2:before {
|
|
55
55
|
background-color: var(--color-light-neutral-translucent-300);
|
|
56
56
|
}
|
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
|
|
3
3
|
require('./index.css');
|
|
4
4
|
|
|
5
|
-
var styles = {"component":"
|
|
5
|
+
var styles = {"component":"tabs__component_1mor2","primary":"tabs__primary_1mor2","button":"tabs__button_1mor2","xl":"tabs__xl_1mor2","secondary":"tabs__secondary_1mor2","xs":"tabs__xs_1mor2","borderVisible":"tabs__borderVisible_1mor2"};
|
|
6
6
|
|
|
7
7
|
module.exports = styles;
|
|
8
8
|
//# sourceMappingURL=index.module.css.js.map
|
|
@@ -6,9 +6,9 @@
|
|
|
6
6
|
--gap-4: var(--gap-2xs);
|
|
7
7
|
--gap-4-neg: var(--gap-2xs-neg);
|
|
8
8
|
--gap-16-neg: var(--gap-m-neg);
|
|
9
|
-
} .
|
|
9
|
+
} .tabs__scrollableContainerWrapper_1e04w {
|
|
10
10
|
display: flex;
|
|
11
|
-
} .
|
|
11
|
+
} .tabs__container_1e04w {
|
|
12
12
|
position: relative;
|
|
13
13
|
overflow-x: auto;
|
|
14
14
|
overflow-y: hidden;
|
|
@@ -17,11 +17,11 @@
|
|
|
17
17
|
flex: 1;
|
|
18
18
|
margin: var(--gap-4-neg) var(--gap-0) var(--gap-4-neg) var(--gap-4-neg);
|
|
19
19
|
padding: var(--gap-4) var(--gap-0) var(--gap-4) var(--gap-4);
|
|
20
|
-
} .
|
|
20
|
+
} .tabs__container_1e04w::-webkit-scrollbar {
|
|
21
21
|
display: none;
|
|
22
|
-
} .
|
|
22
|
+
} .tabs__container_1e04w > * {
|
|
23
23
|
flex-shrink: 0;
|
|
24
|
-
} .
|
|
24
|
+
} .tabs__fullWidthScroll_1e04w {
|
|
25
25
|
padding-left: var(--gap-0);
|
|
26
26
|
margin: var(--gap-4-neg) var(--gap-16-neg);
|
|
27
27
|
}
|
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
|
|
3
3
|
require('./index.css');
|
|
4
4
|
|
|
5
|
-
var styles = {"scrollableContainerWrapper":"
|
|
5
|
+
var styles = {"scrollableContainerWrapper":"tabs__scrollableContainerWrapper_1e04w","container":"tabs__container_1e04w","fullWidthScroll":"tabs__fullWidthScroll_1e04w"};
|
|
6
6
|
|
|
7
7
|
module.exports = styles;
|
|
8
8
|
//# sourceMappingURL=index.module.css.js.map
|
|
@@ -18,37 +18,37 @@
|
|
|
18
18
|
--secondary-tablist-l-gaps: var(--gap-16);
|
|
19
19
|
--secondary-tablist-xl-gaps: var(--gap-16);
|
|
20
20
|
--secondary-tablist-transparent-gaps: var(--gap-0);
|
|
21
|
-
} .
|
|
21
|
+
} .tabs__component_vfc4i {
|
|
22
22
|
position: relative;
|
|
23
23
|
display: inline-flex;
|
|
24
|
-
} .
|
|
24
|
+
} .tabs__fullWidthScroll_vfc4i {
|
|
25
25
|
margin: var(--gap-0) var(--gap-16);
|
|
26
|
-
} .
|
|
26
|
+
} .tabs__container_vfc4i {
|
|
27
27
|
overflow: hidden;
|
|
28
28
|
margin: var(--gap-4-neg) var(--gap-0) var(--gap-4-neg) var(--gap-4-neg);
|
|
29
29
|
padding: var(--gap-4) var(--gap-0) var(--gap-4) var(--gap-4);
|
|
30
|
-
} .
|
|
30
|
+
} .tabs__title_vfc4i {
|
|
31
31
|
white-space: nowrap;
|
|
32
|
-
} .
|
|
33
|
-
.
|
|
32
|
+
} .tabs__desktop_vfc4i.tabs__desktop_vfc4i.tabs__transparentView_vfc4i.tabs__transparentView_vfc4i {
|
|
33
|
+
.tabs__title_vfc4i.tabs__title_vfc4i {
|
|
34
34
|
margin-left: var(--secondary-tablist-transparent-gaps);
|
|
35
35
|
}
|
|
36
|
-
} .
|
|
37
|
-
.
|
|
36
|
+
} .tabs__xxs_vfc4i .tabs__title_vfc4i + .tabs__title_vfc4i,
|
|
37
|
+
.tabs__xxs_vfc4i .tabs__skeleton_vfc4i + .tabs__skeleton_vfc4i {
|
|
38
38
|
margin-left: var(--secondary-tablist-xxs-gaps);
|
|
39
|
-
} .
|
|
40
|
-
.
|
|
39
|
+
} .tabs__xs_vfc4i .tabs__title_vfc4i + .tabs__title_vfc4i,
|
|
40
|
+
.tabs__xs_vfc4i .tabs__skeleton_vfc4i + .tabs__skeleton_vfc4i {
|
|
41
41
|
margin-left: var(--secondary-tablist-xs-gaps);
|
|
42
|
-
} .
|
|
43
|
-
.
|
|
42
|
+
} .tabs__s_vfc4i .tabs__title_vfc4i + .tabs__title_vfc4i,
|
|
43
|
+
.tabs__s_vfc4i .tabs__skeleton_vfc4i + .tabs__skeleton_vfc4i {
|
|
44
44
|
margin-left: var(--secondary-tablist-s-gaps);
|
|
45
|
-
} .
|
|
46
|
-
.
|
|
45
|
+
} .tabs__m_vfc4i .tabs__title_vfc4i + .tabs__title_vfc4i,
|
|
46
|
+
.tabs__m_vfc4i .tabs__skeleton_vfc4i + .tabs__skeleton_vfc4i {
|
|
47
47
|
margin-left: var(--secondary-tablist-m-gaps);
|
|
48
|
-
} .
|
|
49
|
-
.
|
|
48
|
+
} .tabs__l_vfc4i .tabs__title_vfc4i + .tabs__title_vfc4i,
|
|
49
|
+
.tabs__l_vfc4i .tabs__skeleton_vfc4i + .tabs__skeleton_vfc4i {
|
|
50
50
|
margin-left: var(--secondary-tablist-l-gaps);
|
|
51
|
-
} .
|
|
52
|
-
.
|
|
51
|
+
} .tabs__xl_vfc4i .tabs__title_vfc4i + .tabs__title_vfc4i,
|
|
52
|
+
.tabs__xl_vfc4i .tabs__skeleton_vfc4i + .tabs__skeleton_vfc4i {
|
|
53
53
|
margin-left: var(--secondary-tablist-xl-gaps);
|
|
54
54
|
}
|
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
|
|
3
3
|
require('./index.css');
|
|
4
4
|
|
|
5
|
-
var commonStyles = {"component":"
|
|
5
|
+
var commonStyles = {"component":"tabs__component_vfc4i","fullWidthScroll":"tabs__fullWidthScroll_vfc4i","container":"tabs__container_vfc4i","title":"tabs__title_vfc4i","desktop":"tabs__desktop_vfc4i","transparentView":"tabs__transparentView_vfc4i","xxs":"tabs__xxs_vfc4i","skeleton":"tabs__skeleton_vfc4i","xs":"tabs__xs_vfc4i","s":"tabs__s_vfc4i","m":"tabs__m_vfc4i","l":"tabs__l_vfc4i","xl":"tabs__xl_vfc4i"};
|
|
6
6
|
|
|
7
7
|
module.exports = commonStyles;
|
|
8
8
|
//# sourceMappingURL=index.module.css.js.map
|
|
@@ -19,38 +19,38 @@
|
|
|
19
19
|
--secondary-tablist-l-gaps: var(--gap-16);
|
|
20
20
|
--secondary-tablist-xl-gaps: var(--gap-16);
|
|
21
21
|
--secondary-tablist-transparent-gaps: var(--gap-0);
|
|
22
|
-
}.
|
|
22
|
+
}.tabs__component_vfc4i {
|
|
23
23
|
position: relative;
|
|
24
24
|
display: inline-flex;
|
|
25
|
-
}.
|
|
25
|
+
}.tabs__fullWidthScroll_vfc4i {
|
|
26
26
|
margin: var(--gap-0) var(--gap-16);
|
|
27
|
-
}.
|
|
27
|
+
}.tabs__container_vfc4i {
|
|
28
28
|
overflow: hidden;
|
|
29
29
|
margin: var(--gap-4-neg) var(--gap-0) var(--gap-4-neg) var(--gap-4-neg);
|
|
30
30
|
padding: var(--gap-4) var(--gap-0) var(--gap-4) var(--gap-4);
|
|
31
|
-
}.
|
|
31
|
+
}.tabs__title_vfc4i {
|
|
32
32
|
white-space: nowrap;
|
|
33
|
-
}.
|
|
34
|
-
.
|
|
33
|
+
}.tabs__desktop_vfc4i.tabs__desktop_vfc4i.tabs__transparentView_vfc4i.tabs__transparentView_vfc4i {
|
|
34
|
+
.tabs__title_vfc4i.tabs__title_vfc4i {
|
|
35
35
|
margin-left: var(--secondary-tablist-transparent-gaps);
|
|
36
36
|
}
|
|
37
|
-
}.
|
|
38
|
-
.
|
|
37
|
+
}.tabs__xxs_vfc4i .tabs__title_vfc4i + .tabs__title_vfc4i,
|
|
38
|
+
.tabs__xxs_vfc4i .tabs__skeleton_vfc4i + .tabs__skeleton_vfc4i {
|
|
39
39
|
margin-left: var(--secondary-tablist-xxs-gaps);
|
|
40
|
-
}.
|
|
41
|
-
.
|
|
40
|
+
}.tabs__xs_vfc4i .tabs__title_vfc4i + .tabs__title_vfc4i,
|
|
41
|
+
.tabs__xs_vfc4i .tabs__skeleton_vfc4i + .tabs__skeleton_vfc4i {
|
|
42
42
|
margin-left: var(--secondary-tablist-xs-gaps);
|
|
43
|
-
}.
|
|
44
|
-
.
|
|
43
|
+
}.tabs__s_vfc4i .tabs__title_vfc4i + .tabs__title_vfc4i,
|
|
44
|
+
.tabs__s_vfc4i .tabs__skeleton_vfc4i + .tabs__skeleton_vfc4i {
|
|
45
45
|
margin-left: var(--secondary-tablist-s-gaps);
|
|
46
|
-
}.
|
|
47
|
-
.
|
|
46
|
+
}.tabs__m_vfc4i .tabs__title_vfc4i + .tabs__title_vfc4i,
|
|
47
|
+
.tabs__m_vfc4i .tabs__skeleton_vfc4i + .tabs__skeleton_vfc4i {
|
|
48
48
|
margin-left: var(--secondary-tablist-m-gaps);
|
|
49
|
-
}.
|
|
50
|
-
.
|
|
49
|
+
}.tabs__l_vfc4i .tabs__title_vfc4i + .tabs__title_vfc4i,
|
|
50
|
+
.tabs__l_vfc4i .tabs__skeleton_vfc4i + .tabs__skeleton_vfc4i {
|
|
51
51
|
margin-left: var(--secondary-tablist-l-gaps);
|
|
52
|
-
}.
|
|
53
|
-
.
|
|
52
|
+
}.tabs__xl_vfc4i .tabs__title_vfc4i + .tabs__title_vfc4i,
|
|
53
|
+
.tabs__xl_vfc4i .tabs__skeleton_vfc4i + .tabs__skeleton_vfc4i {
|
|
54
54
|
margin-left: var(--secondary-tablist-xl-gaps);
|
|
55
55
|
} :root {
|
|
56
56
|
--gap-2xs: 4px;
|
|
@@ -73,10 +73,10 @@
|
|
|
73
73
|
--secondary-tablist-l-gaps: var(--gap-16);
|
|
74
74
|
--secondary-tablist-xl-gaps: var(--gap-16);
|
|
75
75
|
--secondary-tablist-transparent-gaps: var(--gap-0);
|
|
76
|
-
} .
|
|
77
|
-
} .
|
|
78
|
-
.
|
|
76
|
+
} .tabs__title_131k3 {
|
|
77
|
+
} .tabs__mobile_131k3 .tabs__title_131k3 + .tabs__title_131k3,
|
|
78
|
+
.tabs__mobile_131k3 .tabs__skeleton_131k3 + .tabs__skeleton_131k3 {
|
|
79
79
|
margin-left: var(--secondary-tablist-mobile-gaps);
|
|
80
|
-
} .
|
|
80
|
+
} .tabs__mobile_131k3.tabs__transparentView_131k3.tabs__transparentView_131k3 .tabs__title_131k3 {
|
|
81
81
|
margin-left: var(--secondary-tablist-transparent-gaps);
|
|
82
82
|
}
|
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
|
|
3
3
|
require('./mobile.css');
|
|
4
4
|
|
|
5
|
-
var mobileStyles = {"title":"
|
|
5
|
+
var mobileStyles = {"title":"tabs__title_131k3 tabs__title_vfc4i","mobile":"tabs__mobile_131k3","skeleton":"tabs__skeleton_131k3","transparentView":"tabs__transparentView_131k3"};
|
|
6
6
|
|
|
7
7
|
module.exports = mobileStyles;
|
|
8
8
|
//# sourceMappingURL=mobile.module.css.js.map
|
package/components/tab/index.css
CHANGED
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
|
|
3
3
|
require('./index.css');
|
|
4
4
|
|
|
5
|
-
var styles = {"component":"
|
|
5
|
+
var styles = {"component":"tabs__component_htrt0","hidden":"tabs__hidden_htrt0"};
|
|
6
6
|
|
|
7
7
|
module.exports = styles;
|
|
8
8
|
//# sourceMappingURL=index.module.css.js.map
|
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { type TabsProps } from '../../typings';
|
|
3
|
-
export declare const Tabs: ({ TabList, className, containerClassName, size, children, selectedId, scrollable, collapsedTabsIds, fullWidthScroll, keepMounted, dataTestId, onChange, breakpoint, client, defaultMatchMediaValue, tagShape, tagView, showSkeleton, skeletonProps, textStyle, style, ...restProps }: Omit<TabsProps, 'view'>) => React.JSX.Element;
|
|
3
|
+
export declare const Tabs: ({ TabList, className, containerClassName, size, children, selectedId, scrollable, collapsedTabsIds, fullWidthScroll, keepMounted, dataTestId, onChange, breakpoint, client, defaultMatchMediaValue, tagShape, tagView, showSkeleton, skeletonProps, textStyle, style, titleProps, ...restProps }: Omit<TabsProps, 'view'>) => React.JSX.Element;
|
|
@@ -10,20 +10,11 @@ function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'defau
|
|
|
10
10
|
var React__default = /*#__PURE__*/_interopDefaultCompat(React);
|
|
11
11
|
|
|
12
12
|
var Tabs = function (_a) {
|
|
13
|
-
var TabList = _a.TabList, className = _a.className, containerClassName = _a.containerClassName, size = _a.size, children = _a.children, selectedId = _a.selectedId, scrollable = _a.scrollable, collapsedTabsIds = _a.collapsedTabsIds, _b = _a.fullWidthScroll, fullWidthScroll = _b === void 0 ? false : _b, _c = _a.keepMounted, keepMounted = _c === void 0 ? false : _c, dataTestId = _a.dataTestId, onChange = _a.onChange, breakpoint = _a.breakpoint, client = _a.client, defaultMatchMediaValue = _a.defaultMatchMediaValue, tagShape = _a.tagShape, tagView = _a.tagView, _d = _a.showSkeleton, showSkeleton = _d === void 0 ? false : _d, skeletonProps = _a.skeletonProps, textStyle = _a.textStyle, style = _a.style, restProps = tslib.__rest(_a, ["TabList", "className", "containerClassName", "size", "children", "selectedId", "scrollable", "collapsedTabsIds", "fullWidthScroll", "keepMounted", "dataTestId", "onChange", "breakpoint", "client", "defaultMatchMediaValue", "tagShape", "tagView", "showSkeleton", "skeletonProps", "textStyle", "style"]);
|
|
13
|
+
var TabList = _a.TabList, className = _a.className, containerClassName = _a.containerClassName, size = _a.size, children = _a.children, selectedId = _a.selectedId, scrollable = _a.scrollable, collapsedTabsIds = _a.collapsedTabsIds, _b = _a.fullWidthScroll, fullWidthScroll = _b === void 0 ? false : _b, _c = _a.keepMounted, keepMounted = _c === void 0 ? false : _c, dataTestId = _a.dataTestId, onChange = _a.onChange, breakpoint = _a.breakpoint, client = _a.client, defaultMatchMediaValue = _a.defaultMatchMediaValue, tagShape = _a.tagShape, tagView = _a.tagView, _d = _a.showSkeleton, showSkeleton = _d === void 0 ? false : _d, skeletonProps = _a.skeletonProps, textStyle = _a.textStyle, style = _a.style, titleProps = _a.titleProps, restProps = tslib.__rest(_a, ["TabList", "className", "containerClassName", "size", "children", "selectedId", "scrollable", "collapsedTabsIds", "fullWidthScroll", "keepMounted", "dataTestId", "onChange", "breakpoint", "client", "defaultMatchMediaValue", "tagShape", "tagView", "showSkeleton", "skeletonProps", "textStyle", "style", "titleProps"]);
|
|
14
14
|
var tabsArray = React__default.default.Children.toArray(children);
|
|
15
15
|
var titles = tabsArray.map(function (_a) {
|
|
16
16
|
var _b = _a.props, title = _b.title, id = _b.id, rightAddons = _b.rightAddons, disabled = _b.disabled, hidden = _b.hidden, toggleClassName = _b.toggleClassName, toggleTestId = _b.dataTestId, toggleRef = _b.toggleRef;
|
|
17
|
-
return ({
|
|
18
|
-
title: title,
|
|
19
|
-
id: id,
|
|
20
|
-
disabled: disabled,
|
|
21
|
-
rightAddons: rightAddons,
|
|
22
|
-
hidden: hidden,
|
|
23
|
-
toggleClassName: toggleClassName,
|
|
24
|
-
dataTestId: toggleTestId,
|
|
25
|
-
toggleRef: toggleRef,
|
|
26
|
-
});
|
|
17
|
+
return (tslib.__assign({ title: title, id: id, disabled: disabled, rightAddons: rightAddons, hidden: hidden, toggleClassName: toggleClassName, dataTestId: toggleTestId, toggleRef: toggleRef }, titleProps));
|
|
27
18
|
});
|
|
28
19
|
var tabs = tabsArray.filter(function (tab) { return tab.props.id === selectedId || tab.props.keepMounted || keepMounted; });
|
|
29
20
|
return (React__default.default.createElement("div", tslib.__assign({ className: className }, restProps),
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Component.js","sources":["../../src/components/tabs/Component.tsx"],"sourcesContent":["import React, { cloneElement } from 'react';\n\nimport { type TabsProps } from '../../typings';\n\nexport const Tabs = ({\n TabList,\n className,\n containerClassName,\n size,\n children,\n selectedId,\n scrollable,\n collapsedTabsIds,\n fullWidthScroll = false,\n keepMounted = false,\n dataTestId,\n onChange,\n breakpoint,\n client,\n defaultMatchMediaValue,\n tagShape,\n tagView,\n showSkeleton = false,\n skeletonProps,\n textStyle,\n style,\n ...restProps\n}: Omit<TabsProps, 'view'>) => {\n const tabsArray = React.Children.toArray(children) as TabsProps['children'];\n const titles = tabsArray.map(\n ({\n props: {\n title,\n id,\n rightAddons,\n disabled,\n hidden,\n toggleClassName,\n dataTestId: toggleTestId,\n toggleRef,\n },\n }) => ({\n title,\n id,\n disabled,\n rightAddons,\n hidden,\n toggleClassName,\n dataTestId: toggleTestId,\n toggleRef,\n }),\n );\n\n const tabs = tabsArray.filter(\n (tab) => tab.props.id === selectedId || tab.props.keepMounted || keepMounted,\n );\n\n return (\n <div className={className} {...restProps}>\n <TabList\n containerClassName={containerClassName}\n size={size}\n titles={titles}\n selectedId={selectedId}\n scrollable={scrollable}\n collapsedTabsIds={collapsedTabsIds}\n onChange={onChange}\n dataTestId={dataTestId}\n defaultMatchMediaValue={defaultMatchMediaValue}\n breakpoint={breakpoint}\n client={client}\n fullWidthScroll={fullWidthScroll}\n tagShape={tagShape}\n tagView={tagView}\n textStyle={textStyle}\n inlineStyle={style}\n showSkeleton={showSkeleton}\n skeletonProps={skeletonProps}\n />\n\n {tabs.map((tab) => cloneElement(tab, { hidden: tab.props.id !== selectedId }))}\n </div>\n );\n};\n"],"names":["__rest","React","__assign","cloneElement"],"mappings":";;;;;;;;;;;AAIO,IAAM,IAAI,GAAG,UAAC,
|
|
1
|
+
{"version":3,"file":"Component.js","sources":["../../src/components/tabs/Component.tsx"],"sourcesContent":["import React, { cloneElement } from 'react';\n\nimport { type TabsProps } from '../../typings';\n\nexport const Tabs = ({\n TabList,\n className,\n containerClassName,\n size,\n children,\n selectedId,\n scrollable,\n collapsedTabsIds,\n fullWidthScroll = false,\n keepMounted = false,\n dataTestId,\n onChange,\n breakpoint,\n client,\n defaultMatchMediaValue,\n tagShape,\n tagView,\n showSkeleton = false,\n skeletonProps,\n textStyle,\n style,\n titleProps,\n ...restProps\n}: Omit<TabsProps, 'view'>) => {\n const tabsArray = React.Children.toArray(children) as TabsProps['children'];\n\n const titles = tabsArray.map(\n ({\n props: {\n title,\n id,\n rightAddons,\n disabled,\n hidden,\n toggleClassName,\n dataTestId: toggleTestId,\n toggleRef,\n },\n }) => ({\n title,\n id,\n disabled,\n rightAddons,\n hidden,\n toggleClassName,\n dataTestId: toggleTestId,\n toggleRef,\n ...titleProps,\n }),\n );\n\n const tabs = tabsArray.filter(\n (tab) => tab.props.id === selectedId || tab.props.keepMounted || keepMounted,\n );\n\n return (\n <div className={className} {...restProps}>\n <TabList\n containerClassName={containerClassName}\n size={size}\n titles={titles}\n selectedId={selectedId}\n scrollable={scrollable}\n collapsedTabsIds={collapsedTabsIds}\n onChange={onChange}\n dataTestId={dataTestId}\n defaultMatchMediaValue={defaultMatchMediaValue}\n breakpoint={breakpoint}\n client={client}\n fullWidthScroll={fullWidthScroll}\n tagShape={tagShape}\n tagView={tagView}\n textStyle={textStyle}\n inlineStyle={style}\n showSkeleton={showSkeleton}\n skeletonProps={skeletonProps}\n />\n\n {tabs.map((tab) => cloneElement(tab, { hidden: tab.props.id !== selectedId }))}\n </div>\n );\n};\n"],"names":["__rest","React","__assign","cloneElement"],"mappings":"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"}
|
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { type TabsProps } from '../../typings';
|
|
3
|
-
export declare const Tabs: ({ TabList, className, containerClassName, size, children, selectedId, scrollable, collapsedTabsIds, fullWidthScroll, keepMounted, dataTestId, onChange, breakpoint, client, defaultMatchMediaValue, tagShape, tagView, showSkeleton, skeletonProps, textStyle, style, ...restProps }: Omit<TabsProps, 'view'>) => React.JSX.Element;
|
|
3
|
+
export declare const Tabs: ({ TabList, className, containerClassName, size, children, selectedId, scrollable, collapsedTabsIds, fullWidthScroll, keepMounted, dataTestId, onChange, breakpoint, client, defaultMatchMediaValue, tagShape, tagView, showSkeleton, skeletonProps, textStyle, style, titleProps, ...restProps }: Omit<TabsProps, 'view'>) => React.JSX.Element;
|
|
@@ -10,20 +10,11 @@ function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'defau
|
|
|
10
10
|
var React__default = /*#__PURE__*/_interopDefaultCompat(React);
|
|
11
11
|
|
|
12
12
|
var Tabs = function (_a) {
|
|
13
|
-
var TabList = _a.TabList, className = _a.className, containerClassName = _a.containerClassName, size = _a.size, children = _a.children, selectedId = _a.selectedId, scrollable = _a.scrollable, collapsedTabsIds = _a.collapsedTabsIds, _b = _a.fullWidthScroll, fullWidthScroll = _b === void 0 ? false : _b, _c = _a.keepMounted, keepMounted = _c === void 0 ? false : _c, dataTestId = _a.dataTestId, onChange = _a.onChange, breakpoint = _a.breakpoint, client = _a.client, defaultMatchMediaValue = _a.defaultMatchMediaValue, tagShape = _a.tagShape, tagView = _a.tagView, _d = _a.showSkeleton, showSkeleton = _d === void 0 ? false : _d, skeletonProps = _a.skeletonProps, textStyle = _a.textStyle, style = _a.style, restProps = tslib.__rest(_a, ["TabList", "className", "containerClassName", "size", "children", "selectedId", "scrollable", "collapsedTabsIds", "fullWidthScroll", "keepMounted", "dataTestId", "onChange", "breakpoint", "client", "defaultMatchMediaValue", "tagShape", "tagView", "showSkeleton", "skeletonProps", "textStyle", "style"]);
|
|
13
|
+
var TabList = _a.TabList, className = _a.className, containerClassName = _a.containerClassName, size = _a.size, children = _a.children, selectedId = _a.selectedId, scrollable = _a.scrollable, collapsedTabsIds = _a.collapsedTabsIds, _b = _a.fullWidthScroll, fullWidthScroll = _b === void 0 ? false : _b, _c = _a.keepMounted, keepMounted = _c === void 0 ? false : _c, dataTestId = _a.dataTestId, onChange = _a.onChange, breakpoint = _a.breakpoint, client = _a.client, defaultMatchMediaValue = _a.defaultMatchMediaValue, tagShape = _a.tagShape, tagView = _a.tagView, _d = _a.showSkeleton, showSkeleton = _d === void 0 ? false : _d, skeletonProps = _a.skeletonProps, textStyle = _a.textStyle, style = _a.style, titleProps = _a.titleProps, restProps = tslib.__rest(_a, ["TabList", "className", "containerClassName", "size", "children", "selectedId", "scrollable", "collapsedTabsIds", "fullWidthScroll", "keepMounted", "dataTestId", "onChange", "breakpoint", "client", "defaultMatchMediaValue", "tagShape", "tagView", "showSkeleton", "skeletonProps", "textStyle", "style", "titleProps"]);
|
|
14
14
|
var tabsArray = React__default.default.Children.toArray(children);
|
|
15
15
|
var titles = tabsArray.map(function (_a) {
|
|
16
16
|
var _b = _a.props, title = _b.title, id = _b.id, rightAddons = _b.rightAddons, disabled = _b.disabled, hidden = _b.hidden, toggleClassName = _b.toggleClassName, toggleTestId = _b.dataTestId, toggleRef = _b.toggleRef;
|
|
17
|
-
return ({
|
|
18
|
-
title: title,
|
|
19
|
-
id: id,
|
|
20
|
-
disabled: disabled,
|
|
21
|
-
rightAddons: rightAddons,
|
|
22
|
-
hidden: hidden,
|
|
23
|
-
toggleClassName: toggleClassName,
|
|
24
|
-
dataTestId: toggleTestId,
|
|
25
|
-
toggleRef: toggleRef,
|
|
26
|
-
});
|
|
17
|
+
return (tslib.__assign({ title: title, id: id, disabled: disabled, rightAddons: rightAddons, hidden: hidden, toggleClassName: toggleClassName, dataTestId: toggleTestId, toggleRef: toggleRef }, titleProps));
|
|
27
18
|
});
|
|
28
19
|
var tabs = tabsArray.filter(function (tab) { return tab.props.id === selectedId || tab.props.keepMounted || keepMounted; });
|
|
29
20
|
return (React__default.default.createElement("div", tslib.__assign({ className: className }, restProps),
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Component.js","sources":["../../../src/components/tabs/Component.tsx"],"sourcesContent":["import React, { cloneElement } from 'react';\n\nimport { type TabsProps } from '../../typings';\n\nexport const Tabs = ({\n TabList,\n className,\n containerClassName,\n size,\n children,\n selectedId,\n scrollable,\n collapsedTabsIds,\n fullWidthScroll = false,\n keepMounted = false,\n dataTestId,\n onChange,\n breakpoint,\n client,\n defaultMatchMediaValue,\n tagShape,\n tagView,\n showSkeleton = false,\n skeletonProps,\n textStyle,\n style,\n ...restProps\n}: Omit<TabsProps, 'view'>) => {\n const tabsArray = React.Children.toArray(children) as TabsProps['children'];\n const titles = tabsArray.map(\n ({\n props: {\n title,\n id,\n rightAddons,\n disabled,\n hidden,\n toggleClassName,\n dataTestId: toggleTestId,\n toggleRef,\n },\n }) => ({\n title,\n id,\n disabled,\n rightAddons,\n hidden,\n toggleClassName,\n dataTestId: toggleTestId,\n toggleRef,\n }),\n );\n\n const tabs = tabsArray.filter(\n (tab) => tab.props.id === selectedId || tab.props.keepMounted || keepMounted,\n );\n\n return (\n <div className={className} {...restProps}>\n <TabList\n containerClassName={containerClassName}\n size={size}\n titles={titles}\n selectedId={selectedId}\n scrollable={scrollable}\n collapsedTabsIds={collapsedTabsIds}\n onChange={onChange}\n dataTestId={dataTestId}\n defaultMatchMediaValue={defaultMatchMediaValue}\n breakpoint={breakpoint}\n client={client}\n fullWidthScroll={fullWidthScroll}\n tagShape={tagShape}\n tagView={tagView}\n textStyle={textStyle}\n inlineStyle={style}\n showSkeleton={showSkeleton}\n skeletonProps={skeletonProps}\n />\n\n {tabs.map((tab) => cloneElement(tab, { hidden: tab.props.id !== selectedId }))}\n </div>\n );\n};\n"],"names":["__rest","React","__assign","cloneElement"],"mappings":";;;;;;;;;;;AAIO,IAAM,IAAI,GAAG,UAAC,
|
|
1
|
+
{"version":3,"file":"Component.js","sources":["../../../src/components/tabs/Component.tsx"],"sourcesContent":["import React, { cloneElement } from 'react';\n\nimport { type TabsProps } from '../../typings';\n\nexport const Tabs = ({\n TabList,\n className,\n containerClassName,\n size,\n children,\n selectedId,\n scrollable,\n collapsedTabsIds,\n fullWidthScroll = false,\n keepMounted = false,\n dataTestId,\n onChange,\n breakpoint,\n client,\n defaultMatchMediaValue,\n tagShape,\n tagView,\n showSkeleton = false,\n skeletonProps,\n textStyle,\n style,\n titleProps,\n ...restProps\n}: Omit<TabsProps, 'view'>) => {\n const tabsArray = React.Children.toArray(children) as TabsProps['children'];\n\n const titles = tabsArray.map(\n ({\n props: {\n title,\n id,\n rightAddons,\n disabled,\n hidden,\n toggleClassName,\n dataTestId: toggleTestId,\n toggleRef,\n },\n }) => ({\n title,\n id,\n disabled,\n rightAddons,\n hidden,\n toggleClassName,\n dataTestId: toggleTestId,\n toggleRef,\n ...titleProps,\n }),\n );\n\n const tabs = tabsArray.filter(\n (tab) => tab.props.id === selectedId || tab.props.keepMounted || keepMounted,\n );\n\n return (\n <div className={className} {...restProps}>\n <TabList\n containerClassName={containerClassName}\n size={size}\n titles={titles}\n selectedId={selectedId}\n scrollable={scrollable}\n collapsedTabsIds={collapsedTabsIds}\n onChange={onChange}\n dataTestId={dataTestId}\n defaultMatchMediaValue={defaultMatchMediaValue}\n breakpoint={breakpoint}\n client={client}\n fullWidthScroll={fullWidthScroll}\n tagShape={tagShape}\n tagView={tagView}\n textStyle={textStyle}\n inlineStyle={style}\n showSkeleton={showSkeleton}\n skeletonProps={skeletonProps}\n />\n\n {tabs.map((tab) => cloneElement(tab, { hidden: tab.props.id !== selectedId }))}\n </div>\n );\n};\n"],"names":["__rest","React","__assign","cloneElement"],"mappings":"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"}
|
|
@@ -14,6 +14,55 @@ export declare const useTablistTitles: ({ titles, selectedId, collapsedTabsIds,
|
|
|
14
14
|
toggleClassName?: string | undefined;
|
|
15
15
|
dataTestId?: string | undefined;
|
|
16
16
|
toggleRef?: import("react").Ref<HTMLDivElement> | undefined;
|
|
17
|
+
titleProps?: import("../typings").TitleProps | undefined;
|
|
18
|
+
'aria-activedescendant'?: string | undefined;
|
|
19
|
+
'aria-atomic'?: (boolean | "true" | "false") | undefined;
|
|
20
|
+
'aria-autocomplete'?: "none" | "inline" | "list" | "both" | undefined;
|
|
21
|
+
'aria-busy'?: (boolean | "true" | "false") | undefined;
|
|
22
|
+
'aria-checked'?: boolean | "true" | "false" | "mixed" | undefined;
|
|
23
|
+
'aria-colcount'?: number | undefined;
|
|
24
|
+
'aria-colindex'?: number | undefined;
|
|
25
|
+
'aria-colspan'?: number | undefined;
|
|
26
|
+
'aria-controls'?: string | undefined;
|
|
27
|
+
'aria-current'?: boolean | "true" | "false" | "page" | "step" | "location" | "date" | "time" | undefined;
|
|
28
|
+
'aria-describedby'?: string | undefined;
|
|
29
|
+
'aria-details'?: string | undefined;
|
|
30
|
+
'aria-disabled'?: (boolean | "true" | "false") | undefined;
|
|
31
|
+
'aria-dropeffect'?: "none" | "copy" | "execute" | "link" | "move" | "popup" | undefined;
|
|
32
|
+
'aria-errormessage'?: string | undefined;
|
|
33
|
+
'aria-expanded'?: (boolean | "true" | "false") | undefined;
|
|
34
|
+
'aria-flowto'?: string | undefined;
|
|
35
|
+
'aria-grabbed'?: (boolean | "true" | "false") | undefined;
|
|
36
|
+
'aria-haspopup'?: boolean | "true" | "false" | "menu" | "listbox" | "tree" | "grid" | "dialog" | undefined;
|
|
37
|
+
'aria-hidden'?: (boolean | "true" | "false") | undefined;
|
|
38
|
+
'aria-invalid'?: boolean | "true" | "false" | "grammar" | "spelling" | undefined;
|
|
39
|
+
'aria-keyshortcuts'?: string | undefined;
|
|
40
|
+
'aria-label'?: string | undefined;
|
|
41
|
+
'aria-labelledby'?: string | undefined;
|
|
42
|
+
'aria-level'?: number | undefined;
|
|
43
|
+
'aria-live'?: "off" | "assertive" | "polite" | undefined;
|
|
44
|
+
'aria-modal'?: (boolean | "true" | "false") | undefined;
|
|
45
|
+
'aria-multiline'?: (boolean | "true" | "false") | undefined;
|
|
46
|
+
'aria-multiselectable'?: (boolean | "true" | "false") | undefined;
|
|
47
|
+
'aria-orientation'?: "horizontal" | "vertical" | undefined;
|
|
48
|
+
'aria-owns'?: string | undefined;
|
|
49
|
+
'aria-placeholder'?: string | undefined;
|
|
50
|
+
'aria-posinset'?: number | undefined;
|
|
51
|
+
'aria-pressed'?: boolean | "true" | "false" | "mixed" | undefined;
|
|
52
|
+
'aria-readonly'?: (boolean | "true" | "false") | undefined;
|
|
53
|
+
'aria-relevant'?: "additions" | "additions removals" | "additions text" | "all" | "removals" | "removals additions" | "removals text" | "text" | "text additions" | "text removals" | undefined;
|
|
54
|
+
'aria-required'?: (boolean | "true" | "false") | undefined;
|
|
55
|
+
'aria-roledescription'?: string | undefined;
|
|
56
|
+
'aria-rowcount'?: number | undefined;
|
|
57
|
+
'aria-rowindex'?: number | undefined;
|
|
58
|
+
'aria-rowspan'?: number | undefined;
|
|
59
|
+
'aria-selected'?: (boolean | "true" | "false") | undefined;
|
|
60
|
+
'aria-setsize'?: number | undefined;
|
|
61
|
+
'aria-sort'?: "none" | "ascending" | "descending" | "other" | undefined;
|
|
62
|
+
'aria-valuemax'?: number | undefined;
|
|
63
|
+
'aria-valuemin'?: number | undefined;
|
|
64
|
+
'aria-valuenow'?: number | undefined;
|
|
65
|
+
'aria-valuetext'?: string | undefined;
|
|
17
66
|
}[];
|
|
18
67
|
selectedTab: HTMLButtonElement | null;
|
|
19
68
|
focusedTab: HTMLButtonElement | null;
|
package/cssm/typings.d.ts
CHANGED
|
@@ -2,6 +2,7 @@ import { type AriaAttributes, type FC, type HTMLAttributes, type MouseEvent, typ
|
|
|
2
2
|
import { type SkeletonProps } from '@alfalab/core-components-skeleton/cssm';
|
|
3
3
|
import { type TagProps } from '@alfalab/core-components-tag/cssm';
|
|
4
4
|
export declare type SelectedId = string | number;
|
|
5
|
+
export declare type TitleProps = Omit<HTMLAttributes<HTMLButtonElement>, 'onClick' | 'onKeyDown' | 'className' | 'disabled' | 'id' | 'role' | 'tabIndex' | 'aria-selected'> & AriaAttributes;
|
|
5
6
|
export interface TabsProps extends Omit<HTMLAttributes<HTMLDivElement>, 'onChange' | 'children' | 'className'>, AriaAttributes {
|
|
6
7
|
/**
|
|
7
8
|
* Дополнительный класс
|
|
@@ -99,6 +100,10 @@ export interface TabsProps extends Omit<HTMLAttributes<HTMLDivElement>, 'onChang
|
|
|
99
100
|
* Доп. пропсы для скелетона
|
|
100
101
|
*/
|
|
101
102
|
skeletonProps?: Omit<SkeletonProps, 'visible'>;
|
|
103
|
+
/**
|
|
104
|
+
* Доп. пропсы для заголовка таба
|
|
105
|
+
*/
|
|
106
|
+
titleProps?: TitleProps;
|
|
102
107
|
}
|
|
103
108
|
export interface TabProps extends AriaAttributes {
|
|
104
109
|
/**
|
|
@@ -145,8 +150,12 @@ export interface TabProps extends AriaAttributes {
|
|
|
145
150
|
* Реф для кнопки переключения таба
|
|
146
151
|
*/
|
|
147
152
|
toggleRef?: Ref<HTMLDivElement>;
|
|
153
|
+
/**
|
|
154
|
+
* Доп. пропсы для заголовка таба
|
|
155
|
+
*/
|
|
156
|
+
titleProps?: TitleProps;
|
|
148
157
|
}
|
|
149
|
-
export interface TabListTitle {
|
|
158
|
+
export interface TabListTitle extends AriaAttributes {
|
|
150
159
|
title: NonNullable<ReactNode>;
|
|
151
160
|
id: SelectedId;
|
|
152
161
|
disabled?: boolean;
|
|
@@ -157,6 +166,7 @@ export interface TabListTitle {
|
|
|
157
166
|
collapsed?: boolean;
|
|
158
167
|
dataTestId?: string;
|
|
159
168
|
toggleRef?: Ref<HTMLDivElement>;
|
|
169
|
+
titleProps?: TitleProps;
|
|
160
170
|
}
|
|
161
171
|
export interface TabListProps extends Pick<TabsProps, 'className' | 'containerClassName' | 'size' | 'defaultMatchMediaValue' | 'selectedId' | 'scrollable' | 'collapsedTabsIds' | 'onChange' | 'dataTestId' | 'fullWidthScroll' | 'tagShape' | 'tagView' | 'textStyle' | 'showSkeleton' | 'skeletonProps'> {
|
|
162
172
|
/**
|