@itcase/ui 1.8.157 → 1.8.159

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.
@@ -10,7 +10,7 @@ var useDevicePropsGenerator = require('./cjs/hooks/useDevicePropsGenerator/useDe
10
10
  var useStyles = require('./cjs/hooks/useStyles/useStyles.js');
11
11
  var Button = require('./Button_cjs_CGIzPuXo.js');
12
12
  var Icon = require('./Icon_cjs_B5o0K55R.js');
13
- var Input = require('./Input_cjs_DDi5JVAV.js');
13
+ var Input = require('./Input_cjs_IhuIPBIq.js');
14
14
  var Label = require('./Label_cjs_DRIwteHh.js');
15
15
  var Text = require('./Text_cjs_DaH5tVvz.js');
16
16
  var _default = require('@itcase/icons/default');
@@ -92,6 +92,7 @@ const datePickerConfig = {
92
92
  datePickerConfig.appearance = appearanceConfig;
93
93
  },
94
94
  };
95
+ const INPUT_CLASSNAME = 'datepicker__input';
95
96
  function DatePickerInput(props) {
96
97
  const { className, datePickerProps = {}, endValue, inputProps = {}, value, onChange, } = props;
97
98
  const { appearance, customTimeInput, disablePastDays, monthsShown, selectsRange, showWeekPicker, } = datePickerProps;
@@ -160,7 +161,7 @@ function DatePickerInput(props) {
160
161
  yearTextWeight,
161
162
  ]);
162
163
  const { styles: datePickerStyles } = useStyles.useStyles(props);
163
- 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, popperClassName: popper && `react-datepicker-popper-${popper}`, popperPlacement: popperPlacement, renderCustomHeader: renderCustomHeader, renderDayContents: renderDayContents, selected: dateStart, startDate: dateStart, onChange: handleChange, ...datePickerProps,
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,
164
165
  // Important for use custom clear button
165
166
  isClearable: false }) }));
166
167
  }
@@ -173,7 +174,7 @@ const DatePickerCustomInput = React.forwardRef((props, ref) => {
173
174
  }
174
175
  return '';
175
176
  }, [value]);
176
- return (jsxRuntime.jsxs(React.Fragment, { children: [jsxRuntime.jsx(Input.Input, { ...props, ...inputProps, className: clsx(inputProps.className, 'datepicker__input'), ref: ref, autocomplete: "off", value: multipleValue }), inputIcon && jsxRuntime.jsx(DatePickerInputIcon, { ...inputProps }), isClearable && jsxRuntime.jsx(DatePickerClearButton, { ...inputProps })] }));
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 })] }));
177
178
  });
178
179
  function DatePickerClearButton(props) {
179
180
  const { clearIcon, clearIconFill, clearIconFillHover, clearIconFillSize, clearIconItemFill, clearIconItemFillHover, clearIconShape, clearIconSize, clearIconSrc, clearLabel, clearLabelTextColor, clearLabelTextColorHover, clearLabelTextSize, datepickerRef, } = props;
@@ -8,7 +8,7 @@ import { useDevicePropsGenerator } from './hooks/useDevicePropsGenerator/useDevi
8
8
  import { useStyles } from './hooks/useStyles/useStyles.js';
9
9
  import { B as Button } from './Button_es_CtAnUzZA.js';
10
10
  import { I as Icon } from './Icon_es_BEhzKfrD.js';
11
- import { I as Input } from './Input_es_BnCXATnh.js';
11
+ import { I as Input } from './Input_es_CifTvE3z.js';
12
12
  import { L as Label } from './Label_es_DYd2RwDK.js';
13
13
  import { T as Text } from './Text_es_RDU9GLCV.js';
14
14
  import { icons14 } from '@itcase/icons/default';
@@ -90,6 +90,7 @@ const datePickerConfig = {
90
90
  datePickerConfig.appearance = appearanceConfig;
91
91
  },
92
92
  };
93
+ const INPUT_CLASSNAME = 'datepicker__input';
93
94
  function DatePickerInput(props) {
94
95
  const { className, datePickerProps = {}, endValue, inputProps = {}, value, onChange, } = props;
95
96
  const { appearance, customTimeInput, disablePastDays, monthsShown, selectsRange, showWeekPicker, } = datePickerProps;
@@ -158,7 +159,7 @@ function DatePickerInput(props) {
158
159
  yearTextWeight,
159
160
  ]);
160
161
  const { styles: datePickerStyles } = useStyles(props);
161
- 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, popperClassName: popper && `react-datepicker-popper-${popper}`, popperPlacement: popperPlacement, renderCustomHeader: renderCustomHeader, renderDayContents: renderDayContents, selected: dateStart, startDate: dateStart, onChange: handleChange, ...datePickerProps,
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,
162
163
  // Important for use custom clear button
