@commercetools-frontend/ui-kit 18.2.0 → 18.4.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/dist/commercetools-frontend-ui-kit.cjs.dev.js +1 -1
- package/dist/commercetools-frontend-ui-kit.cjs.prod.js +1 -1
- package/dist/commercetools-frontend-ui-kit.esm.js +1 -1
- package/materials/custom-properties_default.css +283 -0
- package/materials/custom-properties_recolouring.css +287 -0
- package/package.json +36 -36
|
@@ -81,7 +81,7 @@ var text__default = /*#__PURE__*/_interopDefault(text);
|
|
|
81
81
|
var viewSwitcher__default = /*#__PURE__*/_interopDefault(viewSwitcher);
|
|
82
82
|
|
|
83
83
|
// NOTE: This string will be replaced on build time with the package version.
|
|
84
|
-
var version = "18.
|
|
84
|
+
var version = "18.4.0";
|
|
85
85
|
|
|
86
86
|
exports.i18n = i18n__namespace;
|
|
87
87
|
Object.defineProperty(exports, 'AccessibleHidden', {
|
|
@@ -81,7 +81,7 @@ var text__default = /*#__PURE__*/_interopDefault(text);
|
|
|
81
81
|
var viewSwitcher__default = /*#__PURE__*/_interopDefault(viewSwitcher);
|
|
82
82
|
|
|
83
83
|
// NOTE: This string will be replaced on build time with the package version.
|
|
84
|
-
var version = "18.
|
|
84
|
+
var version = "18.4.0";
|
|
85
85
|
|
|
86
86
|
exports.i18n = i18n__namespace;
|
|
87
87
|
Object.defineProperty(exports, 'AccessibleHidden', {
|
|
@@ -34,6 +34,6 @@ export { useDataTableSortingState, usePaginationState, useRowSelection, useSorti
|
|
|
34
34
|
export { customProperties, designTokens } from '@commercetools-uikit/design-system';
|
|
35
35
|
|
|
36
36
|
// NOTE: This string will be replaced on build time with the package version.
|
|
37
|
-
var version = "18.
|
|
37
|
+
var version = "18.4.0";
|
|
38
38
|
|
|
39
39
|
export { version };
|
|
@@ -0,0 +1,283 @@
|
|
|
1
|
+
/*
|
|
2
|
+
THIS IS AN AUTOGENERATED FILE. DO NOT EDIT THIS FILE DIRECTLY.
|
|
3
|
+
|
|
4
|
+
This file is created by the 'scripts/generate-design-tokens.js' script.
|
|
5
|
+
The variables should be updated in 'materials/internals/definition.yaml'.
|
|
6
|
+
*/
|
|
7
|
+
|
|
8
|
+
:root {
|
|
9
|
+
--color-primary: hsl(175, 55%, 45%);
|
|
10
|
+
--color-primary-10: hsl(240, 66%, 19%);
|
|
11
|
+
--color-primary-20: hsl(175, 55%, 20%);
|
|
12
|
+
--color-primary-25: hsl(175, 55%, 25%);
|
|
13
|
+
--color-primary-30: hsl(175, 55%, 30%);
|
|
14
|
+
--color-primary-40: hsl(175, 55%, 40%);
|
|
15
|
+
--color-primary-85: hsl(175, 70%, 85%);
|
|
16
|
+
--color-primary-90: hsl(175, 70%, 90%);
|
|
17
|
+
--color-primary-95: hsl(175, 90%, 95%);
|
|
18
|
+
--color-accent: #213c45;
|
|
19
|
+
--color-accent-10: hsl(195, 35.2941176471%, 10%);
|
|
20
|
+
--color-accent-20: hsl(195, 35.2941176471%, 20%);
|
|
21
|
+
--color-accent-30: hsl(195, 35.2941176471%, 30%);
|
|
22
|
+
--color-accent-40: hsl(195, 35.2941176471%, 40%);
|
|
23
|
+
--color-accent-50: hsl(195, 35%, 50%);
|
|
24
|
+
--color-accent-60: hsl(195, 35.2941176471%, 60%);
|
|
25
|
+
--color-accent-85: hsl(195, 35%, 85%);
|
|
26
|
+
--color-accent-90: hsl(195, 35.2941176471%, 90%);
|
|
27
|
+
--color-accent-95: hsl(195, 35.2941176471%, 95%);
|
|
28
|
+
--color-accent-98: hsl(195, 35.2941176471%, 98%);
|
|
29
|
+
--color-brown-10: hsl(35, 90%, 10%);
|
|
30
|
+
--color-brown-20: hsl(35, 50%, 20%);
|
|
31
|
+
--color-brown-35: hsl(35, 25%, 35%);
|
|
32
|
+
--color-brown-50: hsl(35, 30%, 50%);
|
|
33
|
+
--color-brown-70: hsl(35, 40%, 70%);
|
|
34
|
+
--color-brown-85: hsl(35, 60%, 85%);
|
|
35
|
+
--color-brown-90: hsl(35, 90%, 90%);
|
|
36
|
+
--color-brown-95: hsl(35, 80%, 95%);
|
|
37
|
+
--color-brown-98: hsl(35, 90%, 98%);
|
|
38
|
+
--color-purple-10: hsl(248, 90%, 10%);
|
|
39
|
+
--color-purple-20: hsl(248, 50%, 20%);
|
|
40
|
+
--color-purple-35: hsl(248, 25%, 35%);
|
|
41
|
+
--color-purple-50: hsl(248, 30%, 50%);
|
|
42
|
+
--color-purple-70: hsl(248, 40%, 70%);
|
|
43
|
+
--color-purple-85: hsl(248, 60%, 85%);
|
|
44
|
+
--color-purple-90: hsl(248, 50%, 90%);
|
|
45
|
+
--color-purple-95: hsl(248, 80%, 95%);
|
|
46
|
+
--color-purple-98: hsl(248, 90%, 98%);
|
|
47
|
+
--color-turquoise-10: hsl(180, 90%, 10%);
|
|
48
|
+
--color-turquoise-20: hsl(180, 50%, 20%);
|
|
49
|
+
--color-turquoise-35: hsl(180, 25%, 35%);
|
|
50
|
+
--color-turquoise-50: hsl(180, 30%, 45%);
|
|
51
|
+
--color-turquoise-70: hsl(180, 40%, 70%);
|
|
52
|
+
--color-turquoise-85: hsl(180, 60%, 85%);
|
|
53
|
+
--color-turquoise-90: hsl(180, 40%, 90%);
|
|
54
|
+
--color-turquoise-95: hsl(180, 80%, 95%);
|
|
55
|
+
--color-turquoise-98: hsl(180, 90%, 98%);
|
|
56
|
+
--color-neutral: hsl(232, 18%, 80%);
|
|
57
|
+
--color-neutral-05: hsl(0deg 0% 80% / 5%);
|
|
58
|
+
--color-neutral-10: hsl(0deg 0% 80% / 10%);
|
|
59
|
+
--color-neutral-40: hsl(232, 18%, 40%);
|
|
60
|
+
--color-neutral-60: hsl(232, 18%, 60%);
|
|
61
|
+
--color-neutral-85: hsl(232, 18%, 85%);
|
|
62
|
+
--color-neutral-90: hsl(232, 18%, 90%);
|
|
63
|
+
--color-neutral-95: hsl(232, 18%, 95%);
|
|
64
|
+
--color-neutral-98: hsl(232, 18%, 98%);
|
|
65
|
+
--color-info: #078cdf;
|
|
66
|
+
--color-info-40: hsl(203.05555555555554, 93.9130434783%, 40%);
|
|
67
|
+
--color-info-85: hsl(203.05555555555554, 93.9130434783%, 85%);
|
|
68
|
+
--color-info-90: #ceebfd;
|
|
69
|
+
--color-info-95: hsl(203.05555555555554, 93.9130434783%, 95%);
|
|
70
|
+
--color-warning: #f16d0e;
|
|
71
|
+
--color-warning-25: hsl(25.110132158590307, 89.0196078431%, 25%);
|
|
72
|
+
--color-warning-40: hsl(25.110132158590307, 89.0196078431%, 40%);
|
|
73
|
+
--color-warning-60: hsl(35, 90%, 55%);
|
|
74
|
+
--color-warning-85: hsl(25.110132158590307, 89.0196078431%, 85%);
|
|
75
|
+
--color-warning-95: hsl(25.110132158590307, 89.0196078431%, 95%);
|
|
76
|
+
--color-error: #e60050;
|
|
77
|
+
--color-error-25: hsl(339.1304347826087, 100%, 25%);
|
|
78
|
+
--color-error-40: hsl(339.1304347826087, 100%, 40%);
|
|
79
|
+
--color-error-85: hsl(339.1304347826087, 100%, 85%);
|
|
80
|
+
--color-error-95: hsl(339.1304347826087, 100%, 95%);
|
|
81
|
+
--color-solid: #1a1a1a;
|
|
82
|
+
--color-solid-02: hsl(0deg 0% 10% / 2%);
|
|
83
|
+
--color-solid-05: hsl(0deg 0% 10% / 5%);
|
|
84
|
+
--color-solid-10: hsl(0deg 0% 10% / 10%);
|
|
85
|
+
--color-surface: #fff;
|
|
86
|
+
--color-transparent: transparent;
|
|
87
|
+
--color-success: hsl(152, 77%, 39%);
|
|
88
|
+
--color-success-25: hsl(155, 84%, 20%);
|
|
89
|
+
--color-success-40: hsl(155, 90%, 24%);
|
|
90
|
+
--color-success-85: hsl(144, 69%, 80%);
|
|
91
|
+
--color-success-95: hsl(141, 76%, 92%);
|
|
92
|
+
--border-radius-1: 1px;
|
|
93
|
+
--border-radius-2: 2px;
|
|
94
|
+
--border-radius-4: 4px;
|
|
95
|
+
--border-radius-6: 6px;
|
|
96
|
+
--border-radius-8: 8px;
|
|
97
|
+
--border-radius-20: 20px;
|
|
98
|
+
--border-width-1: 1px;
|
|
99
|
+
--border-width-2: 2px;
|
|
100
|
+
--font-family: 'Inter', system-ui;
|
|
101
|
+
--font-size-10: 0.75rem;
|
|
102
|
+
--font-size-12: 0.8rem;
|
|
103
|
+
--font-size-20: 0.875rem;
|
|
104
|
+
--font-size-30: 1rem;
|
|
105
|
+
--font-size-40: 1.125rem;
|
|
106
|
+
--font-size-50: 1.25rem;
|
|
107
|
+
--font-size-60: 1.5rem;
|
|
108
|
+
--font-size-70: 2rem;
|
|
109
|
+
--font-size-80: 2.5rem;
|
|
110
|
+
--font-size-90: 3rem;
|
|
111
|
+
--font-size-15: 0.9231rem;
|
|
112
|
+
--font-size-35: 1.0769rem;
|
|
113
|
+
--font-size-45: 1.2308rem;
|
|
114
|
+
--font-size-63: 1.5385rem;
|
|
115
|
+
--font-size-66: 1.8462rem;
|
|
116
|
+
--font-size-69: 2.4615rem;
|
|
117
|
+
--font-size-78: 3rem;
|
|
118
|
+
--font-weight-300: 300;
|
|
119
|
+
--font-weight-400: 400;
|
|
120
|
+
--font-weight-500: 500;
|
|
121
|
+
--font-weight-600: 600;
|
|
122
|
+
--font-weight-700: 700;
|
|
123
|
+
--line-height-05: 1.125rem;
|
|
124
|
+
--line-height-10: 1.25rem;
|
|
125
|
+
--line-height-18: 1.3rem;
|
|
126
|
+
--line-height-20: 1.375rem;
|
|
127
|
+
--line-height-30: 1.5rem;
|
|
128
|
+
--line-height-40: 1.625rem;
|
|
129
|
+
--line-height-50: 1.75rem;
|
|
130
|
+
--line-height-60: 2.125rem;
|
|
131
|
+
--shadow-0: none;
|
|
132
|
+
--shadow-1: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
|
|
133
|
+
--shadow-2: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23);
|
|
134
|
+
--shadow-3: 0 10px 20px rgba(0, 0, 0, 0.19), 0 6px 6px rgba(0, 0, 0, 0.23);
|
|
135
|
+
--shadow-4: 0 14px 28px rgba(0, 0, 0, 0.25), 0 10px 10px rgba(0, 0, 0, 0.22);
|
|
136
|
+
--shadow-5: 0 19px 38px rgba(0, 0, 0, 0.3), 0 15px 12px rgba(0, 0, 0, 0.22);
|
|
137
|
+
--shadow-6: 0 -1px 2px 0 rgba(0, 0, 0, 0.2);
|
|
138
|
+
--shadow-7: 0 -1px 1.5px 0 rgba(0, 0, 0, 0.12),
|
|
139
|
+
0 1px 1px 0 rgba(0, 0, 0, 0.24);
|
|
140
|
+
--shadow-8: 0 1px 9.5px 0 rgba(0, 0, 0, 0.12), 0 2px 4px 0 rgba(0, 0, 0, 0.24);
|
|
141
|
+
--shadow-9: inset 0 -1px 3px 0 rgba(0, 0, 0, 0.1),
|
|
142
|
+
inset 0 1px 1.5px 0 rgba(0, 0, 0, 0.2),
|
|
143
|
+
inset 0 1px 1.5px 0 rgba(0, 0, 0, 0.25);
|
|
144
|
+
--shadow-10: 0 0 0 1px rgba(224, 230, 237, 0.5);
|
|
145
|
+
--shadow-11: 0 1px 0.5px rgba(0, 0, 0, 0.24),
|
|
146
|
+
0 -1px 0.75px rgba(0, 0, 0, 0.12);
|
|
147
|
+
--shadow-12: 0 0 1px rgba(0, 0, 0, 0.25);
|
|
148
|
+
--shadow-13: 0 0 1px rgba(0, 0, 0, 0.25);
|
|
149
|
+
--shadow-14: 0 0 0.5px rgba(0, 0, 0, 0.1);
|
|
150
|
+
--shadow-15: 0 2px 2px rgba(0, 0, 0, 0.24), 0 1px 4.75px rgba(0, 0, 0, 0.12);
|
|
151
|
+
--shadow-16: 0.5px 1.5px 4px 1px rgba(0, 0, 0, 0.25),
|
|
152
|
+
-0.5px -0.5px 4px 1px rgba(0, 0, 0, 0.25);
|
|
153
|
+
--shadow-17: 0 1px 5px 0 rgba(0, 0, 0, 0.05);
|
|
154
|
+
--constraint-scale: 100%;
|
|
155
|
+
--constraint-1: 42px;
|
|
156
|
+
--constraint-2: 84px;
|
|
157
|
+
--constraint-3: 142px;
|
|
158
|
+
--constraint-4: 184px;
|
|
159
|
+
--constraint-5: 242px;
|
|
160
|
+
--constraint-6: 284px;
|
|
161
|
+
--constraint-7: 342px;
|
|
162
|
+
--constraint-8: 384px;
|
|
163
|
+
--constraint-9: 442px;
|
|
164
|
+
--constraint-10: 484px;
|
|
165
|
+
--constraint-11: 542px;
|
|
166
|
+
--constraint-12: 584px;
|
|
167
|
+
--constraint-13: 642px;
|
|
168
|
+
--constraint-14: 684px;
|
|
169
|
+
--constraint-15: 742px;
|
|
170
|
+
--constraint-16: 784px;
|
|
171
|
+
--spacing-xs: 4px;
|
|
172
|
+
--spacing-s: 8px;
|
|
173
|
+
--spacing-m: 16px;
|
|
174
|
+
--spacing-l: 24px;
|
|
175
|
+
--spacing-xl: 32px;
|
|
176
|
+
--spacing-05: 2px;
|
|
177
|
+
--spacing-10: 4px;
|
|
178
|
+
--spacing-20: 8px;
|
|
179
|
+
--spacing-25: 12px;
|
|
180
|
+
--spacing-30: 16px;
|
|
181
|
+
--spacing-40: 24px;
|
|
182
|
+
--spacing-50: 32px;
|
|
183
|
+
--spacing-55: 40px;
|
|
184
|
+
--spacing-60: 48px;
|
|
185
|
+
--spacing-70: 64px;
|
|
186
|
+
--transition-linear-80ms: 80ms linear;
|
|
187
|
+
--transition-easeinout-150ms: 150ms ease-in-out;
|
|
188
|
+
--transition-standard: 200ms ease;
|
|
189
|
+
--break-point-mobile: 768px;
|
|
190
|
+
--break-point-desktop: 1024px;
|
|
191
|
+
--break-point-biggerdesktop: 1280px;
|
|
192
|
+
--break-point-giantdesktop: 1680px;
|
|
193
|
+
--break-point-jumbodesktop: 1920px;
|
|
194
|
+
--background-color-for-button-when-active: hsl(232, 18%, 95%);
|
|
195
|
+
--background-color-for-button-when-hovered: hsl(232, 18%, 98%);
|
|
196
|
+
--background-color-for-button-when-disabled: hsl(195, 35.2941176471%, 95%);
|
|
197
|
+
--background-color-for-input: #fff;
|
|
198
|
+
--background-color-for-input-when-selected: hsl(195, 35.2941176471%, 95%);
|
|
199
|
+
--background-color-for-input-when-disabled: hsl(232, 18%, 95%);
|
|
200
|
+
--background-color-for-input-when-hovered: hsl(232, 18%, 98%);
|
|
201
|
+
--background-color-for-input-when-focused: #fff;
|
|
202
|
+
--background-color-for-input-when-readonly: hsl(232, 18%, 95%);
|
|
203
|
+
--background-color-for-input-when-active: hsl(
|
|
204
|
+
203.05555555555554,
|
|
205
|
+
93.9130434783%,
|
|
206
|
+
95%
|
|
207
|
+
);
|
|
208
|
+
--background-color-for-input-as-quiet: transparent;
|
|
209
|
+
--background-color-for-input-as-quiet-when-hovered: hsl(0deg 0% 10% / 2%);
|
|
210
|
+
--background-color-for-localized-input-label: #fff;
|
|
211
|
+
--background-color-for-localized-input-label-when-readonly: hsl(
|
|
212
|
+
232,
|
|
213
|
+
18%,
|
|
214
|
+
95%
|
|
215
|
+
);
|
|
216
|
+
--background-color-for-localized-input-label-when-disabled: hsl(
|
|
217
|
+
232,
|
|
218
|
+
18%,
|
|
219
|
+
95%
|
|
220
|
+
);
|
|
221
|
+
--background-color-for-button-as-primary: #15a390;
|
|
222
|
+
--background-color-for-button-as-primary-when-hovered: hsl(175, 55%, 45%);
|
|
223
|
+
--background-color-for-button-as-primary-as-default-when-hovered: #17ab97;
|
|
224
|
+
--background-color-for-button-as-primary-as-default-when-active: #15a390;
|
|
225
|
+
--background-color-for-button-as-primary-as-urgent: #f16d0e;
|
|
226
|
+
--background-color-for-stamp-as-primary: hsl(175, 70%, 90%);
|
|
227
|
+
--background-color-for-stamp-as-positive: hsl(175, 70%, 90%);
|
|
228
|
+
--background-color-for-toggle-thumb-when-active: hsl(175, 55%, 25%);
|
|
229
|
+
--background-color-for-toggle-track-when-active: hsl(175, 55%, 40%);
|
|
230
|
+
--background-color-for-toggle-thumb-when-disabled: hsl(232, 18%, 60%);
|
|
231
|
+
--background-color-for-toggle-track-when-disabled: hsl(232, 18%, 90%);
|
|
232
|
+
--background-color-for-loading-spinner-track: #213c45;
|
|
233
|
+
--background-color-for-loading-spinner-dot: #213c45;
|
|
234
|
+
--background-color-for-content-notification-when-success: hsl(175, 90%, 95%);
|
|
235
|
+
--border-color-for-input: hsl(232, 18%, 80%);
|
|
236
|
+
--border-color-for-input-when-focused: hsl(175, 55%, 45%);
|
|
237
|
+
--border-color-for-input-when-disabled: hsl(232, 18%, 80%);
|
|
238
|
+
--border-color-for-input-when-readonly: #fff;
|
|
239
|
+
--border-color-for-input-when-error: #e60050;
|
|
240
|
+
--border-color-for-input-when-warning: #f16d0e;
|
|
241
|
+
--border-color-for-input-when-hovered: hsl(232, 18%, 80%);
|
|
242
|
+
--border-color-for-input-as-quiet: transparent;
|
|
243
|
+
--border-color-for-button-as-secondary: hsl(232, 18%, 80%);
|
|
244
|
+
--border-color-for-content-notification-when-success: hsl(175, 70%, 85%);
|
|
245
|
+
--border-radius-for-button-as-big: 4px;
|
|
246
|
+
--border-radius-for-button-as-medium: 4px;
|
|
247
|
+
--border-radius-for-input: 4px;
|
|
248
|
+
--border-width-for-input: 1px;
|
|
249
|
+
--border-width-for-input-when-warning: 1px;
|
|
250
|
+
--border-width-for-input-when-error: 1px;
|
|
251
|
+
--border-width-for-input-when-focused: 1px;
|
|
252
|
+
--font-color-for-input: #1a1a1a;
|
|
253
|
+
--font-color-for-input-when-disabled: hsl(232, 18%, 60%);
|
|
254
|
+
--font-color-for-input-when-error: #e60050;
|
|
255
|
+
--font-color-for-input-when-readonly: hsl(232, 18%, 40%);
|
|
256
|
+
--font-color-for-input-when-warning: #f16d0e;
|
|
257
|
+
--font-color-for-button-as-secondary: #1a1a1a;
|
|
258
|
+
--font-color-for-button-as-flat-when-hovered: hsl(175, 55%, 45%);
|
|
259
|
+
--font-color-for-button-as-flat-as-critical: #e60050;
|
|
260
|
+
--font-color-for-button-as-flat-as-critical-when-hovered: hsl(
|
|
261
|
+
339.1304347826087,
|
|
262
|
+
100%,
|
|
263
|
+
25%
|
|
264
|
+
);
|
|
265
|
+
--font-color-for-view-switcher-button: hsl(232, 18%, 40%);
|
|
266
|
+
--font-color-for-stamp-as-positive: hsl(175, 55%, 25%);
|
|
267
|
+
--font-color-for-content-notification-when-success: hsl(175, 55%, 45%);
|
|
268
|
+
--height-for-button-as-big: 40px;
|
|
269
|
+
--height-for-button-as-medium: 32px;
|
|
270
|
+
--height-for-button-as-small: 16px;
|
|
271
|
+
--height-for-input: 40px;
|
|
272
|
+
--height-for-input-as-small: 32px;
|
|
273
|
+
--placeholder-font-color-for-input: hsl(232, 18%, 60%);
|
|
274
|
+
--font-size-for-button: 0.875rem;
|
|
275
|
+
--font-size-for-input: 1rem;
|
|
276
|
+
--padding-for-input: 0 var(--spacing-30);
|
|
277
|
+
--padding-for-input-as-quiet: 0 var(--spacing-20);
|
|
278
|
+
--padding-for-button: 0 var(--spacing-30);
|
|
279
|
+
--shadow-for-input: none;
|
|
280
|
+
--shadow-for-input-when-focused: inset 0 0 0 1px var(--color-primary);
|
|
281
|
+
--shadow-for-input-when-error: inset 0 0 0 1px var(--color-error);
|
|
282
|
+
--shadow-for-input-when-warning: inset 0 0 0 1px var(--color-warning);
|
|
283
|
+
}
|
|
@@ -0,0 +1,287 @@
|
|
|
1
|
+
/*
|
|
2
|
+
THIS IS AN AUTOGENERATED FILE. DO NOT EDIT THIS FILE DIRECTLY.
|
|
3
|
+
|
|
4
|
+
This file is created by the 'scripts/generate-design-tokens.js' script.
|
|
5
|
+
The variables should be updated in 'materials/internals/definition.yaml'.
|
|
6
|
+
*/
|
|
7
|
+
|
|
8
|
+
:root {
|
|
9
|
+
--color-primary: hsl(240, 64%, 58%);
|
|
10
|
+
--color-primary-10: hsl(240, 66%, 19%);
|
|
11
|
+
--color-primary-20: hsl(240, 45%, 33%);
|
|
12
|
+
--color-primary-25: hsl(240, 46%, 48%);
|
|
13
|
+
--color-primary-30: hsl(240, 46%, 53%);
|
|
14
|
+
--color-primary-40: hsl(240, 100%, 67%);
|
|
15
|
+
--color-primary-85: hsl(244, 100%, 84%);
|
|
16
|
+
--color-primary-90: hsl(243, 100%, 93%);
|
|
17
|
+
--color-primary-95: hsl(244, 100%, 97%);
|
|
18
|
+
--color-accent: #213c45;
|
|
19
|
+
--color-accent-10: hsl(195, 35.2941176471%, 10%);
|
|
20
|
+
--color-accent-20: hsl(195, 35.2941176471%, 20%);
|
|
21
|
+
--color-accent-30: hsl(195, 35.2941176471%, 30%);
|
|
22
|
+
--color-accent-40: hsl(195, 35.2941176471%, 40%);
|
|
23
|
+
--color-accent-50: hsl(195, 35%, 50%);
|
|
24
|
+
--color-accent-60: hsl(195, 35.2941176471%, 60%);
|
|
25
|
+
--color-accent-85: hsl(195, 35%, 85%);
|
|
26
|
+
--color-accent-90: hsl(195, 35.2941176471%, 90%);
|
|
27
|
+
--color-accent-95: hsl(195, 35.2941176471%, 95%);
|
|
28
|
+
--color-accent-98: hsl(195, 35.2941176471%, 98%);
|
|
29
|
+
--color-brown-10: hsl(35, 90%, 10%);
|
|
30
|
+
--color-brown-20: hsl(35, 50%, 20%);
|
|
31
|
+
--color-brown-35: hsl(35, 25%, 35%);
|
|
32
|
+
--color-brown-50: hsl(35, 30%, 50%);
|
|
33
|
+
--color-brown-70: hsl(35, 40%, 70%);
|
|
34
|
+
--color-brown-85: hsl(35, 60%, 85%);
|
|
35
|
+
--color-brown-90: hsl(35, 90%, 90%);
|
|
36
|
+
--color-brown-95: hsl(35, 80%, 95%);
|
|
37
|
+
--color-brown-98: hsl(35, 90%, 98%);
|
|
38
|
+
--color-purple-10: hsl(248, 90%, 10%);
|
|
39
|
+
--color-purple-20: hsl(248, 50%, 20%);
|
|
40
|
+
--color-purple-35: hsl(248, 25%, 35%);
|
|
41
|
+
--color-purple-50: hsl(248, 30%, 50%);
|
|
42
|
+
--color-purple-70: hsl(248, 40%, 70%);
|
|
43
|
+
--color-purple-85: hsl(248, 60%, 85%);
|
|
44
|
+
--color-purple-90: hsl(248, 50%, 90%);
|
|
45
|
+
--color-purple-95: hsl(248, 80%, 95%);
|
|
46
|
+
--color-purple-98: hsl(248, 90%, 98%);
|
|
47
|
+
--color-turquoise-10: hsl(180, 90%, 10%);
|
|
48
|
+
--color-turquoise-20: hsl(180, 50%, 20%);
|
|
49
|
+
--color-turquoise-35: hsl(180, 25%, 35%);
|
|
50
|
+
--color-turquoise-50: hsl(180, 30%, 45%);
|
|
51
|
+
--color-turquoise-70: hsl(180, 40%, 70%);
|
|
52
|
+
--color-turquoise-85: hsl(180, 60%, 85%);
|
|
53
|
+
--color-turquoise-90: hsl(180, 40%, 90%);
|
|
54
|
+
--color-turquoise-95: hsl(180, 80%, 95%);
|
|
55
|
+
--color-turquoise-98: hsl(180, 90%, 98%);
|
|
56
|
+
--color-neutral: hsl(232, 18%, 80%);
|
|
57
|
+
--color-neutral-05: hsl(0deg 0% 80% / 5%);
|
|
58
|
+
--color-neutral-10: hsl(0deg 0% 80% / 10%);
|
|
59
|
+
--color-neutral-40: hsl(232, 18%, 40%);
|
|
60
|
+
--color-neutral-60: hsl(232, 18%, 60%);
|
|
61
|
+
--color-neutral-85: hsl(232, 18%, 85%);
|
|
62
|
+
--color-neutral-90: hsl(232, 18%, 90%);
|
|
63
|
+
--color-neutral-95: hsl(232, 18%, 95%);
|
|
64
|
+
--color-neutral-98: hsl(232, 18%, 98%);
|
|
65
|
+
--color-info: #078cdf;
|
|
66
|
+
--color-info-40: hsl(203.05555555555554, 93.9130434783%, 40%);
|
|
67
|
+
--color-info-85: hsl(203.05555555555554, 93.9130434783%, 85%);
|
|
68
|
+
--color-info-90: #ceebfd;
|
|
69
|
+
--color-info-95: hsl(203.05555555555554, 93.9130434783%, 95%);
|
|
70
|
+
--color-warning: hsl(35, 90%, 45%);
|
|
71
|
+
--color-warning-25: hsl(33, 83%, 25%);
|
|
72
|
+
--color-warning-40: hsl(33, 80%, 34%);
|
|
73
|
+
--color-warning-60: hsl(35, 90%, 55%);
|
|
74
|
+
--color-warning-85: hsl(33, 90%, 80%);
|
|
75
|
+
--color-warning-95: hsl(45, 100%, 92%);
|
|
76
|
+
--color-error: hsl(3, 65%, 58%);
|
|
77
|
+
--color-error-25: hsl(4, 69%, 37%);
|
|
78
|
+
--color-error-40: hsl(3, 60%, 46%);
|
|
79
|
+
--color-error-85: hsl(1, 55%, 74%);
|
|
80
|
+
--color-error-95: hsl(349, 66%, 92%);
|
|
81
|
+
--color-solid: #1a1a1a;
|
|
82
|
+
--color-solid-02: hsl(0deg 0% 10% / 2%);
|
|
83
|
+
--color-solid-05: hsl(0deg 0% 10% / 5%);
|
|
84
|
+
--color-solid-10: hsl(0deg 0% 10% / 10%);
|
|
85
|
+
--color-surface: #fff;
|
|
86
|
+
--color-transparent: transparent;
|
|
87
|
+
--color-success: hsl(152, 77%, 39%);
|
|
88
|
+
--color-success-25: hsl(155, 84%, 20%);
|
|
89
|
+
--color-success-40: hsl(155, 90%, 24%);
|
|
90
|
+
--color-success-85: hsl(144, 69%, 80%);
|
|
91
|
+
--color-success-95: hsl(141, 76%, 92%);
|
|
92
|
+
--border-radius-1: 1px;
|
|
93
|
+
--border-radius-2: 2px;
|
|
94
|
+
--border-radius-4: 4px;
|
|
95
|
+
--border-radius-6: 6px;
|
|
96
|
+
--border-radius-8: 8px;
|
|
97
|
+
--border-radius-20: 20px;
|
|
98
|
+
--border-width-1: 1px;
|
|
99
|
+
--border-width-2: 2px;
|
|
100
|
+
--font-family: 'Inter', system-ui;
|
|
101
|
+
--font-size-10: 0.75rem;
|
|
102
|
+
--font-size-12: 0.8rem;
|
|
103
|
+
--font-size-20: 0.875rem;
|
|
104
|
+
--font-size-30: 1rem;
|
|
105
|
+
--font-size-40: 1.125rem;
|
|
106
|
+
--font-size-50: 1.25rem;
|
|
107
|
+
--font-size-60: 1.5rem;
|
|
108
|
+
--font-size-70: 2rem;
|
|
109
|
+
--font-size-80: 2.5rem;
|
|
110
|
+
--font-size-90: 3rem;
|
|
111
|
+
--font-size-15: 0.9231rem;
|
|
112
|
+
--font-size-35: 1.0769rem;
|
|
113
|
+
--font-size-45: 1.2308rem;
|
|
114
|
+
--font-size-63: 1.5385rem;
|
|
115
|
+
--font-size-66: 1.8462rem;
|
|
116
|
+
--font-size-69: 2.4615rem;
|
|
117
|
+
--font-size-78: 3rem;
|
|
118
|
+
--font-weight-300: 300;
|
|
119
|
+
--font-weight-400: 400;
|
|
120
|
+
--font-weight-500: 500;
|
|
121
|
+
--font-weight-600: 600;
|
|
122
|
+
--font-weight-700: 700;
|
|
123
|
+
--line-height-05: 1.125rem;
|
|
124
|
+
--line-height-10: 1.25rem;
|
|
125
|
+
--line-height-18: 1.3rem;
|
|
126
|
+
--line-height-20: 1.375rem;
|
|
127
|
+
--line-height-30: 1.5rem;
|
|
128
|
+
--line-height-40: 1.625rem;
|
|
129
|
+
--line-height-50: 1.75rem;
|
|
130
|
+
--line-height-60: 2.125rem;
|
|
131
|
+
--shadow-0: none;
|
|
132
|
+
--shadow-1: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
|
|
133
|
+
--shadow-2: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23);
|
|
134
|
+
--shadow-3: 0 10px 20px rgba(0, 0, 0, 0.19), 0 6px 6px rgba(0, 0, 0, 0.23);
|
|
135
|
+
--shadow-4: 0 14px 28px rgba(0, 0, 0, 0.25), 0 10px 10px rgba(0, 0, 0, 0.22);
|
|
136
|
+
--shadow-5: 0 19px 38px rgba(0, 0, 0, 0.3), 0 15px 12px rgba(0, 0, 0, 0.22);
|
|
137
|
+
--shadow-6: 0 -1px 2px 0 rgba(0, 0, 0, 0.2);
|
|
138
|
+
--shadow-7: 0 -1px 1.5px 0 rgba(0, 0, 0, 0.12),
|
|
139
|
+
0 1px 1px 0 rgba(0, 0, 0, 0.24);
|
|
140
|
+
--shadow-8: 0 1px 9.5px 0 rgba(0, 0, 0, 0.12), 0 2px 4px 0 rgba(0, 0, 0, 0.24);
|
|
141
|
+
--shadow-9: inset 0 -1px 3px 0 rgba(0, 0, 0, 0.1),
|
|
142
|
+
inset 0 1px 1.5px 0 rgba(0, 0, 0, 0.2),
|
|
143
|
+
inset 0 1px 1.5px 0 rgba(0, 0, 0, 0.25);
|
|
144
|
+
--shadow-10: 0 0 0 1px rgba(224, 230, 237, 0.5);
|
|
145
|
+
--shadow-11: 0 1px 0.5px rgba(0, 0, 0, 0.24),
|
|
146
|
+
0 -1px 0.75px rgba(0, 0, 0, 0.12);
|
|
147
|
+
--shadow-12: 0 0 1px rgba(0, 0, 0, 0.25);
|
|
148
|
+
--shadow-13: 0 0 1px rgba(0, 0, 0, 0.25);
|
|
149
|
+
--shadow-14: 0 0 0.5px rgba(0, 0, 0, 0.1);
|
|
150
|
+
--shadow-15: 0 2px 2px rgba(0, 0, 0, 0.24), 0 1px 4.75px rgba(0, 0, 0, 0.12);
|
|
151
|
+
--shadow-16: 0.5px 1.5px 4px 1px rgba(0, 0, 0, 0.25),
|
|
152
|
+
-0.5px -0.5px 4px 1px rgba(0, 0, 0, 0.25);
|
|
153
|
+
--shadow-17: 0 1px 5px 0 rgba(0, 0, 0, 0.05);
|
|
154
|
+
--constraint-scale: 100%;
|
|
155
|
+
--constraint-1: 42px;
|
|
156
|
+
--constraint-2: 84px;
|
|
157
|
+
--constraint-3: 142px;
|
|
158
|
+
--constraint-4: 184px;
|
|
159
|
+
--constraint-5: 242px;
|
|
160
|
+
--constraint-6: 284px;
|
|
161
|
+
--constraint-7: 342px;
|
|
162
|
+
--constraint-8: 384px;
|
|
163
|
+
--constraint-9: 442px;
|
|
164
|
+
--constraint-10: 484px;
|
|
165
|
+
--constraint-11: 542px;
|
|
166
|
+
--constraint-12: 584px;
|
|
167
|
+
--constraint-13: 642px;
|
|
168
|
+
--constraint-14: 684px;
|
|
169
|
+
--constraint-15: 742px;
|
|
170
|
+
--constraint-16: 784px;
|
|
171
|
+
--spacing-xs: 4px;
|
|
172
|
+
--spacing-s: 8px;
|
|
173
|
+
--spacing-m: 16px;
|
|
174
|
+
--spacing-l: 24px;
|
|
175
|
+
--spacing-xl: 32px;
|
|
176
|
+
--spacing-05: 2px;
|
|
177
|
+
--spacing-10: 4px;
|
|
178
|
+
--spacing-20: 8px;
|
|
179
|
+
--spacing-25: 12px;
|
|
180
|
+
--spacing-30: 16px;
|
|
181
|
+
--spacing-40: 24px;
|
|
182
|
+
--spacing-50: 32px;
|
|
183
|
+
--spacing-55: 40px;
|
|
184
|
+
--spacing-60: 48px;
|
|
185
|
+
--spacing-70: 64px;
|
|
186
|
+
--transition-linear-80ms: 80ms linear;
|
|
187
|
+
--transition-easeinout-150ms: 150ms ease-in-out;
|
|
188
|
+
--transition-standard: 200ms ease;
|
|
189
|
+
--break-point-mobile: 768px;
|
|
190
|
+
--break-point-desktop: 1024px;
|
|
191
|
+
--break-point-biggerdesktop: 1280px;
|
|
192
|
+
--break-point-giantdesktop: 1680px;
|
|
193
|
+
--break-point-jumbodesktop: 1920px;
|
|
194
|
+
--background-color-for-button-when-active: hsl(243, 100%, 93%);
|
|
195
|
+
--background-color-for-button-when-hovered: hsl(244, 100%, 97%);
|
|
196
|
+
--background-color-for-button-when-disabled: hsl(195, 35.2941176471%, 95%);
|
|
197
|
+
--background-color-for-input: #fff;
|
|
198
|
+
--background-color-for-input-when-selected: hsl(244, 100%, 97%);
|
|
199
|
+
--background-color-for-input-when-disabled: hsl(232, 18%, 95%);
|
|
200
|
+
--background-color-for-input-when-hovered: hsl(232, 18%, 98%);
|
|
201
|
+
--background-color-for-input-when-focused: #fff;
|
|
202
|
+
--background-color-for-input-when-readonly: hsl(232, 18%, 95%);
|
|
203
|
+
--background-color-for-input-when-active: hsl(
|
|
204
|
+
203.05555555555554,
|
|
205
|
+
93.9130434783%,
|
|
206
|
+
95%
|
|
207
|
+
);
|
|
208
|
+
--background-color-for-input-as-quiet: transparent;
|
|
209
|
+
--background-color-for-input-as-quiet-when-hovered: hsl(0deg 0% 10% / 2%);
|
|
210
|
+
--background-color-for-localized-input-label: #fff;
|
|
211
|
+
--background-color-for-localized-input-label-when-readonly: hsl(
|
|
212
|
+
232,
|
|
213
|
+
18%,
|
|
214
|
+
95%
|
|
215
|
+
);
|
|
216
|
+
--background-color-for-localized-input-label-when-disabled: hsl(
|
|
217
|
+
232,
|
|
218
|
+
18%,
|
|
219
|
+
95%
|
|
220
|
+
);
|
|
221
|
+
--background-color-for-button-as-primary: hsl(240, 64%, 58%);
|
|
222
|
+
--background-color-for-button-as-primary-when-hovered: hsl(240, 100%, 67%);
|
|
223
|
+
--background-color-for-button-as-primary-as-default-when-hovered: hsl(
|
|
224
|
+
240,
|
|
225
|
+
100%,
|
|
226
|
+
67%
|
|
227
|
+
);
|
|
228
|
+
--background-color-for-button-as-primary-as-default-when-active: hsl(
|
|
229
|
+
240,
|
|
230
|
+
46%,
|
|
231
|
+
48%
|
|
232
|
+
);
|
|
233
|
+
--background-color-for-button-as-primary-as-urgent: hsl(35, 90%, 55%);
|
|
234
|
+
--background-color-for-stamp-as-primary: hsl(244, 100%, 97%);
|
|
235
|
+
--background-color-for-stamp-as-positive: hsl(141, 76%, 92%);
|
|
236
|
+
--background-color-for-toggle-thumb-when-active: hsl(240, 100%, 67%);
|
|
237
|
+
--background-color-for-toggle-track-when-active: hsl(244, 100%, 84%);
|
|
238
|
+
--background-color-for-toggle-thumb-when-disabled: hsl(244, 100%, 84%);
|
|
239
|
+
--background-color-for-toggle-track-when-disabled: hsl(243, 100%, 93%);
|
|
240
|
+
--background-color-for-loading-spinner-track: hsl(243, 100%, 93%);
|
|
241
|
+
--background-color-for-loading-spinner-dot: hsl(240, 64%, 58%);
|
|
242
|
+
--background-color-for-content-notification-when-success: hsl(141, 76%, 92%);
|
|
243
|
+
--border-color-for-input: hsl(232, 18%, 80%);
|
|
244
|
+
--border-color-for-input-when-focused: hsl(240, 100%, 67%);
|
|
245
|
+
--border-color-for-input-when-disabled: hsl(232, 18%, 80%);
|
|
246
|
+
--border-color-for-input-when-readonly: #fff;
|
|
247
|
+
--border-color-for-input-when-error: #e60050;
|
|
248
|
+
--border-color-for-input-when-warning: #f16d0e;
|
|
249
|
+
--border-color-for-input-when-hovered: hsl(232, 18%, 80%);
|
|
250
|
+
--border-color-for-input-as-quiet: transparent;
|
|
251
|
+
--border-color-for-button-as-secondary: hsl(244, 100%, 84%);
|
|
252
|
+
--border-color-for-content-notification-when-success: hsl(144, 69%, 80%);
|
|
253
|
+
--border-radius-for-button-as-big: 4px;
|
|
254
|
+
--border-radius-for-button-as-medium: 4px;
|
|
255
|
+
--border-radius-for-input: 4px;
|
|
256
|
+
--border-width-for-input: 1px;
|
|
257
|
+
--border-width-for-input-when-warning: 1px;
|
|
258
|
+
--border-width-for-input-when-error: 1px;
|
|
259
|
+
--border-width-for-input-when-focused: 1px;
|
|
260
|
+
--font-color-for-input: #1a1a1a;
|
|
261
|
+
--font-color-for-input-when-disabled: hsl(232, 18%, 60%);
|
|
262
|
+
--font-color-for-input-when-error: hsl(3, 60%, 46%);
|
|
263
|
+
--font-color-for-input-when-readonly: hsl(232, 18%, 40%);
|
|
264
|
+
--font-color-for-input-when-warning: #f16d0e;
|
|
265
|
+
--font-color-for-button-as-secondary: hsl(240, 64%, 58%);
|
|
266
|
+
--font-color-for-button-as-flat-when-hovered: hsl(240, 100%, 67%);
|
|
267
|
+
--font-color-for-button-as-flat-as-critical: hsl(3, 60%, 46%);
|
|
268
|
+
--font-color-for-button-as-flat-as-critical-when-hovered: hsl(3, 65%, 58%);
|
|
269
|
+
--font-color-for-view-switcher-button: hsl(240, 64%, 58%);
|
|
270
|
+
--font-color-for-stamp-as-positive: hsl(155, 90%, 24%);
|
|
271
|
+
--font-color-for-content-notification-when-success: hsl(152, 77%, 39%);
|
|
272
|
+
--height-for-button-as-big: 40px;
|
|
273
|
+
--height-for-button-as-medium: 32px;
|
|
274
|
+
--height-for-button-as-small: 16px;
|
|
275
|
+
--height-for-input: 40px;
|
|
276
|
+
--height-for-input-as-small: 32px;
|
|
277
|
+
--placeholder-font-color-for-input: hsl(232, 18%, 60%);
|
|
278
|
+
--font-size-for-button: 0.875rem;
|
|
279
|
+
--font-size-for-input: 1rem;
|
|
280
|
+
--padding-for-input: 0 var(--spacing-30);
|
|
281
|
+
--padding-for-input-as-quiet: 0 var(--spacing-20);
|
|
282
|
+
--padding-for-button: 0 var(--spacing-30);
|
|
283
|
+
--shadow-for-input: none;
|
|
284
|
+
--shadow-for-input-when-focused: inset 0 0 0 1px var(--color-primary);
|
|
285
|
+
--shadow-for-input-when-error: inset 0 0 0 1px var(--color-error);
|
|
286
|
+
--shadow-for-input-when-warning: inset 0 0 0 1px var(--color-warning);
|
|
287
|
+
}
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@commercetools-frontend/ui-kit",
|
|
3
3
|
"description": "A preset of all the UI-Kit components.",
|
|
4
|
-
"version": "18.
|
|
4
|
+
"version": "18.4.0",
|
|
5
5
|
"bugs": "https://github.com/commercetools/ui-kit/issues",
|
|
6
6
|
"repository": {
|
|
7
7
|
"type": "git",
|
|
@@ -24,41 +24,41 @@
|
|
|
24
24
|
"dependencies": {
|
|
25
25
|
"@babel/runtime": "^7.20.13",
|
|
26
26
|
"@babel/runtime-corejs3": "^7.20.13",
|
|
27
|
-
"@commercetools-uikit/accessible-hidden": "18.
|
|
28
|
-
"@commercetools-uikit/avatar": "18.
|
|
29
|
-
"@commercetools-uikit/buttons": "18.
|
|
30
|
-
"@commercetools-uikit/card": "18.
|
|
31
|
-
"@commercetools-uikit/collapsible": "18.
|
|
32
|
-
"@commercetools-uikit/collapsible-motion": "18.
|
|
33
|
-
"@commercetools-uikit/collapsible-panel": "18.
|
|
34
|
-
"@commercetools-uikit/constraints": "18.
|
|
35
|
-
"@commercetools-uikit/data-table": "18.
|
|
36
|
-
"@commercetools-uikit/data-table-manager": "18.
|
|
37
|
-
"@commercetools-uikit/design-system": "18.
|
|
38
|
-
"@commercetools-uikit/field-errors": "18.
|
|
39
|
-
"@commercetools-uikit/field-label": "18.
|
|
40
|
-
"@commercetools-uikit/fields": "18.
|
|
41
|
-
"@commercetools-uikit/grid": "18.
|
|
42
|
-
"@commercetools-uikit/hooks": "18.
|
|
43
|
-
"@commercetools-uikit/i18n": "18.
|
|
44
|
-
"@commercetools-uikit/icons": "18.
|
|
45
|
-
"@commercetools-uikit/inputs": "18.
|
|
46
|
-
"@commercetools-uikit/label": "18.
|
|
47
|
-
"@commercetools-uikit/link": "18.
|
|
48
|
-
"@commercetools-uikit/loading-spinner": "18.
|
|
49
|
-
"@commercetools-uikit/messages": "18.
|
|
50
|
-
"@commercetools-uikit/notifications": "18.
|
|
51
|
-
"@commercetools-uikit/pagination": "18.
|
|
52
|
-
"@commercetools-uikit/primary-action-dropdown": "18.
|
|
53
|
-
"@commercetools-uikit/progress-bar": "18.
|
|
54
|
-
"@commercetools-uikit/selectable-search-input": "18.
|
|
55
|
-
"@commercetools-uikit/spacings": "18.
|
|
56
|
-
"@commercetools-uikit/stamp": "18.
|
|
57
|
-
"@commercetools-uikit/tag": "18.
|
|
58
|
-
"@commercetools-uikit/text": "18.
|
|
59
|
-
"@commercetools-uikit/tooltip": "18.
|
|
60
|
-
"@commercetools-uikit/utils": "18.
|
|
61
|
-
"@commercetools-uikit/view-switcher": "18.
|
|
27
|
+
"@commercetools-uikit/accessible-hidden": "18.4.0",
|
|
28
|
+
"@commercetools-uikit/avatar": "18.4.0",
|
|
29
|
+
"@commercetools-uikit/buttons": "18.4.0",
|
|
30
|
+
"@commercetools-uikit/card": "18.4.0",
|
|
31
|
+
"@commercetools-uikit/collapsible": "18.4.0",
|
|
32
|
+
"@commercetools-uikit/collapsible-motion": "18.4.0",
|
|
33
|
+
"@commercetools-uikit/collapsible-panel": "18.4.0",
|
|
34
|
+
"@commercetools-uikit/constraints": "18.4.0",
|
|
35
|
+
"@commercetools-uikit/data-table": "18.4.0",
|
|
36
|
+
"@commercetools-uikit/data-table-manager": "18.4.0",
|
|
37
|
+
"@commercetools-uikit/design-system": "18.4.0",
|
|
38
|
+
"@commercetools-uikit/field-errors": "18.4.0",
|
|
39
|
+
"@commercetools-uikit/field-label": "18.4.0",
|
|
40
|
+
"@commercetools-uikit/fields": "18.4.0",
|
|
41
|
+
"@commercetools-uikit/grid": "18.4.0",
|
|
42
|
+
"@commercetools-uikit/hooks": "18.4.0",
|
|
43
|
+
"@commercetools-uikit/i18n": "18.4.0",
|
|
44
|
+
"@commercetools-uikit/icons": "18.4.0",
|
|
45
|
+
"@commercetools-uikit/inputs": "18.4.0",
|
|
46
|
+
"@commercetools-uikit/label": "18.4.0",
|
|
47
|
+
"@commercetools-uikit/link": "18.4.0",
|
|
48
|
+
"@commercetools-uikit/loading-spinner": "18.4.0",
|
|
49
|
+
"@commercetools-uikit/messages": "18.4.0",
|
|
50
|
+
"@commercetools-uikit/notifications": "18.4.0",
|
|
51
|
+
"@commercetools-uikit/pagination": "18.4.0",
|
|
52
|
+
"@commercetools-uikit/primary-action-dropdown": "18.4.0",
|
|
53
|
+
"@commercetools-uikit/progress-bar": "18.4.0",
|
|
54
|
+
"@commercetools-uikit/selectable-search-input": "18.4.0",
|
|
55
|
+
"@commercetools-uikit/spacings": "18.4.0",
|
|
56
|
+
"@commercetools-uikit/stamp": "18.4.0",
|
|
57
|
+
"@commercetools-uikit/tag": "18.4.0",
|
|
58
|
+
"@commercetools-uikit/text": "18.4.0",
|
|
59
|
+
"@commercetools-uikit/tooltip": "18.4.0",
|
|
60
|
+
"@commercetools-uikit/utils": "18.4.0",
|
|
61
|
+
"@commercetools-uikit/view-switcher": "18.4.0"
|
|
62
62
|
},
|
|
63
63
|
"devDependencies": {
|
|
64
64
|
"moment": "2.30.1",
|