@pingux/astro 1.5.0-alpha.0 → 1.5.0
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 +17 -0
- package/lib/cjs/components/CodeView/CodeView.js +1 -1
- package/lib/cjs/components/CodeView/CodeView.test.js +22 -27
- package/lib/cjs/components/CopyText/CopyText.js +1 -1
- package/lib/cjs/components/PopoverMenu/PopoverMenu.js +7 -2
- package/lib/cjs/components/Tab/Tab.js +22 -15
- package/lib/cjs/components/TabPicker/TabPicker.js +239 -0
- package/lib/cjs/components/TabPicker/index.js +18 -0
- package/lib/cjs/components/Tabs/Tabs.js +46 -13
- package/lib/cjs/components/Tabs/Tabs.stories.js +32 -2
- package/lib/cjs/components/Tabs/Tabs.test.js +183 -32
- package/lib/cjs/styles/variants/buttons.js +13 -0
- package/lib/cjs/styles/variants/codeView.js +2 -1
- package/lib/cjs/styles/variants/tabs.js +5 -1
- package/lib/cjs/styles/variants/text.js +7 -2
- package/lib/components/CodeView/CodeView.js +1 -1
- package/lib/components/CodeView/CodeView.test.js +22 -23
- package/lib/components/CopyText/CopyText.js +1 -1
- package/lib/components/PopoverMenu/PopoverMenu.js +7 -2
- package/lib/components/Tab/Tab.js +14 -8
- package/lib/components/TabPicker/TabPicker.js +210 -0
- package/lib/components/TabPicker/index.js +1 -0
- package/lib/components/Tabs/Tabs.js +44 -11
- package/lib/components/Tabs/Tabs.stories.js +27 -0
- package/lib/components/Tabs/Tabs.test.js +165 -32
- package/lib/styles/variants/buttons.js +13 -0
- package/lib/styles/variants/codeView.js +2 -1
- package/lib/styles/variants/tabs.js +5 -1
- package/lib/styles/variants/text.js +7 -2
- package/package.json +1 -1
|
@@ -638,6 +638,18 @@ var colorBlock = {
|
|
|
638
638
|
borderColor: 'accent.20'
|
|
639
639
|
}
|
|
640
640
|
};
|
|
641
|
+
|
|
642
|
+
var menuTab = _objectSpread(_objectSpread({}, quiet), {}, {
|
|
643
|
+
color: 'neutral.40',
|
|
644
|
+
alignItems: 'center',
|
|
645
|
+
'&.is-selected *, &.is-hovered *': {
|
|
646
|
+
color: 'active'
|
|
647
|
+
},
|
|
648
|
+
'& + *:not(div:first-of-type)': {
|
|
649
|
+
'ml': 'md'
|
|
650
|
+
}
|
|
651
|
+
});
|
|
652
|
+
|
|
641
653
|
export default {
|
|
642
654
|
accordionHeader: accordionHeader,
|
|
643
655
|
chipDeleteButton: chipDeleteButton,
|
|
@@ -680,6 +692,7 @@ export default {
|
|
|
680
692
|
tooltipIconButton: tooltipIconButton,
|
|
681
693
|
tooltipInline: tooltipInline,
|
|
682
694
|
colorBlock: colorBlock,
|
|
695
|
+
menuTab: menuTab,
|
|
683
696
|
multiselectToggle: multiselectToggle,
|
|
684
697
|
neutralText: neutralText
|
|
685
698
|
};
|
|
@@ -14,12 +14,16 @@ export var tab = {
|
|
|
14
14
|
},
|
|
15
15
|
'&.is-selected.is-vertical': {
|
|
16
16
|
bg: 'accent.95'
|
|
17
|
+
},
|
|
18
|
+
'& > svg': {
|
|
19
|
+
flexShrink: 0
|
|
17
20
|
}
|
|
18
21
|
};
|
|
19
22
|
export var tabLine = {
|
|
20
23
|
height: '2px',
|
|
21
24
|
width: '100%',
|
|
22
|
-
bg: 'active'
|
|
25
|
+
bg: 'active',
|
|
26
|
+
flexShrink: 0
|
|
23
27
|
};
|
|
24
28
|
export var tabPanel = {
|
|
25
29
|
outline: 'none'
|
|
@@ -30,11 +30,16 @@ var wordWrap = {
|
|
|
30
30
|
var tabLabel = _objectSpread(_objectSpread(_objectSpread({}, base), wordWrap), {}, {
|
|
31
31
|
fontSize: 'sm',
|
|
32
32
|
fontWeight: 1,
|
|
33
|
-
mb:
|
|
33
|
+
mb: 'sm',
|
|
34
|
+
lineHeight: '16px',
|
|
34
35
|
color: 'neutral.40',
|
|
36
|
+
height: '100%',
|
|
35
37
|
'.is-selected &, .is-hovered &': {
|
|
38
|
+
color: 'active'
|
|
39
|
+
},
|
|
40
|
+
'.is-selected &': {
|
|
36
41
|
color: 'active',
|
|
37
|
-
mb:
|
|
42
|
+
mb: 8
|
|
38
43
|
},
|
|
39
44
|
'.is-disabled &': {
|
|
40
45
|
color: 'neutral.80'
|