@commercetools-frontend/experimental-components 5.0.3 → 5.2.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.
Files changed (5) hide show
  1. package/dist/commercetools-frontend-experimental-components.cjs.dev.js +877 -554
  2. package/dist/commercetools-frontend-experimental-components.cjs.prod.js +871 -554
  3. package/dist/commercetools-frontend-experimental-components.esm.js +871 -550
  4. package/dist/styles.css +116 -116
  5. package/package.json +19 -19
package/dist/styles.css CHANGED
@@ -1,85 +1,3 @@
1
- /* imported from required-indicator.module.css */
2
-
3
- .required-indicator-module__colored____YUFm {
4
- color: var(--color-warning);
5
- }
6
-
7
- .required-indicator-module__indicatorAsterisk___3lEdX {
8
- font-style: normal;
9
- margin-left: 2px;
10
- }
11
- /* imported from throttled-field.module.css */
12
-
13
- .throttled-field-module__size___324jx {
14
- width: 100%;
15
- }
16
-
17
- .throttled-field-module__size___324jx {
18
- min-height: var(--height-for-input);
19
- }
20
-
21
- .throttled-field-module__input-text___3zFFp {
22
- transition: 0.2s ease;
23
- border-radius: 6px;
24
- border-style: solid;
25
- border-width: 1px;
26
- color: var(--color-solid);
27
- font-weight: 500;
28
- font-size: 1rem;
29
- font-family: 'Open Sans', sans-serif !important;
30
- padding: 7.5px 10px;
31
- outline: none;
32
- box-shadow: none;
33
- appearance: none;
34
- }
35
-
36
- .throttled-field-module__input-secondary___cFo9e {
37
- background-color: var(--color-neutral-95);
38
- border-color: var(--color-surface);
39
- width: 100%;
40
- }
41
-
42
- .throttled-field-module__input-primary___26G3R {
43
- border-color: var(--color-neutral);
44
- background-color: var(--color-surface);
45
- }
46
-
47
- .throttled-field-module__textarea___3ZNEs {
48
- width: 100%;
49
- min-height: 36px;
50
- resize: vertical;
51
- }
52
-
53
- .throttled-field-module__textarea-primary___24Wwt {
54
- border-color: var(--color-neutral);
55
- background-color: var(--color-surface);
56
- }
57
-
58
- .throttled-field-module__textarea-secondary___2rmFG {
59
- background-color: var(--color-neutral-95);
60
- border-color: var(--color-surface);
61
- width: 100%;
62
- }
63
-
64
- .throttled-field-module__invalid___1yZLW {
65
- /* this needs !important because react-select has a :focus style that
66
- stops the border colour being set unless the element is blurred */
67
- border-color: var(--color-error) !important;
68
- border: 1px solid;
69
- }
70
-
71
- .throttled-field-module__disabled___qVj79 {
72
- cursor: not-allowed;
73
- background-color: var(--color-accent-98);
74
- color: var(--color-solid);
75
- opacity: 1; /* fix for mobile safari */
76
- }
77
-
78
- .throttled-field-module__granular___2LXJf {
79
- border-top-left-radius: 0;
80
- border-bottom-left-radius: 0;
81
- margin-left: 0;
82
- }
83
1
  /* imported from search-input.module.css */
84
2
 
85
3
  .search-input-module__block___1uM-y {
@@ -170,6 +88,16 @@
170
88
  flex-shrink: 1;
171
89
  margin-left: var(--spacing-s);
172
90
  }
91
+ /* imported from required-indicator.module.css */
92
+
93
+ .required-indicator-module__colored____YUFm {
94
+ color: var(--color-warning);
95
+ }
96
+
97
+ .required-indicator-module__indicatorAsterisk___3lEdX {
98
+ font-style: normal;
99
+ margin-left: 2px;
100
+ }
173
101
  /* imported from selectable-field-search-input.module.css */
174
102
 
