@salutejs/plasma-new-hope 0.242.0-canary.1702.12829190112.0 → 0.242.0-canary.1709.12829247465.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (84) hide show
  1. package/cjs/components/Combobox/ComboboxNew/ui/Inner/Inner.js +1 -1
  2. package/cjs/components/Combobox/ComboboxNew/ui/Inner/Inner.js.map +1 -1
  3. package/cjs/components/DatePicker/RangeDate/RangeDate.js +21 -66
  4. package/cjs/components/DatePicker/RangeDate/RangeDate.js.map +1 -1
  5. package/cjs/components/Dropdown/ui/DropdownInner/DropdownInner.js +2 -1
  6. package/cjs/components/Dropdown/ui/DropdownInner/DropdownInner.js.map +1 -1
  7. package/cjs/components/Select/ui/Inner/Inner.js +1 -1
  8. package/cjs/components/Select/ui/Inner/Inner.js.map +1 -1
  9. package/emotion/cjs/components/Combobox/Combobox.template-doc.mdx +5 -0
  10. package/emotion/cjs/components/Combobox/ComboboxNew/ui/Inner/Inner.js +1 -1
  11. package/emotion/cjs/components/DatePicker/RangeDate/RangeDate.js +21 -66
  12. package/emotion/cjs/components/Dropdown/Dropdown.template-doc.mdx +4 -0
  13. package/emotion/cjs/components/Dropdown/ui/DropdownInner/DropdownInner.js +2 -1
  14. package/emotion/cjs/components/Select/Select.template-doc.mdx +441 -0
  15. package/emotion/cjs/components/Select/ui/Inner/Inner.js +1 -1
  16. package/emotion/cjs/examples/plasma_b2c/components/DatePicker/DatePicker.stories.tsx +7 -1
  17. package/emotion/cjs/examples/plasma_web/components/DatePicker/DatePicker.stories.tsx +7 -3
  18. package/emotion/es/components/Combobox/Combobox.template-doc.mdx +5 -0
  19. package/emotion/es/components/Combobox/ComboboxNew/ui/Inner/Inner.js +1 -1
  20. package/emotion/es/components/DatePicker/RangeDate/RangeDate.js +21 -66
  21. package/emotion/es/components/Dropdown/Dropdown.template-doc.mdx +4 -0
  22. package/emotion/es/components/Dropdown/ui/DropdownInner/DropdownInner.js +2 -1
  23. package/emotion/es/components/Select/Select.template-doc.mdx +441 -0
  24. package/emotion/es/components/Select/ui/Inner/Inner.js +1 -1
  25. package/emotion/es/examples/plasma_b2c/components/DatePicker/DatePicker.stories.tsx +7 -1
  26. package/emotion/es/examples/plasma_web/components/DatePicker/DatePicker.stories.tsx +7 -3
  27. package/es/components/Combobox/ComboboxNew/ui/Inner/Inner.js +1 -1
  28. package/es/components/Combobox/ComboboxNew/ui/Inner/Inner.js.map +1 -1
  29. package/es/components/DatePicker/RangeDate/RangeDate.js +21 -66
  30. package/es/components/DatePicker/RangeDate/RangeDate.js.map +1 -1
  31. package/es/components/Dropdown/ui/DropdownInner/DropdownInner.js +2 -1
  32. package/es/components/Dropdown/ui/DropdownInner/DropdownInner.js.map +1 -1
  33. package/es/components/Select/ui/Inner/Inner.js +1 -1
  34. package/es/components/Select/ui/Inner/Inner.js.map +1 -1
  35. package/package.json +2 -2
  36. package/styled-components/cjs/components/Combobox/Combobox.template-doc.mdx +5 -0
  37. package/styled-components/cjs/components/Combobox/ComboboxNew/ui/Inner/Inner.js +1 -1
  38. package/styled-components/cjs/components/DatePicker/RangeDate/RangeDate.js +21 -66
  39. package/styled-components/cjs/components/Dropdown/Dropdown.template-doc.mdx +4 -0
  40. package/styled-components/cjs/components/Dropdown/ui/DropdownInner/DropdownInner.js +2 -1
  41. package/styled-components/cjs/components/Select/Select.template-doc.mdx +441 -0
  42. package/styled-components/cjs/components/Select/ui/Inner/Inner.js +1 -1
  43. package/styled-components/cjs/examples/plasma_b2c/components/DatePicker/DatePicker.stories.tsx +7 -1
  44. package/styled-components/cjs/examples/plasma_web/components/DatePicker/DatePicker.stories.tsx +7 -3
  45. package/styled-components/es/components/Combobox/Combobox.template-doc.mdx +5 -0
  46. package/styled-components/es/components/Combobox/ComboboxNew/ui/Inner/Inner.js +1 -1
  47. package/styled-components/es/components/DatePicker/RangeDate/RangeDate.js +21 -66
  48. package/styled-components/es/components/Dropdown/Dropdown.template-doc.mdx +4 -0
  49. package/styled-components/es/components/Dropdown/ui/DropdownInner/DropdownInner.js +2 -1
  50. package/styled-components/es/components/Select/Select.template-doc.mdx +441 -0
  51. package/styled-components/es/components/Select/ui/Inner/Inner.js +1 -1
  52. package/styled-components/es/examples/plasma_b2c/components/DatePicker/DatePicker.stories.tsx +7 -1
  53. package/styled-components/es/examples/plasma_web/components/DatePicker/DatePicker.stories.tsx +7 -3
  54. package/types/components/Combobox/ComboboxNew/Combobox.types.d.ts +1 -1
  55. package/types/components/Combobox/ComboboxNew/Combobox.types.d.ts.map +1 -1
  56. package/types/components/Combobox/ComboboxNew/ui/Inner/ui/Item/Item.types.d.ts +6 -0
  57. package/types/components/Combobox/ComboboxNew/ui/Inner/ui/Item/Item.types.d.ts.map +1 -1
  58. package/types/components/DatePicker/RangeDate/RangeDate.d.ts +8 -10
  59. package/types/components/DatePicker/RangeDate/RangeDate.d.ts.map +1 -1
  60. package/types/components/DatePicker/RangeDate/RangeDate.styles.d.ts +12 -12
  61. package/types/components/DatePicker/RangeDate/RangeDate.types.d.ts +0 -4
  62. package/types/components/DatePicker/RangeDate/RangeDate.types.d.ts.map +1 -1
  63. package/types/components/DatePicker/SingleDate/SingleDate.types.d.ts +1 -1
  64. package/types/components/DatePicker/SingleDate/SingleDate.types.d.ts.map +1 -1
  65. package/types/components/Dropdown/ui/DropdownInner/DropdownInner.d.ts.map +1 -1
  66. package/types/components/Dropdown/ui/DropdownItem/DropdownItem.type.d.ts +5 -0
  67. package/types/components/Dropdown/ui/DropdownItem/DropdownItem.type.d.ts.map +1 -1
  68. package/types/components/Pagination/ui/PaginationSelectPerPage/PaginationSelectPerPage.styles.d.ts +4 -4
  69. package/types/components/Range/Range.types.d.ts +5 -5
  70. package/types/components/Range/Range.types.d.ts.map +1 -1
  71. package/types/components/Select/Select.types.d.ts +2 -2
  72. package/types/components/Select/Select.types.d.ts.map +1 -1
  73. package/types/components/Select/ui/Inner/ui/Item/Item.types.d.ts +11 -0
  74. package/types/components/Select/ui/Inner/ui/Item/Item.types.d.ts.map +1 -1
  75. package/types/examples/plasma_b2c/components/Combobox/Combobox.d.ts +24 -24
  76. package/types/examples/plasma_b2c/components/DatePicker/DatePicker.d.ts +4 -5
  77. package/types/examples/plasma_b2c/components/DatePicker/DatePicker.d.ts.map +1 -1
  78. package/types/examples/plasma_b2c/components/Range/Range.d.ts +12 -12
  79. package/types/examples/plasma_b2c/components/Select/Select.d.ts +4 -4
  80. package/types/examples/plasma_web/components/Combobox/Combobox.d.ts +24 -24
  81. package/types/examples/plasma_web/components/DatePicker/DatePicker.d.ts +4 -5
  82. package/types/examples/plasma_web/components/DatePicker/DatePicker.d.ts.map +1 -1
  83. package/types/examples/plasma_web/components/Range/Range.d.ts +12 -12
  84. package/types/examples/plasma_web/components/Select/Select.d.ts +4 -4
