@pingux/astro 2.182.0-alpha.0 → 2.182.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/lib/cjs/components/AccordionItem/AccordionItem.js +5 -4
- package/lib/cjs/libs/astro/src/hooks/useGetTheme/useGetTheme.d.ts +11 -0
- package/lib/cjs/libs/astro/src/styles/themeOverrides/nextGenDarkMode/customProperties/index.d.ts +6 -0
- package/lib/cjs/libs/astro/src/styles/themes/astro/customProperties/index.d.ts +5 -0
- package/lib/cjs/libs/astro/src/styles/themes/next-gen/customProperties/index.d.ts +6 -0
- package/lib/cjs/libs/astro/src/styles/themes/next-gen/next-gen.d.ts +19 -2
- package/lib/cjs/libs/astro/src/styles/themes/next-gen/variants/accordion.d.ts +6 -2
- package/lib/cjs/libs/astro/src/styles/themes/next-gen/variants/text.d.ts +13 -0
- package/lib/cjs/libs/astro/src/styles/themes/next-gen/variants/variants.d.ts +6 -2
- package/lib/cjs/libs/astro/tsconfig.lib.tsbuildinfo +1 -1
- package/lib/cjs/styles/themes/astro/customProperties/index.js +2 -0
- package/lib/cjs/styles/themes/next-gen/customProperties/index.js +7 -0
- package/lib/cjs/styles/themes/next-gen/variants/accordion.js +7 -3
- package/lib/cjs/styles/themes/next-gen/variants/text.js +24 -12
- package/lib/components/AccordionItem/AccordionItem.js +5 -4
- package/lib/styles/themes/astro/customProperties/index.js +2 -0
- package/lib/styles/themes/next-gen/customProperties/index.js +7 -0
- package/lib/styles/themes/next-gen/variants/accordion.js +7 -3
- package/lib/styles/themes/next-gen/variants/text.js +24 -12
- package/package.json +1 -1
|
@@ -9,6 +9,7 @@ _Object$defineProperty(exports, "__esModule", {
|
|
|
9
9
|
value: true
|
|
10
10
|
});
|
|
11
11
|
exports.astroThemeValues = void 0;
|
|
12
|
+
var _Accordion = require("../../../../components/AccordionGroup/Accordion.styles");
|
|
12
13
|
var _icons = _interopRequireDefault(require("./icons"));
|
|
13
14
|
var _styles = _interopRequireDefault(require("./styles"));
|
|
14
15
|
var _tShirtSizes = _interopRequireWildcard(require("./tShirtSizes"));
|
|
@@ -35,6 +36,7 @@ var calendarIconSize = 25;
|
|
|
35
36
|
var navBarIconSize = 18;
|
|
36
37
|
var badgeTextFontSize = '';
|
|
37
38
|
var astroThemeValues = exports.astroThemeValues = {
|
|
39
|
+
accordionHoveredState: _Accordion.hoveredState,
|
|
38
40
|
accordionItemDefaultLabelTag: accordionItemDefaultLabelTag,
|
|
39
41
|
navBarIconSize: navBarIconSize,
|
|
40
42
|
activeColor: activeColor,
|
|
@@ -23,6 +23,12 @@ var _tShirtSizes = _interopRequireWildcard(require("./tShirtSizes"));
|
|
|
23
23
|
function _interopRequireWildcard(e, t) { if ("function" == typeof _WeakMap) var r = new _WeakMap(), n = new _WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, "default": e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = _Object$defineProperty) && _Object$getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
|
|
24
24
|
function ownKeys(e, r) { var t = _Object$keys(e); if (_Object$getOwnPropertySymbols) { var o = _Object$getOwnPropertySymbols(e); r && (o = _filterInstanceProperty(o).call(o, function (r) { return _Object$getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
25
25
|
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var _context, _context2; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty(_context = ownKeys(Object(t), !0)).call(_context, function (r) { (0, _defineProperty2["default"])(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors ? _Object$defineProperties(e, _Object$getOwnPropertyDescriptors(t)) : _forEachInstanceProperty(_context2 = ownKeys(Object(t))).call(_context2, function (r) { _Object$defineProperty(e, r, _Object$getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
26
|
+
var accordionHoveredState = {
|
|
27
|
+
'&.is-hovered': {
|
|
28
|
+
color: 'active',
|
|
29
|
+
textDecoration: 'underline'
|
|
30
|
+
}
|
|
31
|
+
};
|
|
26
32
|
var accordionItemDefaultLabelTag = 'h2';
|
|
27
33
|
var iconBadgeCircleColor = 'badge.iconBadge';
|
|
28
34
|
var activeColor = '#1a73e8';
|
|
@@ -42,6 +48,7 @@ var calendarIconSize = 'sm';
|
|
|
42
48
|
var badgeTextFontSize = '75%';
|
|
43
49
|
var navBarIconSize = '20px';
|
|
44
50
|
var nextGenThemeValues = exports.nextGenThemeValues = _objectSpread({
|
|
51
|
+
accordionHoveredState: accordionHoveredState,
|
|
45
52
|
activeColor: activeColor,
|
|
46
53
|
navBarIconSize: navBarIconSize,
|
|
47
54
|
backgroundBaseColor: backgroundBaseColor,
|
|
@@ -10,13 +10,17 @@ var accordion = {
|
|
|
10
10
|
borderBottom: '1px solid',
|
|
11
11
|
borderBottomColor: 'border.base'
|
|
12
12
|
},
|
|
13
|
-
pb: '
|
|
13
|
+
pb: 'md',
|
|
14
|
+
mb: 'md',
|
|
15
|
+
mt: '0px'
|
|
14
16
|
};
|
|
15
17
|
var body = {
|
|
16
|
-
|
|
18
|
+
pt: 'md'
|
|
17
19
|
};
|
|
18
20
|
var header = {
|
|
19
|
-
|
|
21
|
+
'&.is-focused': {
|
|
22
|
+
borderRadius: '2px'
|
|
23
|
+
}
|
|
20
24
|
};
|
|
21
25
|
var _default = exports["default"] = {
|
|
22
26
|
accordion: accordion,
|
|
@@ -21,76 +21,88 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var _co
|
|
|
21
21
|
var fontSizes = _onyxTokens.astroTokens["default"]['font-size'];
|
|
22
22
|
var hTags = {
|
|
23
23
|
H1: {
|
|
24
|
+
lineHeight: '1.2',
|
|
24
25
|
fontSize: fontSizes.h1,
|
|
25
26
|
fontWeight: 2,
|
|
26
|
-
color: '
|
|
27
|
+
color: 'font.base',
|
|
27
28
|
fontFamily: 'standard'
|
|
28
29
|
},
|
|
29
30
|
H2: {
|
|
31
|
+
lineHeight: '1.2',
|
|
30
32
|
fontSize: fontSizes.h2,
|
|
31
33
|
fontWeight: 2,
|
|
32
|
-
color: '
|
|
34
|
+
color: 'font.base',
|
|
33
35
|
fontFamily: 'standard'
|
|
34
36
|
},
|
|
35
37
|
H3: {
|
|
38
|
+
lineHeight: '1.2',
|
|
36
39
|
fontSize: fontSizes.h3,
|
|
37
40
|
fontWeight: 2,
|
|
38
|
-
color: '
|
|
41
|
+
color: 'font.base',
|
|
39
42
|
fontFamily: 'standard'
|
|
40
43
|
},
|
|
41
44
|
H4: {
|
|
45
|
+
lineHeight: '1.2',
|
|
42
46
|
fontSize: fontSizes.h4,
|
|
43
47
|
fontWeight: 2,
|
|
44
|
-
color: '
|
|
48
|
+
color: 'font.base',
|
|
45
49
|
fontFamily: 'standard'
|
|
46
50
|
},
|
|
47
51
|
H5: {
|
|
52
|
+
lineHeight: '1.2',
|
|
48
53
|
fontSize: fontSizes.h5,
|
|
49
54
|
fontWeight: 2,
|
|
50
|
-
color: '
|
|
55
|
+
color: 'font.base',
|
|
51
56
|
fontFamily: 'standard'
|
|
52
57
|
},
|
|
53
58
|
H6: {
|
|
59
|
+
lineHeight: '1.2',
|
|
54
60
|
textTransform: 'uppercase',
|
|
55
|
-
color: '
|
|
61
|
+
color: 'font.base',
|
|
56
62
|
fontFamily: 'standard',
|
|
57
63
|
fontWeight: 1,
|
|
58
64
|
fontSize: fontSizes.h6,
|
|
59
65
|
letterSpacing: '1px'
|
|
60
66
|
},
|
|
61
67
|
h1: {
|
|
68
|
+
lineHeight: '1.2',
|
|
62
69
|
fontSize: fontSizes.h1,
|
|
63
70
|
fontWeight: 2,
|
|
64
|
-
color: '
|
|
71
|
+
color: 'font.base',
|
|
65
72
|
fontFamily: 'standard'
|
|
66
73
|
},
|
|
67
74
|
h2: {
|
|
75
|
+
lineHeight: '1.2',
|
|
68
76
|
fontSize: fontSizes.h2,
|
|
69
77
|
fontWeight: 2,
|
|
70
|
-
color: '
|
|
78
|
+
color: 'font.base',
|
|
71
79
|
fontFamily: 'standard'
|
|
72
80
|
},
|
|
73
81
|
h3: {
|
|
82
|
+
lineHeight: '1.2',
|
|
74
83
|
fontSize: fontSizes.h3,
|
|
75
84
|
fontWeight: 2,
|
|
76
|
-
color: '
|
|
85
|
+
color: 'font.base',
|
|
77
86
|
fontFamily: 'standard'
|
|
78
87
|
},
|
|
79
88
|
h4: {
|
|
89
|
+
lineHeight: '1.2',
|
|
80
90
|
fontSize: fontSizes.h4,
|
|
81
91
|
fontWeight: 2,
|
|
82
|
-
color: '
|
|
92
|
+
color: 'font.base',
|
|
83
93
|
fontFamily: 'standard'
|
|
84
94
|
},
|
|
85
95
|
h5: {
|
|
96
|
+
lineHeight: '1.2',
|
|
86
97
|
fontSize: fontSizes.h5,
|
|
87
98
|
fontWeight: 2,
|
|
88
|
-
color: '
|
|
99
|
+
color: 'font.base',
|
|
89
100
|
fontFamily: 'standard'
|
|
90
101
|
},
|
|
91
102
|
h6: {
|
|
103
|
+
lineHeight: '1.2',
|
|
92
104
|
textTransform: 'uppercase',
|
|
93
|
-
color: '
|
|
105
|
+
color: 'font.base',
|
|
94
106
|
fontFamily: 'standard',
|
|
95
107
|
fontWeight: 1,
|
|
96
108
|
fontSize: fontSizes.h6,
|
|
@@ -11,7 +11,6 @@ import { Button as ThemeUIButton } from 'theme-ui';
|
|
|
11
11
|
import { AccordionContext } from '../../context/AccordionContext';
|
|
12
12
|
import { useGetTheme, useStatusClasses } from '../../hooks';
|
|
13
13
|
import { Box, Icon, Text } from '../../index';
|
|
14
|
-
import { hoveredState } from '../AccordionGroup/Accordion.styles';
|
|
15
14
|
import { jsx as ___EmotionJSX } from "@emotion/react";
|
|
16
15
|
export var validHeadingTags = ['h1', 'h2', 'h3', 'h4'];
|
|
17
16
|
var AccordionItem = function AccordionItem(props) {
|
|
@@ -29,7 +28,8 @@ var AccordionItem = function AccordionItem(props) {
|
|
|
29
28
|
others = _objectWithoutProperties(_item$props, _excluded);
|
|
30
29
|
var _useGetTheme = useGetTheme(),
|
|
31
30
|
icons = _useGetTheme.icons,
|
|
32
|
-
accordionItemMarginLeft = _useGetTheme.accordionItemMarginLeft
|
|
31
|
+
accordionItemMarginLeft = _useGetTheme.accordionItemMarginLeft,
|
|
32
|
+
accordionHoveredState = _useGetTheme.accordionHoveredState;
|
|
33
33
|
var MenuUp = icons.MenuUp,
|
|
34
34
|
MenuDown = icons.MenuDown;
|
|
35
35
|
var state = useContext(AccordionContext);
|
|
@@ -87,13 +87,14 @@ var AccordionItem = function AccordionItem(props) {
|
|
|
87
87
|
as: validLabelHeadingTag,
|
|
88
88
|
className: buttonClasses,
|
|
89
89
|
variant: validLabelHeadingTag,
|
|
90
|
-
sx:
|
|
90
|
+
sx: accordionHoveredState
|
|
91
91
|
}, item.props.label), ___EmotionJSX(Box, {
|
|
92
92
|
as: "span",
|
|
93
93
|
ml: accordionItemMarginLeft
|
|
94
94
|
}, ___EmotionJSX(Icon, {
|
|
95
|
-
color: "
|
|
95
|
+
color: "font.base",
|
|
96
96
|
icon: isOpen ? MenuUp : MenuDown,
|
|
97
|
+
size: "sm",
|
|
97
98
|
title: {
|
|
98
99
|
name: isOpen ? 'Menu Up Icon' : 'Menu Down Icon'
|
|
99
100
|
}
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import { hoveredState } from '../../../../components/AccordionGroup/Accordion.styles';
|
|
1
2
|
import icons from './icons';
|
|
2
3
|
import styles from './styles';
|
|
3
4
|
import tShirtSizes, { iconWrapperSizes } from './tShirtSizes';
|
|
@@ -23,6 +24,7 @@ var calendarIconSize = 25;
|
|
|
23
24
|
var navBarIconSize = 18;
|
|
24
25
|
var badgeTextFontSize = '';
|
|
25
26
|
export var astroThemeValues = {
|
|
27
|
+
accordionHoveredState: hoveredState,
|
|
26
28
|
accordionItemDefaultLabelTag: accordionItemDefaultLabelTag,
|
|
27
29
|
navBarIconSize: navBarIconSize,
|
|
28
30
|
activeColor: activeColor,
|
|
@@ -13,6 +13,12 @@ import customSizes from './customSizes';
|
|
|
13
13
|
import icons from './icons';
|
|
14
14
|
import styles from './styles';
|
|
15
15
|
import tShirtSizes, { iconWrapperSizes } from './tShirtSizes';
|
|
16
|
+
var accordionHoveredState = {
|
|
17
|
+
'&.is-hovered': {
|
|
18
|
+
color: 'active',
|
|
19
|
+
textDecoration: 'underline'
|
|
20
|
+
}
|
|
21
|
+
};
|
|
16
22
|
var accordionItemDefaultLabelTag = 'h2';
|
|
17
23
|
var iconBadgeCircleColor = 'badge.iconBadge';
|
|
18
24
|
var activeColor = '#1a73e8';
|
|
@@ -32,6 +38,7 @@ var calendarIconSize = 'sm';
|
|
|
32
38
|
var badgeTextFontSize = '75%';
|
|
33
39
|
var navBarIconSize = '20px';
|
|
34
40
|
export var nextGenThemeValues = _objectSpread({
|
|
41
|
+
accordionHoveredState: accordionHoveredState,
|
|
35
42
|
activeColor: activeColor,
|
|
36
43
|
navBarIconSize: navBarIconSize,
|
|
37
44
|
backgroundBaseColor: backgroundBaseColor,
|
|
@@ -3,13 +3,17 @@ var accordion = {
|
|
|
3
3
|
borderBottom: '1px solid',
|
|
4
4
|
borderBottomColor: 'border.base'
|
|
5
5
|
},
|
|
6
|
-
pb: '
|
|
6
|
+
pb: 'md',
|
|
7
|
+
mb: 'md',
|
|
8
|
+
mt: '0px'
|
|
7
9
|
};
|
|
8
10
|
var body = {
|
|
9
|
-
|
|
11
|
+
pt: 'md'
|
|
10
12
|
};
|
|
11
13
|
var header = {
|
|
12
|
-
|
|
14
|
+
'&.is-focused': {
|
|
15
|
+
borderRadius: '2px'
|
|
16
|
+
}
|
|
13
17
|
};
|
|
14
18
|
export default {
|
|
15
19
|
accordion: accordion,
|
|
@@ -15,76 +15,88 @@ import { astroTokens } from '@pingux/onyx-tokens';
|
|
|
15
15
|
var fontSizes = astroTokens["default"]['font-size'];
|
|
16
16
|
var hTags = {
|
|
17
17
|
H1: {
|
|
18
|
+
lineHeight: '1.2',
|
|
18
19
|
fontSize: fontSizes.h1,
|
|
19
20
|
fontWeight: 2,
|
|
20
|
-
color: '
|
|
21
|
+
color: 'font.base',
|
|
21
22
|
fontFamily: 'standard'
|
|
22
23
|
},
|
|
23
24
|
H2: {
|
|
25
|
+
lineHeight: '1.2',
|
|
24
26
|
fontSize: fontSizes.h2,
|
|
25
27
|
fontWeight: 2,
|
|
26
|
-
color: '
|
|
28
|
+
color: 'font.base',
|
|
27
29
|
fontFamily: 'standard'
|
|
28
30
|
},
|
|
29
31
|
H3: {
|
|
32
|
+
lineHeight: '1.2',
|
|
30
33
|
fontSize: fontSizes.h3,
|
|
31
34
|
fontWeight: 2,
|
|
32
|
-
color: '
|
|
35
|
+
color: 'font.base',
|
|
33
36
|
fontFamily: 'standard'
|
|
34
37
|
},
|
|
35
38
|
H4: {
|
|
39
|
+
lineHeight: '1.2',
|
|
36
40
|
fontSize: fontSizes.h4,
|
|
37
41
|
fontWeight: 2,
|
|
38
|
-
color: '
|
|
42
|
+
color: 'font.base',
|
|
39
43
|
fontFamily: 'standard'
|
|
40
44
|
},
|
|
41
45
|
H5: {
|
|
46
|
+
lineHeight: '1.2',
|
|
42
47
|
fontSize: fontSizes.h5,
|
|
43
48
|
fontWeight: 2,
|
|
44
|
-
color: '
|
|
49
|
+
color: 'font.base',
|
|
45
50
|
fontFamily: 'standard'
|
|
46
51
|
},
|
|
47
52
|
H6: {
|
|
53
|
+
lineHeight: '1.2',
|
|
48
54
|
textTransform: 'uppercase',
|
|
49
|
-
color: '
|
|
55
|
+
color: 'font.base',
|
|
50
56
|
fontFamily: 'standard',
|
|
51
57
|
fontWeight: 1,
|
|
52
58
|
fontSize: fontSizes.h6,
|
|
53
59
|
letterSpacing: '1px'
|
|
54
60
|
},
|
|
55
61
|
h1: {
|
|
62
|
+
lineHeight: '1.2',
|
|
56
63
|
fontSize: fontSizes.h1,
|
|
57
64
|
fontWeight: 2,
|
|
58
|
-
color: '
|
|
65
|
+
color: 'font.base',
|
|
59
66
|
fontFamily: 'standard'
|
|
60
67
|
},
|
|
61
68
|
h2: {
|
|
69
|
+
lineHeight: '1.2',
|
|
62
70
|
fontSize: fontSizes.h2,
|
|
63
71
|
fontWeight: 2,
|
|
64
|
-
color: '
|
|
72
|
+
color: 'font.base',
|
|
65
73
|
fontFamily: 'standard'
|
|
66
74
|
},
|
|
67
75
|
h3: {
|
|
76
|
+
lineHeight: '1.2',
|
|
68
77
|
fontSize: fontSizes.h3,
|
|
69
78
|
fontWeight: 2,
|
|
70
|
-
color: '
|
|
79
|
+
color: 'font.base',
|
|
71
80
|
fontFamily: 'standard'
|
|
72
81
|
},
|
|
73
82
|
h4: {
|
|
83
|
+
lineHeight: '1.2',
|
|
74
84
|
fontSize: fontSizes.h4,
|
|
75
85
|
fontWeight: 2,
|
|
76
|
-
color: '
|
|
86
|
+
color: 'font.base',
|
|
77
87
|
fontFamily: 'standard'
|
|
78
88
|
},
|
|
79
89
|
h5: {
|
|
90
|
+
lineHeight: '1.2',
|
|
80
91
|
fontSize: fontSizes.h5,
|
|
81
92
|
fontWeight: 2,
|
|
82
|
-
color: '
|
|
93
|
+
color: 'font.base',
|
|
83
94
|
fontFamily: 'standard'
|
|
84
95
|
},
|
|
85
96
|
h6: {
|
|
97
|
+
lineHeight: '1.2',
|
|
86
98
|
textTransform: 'uppercase',
|
|
87
|
-
color: '
|
|
99
|
+
color: 'font.base',
|
|
88
100
|
fontFamily: 'standard',
|
|
89
101
|
fontWeight: 1,
|
|
90
102
|
fontSize: fontSizes.h6,
|