163
164
  isClearable: false }) }));
164
165
  }
@@ -171,7 +172,7 @@ const DatePickerCustomInput = React.forwardRef((props, ref) => {
171
172
  }
172
173
  return '';
173
174
  }, [value]);
174
- return (jsxs(React.Fragment, { children: [jsx(Input, { ...props, ...inputProps, className: clsx(inputProps.className, 'datepicker__input'), ref: ref, autocomplete: "off", value: multipleValue }), inputIcon && jsx(DatePickerInputIcon, { ...inputProps }), isClearable && jsx(DatePickerClearButton, { ...inputProps })] }));
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 })] }));
175
176
  });
176
177
  function DatePickerClearButton(props) {
177
178
  const { clearIcon, clearIconFill, clearIconFillHover, clearIconFillSize, clearIconItemFill, clearIconItemFillHover, clearIconShape, clearIconSize, clearIconSrc, clearLabel, clearLabelTextColor, clearLabelTextColorHover, clearLabelTextSize, datepickerRef, } = props;
@@ -209,12 +209,12 @@ const inputConfig = {
209
209
  },
210
210
  };
211
211
  const Input = React.forwardRef(function Input(props, ref) {
212
- const { id, appearance, className, dataTestId, type = 'text', name, autocomplete, index, placeholder, value, isDisabled, onBlur, onChange, onFocus, onKeyDown, } = props;
212
+ const { id, appearance, className, dataTestId, type = 'text', name, autocomplete, index, placeholder, value, isDisabled, isReadOnly, onClick, onBlur, onChange, onFocus, onKeyDown, } = props;
213
213
  const appearanceConfig = useAppearanceConfig.useAppearanceConfig(appearance, inputConfig, isDisabled);
214
214
  const propsGenerator = useDevicePropsGenerator.useDevicePropsGenerator(props, appearanceConfig);
215
215
  const { fillClass, fillHoverClass, borderColorClass, borderColorHoverClass, borderWidthClass, textColorClass, textSizeClass, textWeightClass, caretClass, placeholderTextColorClass, shapeClass, shapeStrengthClass, sizeClass, widthClass, } = propsGenerator;
216
216
  return (jsxRuntime.jsx("input", { id: String(id), className: clsx(className, 'input', type === 'number' && 'input_type_number', isDisabled && 'input_state_disabled', (textSizeClass || textColorClass || textWeightClass) && 'text', borderColorClass && `border-color_${borderColorClass}`, borderColorHoverClass && `border-color_hover_${borderColorHoverClass}`, borderWidthClass && `border-width_${borderWidthClass}`, caretClass && `caret-color_${caretClass}`, fillClass && `fill_${fillClass}`, fillHoverClass && `fill_hover_${fillHoverClass}`, placeholderTextColorClass &&
217
- `placeholder-text-color_${placeholderTextColorClass}`, shapeClass && `shape_${shapeClass}`, shapeStrengthClass && `shape-strength_${shapeStrengthClass}`, sizeClass && `input_size_${sizeClass}`, textColorClass && `text-color_${textColorClass}`, textColorClass && `text-color_${textColorClass}`, textSizeClass && `text_size_${textSizeClass}`, textWeightClass && `text-weight_${textWeightClass}`, widthClass && `width_${widthClass}`), type: type, ref: ref, disabled: isDisabled, autoComplete: autocomplete, "data-test-id": dataTestId || (name ? `${name}Input` : 'input'), index: index, placeholder: placeholder, value: value, onBlur: onBlur, onChange: onChange, onFocus: onFocus, onKeyDown: onKeyDown }));
217
+ `placeholder-text-color_${placeholderTextColorClass}`, shapeClass && `shape_${shapeClass}`, shapeStrengthClass && `shape-strength_${shapeStrengthClass}`, sizeClass && `input_size_${sizeClass}`, textColorClass && `text-color_${textColorClass}`, textColorClass && `text-color_${textColorClass}`, textSizeClass && `text_size_${textSizeClass}`, textWeightClass && `text-weight_${textWeightClass}`, widthClass && `width_${widthClass}`), type: type, ref: ref, autoComplete: autocomplete, "data-test-id": dataTestId || (name ? `${name}Input` : 'input'), disabled: isDisabled, index: index, placeholder: placeholder, readOnly: isReadOnly, value: value, onClick: onClick, onBlur: onBlur, onChange: onChange, onFocus: onFocus, onKeyDown: onKeyDown }));
218
218
  });
219
219
 
220
220
  exports.Input = Input;
@@ -207,12 +207,12 @@ const inputConfig = {
207
207
  },
208
208
  };