175
103
  .selectable-field-search-input-module__container___z2ltR {
@@ -261,41 +189,77 @@
261
189
  .numeric-format-input-module__disabled___hb6h4 {
262
190
  cursor: not-allowed;
263
191
  }
264
- /* imported from file-input.module.css */
192
+ /* imported from throttled-field.module.css */
265
193
 
266
- /** Button */
194
+ .throttled-field-module__size___324jx {
195
+ width: 100%;
196
+ }
267
197
 
268
- .file-input-module__button___2KypN {
269
- display: inline-flex;
270
- background-color: var(--color-surface);
271
- border: var(--border-for-button-as-secondary);
272
- box-shadow: none;
273
- border-radius: var(--border-radius-4);
274
- color: var(--color-solid);
275
- height: var(--height-for-button-as-big);
276
- font-size: var(--font-size-20);
277
- font-weight: var(--font-weight-500);
278
- align-items: center;
279
- transition: background-color var(--transition-linear-80ms);
280
- padding: 0 var(--spacing-m);
198
+ .throttled-field-module__size___324jx {
199
+ min-height: var(--height-for-input);
281
200
  }
282
201
 
283
- .file-input-module__button___2KypN:hover,
284
- .file-input-module__button___2KypN:focus {
285
- cursor: pointer;
286
- background-color: var(--background-color-for-button-when-hovered);
202
+ .throttled-field-module__input-text___3zFFp {
203
+ transition: 0.2s ease;
204
+ border-radius: 6px;
205
+ border-style: solid;
206
+ border-width: 1px;
207
+ color: var(--color-solid);
208
+ font-weight: 500;
209
+ font-size: 1rem;
210
+ font-family: 'Open Sans', sans-serif !important;
211
+ padding: 7.5px 10px;
212
+ outline: none;
287
213
  box-shadow: none;
214
+ appearance: none;
288
215
  }
289
216
 
290
- .file-input-module__button___2KypN:active {
291
- box-shadow: var(--shadow-9);
217
+ .throttled-field-module__input-secondary___cFo9e {
218
+ background-color: var(--color-neutral-95);
219
+ border-color: var(--color-surface);
220
+ width: 100%;
221
+ }
222
+
223
+ .throttled-field-module__input-primary___26G3R {
224
+ border-color: var(--color-neutral);
292
225
  background-color: var(--color-surface);
293
226
  }
294
227
 
295
- .file-input-module__input___3MP4D {
296
- visibility: hidden;
297
- width: 1px;
298
- height: 1px;
228
+ .throttled-field-module__textarea___3ZNEs {
229
+ width: 100%;
230
+ min-height: 36px;
231
+ resize: vertical;
232
+ }
233
+
234
+ .throttled-field-module__textarea-primary___24Wwt {
235
+ border-color: var(--color-neutral);
236
+ background-color: var(--color-surface);
237
+ }
238
+
239
+ .throttled-field-module__textarea-secondary___2rmFG {
240
+ background-color: var(--color-neutral-95);
241
+ border-color: var(--color-surface);
242
+ width: 100%;
243
+ }
244
+
245
+ .throttled-field-module__invalid___1yZLW {
246
+ /* this needs !important because react-select has a :focus style that
247
+ stops the border colour being set unless the element is blurred */
248
+ border-color: var(--color-error) !important;
249
+ border: 1px solid;
250
+ }
251
+
252
+ .throttled-field-module__disabled___qVj79 {
253
+ cursor: not-allowed;
254
+ background-color: var(--color-accent-98);
255
+ color: var(--color-solid);
256
+ opacity: 1; /* fix for mobile safari */
257
+ }
258
+
259
+ .throttled-field-module__granular___2LXJf {
260
+ border-top-left-radius: 0;
261
+ border-bottom-left-radius: 0;
262
+ margin-left: 0;
299
263
  }
300
264
  /* imported from button.module.css */
301
265
 
@@ -500,6 +464,51 @@
500
464
  .button-module__add-button___1f093 {
501
465
  min-height: 32px;
502
466
  }
467
+ /* imported from file-input.module.css */
468
+
469
+ /** Button */
470
+
471
+ .file-input-module__button___2KypN {
472
+ display: inline-flex;
473
+ background-color: var(--color-surface);
474
+ border: var(--border-for-button-as-secondary);
475
+ box-shadow: none;
476
+ border-radius: var(--border-radius-4);
477
+ color: var(--color-solid);
478
+ height: var(--height-for-button-as-big);
479
+ font-size: var(--font-size-20);
480
+ font-weight: var(--font-weight-500);
481
+ align-items: center;
482
+ transition: background-color var(--transition-linear-80ms);
483
+ padding: 0 var(--spacing-m);
484
+ }
485
+
486
+ .file-input-module__button___2KypN:hover,
487
+ .file-input-module__button___2KypN:focus {
488
+ cursor: pointer;
489
+ background-color: var(--background-color-for-button-when-hovered);
490
+ box-shadow: none;
491
+ }
492
+
493
+ .file-input-module__button___2KypN:active {
494
+ box-shadow: var(--shadow-9);
495
+ background-color: var(--color-surface);
496
+ }
497
+
498
+ .file-input-module__input___3MP4D {
499
+ visibility: hidden;
500
+ width: 1px;
501
+ height: 1px;
502
+ }
503
+ /* imported from centered-loading-spinner.module.css */
504
+
505
+ .centered-loading-spinner-module__loading-container___3_9-h {
506
+ height: 100%;
507
+ display: flex;
508
+ flex-grow: 1;
509
+ align-items: center;
510
+ justify-content: center;
511
+ }
503
512
  /* imported from divider.module.css */
504
513
 
505
514
  .divider-module__divider___4-vdy {
@@ -518,15 +527,6 @@
518
527
  .divider-module__divider-dashed___2Em8A {
519
528
  border-style: dashed;
520
529
  }
521
- /* imported from centered-loading-spinner.module.css */
522
-
523
- .centered-loading-spinner-module__loading-container___3_9-h {
524
- height: 100%;
525
- display: flex;
526
- flex-grow: 1;
527
- align-items: center;
528
- justify-content: center;
529
- }
530
530
  /* imported from reference-search.module.css */
531
531
 
532
532
  .reference-search-module__container___3-iK3 {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@commercetools-frontend/experimental-components",
3
- "version": "5.0.3",
3
+ "version": "5.2.0",
4
4
  "description": "",
5
5
  "main": "dist/commercetools-frontend-experimental-components.cjs.js",
6
6
  "module": "dist/commercetools-frontend-experimental-components.esm.js",
@@ -13,18 +13,18 @@
13
13
  "@babel/core": "^7.21.0",
14
14
  "@babel/runtime-corejs3": "^7.21.0",
15
15
  "@babel/runtime": "^7.21.0",
16
- "@commercetools-frontend/actions-global": "^22.3.0",
17
- "@commercetools-frontend/application-components": "^22.3.0",
18
- "@commercetools-frontend/application-shell-connectors": "^22.3.0",
19
- "@commercetools-frontend/application-shell": "^22.3.0",
20
- "@commercetools-frontend/constants": "^22.3.0",
21
- "@commercetools-frontend/l10n": "^22.3.0",
22
- "@commercetools-frontend/sdk": "^22.3.0",
23
- "@commercetools-frontend/sentry": "^22.3.0",
24
- "@commercetools-frontend/ui-kit": "^16.0.0",
25
- "@commercetools-uikit/design-system": "^16.0.0",
26
- "@commercetools-uikit/select-utils": "^16.0.0",
27
- "@commercetools-uikit/utils": "^16.0.0",
16
+ "@commercetools-frontend/actions-global": "^22.5.0",
17
+ "@commercetools-frontend/application-components": "^22.5.0",
18
+ "@commercetools-frontend/application-shell-connectors": "^22.5.0",
19
+ "@commercetools-frontend/application-shell": "^22.5.0",
20
+ "@commercetools-frontend/constants": "^22.5.0",
21
+ "@commercetools-frontend/l10n": "^22.5.0",
22
+ "@commercetools-frontend/sdk": "^22.5.0",
23
+ "@commercetools-frontend/sentry": "^22.5.0",
24
+ "@commercetools-frontend/ui-kit": "^16.5.0",
25
+ "@commercetools-uikit/design-system": "^16.5.0",
26
+ "@commercetools-uikit/select-utils": "^16.5.0",
27
+ "@commercetools-uikit/utils": "^16.5.0",
28
28
  "@emotion/react": "^11.10.6",
29
29
  "classnames": "2.3.2",
30
30
  "cleave.js": "1.5.10",
@@ -38,9 +38,9 @@
38
38
  "moment-timezone": "0.5.43",
39
39
  "moment": "2.29.4",
40
40
  "omit-deep": "0.3.0",
41
- "omit-empty-es": "1.1.3",
41
+ "omit-empty-es": "1.2.0",
42
42
  "prop-types": "^15.8.1",
43
- "react-textarea-autosize": "8.4.1",
43
+ "react-textarea-autosize": "8.5.2",
44
44
  "reselect": "4.1.8",
45
45
  "tiny-invariant": "1.3.1",
46
46
  "tiny-warning": "1.0.3",
@@ -49,8 +49,8 @@
49
49
  },
50
50
  "devDependencies": {
51
51
  "@apollo/client": "^3.7.10",
52
- "@commercetools-test-data/channel": "^4.11.1",
53
- "@commercetools-test-data/commons": "^4.11.1",
52
+ "@commercetools-test-data/channel": "^5.0.0",
53
+ "@commercetools-test-data/commons": "^5.0.0",
54
54
  "@commercetools-test-data/core": "^4.11.1",
55
55
  "@testing-library/react-hooks": "^8.0.1",
56
56
  "@testing-library/react": "^12.1.5",
@@ -68,8 +68,8 @@
68
68
  "redux": "^4.2.1",
69
69
  "typescript": "^5.1.3",
70
70
  "xhr-mock": "^2.5.1",
71
- "@commercetools-local/test-data": "1.1.0",
72
- "@commercetools-local/test-utils": "1.1.0"
71
+ "@commercetools-local/test-data": "1.1.2",
72
+ "@commercetools-local/test-utils": "1.1.2"
73
73
  },
74
74
  "peerDependencies": {
75
75
  "@apollo/client": "3.x",