@salutejs/plasma-new-hope 0.172.0-canary.1493.11403245502.0 → 0.172.0-canary.1494.11453767955.0
Sign up to get free protection for your applications and to get access to all the features.
- package/cjs/components/Tabs/createTabsController.js.map +1 -1
- package/cjs/components/Tabs/ui/horizontal/HorizontalTabItem/HorizontalTabItem.js +1 -0
- package/cjs/components/Tabs/ui/horizontal/HorizontalTabItem/HorizontalTabItem.js.map +1 -1
- package/cjs/components/Tabs/ui/horizontal/HorizontalTabs/HorizontalTabs.js +1 -0
- package/cjs/components/Tabs/ui/horizontal/HorizontalTabs/HorizontalTabs.js.map +1 -1
- package/cjs/index.js +0 -6
- package/cjs/index.js.map +1 -1
- package/emotion/cjs/components/Tabs/Tabs.template-doc.mdx +4 -22
- package/emotion/cjs/components/Tabs/index.js +0 -26
- package/emotion/cjs/components/Tabs/ui/horizontal/HorizontalTabItem/HorizontalTabItem.js +1 -0
- package/emotion/cjs/components/Tabs/ui/horizontal/HorizontalTabs/HorizontalTabs.js +1 -0
- package/emotion/cjs/examples/plasma_b2c/components/Tabs/TabItem.js +0 -6
- package/emotion/cjs/examples/plasma_b2c/components/Tabs/Tabs.js +1 -7
- package/emotion/cjs/examples/plasma_b2c/components/Tabs/Tabs.stories.tsx +22 -64
- package/emotion/cjs/examples/plasma_b2c/components/Tabs/horizontal/HorizontalTabItem.config.js +15 -19
- package/emotion/cjs/examples/plasma_b2c/components/Tabs/horizontal/HorizontalTabs.config.js +15 -19
- package/emotion/cjs/examples/plasma_web/components/Tabs/Tabs.stories.tsx +22 -64
- package/emotion/cjs/examples/plasma_web/components/Tabs/horizontal/HorizontalTabItem.config.js +15 -19
- package/emotion/cjs/examples/plasma_web/components/Tabs/horizontal/HorizontalTabs.config.js +15 -19
- package/emotion/es/components/Tabs/Tabs.template-doc.mdx +4 -22
- package/emotion/es/components/Tabs/index.js +0 -2
- package/emotion/es/components/Tabs/ui/horizontal/HorizontalTabItem/HorizontalTabItem.js +1 -0
- package/emotion/es/components/Tabs/ui/horizontal/HorizontalTabs/HorizontalTabs.js +1 -0
- package/emotion/es/examples/plasma_b2c/components/Tabs/TabItem.js +1 -7
- package/emotion/es/examples/plasma_b2c/components/Tabs/Tabs.js +2 -8
- package/emotion/es/examples/plasma_b2c/components/Tabs/Tabs.stories.tsx +22 -64
- package/emotion/es/examples/plasma_b2c/components/Tabs/horizontal/HorizontalTabItem.config.js +15 -19
- package/emotion/es/examples/plasma_b2c/components/Tabs/horizontal/HorizontalTabs.config.js +15 -19
- package/emotion/es/examples/plasma_web/components/Tabs/Tabs.stories.tsx +22 -64
- package/emotion/es/examples/plasma_web/components/Tabs/horizontal/HorizontalTabItem.config.js +15 -19
- package/emotion/es/examples/plasma_web/components/Tabs/horizontal/HorizontalTabs.config.js +15 -19
- package/es/components/Tabs/createTabsController.js.map +1 -1
- package/es/components/Tabs/ui/horizontal/HorizontalTabItem/HorizontalTabItem.js +1 -0
- package/es/components/Tabs/ui/horizontal/HorizontalTabItem/HorizontalTabItem.js.map +1 -1
- package/es/components/Tabs/ui/horizontal/HorizontalTabs/HorizontalTabs.js +1 -0
- package/es/components/Tabs/ui/horizontal/HorizontalTabs/HorizontalTabs.js.map +1 -1
- package/es/index.js +0 -2
- package/es/index.js.map +1 -1
- package/package.json +4 -4
- package/styled-components/cjs/components/Tabs/Tabs.template-doc.mdx +4 -22
- package/styled-components/cjs/components/Tabs/index.js +0 -26
- package/styled-components/cjs/components/Tabs/ui/horizontal/HorizontalTabItem/HorizontalTabItem.js +1 -0
- package/styled-components/cjs/components/Tabs/ui/horizontal/HorizontalTabs/HorizontalTabs.js +1 -0
- package/styled-components/cjs/examples/plasma_b2c/components/Tabs/TabItem.js +0 -6
- package/styled-components/cjs/examples/plasma_b2c/components/Tabs/Tabs.js +1 -7
- package/styled-components/cjs/examples/plasma_b2c/components/Tabs/Tabs.stories.tsx +22 -64
- package/styled-components/cjs/examples/plasma_b2c/components/Tabs/horizontal/HorizontalTabItem.config.js +0 -4
- package/styled-components/cjs/examples/plasma_b2c/components/Tabs/horizontal/HorizontalTabs.config.js +0 -4
- package/styled-components/cjs/examples/plasma_web/components/Tabs/Tabs.stories.tsx +22 -64
- package/styled-components/cjs/examples/plasma_web/components/Tabs/horizontal/HorizontalTabItem.config.js +0 -4
- package/styled-components/cjs/examples/plasma_web/components/Tabs/horizontal/HorizontalTabs.config.js +0 -4
- package/styled-components/es/components/Tabs/Tabs.template-doc.mdx +4 -22
- package/styled-components/es/components/Tabs/index.js +0 -2
- package/styled-components/es/components/Tabs/ui/horizontal/HorizontalTabItem/HorizontalTabItem.js +1 -0
- package/styled-components/es/components/Tabs/ui/horizontal/HorizontalTabs/HorizontalTabs.js +1 -0
- package/styled-components/es/examples/plasma_b2c/components/Tabs/TabItem.js +1 -7
- package/styled-components/es/examples/plasma_b2c/components/Tabs/Tabs.js +2 -8
- package/styled-components/es/examples/plasma_b2c/components/Tabs/Tabs.stories.tsx +22 -64
- package/styled-components/es/examples/plasma_b2c/components/Tabs/horizontal/HorizontalTabItem.config.js +0 -4
- package/styled-components/es/examples/plasma_b2c/components/Tabs/horizontal/HorizontalTabs.config.js +0 -4
- package/styled-components/es/examples/plasma_web/components/Tabs/Tabs.stories.tsx +22 -64
- package/styled-components/es/examples/plasma_web/components/Tabs/horizontal/HorizontalTabItem.config.js +0 -4
- package/styled-components/es/examples/plasma_web/components/Tabs/horizontal/HorizontalTabs.config.js +0 -4
- package/types/components/Tabs/TabItem.types.d.ts +10 -52
- package/types/components/Tabs/TabItem.types.d.ts.map +1 -1
- package/types/components/Tabs/Tabs.types.d.ts +2 -39
- package/types/components/Tabs/Tabs.types.d.ts.map +1 -1
- package/types/components/Tabs/createTabsController.d.ts +3 -3
- package/types/components/Tabs/createTabsController.d.ts.map +1 -1
- package/types/components/Tabs/index.d.ts +1 -3
- package/types/components/Tabs/index.d.ts.map +1 -1
- package/types/components/Tabs/ui/horizontal/HorizontalTabItem/HorizontalTabItem.d.ts.map +1 -1
- package/types/components/Tabs/ui/horizontal/HorizontalTabs/HorizontalTabs.d.ts +2 -2
- package/types/components/Tabs/ui/horizontal/HorizontalTabs/HorizontalTabs.d.ts.map +1 -1
- package/types/examples/plasma_b2c/components/Tabs/TabItem.d.ts +1 -74
- package/types/examples/plasma_b2c/components/Tabs/TabItem.d.ts.map +1 -1
- package/types/examples/plasma_b2c/components/Tabs/Tabs.d.ts +2 -22
- package/types/examples/plasma_b2c/components/Tabs/Tabs.d.ts.map +1 -1
- package/types/examples/plasma_b2c/components/Tabs/horizontal/HorizontalTabItem.config.d.ts +0 -4
- package/types/examples/plasma_b2c/components/Tabs/horizontal/HorizontalTabItem.config.d.ts.map +1 -1
- package/types/examples/plasma_b2c/components/Tabs/horizontal/HorizontalTabs.config.d.ts +0 -4
- package/types/examples/plasma_b2c/components/Tabs/horizontal/HorizontalTabs.config.d.ts.map +1 -1
- package/types/examples/plasma_web/components/Tabs/TabItem.d.ts +0 -18
- package/types/examples/plasma_web/components/Tabs/TabItem.d.ts.map +1 -1
- package/types/examples/plasma_web/components/Tabs/Tabs.d.ts +1 -1
- package/types/examples/plasma_web/components/Tabs/Tabs.d.ts.map +1 -1
- package/types/examples/plasma_web/components/Tabs/horizontal/HorizontalTabItem.config.d.ts +0 -4
- package/types/examples/plasma_web/components/Tabs/horizontal/HorizontalTabItem.config.d.ts.map +1 -1
- package/types/examples/plasma_web/components/Tabs/horizontal/HorizontalTabs.config.d.ts +0 -4
- package/types/examples/plasma_web/components/Tabs/horizontal/HorizontalTabs.config.d.ts.map +1 -1
- package/cjs/components/Tabs/ui/header/HeaderTabItem/HeaderTabItem.css +0 -13
- package/cjs/components/Tabs/ui/header/HeaderTabItem/HeaderTabItem.js +0 -37
- package/cjs/components/Tabs/ui/header/HeaderTabItem/HeaderTabItem.js.map +0 -1
- package/cjs/components/Tabs/ui/header/HeaderTabs/HeaderTabs.css +0 -16
- package/cjs/components/Tabs/ui/header/HeaderTabs/HeaderTabs.js +0 -37
- package/cjs/components/Tabs/ui/header/HeaderTabs/HeaderTabs.js.map +0 -1
- package/emotion/cjs/components/Tabs/ui/header/HeaderTabItem/HeaderTabItem.js +0 -34
- package/emotion/cjs/components/Tabs/ui/header/HeaderTabs/HeaderTabs.js +0 -34
- package/emotion/cjs/examples/plasma_b2c/components/Tabs/header/HeaderTabItem.config.js +0 -29
- package/emotion/cjs/examples/plasma_b2c/components/Tabs/header/HeaderTabs.config.js +0 -30
- package/emotion/cjs/examples/plasma_web/components/Tabs/header/HeaderTabItem.config.js +0 -29
- package/emotion/cjs/examples/plasma_web/components/Tabs/header/HeaderTabs.config.js +0 -30
- package/emotion/es/components/Tabs/ui/header/HeaderTabItem/HeaderTabItem.js +0 -28
- package/emotion/es/components/Tabs/ui/header/HeaderTabs/HeaderTabs.js +0 -28
- package/emotion/es/examples/plasma_b2c/components/Tabs/header/HeaderTabItem.config.js +0 -23
- package/emotion/es/examples/plasma_b2c/components/Tabs/header/HeaderTabs.config.js +0 -24
- package/emotion/es/examples/plasma_web/components/Tabs/header/HeaderTabItem.config.js +0 -23
- package/emotion/es/examples/plasma_web/components/Tabs/header/HeaderTabs.config.js +0 -24
- package/es/components/Tabs/ui/header/HeaderTabItem/HeaderTabItem.css +0 -13
- package/es/components/Tabs/ui/header/HeaderTabItem/HeaderTabItem.js +0 -32
- package/es/components/Tabs/ui/header/HeaderTabItem/HeaderTabItem.js.map +0 -1
- package/es/components/Tabs/ui/header/HeaderTabs/HeaderTabs.css +0 -16
- package/es/components/Tabs/ui/header/HeaderTabs/HeaderTabs.js +0 -32
- package/es/components/Tabs/ui/header/HeaderTabs/HeaderTabs.js.map +0 -1
- package/styled-components/cjs/components/Tabs/ui/header/HeaderTabItem/HeaderTabItem.js +0 -34
- package/styled-components/cjs/components/Tabs/ui/header/HeaderTabs/HeaderTabs.js +0 -34
- package/styled-components/cjs/examples/plasma_b2c/components/Tabs/header/HeaderTabItem.config.js +0 -29
- package/styled-components/cjs/examples/plasma_b2c/components/Tabs/header/HeaderTabs.config.js +0 -30
- package/styled-components/cjs/examples/plasma_web/components/Tabs/header/HeaderTabItem.config.js +0 -29
- package/styled-components/cjs/examples/plasma_web/components/Tabs/header/HeaderTabs.config.js +0 -30
- package/styled-components/es/components/Tabs/ui/header/HeaderTabItem/HeaderTabItem.js +0 -28
- package/styled-components/es/components/Tabs/ui/header/HeaderTabs/HeaderTabs.js +0 -28
- package/styled-components/es/examples/plasma_b2c/components/Tabs/header/HeaderTabItem.config.js +0 -23
- package/styled-components/es/examples/plasma_b2c/components/Tabs/header/HeaderTabs.config.js +0 -24
- package/styled-components/es/examples/plasma_web/components/Tabs/header/HeaderTabItem.config.js +0 -23
- package/styled-components/es/examples/plasma_web/components/Tabs/header/HeaderTabs.config.js +0 -24
- package/types/components/Tabs/ui/header/HeaderTabItem/HeaderTabItem.d.ts +0 -25
- package/types/components/Tabs/ui/header/HeaderTabItem/HeaderTabItem.d.ts.map +0 -1
- package/types/components/Tabs/ui/header/HeaderTabs/HeaderTabs.d.ts +0 -25
- package/types/components/Tabs/ui/header/HeaderTabs/HeaderTabs.d.ts.map +0 -1
- package/types/examples/plasma_b2c/components/Tabs/header/HeaderTabItem.config.d.ts +0 -22
- package/types/examples/plasma_b2c/components/Tabs/header/HeaderTabItem.config.d.ts.map +0 -1
- package/types/examples/plasma_b2c/components/Tabs/header/HeaderTabs.config.d.ts +0 -23
- package/types/examples/plasma_b2c/components/Tabs/header/HeaderTabs.config.d.ts.map +0 -1
- package/types/examples/plasma_web/components/Tabs/header/HeaderTabItem.config.d.ts +0 -22
- package/types/examples/plasma_web/components/Tabs/header/HeaderTabItem.config.d.ts.map +0 -1
- package/types/examples/plasma_web/components/Tabs/header/HeaderTabs.config.d.ts +0 -23
- package/types/examples/plasma_web/components/Tabs/header/HeaderTabs.config.d.ts.map +0 -1
@@ -12,7 +12,6 @@ import { Tabs } from './Tabs';
|
|
12
12
|
import { TabItem } from './TabItem';
|
13
13
|
|
14
14
|
const clips = ['none', 'scroll', 'showAll'];
|
15
|
-
const headerClips = ['none', 'scroll'];
|
16
15
|
const sizes = ['xs', 's', 'm', 'l'] as const;
|
17
16
|
const headerSizes = ['h5', 'h4', 'h3', 'h2', 'h1'] as const;
|
18
17
|
|
@@ -53,7 +52,6 @@ const getContentRight = (contentRightOption: string, size: Size) => {
|
|
53
52
|
type StoryTabsProps = ComponentProps<typeof Tabs> & CustomStoryTabsProps;
|
54
53
|
type HorizontalStoryTabsProps = StoryTabsProps & { width: string };
|
55
54
|
type VerticalStoryTabsProps = StoryTabsProps & { height: string };
|
56
|
-
type HeaderStoryTabsProps = StoryTabsProps & { width: string };
|
57
55
|
|
58
56
|
const meta: Meta<StoryTabsProps> = {
|
59
57
|
title: 'plasma_web/Tabs',
|
@@ -70,7 +68,6 @@ const meta: Meta<StoryTabsProps> = {
|
|
70
68
|
'forwardedAs',
|
71
69
|
'outsideScroll',
|
72
70
|
'index',
|
73
|
-
'header',
|
74
71
|
]),
|
75
72
|
contentRight: {
|
76
73
|
options: contentRightOptions,
|
@@ -606,55 +603,31 @@ export const VerticalTabs: StoryObj<VerticalStoryTabsProps> = {
|
|
606
603
|
},
|
607
604
|
};
|
608
605
|
|
609
|
-
const
|
610
|
-
const {
|
611
|
-
|
612
|
-
|
613
|
-
|
614
|
-
|
615
|
-
|
616
|
-
|
617
|
-
|
618
|
-
|
619
|
-
key={`item:${i}`}
|
620
|
-
view="divider"
|
621
|
-
selected={i === index}
|
622
|
-
onClick={() => !disabled && setIndex(i)}
|
623
|
-
tabIndex={!disabled ? 0 : -1}
|
624
|
-
disabled={disabled}
|
625
|
-
value={helperText}
|
626
|
-
size={size as HeaderSize}
|
627
|
-
>
|
628
|
-
{`Label${i + 1}`}
|
629
|
-
</TabItem>
|
630
|
-
))}
|
631
|
-
</Tabs>
|
632
|
-
);
|
633
|
-
};
|
634
|
-
|
635
|
-
const StoryHeaderScroll = (props: HeaderStoryTabsProps) => {
|
636
|
-
const { disabled, itemQuantity, size, hasDivider, helperText, width } = props;
|
606
|
+
const StoryHeaderTabs = (props: StoryTabsProps) => {
|
607
|
+
const {
|
608
|
+
disabled,
|
609
|
+
itemQuantity,
|
610
|
+
size,
|
611
|
+
contentLeft: contentLeftOption,
|
612
|
+
contentRight: contentRightOption,
|
613
|
+
hasDivider,
|
614
|
+
stretch,
|
615
|
+
} = props;
|
637
616
|
const items = Array(itemQuantity).fill(0);
|
638
617
|
const [index, setIndex] = useState(0);
|
639
618
|
|
640
619
|
return (
|
641
|
-
<Tabs
|
642
|
-
header
|
643
|
-
view={hasDivider ? 'divider' : 'clear'}
|
644
|
-
disabled={disabled}
|
645
|
-
size={size as HeaderSize}
|
646
|
-
style={{ width }}
|
647
|
-
>
|
620
|
+
<Tabs view={hasDivider ? 'divider' : 'clear'} disabled={disabled} size={size} stretch={stretch}>
|
648
621
|
{items.map((_, i) => (
|
649
622
|
<TabItem
|
650
|
-
header
|
651
623
|
key={`item:${i}`}
|
652
624
|
view="divider"
|
653
625
|
selected={i === index}
|
654
626
|
onClick={() => !disabled && setIndex(i)}
|
655
627
|
tabIndex={!disabled ? 0 : -1}
|
656
628
|
disabled={disabled}
|
657
|
-
|
629
|
+
contentLeft={getContentLeft(contentLeftOption, size as Size)}
|
630
|
+
contentRight={getContentRight(contentRightOption, size as Size)}
|
658
631
|
size={size as HeaderSize}
|
659
632
|
>
|
660
633
|
{`Label${i + 1}`}
|
@@ -664,14 +637,12 @@ const StoryHeaderScroll = (props: HeaderStoryTabsProps) => {
|
|
664
637
|
);
|
665
638
|
};
|
666
639
|
|
667
|
-
export const HeaderTabs: StoryObj<
|
640
|
+
export const HeaderTabs: StoryObj<StoryTabsProps> = {
|
668
641
|
args: {
|
669
642
|
size: 'h5',
|
670
643
|
disabled: false,
|
671
644
|
hasDivider: true,
|
672
|
-
|
673
|
-
itemQuantity: 6,
|
674
|
-
width: '12rem',
|
645
|
+
itemQuantity: 4,
|
675
646
|
},
|
676
647
|
argTypes: {
|
677
648
|
size: {
|
@@ -680,36 +651,23 @@ export const HeaderTabs: StoryObj<HeaderStoryTabsProps> = {
|
|
680
651
|
type: 'select',
|
681
652
|
},
|
682
653
|
},
|
683
|
-
|
684
|
-
options:
|
654
|
+
contentLeft: {
|
655
|
+
options: contentLeftOptions,
|
685
656
|
control: {
|
686
657
|
type: 'select',
|
687
658
|
},
|
688
|
-
if: { arg: 'stretch', truthy: false },
|
689
659
|
},
|
690
|
-
|
660
|
+
contentRight: {
|
661
|
+
options: contentRightOptions,
|
691
662
|
control: {
|
692
|
-
type: '
|
693
|
-
},
|
694
|
-
if: { arg: 'clip', eq: 'scroll' },
|
695
|
-
},
|
696
|
-
stretch: {
|
697
|
-
table: {
|
698
|
-
disable: true,
|
663
|
+
type: 'select',
|
699
664
|
},
|
700
665
|
},
|
701
|
-
|
666
|
+
clip: {
|
702
667
|
table: {
|
703
668
|
disable: true,
|
704
669
|
},
|
705
670
|
},
|
706
671
|
},
|
707
|
-
render: (args) => {
|
708
|
-
switch (args.clip) {
|
709
|
-
case 'scroll':
|
710
|
-
return <StoryHeaderScroll {...args} />;
|
711
|
-
default:
|
712
|
-
return <StoryHeaderDefault {...args} />;
|
713
|
-
}
|
714
|
-
},
|
672
|
+
render: (args) => <StoryHeaderTabs {...args} />,
|
715
673
|
};
|