intelicoreact 0.1.19 → 0.1.20

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 (29) hide show
  1. package/dist/Atomic/FormElements/RadioInput/RadioInput.js +1 -1
  2. package/dist/Atomic/FormElements/RangeList/RangeList.js +296 -0
  3. package/dist/Atomic/FormElements/RangeList/RangeList.scss +124 -0
  4. package/dist/Atomic/FormElements/RangeList/RangeList.stories.js +101 -0
  5. package/dist/Atomic/FormElements/RangeList/partial/AnyOuterClass.scss +31 -0
  6. package/dist/Atomic/FormElements/Switcher/Switcher.stories.js +2 -2
  7. package/dist/Atomic/FormElements/Switcher/partial/{inner-class.scss → AnyOuterClass.scss} +1 -1
  8. package/dist/Atomic/FormElements/TextSwitcher/TextSwitcher.stories.js +2 -2
  9. package/dist/Atomic/FormElements/TextSwitcher/partial/{inner-class.module.scss → AnyOuterClass.scss} +1 -1
  10. package/dist/Atomic/UI/Status/Status.scss +2 -0
  11. package/dist/Molecular/SwitcherHide/SwitcherHide.stories.js +2 -2
  12. package/dist/Molecular/SwitcherHide/partial/{inner-class.scss → AnyOuterClass.scss} +1 -1
  13. package/dist/Molecular/SwitcherRadio/SwitcherRadio.js +23 -15
  14. package/dist/Molecular/SwitcherRadio/SwitcherRadio.scss +19 -15
  15. package/dist/Molecular/SwitcherRadio/SwitcherRadio.stories.js +26 -13
  16. package/dist/Molecular/SwitcherRadio/partial/AnyOuterClass.scss +6 -0
  17. package/dist/Molecular/SwitcherRangeList/SwitcherRangeList.js +16 -0
  18. package/dist/Molecular/SwitcherRangeList/SwitcherRangeList.scss +12 -0
  19. package/dist/Molecular/SwitcherRangeList/SwitcherRangeList.stories.js +19 -0
  20. package/dist/Molecular/SwitcherRangeList/partial/AnyOuterClass.scss +6 -0
  21. package/dist/Molecular/{FilterSelect/FilterSelect.js → SwitcherTagsDropdown/SwitcherTagsDropdown.js} +82 -43
  22. package/dist/Molecular/SwitcherTagsDropdown/SwitcherTagsDropdown.scss +48 -0
  23. package/dist/Molecular/SwitcherTagsDropdown/SwitcherTagsDropdown.stories.js +109 -0
  24. package/dist/Molecular/SwitcherTagsDropdown/partial/AnyOuterClass.scss +12 -0
  25. package/dist/Molecular/SwitcherTextarea/SwitcherTextarea.stories.js +2 -2
  26. package/dist/Molecular/SwitcherTextarea/partial/{inner-class.scss → AnyOuterClass.scss} +1 -1
  27. package/package.json +1 -1
  28. package/dist/Molecular/FilterSelect/FilterSelect.scss +0 -39
  29. package/dist/Molecular/FilterSelect/FilterSelect.stories.js +0 -81