209
209
  const Input = React.forwardRef(function Input(props, ref) {
210
- const { id, appearance, className, dataTestId, type = 'text', name, autocomplete, index, placeholder, value, isDisabled, onBlur, onChange, onFocus, onKeyDown, } = props;
210
+ const { id, appearance, className, dataTestId, type = 'text', name, autocomplete, index, placeholder, value, isDisabled, isReadOnly, onClick, onBlur, onChange, onFocus, onKeyDown, } = props;
211
211
  const appearanceConfig = useAppearanceConfig(appearance, inputConfig, isDisabled);
212
212
  const propsGenerator = useDevicePropsGenerator(props, appearanceConfig);
213
213
  const { fillClass, fillHoverClass, borderColorClass, borderColorHoverClass, borderWidthClass, textColorClass, textSizeClass, textWeightClass, caretClass, placeholderTextColorClass, shapeClass, shapeStrengthClass, sizeClass, widthClass, } = propsGenerator;
214
214
  return (jsx("input", { id: String(id), className: clsx(className, 'input', type === 'number' && 'input_type_number', isDisabled && 'input_state_disabled', (textSizeClass || textColorClass || textWeightClass) && 'text', borderColorClass && `border-color_${borderColorClass}`, borderColorHoverClass && `border-color_hover_${borderColorHoverClass}`, borderWidthClass && `border-width_${borderWidthClass}`, caretClass && `caret-color_${caretClass}`, fillClass && `fill_${fillClass}`, fillHoverClass && `fill_hover_${fillHoverClass}`, placeholderTextColorClass &&
215
- `placeholder-text-color_${placeholderTextColorClass}`, shapeClass && `shape_${shapeClass}`, shapeStrengthClass && `shape-strength_${shapeStrengthClass}`, sizeClass && `input_size_${sizeClass}`, textColorClass && `text-color_${textColorClass}`, textColorClass && `text-color_${textColorClass}`, textSizeClass && `text_size_${textSizeClass}`, textWeightClass && `text-weight_${textWeightClass}`, widthClass && `width_${widthClass}`), type: type, ref: ref, disabled: isDisabled, autoComplete: autocomplete, "data-test-id": dataTestId || (name ? `${name}Input` : 'input'), index: index, placeholder: placeholder, value: value, onBlur: onBlur, onChange: onChange, onFocus: onFocus, onKeyDown: onKeyDown }));
215
+ `placeholder-text-color_${placeholderTextColorClass}`, shapeClass && `shape_${shapeClass}`, shapeStrengthClass && `shape-strength_${shapeStrengthClass}`, sizeClass && `input_size_${sizeClass}`, textColorClass && `text-color_${textColorClass}`, textColorClass && `text-color_${textColorClass}`, textSizeClass && `text_size_${textSizeClass}`, textWeightClass && `text-weight_${textWeightClass}`, widthClass && `width_${widthClass}`), type: type, ref: ref, autoComplete: autocomplete, "data-test-id": dataTestId || (name ? `${name}Input` : 'input'), disabled: isDisabled, index: index, placeholder: placeholder, readOnly: isReadOnly, value: value, onClick: onClick, onBlur: onBlur, onChange: onChange, onFocus: onFocus, onKeyDown: onKeyDown }));
216
216
  });
217
217
 
218
218
  export { Input as I, inputAppearance as a, inputConfig as i };
@@ -4,7 +4,7 @@ var jsxRuntime = require('react/jsx-runtime');
4
4
  var React = require('react');
5
5
  var clsx = require('clsx');
6
6
  var reactDadata = require('react-dadata');
7
- var Input = require('../../Input_cjs_DDi5JVAV.js');
7
+ var Input = require('../../Input_cjs_IhuIPBIq.js');
8
8
  require('../hooks/useAppearanceConfig/useAppearanceConfig.js');
