@spothero/ui 17.0.3 → 17.1.0-beta.3
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/dist/components/Accordion/Accordion.js +2 -1
- package/dist/components/Accordion/Accordion.stories.js +22 -13
- package/dist/components/Accordion/index.js +8 -5
- package/dist/components/Accordion/styles/button.js +3 -1
- package/dist/components/Accordion/styles/container.js +1 -1
- package/dist/components/Accordion/styles/index.js +13 -4
- package/dist/components/Accordion/styles/panel.js +1 -1
- package/dist/components/Alert/Alert.js +44 -23
- package/dist/components/Alert/Alert.stories.js +12 -8
- package/dist/components/Alert/index.js +3 -1
- package/dist/components/Alert/styles/index.js +35 -12
- package/dist/components/AutoSuggestSelect/AutoSuggestSelect.js +119 -84
- package/dist/components/AutoSuggestSelect/AutoSuggestSelect.stories.js +12 -4
- package/dist/components/AutoSuggestSelect/index.js +3 -1
- package/dist/components/Badge/Badge.js +2 -1
- package/dist/components/Badge/Badge.stories.js +20 -12
- package/dist/components/Badge/styles/index.js +12 -6
- package/dist/components/Button/Button.js +47 -17
- package/dist/components/Button/Button.spec.js +10 -4
- package/dist/components/Button/Button.styles.js +49 -36
- package/dist/components/Button/button-props.js +20 -2
- package/dist/components/Button/index.js +5 -2
- package/dist/components/Button/stories/button.js +17 -5
- package/dist/components/Button/stories/index.stories.js +48 -24
- package/dist/components/Button/stories/overview.js +62 -34
- package/dist/components/Card/Card.js +26 -11
- package/dist/components/Card/Card.stories.js +15 -5
- package/dist/components/Checkbox/Checkbox.js +2 -1
- package/dist/components/Checkbox/Checkbox.stories.js +10 -2
- package/dist/components/Checkbox/index.js +3 -1
- package/dist/components/Checkbox/styles/index.js +11 -3
- package/dist/components/Container/Container.js +21 -5
- package/dist/components/Container/Container.stories.js +43 -14
- package/dist/components/Container/Container.styles.js +1 -1
- package/dist/components/Datepicker/Range/DatepickerRange.js +67 -0
- package/dist/components/Datepicker/Range/DatepickerRange.stories.js +427 -0
- package/dist/components/Datepicker/Range/DatepickerRangeContext.js +80 -0
- package/dist/components/Datepicker/Range/components/DateRow.js +261 -0
- package/dist/components/Datepicker/Range/components/DatepickerRangeContainer.js +227 -0
- package/dist/components/Datepicker/Range/components/DatepickerRangeControls.js +80 -0
- package/dist/components/Datepicker/Range/components/index.js +31 -0
- package/dist/components/Datepicker/Range/utils/propTypes.js +158 -0
- package/dist/components/Datepicker/Single/Datepicker.stories.js +314 -0
- package/dist/components/Datepicker/Single/DatepickerContext.js +65 -0
- package/dist/components/Datepicker/Single/DatepickerSingle.js +54 -0
- package/dist/components/Datepicker/Single/components/DateRow.js +146 -0
- package/dist/components/Datepicker/Single/components/DatepickerContainer.js +167 -0
- package/dist/components/Datepicker/Single/components/DatepickerControl.js +51 -0
- package/dist/components/Datepicker/Single/components/index.js +31 -0
- package/dist/components/Datepicker/Single/utils/propTypes.js +88 -0
- package/dist/components/Datepicker/common/components/DatepickerDays.js +111 -0
- package/dist/components/Datepicker/common/components/DatepickerHeader.js +118 -0
- package/dist/components/Datepicker/common/components/DatepickerInput.js +127 -0
- package/dist/components/Datepicker/common/components/WithPopoverAnchor.js +23 -0
- package/dist/components/Datepicker/common/components/WithPortal.js +26 -0
- package/dist/components/Datepicker/common/components/index.js +39 -0
- package/dist/components/Datepicker/common/utils/constants.js +43 -0
- package/dist/components/Datepicker/common/utils/dateRowCalculations.js +92 -0
- package/dist/components/Datepicker/common/utils/generalCalculations.js +71 -0
- package/dist/components/Datepicker/common/utils/getWeeksOfMonth.js +51 -0
- package/dist/components/Datepicker/common/utils/sharedPropTypes.js +147 -0
- package/dist/components/Datepicker/index.js +23 -0
- package/dist/components/Divider/Divider.js +24 -8
- package/dist/components/Divider/Divider.stories.js +15 -3
- package/dist/components/Divider/Divider.styles.js +8 -2
- package/dist/components/FormControl/FormControl.js +29 -14
- package/dist/components/Grid/Grid.js +24 -7
- package/dist/components/Grid/Grid.stories.js +60 -36
- package/dist/components/Grid/Grid.styles.js +2 -2
- package/dist/components/Grid/GridItem.js +21 -5
- package/dist/components/Grid/GridItem.styles.js +1 -2
- package/dist/components/Grid/index.js +5 -2
- package/dist/components/Heading/Heading.js +29 -8
- package/dist/components/Heading/Heading.stories.js +15 -4
- package/dist/components/Heading/Heading.styles.js +38 -24
- package/dist/components/Icon/Icon.js +2 -1
- package/dist/components/Icon/Icon.stories.js +28 -19
- package/dist/components/Image/Image.js +69 -39
- package/dist/components/Image/Image.spec.js +22 -16
- package/dist/components/Image/Image.stories.js +19 -8
- package/dist/components/Input/Input.js +31 -14
- package/dist/components/Input/Input.stories.js +15 -5
- package/dist/components/Input/index.js +3 -1
- package/dist/components/Input/styles/index.js +10 -4
- package/dist/components/Link/Link.js +2 -1
- package/dist/components/Link/Link.stories.js +12 -5
- package/dist/components/Link/Link.styles.js +8 -8
- package/dist/components/List/List.js +37 -14
- package/dist/components/List/List.stories.js +55 -19
- package/dist/components/List/index.js +5 -2
- package/dist/components/List/styles/index.js +9 -2
- package/dist/components/List/styles/item.styles.js +1 -1
- package/dist/components/Loader/Loader.js +33 -17
- package/dist/components/Loader/Loader.stories.js +44 -24
- package/dist/components/Modal/Modal.js +23 -17
- package/dist/components/Modal/Modal.stories.js +100 -30
- package/dist/components/Modal/index.js +3 -1
- package/dist/components/Modal/styles/body.js +28 -11
- package/dist/components/Modal/styles/closeButton.js +4 -4
- package/dist/components/Modal/styles/dialog.js +4 -4
- package/dist/components/Modal/styles/dialogContainer.js +11 -5
- package/dist/components/Modal/styles/header.js +5 -5
- package/dist/components/Modal/styles/index.js +28 -12
- package/dist/components/Popover/Popover.js +33 -12
- package/dist/components/Popover/Popover.stories.js +62 -36
- package/dist/components/Popover/PopoverArrow.js +17 -3
- package/dist/components/Popover/PopoverCloseButton.js +17 -3
- package/dist/components/Popover/PopoverContent.js +27 -10
- package/dist/components/Popover/index.js +8 -4
- package/dist/components/Popover/styles/index.js +22 -9
- package/dist/components/Popover/styles/popover-arrow.js +4 -4
- package/dist/components/Popover/styles/popover-body.js +7 -3
- package/dist/components/Popover/styles/popover-close-button.js +10 -7
- package/dist/components/Popover/styles/popover-content.js +7 -5
- package/dist/components/Popover/styles/popover-header.js +1 -1
- package/dist/components/Popover/styles/popper.js +1 -1
- package/dist/components/Radio/Radio.js +27 -12
- package/dist/components/Radio/Radio.stories.js +12 -2
- package/dist/components/Radio/RadioGroup.js +33 -17
- package/dist/components/Radio/index.js +5 -2
- package/dist/components/Radio/styles/index.js +13 -5
- package/dist/components/Select/Select.js +33 -14
- package/dist/components/Select/Select.stories.js +22 -13
- package/dist/components/Select/index.js +3 -1
- package/dist/components/Select/styles/index.js +14 -4
- package/dist/components/Skeleton/Skeleton.stories.js +20 -6
- package/dist/components/Skeleton/Skeleton.styles.js +3 -0
- package/dist/components/Skeleton/index.js +4 -3
- package/dist/components/Spinner/Spinner.js +25 -9
- package/dist/components/Spinner/Spinner.stories.js +70 -42
- package/dist/components/Spinner/Spinner.styles.js +43 -56
- package/dist/components/Switch/Switch.js +30 -13
- package/dist/components/Switch/Switch.stories.js +10 -2
- package/dist/components/Switch/index.js +3 -1
- package/dist/components/Switch/styles/index.js +31 -10
- package/dist/components/Table/Table.js +2 -1
- package/dist/components/Table/Table.stories.js +37 -17
- package/dist/components/Table/Table.styles.js +32 -13
- package/dist/components/Table/index.js +11 -8
- package/dist/components/Tabs/Tabs.js +22 -14
- package/dist/components/Tabs/Tabs.stories.js +20 -4
- package/dist/components/Tabs/combineSizeWithVariant.js +17 -11
- package/dist/components/Tabs/index.js +8 -5
- package/dist/components/Tabs/styles/index.js +8 -2
- package/dist/components/Text/Text.js +17 -8
- package/dist/components/Text/Text.stories.js +15 -3
- package/dist/components/Text/Text.styles.js +35 -15
- package/dist/components/Text/combineAsWithVariant.js +57 -36
- package/dist/components/Text/options.js +1 -1
- package/dist/components/ThemeProvider/ThemeProvider.js +33 -10
- package/dist/components/ThemeProvider/ThemeProvider.stories.js +16 -7
- package/dist/components/index.js +133 -74
- package/dist/components/styles.js +43 -21
- package/dist/theme/base/breakpoints.js +4 -1
- package/dist/theme/base/colors.js +45 -32
- package/dist/theme/base/index.js +13 -7
- package/dist/theme/base/sizes.js +4 -4
- package/dist/theme/base/typography.js +6 -5
- package/dist/theme/base/zindices.js +2 -1
- package/dist/theme/global.js +20 -87
- package/dist/theme/index.js +41 -15
- package/dist/utils/Spaces.js +12 -5
- package/package.json +2 -2
|
@@ -1,153 +1,175 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
|
|
4
|
+
|
|
4
5
|
Object.defineProperty(exports, "__esModule", {
|
|
5
6
|
value: true
|
|
6
7
|
});
|
|
7
8
|
Object.defineProperty(exports, "Accordion", {
|
|
8
9
|
enumerable: true,
|
|
9
|
-
get: function () {
|
|
10
|
+
get: function get() {
|
|
10
11
|
return _styles2.default;
|
|
11
12
|
}
|
|
12
13
|
});
|
|
13
14
|
Object.defineProperty(exports, "Alert", {
|
|
14
15
|
enumerable: true,
|
|
15
|
-
get: function () {
|
|
16
|
+
get: function get() {
|
|
16
17
|
return _styles6.default;
|
|
17
18
|
}
|
|
18
19
|
});
|
|
19
20
|
Object.defineProperty(exports, "Badge", {
|
|
20
21
|
enumerable: true,
|
|
21
|
-
get: function () {
|
|
22
|
+
get: function get() {
|
|
22
23
|
return _styles12.default;
|
|
23
24
|
}
|
|
24
25
|
});
|
|
25
26
|
Object.defineProperty(exports, "Button", {
|
|
26
27
|
enumerable: true,
|
|
27
|
-
get: function () {
|
|
28
|
+
get: function get() {
|
|
28
29
|
return _Button.default;
|
|
29
30
|
}
|
|
30
31
|
});
|
|
31
32
|
Object.defineProperty(exports, "Checkbox", {
|
|
32
33
|
enumerable: true,
|
|
33
|
-
get: function () {
|
|
34
|
+
get: function get() {
|
|
34
35
|
return _styles5.default;
|
|
35
36
|
}
|
|
36
37
|
});
|
|
37
38
|
Object.defineProperty(exports, "Divider", {
|
|
38
39
|
enumerable: true,
|
|
39
|
-
get: function () {
|
|
40
|
+
get: function get() {
|
|
40
41
|
return _Divider.default;
|
|
41
42
|
}
|
|
42
43
|
});
|
|
43
44
|
Object.defineProperty(exports, "GridItem", {
|
|
44
45
|
enumerable: true,
|
|
45
|
-
get: function () {
|
|
46
|
+
get: function get() {
|
|
46
47
|
return _GridItem.default;
|
|
47
48
|
}
|
|
48
49
|
});
|
|
49
50
|
Object.defineProperty(exports, "Heading", {
|
|
50
51
|
enumerable: true,
|
|
51
|
-
get: function () {
|
|
52
|
+
get: function get() {
|
|
52
53
|
return _Heading.default;
|
|
53
54
|
}
|
|
54
55
|
});
|
|
55
56
|
Object.defineProperty(exports, "Input", {
|
|
56
57
|
enumerable: true,
|
|
57
|
-
get: function () {
|
|
58
|
+
get: function get() {
|
|
58
59
|
return _styles9.default;
|
|
59
60
|
}
|
|
60
61
|
});
|
|
61
62
|
Object.defineProperty(exports, "Link", {
|
|
62
63
|
enumerable: true,
|
|
63
|
-
get: function () {
|
|
64
|
+
get: function get() {
|
|
64
65
|
return _Link.default;
|
|
65
66
|
}
|
|
66
67
|
});
|
|
67
68
|
Object.defineProperty(exports, "List", {
|
|
68
69
|
enumerable: true,
|
|
69
|
-
get: function () {
|
|
70
|
+
get: function get() {
|
|
70
71
|
return _styles.default;
|
|
71
72
|
}
|
|
72
73
|
});
|
|
73
74
|
Object.defineProperty(exports, "Modal", {
|
|
74
75
|
enumerable: true,
|
|
75
|
-
get: function () {
|
|
76
|
+
get: function get() {
|
|
76
77
|
return _styles10.default;
|
|
77
78
|
}
|
|
78
79
|
});
|
|
79
80
|
Object.defineProperty(exports, "Popover", {
|
|
80
81
|
enumerable: true,
|
|
81
|
-
get: function () {
|
|
82
|
+
get: function get() {
|
|
82
83
|
return _styles8.default;
|
|
83
84
|
}
|
|
84
85
|
});
|
|
85
86
|
Object.defineProperty(exports, "Radio", {
|
|
86
87
|
enumerable: true,
|
|
87
|
-
get: function () {
|
|
88
|
+
get: function get() {
|
|
88
89
|
return _styles11.default;
|
|
89
90
|
}
|
|
90
91
|
});
|
|
91
92
|
Object.defineProperty(exports, "Select", {
|
|
92
93
|
enumerable: true,
|
|
93
|
-
get: function () {
|
|
94
|
+
get: function get() {
|
|
94
95
|
return _styles4.default;
|
|
95
96
|
}
|
|
96
97
|
});
|
|
97
98
|
Object.defineProperty(exports, "Skeleton", {
|
|
98
99
|
enumerable: true,
|
|
99
|
-
get: function () {
|
|
100
|
+
get: function get() {
|
|
100
101
|
return _Skeleton.default;
|
|
101
102
|
}
|
|
102
103
|
});
|
|
103
104
|
Object.defineProperty(exports, "Spinner", {
|
|
104
105
|
enumerable: true,
|
|
105
|
-
get: function () {
|
|
106
|
+
get: function get() {
|
|
106
107
|
return _Spinner.default;
|
|
107
108
|
}
|
|
108
109
|
});
|
|
109
110
|
Object.defineProperty(exports, "Switch", {
|
|
110
111
|
enumerable: true,
|
|
111
|
-
get: function () {
|
|
112
|
+
get: function get() {
|
|
112
113
|
return _styles7.default;
|
|
113
114
|
}
|
|
114
115
|
});
|
|
115
116
|
Object.defineProperty(exports, "Table", {
|
|
116
117
|
enumerable: true,
|
|
117
|
-
get: function () {
|
|
118
|
+
get: function get() {
|
|
118
119
|
return _Table.default;
|
|
119
120
|
}
|
|
120
121
|
});
|
|
121
122
|
Object.defineProperty(exports, "Tabs", {
|
|
122
123
|
enumerable: true,
|
|
123
|
-
get: function () {
|
|
124
|
+
get: function get() {
|
|
124
125
|
return _styles3.default;
|
|
125
126
|
}
|
|
126
127
|
});
|
|
127
128
|
Object.defineProperty(exports, "Text", {
|
|
128
129
|
enumerable: true,
|
|
129
|
-
get: function () {
|
|
130
|
+
get: function get() {
|
|
130
131
|
return _Text.default;
|
|
131
132
|
}
|
|
132
133
|
});
|
|
134
|
+
|
|
133
135
|
var _styles = _interopRequireDefault(require("./List/styles"));
|
|
136
|
+
|
|
134
137
|
var _Table = _interopRequireDefault(require("./Table/Table.styles"));
|
|
138
|
+
|
|
135
139
|
var _Text = _interopRequireDefault(require("./Text/Text.styles"));
|
|
140
|
+
|
|
136
141
|
var _Link = _interopRequireDefault(require("./Link/Link.styles"));
|
|
142
|
+
|
|
137
143
|
var _styles2 = _interopRequireDefault(require("./Accordion/styles"));
|
|
144
|
+
|
|
138
145
|
var _Button = _interopRequireDefault(require("./Button/Button.styles"));
|
|
146
|
+
|
|
139
147
|
var _GridItem = _interopRequireDefault(require("./Grid/GridItem.styles"));
|
|
148
|
+
|
|
140
149
|
var _Spinner = _interopRequireDefault(require("./Spinner/Spinner.styles"));
|
|
150
|
+
|
|
141
151
|
var _Heading = _interopRequireDefault(require("./Heading/Heading.styles"));
|
|
152
|
+
|
|
142
153
|
var _Divider = _interopRequireDefault(require("./Divider/Divider.styles"));
|
|
154
|
+
|
|
143
155
|
var _styles3 = _interopRequireDefault(require("./Tabs/styles"));
|
|
156
|
+
|
|
144
157
|
var _styles4 = _interopRequireDefault(require("./Select/styles"));
|
|
158
|
+
|
|
145
159
|
var _styles5 = _interopRequireDefault(require("./Checkbox/styles"));
|
|
160
|
+
|
|
146
161
|
var _styles6 = _interopRequireDefault(require("./Alert/styles"));
|
|
162
|
+
|
|
147
163
|
var _styles7 = _interopRequireDefault(require("./Switch/styles"));
|
|
164
|
+
|
|
148
165
|
var _styles8 = _interopRequireDefault(require("./Popover/styles"));
|
|
166
|
+
|
|
149
167
|
var _styles9 = _interopRequireDefault(require("./Input/styles"));
|
|
168
|
+
|
|
150
169
|
var _styles10 = _interopRequireDefault(require("./Modal/styles"));
|
|
170
|
+
|
|
151
171
|
var _styles11 = _interopRequireDefault(require("./Radio/styles"));
|
|
172
|
+
|
|
152
173
|
var _Skeleton = _interopRequireDefault(require("./Skeleton/Skeleton.styles"));
|
|
174
|
+
|
|
153
175
|
var _styles12 = _interopRequireDefault(require("./Badge/styles"));
|
|
@@ -4,14 +4,16 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
6
|
exports.default = void 0;
|
|
7
|
+
|
|
7
8
|
var _themeTools = require("@chakra-ui/theme-tools");
|
|
9
|
+
|
|
8
10
|
/**
|
|
9
11
|
* The "base" breakpoint is Chakra's default non-responsive value (from 0 upwards).
|
|
10
12
|
* While we don't explicitly enable a "mobile" breakpoint, we can consider "base" and
|
|
11
13
|
* "mobile" the same for all intents and purposes for mobile-first responsive styling.
|
|
12
14
|
* @see https://chakra-ui.com/docs/features/responsive-styles#customizing-breakpoints
|
|
13
15
|
*/
|
|
14
|
-
|
|
16
|
+
var breakpoints = (0, _themeTools.createBreakpoints)({
|
|
15
17
|
mobileXL: '30rem',
|
|
16
18
|
// 480px
|
|
17
19
|
tablet: '48rem',
|
|
@@ -19,6 +21,7 @@ const breakpoints = (0, _themeTools.createBreakpoints)({
|
|
|
19
21
|
desktop: '64rem',
|
|
20
22
|
// 1024px
|
|
21
23
|
desktopXL: '90rem' // 1440px
|
|
24
|
+
|
|
22
25
|
});
|
|
23
26
|
var _default = breakpoints;
|
|
24
27
|
exports.default = _default;
|
|
@@ -1,13 +1,32 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
+
var _Object$keys = require("@babel/runtime-corejs3/core-js-stable/object/keys");
|
|
4
|
+
|
|
5
|
+
var _Object$getOwnPropertySymbols = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols");
|
|
6
|
+
|
|
7
|
+
var _filterInstanceProperty = require("@babel/runtime-corejs3/core-js-stable/instance/filter");
|
|
8
|
+
|
|
9
|
+
var _Object$getOwnPropertyDescriptor = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor");
|
|
10
|
+
|
|
11
|
+
var _Object$getOwnPropertyDescriptors = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptors");
|
|
12
|
+
|
|
13
|
+
var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
|
|
14
|
+
|
|
3
15
|
Object.defineProperty(exports, "__esModule", {
|
|
4
16
|
value: true
|
|
5
17
|
});
|
|
6
18
|
exports.default = void 0;
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
19
|
+
|
|
20
|
+
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/defineProperty"));
|
|
21
|
+
|
|
22
|
+
function ownKeys(object, enumerableOnly) { var keys = _Object$keys(object); if (_Object$getOwnPropertySymbols) { var symbols = _Object$getOwnPropertySymbols(object); enumerableOnly && (symbols = _filterInstanceProperty(symbols).call(symbols, function (sym) { return _Object$getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
23
|
+
|
|
24
|
+
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }) : _Object$getOwnPropertyDescriptors ? Object.defineProperties(target, _Object$getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, _Object$getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
25
|
+
|
|
26
|
+
var white = '#ffffff';
|
|
27
|
+
var black = '#000000';
|
|
28
|
+
var brandBlue = '#0082ff';
|
|
29
|
+
var gray = {
|
|
11
30
|
50: '#f6f7f9',
|
|
12
31
|
100: '#e1e6ec',
|
|
13
32
|
200: '#cbd4de',
|
|
@@ -19,7 +38,7 @@ const gray = {
|
|
|
19
38
|
800: '#2f3f4b',
|
|
20
39
|
900: '#26323c'
|
|
21
40
|
};
|
|
22
|
-
|
|
41
|
+
var blue = {
|
|
23
42
|
50: '#f6fbfd',
|
|
24
43
|
100: '#e6f8fd',
|
|
25
44
|
200: '#c0e9fb',
|
|
@@ -31,7 +50,7 @@ const blue = {
|
|
|
31
50
|
800: '#1735a6',
|
|
32
51
|
900: '#132b7f'
|
|
33
52
|
};
|
|
34
|
-
|
|
53
|
+
var navy = {
|
|
35
54
|
50: '#f4fafc',
|
|
36
55
|
100: '#e4f7fb',
|
|
37
56
|
200: '#bfebf6',
|
|
@@ -43,7 +62,7 @@ const navy = {
|
|
|
43
62
|
800: '#194185',
|
|
44
63
|
900: '#002d5b'
|
|
45
64
|
};
|
|
46
|
-
|
|
65
|
+
var green = {
|
|
47
66
|
50: '#ecf8f7',
|
|
48
67
|
100: '#d3f7ef',
|
|
49
68
|
200: '#a4f3d9',
|
|
@@ -55,7 +74,7 @@ const green = {
|
|
|
55
74
|
800: '#11703e',
|
|
56
75
|
900: '#115a35'
|
|
57
76
|
};
|
|
58
|
-
|
|
77
|
+
var yellow = {
|
|
59
78
|
50: '#f9f5e5',
|
|
60
79
|
100: '#faf0bd',
|
|
61
80
|
200: '#f6e67c',
|
|
@@ -67,7 +86,7 @@ const yellow = {
|
|
|
67
86
|
800: '#8e440e',
|
|
68
87
|
900: '#743710'
|
|
69
88
|
};
|
|
70
|
-
|
|
89
|
+
var red = {
|
|
71
90
|
50: '#fdf9f8',
|
|
72
91
|
100: '#fdeef3',
|
|
73
92
|
200: '#fbcee6',
|
|
@@ -79,33 +98,27 @@ const red = {
|
|
|
79
98
|
800: '#b4193c',
|
|
80
99
|
900: '#901530'
|
|
81
100
|
};
|
|
82
|
-
|
|
83
|
-
primary: {
|
|
84
|
-
...blue,
|
|
101
|
+
var colors = {
|
|
102
|
+
primary: _objectSpread(_objectSpread({}, blue), {}, {
|
|
85
103
|
default: blue['500']
|
|
86
|
-
},
|
|
87
|
-
secondary: {
|
|
88
|
-
...navy,
|
|
104
|
+
}),
|
|
105
|
+
secondary: _objectSpread(_objectSpread({}, navy), {}, {
|
|
89
106
|
default: navy['900']
|
|
90
|
-
},
|
|
91
|
-
gray: {
|
|
92
|
-
...gray,
|
|
107
|
+
}),
|
|
108
|
+
gray: _objectSpread(_objectSpread({}, gray), {}, {
|
|
93
109
|
light: gray['50'],
|
|
94
110
|
medium: gray['200'],
|
|
95
111
|
dark: gray['600']
|
|
96
|
-
},
|
|
97
|
-
red: {
|
|
98
|
-
...red,
|
|
112
|
+
}),
|
|
113
|
+
red: _objectSpread(_objectSpread({}, red), {}, {
|
|
99
114
|
default: red['700']
|
|
100
|
-
},
|
|
101
|
-
green: {
|
|
102
|
-
...green,
|
|
115
|
+
}),
|
|
116
|
+
green: _objectSpread(_objectSpread({}, green), {}, {
|
|
103
117
|
default: green['700']
|
|
104
|
-
},
|
|
105
|
-
yellow: {
|
|
106
|
-
...yellow,
|
|
118
|
+
}),
|
|
119
|
+
yellow: _objectSpread(_objectSpread({}, yellow), {}, {
|
|
107
120
|
default: yellow['400']
|
|
108
|
-
},
|
|
121
|
+
}),
|
|
109
122
|
success: green['700'],
|
|
110
123
|
warning: yellow['400'],
|
|
111
124
|
error: red['700'],
|
|
@@ -125,11 +138,11 @@ const colors = {
|
|
|
125
138
|
},
|
|
126
139
|
background: {
|
|
127
140
|
gray: gray['50'],
|
|
128
|
-
white
|
|
141
|
+
white: white
|
|
129
142
|
},
|
|
130
|
-
white,
|
|
131
|
-
black,
|
|
132
|
-
brandBlue
|
|
143
|
+
white: white,
|
|
144
|
+
black: black,
|
|
145
|
+
brandBlue: brandBlue
|
|
133
146
|
};
|
|
134
147
|
var _default = colors;
|
|
135
148
|
exports.default = _default;
|
package/dist/theme/base/index.js
CHANGED
|
@@ -1,53 +1,59 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
|
|
4
|
+
|
|
4
5
|
Object.defineProperty(exports, "__esModule", {
|
|
5
6
|
value: true
|
|
6
7
|
});
|
|
7
8
|
Object.defineProperty(exports, "breakpoints", {
|
|
8
9
|
enumerable: true,
|
|
9
|
-
get: function () {
|
|
10
|
+
get: function get() {
|
|
10
11
|
return _breakpoints.default;
|
|
11
12
|
}
|
|
12
13
|
});
|
|
13
14
|
Object.defineProperty(exports, "colors", {
|
|
14
15
|
enumerable: true,
|
|
15
|
-
get: function () {
|
|
16
|
+
get: function get() {
|
|
16
17
|
return _colors.default;
|
|
17
18
|
}
|
|
18
19
|
});
|
|
19
20
|
Object.defineProperty(exports, "fontSizes", {
|
|
20
21
|
enumerable: true,
|
|
21
|
-
get: function () {
|
|
22
|
+
get: function get() {
|
|
22
23
|
return _typography.fontSizes;
|
|
23
24
|
}
|
|
24
25
|
});
|
|
25
26
|
Object.defineProperty(exports, "fontWeights", {
|
|
26
27
|
enumerable: true,
|
|
27
|
-
get: function () {
|
|
28
|
+
get: function get() {
|
|
28
29
|
return _typography.fontWeights;
|
|
29
30
|
}
|
|
30
31
|
});
|
|
31
32
|
Object.defineProperty(exports, "fonts", {
|
|
32
33
|
enumerable: true,
|
|
33
|
-
get: function () {
|
|
34
|
+
get: function get() {
|
|
34
35
|
return _typography.fonts;
|
|
35
36
|
}
|
|
36
37
|
});
|
|
37
38
|
Object.defineProperty(exports, "sizes", {
|
|
38
39
|
enumerable: true,
|
|
39
|
-
get: function () {
|
|
40
|
+
get: function get() {
|
|
40
41
|
return _sizes.default;
|
|
41
42
|
}
|
|
42
43
|
});
|
|
43
44
|
Object.defineProperty(exports, "zIndices", {
|
|
44
45
|
enumerable: true,
|
|
45
|
-
get: function () {
|
|
46
|
+
get: function get() {
|
|
46
47
|
return _zindices.default;
|
|
47
48
|
}
|
|
48
49
|
});
|
|
50
|
+
|
|
49
51
|
var _sizes = _interopRequireDefault(require("./sizes"));
|
|
52
|
+
|
|
50
53
|
var _colors = _interopRequireDefault(require("./colors"));
|
|
54
|
+
|
|
51
55
|
var _zindices = _interopRequireDefault(require("./zindices"));
|
|
56
|
+
|
|
52
57
|
var _breakpoints = _interopRequireDefault(require("./breakpoints"));
|
|
58
|
+
|
|
53
59
|
var _typography = require("./typography");
|
package/dist/theme/base/sizes.js
CHANGED
|
@@ -4,16 +4,16 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
6
|
exports.default = void 0;
|
|
7
|
-
|
|
7
|
+
var container = {
|
|
8
8
|
base: '100%',
|
|
9
9
|
// 640px
|
|
10
10
|
tablet: '45rem',
|
|
11
11
|
// 720px
|
|
12
12
|
desktop: '72rem' // 1152px
|
|
13
|
-
};
|
|
14
13
|
|
|
15
|
-
|
|
16
|
-
|
|
14
|
+
};
|
|
15
|
+
var sizes = {
|
|
16
|
+
container: container,
|
|
17
17
|
0: '0',
|
|
18
18
|
0.5: '0.125rem',
|
|
19
19
|
// 2px
|
|
@@ -4,12 +4,12 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
6
|
exports.fonts = exports.fontWeights = exports.fontSizes = void 0;
|
|
7
|
-
|
|
8
|
-
heading:
|
|
9
|
-
body:
|
|
7
|
+
var fonts = {
|
|
8
|
+
heading: "\"Open Sans\", sans-serif",
|
|
9
|
+
body: "\"Open Sans\", sans-serif"
|
|
10
10
|
};
|
|
11
11
|
exports.fonts = fonts;
|
|
12
|
-
|
|
12
|
+
var fontSizes = {
|
|
13
13
|
'5xl': '3.5rem',
|
|
14
14
|
// 56px
|
|
15
15
|
'4xl': '3rem',
|
|
@@ -29,9 +29,10 @@ const fontSizes = {
|
|
|
29
29
|
sm: '0.875rem',
|
|
30
30
|
// 14px
|
|
31
31
|
xs: '0.75rem' // 12px
|
|
32
|
+
|
|
32
33
|
};
|
|
33
34
|
exports.fontSizes = fontSizes;
|
|
34
|
-
|
|
35
|
+
var fontWeights = {
|
|
35
36
|
light: 300,
|
|
36
37
|
normal: 400,
|
|
37
38
|
semibold: 600,
|
|
@@ -4,7 +4,7 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
6
|
exports.default = void 0;
|
|
7
|
-
|
|
7
|
+
var indices = {
|
|
8
8
|
hide: -100,
|
|
9
9
|
// equivalent to $z-index-negative in fe-core (https://github.com/spothero/fe-core/blob/main/utils/_defaults.scss)
|
|
10
10
|
auto: 'auto',
|
|
@@ -29,6 +29,7 @@ const indices = {
|
|
|
29
29
|
layer9: 900,
|
|
30
30
|
// equivalent to $z-index-notification in fe-core
|
|
31
31
|
layer10: 1000 // equivalent to $z-index-top in fe-core
|
|
32
|
+
|
|
32
33
|
};
|
|
33
34
|
var _default = indices;
|
|
34
35
|
exports.default = _default;
|
package/dist/theme/global.js
CHANGED
|
@@ -1,14 +1,21 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
|
|
4
|
+
|
|
4
5
|
Object.defineProperty(exports, "__esModule", {
|
|
5
6
|
value: true
|
|
6
7
|
});
|
|
7
8
|
exports.default = exports.LegacyOverrides = exports.Fonts = void 0;
|
|
9
|
+
|
|
10
|
+
var _concat = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/concat"));
|
|
11
|
+
|
|
8
12
|
var _react = _interopRequireDefault(require("react"));
|
|
13
|
+
|
|
9
14
|
var _react2 = require("@emotion/react");
|
|
15
|
+
|
|
10
16
|
var _base = require("./base");
|
|
11
|
-
|
|
17
|
+
|
|
18
|
+
var global = {
|
|
12
19
|
'html, body': {
|
|
13
20
|
color: 'text.primary.light'
|
|
14
21
|
},
|
|
@@ -24,96 +31,22 @@ const global = {
|
|
|
24
31
|
};
|
|
25
32
|
var _default = global;
|
|
26
33
|
exports.default = _default;
|
|
27
|
-
const Fonts = () => /*#__PURE__*/_react.default.createElement(_react2.Global, {
|
|
28
|
-
styles: `
|
|
29
|
-
@import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@300;400;600;700&display=swap');
|
|
30
|
-
/* Copied from https://fonts.googleapis.com/css2?family=Open+Sans:wght@700&display=swap */
|
|
31
|
-
/* latin-ext */
|
|
32
|
-
@font-face {
|
|
33
|
-
font-family: 'Open Sans';
|
|
34
|
-
font-style: normal;
|
|
35
|
-
font-weight: 700;
|
|
36
|
-
src: url(https://fonts.gstatic.com/s/opensans/v18/mem5YaGs126MiZpBA-UN7rgOXOhpKKSTj5PW.woff2) format('woff2');
|
|
37
|
-
unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
|
|
38
|
-
}
|
|
39
|
-
/* latin-ext */
|
|
40
|
-
@font-face {
|
|
41
|
-
font-family: 'Open Sans';
|
|
42
|
-
font-style: normal;
|
|
43
|
-
font-weight: 600;
|
|
44
|
-
src: url(https://fonts.gstatic.com/s/opensans/v18/mem5YaGs126MiZpBA-UNirkOXOhpKKSTj5PW.woff2) format('woff2');
|
|
45
|
-
unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
|
|
46
|
-
}
|
|
47
|
-
/* latin-ext */
|
|
48
|
-
@font-face {
|
|
49
|
-
font-family: 'Open Sans';
|
|
50
|
-
font-style: normal;
|
|
51
|
-
font-weight: 400;
|
|
52
|
-
src: url(https://fonts.gstatic.com/s/opensans/v18/mem8YaGs126MiZpBA-UFW50bf8pkAp6a.woff2) format('woff2');
|
|
53
|
-
unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
|
|
54
|
-
}
|
|
55
|
-
/* latin-ext */
|
|
56
|
-
@font-face {
|
|
57
|
-
font-family: 'Open Sans';
|
|
58
|
-
font-style: normal;
|
|
59
|
-
font-weight: 300;
|
|
60
|
-
src: url(https://fonts.gstatic.com/s/opensans/v18/mem5YaGs126MiZpBA-UN_r8OXOhpKKSTj5PW.woff2) format('woff2');
|
|
61
|
-
unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
|
|
62
|
-
}
|
|
63
|
-
`
|
|
64
|
-
});
|
|
65
|
-
exports.Fonts = Fonts;
|
|
66
|
-
const LegacyOverrides = _ref => {
|
|
67
|
-
let {
|
|
68
|
-
useLegacyOverrides
|
|
69
|
-
} = _ref;
|
|
70
|
-
return useLegacyOverrides ? /*#__PURE__*/_react.default.createElement(_react2.Global, {
|
|
71
|
-
styles: `
|
|
72
|
-
h1,
|
|
73
|
-
h2,
|
|
74
|
-
h3,
|
|
75
|
-
h4,
|
|
76
|
-
h5,
|
|
77
|
-
h6 {
|
|
78
|
-
margin-top: 0;
|
|
79
|
-
font-weight: ${_base.fontWeights.semibold};
|
|
80
|
-
}
|
|
81
|
-
|
|
82
|
-
.heading-sm {
|
|
83
|
-
font-size: ${_base.fontSizes.base};
|
|
84
|
-
}
|
|
85
|
-
.heading-md {
|
|
86
|
-
font-size: ${_base.fontSizes.md};
|
|
87
|
-
}
|
|
88
|
-
.heading-lg {
|
|
89
|
-
font-size: ${_base.fontSizes['5xl']};
|
|
90
|
-
}
|
|
91
|
-
|
|
92
|
-
p {
|
|
93
|
-
line-height: 1.5;
|
|
94
|
-
}
|
|
95
|
-
|
|
96
|
-
a {
|
|
97
|
-
outline: none;
|
|
98
|
-
text-align: left;
|
|
99
|
-
color: ${_base.colors.primary.default};
|
|
100
|
-
text-decoration: none;
|
|
101
34
|
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
35
|
+
var Fonts = function Fonts() {
|
|
36
|
+
return /*#__PURE__*/_react.default.createElement(_react2.Global, {
|
|
37
|
+
styles: "\n @import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@300;400;600;700&display=swap');\n /* Copied from https://fonts.googleapis.com/css2?family=Open+Sans:wght@700&display=swap */\n /* latin-ext */\n @font-face {\n font-family: 'Open Sans';\n font-style: normal;\n font-weight: 700;\n src: url(https://fonts.gstatic.com/s/opensans/v18/mem5YaGs126MiZpBA-UN7rgOXOhpKKSTj5PW.woff2) format('woff2');\n unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;\n }\n /* latin-ext */\n @font-face {\n font-family: 'Open Sans';\n font-style: normal;\n font-weight: 600;\n src: url(https://fonts.gstatic.com/s/opensans/v18/mem5YaGs126MiZpBA-UNirkOXOhpKKSTj5PW.woff2) format('woff2');\n unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;\n }\n /* latin-ext */\n @font-face {\n font-family: 'Open Sans';\n font-style: normal;\n font-weight: 400;\n src: url(https://fonts.gstatic.com/s/opensans/v18/mem8YaGs126MiZpBA-UFW50bf8pkAp6a.woff2) format('woff2');\n unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;\n }\n /* latin-ext */\n @font-face {\n font-family: 'Open Sans';\n font-style: normal;\n font-weight: 300;\n src: url(https://fonts.gstatic.com/s/opensans/v18/mem5YaGs126MiZpBA-UN_r8OXOhpKKSTj5PW.woff2) format('woff2');\n unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;\n }\n "
|
|
38
|
+
});
|
|
39
|
+
};
|
|
106
40
|
|
|
107
|
-
|
|
108
|
-
color: ${_base.colors.primary['700']};
|
|
109
|
-
}
|
|
110
|
-
}
|
|
41
|
+
exports.Fonts = Fonts;
|
|
111
42
|
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
}
|
|
43
|
+
var LegacyOverrides = function LegacyOverrides(_ref) {
|
|
44
|
+
var _context, _context2, _context3, _context4, _context5, _context6;
|
|
115
45
|
|
|
116
|
-
|
|
46
|
+
var useLegacyOverrides = _ref.useLegacyOverrides;
|
|
47
|
+
return useLegacyOverrides ? /*#__PURE__*/_react.default.createElement(_react2.Global, {
|
|
48
|
+
styles: (0, _concat.default)(_context = (0, _concat.default)(_context2 = (0, _concat.default)(_context3 = (0, _concat.default)(_context4 = (0, _concat.default)(_context5 = (0, _concat.default)(_context6 = "\n h1,\n h2,\n h3,\n h4,\n h5,\n h6 {\n margin-top: 0;\n font-weight: ".concat(_base.fontWeights.semibold, ";\n }\n\n .heading-sm {\n font-size: ")).call(_context6, _base.fontSizes.base, ";\n }\n .heading-md {\n font-size: ")).call(_context5, _base.fontSizes.md, ";\n }\n .heading-lg {\n font-size: ")).call(_context4, _base.fontSizes['5xl'], ";\n }\n\n p {\n line-height: 1.5;\n }\n\n a {\n outline: none;\n text-align: left;\n color: ")).call(_context3, _base.colors.primary.default, ";\n text-decoration: none;\n\n &:active,\n &:focus {\n outline: none;\n }\n\n &:hover {\n color: ")).call(_context2, _base.colors.primary['700'], ";\n }\n }\n\n small {\n font-size: ")).call(_context, _base.fontSizes.xs, ";\n }\n\n ")
|
|
117
49
|
}) : null;
|
|
118
50
|
};
|
|
51
|
+
|
|
119
52
|
exports.LegacyOverrides = LegacyOverrides;
|