@itcase/ui 1.9.17 → 1.9.19

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 (98) hide show
  1. package/dist/{Avatar_cjs_ZK4mnb7m.js → Avatar_cjs_DRZE113U.js} +2 -2
  2. package/dist/{Avatar_es_Dk99rLbe.js → Avatar_es_Cmq4xAG6.js} +2 -2
  3. package/dist/{Button_cjs_vkqr1bkb.js → Button_cjs_BRShPZw4.js} +3 -3
  4. package/dist/{Button_es_BD_2rj1L.js → Button_es_CvRcO3xM.js} +3 -3
  5. package/dist/{ChipsGroup_cjs_Bfv9Z78e.js → ChipsGroup_cjs_D0bGehZY.js} +2 -3
  6. package/dist/{ChipsGroup_es_BrHHulZC.js → ChipsGroup_es_DWvsJ5bu.js} +2 -3
  7. package/dist/{DatePicker_cjs_D9q-RqJu.js → DatePicker_cjs_Cm50AX0J.js} +30 -17
  8. package/dist/{DatePicker_es_C8h_4BAl.js → DatePicker_es_B-WPA9y9.js} +30 -17
  9. package/dist/{DropdownItem_cjs_B9gLsZaE.js → DropdownItem_cjs_CawN_Tz7.js} +2 -2
  10. package/dist/{DropdownItem_es_B6kgi8Rn.js → DropdownItem_es_BauhVrYj.js} +2 -2
  11. package/dist/{Icon_cjs_NpWSQezS.js → Icon_cjs_BgGtdviU.js} +3 -3
  12. package/dist/{Icon_es_CJuX1p1_.js → Icon_es_CtZHchZc.js} +3 -3
  13. package/dist/{Label_cjs_BQuZczFh.js → Label_cjs_FRIVslSV.js} +2 -2
  14. package/dist/{Label_es_CPJTfGeV.js → Label_es_CI2mt2wH.js} +2 -2
  15. package/dist/{Loader_cjs_rHdGFWUi.js → Loader_cjs_DWBtnjaL.js} +1 -1
  16. package/dist/{Loader_es_D4Vd79Gk.js → Loader_es_BvTBRuay.js} +1 -1
  17. package/dist/{SelectContainer_cjs_BCd-lWfu.js → SelectContainer_cjs_tjM35jHG.js} +3 -3
  18. package/dist/{SelectContainer_es_DKSC5hMK.js → SelectContainer_es_BKIz5i19.js} +3 -3
  19. package/dist/{Text_cjs_BhnGHF2T.js → Text_cjs_DG2eMKBi.js} +2 -2
  20. package/dist/{Text_es_C1kfpokr.js → Text_es_CU9KR5AE.js} +2 -2
  21. package/dist/cjs/components/Accordion.js +2 -2
  22. package/dist/cjs/components/Avatar.js +3 -3
  23. package/dist/cjs/components/AvatarStack.js +3 -3
  24. package/dist/cjs/components/Badge.js +2 -2
  25. package/dist/cjs/components/Breadcrumbs.js +2 -2
  26. package/dist/cjs/components/Button.js +4 -4
  27. package/dist/cjs/components/Cell.js +3 -3
  28. package/dist/cjs/components/Checkbox.js +1 -1
  29. package/dist/cjs/components/Chips.js +3 -3
  30. package/dist/cjs/components/Choice.js +3 -3
  31. package/dist/cjs/components/CookiesWarning.js +4 -4
  32. package/dist/cjs/components/DatePeriod.js +10 -10
  33. package/dist/cjs/components/DatePicker.js +6 -6
  34. package/dist/cjs/components/Drawer.js +2 -2
  35. package/dist/cjs/components/Dropdown.js +3 -3
  36. package/dist/cjs/components/HeroTitle.js +2 -2
  37. package/dist/cjs/components/Icon.js +2 -2
  38. package/dist/cjs/components/InputPassword.js +2 -2
  39. package/dist/cjs/components/Label.js +3 -3
  40. package/dist/cjs/components/Loader.js +2 -2
  41. package/dist/cjs/components/MenuItem.js +2 -2
  42. package/dist/cjs/components/Modal.js +3 -3
  43. package/dist/cjs/components/ModalSheetBottom.js +2 -2
  44. package/dist/cjs/components/Notification.js +4 -4
  45. package/dist/cjs/components/Pagination.js +3 -3
  46. package/dist/cjs/components/Radio.js +1 -1
  47. package/dist/cjs/components/Response.js +4 -4
  48. package/dist/cjs/components/Search.js +2 -2
  49. package/dist/cjs/components/Segmented.js +2 -2
  50. package/dist/cjs/components/Select.js +4 -4
  51. package/dist/cjs/components/Swiper.js +2 -2
  52. package/dist/cjs/components/Switch.js +1 -1
  53. package/dist/cjs/components/Tab.js +2 -2
  54. package/dist/cjs/components/Text.js +1 -1
  55. package/dist/cjs/components/Tile.js +2 -2
  56. package/dist/cjs/components/Title.js +2 -2
  57. package/dist/cjs/components/Tooltip.js +2 -2
  58. package/dist/cjs/components/Warning.js +2 -2
  59. package/dist/components/Accordion.js +2 -2
  60. package/dist/components/Avatar.js +3 -3
  61. package/dist/components/AvatarStack.js +3 -3
  62. package/dist/components/Badge.js +2 -2
  63. package/dist/components/Breadcrumbs.js +2 -2
  64. package/dist/components/Button.js +4 -4
  65. package/dist/components/Cell.js +3 -3
  66. package/dist/components/Checkbox.js +1 -1
  67. package/dist/components/Chips.js +3 -3
  68. package/dist/components/Choice.js +3 -3
  69. package/dist/components/CookiesWarning.js +4 -4
  70. package/dist/components/DatePeriod.js +10 -10
  71. package/dist/components/DatePicker.js +6 -6
  72. package/dist/components/Drawer.js +2 -2
  73. package/dist/components/Dropdown.js +3 -3
  74. package/dist/components/HeroTitle.js +2 -2
  75. package/dist/components/Icon.js +2 -2
  76. package/dist/components/InputPassword.js +2 -2
  77. package/dist/components/Label.js +3 -3
  78. package/dist/components/Loader.js +2 -2
  79. package/dist/components/MenuItem.js +2 -2
  80. package/dist/components/Modal.js +3 -3
  81. package/dist/components/ModalSheetBottom.js +2 -2
  82. package/dist/components/Notification.js +4 -4
  83. package/dist/components/Pagination.js +3 -3
  84. package/dist/components/Radio.js +1 -1
  85. package/dist/components/Response.js +4 -4
  86. package/dist/components/Search.js +2 -2
  87. package/dist/components/Segmented.js +2 -2
  88. package/dist/components/Select.js +4 -4
  89. package/dist/components/Swiper.js +2 -2
  90. package/dist/components/Switch.js +1 -1
  91. package/dist/components/Tab.js +2 -2
  92. package/dist/components/Text.js +1 -1
  93. package/dist/components/Tile.js +2 -2
  94. package/dist/components/Title.js +2 -2
  95. package/dist/components/Tooltip.js +2 -2
  96. package/dist/components/Warning.js +2 -2
  97. package/dist/types/components/DatePicker/DatePicker.utils.d.ts +6 -0
  98. package/package.json +1 -1
@@ -5,9 +5,9 @@ var React = require('react');
5
5
  var clsx = require('clsx');
6
6
  var useAppearanceConfig = require('./cjs/hooks/useAppearanceConfig/useAppearanceConfig.js');