9
9
  require('../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
10
10
  require('lodash/camelCase');
@@ -5,7 +5,7 @@ var React = require('react');
5
5
  var clsx = require('clsx');
6
6
  var luxon = require('luxon');
7
7
  var common = require('@itcase/common');
8
- var DatePicker = require('../../DatePicker_cjs_CccRZSjc.js');
8
+ var DatePicker = require('../../DatePicker_cjs_BtYlDJ7u.js');
9
9
  var useAppearanceConfig = require('../hooks/useAppearanceConfig/useAppearanceConfig.js');
10
10
  var useDevicePropsGenerator = require('../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
11
11
  var ChipsGroup = require('../../ChipsGroup_cjs_DVizkQ4v.js');
@@ -31,7 +31,7 @@ require('../context/UrlAssetPrefix.js');
31
31
  require('../../Link_cjs_qKXVfU8e.js');
32
32
  require('../../Text_cjs_DaH5tVvz.js');
33
33
  require('../../Loader_cjs_CRiUlTC3.js');
34
- require('../../Input_cjs_DDi5JVAV.js');
34
+ require('../../Input_cjs_IhuIPBIq.js');
35
35
  require('../../Label_cjs_DRIwteHh.js');
36
36
  require('@itcase/icons/default');
37
37
  require('lodash/castArray');
@@ -1,6 +1,6 @@
1
1
  'use strict';
2
2
 
3
- var DatePicker = require('../../DatePicker_cjs_CccRZSjc.js');
3
+ var DatePicker = require('../../DatePicker_cjs_BtYlDJ7u.js');
4
4
  require('react/jsx-runtime');
5
5
  require('react');
6
6
  require('clsx');
@@ -30,7 +30,7 @@ require('../context/UrlAssetPrefix.js');
30
30
  require('../../Link_cjs_qKXVfU8e.js');
31
31
  require('../../Text_cjs_DaH5tVvz.js');
32
32
  require('../../Loader_cjs_CRiUlTC3.js');
33
- require('../../Input_cjs_DDi5JVAV.js');
33
+ require('../../Input_cjs_IhuIPBIq.js');
34
34
  require('../../Label_cjs_DRIwteHh.js');
35
35
  require('@itcase/icons/default');
36
36
 
@@ -1,6 +1,6 @@
1
1
  'use strict';
2
2
 
3
- var Input = require('../../Input_cjs_DDi5JVAV.js');
3
+ var Input = require('../../Input_cjs_IhuIPBIq.js');
4
4
  require('react/jsx-runtime');
5
5
  require('react');
6
6
  require('clsx');
@@ -2,7 +2,7 @@ import { jsx } from 'react/jsx-runtime';
2
2
  import { useMemo } from 'react';
3
3
  import clsx from 'clsx';
4
4
  import { PartySuggestions } from 'react-dadata';
5
- import { I as Input } from '../Input_es_BnCXATnh.js';
5
+ import { I as Input } from '../Input_es_CifTvE3z.js';
6
6
  import '../hooks/useAppearanceConfig/useAppearanceConfig.js';
7
7
  import '../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js';
8
8
  import 'lodash/camelCase';
@@ -3,7 +3,7 @@ import { useCallback } from 'react';
3
3
  import clsx from 'clsx';
4
4
  import { DateTime } from 'luxon';
5
5
  import { DATE_PERIOD_INTERVALS } from '@itcase/common';
6
- import { D as DatePickerInput } from '../DatePicker_es_54jl8guQ.js';
6
+ import { D as DatePickerInput } from '../DatePicker_es_D3lQ83Q6.js';
7
7
  import { useAppearanceConfig } from '../hooks/useAppearanceConfig/useAppearanceConfig.js';
8
8
  import { useDevicePropsGenerator } from '../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js';
9
9
  import { b as ChipsGroup, C as Chips } from '../ChipsGroup_es_D3eiXGyK.js';
@@ -29,7 +29,7 @@ import '../context/UrlAssetPrefix.js';
29
29
  import '../Link_es_P2b6ya7P.js';
30
30
  import '../Text_es_RDU9GLCV.js';
31
31
  import '../Loader_es_Dq2-7sn2.js';
32
- import '../Input_es_BnCXATnh.js';
32
+ import '../Input_es_CifTvE3z.js';
33
33
  import '../Label_es_DYd2RwDK.js';
34
34
  import '@itcase/icons/default';
35
35
  import 'lodash/castArray';
@@ -1,4 +1,4 @@
1
- export { D as DatePickerInput, a as datePickerAppearance, d as datePickerConfig } from '../DatePicker_es_54jl8guQ.js';
1
+ export { D as DatePickerInput, a as datePickerAppearance, d as datePickerConfig } from '../DatePicker_es_D3lQ83Q6.js';
2
2
  import 'react/jsx-runtime';
3
3
  import 'react';
4
4
  import 'clsx';
@@ -28,6 +28,6 @@ import '../context/UrlAssetPrefix.js';
28
28
  import '../Link_es_P2b6ya7P.js';
29
29
  import '../Text_es_RDU9GLCV.js';
30
30
  import '../Loader_es_Dq2-7sn2.js';
31
- import '../Input_es_BnCXATnh.js';
31
+ import '../Input_es_CifTvE3z.js';
32
32
  import '../Label_es_DYd2RwDK.js';
33
33
  import '@itcase/icons/default';
@@ -1,4 +1,4 @@
1
- export { I as Input, a as inputAppearance, i as inputConfig } from '../Input_es_BnCXATnh.js';
1
+ export { I as Input, a as inputAppearance, i as inputConfig } from '../Input_es_CifTvE3z.js';
2
2
  import 'react/jsx-runtime';
3
3
  import 'react';
4
4
  import 'clsx';