@@ -0,0 +1,441 @@
1
+ ---
2
+ id: select
3
+ title: Select
4
+ ---
5
+
6
+ import { PropsTable, Description, StorybookLink } from '@site/src/components';
7
+ import Tabs from '@theme/Tabs';
8
+ import TabItem from '@theme/TabItem';
9
+
10
+ # Select
11
+
12
+ <Description name="Select" />
13
+ <PropsTable name="Select" />
14
+
15
+ ## Использование
16
+ Обязательным параметром являются: `items`, `value` и `onChange`. Внутри items может быть такой же вложенный массив items. Формат следующий:
17
+
18
+ ```tsx
19
+ type Items = Array<{
20
+ /**
21
+ * Значение у item
22
+ */
23
+ value: string;
24
+ /**
25
+ * Метка-подпись к item
26
+ */
27
+ label: string;
28
+ /**
29
+ * Сторона открытия вложенного дропдауна относительно текущего элемента;
30
+ */
31
+ placement: SelectPlacement | Array<SelectPlacementBasic>;
32
+ /**
33
+ * Список дочерних items.
34
+ */
35
+ items?: Array<ItemOption>;
36
+ /**
37
+ * Item не активен
38
+ */
39
+ disabled?: boolean;
40
+ /**
41
+ * Слот для контента слева
42
+ */
43
+ contentLeft?: ReactNode;
44
+ /**
45
+ * Слот для контента справа
46
+ */
47
+ contentRight?: ReactNode;
48
+ /**
49
+ * Выбранный item.
50
+ * @deprecated
51
+ */
52
+ isActive?: boolean;
53
+ /**
54
+ * Кастомный цвет текста
55
+ * @deprecated
56
+ */
57
+ color?: string;
58
+ /**
59
+ * Айтем не активен
60
+ * @deprecated использовать disabled
61
+ */
62
+ isDisabled?: boolean;
63
+ }>;
64
+ ```
65
+
66
+ Тип выбора селекта - одиночный или множественный зависит от типа `value` и `onChange`. В одиночном value - `string`, в множественном - `Array<string>`.
67
+ Select может выглядеть как Button и как Textfield. За это отвечает пропс - `target`.\
68
+ Есть возможность прокидывать компонент `EmptyState` в пропс `renderList` для изменения содержимого выпадающего окна.\
69
+ Это нужно в случаях, когда произошла ошибка при загрузке `items`, либо когда `items` пустой. Более подробно в примерах.
70
+
71
+ ## Примеры
72
+
73
+ <Tabs>
74
+ <TabItem value="textfield" label="Textfield" default>
75
+ В режиме `textfield` доступны только следующие варианты `view`: `default`, `warning`, `positive` и `negative`.
76
+
77
+ ```tsx live
78
+ import React from 'react';
79
+ import { Select } from '@salutejs/{{ package }}';
80
+
81
+ export function App() {
82
+ const [singleValue, setSingleValue] = useState('');
83
+ const [multipleValue, setMultipleValue] = useState([]);
84
+
85
+ const items = [
86
+ {
87
+ value: 'north_america',
88
+ label: 'Северная Америка',
89
+ },
90
+ {
91
+ value: 'south_america',
92
+ label: 'Южная Америка',
93
+ items: [
94
+ {
95
+ value: 'brazil',
96
+ label: 'Бразилия',
97
+ },
98
+ {
99
+ value: 'argentina',
100
+ label: 'Аргентина',
101
+ },
102
+ ],
103
+ },
104
+ ];
105
+
106
+ return (
107
+ <div style=\{{ display: 'flex', gap: '30px', height: '300px' }}>
108
+ <div style=\{{width: '300px'}}>
109
+ <Select items={items} value={singleValue} onChange={setSingleValue} label="Label" placeholder="Placeholder" helperText="Helper text" />
110
+ </div>
111
+
112
+ <div style=\{{width: '300px'}}>
113
+ <Select multiselect items={items} value={multipleValue} onChange={setMultipleValue} label="Label" placeholder="Placeholder" helperText="Helper text" />
114
+ </div>
115
+ </div>
116
+ );
117
+ }
118
+ ```
119
+ </TabItem>
120
+ <TabItem value="button" label="Button">
121
+ В режиме `button` недоступны следующие пропсы: `contentLeft`, `label`, `labelPlacement`, `placeholder` и `helperText`.
122
+
123
+ ```tsx live
124
+ import React from 'react';
125
+ import { Select } from '@salutejs/{{ package }}';
126
+
127
+ export function App() {
128
+ const [singleValue, setSingleValue] = useState('');
129
+ const [multipleValue, setMultipleValue] = useState([]);
130
+
131
+ const items = [
132
+ {
133
+ value: 'north_america',
134
+ label: 'Северная Америка',
135
+ },
136
+ {
137
+ value: 'south_america',
138
+ label: 'Южная Америка',
139
+ items: [
140
+ {
141
+ value: 'brazil',
142
+ label: 'Бразилия',
143
+ },
144
+ {
145
+ value: 'argentina',
146
+ label: 'Аргентина',
147
+ },
148
+ ],
149
+ },
150
+ ];
151
+
152
+ return (
153
+ <div style=\{{ display: 'flex', gap: '30px', height: '300px' }}>
154
+ <div style=\{{width: '300px'}}>
155
+ <Select items={items} label="Single" target="button-like" value={singleValue} onChange={setSingleValue} />
156
+ </div>
157
+
158
+ <div style=\{{width: '300px'}}>
159
+ <Select multiselect items={items} label="Multiple" target="button-like" value={multipleValue} onChange={setMultipleValue} />
160
+ </div>
161
+ </div>
162
+ );
163
+ }
164
+ ```
165
+ </TabItem>
166
+ <TabItem value="predefined" label="Predefined">
167
+ Есть возможность задать значения по дефолту (главное, чтобы они находились в `items`). Также можно управлять состоянием снаружи селекта.
168
+
169
+ ```tsx live
170
+ import React from 'react';
171
+ import { Select, Button } from '@salutejs/{{ package }}';
172
+
173
+ export function App() {
174
+ const [multipleValue, setMultipleValue] = useState(['brazil', 'north_america']);
175
+
176
+ const items = [
177
+ {
178
+ value: 'north_america',
179
+ label: 'Северная Америка',
180
+ },
181
+ {
182
+ value: 'south_america',
183
+ label: 'Южная Америка',
184
+ items: [
185
+ {
186
+ value: 'brazil',
187
+ label: 'Бразилия',
188
+ },
189
+ {
190
+ value: 'argentina',
191
+ label: 'Аргентина',
192
+ },
193
+ ],
194
+ },
195
+ ];
196
+
197
+ return (
198
+ <div style=\{{ display: 'flex', gap: '30px', height: '300px' }}>
199
+ <div style=\{{width: '300px'}}>
200
+ <Select multiselect items={items} label="Label" placeholder="Placeholder" value={multipleValue} onChange={setMultipleValue} />
201
+ </div>
202
+
203
+ <Button onClick={() => setMultipleValue([])}>Очистить</Button>
204
+ </div>
205
+ );
206
+ }
207
+ ```
208
+ </TabItem>
209
+ <TabItem value="renderValue" label="Render value">
210
+ Пропс `renderValue` для кастомной настройки `value` внутри таргета. Принимает коллбэк с двумя параметрами: `value` и `label`.
211
+
212
+ ```tsx live
213
+ import React from 'react';
214
+ import { Select } from '@salutejs/{{ package }}';
215
+
216
+ export function App() {
217
+ const [singleValue, setSingleValue] = useState('');
218
+
219
+ const items = [
220
+ {
221
+ value: 'north_america',
222
+ label: 'Северная Америка',
223
+ },
224
+ {
225
+ value: 'south_america',
226
+ label: 'Южная Америка',
227
+ items: [
228
+ {
229
+ value: 'brazil',
230
+ label: 'Бразилия',
231
+ },
232
+ {
233
+ value: 'argentina',
234
+ label: 'Аргентина',
235
+ },
236
+ ],
237
+ },
238
+ ];
239
+
240
+ const renderValue = (itemData): string => {
241
+ if (!Array.isArray(itemData)) {
242
+ return `${itemData.value} - ${itemData.label}`;
243
+ }
244
+
245
+ return '';
246
+ };
247
+
248
+ return (
249
+ <div style=\{{ height: '300px' }}>
250
+ <div style=\{{ width: '300px' }}>
251
+ <Select
252
+ items={items}
253
+ label="Label"
254
+ placeholder="Placeholder"
255
+ value={singleValue}
256
+ onChange={setSingleValue}
257
+ renderValue={renderValue}
258
+ />
259
+ </div>
260
+ </div>
261
+ );
262
+ }
263
+ ```
264
+ </TabItem>
265
+ <TabItem value="renderItem" label="Render item">
266
+ `renderTarget` - для кастомной настройки таргета в Select. Принимает коллбэк с один параметром: `value`.
267
+ Пропс `renderItem` для кастомной настройки айтема в выпадающем списке. Принимает коллбэк с двумя параметрами: `value` и `label`.
268
+ В примере использован другой наш компонент - Cell.
269
+
270
+ ```tsx live
271
+ import React from 'react';
272
+ import { Select, Cell } from '@salutejs/{{ package }}';
273
+
274
+ export function App() {
275
+ const [multipleValue, setMultipleValue] = useState([]);
276
+
277
+ const items = [
278
+ {
279
+ value: 'north_america',
280
+ label: 'Северная Америка',
281
+ },
282
+ {
283
+ value: 'south_america',
284
+ label: 'Южная Америка',
285
+ },
286
+ ];
287
+
288
+ const renderTarget = (itemData) => {
289
+ if (Array.isArray(itemData)) {
290
+ if (itemData.length === 0) {
291
+ return (
292
+ <div style=\{{ padding: '0.5rem 0' }}>
293
+ <Cell
294
+ view="default"
295
+ title="Выберите страну"
296
+ subtitle="Subtitle"
297
+ label="Label"
298
+ />
299
+ </div>
300
+ );
301
+ }
302
+
303
+ const title = itemData.map((item) => item.label).join(', ');
304
+
305
+ return (
306
+ <div style=\{{ padding: '0.5rem 0.75rem' }}>
307
+ <Cell view="default" title={title} subtitle="Subtitle" label="Label" />
308
+ </div>
309
+ );
310
+ }
311
+ }
312
+
313
+ const renderItem = ({ value, label }) => (
314
+ <Cell
315
+ view="default"
316
+ title={label}
317
+ label="Top left"
318
+ contentRight={<Cell view="default" title="Bottom right" label="Top right" />}
319
+ />
320
+ )
321
+
322
+ return (
323
+ <div style=\{{ height: '300px' }}>
324
+ <div style=\{{ width: '400px' }}>
325
+ <Select
326
+ items={items}
327
+ value={multipleValue}
328
+ onChange={setMultipleValue}
329
+ multiselect
330
+ renderTarget={renderTarget}
331
+ renderItem={renderItem}
332
+ />
333
+ </div>
334
+ </div>
335
+ );
336
+ }
337
+ ```
338
+ </TabItem>
339
+ <TabItem value="portal" label="Portal">
340
+ Иногда возникает необходимость вынесения выпадающего списка на уровни выше в DOM. К примеру, когда у родительского блока имеется скролл, и список будет обрезаться, чего хотелось бы избежать.\
341
+ Для такой реализации имеется пропс `portal`, который принимает либо `ref` либо `id` html-тега.\
342
+ Также нужно прокинуть проп `listWidth`, чтобы явно задать ширину списку. Если этого не сделать, то будет взята ширина 100% от блока, на который ведет ссылка портала.
343
+
344
+ ```tsx live
345
+ import React, { useRef } from 'react';
346
+ import { Select } from '@salutejs/{{ package }}';
347
+
348
+ export function App() {
349
+ const [value, setValue] = useState('');
350
+
351
+ const items = [
352
+ {
353
+ value: 'north_america',
354
+ label: 'Северная Америка',
355
+ },
356
+ {
357
+ value: 'south_america',
358
+ label: 'Южная Америка',
359
+ items: [
360
+ {
361
+ value: 'brazil',
362
+ label: 'Бразилия',
363
+ },
364
+ {
365
+ value: 'argentina',
366
+ label: 'Аргентина',
367
+ },
368
+ ],
369
+ },
370
+ ];
371
+
372
+ const ref = useRef(null)
373
+
374
+ return (
375
+ <div style=\{{ position: "relative", height: "300px" }} ref={ref}>
376
+ <div style=\{{width: '300px'}}>
377
+ <Select items={items} label="Label" placeholder="Placeholder" value={value} onChange={setValue} portal={ref} listWidth="300px" />
378
+ </div>
379
+ </div>
380
+ );
381
+ }
382
+ ```
383
+ </TabItem>
384
+ <TabItem value="uncontrolled" label="Uncontrolled">
385
+ `value` и `onChange` - опциональные параметры. Если вы хотите `uncontrolled` вариант компонента - их пробрасывать необязательно.
386
+
387
+ ```tsx live
388
+ import React from 'react';
389
+ import { Select } from '@salutejs/{{ package }}';
390
+
391
+ export function App() {
392
+ const items = [
393
+ {
394
+ value: 'north_america',
395
+ label: 'Северная Америка',
396
+ },
397
+ {
398
+ value: 'south_america',
399
+ label: 'Южная Америка',
400
+ items: [
401
+ {
402
+ value: 'brazil',
403
+ label: 'Бразилия',
404
+ },
405
+ {
406
+ value: 'argentina',
407
+ label: 'Аргентина',
408
+ },
409
+ ],
410
+ },
411
+ ];
412
+
413
+ return (
414
+ <div style=\{{ height: '300px' }}>
415
+ <div style=\{{width: '300px'}}>
416
+ <Select items={items} label="Label" placeholder="Placeholder" />
417
+ </div>
418
+ </div>
419
+ );
420
+ }
421
+ ```
422
+ </TabItem>
423
+ </Tabs>
424
+
425
+ ## Клавиатурная навигация
426
+
427
+ Данный компонент соответствует требования W3C: [Combobox](https://www.w3.org/WAI/ARIA/apg/patterns/combobox/) и частично [TreeView](https://www.w3.org/WAI/ARIA/apg/patterns/treeview/).
428
+
429
+ - `Tab` - закрывает дропдаун. Перемещает фокус на следующий элемент на странице;
430
+ - `Enter` - открывает/закрывает дропдаун. Если на элементе - выбирает его. Если у элемента есть дочерний дропдаун - открывает его, выбор элемента не происходит;
431
+ - `Space` - открывает/закрывает дропдаун. Если на элементе - выбирает его и все дочерние элементы.
432
+ - `Home` - открывает дропдаун и перемещает фокус на первый элемент;
433
+ - `End` - открывает дропдаун и перемещает фокус на последний элемент;
434
+ - `PageUp` - перемещает фокус на 10 элементов выше либо в начало списка;
435
+ - `PageDown` - перемещает фокус на 10 элементов ниже либо в конце списка;
436
+ - `ArrowUp` - открывает дропдаун и перемещает фокус на первый элемент. Перемещает фокус на один элемент выше;
437
+ - `ArrowDown` - открывает дропдаун и перемещает фокус на первый элемент. Перемещает фокус на один элемент ниже;
438
+ - `ArrowRight` - если фокус на элементе вложенного списка - открывает его и перемещает фокус на первый элемент; Если фокус на таргете - переходит в режим выбора чипа.
439
+ - `ArrowLeft` - закрывает текущий список и перемещает фокус на предыдущий; Если фокус на таргете - переходит в режим выбора чипа.
440
+ - `Backspace` - только если фокус на чипе - снимает выбор с текущего значения;
441
+
@@ -32,7 +32,7 @@ export var Inner = function Inner(_ref) {
32
32
  if (!isEmpty(item === null || item === void 0 ? void 0 : item.items)) {
33
33
  var _item$items;
34
34
  return /*#__PURE__*/React.createElement(FloatingPopover, {
35
- placement: "right",
35
+ placement: (item === null || item === void 0 ? void 0 : item.placement) || 'right',
36
36
  opened: isCurrentListOpen,
37
37
  onToggle: handleToggle,
38
38
  offset: 2,
@@ -192,6 +192,7 @@ const StoryRange = ({
192
192
  const rangeRef = useRef<RangeInputRefs>(null);
193
193
 
194
194
  const [isOpen, setIsOpen] = useState(false);
195
+ const [firstDate, setFirstDate] = useState<string | Date>('');
195
196
 
196
197
  const iconSize = size === 'xs' ? 'xs' : 's';
197
198
  const showDividerIcon = dividerVariant === 'icon';
@@ -238,6 +239,12 @@ const StoryRange = ({
238
239
  onChangeSecondValue={(e, currentValue) => {
239
240
  onChangeSecondValue(e, currentValue);
240
241
  }}
242
+ onCommitFirstDate={(currentValue) => {
243
+ setFirstDate(currentValue);
244
+ }}
245
+ onCommitSecondDate={(currentValue) => {
246
+ firstDate && currentValue && setIsOpen(false);
247
+ }}
241
248
  lang={lang}
242
249
  {...dividerIconProps}
243
250
  {...rest}
@@ -272,7 +279,6 @@ export const Range: StoryObj<StoryPropsRange> = {
272
279
  size: 'l',
273
280
  view: 'default',
274
281
  isDoubleCalendar: false,
275
- closeAfterDateSelect: true,
276
282
  dividerVariant: 'dash',
277
283
  min: new Date(2024, 1, 1),
278
284
  max: new Date(2024, 12, 29),
@@ -186,12 +186,12 @@ const StoryRange = ({
186
186
  secondValueError,
187
187
  secondValueSuccess,
188
188
  size,
189
- lang,
190
189
  ...rest
191
190
  }: StoryPropsRange) => {
192
191
  const rangeRef = useRef<RangeInputRefs>(null);
193
192
 
194
193
  const [isOpen, setIsOpen] = useState(false);
194
+ const [firstDate, setFirstDate] = useState<string | Date>('');
195
195
 
196
196
  const iconSize = size === 'xs' ? 'xs' : 's';
197
197
  const showDividerIcon = dividerVariant === 'icon';
@@ -238,7 +238,12 @@ const StoryRange = ({
238
238
  onChangeSecondValue={(e, currentValue) => {
239
239
  onChangeSecondValue(e, currentValue);
240
240
  }}
241
- lang={lang}
241
+ onCommitFirstDate={(currentValue) => {
242
+ setFirstDate(currentValue);
243
+ }}
244
+ onCommitSecondDate={(currentValue) => {
245
+ firstDate && currentValue && setIsOpen(false);
246
+ }}
242
247
  {...dividerIconProps}
243
248
  {...rest}
244
249
  />
@@ -272,7 +277,6 @@ export const Range: StoryObj<StoryPropsRange> = {
272
277
  size: 'l',
273
278
  view: 'default',
274
279
  isDoubleCalendar: false,
275
- closeAfterDateSelect: true,
276
280
  dividerVariant: 'dash',
277
281
  min: new Date(2024, 1, 1),
278
282
  max: new Date(2024, 12, 29),
@@ -5,7 +5,7 @@ import { DropdownProps } from '../../Dropdown/Dropdown.types';
5
5
  import { FocusedPathState } from './reducers';
6
6
  import { ItemOption, ItemOptionTransformed } from './ui/Inner/ui/Item/Item.types';
7
7
  import type { ValueToCheckedMapType } from './hooks/getPathMaps';
8
- declare type Placement = 'top' | 'top-start' | 'top-end' | 'right' | 'right-start' | 'right-end' | 'bottom' | 'bottom-start' | 'bottom-end' | 'left' | 'left-start' | 'left-end';
8
+ export declare type Placement = 'top' | 'top-start' | 'top-end' | 'right' | 'right-start' | 'right-end' | 'bottom' | 'bottom-start' | 'bottom-end' | 'left' | 'left-start' | 'left-end';
9
9
  declare type IsMultiselect<T extends ItemOption = ItemOption> = ({
10
10
  name?: never;
11
11
  defaultValue?: never;
@@ -1 +1 @@
1
- {"version":3,"file":"Combobox.types.d.ts","sourceRoot":"","sources":["../../../../src/components/Combobox/ComboboxNew/Combobox.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,oBAAoB,EAAE,kBAAkB,EAAE,MAAM,OAAO,CAAC;AACrF,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,aAAa,EAAE,UAAU,EAAE,MAAM,iCAAiC,CAAC;AAC5E,OAAO,EAAE,aAAa,EAAE,MAAM,+BAA+B,CAAC;AAE9D,OAAO,EAAE,gBAAgB,EAAE,MAAM,YAAY,CAAC;AAC9C,OAAO,EAAE,UAAU,EAAE,qBAAqB,EAAE,MAAM,+BAA+B,CAAC;AAClF,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,qBAAqB,CAAC;AAEjE,aAAK,SAAS,GACR,KAAK,GACL,WAAW,GACX,SAAS,GACT,OAAO,GACP,aAAa,GACb,WAAW,GACX,QAAQ,GACR,cAAc,GACd,YAAY,GACZ,MAAM,GACN,YAAY,GACZ,UAAU,CAAC;AAEjB,aAAK,aAAa,CAAC,CAAC,SAAS,UAAU,GAAG,UAAU,IAC9C,CAAC;IAAE,IAAI,CAAC,EAAE,KAAK,CAAC;IAAC,YAAY,CAAC,EAAE,KAAK,CAAA;CAAE,GAAG,CACpC;IACI,QAAQ,CAAC,EAAE,KAAK,CAAC;IACjB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC;;;OAGG;IACH,cAAc,CAAC,EAAE,KAAK,GAAG,KAAK,CAAC;IAC/B;;;OAGG;IACH,YAAY,CAAC,EAAE,KAAK,CAAC;IACrB;;OAEG;IACH,WAAW,CAAC,EAAE,KAAK,CAAC;CACvB,GACD;IACI,QAAQ,EAAE,IAAI,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,EAAE,CAAC;IACjB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IACrC,cAAc,CAAC,EAAE,IAAI,CAAC;IACtB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,WAAW,CAAC,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,MAAM,CAAC;CACrC,CACN,CAAC,GACF,CAAC;IAAE,IAAI,EAAE,MAAM,CAAC;IAAC,QAAQ,CAAC,EAAE,kBAAkB,CAAA;CAAE,GAAG,CAC7C;IACI,QAAQ,CAAC,EAAE,KAAK,CAAC;IACjB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,KAAK,CAAC,EAAE,KAAK,CAAC;IACd,cAAc,CAAC,EAAE,KAAK,GAAG,KAAK,CAAC;IAC/B,YAAY,CAAC,EAAE,KAAK,CAAC;IACrB,WAAW,CAAC,EAAE,KAAK,CAAC;CACvB,GACD;IACI,QAAQ,EAAE,IAAI,CAAC;IACf,YAAY,CAAC,EAAE,MAAM,EAAE,CAAC;IACxB,KAAK,CAAC,EAAE,KAAK,CAAC;IACd,cAAc,CAAC,EAAE,IAAI,CAAC;IACtB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,WAAW,CAAC,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,MAAM,CAAC;CACrC,CACN,CAAC,CAAC;AAgBT,aAAK,cAAc,GACb;IACI;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;OAEG;IACH,QAAQ,CAAC,EAAE,IAAI,CAAC;IAChB;;OAEG;IACH,YAAY,CAAC,EAAE,KAAK,CAAC;CACxB,GACD;IACI;;OAEG;IACH,QAAQ,CAAC,EAAE,IAAI,CAAC;IAChB;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;OAEG;IACH,YAAY,CAAC,EAAE,KAAK,CAAC;CACxB,GACD;IACI;;OAEG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC;IACjB;;OAEG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC;IACjB;;OAEG;IACH,YAAY,CAAC,EAAE,IAAI,CAAC;CACvB,CAAC;AAER,aAAK,UAAU,CAAC,CAAC,SAAS,UAAU,GAAG,UAAU,IAAI;IACjD;;OAEG;IACH,KAAK,EAAE,KAAK,CAAC,CAAC,CAAC,CAAC;IAChB;;;OAGG;IACH,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;OAEG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB;;OAEG;IACH,WAAW,CAAC,EAAE,KAAK,CAAC,YAAY,CAAC;IACjC;;OAEG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;OAGG;IACH,OAAO,CAAC,EAAE,QAAQ,GAAG,OAAO,CAAC;IAC7B;;OAEG;IACH,MAAM,CAAC,EAAE,aAAa,CAAC,QAAQ,CAAC,CAAC;IACjC;;;OAGG;IACH,YAAY,CAAC,EAAE,aAAa,CAAC,UAAU,CAAC,CAAC;IAEzC;;OAEG;IACH,UAAU,CAAC,EAAE,aAAa,CAAC,QAAQ,CAAC,CAAC;IACrC;;;OAGG;IACH,SAAS,CAAC,EAAE,aAAa,CAAC,OAAO,CAAC,CAAC;IACnC;;OAEG;IACH,MAAM,CAAC,EAAE,MAAM,GAAG,KAAK,CAAC,SAAS,CAAC,WAAW,CAAC,CAAC;IAC/C;;OAEG;IACH,UAAU,CAAC,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,KAAK,CAAC,SAAS,CAAC;IAC1C;;OAEG;IACH,MAAM,CAAC,EAAE,CAAC,IAAI,EAAE,CAAC,EAAE,SAAS,EAAE,MAAM,KAAK,OAAO,CAAC;IACjD;;;OAGG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B;;OAEG;IACH,UAAU,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC7B;;OAEG;IACH,SAAS,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC5B;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;CACjB,CAAC;AAEF,oBAAY,aAAa,CAAC,CAAC,SAAS,UAAU,GAAG,UAAU,IAAI,UAAU,CAAC,CAAC,CAAC,GACxE,UAAU,GACV,cAAc,GACd,aAAa,CAAC,CAAC,CAAC,GAChB,aAAa,GACb,IAAI,CAAC,oBAAoB,CAAC,gBAAgB,CAAC,EAAE,OAAO,GAAG,UAAU,GAAG,MAAM,GAAG,cAAc,CAAC,CAAC;AAEjG,oBAAY,oBAAoB,GAAG;IAC/B,MAAM,EAAE,KAAK,CAAC,SAAS,GAAG,CAAC,CAAC,GAAG,EAAE,KAAK,CAAC,gBAAgB,CAAC,WAAW,GAAG,IAAI,CAAC,KAAK,KAAK,CAAC,SAAS,CAAC,CAAC;IACjG,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,MAAM,EAAE,OAAO,CAAC;IAChB,QAAQ,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;IACpC,SAAS,EAAE,SAAS,CAAC;IACrB,MAAM,CAAC,EAAE,aAAa,CAAC,QAAQ,CAAC,CAAC;IACjC,SAAS,CAAC,EAAE,aAAa,CAAC,WAAW,CAAC,CAAC;IACvC,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,MAAM,CAAC,EAAE,aAAa,CAAC,QAAQ,CAAC,CAAC;CACpC,CAAC;AAEF,oBAAY,WAAW,GAAG;IACtB,WAAW,EAAE,gBAAgB,CAAC;IAC9B,OAAO,EAAE,qBAAqB,CAAC;IAC/B,QAAQ,EAAE,aAAa,CAAC,UAAU,CAAC,CAAC;IACpC,IAAI,EAAE,aAAa,CAAC,MAAM,CAAC,CAAC;IAC5B,oBAAoB,EAAE,CAAC,IAAI,EAAE,qBAAqB,KAAK,IAAI,CAAC;IAC5D,eAAe,EAAE,CAAC,IAAI,EAAE,qBAAqB,EAAE,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,WAAW,CAAC,KAAK,IAAI,CAAC;IACzF,OAAO,EAAE,aAAa,CAAC,SAAS,CAAC,CAAC;IAClC,UAAU,EAAE,aAAa,CAAC,YAAY,CAAC,CAAC;IACxC,MAAM,EAAE,MAAM,CAAC;CAClB,CAAC"}
1
+ {"version":3,"file":"Combobox.types.d.ts","sourceRoot":"","sources":["../../../../src/components/Combobox/ComboboxNew/Combobox.types.ts"],"names":[],"mappings":"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"}
@@ -1,6 +1,7 @@
1
1
  import type { ReactNode } from 'react';
2
2
  import React from 'react';
3
3
  import type { PathState } from '../../../../../../Select/reducers';
4
+ import type { Placement } from '../../../../Combobox.types';
4
5
  export declare type ItemOption = {
5
6
  /**
6
7
  * Значение у item
@@ -10,6 +11,11 @@ export declare type ItemOption = {
10
11
  * Метка-подпись к item
11
12
  */
12
13
  label: string;
14
+ /**
15
+ * Сторона открытия вложенного дропдауна относительно текущего элемента
16
+ * @default right
17
+ */
18
+ placement?: Placement;
13
19
  /**
14
20
  * Список дочерних items
15
21
  */
@@ -1 +1 @@
1
- {"version":3,"file":"Item.types.d.ts","sourceRoot":"","sources":["../../../../../../../../src/components/Combobox/ComboboxNew/ui/Inner/ui/Item/Item.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,mCAAmC,CAAC;AAEnE,oBAAY,UAAU,GAAG;IACrB;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,KAAK,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,CAAC;IAC1B;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;OAEG;IACH,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB;;OAEG;IACH,YAAY,CAAC,EAAE,SAAS,CAAC;IACzB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACtB,CAAC;AAEF,oBAAY,qBAAqB,GAAG,UAAU,GAAG;IAAE,MAAM,CAAC,EAAE,UAAU,GAAG,IAAI,CAAA;CAAE,CAAC;AAEhF,oBAAY,SAAS,GAAG;IACpB,IAAI,EAAE,qBAAqB,CAAC;IAC5B,YAAY,EAAE,MAAM,CAAC;IACrB,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,SAAS,CAAC;IAChB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,SAAS,CAAC,EAAE,KAAK,CAAC,cAAc,CAAC,YAAY,CAAC,CAAC;IAC/C,SAAS,CAAC,EAAE,KAAK,CAAC,cAAc,CAAC,YAAY,CAAC,CAAC;CAClD,CAAC"}
1
+ {"version":3,"file":"Item.types.d.ts","sourceRoot":"","sources":["../../../../../../../../src/components/Combobox/ComboboxNew/ui/Inner/ui/Item/Item.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,mCAAmC,CAAC;AACnE,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,4BAA4B,CAAC;AAE5D,oBAAY,UAAU,GAAG;IACrB;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;;OAGG;IACH,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB;;OAEG;IACH,KAAK,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,CAAC;IAC1B;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;OAEG;IACH,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB;;OAEG;IACH,YAAY,CAAC,EAAE,SAAS,CAAC;IACzB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACtB,CAAC;AAEF,oBAAY,qBAAqB,GAAG,UAAU,GAAG;IAAE,MAAM,CAAC,EAAE,UAAU,GAAG,IAAI,CAAA;CAAE,CAAC;AAEhF,oBAAY,SAAS,GAAG;IACpB,IAAI,EAAE,qBAAqB,CAAC;IAC5B,YAAY,EAAE,MAAM,CAAC;IACrB,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,SAAS,CAAC;IAChB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,SAAS,CAAC,EAAE,KAAK,CAAC,cAAc,CAAC,YAAY,CAAC,CAAC;IAC/C,SAAS,CAAC,EAAE,KAAK,CAAC,cAAc,CAAC,YAAY,CAAC,CAAC;CAClD,CAAC"}
@@ -42,10 +42,10 @@ export declare const datePickerRangeRoot: (Root: RootProps<HTMLDivElement, Omit<
42
42
  secondTextfieldContentRight?: React.ReactElement<any, string | React.JSXElementConstructor<any>> | undefined;
43
43
  firstTextfieldTextAfter?: string | undefined;
44
44
  secondTextfieldTextAfter?: string | undefined;
45
- onFocusFirstTextfield?: ((event: React.FocusEvent<HTMLInputElement, Element>) => void) | undefined;
46
- onFocusSecondTextfield?: ((event: React.FocusEvent<HTMLInputElement, Element>) => void) | undefined;
47
- onBlurFirstTextfield?: ((event: React.FocusEvent<HTMLInputElement, Element>) => void) | undefined;
48
- onBlurSecondTextfield?: ((event: React.FocusEvent<HTMLInputElement, Element>) => void) | undefined;
45
+ onFocusFirstTextfield?: ((event: React.ChangeEvent<HTMLInputElement>) => void) | undefined;
46
+ onFocusSecondTextfield?: ((event: React.ChangeEvent<HTMLInputElement>) => void) | undefined;
47
+ onBlurFirstTextfield?: ((event: React.ChangeEvent<HTMLInputElement>) => void) | undefined;
48
+ onBlurSecondTextfield?: ((event: React.ChangeEvent<HTMLInputElement>) => void) | undefined;
49
49
  firstTextfieldTextBefore?: string | undefined;
50
50
  secondTextfieldTextBefore?: string | undefined;
51
51
  dividerVariant?: "none" | "icon" | "dash" | undefined;
@@ -53,7 +53,6 @@ export declare const datePickerRangeRoot: (Root: RootProps<HTMLDivElement, Omit<
53
53
  } & import("../DatePickerBase.types").DatePickerCalendarProps & Omit<import("../SingleDate/SingleDate.types").DatePickerPopoverProps, "placement"> & {
54
54
  placement?: import("./RangeDate.types").DatePickerRangePlacement | import("./RangeDate.types").DatePickerRangePlacementBasic[] | undefined;
55
55
  isDoubleCalendar?: boolean | undefined;
56
- closeAfterDateSelect?: boolean | undefined;
57
56
  } & React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<RangeInputRefs>>;
58
57
  export declare const datePickerRangeConfig: {
59
58
  name: string;
@@ -98,10 +97,10 @@ export declare const datePickerRangeConfig: {
98
97
  secondTextfieldContentRight?: React.ReactElement<any, string | React.JSXElementConstructor<any>> | undefined;
99
98
  firstTextfieldTextAfter?: string | undefined;
100
99
  secondTextfieldTextAfter?: string | undefined;
101
- onFocusFirstTextfield?: ((event: React.FocusEvent<HTMLInputElement, Element>) => void) | undefined;
102
- onFocusSecondTextfield?: ((event: React.FocusEvent<HTMLInputElement, Element>) => void) | undefined;
103
- onBlurFirstTextfield?: ((event: React.FocusEvent<HTMLInputElement, Element>) => void) | undefined;
104
- onBlurSecondTextfield?: ((event: React.FocusEvent<HTMLInputElement, Element>) => void) | undefined;
100
+ onFocusFirstTextfield?: ((event: React.ChangeEvent<HTMLInputElement>) => void) | undefined;
101
+ onFocusSecondTextfield?: ((event: React.ChangeEvent<HTMLInputElement>) => void) | undefined;
102
+ onBlurFirstTextfield?: ((event: React.ChangeEvent<HTMLInputElement>) => void) | undefined;
103
+ onBlurSecondTextfield?: ((event: React.ChangeEvent<HTMLInputElement>) => void) | undefined;
105
104
  firstTextfieldTextBefore?: string | undefined;
106
105
  secondTextfieldTextBefore?: string | undefined;
107
106
  dividerVariant?: "none" | "icon" | "dash" | undefined;
@@ -109,7 +108,6 @@ export declare const datePickerRangeConfig: {
109
108
  } & import("../DatePickerBase.types").DatePickerCalendarProps & Omit<import("../SingleDate/SingleDate.types").DatePickerPopoverProps, "placement"> & {
110
109
  placement?: import("./RangeDate.types").DatePickerRangePlacement | import("./RangeDate.types").DatePickerRangePlacementBasic[] | undefined;
111
110
  isDoubleCalendar?: boolean | undefined;
112
- closeAfterDateSelect?: boolean | undefined;
113
111
  } & React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<RangeInputRefs>>;
114
112
  base: import("@linaria/core").LinariaClassName;
115
113
  variations: {
@@ -1 +1 @@
1
- {"version":3,"file":"RangeDate.d.ts","sourceRoot":"","sources":["../../../../src/components/DatePicker/RangeDate/RangeDate.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA0E,MAAM,OAAO,CAAC;AAW/F,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,kBAAkB,CAAC;AAIlD,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,yBAAyB,CAAC;AAO9D,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,mBAAmB,CAAC;AAQ9D,eAAO,MAAM,mBAAmB,SACtB,UAAU,cAAc,EAAE,KAAK,oBAAoB,EAAE,QAAQ,GAAG,cAAc,GAAG,eAAe,CAAC,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;+EAsdvG,CAAC;AAEN,eAAO,MAAM,qBAAqB;;;mBAxdxB,UAAU,cAAc,EAAE,KAAK,oBAAoB,EAAE,QAAQ,GAAG,cAAc,GAAG,eAAe,CAAC,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAif3G,CAAC"}
1
+ {"version":3,"file":"RangeDate.d.ts","sourceRoot":"","sources":["../../../../src/components/DatePicker/RangeDate/RangeDate.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA0E,MAAM,OAAO,CAAC;AAW/F,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,kBAAkB,CAAC;AAIlD,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,yBAAyB,CAAC;AAM9D,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,mBAAmB,CAAC;AAQ9D,eAAO,MAAM,mBAAmB,SACtB,UAAU,cAAc,EAAE,KAAK,oBAAoB,EAAE,QAAQ,GAAG,cAAc,GAAG,eAAe,CAAC,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;+EAoavG,CAAC;AAEN,eAAO,MAAM,qBAAqB;;;mBAtaxB,UAAU,cAAc,EAAE,KAAK,oBAAoB,EAAE,QAAQ,GAAG,cAAc,GAAG,eAAe,CAAC,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA+b3G,CAAC"}