7
7
  var useDevicePropsGenerator = require('./cjs/hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
8
- var Icon = require('./Icon_cjs_NpWSQezS.js');
8
+ var Icon = require('./Icon_cjs_BgGtdviU.js');
9
9
  var Image = require('./Image_cjs_BUM81t4Y.js');
10
- var Text = require('./Text_cjs_BhnGHF2T.js');
10
+ var Text = require('./Text_cjs_DG2eMKBi.js');
11
11
 
12
12
  const avatarAppearanceDefault = {
13
13
  surfacePrimary: {
@@ -3,9 +3,9 @@ import { useMemo } from 'react';
3
3
  import clsx from 'clsx';
4
4
  import { useAppearanceConfig } from './hooks/useAppearanceConfig/useAppearanceConfig.js';
5
5
  import { useDevicePropsGenerator } from './hooks/useDevicePropsGenerator/useDevicePropsGenerator.js';
6
- import { I as Icon, B as Badge } from './Icon_es_CJuX1p1_.js';
6
+ import { I as Icon, B as Badge } from './Icon_es_CtZHchZc.js';
7
7
  import { I as Image } from './Image_es_C-IjVkKX.js';
8
- import { T as Text } from './Text_es_C1kfpokr.js';
8
+ import { T as Text } from './Text_es_CU9KR5AE.js';
9
9
 
10
10
  const avatarAppearanceDefault = {
11
11
  surfacePrimary: {
@@ -6,10 +6,10 @@ var clsx = require('clsx');
6
6
  var useAppearanceConfig = require('./cjs/hooks/useAppearanceConfig/useAppearanceConfig.js');
7
7
  var useDevicePropsGenerator = require('./cjs/hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
8
8
  var useStyles = require('./cjs/hooks/useStyles/useStyles.js');
9
- var Icon = require('./Icon_cjs_NpWSQezS.js');
9
+ var Icon = require('./Icon_cjs_BgGtdviU.js');
10
10
  var Link = require('./Link_cjs_qKXVfU8e.js');
11
- var Loader = require('./Loader_cjs_rHdGFWUi.js');
12
- var Text = require('./Text_cjs_BhnGHF2T.js');
11
+ var Loader = require('./Loader_cjs_DWBtnjaL.js');
12
+ var Text = require('./Text_cjs_DG2eMKBi.js');
13
13
 
14
14
  const buttonAppearanceAccent = {
15
15
  accentMutedPrimary: {
@@ -4,10 +4,10 @@ import clsx from 'clsx';
4
4
  import { useAppearanceConfig } from './hooks/useAppearanceConfig/useAppearanceConfig.js';
5
5
  import { useDevicePropsGenerator } from './hooks/useDevicePropsGenerator/useDevicePropsGenerator.js';
6
6
  import { useStyles } from './hooks/useStyles/useStyles.js';
7
- import { I as Icon } from './Icon_es_CJuX1p1_.js';
7
+ import { I as Icon } from './Icon_es_CtZHchZc.js';
8
8
  import { a as LinkWrapper } from './Link_es_P2b6ya7P.js';
9
- import { L as Loader } from './Loader_es_D4Vd79Gk.js';
10
- import { T as Text } from './Text_es_C1kfpokr.js';
9
+ import { L as Loader } from './Loader_es_BvTBRuay.js';
10
+ import { T as Text } from './Text_es_CU9KR5AE.js';
11
11
 
12
12
  const buttonAppearanceAccent = {
13
13
  accentMutedPrimary: {
@@ -5,8 +5,8 @@ var clsx = require('clsx');
5
5
  var useDevicePropsGenerator = require('./cjs/hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
6
6
  var useStyles = require('./cjs/hooks/useStyles/useStyles.js');
7
7
  var useAppearanceConfig = require('./cjs/hooks/useAppearanceConfig/useAppearanceConfig.js');
8
- var Icon = require('./Icon_cjs_NpWSQezS.js');
9
- var Text = require('./Text_cjs_BhnGHF2T.js');
8
+ var Icon = require('./Icon_cjs_BgGtdviU.js');
9
+ var Text = require('./Text_cjs_DG2eMKBi.js');
10
10
 
11
11
  const chipsAppearanceAccent = {
12
12
  accentMutedPrimary: {
@@ -336,7 +336,6 @@ function ChipsGroup(props) {
336
336
  const { directionClass, alignClass, alignDirectionClass, fillClass, borderColorClass, borderTypeClass, borderWidthClass, chipsAppearance, widthClass, wrapClass, } = propsGenerator;
337
337
  // @ts-expect-error
338
338
  const { styles: groupStyles } = useStyles.useStyles(props);
339
- console.log();
340
339
  return (jsxRuntime.jsx("div", { className: clsx(className, 'chips-group', 'group', widthClass && `width_${widthClass}`, alignDirectionClass && `align_${alignDirectionClass}`, directionClass && `group_direction_${directionClass}`, alignClass && `align_${alignClass}`, fillClass && `fill_${fillClass}`, horizontalScroll && 'group_scroll_horizontal', wrapClass && `group_wrap_${wrapClass}`, borderColorClass && `border-color_${borderColorClass}`, borderWidthClass && `border-width_${borderWidthClass}`, borderTypeClass && `border_type_${borderTypeClass}`), "data-test-id": dataTestId, "data-tour": dataTour, style: Object.assign({}, groupStyles, style), children: children
341
340
  ? children
342
341
  : chipsList?.map((item) => (jsxRuntime.jsx(Chips, { appearance: chipsAppearance, label: item.label, iconAfter: item.iconAfter, iconBefore: item.iconBefore, isActive: item.isActive, isDisabled: item.isDisabled, onClick: () => onClick(item) }, item.id))) }));
@@ -3,8 +3,8 @@ import clsx from 'clsx';
3
3
  import { useDevicePropsGenerator } from './hooks/useDevicePropsGenerator/useDevicePropsGenerator.js';
4
4
  import { useStyles } from './hooks/useStyles/useStyles.js';
5
5
  import { useAppearanceConfig } from './hooks/useAppearanceConfig/useAppearanceConfig.js';
6
- import { I as Icon, B as Badge } from './Icon_es_CJuX1p1_.js';
7
- import { T as Text } from './Text_es_C1kfpokr.js';
6
+ import { I as Icon, B as Badge } from './Icon_es_CtZHchZc.js';
7
+ import { T as Text } from './Text_es_CU9KR5AE.js';
8
8
 
9
9
  const chipsAppearanceAccent = {
10
10
  accentMutedPrimary: {
@@ -334,7 +334,6 @@ function ChipsGroup(props) {
334
334
  const { directionClass, alignClass, alignDirectionClass, fillClass, borderColorClass, borderTypeClass, borderWidthClass, chipsAppearance, widthClass, wrapClass, } = propsGenerator;
335
335
  // @ts-expect-error
336
336
  const { styles: groupStyles } = useStyles(props);
337
- console.log();
338
337
  return (jsx("div", { className: clsx(className, 'chips-group', 'group', widthClass && `width_${widthClass}`, alignDirectionClass && `align_${alignDirectionClass}`, directionClass && `group_direction_${directionClass}`, alignClass && `align_${alignClass}`, fillClass && `fill_${fillClass}`, horizontalScroll && 'group_scroll_horizontal', wrapClass && `group_wrap_${wrapClass}`, borderColorClass && `border-color_${borderColorClass}`, borderWidthClass && `border-width_${borderWidthClass}`, borderTypeClass && `border_type_${borderTypeClass}`), "data-test-id": dataTestId, "data-tour": dataTour, style: Object.assign({}, groupStyles, style), children: children
339
338
  ? children
340
339
  : chipsList?.map((item) => (jsx(Chips, { appearance: chipsAppearance, label: item.label, iconAfter: item.iconAfter, iconBefore: item.iconBefore, isActive: item.isActive, isDisabled: item.isDisabled, onClick: () => onClick(item) }, item.id))) }));
@@ -8,11 +8,11 @@ var DatePicker = require('react-datepicker');
8
8
  var useAppearanceConfig = require('./cjs/hooks/useAppearanceConfig/useAppearanceConfig.js');
9
9
  var useDevicePropsGenerator = require('./cjs/hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
10
10
  var useStyles = require('./cjs/hooks/useStyles/useStyles.js');
11
- var Button = require('./Button_cjs_vkqr1bkb.js');
12
- var Icon = require('./Icon_cjs_NpWSQezS.js');
11
+ var Button = require('./Button_cjs_BRShPZw4.js');
12
+ var Icon = require('./Icon_cjs_BgGtdviU.js');
13
13
  var Input = require('./Input_cjs_KgFCCi2U.js');
14
- var Label = require('./Label_cjs_BQuZczFh.js');
15
- var Text = require('./Text_cjs_BhnGHF2T.js');
14
+ var Label = require('./Label_cjs_FRIVslSV.js');
15
+ var Text = require('./Text_cjs_DG2eMKBi.js');
16
16
  var _default = require('@itcase/icons/default');
17
17
 
18
18
  const datePickerSize = {
@@ -86,16 +86,31 @@ const datePickerAppearance = {
86
86
  ...datePickerStyle,
87
87
  };
88
88
 
89
+ const getWeekRange = (date) => {
90
+ // "getDay" return from 0(sunday) to 6 (saturday).
91
+ // When 0(sunday) - we set as 7(end of week from 1(monday))
92
+ const weekDayIndex = date.getDay() || 7;
93
+ // Collect monday of week from selected date
94
+ const mondayDate = new Date(date);
95
+ mondayDate.setDate(date.getDate() - (weekDayIndex - 1));
96
+ // Collect sunday of week from selected date
97
+ const sundayDate = new Date(mondayDate);
98
+ sundayDate.setDate(mondayDate.getDate() + 6);
99
+ return {
100
+ mondayDate,
101
+ sundayDate,
102
+ };
103
+ };
104
+
89
105
  const datePickerConfig = {
90
106
  appearance: datePickerAppearance,
91
107
  setAppearance: (appearanceConfig) => {
92
108
  datePickerConfig.appearance = appearanceConfig;
93
109
  },
94
110
  };
95
- const INPUT_CLASSNAME = 'datepicker__input';
96
111
  function DatePickerInput(props) {
97
112
  const { className, datePickerProps = {}, endValue, inputProps = {}, value, onChange, } = props;
98
- const { appearance, customTimeInput, disablePastDays, monthsShown, selectsRange, showWeekPicker, } = datePickerProps;
113
+ const { appearance, customTimeInput, disablePastDays, monthsShown, selectsRange, showWeekNumbers, showWeekPicker, } = datePickerProps;
99
114
  const appearanceConfig = useAppearanceConfig.useAppearanceConfig(appearance, datePickerConfig);
100
115
  const propsGenerator = useDevicePropsGenerator.useDevicePropsGenerator(datePickerProps, appearanceConfig);
101
116
  const { daySize, dayTextColor, dayTextShape, dayTextSize, iconFill, iconFillHover, iconFillSize, iconItemFill, iconLeft, iconRight, iconShape, monthTextColor, monthTextSize, monthTextWeight, popper, popperPlacement, sizeClass, widthClass, yearTextColor, yearTextSize, yearTextWeight, isClearable, } = propsGenerator;
@@ -124,16 +139,9 @@ function DatePickerInput(props) {
124
139
  const handleChange = React.useCallback((selected) => {
125
140
  const valuesList = Array.isArray(selected) ? selected : [selected];
126
141
  const [selectedDateStart, selectedDateEnd] = valuesList;
142
+ // "showWeekPicker" means to select full weak by one of day
127
143
  if (selectedDateStart && showWeekPicker) {
128
- // "getDay" return from 0(sunday) to 6 (saturday).
129
- // When 0(sunday) - we set as 7(end of week from 1(monday))
130
- const weekDayIndex = selectedDateStart.getDay() || 7;
131
- // Collect monday of week from selected date
132
- const mondayDate = new Date(selectedDateStart);
133
- mondayDate.setDate(selectedDateStart.getDate() - (weekDayIndex - 1));
134
- // Collect sunday of week from selected date
135
- const sundayDate = new Date(mondayDate);
136
- sundayDate.setDate(mondayDate.getDate() + 6);
144
+ const { mondayDate, sundayDate } = getWeekRange(selectedDateStart);
137
145
  // Selected date can be wednesday, but for week picker
138
146
  // we return start and end of selected week.
139
147
  onChange(mondayDate, sundayDate);
@@ -142,6 +150,10 @@ function DatePickerInput(props) {
142
150
  onChange(selectedDateStart, selectedDateEnd);
143
151
  }
144
152
  }, [showWeekPicker, onChange]);
153
+ const handleWeekSelect = React.useCallback((startDateOfSelectedWeek) => {
154
+ const { mondayDate, sundayDate } = getWeekRange(startDateOfSelectedWeek);
155
+ onChange(mondayDate, sundayDate);
156
+ }, [onChange]);
145
157
  const renderDayContents = React.useCallback((day, date) => {
146
158
  return (jsxRuntime.jsx(Button.Button, { className: "react-datepicker__day-button", size: daySize, label: date.getDate().toString(), labelTextColor: dayTextColor, labelTextSize: dayTextSize, shape: dayTextShape }));
147
159
  }, [daySize, dayTextColor, dayTextShape, dayTextSize]);
@@ -161,7 +173,7 @@ function DatePickerInput(props) {
161
173
  yearTextWeight,
162
174
  ]);
163
175
  const { styles: datePickerStyles } = useStyles.useStyles(props);
164
- return (jsxRuntime.jsx("div", { className: clsx(className, 'datepicker', monthsShown && 'datepicker_multiple-months', customTimeInput && 'datepicker_button', sizeClass && `datepicker_size_${sizeClass}`, widthClass && `datepicker_width_${widthClass}`), style: datePickerStyles, children: jsxRuntime.jsx(DatePicker, { ref: datepickerRef, minDate: disablePastDays ? new Date() : undefined, customInput: jsxRuntime.jsx(DatePickerCustomInput, { datepickerRef: datepickerRef, inputProps: inputProps, isClearable: isClearable }), endDate: selectsRange ? dateEnd : undefined, locale: locale.ru, outsideClickIgnoreClass: INPUT_CLASSNAME, popperClassName: popper && `react-datepicker-popper-${popper}`, popperPlacement: popperPlacement, preventOpenOnFocus: true, renderCustomHeader: renderCustomHeader, renderDayContents: renderDayContents, selected: dateStart, startDate: dateStart, onChange: handleChange, ...datePickerProps,
176
+ return (jsxRuntime.jsx("div", { className: clsx(className, 'datepicker', monthsShown && 'datepicker_multiple-months', customTimeInput && 'datepicker_button', sizeClass && `datepicker_size_${sizeClass}`, widthClass && `datepicker_width_${widthClass}`), style: datePickerStyles, children: jsxRuntime.jsx(DatePicker, { ref: datepickerRef, minDate: disablePastDays ? new Date() : undefined, customInput: jsxRuntime.jsx(DatePickerCustomInput, { datepickerRef: datepickerRef, inputProps: inputProps, isClearable: isClearable }), endDate: selectsRange ? dateEnd : undefined, locale: locale.ru, outsideClickIgnoreClass: "react-datepicker-popper", popperClassName: popper && `react-datepicker-popper-${popper}`, popperPlacement: popperPlacement, preventOpenOnFocus: true, renderCustomHeader: renderCustomHeader, renderDayContents: renderDayContents, selected: dateStart, startDate: dateStart, onChange: handleChange, onWeekSelect: showWeekNumbers ? handleWeekSelect : undefined, ...datePickerProps,
165
177
  // Important for use custom clear button
166
178
  isClearable: false }) }));
167
179
  }
@@ -174,13 +186,14 @@ const DatePickerCustomInput = React.forwardRef((props, ref) => {
174
186
  }
175
187
  return '';
176
188
  }, [value]);
177
- return (jsxRuntime.jsxs(React.Fragment, { children: [jsxRuntime.jsx(Input.Input, { ...props, ...inputProps, className: clsx(inputProps.className, INPUT_CLASSNAME), ref: ref, autocomplete: "off", value: multipleValue, isReadOnly: true }), inputIcon && jsxRuntime.jsx(DatePickerInputIcon, { ...inputProps }), isClearable && jsxRuntime.jsx(DatePickerClearButton, { ...inputProps })] }));
189
+ return (jsxRuntime.jsxs(React.Fragment, { children: [jsxRuntime.jsx(Input.Input, { ...props, ...inputProps, className: clsx(inputProps.className, 'datepicker__input'), ref: ref, autocomplete: "off", value: multipleValue, isReadOnly: true }), inputIcon && jsxRuntime.jsx(DatePickerInputIcon, { ...inputProps }), isClearable && jsxRuntime.jsx(DatePickerClearButton, { ...inputProps })] }));
178
190
  });
179
191
  function DatePickerClearButton(props) {
180
192
  const { clearIcon, clearIconFill, clearIconFillHover, clearIconFillSize, clearIconItemFill, clearIconItemFillHover, clearIconShape, clearIconSize, clearIconSrc, clearLabel, clearLabelTextColor, clearLabelTextColorHover, clearLabelTextSize, datepickerRef, } = props;
181
193
  const onClick = React.useCallback((event) => {
182
194
  datepickerRef?.current?.onClearClick(event);
183
195
  datepickerRef?.current?.handleFocus(event);
196
+ // eslint-disable-next-line react-hooks/exhaustive-deps
184
197
  }, []);
185
198
  return (jsxRuntime.jsx(React.Fragment, { children: clearLabel ? (jsxRuntime.jsx(Label.Label, { className: clsx('react-datepicker__clear-label', 'cursor_type_pointer'), label: clearLabel, labelTextColor: clearLabelTextColor, labelTextColorHover: clearLabelTextColorHover, labelTextSize: clearLabelTextSize, onClick: onClick })) : ((clearIcon || clearIconSrc) && (jsxRuntime.jsx(Icon.Icon, { className: clsx('react-datepicker__clear-icon', 'cursor_type_pointer'), size: clearIconSize, fill: clearIconFill, fillHover: clearIconFillHover, fillSize: clearIconFillSize, iconFill: clearIconItemFill, iconFillHover: clearIconItemFillHover, imageSrc: clearIconSrc, shape: clearIconShape, SvgImage: clearIcon, onClick: onClick }))) }));
186
199
  }
@@ -6,11 +6,11 @@ import DatePicker from 'react-datepicker';
6
6
  import { useAppearanceConfig } from './hooks/useAppearanceConfig/useAppearanceConfig.js';
7
7
  import { useDevicePropsGenerator } from './hooks/useDevicePropsGenerator/useDevicePropsGenerator.js';
8
8
  import { useStyles } from './hooks/useStyles/useStyles.js';
9
- import { B as Button } from './Button_es_BD_2rj1L.js';
10
- import { I as Icon } from './Icon_es_CJuX1p1_.js';
9
+ import { B as Button } from './Button_es_CvRcO3xM.js';
10
+ import { I as Icon } from './Icon_es_CtZHchZc.js';
11
11
  import { I as Input } from './Input_es_I8GPoibb.js';
12
- import { L as Label } from './Label_es_CPJTfGeV.js';
13
- import { T as Text } from './Text_es_C1kfpokr.js';
12
+ import { L as Label } from './Label_es_CI2mt2wH.js';
13
+ import { T as Text } from './Text_es_CU9KR5AE.js';
14
14
  import { icons14 } from '@itcase/icons/default';
15
15
 
16
16
  const datePickerSize = {
@@ -84,16 +84,31 @@ const datePickerAppearance = {
84
84
  ...datePickerStyle,
85
85
  };
86
86
 
87
+ const getWeekRange = (date) => {
88
+ // "getDay" return from 0(sunday) to 6 (saturday).
89
+ // When 0(sunday) - we set as 7(end of week from 1(monday))
90
+ const weekDayIndex = date.getDay() || 7;
91
+ // Collect monday of week from selected date
92
+ const mondayDate = new Date(date);
93
+ mondayDate.setDate(date.getDate() - (weekDayIndex - 1));
94
+ // Collect sunday of week from selected date
95
+ const sundayDate = new Date(mondayDate);
96
+ sundayDate.setDate(mondayDate.getDate() + 6);
97
+ return {
98
+ mondayDate,
99
+ sundayDate,
100
+ };
101
+ };
102
+
87
103
  const datePickerConfig = {
88
104
  appearance: datePickerAppearance,
89
105
  setAppearance: (appearanceConfig) => {
90
106
  datePickerConfig.appearance = appearanceConfig;
91
107
  },
92
108
  };
93
- const INPUT_CLASSNAME = 'datepicker__input';
94
109
  function DatePickerInput(props) {
95
110
  const { className, datePickerProps = {}, endValue, inputProps = {}, value, onChange, } = props;
96
- const { appearance, customTimeInput, disablePastDays, monthsShown, selectsRange, showWeekPicker, } = datePickerProps;
111
+ const { appearance, customTimeInput, disablePastDays, monthsShown, selectsRange, showWeekNumbers, showWeekPicker, } = datePickerProps;
97
112
  const appearanceConfig = useAppearanceConfig(appearance, datePickerConfig);
98
113
  const propsGenerator = useDevicePropsGenerator(datePickerProps, appearanceConfig);
99
114
  const { daySize, dayTextColor, dayTextShape, dayTextSize, iconFill, iconFillHover, iconFillSize, iconItemFill, iconLeft, iconRight, iconShape, monthTextColor, monthTextSize, monthTextWeight, popper, popperPlacement, sizeClass, widthClass, yearTextColor, yearTextSize, yearTextWeight, isClearable, } = propsGenerator;
@@ -122,16 +137,9 @@ function DatePickerInput(props) {
122
137
  const handleChange = useCallback((selected) => {
123
138
  const valuesList = Array.isArray(selected) ? selected : [selected];
124
139
  const [selectedDateStart, selectedDateEnd] = valuesList;
140
+ // "showWeekPicker" means to select full weak by one of day
125
141
  if (selectedDateStart && showWeekPicker) {
126
- // "getDay" return from 0(sunday) to 6 (saturday).
127
- // When 0(sunday) - we set as 7(end of week from 1(monday))
128
- const weekDayIndex = selectedDateStart.getDay() || 7;
129
- // Collect monday of week from selected date
130
- const mondayDate = new Date(selectedDateStart);
131
- mondayDate.setDate(selectedDateStart.getDate() - (weekDayIndex - 1));
132
- // Collect sunday of week from selected date
133
- const sundayDate = new Date(mondayDate);
134
- sundayDate.setDate(mondayDate.getDate() + 6);
142
+ const { mondayDate, sundayDate } = getWeekRange(selectedDateStart);
135
143
  // Selected date can be wednesday, but for week picker
136
144
  // we return start and end of selected week.
137
145
  onChange(mondayDate, sundayDate);
@@ -140,6 +148,10 @@ function DatePickerInput(props) {
140
148
  onChange(selectedDateStart, selectedDateEnd);
141
149
  }
142
150
  }, [showWeekPicker, onChange]);
151
+ const handleWeekSelect = useCallback((startDateOfSelectedWeek) => {
152
+ const { mondayDate, sundayDate } = getWeekRange(startDateOfSelectedWeek);
153
+ onChange(mondayDate, sundayDate);
154
+ }, [onChange]);
143
155
  const renderDayContents = useCallback((day, date) => {
144
156
  return (jsx(Button, { className: "react-datepicker__day-button", size: daySize, label: date.getDate().toString(), labelTextColor: dayTextColor, labelTextSize: dayTextSize, shape: dayTextShape }));
145
157
  }, [daySize, dayTextColor, dayTextShape, dayTextSize]);
@@ -159,7 +171,7 @@ function DatePickerInput(props) {
159
171
  yearTextWeight,
160
172
  ]);
161
173
  const { styles: datePickerStyles } = useStyles(props);
162
- return (jsx("div", { className: clsx(className, 'datepicker', monthsShown && 'datepicker_multiple-months', customTimeInput && 'datepicker_button', sizeClass && `datepicker_size_${sizeClass}`, widthClass && `datepicker_width_${widthClass}`), style: datePickerStyles, children: jsx(DatePicker, { ref: datepickerRef, minDate: disablePastDays ? new Date() : undefined, customInput: jsx(DatePickerCustomInput, { datepickerRef: datepickerRef, inputProps: inputProps, isClearable: isClearable }), endDate: selectsRange ? dateEnd : undefined, locale: ru, outsideClickIgnoreClass: INPUT_CLASSNAME, popperClassName: popper && `react-datepicker-popper-${popper}`, popperPlacement: popperPlacement, preventOpenOnFocus: true, renderCustomHeader: renderCustomHeader, renderDayContents: renderDayContents, selected: dateStart, startDate: dateStart, onChange: handleChange, ...datePickerProps,
174
+ return (jsx("div", { className: clsx(className, 'datepicker', monthsShown && 'datepicker_multiple-months', customTimeInput && 'datepicker_button', sizeClass && `datepicker_size_${sizeClass}`, widthClass && `datepicker_width_${widthClass}`), style: datePickerStyles, children: jsx(DatePicker, { ref: datepickerRef, minDate: disablePastDays ? new Date() : undefined, customInput: jsx(DatePickerCustomInput, { datepickerRef: datepickerRef, inputProps: inputProps, isClearable: isClearable }), endDate: selectsRange ? dateEnd : undefined, locale: ru, outsideClickIgnoreClass: "react-datepicker-popper", popperClassName: popper && `react-datepicker-popper-${popper}`, popperPlacement: popperPlacement, preventOpenOnFocus: true, renderCustomHeader: renderCustomHeader, renderDayContents: renderDayContents, selected: dateStart, startDate: dateStart, onChange: handleChange, onWeekSelect: showWeekNumbers ? handleWeekSelect : undefined, ...datePickerProps,
163
175
  // Important for use custom clear button
164
176
  isClearable: false }) }));
165
177
  }
@@ -172,13 +184,14 @@ const DatePickerCustomInput = React.forwardRef((props, ref) => {
172
184
  }
173
185
  return '';
174
186
  }, [value]);
175
- return (jsxs(React.Fragment, { children: [jsx(Input, { ...props, ...inputProps, className: clsx(inputProps.className, INPUT_CLASSNAME), ref: ref, autocomplete: "off", value: multipleValue, isReadOnly: true }), inputIcon && jsx(DatePickerInputIcon, { ...inputProps }), isClearable && jsx(DatePickerClearButton, { ...inputProps })] }));
187
+ return (jsxs(React.Fragment, { children: [jsx(Input, { ...props, ...inputProps, className: clsx(inputProps.className, 'datepicker__input'), ref: ref, autocomplete: "off", value: multipleValue, isReadOnly: true }), inputIcon && jsx(DatePickerInputIcon, { ...inputProps }), isClearable && jsx(DatePickerClearButton, { ...inputProps })] }));
176
188
  });
177
189
  function DatePickerClearButton(props) {
178
190
  const { clearIcon, clearIconFill, clearIconFillHover, clearIconFillSize, clearIconItemFill, clearIconItemFillHover, clearIconShape, clearIconSize, clearIconSrc, clearLabel, clearLabelTextColor, clearLabelTextColorHover, clearLabelTextSize, datepickerRef, } = props;
179
191
  const onClick = useCallback((event) => {
180
192
  datepickerRef?.current?.onClearClick(event);
181
193
  datepickerRef?.current?.handleFocus(event);
194
+ // eslint-disable-next-line react-hooks/exhaustive-deps
182
195
  }, []);
183
196
  return (jsx(React.Fragment, { children: clearLabel ? (jsx(Label, { className: clsx('react-datepicker__clear-label', 'cursor_type_pointer'), label: clearLabel, labelTextColor: clearLabelTextColor, labelTextColorHover: clearLabelTextColorHover, labelTextSize: clearLabelTextSize, onClick: onClick })) : ((clearIcon || clearIconSrc) && (jsx(Icon, { className: clsx('react-datepicker__clear-icon', 'cursor_type_pointer'), size: clearIconSize, fill: clearIconFill, fillHover: clearIconFillHover, fillSize: clearIconFillSize, iconFill: clearIconItemFill, iconFillHover: clearIconItemFillHover, imageSrc: clearIconSrc, shape: clearIconShape, SvgImage: clearIcon, onClick: onClick }))) }));
184
197
  }
@@ -6,9 +6,9 @@ var clsx = require('clsx');
6
6
  var useAppearanceConfig = require('./cjs/hooks/useAppearanceConfig/useAppearanceConfig.js');
7
7
  var useDevicePropsGenerator = require('./cjs/hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
8
8
  var useStyles = require('./cjs/hooks/useStyles/useStyles.js');
9
- var Icon = require('./Icon_cjs_NpWSQezS.js');
9
+ var Icon = require('./Icon_cjs_BgGtdviU.js');
10
10
  var Divider = require('./Divider_cjs_DrmV2ezS.js');
11
- var Text = require('./Text_cjs_BhnGHF2T.js');
11
+ var Text = require('./Text_cjs_DG2eMKBi.js');
12
12
 
13
13
  const dropdownAppearanceAccent = {
14
14
  accentPrimary: {
@@ -4,9 +4,9 @@ import clsx from 'clsx';
4
4
  import { useAppearanceConfig } from './hooks/useAppearanceConfig/useAppearanceConfig.js';
5
5
  import { useDevicePropsGenerator } from './hooks/useDevicePropsGenerator/useDevicePropsGenerator.js';
6
6
  import { useStyles } from './hooks/useStyles/useStyles.js';
7
- import { I as Icon, B as Badge } from './Icon_es_CJuX1p1_.js';
7
+ import { I as Icon, B as Badge } from './Icon_es_CtZHchZc.js';
8
8
  import { D as Divider } from './Divider_es_BiYozVBS.js';
9
- import { T as Text } from './Text_es_C1kfpokr.js';
9
+ import { T as Text } from './Text_es_CU9KR5AE.js';
10
10
 
11
11
  const dropdownAppearanceAccent = {
12
12
  accentPrimary: {
@@ -9,7 +9,7 @@ var useAppearanceConfig = require('./cjs/hooks/useAppearanceConfig/useAppearance
9
9
  var useDevicePropsGenerator = require('./cjs/hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
10
10
  var useStyles = require('./cjs/hooks/useStyles/useStyles.js');
11
11
  var Link = require('./Link_cjs_qKXVfU8e.js');
12
- var Text = require('./Text_cjs_BhnGHF2T.js');
12
+ var Text = require('./Text_cjs_DG2eMKBi.js');
13
13
 
14
14
  const badgeAppearanceAccent = {
15
15
  accent: {
@@ -539,7 +539,7 @@ const titleConfig = {
539
539
  },
540
540
  };
541
541
  function Title(props) {
542
- const { appearance, className, dataTestId, dataTour, text, afterWrapper, beforeWrapper, tag = 'span', before, after, isActive, isDisabled, isSkeleton, onClick, children, } = props;
542
+ const { appearance, className, dataTestId, dataTour, text, afterWrapper, beforeWrapper, style, tag = 'span', before, after, isActive, isDisabled, isSkeleton, onClick, children, } = props;
543
543
  const appearanceConfig = useAppearanceConfig.useAppearanceConfig(appearance, titleConfig, isDisabled);
544
544
  const propsGenerator = useDevicePropsGenerator.useDevicePropsGenerator(props, appearanceConfig);
545
545
  const { directionClass, size, fillClass, fillHoverClass, textAlignClass, textColorActiveClass, textColorActiveHoverClass, textColorClass, textColorDisabledClass, textColorHoverClass, textFontClass, textStyleClass, textTruncateClass, textWeightClass, textWrap, heightClass, iconAfter, iconAfterFill, iconAfterFillIcon, iconAfterFillSize, iconAfterShape, iconAfterSize, iconAfterSrc, iconBadgeAppearance, iconBadgeShape, iconBadgeSize, iconBadgeTextColor, iconBadgeTextSize, iconBadgeValue, iconBefore, iconBeforeFill, iconBeforeFillIcon, iconBeforeFillSize, iconBeforeShape, iconBeforeSize, iconBeforeSrc, svgFillClass, svgFillHoverClass, widthClass, wrapperDirectionClass, } = propsGenerator;
@@ -566,7 +566,7 @@ function Title(props) {
566
566
  `text-color_hover_${textColorHoverClass}`, isActive &&
567
567
  !isDisabled &&
568
568
  textColorActiveHoverClass &&
569
- `text-color_active_hover${textColorActiveHoverClass}`, textFontClass && `text-font_${textFontClass}`, textStyleClass && `text-style_${textStyleClass}`, textWeightClass && `text-weight_${textWeightClass}`, textWrap && `word-wrap_${textWrap}`, iconBadgeValue && 'title_badge', isSkeleton && 'title_skeleton'), "data-test-id": dataTestId, "data-tour": dataTour, style: titleStyles, onClick: onClick, children: [before, jsxRuntime.jsxs("span", { className: clsx(textAlignClass && `text-align_${textAlignClass}`, wrapperDirectionClass && `title_direction_${wrapperDirectionClass}`, 'title__wrapper', textTruncateClass && `text-truncate_${textTruncateClass}`), style: titleWrapperStyles, children: [(iconBefore || iconBeforeSrc) && (jsxRuntime.jsx(Icon, { className: clsx('title__icon_before', iconBadgeValue && 'title__icon_before-badge'), fill: iconBeforeFill, fillSize: iconBeforeFillSize, badgeAppearance: iconBadgeAppearance, badgeClass: 'title__icon_before_badge', badgeShape: iconBadgeShape, badgeSize: iconBadgeSize, badgeTextColor: iconBadgeTextColor, badgeTextSize: iconBadgeTextSize, badgeValue: iconBadgeValue, iconFill: iconBeforeFillIcon, iconSize: iconBeforeSize, imageSrc: iconBeforeSrc, shape: iconBeforeShape, SvgImage: iconBefore })), beforeWrapper, children || text, afterWrapper, (iconAfter || iconAfterSrc) && (jsxRuntime.jsx(Icon, { className: clsx('title__icon_after', iconBadgeValue && 'title__icon_after-badge'), fill: iconAfterFill, fillSize: iconAfterFillSize, badgeAppearance: iconBadgeAppearance, badgeClass: 'title__icon_after_badge', badgeShape: iconBadgeShape, badgeSize: iconBadgeSize, badgeTextColor: iconBadgeTextColor, badgeTextSize: iconBadgeTextSize, badgeValue: iconBadgeValue, iconFill: iconAfterFillIcon, iconSize: iconAfterSize, imageSrc: iconAfterSrc, shape: iconAfterShape, SvgImage: iconAfter }))] }), after] }));
569
+ `text-color_active_hover${textColorActiveHoverClass}`, textFontClass && `text-font_${textFontClass}`, textStyleClass && `text-style_${textStyleClass}`, textWeightClass && `text-weight_${textWeightClass}`, textWrap && `word-wrap_${textWrap}`, iconBadgeValue && 'title_badge', isSkeleton && 'title_skeleton'), "data-test-id": dataTestId, "data-tour": dataTour, style: Object.assign({}, titleStyles, style), onClick: onClick, children: [before, jsxRuntime.jsxs("span", { className: clsx(textAlignClass && `text-align_${textAlignClass}`, wrapperDirectionClass && `title_direction_${wrapperDirectionClass}`, 'title__wrapper', textTruncateClass && `text-truncate_${textTruncateClass}`), style: titleWrapperStyles, children: [(iconBefore || iconBeforeSrc) && (jsxRuntime.jsx(Icon, { className: clsx('title__icon_before', iconBadgeValue && 'title__icon_before-badge'), fill: iconBeforeFill, fillSize: iconBeforeFillSize, badgeAppearance: iconBadgeAppearance, badgeClass: 'title__icon_before_badge', badgeShape: iconBadgeShape, badgeSize: iconBadgeSize, badgeTextColor: iconBadgeTextColor, badgeTextSize: iconBadgeTextSize, badgeValue: iconBadgeValue, iconFill: iconBeforeFillIcon, iconSize: iconBeforeSize, imageSrc: iconBeforeSrc, shape: iconBeforeShape, SvgImage: iconBefore })), beforeWrapper, children || text, afterWrapper, (iconAfter || iconAfterSrc) && (jsxRuntime.jsx(Icon, { className: clsx('title__icon_after', iconBadgeValue && 'title__icon_after-badge'), fill: iconAfterFill, fillSize: iconAfterFillSize, badgeAppearance: iconBadgeAppearance, badgeClass: 'title__icon_after_badge', badgeShape: iconBadgeShape, badgeSize: iconBadgeSize, badgeTextColor: iconBadgeTextColor, badgeTextSize: iconBadgeTextSize, badgeValue: iconBadgeValue, iconFill: iconAfterFillIcon, iconSize: iconAfterSize, imageSrc: iconAfterSrc, shape: iconAfterShape, SvgImage: iconAfter }))] }), after] }));
570
570
  }
571
571
 
572
572
  const tooltipAppearanceDefault = {
@@ -7,7 +7,7 @@ import { useAppearanceConfig } from './hooks/useAppearanceConfig/useAppearanceCo
7
7
  import { useDevicePropsGenerator } from './hooks/useDevicePropsGenerator/useDevicePropsGenerator.js';
8
8
  import { useStyles } from './hooks/useStyles/useStyles.js';
9
9
  import { a as LinkWrapper } from './Link_es_P2b6ya7P.js';
10
- import { T as Text } from './Text_es_C1kfpokr.js';
10
+ import { T as Text } from './Text_es_CU9KR5AE.js';
11
11
 
12
12
  const badgeAppearanceAccent = {
13
13
  accent: {
@@ -537,7 +537,7 @@ const titleConfig = {
537
537
  },
538
538
  };
539
539
  function Title(props) {
540
- const { appearance, className, dataTestId, dataTour, text, afterWrapper, beforeWrapper, tag = 'span', before, after, isActive, isDisabled, isSkeleton, onClick, children, } = props;
540
+ const { appearance, className, dataTestId, dataTour, text, afterWrapper, beforeWrapper, style, tag = 'span', before, after, isActive, isDisabled, isSkeleton, onClick, children, } = props;
541
541
  const appearanceConfig = useAppearanceConfig(appearance, titleConfig, isDisabled);
542
542
  const propsGenerator = useDevicePropsGenerator(props, appearanceConfig);
543
543
  const { directionClass, size, fillClass, fillHoverClass, textAlignClass, textColorActiveClass, textColorActiveHoverClass, textColorClass, textColorDisabledClass, textColorHoverClass, textFontClass, textStyleClass, textTruncateClass, textWeightClass, textWrap, heightClass, iconAfter, iconAfterFill, iconAfterFillIcon, iconAfterFillSize, iconAfterShape, iconAfterSize, iconAfterSrc, iconBadgeAppearance, iconBadgeShape, iconBadgeSize, iconBadgeTextColor, iconBadgeTextSize, iconBadgeValue, iconBefore, iconBeforeFill, iconBeforeFillIcon, iconBeforeFillSize, iconBeforeShape, iconBeforeSize, iconBeforeSrc, svgFillClass, svgFillHoverClass, widthClass, wrapperDirectionClass, } = propsGenerator;
@@ -564,7 +564,7 @@ function Title(props) {
564
564
  `text-color_hover_${textColorHoverClass}`, isActive &&
565
565
  !isDisabled &&
566
566
  textColorActiveHoverClass &&
567
- `text-color_active_hover${textColorActiveHoverClass}`, textFontClass && `text-font_${textFontClass}`, textStyleClass && `text-style_${textStyleClass}`, textWeightClass && `text-weight_${textWeightClass}`, textWrap && `word-wrap_${textWrap}`, iconBadgeValue && 'title_badge', isSkeleton && 'title_skeleton'), "data-test-id": dataTestId, "data-tour": dataTour, style: titleStyles, onClick: onClick, children: [before, jsxs("span", { className: clsx(textAlignClass && `text-align_${textAlignClass}`, wrapperDirectionClass && `title_direction_${wrapperDirectionClass}`, 'title__wrapper', textTruncateClass && `text-truncate_${textTruncateClass}`), style: titleWrapperStyles, children: [(iconBefore || iconBeforeSrc) && (jsx(Icon, { className: clsx('title__icon_before', iconBadgeValue && 'title__icon_before-badge'), fill: iconBeforeFill, fillSize: iconBeforeFillSize, badgeAppearance: iconBadgeAppearance, badgeClass: 'title__icon_before_badge', badgeShape: iconBadgeShape, badgeSize: iconBadgeSize, badgeTextColor: iconBadgeTextColor, badgeTextSize: iconBadgeTextSize, badgeValue: iconBadgeValue, iconFill: iconBeforeFillIcon, iconSize: iconBeforeSize, imageSrc: iconBeforeSrc, shape: iconBeforeShape, SvgImage: iconBefore })), beforeWrapper, children || text, afterWrapper, (iconAfter || iconAfterSrc) && (jsx(Icon, { className: clsx('title__icon_after', iconBadgeValue && 'title__icon_after-badge'), fill: iconAfterFill, fillSize: iconAfterFillSize, badgeAppearance: iconBadgeAppearance, badgeClass: 'title__icon_after_badge', badgeShape: iconBadgeShape, badgeSize: iconBadgeSize, badgeTextColor: iconBadgeTextColor, badgeTextSize: iconBadgeTextSize, badgeValue: iconBadgeValue, iconFill: iconAfterFillIcon, iconSize: iconAfterSize, imageSrc: iconAfterSrc, shape: iconAfterShape, SvgImage: iconAfter }))] }), after] }));
567
+ `text-color_active_hover${textColorActiveHoverClass}`, textFontClass && `text-font_${textFontClass}`, textStyleClass && `text-style_${textStyleClass}`, textWeightClass && `text-weight_${textWeightClass}`, textWrap && `word-wrap_${textWrap}`, iconBadgeValue && 'title_badge', isSkeleton && 'title_skeleton'), "data-test-id": dataTestId, "data-tour": dataTour, style: Object.assign({}, titleStyles, style), onClick: onClick, children: [before, jsxs("span", { className: clsx(textAlignClass && `text-align_${textAlignClass}`, wrapperDirectionClass && `title_direction_${wrapperDirectionClass}`, 'title__wrapper', textTruncateClass && `text-truncate_${textTruncateClass}`), style: titleWrapperStyles, children: [(iconBefore || iconBeforeSrc) && (jsx(Icon, { className: clsx('title__icon_before', iconBadgeValue && 'title__icon_before-badge'), fill: iconBeforeFill, fillSize: iconBeforeFillSize, badgeAppearance: iconBadgeAppearance, badgeClass: 'title__icon_before_badge', badgeShape: iconBadgeShape, badgeSize: iconBadgeSize, badgeTextColor: iconBadgeTextColor, badgeTextSize: iconBadgeTextSize, badgeValue: iconBadgeValue, iconFill: iconBeforeFillIcon, iconSize: iconBeforeSize, imageSrc: iconBeforeSrc, shape: iconBeforeShape, SvgImage: iconBefore })), beforeWrapper, children || text, afterWrapper, (iconAfter || iconAfterSrc) && (jsx(Icon, { className: clsx('title__icon_after', iconBadgeValue && 'title__icon_after-badge'), fill: iconAfterFill, fillSize: iconAfterFillSize, badgeAppearance: iconBadgeAppearance, badgeClass: 'title__icon_after_badge', badgeShape: iconBadgeShape, badgeSize: iconBadgeSize, badgeTextColor: iconBadgeTextColor, badgeTextSize: iconBadgeTextSize, badgeValue: iconBadgeValue, iconFill: iconAfterFillIcon, iconSize: iconAfterSize, imageSrc: iconAfterSrc, shape: iconAfterShape, SvgImage: iconAfter }))] }), after] }));
568
568
  }
569
569
 
570
570
  const tooltipAppearanceDefault = {
@@ -6,8 +6,8 @@ var clsx = require('clsx');
6
6
  var useAppearanceConfig = require('./cjs/hooks/useAppearanceConfig/useAppearanceConfig.js');
7
7
  var useDevicePropsGenerator = require('./cjs/hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
8
8
  var useStyles = require('./cjs/hooks/useStyles/useStyles.js');
9
- var Icon = require('./Icon_cjs_NpWSQezS.js');
10
- var Text = require('./Text_cjs_BhnGHF2T.js');
9
+ var Icon = require('./Icon_cjs_BgGtdviU.js');
10
+ var Text = require('./Text_cjs_DG2eMKBi.js');
11
11
 
12
12
  const labelAppearanceAccent = {
13
13
  accentMutedPrimary: {
@@ -4,8 +4,8 @@ import clsx from 'clsx';
4
4
  import { useAppearanceConfig } from './hooks/useAppearanceConfig/useAppearanceConfig.js';
5
5
  import { useDevicePropsGenerator } from './hooks/useDevicePropsGenerator/useDevicePropsGenerator.js';
6
6
  import { useStyles } from './hooks/useStyles/useStyles.js';
7
- import { I as Icon, T as Tooltip } from './Icon_es_CJuX1p1_.js';
8
- import { T as Text } from './Text_es_C1kfpokr.js';
7
+ import { I as Icon, T as Tooltip } from './Icon_es_CtZHchZc.js';
8
+ import { T as Text } from './Text_es_CU9KR5AE.js';
9
9
 
10
10
  const labelAppearanceAccent = {
11
11
  accentMutedPrimary: {
@@ -5,7 +5,7 @@ var clsx = require('clsx');
5
5
  var useAppearanceConfig = require('./cjs/hooks/useAppearanceConfig/useAppearanceConfig.js');
6
6
  var useDevicePropsGenerator = require('./cjs/hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
7
7
  var useStyles = require('./cjs/hooks/useStyles/useStyles.js');
8
- var Text = require('./Text_cjs_BhnGHF2T.js');
8
+ var Text = require('./Text_cjs_DG2eMKBi.js');
9
9
 
10
10
  const loaderAppearanceAccent = {
11
11
  accentPrimary: {
@@ -3,7 +3,7 @@ import clsx from 'clsx';
3
3
  import { useAppearanceConfig } from './hooks/useAppearanceConfig/useAppearanceConfig.js';
4
4
  import { useDevicePropsGenerator } from './hooks/useDevicePropsGenerator/useDevicePropsGenerator.js';
5
5
  import { useStyles } from './hooks/useStyles/useStyles.js';
6
- import { T as Text } from './Text_es_C1kfpokr.js';
6
+ import { T as Text } from './Text_es_CU9KR5AE.js';
7
7
 
8
8
  const loaderAppearanceAccent = {
9
9
  accentPrimary: {
@@ -8,10 +8,10 @@ var CreatableSelect = require('react-select/creatable');
8
8
  var useAppearanceConfig = require('./cjs/hooks/useAppearanceConfig/useAppearanceConfig.js');
9
9
  var useDevicePropsGenerator = require('./cjs/hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
10
10
  var Group = require('./Group_cjs_CFzdSMKV.js');
11
- var Text = require('./Text_cjs_BhnGHF2T.js');
11
+ var Text = require('./Text_cjs_DG2eMKBi.js');
12
12
  var _default = require('@itcase/icons/default');
13
- var Icon = require('./Icon_cjs_NpWSQezS.js');
14
- var Loader = require('./Loader_cjs_rHdGFWUi.js');
13
+ var Icon = require('./Icon_cjs_BgGtdviU.js');
14
+ var Loader = require('./Loader_cjs_DWBtnjaL.js');
15
15
  var Divider = require('./Divider_cjs_DrmV2ezS.js');
16
16
 
17
17
  // interface ClearIndicatorProps<Option, IsMulti extends boolean, Group extends GroupBase<Option>>
@@ -6,10 +6,10 @@ import CreatableSelect from 'react-select/creatable';
6
6
  import { useAppearanceConfig } from './hooks/useAppearanceConfig/useAppearanceConfig.js';
7
7
  import { useDevicePropsGenerator } from './hooks/useDevicePropsGenerator/useDevicePropsGenerator.js';
8
8
  import { G as Group } from './Group_es_BwTj-yH-.js';
9
- import { T as Text } from './Text_es_C1kfpokr.js';
9
+ import { T as Text } from './Text_es_CU9KR5AE.js';
10
10
  import { icons12, icons16, icons14, icons24 } from '@itcase/icons/default';
11
- import { I as Icon, B as Badge } from './Icon_es_CJuX1p1_.js';
12
- import { L as Loader } from './Loader_es_D4Vd79Gk.js';
11
+ import { I as Icon, B as Badge } from './Icon_es_CtZHchZc.js';
12
+ import { L as Loader } from './Loader_es_BvTBRuay.js';
13
13
  import { D as Divider } from './Divider_es_BiYozVBS.js';
14
14
 
15
15
  // interface ClearIndicatorProps<Option, IsMulti extends boolean, Group extends GroupBase<Option>>
@@ -41,7 +41,7 @@ const textConfig = {
41
41
  },
42
42
  };
43
43
  function Text(props) {
44
- const { appearance, className, dataTestId, dataTour, cursor, htmlFor, tag: Tag = 'span', before, after, isActive, isDisabled, isSkeleton, onClick, onDoubleClick, children, } = props;
44
+ const { appearance, className, dataTestId, dataTour, cursor, htmlFor, style, tag: Tag = 'span', before, after, isActive, isDisabled, isSkeleton, onClick, onDoubleClick, children, } = props;
45
45
  const appearanceConfig = useAppearanceConfig.useAppearanceConfig(appearance, textConfig, isDisabled);
46
46
  const propsGenerator = useDevicePropsGenerator.useDevicePropsGenerator(props, appearanceConfig);
47
47
  const { textAlignClass, textColorActiveClass, textColorActiveHoverClass, textColorClass, textColorDisabledClass, textColorHoverClass, textFontClass, textStyleClass, textTruncateClass, textWeightClass, textWrapClass, cursorClass, sizeClass, widthClass, } = propsGenerator;
@@ -61,7 +61,7 @@ function Text(props) {
61
61
  `text-color_active_hover_${textColorActiveHoverClass}`, isActive &&
62
62
  !isDisabled &&
63
63
  textColorActiveClass &&
64
- `text-color_active_${textColorActiveClass}`, textFontClass && `text-font_${textFontClass}`, textStyleClass && `text-style_${textStyleClass}`, textWrapClass && `word-wrap_${textWrapClass}`, textTruncateClass && `text-truncate_${textTruncateClass}`, isSkeleton && 'text_skeleton', widthClass && `width_${widthClass}`, cursorClass && `cursor_${cursorClass}`, onClick && (cursor || 'cursor_type_pointer')), "data-test-id": dataTestId, "data-tour": dataTour, htmlFor: htmlFor, style: textStyles, onClick: onClick, onDoubleClick: onDoubleClick, children: [before, children, after] }));
64
+ `text-color_active_${textColorActiveClass}`, textFontClass && `text-font_${textFontClass}`, textStyleClass && `text-style_${textStyleClass}`, textWrapClass && `word-wrap_${textWrapClass}`, textTruncateClass && `text-truncate_${textTruncateClass}`, isSkeleton && 'text_skeleton', widthClass && `width_${widthClass}`, cursorClass && `cursor_${cursorClass}`, onClick && (cursor || 'cursor_type_pointer')), "data-test-id": dataTestId, "data-tour": dataTour, htmlFor: htmlFor, style: Object.assign({}, textStyles, style), onClick: onClick, onDoubleClick: onDoubleClick, children: [before, children, after] }));
65
65
  }
66
66
 
67
67
  exports.Text = Text;
@@ -39,7 +39,7 @@ const textConfig = {
39
39
  },
40
40
  };
41
41
  function Text(props) {
42
- const { appearance, className, dataTestId, dataTour, cursor, htmlFor, tag: Tag = 'span', before, after, isActive, isDisabled, isSkeleton, onClick, onDoubleClick, children, } = props;
42
+ const { appearance, className, dataTestId, dataTour, cursor, htmlFor, style, tag: Tag = 'span', before, after, isActive, isDisabled, isSkeleton, onClick, onDoubleClick, children, } = props;
43
43
  const appearanceConfig = useAppearanceConfig(appearance, textConfig, isDisabled);
44
44
  const propsGenerator = useDevicePropsGenerator(props, appearanceConfig);
45
45
  const { textAlignClass, textColorActiveClass, textColorActiveHoverClass, textColorClass, textColorDisabledClass, textColorHoverClass, textFontClass, textStyleClass, textTruncateClass, textWeightClass, textWrapClass, cursorClass, sizeClass, widthClass, } = propsGenerator;
@@ -59,7 +59,7 @@ function Text(props) {
59
59
  `text-color_active_hover_${textColorActiveHoverClass}`, isActive &&
60
60
  !isDisabled &&
61
61
  textColorActiveClass &&
62
- `text-color_active_${textColorActiveClass}`, textFontClass && `text-font_${textFontClass}`, textStyleClass && `text-style_${textStyleClass}`, textWrapClass && `word-wrap_${textWrapClass}`, textTruncateClass && `text-truncate_${textTruncateClass}`, isSkeleton && 'text_skeleton', widthClass && `width_${widthClass}`, cursorClass && `cursor_${cursorClass}`, onClick && (cursor || 'cursor_type_pointer')), "data-test-id": dataTestId, "data-tour": dataTour, htmlFor: htmlFor, style: textStyles, onClick: onClick, onDoubleClick: onDoubleClick, children: [before, children, after] }));
62
+ `text-color_active_${textColorActiveClass}`, textFontClass && `text-font_${textFontClass}`, textStyleClass && `text-style_${textStyleClass}`, textWrapClass && `word-wrap_${textWrapClass}`, textTruncateClass && `text-truncate_${textTruncateClass}`, isSkeleton && 'text_skeleton', widthClass && `width_${widthClass}`, cursorClass && `cursor_${cursorClass}`, onClick && (cursor || 'cursor_type_pointer')), "data-test-id": dataTestId, "data-tour": dataTour, htmlFor: htmlFor, style: Object.assign({}, textStyles, style), onClick: onClick, onDoubleClick: onDoubleClick, children: [before, children, after] }));
63
63
  }
64
64
 
65
65
  export { Text as T, textAppearance as a, textConfig as t };
@@ -7,9 +7,9 @@ var castArray = require('lodash/castArray');
7
7
  var useDevicePropsGenerator = require('../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
8
8
  var useStyles = require('../hooks/useStyles/useStyles.js');
9
9
  var useAppearanceConfig = require('../hooks/useAppearanceConfig/useAppearanceConfig.js');
10
- var Icon = require('../../Icon_cjs_NpWSQezS.js');
10
+ var Icon = require('../../Icon_cjs_BgGtdviU.js');
11
11
  var Divider = require('../../Divider_cjs_DrmV2ezS.js');
12
- var Text = require('../../Text_cjs_BhnGHF2T.js');
12
+ var Text = require('../../Text_cjs_DG2eMKBi.js');
13
13
  var _default = require('@itcase/icons/default');
14
14
  require('lodash/camelCase');
15
15
  require('lodash/upperFirst');
@@ -1,6 +1,6 @@
1
1
  'use strict';
2
2
 
3
- var Avatar = require('../../Avatar_cjs_ZK4mnb7m.js');
3
+ var Avatar = require('../../Avatar_cjs_DRZE113U.js');
4
4
  require('react/jsx-runtime');
5
5
  require('react');
6
6
  require('clsx');
@@ -18,14 +18,14 @@ require('react-responsive');
18
18
  require('../utils/setViewportProperty.js');
19
19
  require('../hooks.js');
20
20
  require('../hooks/useStyles/styleAttributes.js');
21
- require('../../Icon_cjs_NpWSQezS.js');
21
+ require('../../Icon_cjs_BgGtdviU.js');
22
22
  require('react-inlinesvg');
23
23
  require('../hoc/urlWithAssetPrefix.js');
24
24
  require('../context/UrlAssetPrefix.js');
25
25
  require('../hooks/useStyles/useStyles.js');
26
26
  require('lodash/maxBy');
27
27
  require('../../Link_cjs_qKXVfU8e.js');
28
- require('../../Text_cjs_BhnGHF2T.js');
28
+ require('../../Text_cjs_DG2eMKBi.js');
29
29
  require('../../Image_cjs_BUM81t4Y.js');
30
30
 
31
31
 
@@ -5,9 +5,9 @@ var clsx = require('clsx');
5
5
  var useAppearanceConfig = require('../hooks/useAppearanceConfig/useAppearanceConfig.js');
6
6
  var useDevicePropsGenerator = require('../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
7
7
  var useStyles = require('../hooks/useStyles/useStyles.js');
8
- var Avatar = require('../../Avatar_cjs_ZK4mnb7m.js');
8
+ var Avatar = require('../../Avatar_cjs_DRZE113U.js');
9
9
  var Group = require('../../Group_cjs_CFzdSMKV.js');
10
- var Text = require('../../Text_cjs_BhnGHF2T.js');
10
+ var Text = require('../../Text_cjs_DG2eMKBi.js');
11
11
  require('react');
12
12
  require('lodash/camelCase');
13
13
  require('lodash/castArray');
@@ -22,7 +22,7 @@ require('../utils/setViewportProperty.js');
22
22
  require('../hooks.js');
23
23
  require('../hooks/useStyles/styleAttributes.js');
24
24
  require('lodash/maxBy');
25
- require('../../Icon_cjs_NpWSQezS.js');
25
+ require('../../Icon_cjs_BgGtdviU.js');
26
26
  require('react-inlinesvg');
27
27
  require('../hoc/urlWithAssetPrefix.js');
28
28
  require('../context/UrlAssetPrefix.js');
@@ -1,6 +1,6 @@
1
1
  'use strict';
2
2
 
3
- var Icon = require('../../Icon_cjs_NpWSQezS.js');
3
+ var Icon = require('../../Icon_cjs_BgGtdviU.js');
4
4
  require('react/jsx-runtime');
5
5
  require('react');
6
6
  require('clsx');
@@ -24,7 +24,7 @@ require('../hooks/useStyles/styleAttributes.js');
24
24
  require('../hooks/useStyles/useStyles.js');
25
25
  require('lodash/maxBy');
26
26
  require('../../Link_cjs_qKXVfU8e.js');
27
- require('../../Text_cjs_BhnGHF2T.js');
27
+ require('../../Text_cjs_DG2eMKBi.js');
28
28
 
29
29
 
30
30