@rescui/chip-list 0.11.1 → 0.11.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.
Files changed (10) hide show
  1. package/lib/chip-list-multi.js +21 -50
  2. package/lib/chip-list.js +19 -43
  3. package/lib/index.css +54 -85
  4. package/lib/parts/chip-list-base.js +30 -35
  5. package/lib/parts/chip-list-context.js +3 -5
  6. package/lib/parts/chip-list.p.module.css.js +23 -23
  7. package/lib/parts/chip.js +46 -60
  8. package/lib/parts/deep-map.js +4 -7
  9. package/lib/parts/use-items-ids.js +25 -29
  10. package/package.json +7 -8
package/lib/chip-list-multi.js CHANGED
@@ -1,68 +1,39 @@
1
- import "core-js/modules/es.object.to-string.js";
2
- import "core-js/modules/web.dom-collections.for-each.js";
3
- import _Object$keys from "@babel/runtime-corejs3/core-js-stable/object/keys";
4
- import _Object$getOwnPropertySymbols from "@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols";
5
- import _Object$getOwnPropertyDescriptor from "@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor";
6
- import _Object$getOwnPropertyDescriptors from "@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptors";
7
- import _toConsumableArray from "@babel/runtime-corejs3/helpers/esm/toConsumableArray";
8
- import _defineProperty from "@babel/runtime-corejs3/helpers/esm/defineProperty";
9
- import _objectWithoutProperties from "@babel/runtime-corejs3/helpers/esm/objectWithoutProperties";
10
- var _excluded = ["onChange", "compareValues", "value", "children", "size", "sparse", "compact", "disabled", "mode", "alignItems"];
11
-
12
- 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; }
13
-
14
- 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) { _defineProperty(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; }
15
-
16
1
  import _includesInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/includes";
17
- import _filterInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/filter";
18
- import _concatInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/concat";
19
2
  import React from 'react';
20
3
  import PropTypes from 'prop-types';
21
4
  import { ChipListBase } from './parts/chip-list-base.js';
22
5
 
23
- var compareValuesDefault = function compareValuesDefault(activeValues, value) {
24
- return Array.isArray(activeValues) && _includesInstanceProperty(activeValues).call(activeValues, value);
25
- };
6
+ const compareValuesDefault = (activeValues, value) => Array.isArray(activeValues) && _includesInstanceProperty(activeValues).call(activeValues, value);
26
7
 
27
8
  function ChipListMulti(_ref) {
28
- var _onChange = _ref.onChange,
29
- _ref$compareValues = _ref.compareValues,
30
- compareValues = _ref$compareValues === void 0 ? compareValuesDefault : _ref$compareValues,
31
- value = _ref.value,
32
- children = _ref.children,
33
- _ref$size = _ref.size,
34
- size = _ref$size === void 0 ? 'm' : _ref$size,
35
- _ref$sparse = _ref.sparse,
36
- sparse = _ref$sparse === void 0 ? false : _ref$sparse,
37
- _ref$compact = _ref.compact,
38
- compact = _ref$compact === void 0 ? false : _ref$compact,
39
- _ref$disabled = _ref.disabled,
40
- disabled = _ref$disabled === void 0 ? false : _ref$disabled,
41
- _ref$mode = _ref.mode,
42
- mode = _ref$mode === void 0 ? 'classic' : _ref$mode,
43
- _ref$alignItems = _ref.alignItems,
44
- alignItems = _ref$alignItems === void 0 ? 'left' : _ref$alignItems,
45
- props = _objectWithoutProperties(_ref, _excluded);
46
-
47
- return /*#__PURE__*/React.createElement(ChipListBase, _objectSpread({
9
+ let {
10
+ onChange,
11
+ compareValues = compareValuesDefault,
12
+ value,
13
+ children,
14
+ size = 'm',
15
+ sparse = false,
16
+ compact = false,
17
+ disabled = false,
18
+ mode = 'classic',
19
+ alignItems = 'left',
20
+ ...props
21
+ } = _ref;
22
+ return /*#__PURE__*/React.createElement(ChipListBase, {
48
23
  compareValues: compareValues,
49
24
  value: value,
50
- onChange: function onChange(changedValue) {
51
- var _context;
52
-
53
- var newValues = _includesInstanceProperty(value).call(value, changedValue) ? _filterInstanceProperty(value).call(value, function (v) {
54
- return v !== changedValue;
55
- }) : _concatInstanceProperty(_context = []).call(_context, _toConsumableArray(value), [changedValue]);
56
-
57
- _onChange(newValues);
25
+ onChange: changedValue => {
26
+ const newValues = _includesInstanceProperty(value).call(value, changedValue) ? value.filter(v => v !== changedValue) : [...value, changedValue];
27
+ onChange(newValues);
58
28
  },
59
29
  size: size,
60
30
  sparse: sparse,
61
31
  compact: compact,
62
32
  disabled: disabled,
63
33
  mode: mode,
64
- alignItems: alignItems
65
- }, props), children);
34
+ alignItems: alignItems,
35
+ ...props
36
+ }, children);
66
37
  }
67
38
 
68
39
  ChipListMulti.displayName = 'ChipListMulti';
package/lib/chip-list.js CHANGED
@@ -1,50 +1,25 @@
1
- import "core-js/modules/es.object.to-string.js";
2
- import "core-js/modules/web.dom-collections.for-each.js";
3
- import _Object$keys from "@babel/runtime-corejs3/core-js-stable/object/keys";
4
- import _Object$getOwnPropertySymbols from "@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols";
5
- import _filterInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/filter";
6
- import _Object$getOwnPropertyDescriptor from "@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor";
7
- import _Object$getOwnPropertyDescriptors from "@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptors";
8
- import _defineProperty from "@babel/runtime-corejs3/helpers/esm/defineProperty";
9
- import _objectWithoutProperties from "@babel/runtime-corejs3/helpers/esm/objectWithoutProperties";
10
- var _excluded = ["children", "compareValues", "value", "onChange", "size", "sparse", "compact", "disabled", "mode", "alignItems"];
11
-
12
- 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; }
13
-
14
- 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) { _defineProperty(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; }
15
-
16
1
  import React from 'react';
17
2
  import PropTypes from 'prop-types';
18
3
  import { ChipListBase } from './parts/chip-list-base.js';
19
4
 
20
- var compareValuesDefault = function compareValuesDefault(activeValue, value) {
21
- return activeValue === value;
22
- };
5
+ const compareValuesDefault = (activeValue, value) => activeValue === value;
23
6
 
24
7
  function ChipList(_ref) {
25
- var children = _ref.children,
26
- _ref$compareValues = _ref.compareValues,
27
- _compareValues = _ref$compareValues === void 0 ? compareValuesDefault : _ref$compareValues,
28
- value = _ref.value,
29
- onChange = _ref.onChange,
30
- _ref$size = _ref.size,
31
- size = _ref$size === void 0 ? 'm' : _ref$size,
32
- _ref$sparse = _ref.sparse,
33
- sparse = _ref$sparse === void 0 ? false : _ref$sparse,
34
- _ref$compact = _ref.compact,
35
- compact = _ref$compact === void 0 ? false : _ref$compact,
36
- _ref$disabled = _ref.disabled,
37
- disabled = _ref$disabled === void 0 ? false : _ref$disabled,
38
- _ref$mode = _ref.mode,
39
- mode = _ref$mode === void 0 ? 'classic' : _ref$mode,
40
- _ref$alignItems = _ref.alignItems,
41
- alignItems = _ref$alignItems === void 0 ? 'left' : _ref$alignItems,
42
- props = _objectWithoutProperties(_ref, _excluded);
43
-
44
- return /*#__PURE__*/React.createElement(ChipListBase, _objectSpread({
45
- compareValues: function compareValues(activeValues, compareVal) {
46
- return _compareValues(activeValues[0], compareVal);
47
- },
8
+ let {
9
+ children,
10
+ compareValues = compareValuesDefault,
11
+ value,
12
+ onChange,
13
+ size = 'm',
14
+ sparse = false,
15
+ compact = false,
16
+ disabled = false,
17
+ mode = 'classic',
18
+ alignItems = 'left',
19
+ ...props
20
+ } = _ref;
21
+ return /*#__PURE__*/React.createElement(ChipListBase, {
22
+ compareValues: (activeValues, compareVal) => compareValues(activeValues[0], compareVal),
48
23
  onChange: onChange,
49
24
  value: [value],
50
25
  size: size,
@@ -52,8 +27,9 @@ function ChipList(_ref) {
52
27
  compact: compact,
53
28
  disabled: disabled,
54
29
  mode: mode,
55
- alignItems: alignItems
56
- }, props), children);
30
+ alignItems: alignItems,
31
+ ...props
32
+ }, children);
57
33
  }
58
34
 
59
35
  ChipList.displayName = 'ChipList';
package/lib/index.css CHANGED
@@ -1,19 +1,19 @@
1
- ._light_5opd7e_8{
1
+ ._light_hdr0w0_8{
2
2
  --rs-theme-dark:0;
3
3
  }
4
- ._dark_5opd7e_11{
4
+ ._dark_hdr0w0_11{
5
5
  --rs-theme-dark:1;
6
6
  }
7
- ._alignLeft_5opd7e_15{
7
+ ._alignLeft_hdr0w0_15{
8
8
  --_rs-cl-align:left;
9
9
  }
10
- ._alignCenter_5opd7e_18{
10
+ ._alignCenter_hdr0w0_18{
11
11
  --_rs-cl-align:center;
12
12
  }
13
- ._alignRight_5opd7e_21{
13
+ ._alignRight_hdr0w0_21{
14
14
  --_rs-cl-align:right;
15
15
  }
16
- ._sizeXs_5opd7e_25{
16
+ ._sizeXs_hdr0w0_25{
17
17
  --_rs-cl-chip-base-border-radius:4px;
18
18
  --_rs-cl-chip-compact-border-radius:var(--_rs-cl-chip-base-border-radius);
19
19
  --_rs-cl-chip-vertical-padding:2px;
@@ -27,7 +27,7 @@
27
27
  --_rs-cl-compact-horizontal-gap:4px;
28
28
  --_rs-cl-sparse-horizontal-gap:12px;
29
29
  }
30
- ._sizeXs_5opd7e_25 [data-rs-internal='chip-list__chip']{
30
+ ._sizeXs_hdr0w0_25 [data-rs-internal='chip-list__chip']{
31
31
  --_rs-typography-letter-spacing:0.0045em;
32
32
  --_rs-typography-text-transform:initial;
33
33
  --_rs-typography-font-variant-numeric:initial;
@@ -61,7 +61,7 @@
61
61
  --_rs-typography-link-external-standalone-border-offset-from-text-base:1.02em;
62
62
  --_rs-typography-link-border-bottom-width-from-text:1px;
63
63
  }
64
- ._sizeS_5opd7e_28{
64
+ ._sizeS_hdr0w0_28{
65
65
  --_rs-cl-chip-base-border-radius:16px;
66
66
  --_rs-cl-chip-compact-border-radius:4px;
67
67
  --_rs-cl-chip-vertical-padding:6px;
@@ -75,7 +75,7 @@
75
75
  --_rs-cl-compact-horizontal-gap:6px;
76
76
  --_rs-cl-sparse-horizontal-gap:12px;
77
77
  }
78
- ._sizeS_5opd7e_28 [data-rs-internal='chip-list__chip']{
78
+ ._sizeS_hdr0w0_28 [data-rs-internal='chip-list__chip']{
79
79
  --_rs-typography-letter-spacing:0.0045em;
80
80
  --_rs-typography-text-transform:initial;
81
81
  --_rs-typography-font-variant-numeric:initial;
@@ -109,7 +109,7 @@
109
109
  --_rs-typography-link-external-standalone-border-offset-from-text-base:1.02em;
110
110
  --_rs-typography-link-border-bottom-width-from-text:1px;
111
111
  }
112
- ._sizeM_5opd7e_31{
112
+ ._sizeM_hdr0w0_31{
113
113
  --_rs-cl-chip-base-border-radius:20px;
114
114
  --_rs-cl-chip-compact-border-radius:8px;
115
115
  --_rs-cl-chip-vertical-padding:8px;
@@ -123,7 +123,7 @@
123
123
  --_rs-cl-compact-horizontal-gap:6px;
124
124
  --_rs-cl-sparse-horizontal-gap:16px;
125
125
  }
126
- ._sizeM_5opd7e_31 [data-rs-internal='chip-list__chip']{
126
+ ._sizeM_hdr0w0_31 [data-rs-internal='chip-list__chip']{
127
127
  --_rs-typography-letter-spacing:0.0015em;
128
128
  --_rs-typography-text-transform:initial;
129
129
  --_rs-typography-font-variant-numeric:initial;
@@ -158,11 +158,11 @@
158
158
  --_rs-typography-link-border-bottom-width-from-text:1px;
159
159
  }
160
160
  @media screen and (max-width: 640px){
161
- ._sizeM_5opd7e_31 [data-rs-internal='chip-list__chip']{
161
+ ._sizeM_hdr0w0_31 [data-rs-internal='chip-list__chip']{
162
162
  --_rs-typography-list-li-margin-top-from-text:12px;
163
163
  }
164
164
  }
165
- ._sizeL_5opd7e_34{
165
+ ._sizeL_hdr0w0_34{
166
166
  --_rs-cl-chip-base-border-radius:26px;
167
167
  --_rs-cl-chip-compact-border-radius:12px;
168
168
  --_rs-cl-chip-vertical-padding:12px;
@@ -177,11 +177,11 @@
177
177
  --_rs-cl-sparse-horizontal-gap:16px;
178
178
  }
179
179
  @media screen and (max-width: 640px){
180
- ._sizeL_5opd7e_34{
180
+ ._sizeL_hdr0w0_34{
181
181
  --_rs-cl-vertical-gap:12px;
182
182
  }
183
183
  }
184
- ._sizeL_5opd7e_34 [data-rs-internal='chip-list__chip']{
184
+ ._sizeL_hdr0w0_34 [data-rs-internal='chip-list__chip']{
185
185
  --_rs-typography-letter-spacing:normal;
186
186
  --_rs-typography-text-transform:initial;
187
187
  --_rs-typography-font-variant-numeric:initial;
@@ -216,34 +216,34 @@
216
216
  --_rs-typography-link-border-bottom-width-from-text:1px;
217
217
  }
218
218
  @media screen and (max-width: 640px){
219
- ._sizeL_5opd7e_34 [data-rs-internal='chip-list__chip']{
219
+ ._sizeL_hdr0w0_34 [data-rs-internal='chip-list__chip']{
220
220
  --_rs-typography-list-li-margin-top-from-text:16px;
221
221
  }
222
222
  }
223
- ._innerOffsetL_5opd7e_38{
223
+ ._innerOffsetL_hdr0w0_38{
224
224
  --_rs-cl-horizontal-gap-from-sparse:var(--_rs-cl-sparse-horizontal-gap);
225
225
  }
226
226
  @media screen and (max-width: 640px){
227
- ._innerOffsetL_5opd7e_38{
227
+ ._innerOffsetL_hdr0w0_38{
228
228
  --_rs-cl-horizontal-gap-from-sparse:var(--_rs-cl-base-horizontal-gap);
229
229
  }
230
230
  }
231
- ._innerOffsetM_5opd7e_41{
231
+ ._innerOffsetM_hdr0w0_41{
232
232
  --_rs-cl-horizontal-gap-from-sparse:initial;
233
233
  }
234
- ._classic_5opd7e_45{
234
+ ._classic_hdr0w0_45{
235
235
  --_rs-cl-chip-active-border-color:var(--_rs-color-primary);
236
236
  --_rs-cl-chip-selected-border-color:var(--_rs-color-primary);
237
237
  --_rs-cl-chip-hover-background:var(--_rs-color-primary-t-fog);
238
238
  --_rs-cl-chip-active-background:var(--_rs-color-primary-t-fog);
239
239
  }
240
- ._rock_5opd7e_48{
240
+ ._rock_hdr0w0_48{
241
241
  --_rs-cl-chip-active-border-color:rgba(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227));
242
242
  --_rs-cl-chip-selected-border-color:rgba(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227));
243
243
  --_rs-cl-chip-hover-background:rgba(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227), 0.1);
244
244
  --_rs-cl-chip-active-background:rgba(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227), 0.1);
245
245
  }
246
- ._compact_5opd7e_52{
246
+ ._compact_hdr0w0_52{
247
247
  --_rs-cl-chip-border-radius-from-compact:var(
248
248
  --_rs-cl-chip-compact-border-radius
249
249
  );
@@ -252,7 +252,7 @@
252
252
  );
253
253
  --_rs-cl-horizontal-gap-from-compact:var(--_rs-cl-compact-horizontal-gap);
254
254
  }
255
- ._main_5opd7e_56{
255
+ ._main_hdr0w0_56{
256
256
  --_rs-theme-dark:var(
257
257
  --_rs-internal-force-theme-dark-consult-rescui-before-using,
258
258
  var(--rs-theme-dark, 0)
@@ -262,7 +262,7 @@
262
262
  --_rs-theme-light-coefficient:calc(1 - var(--_rs-theme-dark-coefficient));
263
263
  }
264
264
  @supports (color: color-mix(in srgb, #fff 50%, #000 50%)){
265
- ._main_5opd7e_56{
265
+ ._main_hdr0w0_56{
266
266
  --_rs-color-primary:color-mix(in srgb, var(--rs-color-primary-light-theme, #6B57FF) calc(100%*var(--_rs-theme-light-coefficient, 1)), var(--rs-color-primary-dark-theme, #8473FF) calc(100%*var(--_rs-theme-dark-coefficient, 0)));
267
267
  --_rs-color-primary-dim:color-mix(in srgb, var(--rs-color-primary-dim-light-theme, #8979ff) calc(100%*var(--_rs-theme-light-coefficient, 1)), var(--rs-color-primary-dim-dark-theme, #6f61d2) calc(100%*var(--_rs-theme-dark-coefficient, 0)));
268
268
  --_rs-color-primary-fog:color-mix(in srgb, var(--rs-color-primary-fog-light-theme, #e1ddff) calc(100%*var(--_rs-theme-light-coefficient, 1)), var(--rs-color-primary-fog-dark-theme, #2e2b49) calc(100%*var(--_rs-theme-dark-coefficient, 0)));
@@ -271,7 +271,7 @@
271
271
  }
272
272
  }
273
273
  @supports not (color: color-mix(in srgb, #fff 50%, #000 50%)){
274
- ._main_5opd7e_56{
274
+ ._main_hdr0w0_56{
275
275
  --_rs-color-primary:rgb(calc(var(--_rs-theme-light-coefficient, 1)*107 + var(--_rs-theme-dark-coefficient, 0)*132), calc(var(--_rs-theme-light-coefficient, 1)*87 + var(--_rs-theme-dark-coefficient, 0)*115), 255);
276
276
  --_rs-color-primary-dim:rgb(calc(var(--_rs-theme-light-coefficient, 1)*137 + var(--_rs-theme-dark-coefficient, 0)*111), calc(var(--_rs-theme-light-coefficient, 1)*121 + var(--_rs-theme-dark-coefficient, 0)*97), calc(var(--_rs-theme-light-coefficient, 1)*255 + var(--_rs-theme-dark-coefficient, 0)*210));
277
277
  --_rs-color-primary-fog:rgb(calc(var(--_rs-theme-light-coefficient, 1)*225 + var(--_rs-theme-dark-coefficient, 0)*46), calc(var(--_rs-theme-light-coefficient, 1)*221 + var(--_rs-theme-dark-coefficient, 0)*43), calc(var(--_rs-theme-light-coefficient, 1)*255 + var(--_rs-theme-dark-coefficient, 0)*73));
@@ -279,7 +279,7 @@
279
279
  --_rs-color-primary-t-fog:rgba(calc(var(--_rs-theme-light-coefficient, 1)*107 + var(--_rs-theme-dark-coefficient, 0)*132), calc(var(--_rs-theme-light-coefficient, 1)*87 + var(--_rs-theme-dark-coefficient, 0)*115), 255, calc(var(--_rs-theme-light-coefficient, 1)*0.2 + var(--_rs-theme-dark-coefficient, 0)*0.3));
280
280
  }
281
281
  }
282
- ._main_5opd7e_56 {
282
+ ._main_hdr0w0_56 {
283
283
  --_rs-cl-chip-border-radius:var(
284
284
  --_rs-cl-chip-border-radius-from-compact,
285
285
  var(--_rs-cl-chip-base-border-radius)
@@ -293,33 +293,26 @@
293
293
  var(--_rs-cl-horizontal-gap-from-sparse, var(--_rs-cl-base-horizontal-gap))
294
294
  );
295
295
  }
296
- ._chipsContainer_5opd7e_62{
296
+ ._chipsContainer_hdr0w0_62{
297
297
  position:relative;
298
298
 
299
- display:-webkit-box;
300
-
301
- display:-ms-flexbox;
302
-
303
299
  display:flex;
304
- -ms-flex-wrap:wrap;
305
- flex-wrap:wrap;
306
- -webkit-box-pack:var(--_rs-cl-align);
307
- -ms-flex-pack:var(--_rs-cl-align);
308
- justify-content:var(--_rs-cl-align);
300
+ flex-wrap:wrap;
301
+ justify-content:var(--_rs-cl-align);
309
302
 
310
303
  gap:var(--_rs-cl-vertical-gap) var(--_rs-cl-horizontal-gap);
311
304
  }
312
- ._alignIconLeft_5opd7e_72{
305
+ ._alignIconLeft_hdr0w0_72{
313
306
  --_rs-cl-chip-icon-flex-direction:row;
314
307
  --_rs-cl-chip-icon-position-multiplier-left:1;
315
308
  --_rs-cl-chip-icon-position-multiplier-right:0;
316
309
  }
317
- ._alignIconRight_5opd7e_75{
310
+ ._alignIconRight_hdr0w0_75{
318
311
  --_rs-cl-chip-icon-flex-direction:row-reverse;
319
312
  --_rs-cl-chip-icon-position-multiplier-left:0;
320
313
  --_rs-cl-chip-icon-position-multiplier-right:1;
321
314
  }
322
- ._chip_5opd7e_62{
315
+ ._chip_hdr0w0_62{
323
316
  letter-spacing:var(
324
317
  --rs-text-base-letter-spacing,
325
318
  var(--_rs-typography-letter-spacing)
@@ -330,7 +323,6 @@
330
323
  font-weight:var(--_rs-typography-font-weight);
331
324
  line-height:var(--_rs-typography-line-height);
332
325
  font-variant-numeric:var(--_rs-typography-font-variant-numeric);
333
- -webkit-font-feature-settings:'kern', 'liga', 'calt';
334
326
  font-feature-settings:'kern', 'liga', 'calt';
335
327
 
336
328
  --_rs-cl-chip-border-width:1px;
@@ -342,30 +334,15 @@
342
334
  position:relative;
343
335
  z-index:1;
344
336
 
345
- display:-webkit-inline-box;
346
-
347
- display:-ms-inline-flexbox;
348
-
349
337
  display:inline-flex;
350
338
  overflow:hidden;
351
- -webkit-box-flex:0;
352
- -ms-flex:0 0 auto;
353
- flex:0 0 auto;
354
- -webkit-box-orient:vertical;
355
- -webkit-box-direction:normal;
356
- -ms-flex-direction:var(--_rs-cl-chip-icon-flex-direction);
357
- flex-direction:var(--_rs-cl-chip-icon-flex-direction);
339
+ flex:0 0 auto;
340
+ flex-direction:var(--_rs-cl-chip-icon-flex-direction);
358
341
  gap:var(--_rs-cl-chip-icon-offset);
359
- -webkit-box-pack:center;
360
- -ms-flex-pack:center;
361
- justify-content:center;
362
- -webkit-box-align:center;
363
- -ms-flex-align:center;
364
- align-items:center;
342
+ justify-content:center;
343
+ align-items:center;
365
344
 
366
- -webkit-box-sizing:border-box;
367
-
368
- box-sizing:border-box;
345
+ box-sizing:border-box;
369
346
  margin:0;
370
347
  padding:var(--_rs-cl-chip-vertical-real-padding) var(--_rs-cl-chip-horizontal-real-padding);
371
348
 
@@ -380,33 +357,29 @@
380
357
 
381
358
  color:rgba(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227));
382
359
  background:transparent;
383
- -webkit-box-shadow:none;
384
- box-shadow:none;
385
-
386
- -webkit-transition:color 100ms, background-color 100ms;
360
+ box-shadow:none;
387
361
 
388
362
  transition:color 100ms, background-color 100ms;
389
363
  -webkit-font-smoothing:inherit;
390
364
  -moz-osx-font-smoothing:inherit;
391
365
  -webkit-appearance:none;
392
366
  }
393
- ._chip_5opd7e_62::-moz-focus-inner{
367
+ ._chip_hdr0w0_62::-moz-focus-inner{
394
368
  padding:0;
395
369
 
396
370
  border:none;
397
371
  }
398
- ._chip_5opd7e_62:hover,
399
- ._chip_5opd7e_62:focus,
400
- ._chip_5opd7e_62:active{
372
+ ._chip_hdr0w0_62:hover,
373
+ ._chip_hdr0w0_62:focus,
374
+ ._chip_hdr0w0_62:active{
401
375
  outline:none;
402
376
 
403
377
  text-decoration:none;
404
378
  }
405
- ._chip_5opd7e_62:focus[data-focus-method='key']{
406
- -webkit-box-shadow:var(--_rs-color-primary-t-dim) 0 0 0 4px;
407
- box-shadow:var(--_rs-color-primary-t-dim) 0 0 0 4px;
379
+ ._chip_hdr0w0_62:focus[data-focus-method='key']{
380
+ box-shadow:var(--_rs-color-primary-t-dim) 0 0 0 4px;
408
381
  }
409
- ._chip_5opd7e_62:focus{
382
+ ._chip_hdr0w0_62:focus{
410
383
  --_rs-cl-chip-border-color:rgba(
411
384
  calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227),
412
385
  calc(0.3 + var(--_rs-theme-dark-coefficient)*0.1)
@@ -415,7 +388,7 @@
415
388
  color:rgba(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227));
416
389
  }
417
390
  @media (hover: hover){
418
- ._chip_5opd7e_62:hover{
391
+ ._chip_hdr0w0_62:hover{
419
392
  --_rs-cl-chip-border-color:rgba(
420
393
  calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227),
421
394
  calc(0.3 + var(--_rs-theme-dark-coefficient)*0.1)
@@ -426,20 +399,20 @@
426
399
  background:var(--_rs-cl-chip-hover-background);
427
400
  }
428
401
  }
429
- ._chip_5opd7e_62:active{
402
+ ._chip_hdr0w0_62:active{
430
403
  --_rs-cl-chip-border-color:var(--_rs-cl-chip-active-border-color);
431
404
 
432
405
  color:rgba(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227));
433
406
 
434
407
  background:var(--_rs-cl-chip-active-background);
435
408
  }
436
- ._chip_5opd7e_62._selected_5opd7e_172{
409
+ ._chip_hdr0w0_62._selected_hdr0w0_172{
437
410
  --_rs-cl-chip-border-color:var(--_rs-cl-chip-selected-border-color);
438
411
  --_rs-cl-chip-border-width:2px;
439
412
 
440
413
  color:rgba(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227));
441
414
  }
442
- ._disabled_5opd7e_179 ._chip_5opd7e_62{
415
+ ._disabled_hdr0w0_179 ._chip_hdr0w0_62{
443
416
  --_rs-cl-chip-border-color:rgba(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227), 0.2);
444
417
 
445
418
  pointer-events:none;
@@ -448,10 +421,10 @@
448
421
 
449
422
  background:transparent;
450
423
  }
451
- ._disabled_5opd7e_179 ._chip_5opd7e_62._selected_5opd7e_172{
424
+ ._disabled_hdr0w0_179 ._chip_hdr0w0_62._selected_hdr0w0_172{
452
425
  --_rs-cl-chip-border-color:rgba(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227), 0.4);
453
426
  }
454
- ._chip_5opd7e_62::before{
427
+ ._chip_hdr0w0_62::before{
455
428
  position:absolute;
456
429
  top:0;
457
430
  right:0;
@@ -466,14 +439,10 @@
466
439
  content:'';
467
440
  pointer-events:none;
468
441
 
469
- -webkit-transition:border-color 100ms;
470
-
471
442
  transition:border-color 100ms;
472
443
  }
473
- ._chip_5opd7e_62 ._icon_5opd7e_212{
474
- -webkit-box-flex:0;
475
- -ms-flex:0 0 auto;
476
- flex:0 0 auto;
444
+ ._chip_hdr0w0_62 ._icon_hdr0w0_212{
445
+ flex:0 0 auto;
477
446
 
478
447
  width:auto;
479
448
  height:var(--_rs-cl-chip-icon-size);
@@ -481,7 +450,7 @@
481
450
  margin:0;
482
451
  fill:currentColor;
483
452
  }
484
- ._withoutText_5opd7e_223{
453
+ ._withoutText_hdr0w0_223{
485
454
  --_rs-cl-chip-horizontal-real-padding:var(--_rs-cl-chip-icon-only-padding);
486
455
  --_rs-cl-chip-vertical-real-padding:var(--_rs-cl-chip-icon-only-padding);
487
456
  }
package/lib/parts/chip-list-base.js CHANGED
@@ -4,57 +4,52 @@ import { useThemeWithUndefined } from '@rescui/ui-contexts';
4
4
  import { ChipListContext } from './chip-list-context.js';
5
5
  import styles from './chip-list.p.module.css.js';
6
6
  import { useItemsIds } from './use-items-ids.js';
7
- var STYLES_SIZES = {
7
+ const STYLES_SIZES = {
8
8
  xs: styles.sizeXs,
9
9
  s: styles.sizeS,
10
10
  m: styles.sizeM,
11
11
  l: styles.sizeL
12
12
  };
13
- var ALIGN_ITEMS_STYLES = {
13
+ const ALIGN_ITEMS_STYLES = {
14
14
  left: styles.alignLeft,
15
15
  center: styles.alignCenter,
16
16
  right: styles.alignRight
17
17
  };
18
18
 
19
19
  function ChipListBase(_ref) {
20
- var _ref$size = _ref.size,
21
- size = _ref$size === void 0 ? 'm' : _ref$size,
22
- _ref$sparse = _ref.sparse,
23
- sparse = _ref$sparse === void 0 ? false : _ref$sparse,
24
- _ref$compact = _ref.compact,
25
- compact = _ref$compact === void 0 ? false : _ref$compact,
26
- _ref$disabled = _ref.disabled,
27
- disabled = _ref$disabled === void 0 ? false : _ref$disabled,
28
- className = _ref.className,
29
- _ref$mode = _ref.mode,
30
- mode = _ref$mode === void 0 ? 'classic' : _ref$mode,
31
- _ref$alignItems = _ref.alignItems,
32
- alignItems = _ref$alignItems === void 0 ? 'left' : _ref$alignItems,
33
- themeFromProps = _ref.theme,
34
- value = _ref.value,
35
- onChange = _ref.onChange,
36
- compareValues = _ref.compareValues,
37
- children = _ref.children,
38
- e2eId = _ref['data-e2e'];
39
- var theme = useThemeWithUndefined(themeFromProps);
40
-
41
- var _useItemsIds = useItemsIds({
42
- children: children,
43
- compareValues: compareValues,
44
- value: value
45
- }),
46
- childrenWithValues = _useItemsIds.childrenWithValues,
47
- selectedIds = _useItemsIds.selectedIds;
48
-
20
+ let {
21
+ size = 'm',
22
+ sparse = false,
23
+ compact = false,
24
+ disabled = false,
25
+ className,
26
+ mode = 'classic',
27
+ alignItems = 'left',
28
+ theme: themeFromProps,
29
+ value,
30
+ onChange,
31
+ compareValues,
32
+ children,
33
+ ['data-e2e']: e2eId
34
+ } = _ref;
35
+ const theme = useThemeWithUndefined(themeFromProps);
36
+ const {
37
+ childrenWithValues,
38
+ selectedIds
39
+ } = useItemsIds({
40
+ children,
41
+ compareValues,
42
+ value
43
+ });
49
44
  return /*#__PURE__*/React.createElement(ChipListContext.Provider, {
50
45
  value: {
51
- onChange: onChange,
52
- selectedIds: selectedIds,
53
- disabled: disabled
46
+ onChange,
47
+ selectedIds,
48
+ disabled
54
49
  }
55
50
  }, /*#__PURE__*/React.createElement("div", {
56
51
  className: cn(styles.main, styles[theme], styles[mode], STYLES_SIZES[size], sparse ? styles.innerOffsetL : styles.innerOffsetM, compact && styles.compact, disabled && styles.disabled, ALIGN_ITEMS_STYLES[alignItems], className),
57
- "data-e2e": e2eId ? "".concat(e2eId, "__chips-container") : null,
52
+ "data-e2e": e2eId ? `${e2eId}__chips-container` : null,
58
53
  "data-rs-internal": 'chip-list',
59
54
  "data-test": 'chip-list'
60
55
  }, /*#__PURE__*/React.createElement("div", {
package/lib/parts/chip-list-context.js CHANGED
@@ -1,13 +1,11 @@
1
1
  import { createContext, useContext } from 'react';
2
- var ChipListContext = /*#__PURE__*/createContext({
2
+ const ChipListContext = /*#__PURE__*/createContext({
3
3
  // eslint-disable-next-line @typescript-eslint/no-empty-function
4
- onChange: function onChange() {},
4
+ onChange: () => {},
5
5
  selectedIds: [],
6
6
  disabled: false
7
7
  });
8
8
 
9
- var useChipListContext = function useChipListContext() {
10
- return useContext(ChipListContext);
11
- };
9
+ const useChipListContext = () => useContext(ChipListContext);
12
10
 
13
11
  export { ChipListContext, useChipListContext };
package/lib/parts/chip-list.p.module.css.js CHANGED
@@ -1,26 +1,26 @@
1
1
  var styles = {
2
- "light": "_light_5opd7e_8",
3
- "dark": "_dark_5opd7e_11",
4
- "alignLeft": "_alignLeft_5opd7e_15",
5
- "alignCenter": "_alignCenter_5opd7e_18",
6
- "alignRight": "_alignRight_5opd7e_21",
7
- "sizeXs": "_sizeXs_5opd7e_25",
8
- "sizeS": "_sizeS_5opd7e_28",
9
- "sizeM": "_sizeM_5opd7e_31",
10
- "sizeL": "_sizeL_5opd7e_34",
11
- "innerOffsetL": "_innerOffsetL_5opd7e_38",
12
- "innerOffsetM": "_innerOffsetM_5opd7e_41",
13
- "classic": "_classic_5opd7e_45",
14
- "rock": "_rock_5opd7e_48",
15
- "compact": "_compact_5opd7e_52",
16
- "main": "_main_5opd7e_56",
17
- "chipsContainer": "_chipsContainer_5opd7e_62",
18
- "alignIconLeft": "_alignIconLeft_5opd7e_72",
19
- "alignIconRight": "_alignIconRight_5opd7e_75",
20
- "chip": "_chip_5opd7e_62",
21
- "selected": "_selected_5opd7e_172",
22
- "disabled": "_disabled_5opd7e_179",
23
- "icon": "_icon_5opd7e_212",
24
- "withoutText": "_withoutText_5opd7e_223"
2
+ "light": "_light_hdr0w0_8",
3
+ "dark": "_dark_hdr0w0_11",
4
+ "alignLeft": "_alignLeft_hdr0w0_15",
5
+ "alignCenter": "_alignCenter_hdr0w0_18",
6
+ "alignRight": "_alignRight_hdr0w0_21",
7
+ "sizeXs": "_sizeXs_hdr0w0_25",
8
+ "sizeS": "_sizeS_hdr0w0_28",
9
+ "sizeM": "_sizeM_hdr0w0_31",
10
+ "sizeL": "_sizeL_hdr0w0_34",
11
+ "innerOffsetL": "_innerOffsetL_hdr0w0_38",
12
+ "innerOffsetM": "_innerOffsetM_hdr0w0_41",
13
+ "classic": "_classic_hdr0w0_45",
14
+ "rock": "_rock_hdr0w0_48",
15
+ "compact": "_compact_hdr0w0_52",
16
+ "main": "_main_hdr0w0_56",
17
+ "chipsContainer": "_chipsContainer_hdr0w0_62",
18
+ "alignIconLeft": "_alignIconLeft_hdr0w0_72",
19
+ "alignIconRight": "_alignIconRight_hdr0w0_75",
20
+ "chip": "_chip_hdr0w0_62",
21
+ "selected": "_selected_hdr0w0_172",
22
+ "disabled": "_disabled_hdr0w0_179",
23
+ "icon": "_icon_hdr0w0_212",
24
+ "withoutText": "_withoutText_hdr0w0_223"
25
25
  };
26
26
  export { styles as default };
package/lib/parts/chip.js CHANGED
@@ -1,97 +1,83 @@
1
- import "core-js/modules/es.object.to-string.js";
2
- import "core-js/modules/web.dom-collections.for-each.js";
3
- import _Object$keys from "@babel/runtime-corejs3/core-js-stable/object/keys";
4
- import _Object$getOwnPropertySymbols from "@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols";
5
- import _filterInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/filter";
6
- import _Object$getOwnPropertyDescriptor from "@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor";
7
- import _Object$getOwnPropertyDescriptors from "@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptors";
8
- import _objectWithoutProperties from "@babel/runtime-corejs3/helpers/esm/objectWithoutProperties";
9
- import _defineProperty from "@babel/runtime-corejs3/helpers/esm/defineProperty";
10
- var _excluded = ["value", "className", "children", "icon", "iconPosition", "itemId", "onClick", "onKeyDown", "data-e2e"];
11
1
  import _includesInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/includes";
12
-
13
- 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; }
14
-
15
- 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) { _defineProperty(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; }
16
-
17
2
  import React, { forwardRef, cloneElement } from 'react';
18
3
  import PropTypes from 'prop-types';
19
4
  import cn from 'classnames';
20
5
  import styles from './chip-list.p.module.css.js';
21
6
  import { useChipListContext } from './chip-list-context.js';
22
- var ChipTag = /*#__PURE__*/forwardRef(function (props, ref) {
23
- var _useChipListContext = useChipListContext(),
24
- disabled = _useChipListContext.disabled;
7
+ const ChipTag = /*#__PURE__*/forwardRef((props, ref) => {
8
+ const {
9
+ disabled
10
+ } = useChipListContext();
25
11
 
26
12
  if (typeof props.href !== 'undefined') {
27
- return /*#__PURE__*/React.createElement("a", _objectSpread(_objectSpread({
28
- ref: ref
29
- }, props), {}, {
13
+ return /*#__PURE__*/React.createElement("a", {
14
+ ref: ref,
15
+ ...props,
30
16
  tabIndex: disabled ? -1 : props.tabIndex
31
- }), props.children);
17
+ }, props.children);
32
18
  }
33
19
 
34
- return /*#__PURE__*/React.createElement("button", _objectSpread(_objectSpread({
35
- ref: ref
36
- }, props), {}, {
20
+ return /*#__PURE__*/React.createElement("button", {
21
+ ref: ref,
22
+ ...props,
37
23
  disabled: disabled,
38
24
  type: "button"
39
- }), props.children);
25
+ }, props.children);
40
26
  });
41
27
  ChipTag.displayName = 'ChipTag'; // check for ignored jsx values and empty string, more info https://reactjs.org/docs/jsx-in-depth.html#booleans-null-and-undefined-are-ignored
42
28
 
43
- var isWithoutChildren = function isWithoutChildren(children) {
44
- return children === null || typeof children === 'undefined' || children === false || children === true || children === '';
45
- };
46
-
47
- var Chip = /*#__PURE__*/forwardRef(function (_ref, ref) {
48
- var _cn, _restProps$tabIndex;
49
-
50
- var value = _ref.value,
51
- className = _ref.className,
52
- children = _ref.children,
53
- icon = _ref.icon,
54
- _ref$iconPosition = _ref.iconPosition,
55
- iconPosition = _ref$iconPosition === void 0 ? 'left' : _ref$iconPosition,
56
- itemId = _ref.itemId,
57
- _onClick = _ref.onClick,
58
- _onKeyDown = _ref.onKeyDown,
59
- e2eId = _ref['data-e2e'],
60
- restProps = _objectWithoutProperties(_ref, _excluded);
29
+ const isWithoutChildren = children => children === null || typeof children === 'undefined' || children === false || children === true || children === '';
61
30
 
62
- var _useChipListContext2 = useChipListContext(),
63
- onChange = _useChipListContext2.onChange,
64
- selectedIds = _useChipListContext2.selectedIds;
31
+ const Chip = /*#__PURE__*/forwardRef((_ref, ref) => {
32
+ let {
33
+ value,
34
+ className,
35
+ children,
36
+ icon,
37
+ iconPosition = 'left',
38
+ itemId,
39
+ onClick,
40
+ onKeyDown,
41
+ ['data-e2e']: e2eId,
42
+ ...restProps
43
+ } = _ref;
44
+ const {
45
+ onChange,
46
+ selectedIds
47
+ } = useChipListContext();
65
48
 
66
- var selected = _includesInstanceProperty(selectedIds).call(selectedIds, itemId);
49
+ const selected = _includesInstanceProperty(selectedIds).call(selectedIds, itemId);
67
50
 
68
- var isWithoutText = isWithoutChildren(children);
69
- return /*#__PURE__*/React.createElement(ChipTag, _objectSpread(_objectSpread({}, restProps), {}, {
70
- className: cn(styles.chip, (_cn = {}, _defineProperty(_cn, styles.selected, selected), _defineProperty(_cn, styles.withoutText, isWithoutText), _cn), iconPosition === 'right' ? styles.alignIconRight : styles.alignIconLeft, className),
71
- onClick: function onClick(e) {
72
- if (_onClick) {
73
- _onClick(e);
51
+ const isWithoutText = isWithoutChildren(children);
52
+ return /*#__PURE__*/React.createElement(ChipTag, { ...restProps,
53
+ className: cn(styles.chip, {
54
+ [styles.selected]: selected,
55
+ [styles.withoutText]: isWithoutText
56
+ }, iconPosition === 'right' ? styles.alignIconRight : styles.alignIconLeft, className),
57
+ onClick: e => {
58
+ if (onClick) {
59
+ onClick(e);
74
60
  }
75
61
 
76
62
  onChange(value);
77
63
  },
78
- onKeyDown: function onKeyDown(e) {
64
+ onKeyDown: e => {
79
65
  if (e.key === ' ') {
80
66
  e.target.click();
81
67
  e.preventDefault();
82
68
  }
83
69
 
84
- if (_onKeyDown) {
85
- _onKeyDown(e);
70
+ if (onKeyDown) {
71
+ onKeyDown(e);
86
72
  }
87
73
  },
88
74
  role: "tab",
89
- tabIndex: (_restProps$tabIndex = restProps.tabIndex) !== null && _restProps$tabIndex !== void 0 ? _restProps$tabIndex : 0,
75
+ tabIndex: restProps.tabIndex ?? 0,
90
76
  ref: ref,
91
77
  "data-e2e": e2eId,
92
- "data-test": "chip".concat(selected ? ' chip-selected' : ''),
78
+ "data-test": `chip${selected ? ' chip-selected' : ''}`,
93
79
  "data-rs-internal": 'chip-list__chip'
94
- }), icon && /*#__PURE__*/cloneElement(icon, {
80
+ }, icon && /*#__PURE__*/cloneElement(icon, {
95
81
  className: cn(icon.props.className, styles.icon)
96
82
  }), !isWithoutText && /*#__PURE__*/React.createElement("span", null, children));
97
83
  });
package/lib/parts/deep-map.js CHANGED
@@ -1,12 +1,9 @@
1
- import _mapInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/map";
2
1
  import React, { isValidElement, cloneElement } from 'react';
3
2
 
4
3
  function deepMap(children, fn) {
5
- var _context;
6
-
7
- var processChild = function processChild(child) {
8
- var i = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
9
- var returnChild = child;
4
+ const processChild = function (child) {
5
+ let i = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
6
+ let returnChild = child;
10
7
 
11
8
  if (! /*#__PURE__*/isValidElement(returnChild)) {
12
9
  return returnChild;
@@ -26,7 +23,7 @@ function deepMap(children, fn) {
26
23
  return processChild(children);
27
24
  }
28
25
 
29
- return _mapInstanceProperty(_context = React.Children).call(_context, children, processChild);
26
+ return React.Children.map(children, processChild);
30
27
  }
31
28
 
32
29
  export { deepMap };
package/lib/parts/use-items-ids.js CHANGED
@@ -1,47 +1,47 @@
1
- import _slicedToArray from "@babel/runtime-corejs3/helpers/esm/slicedToArray";
2
- import "core-js/modules/es.object.to-string.js";
3
- import "core-js/modules/es.promise.js";
4
1
  import React, { useMemo, cloneElement } from 'react';
5
2
  import { deepMap } from './deep-map.js';
6
3
  import Chip from './chip.js';
7
4
 
8
5
  function patchItemIfNeeded(_ref) {
9
- var child = _ref.child,
10
- itemId = _ref.itemId,
11
- childValue = _ref.childValue;
6
+ let {
7
+ child,
8
+ itemId,
9
+ childValue
10
+ } = _ref;
12
11
  return /*#__PURE__*/cloneElement(child, {
13
- itemId: itemId,
12
+ itemId,
14
13
  value: childValue
15
14
  });
16
15
  }
17
16
 
18
- var hasElValue = function hasElValue(el) {
17
+ const hasElValue = el => {
19
18
  var _el$props, _el$props2;
20
19
 
21
20
  return ((_el$props = el.props) === null || _el$props === void 0 ? void 0 : _el$props.value) !== null && typeof ((_el$props2 = el.props) === null || _el$props2 === void 0 ? void 0 : _el$props2.value) !== 'undefined';
22
21
  };
23
22
 
24
- var useItemsIds = function useItemsIds(_ref2) {
25
- var children = _ref2.children,
26
- compareValues = _ref2.compareValues,
27
- value = _ref2.value;
28
-
29
- var _useMemo = useMemo(function () {
30
- var counter = 0;
31
- var currentSelectedItemIds = [];
32
- var items = deepMap(children, function (child) {
23
+ const useItemsIds = _ref2 => {
24
+ let {
25
+ children,
26
+ compareValues,
27
+ value
28
+ } = _ref2;
29
+ const [childrenWithValues, selectedIds] = useMemo(() => {
30
+ let counter = 0;
31
+ const currentSelectedItemIds = [];
32
+ const items = deepMap(children, child => {
33
33
  if (child.type === Chip) {
34
- var childValue = hasElValue(child) ? child.props.value : counter;
35
- var isSelectedItem = compareValues(value, childValue);
34
+ const childValue = hasElValue(child) ? child.props.value : counter;
35
+ const isSelectedItem = compareValues(value, childValue);
36
36
 
37
37
  if (isSelectedItem) {
38
38
  currentSelectedItemIds.push(counter);
39
39
  }
40
40
 
41
- var patchedItem = patchItemIfNeeded({
42
- child: child,
41
+ const patchedItem = patchItemIfNeeded({
42
+ child,
43
43
  itemId: counter,
44
- childValue: childValue
44
+ childValue
45
45
  });
46
46
  counter += 1;
47
47
  return patchedItem;
@@ -50,14 +50,10 @@ var useItemsIds = function useItemsIds(_ref2) {
50
50
  }
51
51
  });
52
52
  return [React.Children.toArray(items), currentSelectedItemIds];
53
- }, [children, value, compareValues]),
54
- _useMemo2 = _slicedToArray(_useMemo, 2),
55
- childrenWithValues = _useMemo2[0],
56
- selectedIds = _useMemo2[1];
57
-
53
+ }, [children, value, compareValues]);
58
54
  return {
59
- childrenWithValues: childrenWithValues,
60
- selectedIds: selectedIds
55
+ childrenWithValues,
56
+ selectedIds
61
57
  };
62
58
  };
63
59
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@rescui/chip-list",
3
- "version": "0.11.1",
3
+ "version": "0.11.3",
4
4
  "description": "",
5
5
  "license": "Apache-2.0",
6
6
  "author": "JetBrains",
@@ -14,9 +14,8 @@
14
14
  "access": "public"
15
15
  },
16
16
  "dependencies": {
17
- "@babel/runtime-corejs3": "^7.14.0",
18
- "classnames": "^2.2.6",
19
- "core-js": "^3.9.1"
17
+ "@babel/runtime-corejs3": "^7.26.0",
18
+ "classnames": "^2.2.6"
20
19
  },
21
20
  "peerDependencies": {
22
21
  "@rescui/ui-contexts": "^0.5.0",
@@ -24,9 +23,9 @@
24
23
  "react": ">=16.8.0 <19"
25
24
  },
26
25
  "devDependencies": {
27
- "@rescui/colors": "^0.2.5",
28
- "@rescui/scripts": "^0.3.4",
29
- "@rescui/typography": "^0.19.0",
26
+ "@rescui/colors": "^0.2.6",
27
+ "@rescui/scripts": "^0.3.5",
28
+ "@rescui/typography": "^0.20.0",
30
29
  "@rescui/visual-regression": "^0.1.2"
31
30
  },
32
31
  "scripts": {
@@ -34,5 +33,5 @@
34
33
  "build-pcss-api": "rescui-scripts build-pcss-api --file public-api.p.css"
35
34
  },
36
35
  "nx": {},
37
- "gitHead": "2c56accd194893854decb2f8a9f95583e14921f1"
36
+ "gitHead": "5531e3d285d6e38bf5536ff0690a252f1308c49b"
38
37
  }