@@ -37,7 +37,7 @@ var RadioInput = function RadioInput(_ref) {
37
37
  checked: checked === value,
38
38
  className: "".concat(RC, "__radio"),
39
39
  onChange: function onChange() {
40
- return _onChange(checked);
40
+ return _onChange(value);
41
41
  },
42
42
  name: name,
43
43
  disabled: disabled
@@ -0,0 +1,296 @@
1
+ "use strict";
2
+
3
+ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
+
5
+ Object.defineProperty(exports, "__esModule", {
6
+ value: true
7
+ });
8
+ exports.default = void 0;
9
+
10
+ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
11
+
12
+ var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
13
+
14
+ var _react = require("react");
15
+
16
+ var _fi = require("react-icons/fi");
17
+
18
+ var _classnames = _interopRequireDefault(require("classnames"));
19
+
20
+ var _Button = _interopRequireDefault(require("./../../UI/Button/Button"));
21
+
22
+ var _Input = _interopRequireDefault(require("../Input/Input"));
23
+
24
+ require("./RangeList.scss");
25
+
26
+ // import { numberFilter, numberFilterWithoutDots, rounded } from '../../../Functions/utils';
27
+ var RC = 'range-list';
28
+
29
+ var RangeListCell = function RangeListCell(_ref) {
30
+ var children = _ref.children,
31
+ idx = _ref.idx,
32
+ className = _ref.className;
33
+ return /*#__PURE__*/React.createElement("div", {
34
+ className: (0, _classnames.default)("".concat(RC, "__cell"), className, (0, _defineProperty2.default)({}, "".concat(RC, "__cell-").concat(idx), idx))
35
+ }, children);
36
+ };
37
+
38
+ var RangeListRow = function RangeListRow(_ref2) {
39
+ var from = _ref2.from,
40
+ to = _ref2.to,
41
+ idx = _ref2.idx;
42
+ return /*#__PURE__*/React.createElement("div", {
43
+ className: (0, _classnames.default)("".concat(RC, "__row"), "".concat(RC, "__values"), (0, _defineProperty2.default)({}, "".concat(RC, "__values_first-value"), idx === 0))
44
+ }, /*#__PURE__*/React.createElement(RangeListCell, {
45
+ idx: 1,
46
+ className: "".concat(RC, "__cell-value")
47
+ }, from), /*#__PURE__*/React.createElement(RangeListCell, {
48
+ idx: 2,
49
+ className: "".concat(RC, "__cell-value")
50
+ }, to), /*#__PURE__*/React.createElement(RangeListCell, {
51
+ idx: 3,
52
+ className: "".concat(RC, "__cell-action")
53
+ }, /*#__PURE__*/React.createElement(_fi.FiTrash2, null)));
54
+ };
55
+
56
+ var RangeList = function RangeList(props) {
57
+ // const { item, value: inputvalue, fields, onChange, type, isInteger, id: filterId, label, className } = props;
58
+ var className = props.className,
59
+ value = props.value;
60
+ return /*#__PURE__*/React.createElement("div", {
61
+ className: (0, _classnames.default)(RC, className)
62
+ }, /*#__PURE__*/React.createElement("div", {
63
+ className: (0, _classnames.default)("".concat(RC, "__row"), "".concat(RC, "__labels"))
64
+ }, /*#__PURE__*/React.createElement(RangeListCell, {
65
+ className: "".concat(RC, "__cell-label")
66
+ }, "From"), /*#__PURE__*/React.createElement(RangeListCell, {
67
+ className: "".concat(RC, "__cell-label")
68
+ }, "To")), /*#__PURE__*/React.createElement("div", {
69
+ className: (0, _classnames.default)("".concat(RC, "__row"), "".concat(RC, "__inputs"))
70
+ }, /*#__PURE__*/React.createElement(RangeListCell, {
71
+ className: "".concat(RC, "__cell-input")
72
+ }, /*#__PURE__*/React.createElement(_Input.default, {
73
+ value: 56
74
+ })), /*#__PURE__*/React.createElement(RangeListCell, {
75
+ className: "".concat(RC, "__cell-input")
76
+ }, /*#__PURE__*/React.createElement(_Input.default, {
77
+ value: 72
78
+ })), /*#__PURE__*/React.createElement(RangeListCell, {
79
+ className: "".concat(RC, "__cell-button")
80
+ }, /*#__PURE__*/React.createElement(_Button.default, null, "Add"))), value.map(function (row, idx) {
81
+ return /*#__PURE__*/React.createElement(RangeListRow, (0, _extends2.default)({}, row, {
82
+ idx: idx
83
+ }));
84
+ }));
85
+ };
86
+
87
+ var _default = RangeList; // import { useState } from 'react';
88
+ // import { FiTrash2 } from 'react-icons/fi';
89
+ // import cn from 'classnames';
90
+ // import Button from 'intelicoreact/dist/Atomic/UI/Button/Button';
91
+ // import { numberFilter, numberFilterWithoutDots, rounded } from '../../../Functions/utils';
92
+ // import Input from '../Input/Input';
93
+ // import './RangeList.scss';
94
+ // const RC = 'range-list';
95
+ // const RangeList = (props) => {
96
+ // const { item, value: inputvalue, fields, onChange, type, isInteger, id: filterId, label, className } = props;
97
+ // const [form, setForm] = useState(fields);
98
+ // const [error, setError] = useState('');
99
+ // const keyFrom = 'from';
100
+ // const keyTo = 'to';
101
+ // const additive = type === 'rangeList' && !isInteger ? 0.01 : 1;
102
+ // let value = inputvalue || [];
103
+ // value?.sort((a, b) => a[keyFrom] - b[keyFrom]);
104
+ // function removeRow(index) {
105
+ // value.splice(index, 1);
106
+ // setForm([...form]);
107
+ // onChange(value, 'value');
108
+ // }
109
+ // function addRange() {
110
+ // const from = parseFloat(rounded(form[0].value));
111
+ // let to = parseFloat(form[1].value);
112
+ // if (isNaN(to)) to = '';
113
+ // //const result = parseFloat(rounded(form[2]?.value)) || '0';
114
+ // if ((form[0] && isNaN(form[0]?.value)) || (form[1] && isNaN(form[1]?.value))) {
115
+ // setError('All fields required');
116
+ // return false;
117
+ // } else if (to !== '' && to <= from) {
118
+ // setError('Set a valid range');
119
+ // return false;
120
+ // } else if (isNaN(from) || (!from && isNaN(to)) || from < 0 || (!from && to <= 0)) {
121
+ // setError('Only numbers >=0 are allowed');
122
+ // return false;
123
+ // } else if (to && to - from < 0.05) {
124
+ // setError('range must be more than 0.05');
125
+ // return false;
126
+ // } else if (form[2]?.unit === '%') {
127
+ // setError(`${form[2]?.label} max 100`);
128
+ // return false;
129
+ // } else if (from > 999999 || (!!to && to > 999999)) {
130
+ // setError('You need to set a smaller number!');
131
+ // return false;
132
+ // } else if (from === to) {
133
+ // setError('You need to set a range');
134
+ // return false;
135
+ // } else if (!to) {
136
+ // setError('Set a valid range');
137
+ // return false;
138
+ // } else if (!!to && from > to) {
139
+ // setError('You need to set a valid range');
140
+ // return false;
141
+ // } else if (filterId && label === 'Age' && to > 99) {
142
+ // setError('99 is the maximum allowed value');
143
+ // return false;
144
+ // } else if (filterId && label === 'Age' && from < 18) {
145
+ // setError('18 is the minimum allowed value');
146
+ // return false;
147
+ // }
148
+ // const duplicate = value?.filter((e) => Number(e[keyFrom]) === from && Number(e[keyTo]) === to);
149
+ // if (duplicate.length) {
150
+ // setError('This range was already added');
151
+ // return false;
152
+ // }
153
+ // const newRanges = [];
154
+ // const prevItems = [];
155
+ // const postItems = [];
156
+ // const getRangeObject = (nFrom, nTo) => ({
157
+ // [keyFrom]: parseFloat(nFrom?.toFixed(3)),
158
+ // [keyTo]: nTo.toFixed ? parseFloat(nTo?.toFixed(3)) : nTo || '',
159
+ // });
160
+ // const [crossFrom, crossTo] = getFilter(value)?.reduce((res, data) => {
161
+ // if (data[keyFrom] === from) data[keyFrom] = from + additive;
162
+ // if (data[keyTo] === to) data[keyTo] = to - additive;
163
+ // if (isNaN(data[keyFrom])) data[keyFrom] = 0;
164
+ // if (data[keyTo] > 0 && from > data[keyTo]) {
165
+ // prevItems.push(data);
166
+ // } else if (to && data[keyFrom] > to) {
167
+ // postItems.push(data);
168
+ // } else if (!(from < data[keyFrom] && (!to || data[keyTo] < to))) {
169
+ // res.push(data);
170
+ // }
171
+ // return res;
172
+ // }, []);
173
+ // if (crossFrom && crossTo) {
174
+ // if (to === crossTo.from) {
175
+ // newRanges.push(...[getRangeObject(crossFrom[keyFrom], from), getRangeObject(to, crossTo[keyTo])]);
176
+ // } else {
177
+ // newRanges.push(...[getRangeObject(crossFrom[keyFrom], from), getRangeObject(from + additive, to)]);
178
+ // if (to) {
179
+ // newRanges.push(getRangeObject(to + additive, crossTo[keyTo]));
180
+ // }
181
+ // }
182
+ // } else if (crossFrom) {
183
+ // if (crossFrom[keyFrom] < from && crossFrom[keyTo] > to) {
184
+ // newRanges.push(getRangeObject(crossFrom[keyFrom], from));
185
+ // if (to) {
186
+ // newRanges.push(...[getRangeObject(from + additive, to), getRangeObject(to + additive, crossFrom[keyTo])]);
187
+ // } else {
188
+ // newRanges.push(getRangeObject(from + additive, ''));
189
+ // }
190
+ // } else if (crossFrom[keyFrom] > from) {
191
+ // newRanges.push(...[getRangeObject(from, to), getRangeObject(to + additive, crossFrom[keyTo])]);
192
+ // } else if (crossFrom && to - from > 1) {
193
+ // newRanges.push(...[getRangeObject(crossFrom[keyFrom], from), getRangeObject(from + additive, to)]);
194
+ // } else newRanges.push(getRangeObject(crossFrom[keyFrom], to));
195
+ // } else {
196
+ // newRanges.push(getRangeObject(from, to));
197
+ // }
198
+ // newRanges.unshift(...prevItems);
199
+ // newRanges.push(...postItems);
200
+ // value = newRanges;
201
+ // onChange(value);
202
+ // form.map((field) => (field.value = ''));
203
+ // setForm([...form]);
204
+ // }
205
+ // const handleFieldFocus = (key) => {
206
+ // if (key === keyTo && !form[0].value) {
207
+ // form[0].value = 0;
208
+ // setForm([...form]);
209
+ // }
210
+ // };
211
+ // const removeFiltersDots = (value) => {
212
+ // if (filterId) return numberFilterWithoutDots(value);
213
+ // return value;
214
+ // };
215
+ // function renderField(field) {
216
+ // return (
217
+ // <td key={field.key} style={{ padding: 0 }}>
218
+ // {field.label && <label className={`${RC}__input-label`}>{field.label}</label>}
219
+ // <div>
220
+ // <Input
221
+ // value={removeFiltersDots(field.value) || ''}
222
+ // onFocus={() => handleFieldFocus(field.key)}
223
+ // placeholder={field.placeholder}
224
+ // onChange={(e) => {
225
+ // let value = e || field.key !== 'max' ? numberFilter(e) : '';
226
+ // if (field.isInt) value = numberFilterWithoutDots(value);
227
+ // if (value < 0) value = '';
228
+ // else if (field.key === 'bonus' && value > 100) value = 100;
229
+ // //if (!field.value) onChange();
230
+ // field.value = value;
231
+ // setForm([...form]);
232
+ // setError('');
233
+ // }}
234
+ // />
235
+ // </div>
236
+ // </td>
237
+ // );
238
+ // }
239
+ // const renderRowNumbers = (row, field, index) => {
240
+ // if (field.key === 'max' && row.max === 999999999) row.max = '';
241
+ // else {
242
+ // if (field.key === 'bonus' && !row.bonus) row.bonus = '0';
243
+ // row[field.key] = row[field.key] !== '' ? Number(row[field.key]) : row[field.key];
244
+ // }
245
+ // return (
246
+ // <td key={index} className="table__cell">
247
+ // {filterId ? row[field.key] : row[field.key].toLocaleString('en-US', { minimumFractionDigits: isInteger ? 0 : 2 })}
248
+ // {row[field.key] || field.key === 'bonus' ? field.unit : ''}
249
+ // </td>
250
+ // );
251
+ // };
252
+ // function renderRow(row, index) {
253
+ // return (
254
+ // <tr key={index} className="bordered-tr">
255
+ // {form?.map((field, index) => renderRowNumbers(row, field, index))}
256
+ // <td className="table__cell range-list--trash-icon">
257
+ // <FiTrash2 className="pointer color--froly" onClick={() => removeRow(index)} />
258
+ // </td>
259
+ // </tr>
260
+ // );
261
+ // }
262
+ // function getFilter(data) {
263
+ // return data?.slice()?.filter(({ from, to }) => {
264
+ // return !([0, null].includes(from) && [0, null].includes(to));
265
+ // });
266
+ // };
267
+ // return (
268
+ // <table className={cn('range-list', ' w100', className)}>
269
+ // <tbody>
270
+ // <tr>
271
+ // {form?.map((field) => renderField(field))}
272
+ // <td style={{ padding: 0 }}>
273
+ // <Button type="primary" onClick={addRange} label="+ Add" />
274
+ // </td>
275
+ // </tr>
276
+ // <tr>
277
+ // <td colSpan={4}>
278
+ // <span className="input-classic__error">{error}</span>
279
+ // </td>
280
+ // </tr>
281
+ // {!value || !getFilter(value)?.length ? (
282
+ // <tr className="tableCustom__tr--first bordered-tr read-only">
283
+ // <td colSpan={4} className="table__cell text-left">
284
+ // Not set
285
+ // </td>
286
+ // </tr>
287
+ // ) : value ? (
288
+ // getFilter(value).map((row, index) => renderRow(row, index))
289
+ // ) : null}
290
+ // </tbody>
291
+ // </table>
292
+ // );
293
+ // };
294
+ // export default RangeList;
295
+
296
+ exports.default = _default;
@@ -0,0 +1,124 @@
1
+ @import "./../../../scss/vars";
2
+
3
+ .range-list {
4
+ --border-color: black;
5
+ --button-size: 56px;
6
+
7
+ --labels-font-size: 16px;
8
+ --inputs-font-size: 14px;
9
+ --values-font-size: 16px;
10
+ --button-text-font-size: 14px;
11
+
12
+ --labels-color: black;
13
+ --inputs-color: black;
14
+ --values-color: black;
15
+
16
+ --background-color: transparent;
17
+ --labels-background-color: transparent;
18
+ --inputs-background-color: transparent;
19
+ --tag-input-background-color: #fff;
20
+ --values-background-color: #fff;
21
+
22
+ width: 500px;
23
+ height: fit-content;
24
+ background-color: transparent;
25
+
26
+ &__row {
27
+ display: grid;
28
+ width: 100%;
29
+ height: 30px;
30
+ grid-template-columns: 1fr 1fr var(--button-size);
31
+ }
32
+
33
+ &__labels, &__inputs {
34
+ grid-column-gap: 2px;
35
+ }
36
+
37
+ &__labels {
38
+ margin-bottom: 10px;
39
+ background-color: var(--labels-background-color);
40
+
41
+ font-family: inherit;
42
+ font-style: inherit;
43
+ font-weight: 400;
44
+ font-size: var(--labels-font-size);
45
+ line-height: 24px;
46
+ color: var(--labels-color);
47
+ }
48
+
49
+ &__inputs {
50
+ margin-bottom: 6px;
51
+ background-color: var(--inputs-background-color);
52
+
53
+ font-family: inherit;
54
+ font-style: inherit;
55
+ font-weight: 400;
56
+ font-size: var(--inputs-font-size);
57
+ line-height: 24px;
58
+ color: var(--inputs-color);
59
+
60
+ & input {
61
+ background-color: var(--tag-input-background-color);
62
+ }
63
+ }
64
+
65
+ &__values {
66
+ background-color: var(--values-background-color);
67
+ border-bottom: 1px solid var(--border-color);
68
+ border-left: 1px solid var(--border-color);
69
+ border-right: 1px solid var(--border-color);
70
+
71
+ &_first-value {
72
+ border-top: 1px solid var(--border-color);
73
+ }
74
+
75
+ font-family: inherit;
76
+ font-style: inherit;
77
+ font-weight: 400;
78
+ font-size: var(--values-font-size);
79
+ line-height: 24px;
80
+ color: var(--values-color);
81
+ }
82
+
83
+ &__cell {
84
+ &>button {
85
+ width: 100%;
86
+ font-size: var(--button-text-font-size);
87
+ }
88
+
89
+ &-label, &-input input, &-value {
90
+ font-family: inherit;
91
+ font-style: inherit;
92
+ font-weight: inherit;
93
+ font-size: inherit;
94
+ line-height: inherit;
95
+ color: inherit;
96
+ }
97
+
98
+ &-label{
99
+ display: flex;
100
+ flex-flow: row nowrap;
101
+ justify-content: flex-start;
102
+ align-items: center;
103
+ }
104
+
105
+ &-value {
106
+ padding: 0 7.5px;
107
+ border-right: 1px solid var(--border-color);
108
+ display: flex;
109
+ flex-flow: row nowrap;
110
+ justify-content: flex-start;
111
+ align-items: center;
112
+ }
113
+
114
+ &-action {
115
+ display: flex;
116
+ flex-flow: row nowrap;
117
+ justify-content: center;
118
+ align-items: center;
119
+ cursor: pointer;
120
+
121
+ color: $color--froly;
122
+ }
123
+ }
124
+ }
@@ -0,0 +1,101 @@
1
+ "use strict";
2
+
3
+ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
+
5
+ var _typeof = require("@babel/runtime/helpers/typeof");
6
+
7
+ Object.defineProperty(exports, "__esModule", {
8
+ value: true
9
+ });
10
+ exports.RangeListTemplate = exports.default = void 0;
11
+
12
+ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
13
+
14
+ var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
15
+
16
+ var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
17
+
18
+ var _react = _interopRequireWildcard(require("react"));
19
+
20
+ var _RangeList = _interopRequireDefault(require("./RangeList"));
21
+
22
+ require("./partial/AnyOuterClass.scss");
23
+
24
+ var _excluded = ["includeOuterStyles"];
25
+
26
+ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
27
+
28
+ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
29
+
30
+ global.lng = 'en';
31
+ var _default = {
32
+ title: 'RangeList',
33
+ component: _RangeList.default
34
+ };
35
+ exports.default = _default;
36
+ var rootStyles = {
37
+ with: '100%',
38
+ padding: '20px',
39
+ backgroundColor: '#f7fafc'
40
+ };
41
+
42
+ var Template = function Template(args) {
43
+ var includeOuterStyles = args.includeOuterStyles,
44
+ restArgs = (0, _objectWithoutProperties2.default)(args, _excluded);
45
+
46
+ var _useState = (0, _react.useState)([{
47
+ from: 1,
48
+ to: 2
49
+ }, {
50
+ from: 5,
51
+ to: 7
52
+ }, {
53
+ from: 8,
54
+ to: 9
55
+ }]),
56
+ _useState2 = (0, _slicedToArray2.default)(_useState, 2),
57
+ value = _useState2[0],
58
+ setValue = _useState2[1]; // { from: 1, to: 2 }, { from: 5, to: 7 }, { from: 8, to: 9 }
59
+
60
+
61
+ return /*#__PURE__*/_react.default.createElement("div", {
62
+ style: rootStyles
63
+ }, /*#__PURE__*/_react.default.createElement(_RangeList.default, (0, _extends2.default)({}, restArgs, {
64
+ className: includeOuterStyles ? 'any-outer-class__range-list' : null,
65
+ value: value,
66
+ onChange: function (_onChange) {
67
+ function onChange(_x) {
68
+ return _onChange.apply(this, arguments);
69
+ }
70
+
71
+ onChange.toString = function () {
72
+ return _onChange.toString();
73
+ };
74
+
75
+ return onChange;
76
+ }(function (e) {
77
+ return onChange(e, 'value');
78
+ })
79
+ })));
80
+ }; // const { fields, onChange, type, isInteger, id: filterId, label, className } = props;
81
+
82
+
83
+ var RangeListTemplate = Template.bind({});
84
+ exports.RangeListTemplate = RangeListTemplate;
85
+ RangeListTemplate.args = {
86
+ includeOuterStyles: false // fields: [
87
+ // {label: 'From', key: 'from', type: 'number', init: '$'},
88
+ // {label: 'To', key: 'to', type: 'number', init: '$'}
89
+ // ],
90
+ // id: 306
91
+ // isActive: true
92
+ // isInteger: true
93
+ // isLabelBold: true
94
+ // isNoLabel: true
95
+ // label: "Age"
96
+ // listType: "rangeList"
97
+ // onChange: ƒ onChange(e)
98
+ // type: "switcherRangeList"
99
+ // value: (2) [{…}, {…}]
100
+
101
+ };
@@ -0,0 +1,31 @@
1
+ // @import url('https://fonts.googleapis.com/css2?family=Palette+Mosaic&family=Roboto:wght@300;400;500&display=swap');
2
+ @import url('https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500&display=swap');
3
+
4
+ .any-outer-class__range-list {
5
+ // font-family: 'Palette Mosaic', cursive;
6
+
7
+ font-family: 'Roboto', sans-serif;
8
+
9
+ --border-color: #f4f7f9;
10
+
11
+ --labels-font-size: 12px;
12
+ --inputs-font-size: 13px;
13
+ --values-font-size: 13px;
14
+ --button-text-font-size: 13px;
15
+
16
+ --labels-color: #1E1E2D;
17
+ --inputs-color: #1e1e2d;
18
+ --values-color: #1E1E2D;
19
+
20
+ .range-list__labels {
21
+ line-height: 20px;
22
+ }
23
+
24
+ .range-list__inputs {
25
+ font-weight: 300;
26
+ }
27
+
28
+ .range-list__values {
29
+ font-weight: 300;
30
+ }
31
+ }
@@ -17,7 +17,7 @@ var _react = _interopRequireWildcard(require("react"));
17
17
 
18
18
  var _Switcher = _interopRequireDefault(require("./Switcher"));
19
19
 
20
- require("./partial/inner-class.scss");
20
+ require("./partial/AnyOuterClass.scss");
21
21
 
22
22
  function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
23
23
 
@@ -48,5 +48,5 @@ SwitcherTemplate.args = {
48
48
  label: 'Test label',
49
49
  disabled: false,
50
50
  isLabelBold: true,
51
- className: 'inner-class__switcher'
51
+ className: 'any-outer-class__switcher'
52
52
  };
@@ -1,4 +1,4 @@
1
- .inner-class__switcher {
1
+ .any-outer-class__switcher {
2
2
  font-style: normal;
3
3
  font-size: 12px;
4
4
  line-height: 20px;
@@ -17,7 +17,7 @@ var _react = _interopRequireWildcard(require("react"));
17
17
 
18
18
  var _TextSwitcher = _interopRequireDefault(require("./TextSwitcher"));
19
19
 
20
- var _innerClassModule = _interopRequireDefault(require("./partial/inner-class.module.scss"));
20
+ require("./partial/AnyOuterClass.scss");
21
21
 
22
22
  function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
23
23
 
@@ -47,5 +47,5 @@ exports.TextSwitcherTemplate = TextSwitcherTemplate;
47
47
  TextSwitcherTemplate.args = {
48
48
  activeText: 'is',
49
49
  inactiveText: 'some long text',
50
- className: _innerClassModule.default['inner-class__text-switcher']
50
+ className: 'any-outer-class__text-switcher'
51
51
  };
@@ -1,4 +1,4 @@
1
- .inner-class__text-switcher {
1
+ .any-outer-class__text-switcher {
2
2
  height: 20px;
3
3
  font-size: 10px;
4
4
  }
@@ -72,3 +72,5 @@
72
72
  color: #777;
73
73
  }
74
74
  }
75
+
76
+ .mr-half {}
@@ -17,7 +17,7 @@ var _react = _interopRequireWildcard(require("react"));
17
17
 
18
18
  var _SwitcherHide = _interopRequireDefault(require("./SwitcherHide"));
19
19
 
20
- require("./partial/inner-class.scss");
20
+ require("./partial/AnyOuterClass.scss");
21
21
 
22
22
  function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
23
23
 
@@ -50,5 +50,5 @@ SwitcherHideTemplate.args = {
50
50
  // className '',
51
51
  disabled: false,
52
52
  isLabelBold: true,
53
- className: 'inner-class__switcher-hide'
53
+ className: 'any-outer-class__switcher-hide'
54
54
  };
@@ -1,4 +1,4 @@
1
- .inner-class__switcher-hide {
1
+ .any-outer-class__switcher-hide {
2
2
  font-style: normal;
3
3
  font-size: 12px;
4
4
  line-height: 20px;