@rescui/chip-list 0.5.3 → 0.6.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (11) hide show
  1. package/lib/chip-list-multi.d.ts +4 -2
  2. package/lib/chip-list-multi.js +15 -2
  3. package/lib/chip-list.d.ts +3 -2
  4. package/lib/chip-list.js +15 -2
  5. package/lib/index.css +108 -93
  6. package/lib/parts/chip-list-base.d.ts +3 -2
  7. package/lib/parts/chip-list-base.js +8 -1
  8. package/lib/parts/chip-list.p.module.css.js +21 -18
  9. package/lib/parts/chip.d.ts +4 -0
  10. package/lib/parts/types.d.ts +1 -0
  11. package/package.json +5 -5
package/lib/chip-list-multi.d.ts CHANGED
@@ -1,7 +1,7 @@
1
1
  import React from 'react';
2
2
  import PropTypes from 'prop-types';
3
3
  import { Theme } from '@rescui/ui-contexts';
4
- import { ChipListSizeType, ChipListModeType } from './parts/types';
4
+ import { ChipListSizeType, ChipListModeType, ChipListAlignItemsType } from './parts/types';
5
5
  export declare const compareValuesDefault: <V>(activeValues: V[], value: V) => boolean;
6
6
  export declare type ChipListMultiProps<ValueType> = {
7
7
  className?: string;
@@ -10,6 +10,7 @@ export declare type ChipListMultiProps<ValueType> = {
10
10
  sparse?: boolean;
11
11
  theme?: Theme;
12
12
  mode?: ChipListModeType;
13
+ alignItems?: ChipListAlignItemsType;
13
14
  value: ValueType[];
14
15
  onChange: (value: ValueType[]) => void;
15
16
  children: React.ReactNode;
@@ -17,7 +18,7 @@ export declare type ChipListMultiProps<ValueType> = {
17
18
  /** Identifier for e2e tests */
18
19
  'data-e2e'?: string;
19
20
  };
20
- export declare function ChipListMulti<ValueType>({ onChange, compareValues, value, children, ...props }: ChipListMultiProps<ValueType>): JSX.Element;
21
+ export declare function ChipListMulti<ValueType>({ onChange, compareValues, value, children, size, sparse, mode, alignItems, ...props }: ChipListMultiProps<ValueType>): JSX.Element;
21
22
  export declare namespace ChipListMulti {
22
23
  var displayName: string;
23
24
  var propTypes: {
@@ -26,6 +27,7 @@ export declare namespace ChipListMulti {
26
27
  theme: PropTypes.Requireable<string>;
27
28
  className: PropTypes.Requireable<string>;
28
29
  mode: PropTypes.Requireable<string>;
30
+ alignItems: PropTypes.Requireable<string>;
29
31
  value: PropTypes.Validator<any[]>;
30
32
  onChange: PropTypes.Validator<(...args: any[]) => any>;
31
33
  compareValues: PropTypes.Requireable<(...args: any[]) => any>;
package/lib/chip-list-multi.js CHANGED
@@ -7,7 +7,7 @@ import _Object$getOwnPropertyDescriptors from "@babel/runtime-corejs3/core-js-st
7
7
  import _toConsumableArray from "@babel/runtime-corejs3/helpers/esm/toConsumableArray";
8
8
  import _defineProperty from "@babel/runtime-corejs3/helpers/esm/defineProperty";
9
9
  import _objectWithoutProperties from "@babel/runtime-corejs3/helpers/esm/objectWithoutProperties";
10
- var _excluded = ["onChange", "compareValues", "value", "children"];
10
+ var _excluded = ["onChange", "compareValues", "value", "children", "size", "sparse", "mode", "alignItems"];
11
11
 
12
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
13
 
@@ -30,6 +30,14 @@ function ChipListMulti(_ref) {
30
30
  compareValues = _ref$compareValues === void 0 ? compareValuesDefault : _ref$compareValues,
31
31
  value = _ref.value,
32
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$mode = _ref.mode,
38
+ mode = _ref$mode === void 0 ? 'classic' : _ref$mode,
39
+ _ref$alignItems = _ref.alignItems,
40
+ alignItems = _ref$alignItems === void 0 ? 'left' : _ref$alignItems,
33
41
  props = _objectWithoutProperties(_ref, _excluded);
34
42
 
35
43
  return /*#__PURE__*/React.createElement(ChipListBase, _objectSpread({
@@ -43,7 +51,11 @@ function ChipListMulti(_ref) {
43
51
  }) : _concatInstanceProperty(_context = []).call(_context, _toConsumableArray(value), [changedValue]);
44
52
 
45
53
  _onChange(newValues);
46
- }
54
+ },
55
+ size: size,
56
+ sparse: sparse,
57
+ mode: mode,
58
+ alignItems: alignItems
47
59
  }, props), children);
48
60
  }
49
61
 
@@ -54,6 +66,7 @@ ChipListMulti.propTypes = {
54
66
  theme: PropTypes.oneOf(['light', 'dark']),
55
67
  className: PropTypes.string,
56
68
  mode: PropTypes.oneOf(['classic', 'rock']),
69
+ alignItems: PropTypes.oneOf(['left', 'center', 'right']),
57
70
  value: PropTypes.array.isRequired,
58
71
  onChange: PropTypes.func.isRequired,
59
72
  compareValues: PropTypes.func,
package/lib/chip-list.d.ts CHANGED
@@ -1,6 +1,6 @@
1
1
  import React from 'react';
2
2
  import { Theme } from '@rescui/ui-contexts';
3
- import { ChipListSizeType, ChipListModeType } from './parts/types';
3
+ import { ChipListSizeType, ChipListModeType, ChipListAlignItemsType } from './parts/types';
4
4
  export declare const compareValuesDefault: <V>(activeValue: V, value: V) => boolean;
5
5
  export declare type ChipListProps<ValueType> = {
6
6
  className?: string;
@@ -9,6 +9,7 @@ export declare type ChipListProps<ValueType> = {
9
9
  sparse?: boolean;
10
10
  theme?: Theme;
11
11
  mode?: ChipListModeType;
12
+ alignItems?: ChipListAlignItemsType;
12
13
  value: ValueType;
13
14
  onChange: (value: ValueType) => void;
14
15
  children: React.ReactNode;
@@ -16,7 +17,7 @@ export declare type ChipListProps<ValueType> = {
16
17
  /** Identifier for e2e tests */
17
18
  'data-e2e'?: string;
18
19
  };
19
- export declare function ChipList<ValueType>({ children, compareValues, value, onChange, ...props }: ChipListProps<ValueType>): JSX.Element;
20
+ export declare function ChipList<ValueType>({ children, compareValues, value, onChange, size, sparse, mode, alignItems, ...props }: ChipListProps<ValueType>): JSX.Element;
20
21
  export declare namespace ChipList {
21
22
  var displayName: string;
22
23
  var propTypes: {};
package/lib/chip-list.js CHANGED
@@ -7,7 +7,7 @@ import _Object$getOwnPropertyDescriptor from "@babel/runtime-corejs3/core-js-sta
7
7
  import _Object$getOwnPropertyDescriptors from "@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptors";
8
8
  import _defineProperty from "@babel/runtime-corejs3/helpers/esm/defineProperty";
9
9
  import _objectWithoutProperties from "@babel/runtime-corejs3/helpers/esm/objectWithoutProperties";
10
- var _excluded = ["children", "compareValues", "value", "onChange"];
10
+ var _excluded = ["children", "compareValues", "value", "onChange", "size", "sparse", "mode", "alignItems"];
11
11
 
12
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
13
 
@@ -27,6 +27,14 @@ function ChipList(_ref) {
27
27
  _compareValues = _ref$compareValues === void 0 ? compareValuesDefault : _ref$compareValues,
28
28
  value = _ref.value,
29
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$mode = _ref.mode,
35
+ mode = _ref$mode === void 0 ? 'classic' : _ref$mode,
36
+ _ref$alignItems = _ref.alignItems,
37
+ alignItems = _ref$alignItems === void 0 ? 'left' : _ref$alignItems,
30
38
  props = _objectWithoutProperties(_ref, _excluded);
31
39
 
32
40
  return /*#__PURE__*/React.createElement(ChipListBase, _objectSpread({
@@ -34,7 +42,11 @@ function ChipList(_ref) {
34
42
  return _compareValues(activeValues[0], compareVal);
35
43
  },
36
44
  onChange: onChange,
37
- value: [value]
45
+ value: [value],
46
+ size: size,
47
+ sparse: sparse,
48
+ mode: mode,
49
+ alignItems: alignItems
38
50
  }, props), children);
39
51
  }
40
52
 
@@ -45,6 +57,7 @@ ChipList.propTypes = {
45
57
  theme: PropTypes.oneOf(['light', 'dark']),
46
58
  className: PropTypes.string,
47
59
  mode: PropTypes.oneOf(['classic', 'rock']),
60
+ alignItems: PropTypes.oneOf(['left', 'center', 'right']),
48
61
  value: PropTypes.any.isRequired,
49
62
  onChange: PropTypes.func.isRequired,
50
63
  compareValues: PropTypes.func,
package/lib/index.css CHANGED
@@ -1,4 +1,4 @@
1
- ._chipsContainer_ssyhux_9{
1
+ ._chipsContainer_uw0ny_9{
2
2
  position:relative;
3
3
 
4
4
  display:-webkit-box;
@@ -10,76 +10,91 @@
10
10
  flex-wrap:wrap;
11
11
  }
12
12
 
13
- ._sizeXs_ssyhux_15 ._chipsContainer_ssyhux_9{
13
+ ._sizeXs_uw0ny_15 ._chipsContainer_uw0ny_9{
14
14
  margin-top:-12px;
15
15
  }
16
16
 
17
17
  @media screen and (max-width: 640px){
18
18
 
19
- ._sizeXs_ssyhux_15 ._chipsContainer_ssyhux_9{
19
+ ._sizeXs_uw0ny_15 ._chipsContainer_uw0ny_9{
20
20
  margin-top:-8px
21
21
  }
22
22
  }
23
23
 
24
- ._sizeS_ssyhux_23 ._chipsContainer_ssyhux_9,
25
- ._sizeM_ssyhux_24 ._chipsContainer_ssyhux_9{
24
+ ._sizeS_uw0ny_23 ._chipsContainer_uw0ny_9,
25
+ ._sizeM_uw0ny_24 ._chipsContainer_uw0ny_9{
26
26
  margin-top:-12px;
27
27
  }
28
28
 
29
- ._sizeL_ssyhux_28 ._chipsContainer_ssyhux_9{
29
+ ._sizeL_uw0ny_28 ._chipsContainer_uw0ny_9{
30
30
  margin-top:-16px;
31
31
  }
32
32
 
33
33
  @media screen and (max-width: 640px){
34
34
 
35
- ._sizeL_ssyhux_28 ._chipsContainer_ssyhux_9{
35
+ ._sizeL_uw0ny_28 ._chipsContainer_uw0ny_9{
36
36
  margin-top:-12px
37
37
  }
38
38
  }
39
39
 
40
- ._innerOffsetL_ssyhux_36._sizeL_ssyhux_28 ._chipsContainer_ssyhux_9,
41
- ._innerOffsetL_ssyhux_36._sizeM_ssyhux_24 ._chipsContainer_ssyhux_9{
40
+ ._innerOffsetL_uw0ny_36._sizeL_uw0ny_28 ._chipsContainer_uw0ny_9,
41
+ ._innerOffsetL_uw0ny_36._sizeM_uw0ny_24 ._chipsContainer_uw0ny_9{
42
42
  margin-right:-8px;
43
43
  margin-left:-8px;
44
44
  }
45
45
 
46
46
  @media screen and (max-width: 640px){
47
47
 
48
- ._innerOffsetL_ssyhux_36._sizeL_ssyhux_28 ._chipsContainer_ssyhux_9,
49
- ._innerOffsetL_ssyhux_36._sizeM_ssyhux_24 ._chipsContainer_ssyhux_9{
48
+ ._innerOffsetL_uw0ny_36._sizeL_uw0ny_28 ._chipsContainer_uw0ny_9,
49
+ ._innerOffsetL_uw0ny_36._sizeM_uw0ny_24 ._chipsContainer_uw0ny_9{
50
50
  margin-right:-4px;
51
51
  margin-left:-4px
52
52
  }
53
53
  }
54
54
 
55
- ._innerOffsetL_ssyhux_36._sizeS_ssyhux_23 ._chipsContainer_ssyhux_9,
56
- ._innerOffsetL_ssyhux_36._sizeXs_ssyhux_15 ._chipsContainer_ssyhux_9{
55
+ ._innerOffsetL_uw0ny_36._sizeS_uw0ny_23 ._chipsContainer_uw0ny_9,
56
+ ._innerOffsetL_uw0ny_36._sizeXs_uw0ny_15 ._chipsContainer_uw0ny_9{
57
57
  margin-right:-6px;
58
58
  margin-left:-6px;
59
59
  }
60
60
 
61
61
  @media screen and (max-width: 640px){
62
62
 
63
- ._innerOffsetL_ssyhux_36._sizeS_ssyhux_23 ._chipsContainer_ssyhux_9,
64
- ._innerOffsetL_ssyhux_36._sizeXs_ssyhux_15 ._chipsContainer_ssyhux_9{
63
+ ._innerOffsetL_uw0ny_36._sizeS_uw0ny_23 ._chipsContainer_uw0ny_9,
64
+ ._innerOffsetL_uw0ny_36._sizeXs_uw0ny_15 ._chipsContainer_uw0ny_9{
65
65
  margin-right:-4px;
66
66
  margin-left:-4px
67
67
  }
68
68
  }
69
69
 
70
- ._innerOffsetM_ssyhux_58 ._chipsContainer_ssyhux_9{
70
+ ._innerOffsetM_uw0ny_58 ._chipsContainer_uw0ny_9{
71
71
  margin-right:-4px;
72
72
  margin-left:-4px;
73
73
  }
74
74
 
75
75
  @media screen and (max-width: 640px){
76
76
 
77
- ._innerOffsetM_ssyhux_58 ._chipsContainer_ssyhux_9{
77
+ ._innerOffsetM_uw0ny_58 ._chipsContainer_uw0ny_9{
78
78
  margin-right:-4px;
79
79
  margin-left:-4px
80
80
  }
81
81
  }
82
- ._chip_ssyhux_9{
82
+ ._alignLeft_uw0ny_69{
83
+ -webkit-box-pack:left;
84
+ -ms-flex-pack:left;
85
+ justify-content:left;
86
+ }
87
+ ._alignCenter_uw0ny_72{
88
+ -webkit-box-pack:center;
89
+ -ms-flex-pack:center;
90
+ justify-content:center;
91
+ }
92
+ ._alignRight_uw0ny_75{
93
+ -webkit-box-pack:right;
94
+ -ms-flex-pack:right;
95
+ justify-content:right;
96
+ }
97
+ ._chip_uw0ny_9{
83
98
  position:relative;
84
99
  z-index:1;
85
100
 
@@ -132,95 +147,95 @@
132
147
  -moz-osx-font-smoothing:inherit;
133
148
  -webkit-appearance:none;
134
149
  }
135
- ._chip_ssyhux_9::-moz-focus-inner{
150
+ ._chip_uw0ny_9::-moz-focus-inner{
136
151
  padding:0;
137
152
 
138
153
  border:none;
139
154
  }
140
- ._chip_ssyhux_9:hover,
141
- ._chip_ssyhux_9:focus,
142
- ._chip_ssyhux_9:active{
155
+ ._chip_uw0ny_9:hover,
156
+ ._chip_uw0ny_9:focus,
157
+ ._chip_uw0ny_9:active{
143
158
  outline:none;
144
159
 
145
160
  text-decoration:none;
146
161
  }
147
- ._light_ssyhux_125 ._chip_ssyhux_9:focus[data-focus-method='key']{
162
+ ._light_uw0ny_135 ._chip_uw0ny_9:focus[data-focus-method='key']{
148
163
  -webkit-box-shadow:rgba(107, 87, 255, 0.8) 0 0 0 4px;
149
164
  -webkit-box-shadow:var(--rs-color-primary-t-dim-light-theme, rgba(107, 87, 255, 0.8)) 0 0 0 4px;
150
165
  box-shadow:rgba(107, 87, 255, 0.8) 0 0 0 4px;
151
166
  box-shadow:var(--rs-color-primary-t-dim-light-theme, rgba(107, 87, 255, 0.8)) 0 0 0 4px;
152
167
  }
153
- ._dark_ssyhux_130 ._chip_ssyhux_9:focus[data-focus-method='key']{
168
+ ._dark_uw0ny_140 ._chip_uw0ny_9:focus[data-focus-method='key']{
154
169
  -webkit-box-shadow:rgba(132, 115, 255,0.8) 0 0 0 4px;
155
170
  -webkit-box-shadow:var(--rs-color-primary-t-dim-dark-theme, rgba(132, 115, 255,0.8)) 0 0 0 4px;
156
171
  box-shadow:rgba(132, 115, 255,0.8) 0 0 0 4px;
157
172
  box-shadow:var(--rs-color-primary-t-dim-dark-theme, rgba(132, 115, 255,0.8)) 0 0 0 4px;
158
173
  }
159
- ._sizeXs_ssyhux_15 ._chip_ssyhux_9 {
174
+ ._sizeXs_uw0ny_15 ._chip_uw0ny_9 {
160
175
  padding: 1px 15px;
161
176
  border-width: 1px;
162
177
  }
163
- ._sizeS_ssyhux_23 ._chip_ssyhux_9 {
178
+ ._sizeS_uw0ny_23 ._chip_uw0ny_9 {
164
179
  padding: 5px 15px;
165
180
  border-width: 1px;
166
181
  }
167
- ._sizeM_ssyhux_24 ._chip_ssyhux_9 {
182
+ ._sizeM_uw0ny_24 ._chip_uw0ny_9 {
168
183
  padding: 7px 23px;
169
184
  border-width: 1px;
170
185
  }
171
- ._sizeL_ssyhux_28 ._chip_ssyhux_9 {
186
+ ._sizeL_uw0ny_28 ._chip_uw0ny_9 {
172
187
  padding: 11px 31px;
173
188
  border-width: 1px;
174
189
  }
175
- ._sizeXs_ssyhux_15 ._chip_ssyhux_9._selected_ssyhux_135 {
190
+ ._sizeXs_uw0ny_15 ._chip_uw0ny_9._selected_uw0ny_145 {
176
191
  padding: 0px 14px;
177
192
  border-width: 2px;
178
193
  }
179
- ._sizeS_ssyhux_23 ._chip_ssyhux_9._selected_ssyhux_135 {
194
+ ._sizeS_uw0ny_23 ._chip_uw0ny_9._selected_uw0ny_145 {
180
195
  padding: 4px 14px;
181
196
  border-width: 2px;
182
197
  }
183
- ._sizeM_ssyhux_24 ._chip_ssyhux_9._selected_ssyhux_135 {
198
+ ._sizeM_uw0ny_24 ._chip_uw0ny_9._selected_uw0ny_145 {
184
199
  padding: 6px 22px;
185
200
  border-width: 2px;
186
201
  }
187
- ._sizeL_ssyhux_28 ._chip_ssyhux_9._selected_ssyhux_135 {
202
+ ._sizeL_uw0ny_28 ._chip_uw0ny_9._selected_uw0ny_145 {
188
203
  padding: 10px 30px;
189
204
  border-width: 2px;
190
205
  }
191
- ._sizeXs_ssyhux_15 ._chip_ssyhux_9._withoutText_ssyhux_136 {
206
+ ._sizeXs_uw0ny_15 ._chip_uw0ny_9._withoutText_uw0ny_146 {
192
207
  padding: 1px 1px;
193
208
  border-width: 1px;
194
209
  }
195
- ._sizeS_ssyhux_23 ._chip_ssyhux_9._withoutText_ssyhux_136 {
210
+ ._sizeS_uw0ny_23 ._chip_uw0ny_9._withoutText_uw0ny_146 {
196
211
  padding: 5px 5px;
197
212
  border-width: 1px;
198
213
  }
199
- ._sizeM_ssyhux_24 ._chip_ssyhux_9._withoutText_ssyhux_136 {
214
+ ._sizeM_uw0ny_24 ._chip_uw0ny_9._withoutText_uw0ny_146 {
200
215
  padding: 7px 7px;
201
216
  border-width: 1px;
202
217
  }
203
- ._sizeL_ssyhux_28 ._chip_ssyhux_9._withoutText_ssyhux_136 {
218
+ ._sizeL_uw0ny_28 ._chip_uw0ny_9._withoutText_uw0ny_146 {
204
219
  padding: 11px 11px;
205
220
  border-width: 1px;
206
221
  }
207
- ._sizeXs_ssyhux_15 ._chip_ssyhux_9._selected_ssyhux_135._withoutText_ssyhux_136 {
222
+ ._sizeXs_uw0ny_15 ._chip_uw0ny_9._selected_uw0ny_145._withoutText_uw0ny_146 {
208
223
  padding: 0px 0px;
209
224
  border-width: 2px;
210
225
  }
211
- ._sizeS_ssyhux_23 ._chip_ssyhux_9._selected_ssyhux_135._withoutText_ssyhux_136 {
226
+ ._sizeS_uw0ny_23 ._chip_uw0ny_9._selected_uw0ny_145._withoutText_uw0ny_146 {
212
227
  padding: 4px 4px;
213
228
  border-width: 2px;
214
229
  }
215
- ._sizeM_ssyhux_24 ._chip_ssyhux_9._selected_ssyhux_135._withoutText_ssyhux_136 {
230
+ ._sizeM_uw0ny_24 ._chip_uw0ny_9._selected_uw0ny_145._withoutText_uw0ny_146 {
216
231
  padding: 6px 6px;
217
232
  border-width: 2px;
218
233
  }
219
- ._sizeL_ssyhux_28 ._chip_ssyhux_9._selected_ssyhux_135._withoutText_ssyhux_136 {
234
+ ._sizeL_uw0ny_28 ._chip_uw0ny_9._selected_uw0ny_145._withoutText_uw0ny_146 {
220
235
  padding: 10px 10px;
221
236
  border-width: 2px;
222
237
  }
223
- ._sizeXs_ssyhux_15 ._chip_ssyhux_9{
238
+ ._sizeXs_uw0ny_15 ._chip_uw0ny_9{
224
239
  letter-spacing:0.0045em;
225
240
  font-family:'JetBrains Sans', Inter, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Droid Sans', 'Helvetica Neue', Arial, sans-serif;
226
241
  font-family:var(--rs-font-family-ui, var(--rs-font-family-jb-sans, 'JetBrains Sans', Inter, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Droid Sans', 'Helvetica Neue', Arial, sans-serif));
@@ -231,21 +246,21 @@
231
246
  line-height:20px;
232
247
  line-height:var(--rs-text-3-line-height, 20px);
233
248
  }
234
- ._rs-reset-letter-spacing_ssyhux_1 ._sizeXs_ssyhux_15 ._chip_ssyhux_9{
249
+ ._rs-reset-letter-spacing_uw0ny_1 ._sizeXs_uw0ny_15 ._chip_uw0ny_9{
235
250
  letter-spacing:normal;
236
251
  }
237
- ._sizeXs_ssyhux_15 ._chip_ssyhux_9 {
252
+ ._sizeXs_uw0ny_15 ._chip_uw0ny_9 {
238
253
 
239
254
  margin-top:12px;
240
255
 
241
256
  border-radius:4px;
242
257
  }
243
258
  @media screen and (max-width: 640px){
244
- ._sizeXs_ssyhux_15 ._chip_ssyhux_9{
259
+ ._sizeXs_uw0ny_15 ._chip_uw0ny_9{
245
260
  margin-top:8px
246
261
  }
247
262
  }
248
- ._sizeS_ssyhux_23 ._chip_ssyhux_9{
263
+ ._sizeS_uw0ny_23 ._chip_uw0ny_9{
249
264
  letter-spacing:0.0045em;
250
265
  font-family:'JetBrains Sans', Inter, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Droid Sans', 'Helvetica Neue', Arial, sans-serif;
251
266
  font-family:var(--rs-font-family-ui, var(--rs-font-family-jb-sans, 'JetBrains Sans', Inter, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Droid Sans', 'Helvetica Neue', Arial, sans-serif));
@@ -256,16 +271,16 @@
256
271
  line-height:20px;
257
272
  line-height:var(--rs-text-3-line-height, 20px);
258
273
  }
259
- ._rs-reset-letter-spacing_ssyhux_1 ._sizeS_ssyhux_23 ._chip_ssyhux_9{
274
+ ._rs-reset-letter-spacing_uw0ny_1 ._sizeS_uw0ny_23 ._chip_uw0ny_9{
260
275
  letter-spacing:normal;
261
276
  }
262
- ._sizeS_ssyhux_23 ._chip_ssyhux_9 {
277
+ ._sizeS_uw0ny_23 ._chip_uw0ny_9 {
263
278
 
264
279
  margin-top:12px;
265
280
 
266
281
  border-radius:24px;
267
282
  }
268
- ._sizeM_ssyhux_24 ._chip_ssyhux_9{
283
+ ._sizeM_uw0ny_24 ._chip_uw0ny_9{
269
284
  letter-spacing:0.0015em;
270
285
  font-family:'JetBrains Sans', Inter, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Droid Sans', 'Helvetica Neue', Arial, sans-serif;
271
286
  font-family:var(--rs-font-family-ui, var(--rs-font-family-jb-sans, 'JetBrains Sans', Inter, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Droid Sans', 'Helvetica Neue', Arial, sans-serif));
@@ -277,16 +292,16 @@
277
292
  line-height:24px;
278
293
  line-height:var(--rs-text-2-line-height, 24px);
279
294
  }
280
- ._rs-reset-letter-spacing_ssyhux_1 ._sizeM_ssyhux_24 ._chip_ssyhux_9{
295
+ ._rs-reset-letter-spacing_uw0ny_1 ._sizeM_uw0ny_24 ._chip_uw0ny_9{
281
296
  letter-spacing:normal;
282
297
  }
283
- ._sizeM_ssyhux_24 ._chip_ssyhux_9 {
298
+ ._sizeM_uw0ny_24 ._chip_uw0ny_9 {
284
299
 
285
300
  margin-top:12px;
286
301
 
287
302
  border-radius:24px;
288
303
  }
289
- ._sizeL_ssyhux_28 ._chip_ssyhux_9{
304
+ ._sizeL_uw0ny_28 ._chip_uw0ny_9{
290
305
  font-family:'JetBrains Sans', Inter, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Droid Sans', 'Helvetica Neue', Arial, sans-serif;
291
306
  font-family:var(--rs-font-family-ui, var(--rs-font-family-jb-sans, 'JetBrains Sans', Inter, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Droid Sans', 'Helvetica Neue', Arial, sans-serif));
292
307
  -webkit-font-feature-settings:"kern", "liga", "calt";
@@ -302,22 +317,22 @@
302
317
  border-radius:36px;
303
318
  }
304
319
  @media screen and (max-width: 640px){
305
- ._sizeL_ssyhux_28 ._chip_ssyhux_9{
320
+ ._sizeL_uw0ny_28 ._chip_uw0ny_9{
306
321
  margin-top:12px
307
322
  }
308
323
  }
309
- ._light_ssyhux_125._rock_ssyhux_179 ._chip_ssyhux_9{
324
+ ._light_uw0ny_135._rock_uw0ny_189 ._chip_uw0ny_9{
310
325
  border-color:rgba(25,25,28,0.3);
311
326
 
312
327
  color:#19191C;
313
328
  }
314
- ._light_ssyhux_125._rock_ssyhux_179 ._chip_ssyhux_9:focus{
329
+ ._light_uw0ny_135._rock_uw0ny_189 ._chip_uw0ny_9:focus{
315
330
  border-color:rgba(25,25,28,0.3);
316
331
 
317
332
  color:#19191C;
318
333
  }
319
334
  @media screen and (-ms-high-contrast: active),(-ms-high-contrast: none),(hover: hover){
320
- ._light_ssyhux_125._rock_ssyhux_179 ._chip_ssyhux_9:hover{
335
+ ._light_uw0ny_135._rock_uw0ny_189 ._chip_uw0ny_9:hover{
321
336
  border-color:rgba(25,25,28,0.3);
322
337
 
323
338
  color:#19191C;
@@ -325,30 +340,30 @@
325
340
  background:rgba(25,25,28,0.1);
326
341
  }
327
342
  }
328
- ._light_ssyhux_125._rock_ssyhux_179 ._chip_ssyhux_9:active{
343
+ ._light_uw0ny_135._rock_uw0ny_189 ._chip_uw0ny_9:active{
329
344
  border-color:#19191C;
330
345
 
331
346
  color:#19191C;
332
347
 
333
348
  background:rgba(25,25,28,0.1);
334
349
  }
335
- ._light_ssyhux_125._rock_ssyhux_179 ._chip_ssyhux_9._selected_ssyhux_135{
350
+ ._light_uw0ny_135._rock_uw0ny_189 ._chip_uw0ny_9._selected_uw0ny_145{
336
351
  border-color:#19191C;
337
352
 
338
353
  color:#19191C;
339
354
  }
340
- ._dark_ssyhux_130._rock_ssyhux_179 ._chip_ssyhux_9{
355
+ ._dark_uw0ny_140._rock_uw0ny_189 ._chip_uw0ny_9{
341
356
  border-color:rgba(255,255,255,0.3);
342
357
 
343
358
  color:#FFFFFF;
344
359
  }
345
- ._dark_ssyhux_130._rock_ssyhux_179 ._chip_ssyhux_9:focus{
360
+ ._dark_uw0ny_140._rock_uw0ny_189 ._chip_uw0ny_9:focus{
346
361
  border-color:rgba(255,255,255,0.4);
347
362
 
348
363
  color:#FFFFFF;
349
364
  }
350
365
  @media screen and (-ms-high-contrast: active),(-ms-high-contrast: none),(hover: hover){
351
- ._dark_ssyhux_130._rock_ssyhux_179 ._chip_ssyhux_9:hover{
366
+ ._dark_uw0ny_140._rock_uw0ny_189 ._chip_uw0ny_9:hover{
352
367
  border-color:rgba(255,255,255,0.4);
353
368
 
354
369
  color:#FFFFFF;
@@ -356,30 +371,30 @@
356
371
  background:rgba(255,255,255,0.1);
357
372
  }
358
373
  }
359
- ._dark_ssyhux_130._rock_ssyhux_179 ._chip_ssyhux_9:active{
374
+ ._dark_uw0ny_140._rock_uw0ny_189 ._chip_uw0ny_9:active{
360
375
  border-color:#FFFFFF;
361
376
 
362
377
  color:#FFFFFF;
363
378
 
364
379
  background:rgba(255,255,255,0.1);
365
380
  }
366
- ._dark_ssyhux_130._rock_ssyhux_179 ._chip_ssyhux_9._selected_ssyhux_135{
381
+ ._dark_uw0ny_140._rock_uw0ny_189 ._chip_uw0ny_9._selected_uw0ny_145{
367
382
  border-color:#FFFFFF;
368
383
 
369
384
  color:#FFFFFF;
370
385
  }
371
- ._light_ssyhux_125._classic_ssyhux_251 ._chip_ssyhux_9{
386
+ ._light_uw0ny_135._classic_uw0ny_261 ._chip_uw0ny_9{
372
387
  border-color:rgba(25,25,28,0.3);
373
388
 
374
389
  color:#19191C;
375
390
  }
376
- ._light_ssyhux_125._classic_ssyhux_251 ._chip_ssyhux_9:focus{
391
+ ._light_uw0ny_135._classic_uw0ny_261 ._chip_uw0ny_9:focus{
377
392
  border-color:rgba(25,25,28,0.3);
378
393
 
379
394
  color:#19191C;
380
395
  }
381
396
  @media screen and (-ms-high-contrast: active),(-ms-high-contrast: none),(hover: hover){
382
- ._light_ssyhux_125._classic_ssyhux_251 ._chip_ssyhux_9:hover{
397
+ ._light_uw0ny_135._classic_uw0ny_261 ._chip_uw0ny_9:hover{
383
398
  border-color:rgba(25,25,28,0.3);
384
399
 
385
400
  color:#19191C;
@@ -389,7 +404,7 @@
389
404
  background:var(--rs-color-primary-t-fog-light-theme, rgba(107, 87, 255,0.2));
390
405
  }
391
406
  }
392
- ._light_ssyhux_125._classic_ssyhux_251 ._chip_ssyhux_9:active{
407
+ ._light_uw0ny_135._classic_uw0ny_261 ._chip_uw0ny_9:active{
393
408
  border-color:#6B57FF;
394
409
  border-color:var(--rs-color-primary-light-theme, #6B57FF);
395
410
 
@@ -399,24 +414,24 @@
399
414
 
400
415
  background:var(--rs-color-primary-t-fog-light-theme, rgba(107, 87, 255,0.2));
401
416
  }
402
- ._light_ssyhux_125._classic_ssyhux_251 ._chip_ssyhux_9._selected_ssyhux_135{
417
+ ._light_uw0ny_135._classic_uw0ny_261 ._chip_uw0ny_9._selected_uw0ny_145{
403
418
  border-color:#6B57FF;
404
419
  border-color:var(--rs-color-primary-light-theme, #6B57FF);
405
420
 
406
421
  color:#19191C;
407
422
  }
408
- ._dark_ssyhux_130._classic_ssyhux_251 ._chip_ssyhux_9{
423
+ ._dark_uw0ny_140._classic_uw0ny_261 ._chip_uw0ny_9{
409
424
  border-color:rgba(255,255,255,0.3);
410
425
 
411
426
  color:#FFFFFF;
412
427
  }
413
- ._dark_ssyhux_130._classic_ssyhux_251 ._chip_ssyhux_9:focus{
428
+ ._dark_uw0ny_140._classic_uw0ny_261 ._chip_uw0ny_9:focus{
414
429
  border-color:rgba(255,255,255,0.4);
415
430
 
416
431
  color:#FFFFFF;
417
432
  }
418
433
  @media screen and (-ms-high-contrast: active),(-ms-high-contrast: none),(hover: hover){
419
- ._dark_ssyhux_130._classic_ssyhux_251 ._chip_ssyhux_9:hover{
434
+ ._dark_uw0ny_140._classic_uw0ny_261 ._chip_uw0ny_9:hover{
420
435
  border-color:rgba(255,255,255,0.4);
421
436
 
422
437
  color:#FFFFFF;
@@ -426,7 +441,7 @@
426
441
  background:var(--rs-color-primary-t-fog-dark-theme, rgba(132, 115, 255,0.3));
427
442
  }
428
443
  }
429
- ._dark_ssyhux_130._classic_ssyhux_251 ._chip_ssyhux_9:active{
444
+ ._dark_uw0ny_140._classic_uw0ny_261 ._chip_uw0ny_9:active{
430
445
  border-color:#8473FF;
431
446
  border-color:var(--rs-color-primary-dark-theme, #8473FF);
432
447
 
@@ -436,110 +451,110 @@
436
451
 
437
452
  background:var(--rs-color-primary-t-fog-dark-theme, rgba(132, 115, 255,0.3));
438
453
  }
439
- ._dark_ssyhux_130._classic_ssyhux_251 ._chip_ssyhux_9._selected_ssyhux_135{
454
+ ._dark_uw0ny_140._classic_uw0ny_261 ._chip_uw0ny_9._selected_uw0ny_145{
440
455
  border-color:#8473FF;
441
456
  border-color:var(--rs-color-primary-dark-theme, #8473FF);
442
457
 
443
458
  color:#FFFFFF;
444
459
  }
445
- ._innerOffsetL_ssyhux_36._sizeL_ssyhux_28 ._chip_ssyhux_9,
446
- ._innerOffsetL_ssyhux_36._sizeM_ssyhux_24 ._chip_ssyhux_9{
460
+ ._innerOffsetL_uw0ny_36._sizeL_uw0ny_28 ._chip_uw0ny_9,
461
+ ._innerOffsetL_uw0ny_36._sizeM_uw0ny_24 ._chip_uw0ny_9{
447
462
  margin-right:8px;
448
463
  margin-left:8px;
449
464
  }
450
465
  @media screen and (max-width: 640px){
451
- ._innerOffsetL_ssyhux_36._sizeL_ssyhux_28 ._chip_ssyhux_9,
452
- ._innerOffsetL_ssyhux_36._sizeM_ssyhux_24 ._chip_ssyhux_9{
466
+ ._innerOffsetL_uw0ny_36._sizeL_uw0ny_28 ._chip_uw0ny_9,
467
+ ._innerOffsetL_uw0ny_36._sizeM_uw0ny_24 ._chip_uw0ny_9{
453
468
  margin-right:4px;
454
469
  margin-left:4px
455
470
  }
456
471
  }
457
- ._innerOffsetL_ssyhux_36._sizeS_ssyhux_23 ._chip_ssyhux_9,
458
- ._innerOffsetL_ssyhux_36._sizeXs_ssyhux_15 ._chip_ssyhux_9{
472
+ ._innerOffsetL_uw0ny_36._sizeS_uw0ny_23 ._chip_uw0ny_9,
473
+ ._innerOffsetL_uw0ny_36._sizeXs_uw0ny_15 ._chip_uw0ny_9{
459
474
  margin-right:6px;
460
475
  margin-left:6px;
461
476
  }
462
477
  @media screen and (max-width: 640px){
463
- ._innerOffsetL_ssyhux_36._sizeS_ssyhux_23 ._chip_ssyhux_9,
464
- ._innerOffsetL_ssyhux_36._sizeXs_ssyhux_15 ._chip_ssyhux_9{
478
+ ._innerOffsetL_uw0ny_36._sizeS_uw0ny_23 ._chip_uw0ny_9,
479
+ ._innerOffsetL_uw0ny_36._sizeXs_uw0ny_15 ._chip_uw0ny_9{
465
480
  margin-right:4px;
466
481
  margin-left:4px
467
482
  }
468
483
  }
469
- ._innerOffsetM_ssyhux_58 ._chip_ssyhux_9{
484
+ ._innerOffsetM_uw0ny_58 ._chip_uw0ny_9{
470
485
  margin-right:4px;
471
486
  margin-left:4px;
472
487
  }
473
488
  @media screen and (max-width: 640px){
474
- ._innerOffsetM_ssyhux_58 ._chip_ssyhux_9{
489
+ ._innerOffsetM_uw0ny_58 ._chip_uw0ny_9{
475
490
  margin-right:4px;
476
491
  margin-left:4px
477
492
  }
478
493
  }
479
- ._icon_ssyhux_356{
494
+ ._icon_uw0ny_366{
480
495
  -webkit-box-flex:0;
481
496
  -ms-flex:0 0;
482
497
  flex:0 0;
483
498
  -ms-flex-preferred-size:auto;
484
499
  flex-basis:auto;
485
500
  }
486
- ._sizeXs_ssyhux_15 ._icon_ssyhux_356._iconLeft_ssyhux_360 {
501
+ ._sizeXs_uw0ny_15 ._icon_uw0ny_366._iconLeft_uw0ny_370 {
487
502
  width: 20px;
488
503
  height: 20px;
489
504
  min-width: 20px;
490
505
  min-height: 20px;
491
506
  margin: 0 8px 0 -2px;
492
507
  }
493
- ._sizeS_ssyhux_23 ._icon_ssyhux_356._iconLeft_ssyhux_360 {
508
+ ._sizeS_uw0ny_23 ._icon_uw0ny_366._iconLeft_uw0ny_370 {
494
509
  width: 20px;
495
510
  height: 20px;
496
511
  min-width: 20px;
497
512
  min-height: 20px;
498
513
  margin: 0 8px 0 -2px;
499
514
  }
500
- ._sizeM_ssyhux_24 ._icon_ssyhux_356._iconLeft_ssyhux_360 {
515
+ ._sizeM_uw0ny_24 ._icon_uw0ny_366._iconLeft_uw0ny_370 {
501
516
  width: 24px;
502
517
  height: 24px;
503
518
  min-width: 24px;
504
519
  min-height: 24px;
505
520
  margin: 0 8px 0 -2px;
506
521
  }
507
- ._sizeL_ssyhux_28 ._icon_ssyhux_356._iconLeft_ssyhux_360 {
522
+ ._sizeL_uw0ny_28 ._icon_uw0ny_366._iconLeft_uw0ny_370 {
508
523
  width: 28px;
509
524
  height: 28px;
510
525
  min-width: 28px;
511
526
  min-height: 28px;
512
527
  margin: 0 16px 0 -2px;
513
528
  }
514
- ._sizeXs_ssyhux_15 ._icon_ssyhux_356._iconRight_ssyhux_361 {
529
+ ._sizeXs_uw0ny_15 ._icon_uw0ny_366._iconRight_uw0ny_371 {
515
530
  width: 20px;
516
531
  height: 20px;
517
532
  min-width: 20px;
518
533
  min-height: 20px;
519
534
  margin: 0 -2px 0 8px;
520
535
  }
521
- ._sizeS_ssyhux_23 ._icon_ssyhux_356._iconRight_ssyhux_361 {
536
+ ._sizeS_uw0ny_23 ._icon_uw0ny_366._iconRight_uw0ny_371 {
522
537
  width: 20px;
523
538
  height: 20px;
524
539
  min-width: 20px;
525
540
  min-height: 20px;
526
541
  margin: 0 -2px 0 8px;
527
542
  }
528
- ._sizeM_ssyhux_24 ._icon_ssyhux_356._iconRight_ssyhux_361 {
543
+ ._sizeM_uw0ny_24 ._icon_uw0ny_366._iconRight_uw0ny_371 {
529
544
  width: 24px;
530
545
  height: 24px;
531
546
  min-width: 24px;
532
547
  min-height: 24px;
533
548
  margin: 0 -2px 0 8px;
534
549
  }
535
- ._sizeL_ssyhux_28 ._icon_ssyhux_356._iconRight_ssyhux_361 {
550
+ ._sizeL_uw0ny_28 ._icon_uw0ny_366._iconRight_uw0ny_371 {
536
551
  width: 28px;
537
552
  height: 28px;
538
553
  min-width: 28px;
539
554
  min-height: 28px;
540
555
  margin: 0 -2px 0 16px;
541
556
  }
542
- ._withoutText_ssyhux_136 ._icon_ssyhux_356._iconRight_ssyhux_361,
543
- ._withoutText_ssyhux_136 ._icon_ssyhux_356._iconLeft_ssyhux_360{
557
+ ._withoutText_uw0ny_146 ._icon_uw0ny_366._iconRight_uw0ny_371,
558
+ ._withoutText_uw0ny_146 ._icon_uw0ny_366._iconLeft_uw0ny_370{
544
559
  margin:0;
545
560
  }
package/lib/parts/chip-list-base.d.ts CHANGED
@@ -1,6 +1,6 @@
1
1
  import React from 'react';
2
2
  import { Theme } from '@rescui/ui-contexts';
3
- import { ChipListSizeType, ChipListModeType } from './types';
3
+ import { ChipListSizeType, ChipListModeType, ChipListAlignItemsType } from './types';
4
4
  export declare type ChipListBaseProps<V> = {
5
5
  className?: string;
6
6
  size?: ChipListSizeType;
@@ -8,6 +8,7 @@ export declare type ChipListBaseProps<V> = {
8
8
  sparse?: boolean;
9
9
  theme?: Theme;
10
10
  mode?: ChipListModeType;
11
+ alignItems?: ChipListAlignItemsType;
11
12
  value: V[];
12
13
  onChange: (value: V) => void;
13
14
  children: React.ReactNode;
@@ -15,4 +16,4 @@ export declare type ChipListBaseProps<V> = {
15
16
  /** Identifier for e2e tests */
16
17
  'data-e2e'?: string;
17
18
  };
18
- export declare function ChipListBase<V>({ size, sparse, className, mode, theme: themeFromProps, value, onChange, compareValues, children, ['data-e2e']: e2eId }: ChipListBaseProps<V>): JSX.Element;
19
+ export declare function ChipListBase<V>({ size, sparse, className, mode, alignItems, theme: themeFromProps, value, onChange, compareValues, children, ['data-e2e']: e2eId }: ChipListBaseProps<V>): JSX.Element;
package/lib/parts/chip-list-base.js CHANGED
@@ -10,6 +10,11 @@ var STYLES_SIZES = {
10
10
  m: styles.sizeM,
11
11
  l: styles.sizeL
12
12
  };
13
+ var ALIGN_ITEMS_STYLES = {
14
+ left: styles.alignLeft,
15
+ center: styles.alignCenter,
16
+ right: styles.alignRight
17
+ };
13
18
 
14
19
  function ChipListBase(_ref) {
15
20
  var _ref$size = _ref.size,
@@ -19,6 +24,8 @@ function ChipListBase(_ref) {
19
24
  className = _ref.className,
20
25
  _ref$mode = _ref.mode,
21
26
  mode = _ref$mode === void 0 ? 'classic' : _ref$mode,
27
+ _ref$alignItems = _ref.alignItems,
28
+ alignItems = _ref$alignItems === void 0 ? 'left' : _ref$alignItems,
22
29
  themeFromProps = _ref.theme,
23
30
  value = _ref.value,
24
31
  onChange = _ref.onChange,
@@ -45,7 +52,7 @@ function ChipListBase(_ref) {
45
52
  "data-e2e": e2eId ? "".concat(e2eId, "__chips-container") : null,
46
53
  "data-test": 'chip-list'
47
54
  }, /*#__PURE__*/React.createElement("div", {
48
- className: styles.chipsContainer
55
+ className: cn(styles.chipsContainer, ALIGN_ITEMS_STYLES[alignItems])
49
56
  }, childrenWithValues)));
50
57
  }
51
58
 
package/lib/parts/chip-list.p.module.css.js CHANGED
@@ -1,21 +1,24 @@
1
1
  var styles = {
2
- "chipsContainer": "_chipsContainer_ssyhux_9",
3
- "sizeXs": "_sizeXs_ssyhux_15",
4
- "sizeS": "_sizeS_ssyhux_23",
5
- "sizeM": "_sizeM_ssyhux_24",
6
- "sizeL": "_sizeL_ssyhux_28",
7
- "innerOffsetL": "_innerOffsetL_ssyhux_36",
8
- "innerOffsetM": "_innerOffsetM_ssyhux_58",
9
- "chip": "_chip_ssyhux_9",
10
- "light": "_light_ssyhux_125",
11
- "dark": "_dark_ssyhux_130",
12
- "selected": "_selected_ssyhux_135",
13
- "withoutText": "_withoutText_ssyhux_136",
14
- "rs-reset-letter-spacing": "_rs-reset-letter-spacing_ssyhux_1",
15
- "rock": "_rock_ssyhux_179",
16
- "classic": "_classic_ssyhux_251",
17
- "icon": "_icon_ssyhux_356",
18
- "iconLeft": "_iconLeft_ssyhux_360",
19
- "iconRight": "_iconRight_ssyhux_361"
2
+ "chipsContainer": "_chipsContainer_uw0ny_9",
3
+ "sizeXs": "_sizeXs_uw0ny_15",
4
+ "sizeS": "_sizeS_uw0ny_23",
5
+ "sizeM": "_sizeM_uw0ny_24",
6
+ "sizeL": "_sizeL_uw0ny_28",
7
+ "innerOffsetL": "_innerOffsetL_uw0ny_36",
8
+ "innerOffsetM": "_innerOffsetM_uw0ny_58",
9
+ "alignLeft": "_alignLeft_uw0ny_69",
10
+ "alignCenter": "_alignCenter_uw0ny_72",
11
+ "alignRight": "_alignRight_uw0ny_75",
12
+ "chip": "_chip_uw0ny_9",
13
+ "light": "_light_uw0ny_135",
14
+ "dark": "_dark_uw0ny_140",
15
+ "selected": "_selected_uw0ny_145",
16
+ "withoutText": "_withoutText_uw0ny_146",
17
+ "rs-reset-letter-spacing": "_rs-reset-letter-spacing_uw0ny_1",
18
+ "rock": "_rock_uw0ny_189",
19
+ "classic": "_classic_uw0ny_261",
20
+ "icon": "_icon_uw0ny_366",
21
+ "iconLeft": "_iconLeft_uw0ny_370",
22
+ "iconRight": "_iconRight_uw0ny_371"
20
23
  };
21
24
  export { styles as default };
package/lib/parts/chip.d.ts CHANGED
@@ -2,6 +2,10 @@ import React from 'react';
2
2
  import { ChipIconPosition } from './types';
3
3
  export declare type ChipExplicitProps = {
4
4
  className?: string;
5
+ /**
6
+ * Chip value
7
+ * @type ValueType
8
+ */
5
9
  value?: unknown;
6
10
  /** @ignore */
7
11
  itemId?: number;
package/lib/parts/types.d.ts CHANGED
@@ -1,5 +1,6 @@
1
1
  export declare type ChipListSizeType = 'l' | 'm' | 's' | 'xs';
2
2
  export declare type ChipListModeType = 'classic' | 'rock';
3
+ export declare type ChipListAlignItemsType = 'left' | 'center' | 'right';
3
4
  export declare type ChipIconPosition = 'left' | 'right';
4
5
  export declare type ChipListContextType<V> = {
5
6
  onChange: (value: V) => void;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@rescui/chip-list",
3
- "version": "0.5.3",
3
+ "version": "0.6.1",
4
4
  "description": "",
5
5
  "license": "Apache-2.0",
6
6
  "author": "JetBrains",
@@ -17,8 +17,8 @@
17
17
  "dependencies": {
18
18
  "@babel/runtime-corejs3": "^7.14.0",
19
19
  "@juggle/resize-observer": "3.3.0",
20
- "@rescui/button": "^0.8.4",
21
- "@rescui/icons": "^0.10.4",
20
+ "@rescui/button": "^0.8.5",
21
+ "@rescui/icons": "^0.10.5",
22
22
  "classnames": "^2.2.6",
23
23
  "core-js": "^3.9.1"
24
24
  },
@@ -31,11 +31,11 @@
31
31
  "@rescui/colors": "^0.1.5",
32
32
  "@rescui/postcss-preset-library": "^0.1.0",
33
33
  "@rescui/scripts": "^0.1.7",
34
- "@rescui/typography": "^0.9.0",
34
+ "@rescui/typography": "^0.9.1",
35
35
  "@rescui/visual-regression": "^0.0.4"
36
36
  },
37
37
  "scripts": {
38
38
  "build": "rescui-scripts build"
39
39
  },
40
- "gitHead": "dabdf725c89406ff04be3ac8148a70db22648e27"
40
+ "gitHead": "ea688b60033d202e0eac03b46488d984730d638f"
41
41
  }