@ozen-ui/kit 0.47.0 → 0.47.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (11) hide show
  1. package/__inner__/cjs/components/Autocomplete/Autocomplete.js +1 -1
  2. package/__inner__/cjs/components/Calendar/Calendar.js +14 -14
  3. package/__inner__/cjs/components/Calendar/components/CalendarGrid/CalendarGrid.js +3 -4
  4. package/__inner__/cjs/components/Input/Input.css +3 -2
  5. package/__inner__/cjs/components/Input/types.d.ts +2 -1
  6. package/__inner__/esm/components/Autocomplete/Autocomplete.js +1 -1
  7. package/__inner__/esm/components/Calendar/Calendar.js +14 -14
  8. package/__inner__/esm/components/Calendar/components/CalendarGrid/CalendarGrid.js +3 -4
  9. package/__inner__/esm/components/Input/Input.css +3 -2
  10. package/__inner__/esm/components/Input/types.d.ts +2 -1
  11. package/package.json +4 -4
package/__inner__/cjs/components/Autocomplete/Autocomplete.js CHANGED
@@ -83,6 +83,7 @@ function AutocompleteRender(inProps, ref) {
83
83
  /** Актуализация значения текстового поля после его покидания */
84
84
  var onBlur = function (e) {
85
85
  var _a;
86
+ (_a = inputProps === null || inputProps === void 0 ? void 0 : inputProps.onBlur) === null || _a === void 0 ? void 0 : _a.call(inputProps, e);
86
87
  if (allowCustomValue) {
87
88
  return;
88
89
  }
@@ -91,7 +92,6 @@ function AutocompleteRender(inProps, ref) {
91
92
  setInputValue(value);
92
93
  onInputChange === null || onInputChange === void 0 ? void 0 : onInputChange(null, value);
93
94
  }
94
- (_a = inputProps === null || inputProps === void 0 ? void 0 : inputProps.onBlur) === null || _a === void 0 ? void 0 : _a.call(inputProps, e);
95
95
  };
96
96
  /** Ждем выполнения анимации на закрытие и делаем сброс */
97
97
  var onExited = function () {
package/__inner__/cjs/components/Calendar/Calendar.js CHANGED
@@ -26,44 +26,44 @@ exports.Calendar = (0, polymorphicComponentWithRef_1.polymorphicComponentWithRef
26
26
  defaultValue: defaultValue,
27
27
  name: 'Calendar',
28
28
  state: 'value',
29
- }), 2), valueState = _e[0], setValueState = _e[1];
29
+ }), 2), value = _e[0], setValue = _e[1];
30
30
  var _f = tslib_1.__read((0, useControlled_1.useControlled)({
31
31
  value: offsetDateProp,
32
32
  defaultValue: defaultOffsetDate,
33
33
  name: 'Calendar',
34
34
  state: 'offsetDate',
35
- }), 2), offsetDateState = _f[0], setOffsetDateState = _f[1];
36
- var onChange = function (data) {
35
+ }), 2), offsetDate = _f[0], setOffsetDateState = _f[1];
36
+ var onDatesChange = function (data) {
37
37
  var value = data[0];
38
38
  if (value) {
39
- setValueState(value);
39
+ setValue(value);
40
40
  onChangeProp === null || onChangeProp === void 0 ? void 0 : onChangeProp(value);
41
41
  }
42
42
  };
43
- var onOffsetDateChange = function (date) {
43
+ var onOffsetChange = function (date) {
44
44
  setOffsetDateState(date);
45
45
  onOffsetDateChangeProp === null || onOffsetDateChangeProp === void 0 ? void 0 : onOffsetDateChangeProp(date);
46
46
  };
47
47
  (0, react_1.useEffect)(function () {
48
- if (valueState)
49
- onOffsetDateChange(valueState);
50
- }, [valueState]);
48
+ if (value)
49
+ onOffsetChange(value);
50
+ }, [value]);
51
51
  var config = {
52
52
  calendar: {
53
53
  startDay: startDay,
54
54
  },
55
55
  locale: {
56
56
  locale: locale,
57
- weekday: 'short',
58
57
  day: 'numeric',
58
+ weekday: 'short',
59
59
  },
60
60
  exclude: exclude,
61
- onDatesChange: onChange,
62
- years: { numberOfYears: 15 },
63
- onOffsetChange: onOffsetDateChange,
64
- offsetDate: offsetDateState || new Date(),
61
+ offsetDate: offsetDate,
62
+ onDatesChange: onDatesChange,
63
+ onOffsetChange: onOffsetChange,
65
64
  dates: { minDate: minDate, maxDate: maxDate },
66
- selectedDates: valueState ? [valueState] : [],
65
+ years: { numberOfYears: 15 },
66
+ selectedDates: value ? [value] : [],
67
67
  };
68
68
  // Управление представлениями календаря
69
69
  var goStep = function (step) {
package/__inner__/cjs/components/Calendar/components/CalendarGrid/CalendarGrid.js CHANGED
@@ -18,7 +18,7 @@ exports.cnCalendarYears = (0, classname_1.cn)('CalendarYears');
18
18
  var CalendarGrid = function () {
19
19
  var _a = (0, react_1.useContext)(CalendarContext_1.CalendarContext), step = _a.step, goStep = _a.goStep, size = _a.size, onYearClick = _a.onYearClick, onDayClick = _a.onDayClick, onMonthClick = _a.onMonthClick;
20
20
  var _b = (0, datepicker_1.useDatePickerContext)(), _c = _b.data, weekDays = _c.weekDays, calendars = _c.calendars, years = _c.years, months = _c.months, _d = _b.propGetters, dayButton = _d.dayButton, monthButton = _d.monthButton, yearButton = _d.yearButton;
21
- var _e = calendars[0] || {}, days = _e.days, month = _e.month, year = _e.year;
21
+ var _e = calendars[0] || {}, days = _e.days, month = _e.month;
22
22
  var handleClickOnDay = function (e, date) {
23
23
  onDayClick === null || onDayClick === void 0 ? void 0 : onDayClick(e, date);
24
24
  };
@@ -37,11 +37,10 @@ var CalendarGrid = function () {
37
37
  onClick: handleClickOnDay,
38
38
  disabled: dpDay.disabled || !dpDay.inCurrentMonth,
39
39
  }), { tabIndex: dpDay.disabled || !dpDay.inCurrentMonth ? -1 : 0 }), dpDay.day)); }))),
40
- step === 'months' && (react_1.default.createElement("div", { className: (0, classnames_1.classnames)((0, exports.cnCalendarGrid)(), (0, exports.cnCalendarMoths)()) }, months === null || months === void 0 ? void 0 : months.map(function (dpMonth) { return (react_1.default.createElement(CalendarItem_1.CalendarItem, tslib_1.__assign({ size: size, current: dpMonth.now, key: dpMonth.$date.toDateString(), selected: (dpMonth.selected && dpMonth.active) ||
41
- (dpMonth.active && !dpMonth.selected) }, monthButton(dpMonth, {
40
+ step === 'months' && (react_1.default.createElement("div", { className: (0, classnames_1.classnames)((0, exports.cnCalendarGrid)(), (0, exports.cnCalendarMoths)()) }, months === null || months === void 0 ? void 0 : months.map(function (dpMonth) { return (react_1.default.createElement(CalendarItem_1.CalendarItem, tslib_1.__assign({ size: size, current: dpMonth.now, key: dpMonth.$date.toDateString(), selected: dpMonth.selected }, monthButton(dpMonth, {
42
41
  onClick: handleClickOnMonth,
43
42
  }), { tabIndex: dpMonth.disabled ? -1 : 0 }), dpMonth.month && (0, capitalizeFirstLetter_1.capitalizeFirstLetter)(dpMonth.month))); }))),
44
- step === 'years' && (react_1.default.createElement("div", { className: (0, classnames_1.classnames)((0, exports.cnCalendarGrid)(), (0, exports.cnCalendarYears)()) }, years === null || years === void 0 ? void 0 : years.map(function (dpYear) { return (react_1.default.createElement(CalendarItem_1.CalendarItem, tslib_1.__assign({ key: dpYear.$date.toDateString(), current: dpYear.now, selected: String(dpYear.year) === year, size: size }, yearButton(dpYear, {
43
+ step === 'years' && (react_1.default.createElement("div", { className: (0, classnames_1.classnames)((0, exports.cnCalendarGrid)(), (0, exports.cnCalendarYears)()) }, years === null || years === void 0 ? void 0 : years.map(function (dpYear) { return (react_1.default.createElement(CalendarItem_1.CalendarItem, tslib_1.__assign({ key: dpYear.$date.toDateString(), current: dpYear.now, selected: dpYear.selected, size: size }, yearButton(dpYear, {
45
44
  onClick: handleClickOnYear,
46
45
  }), { tabIndex: dpYear.disabled ? -1 : 0 }), dpYear.year)); })))));
47
46
  };
package/__inner__/cjs/components/Input/Input.css CHANGED
@@ -7,7 +7,7 @@
7
7
  box-sizing: border-box;
8
8
  padding: 0 var(--textfield-gutter-x);
9
9
  background-color: var(--textfield-background-color);
10
- transition: background-color var(--transition-slow);
10
+ transition: background-color box-shadow var(--transition-slow);
11
11
  color: var(--textfield-color);
12
12
  border-radius: var(--textfield-border-radius);
13
13
  }
@@ -25,6 +25,7 @@
25
25
  color: var(--textfield-color);
26
26
  box-sizing: border-box;
27
27
  block-size: var(--textfield-input-height);
28
+
28
29
  font: inherit;
29
30
  }
30
31
  .Input-Field::placeholder {
@@ -36,7 +37,7 @@
36
37
  .Input-Field:-webkit-autofill:focus {
37
38
  box-shadow: 0 0 0 1000px var(--textfield-background-color) inset !important;
38
39
  background-color: transparent !important;
39
- -webkit-text-fill-color: var(--color-content-info-dark);
40
+ -webkit-text-fill-color: var(--textfield-color);
40
41
  }
41
42
  .Input-Field::-webkit-outer-spin-button,
42
43
  .Input-Field::-webkit-inner-spin-button {
package/__inner__/cjs/components/Input/types.d.ts CHANGED
@@ -20,6 +20,7 @@ type InputPropsDeprecated = {
20
20
  inputRef?: Ref<HTMLInputElement>;
21
21
  };
22
22
  type InputElement = ComponentPropsWithRef<'input'>;
23
+ export type InputOnChange = InputElement['onChange'];
23
24
  export type InputProps = Omit<ComponentPropsWithRef<typeof FIELD_CONTROL_DEFAULT_TAG>, 'size' | 'onChange'> & {
24
25
  /** Атрибут id для элемента input */
25
26
  id?: string;
@@ -58,7 +59,7 @@ export type InputProps = Omit<ComponentPropsWithRef<typeof FIELD_CONTROL_DEFAULT
58
59
  /** Значение по умолчанию (неконтролируемый компонент) */
59
60
  defaultValue?: InputElement['defaultValue'];
60
61
  /** Обработчик события на изменение значения поля */
61
- onChange?: InputElement['onChange'];
62
+ onChange?: InputOnChange;
62
63
  /** Свойства элемента input */
63
64
  inputProps?: InputElement & {
64
65
  'data-testid'?: string;
package/__inner__/esm/components/Autocomplete/Autocomplete.js CHANGED
@@ -80,6 +80,7 @@ function AutocompleteRender(inProps, ref) {
80
80
  /** Актуализация значения текстового поля после его покидания */
81
81
  var onBlur = function (e) {
82
82
  var _a;
83
+ (_a = inputProps === null || inputProps === void 0 ? void 0 : inputProps.onBlur) === null || _a === void 0 ? void 0 : _a.call(inputProps, e);
83
84
  if (allowCustomValue) {
84
85
  return;
85
86
  }
@@ -88,7 +89,6 @@ function AutocompleteRender(inProps, ref) {
88
89
  setInputValue(value);
89
90
  onInputChange === null || onInputChange === void 0 ? void 0 : onInputChange(null, value);
90
91
  }
91
- (_a = inputProps === null || inputProps === void 0 ? void 0 : inputProps.onBlur) === null || _a === void 0 ? void 0 : _a.call(inputProps, e);
92
92
  };
93
93
  /** Ждем выполнения анимации на закрытие и делаем сброс */
94
94
  var onExited = function () {
package/__inner__/esm/components/Calendar/Calendar.js CHANGED
@@ -23,44 +23,44 @@ export var Calendar = polymorphicComponentWithRef(function (inProps, ref) {
23
23
  defaultValue: defaultValue,
24
24
  name: 'Calendar',
25
25
  state: 'value',
26
- }), 2), valueState = _e[0], setValueState = _e[1];
26
+ }), 2), value = _e[0], setValue = _e[1];
27
27
  var _f = __read(useControlled({
28
28
  value: offsetDateProp,
29
29
  defaultValue: defaultOffsetDate,
30
30
  name: 'Calendar',
31
31
  state: 'offsetDate',
32
- }), 2), offsetDateState = _f[0], setOffsetDateState = _f[1];
33
- var onChange = function (data) {
32
+ }), 2), offsetDate = _f[0], setOffsetDateState = _f[1];
33
+ var onDatesChange = function (data) {
34
34
  var value = data[0];
35
35
  if (value) {
36
- setValueState(value);
36
+ setValue(value);
37
37
  onChangeProp === null || onChangeProp === void 0 ? void 0 : onChangeProp(value);
38
38
  }
39
39
  };
40
- var onOffsetDateChange = function (date) {
40
+ var onOffsetChange = function (date) {
41
41
  setOffsetDateState(date);
42
42
  onOffsetDateChangeProp === null || onOffsetDateChangeProp === void 0 ? void 0 : onOffsetDateChangeProp(date);
43
43
  };
44
44
  useEffect(function () {
45
- if (valueState)
46
- onOffsetDateChange(valueState);
47
- }, [valueState]);
45
+ if (value)
46
+ onOffsetChange(value);
47
+ }, [value]);
48
48
  var config = {
49
49
  calendar: {
50
50
  startDay: startDay,
51
51
  },
52
52
  locale: {
53
53
  locale: locale,
54
- weekday: 'short',
55
54
  day: 'numeric',
55
+ weekday: 'short',
56
56
  },
57
57
  exclude: exclude,
58
- onDatesChange: onChange,
59
- years: { numberOfYears: 15 },
60
- onOffsetChange: onOffsetDateChange,
61
- offsetDate: offsetDateState || new Date(),
58
+ offsetDate: offsetDate,
59
+ onDatesChange: onDatesChange,
60
+ onOffsetChange: onOffsetChange,
62
61
  dates: { minDate: minDate, maxDate: maxDate },
63
- selectedDates: valueState ? [valueState] : [],
62
+ years: { numberOfYears: 15 },
63
+ selectedDates: value ? [value] : [],
64
64
  };
65
65
  // Управление представлениями календаря
66
66
  var goStep = function (step) {
package/__inner__/esm/components/Calendar/components/CalendarGrid/CalendarGrid.js CHANGED
@@ -15,7 +15,7 @@ export var cnCalendarYears = cn('CalendarYears');
15
15
  export var CalendarGrid = function () {
16
16
  var _a = useContext(CalendarContext), step = _a.step, goStep = _a.goStep, size = _a.size, onYearClick = _a.onYearClick, onDayClick = _a.onDayClick, onMonthClick = _a.onMonthClick;
17
17
  var _b = useDatePickerContext(), _c = _b.data, weekDays = _c.weekDays, calendars = _c.calendars, years = _c.years, months = _c.months, _d = _b.propGetters, dayButton = _d.dayButton, monthButton = _d.monthButton, yearButton = _d.yearButton;
18
- var _e = calendars[0] || {}, days = _e.days, month = _e.month, year = _e.year;
18
+ var _e = calendars[0] || {}, days = _e.days, month = _e.month;
19
19
  var handleClickOnDay = function (e, date) {
20
20
  onDayClick === null || onDayClick === void 0 ? void 0 : onDayClick(e, date);
21
21
  };
@@ -34,11 +34,10 @@ export var CalendarGrid = function () {
34
34
  onClick: handleClickOnDay,
35
35
  disabled: dpDay.disabled || !dpDay.inCurrentMonth,
36
36
  }), { tabIndex: dpDay.disabled || !dpDay.inCurrentMonth ? -1 : 0 }), dpDay.day)); }))),
37
- step === 'months' && (React.createElement("div", { className: classnames(cnCalendarGrid(), cnCalendarMoths()) }, months === null || months === void 0 ? void 0 : months.map(function (dpMonth) { return (React.createElement(CalendarItem, __assign({ size: size, current: dpMonth.now, key: dpMonth.$date.toDateString(), selected: (dpMonth.selected && dpMonth.active) ||
38
- (dpMonth.active && !dpMonth.selected) }, monthButton(dpMonth, {
37
+ step === 'months' && (React.createElement("div", { className: classnames(cnCalendarGrid(), cnCalendarMoths()) }, months === null || months === void 0 ? void 0 : months.map(function (dpMonth) { return (React.createElement(CalendarItem, __assign({ size: size, current: dpMonth.now, key: dpMonth.$date.toDateString(), selected: dpMonth.selected }, monthButton(dpMonth, {
39
38
  onClick: handleClickOnMonth,
40
39
  }), { tabIndex: dpMonth.disabled ? -1 : 0 }), dpMonth.month && capitalize(dpMonth.month))); }))),
41
- step === 'years' && (React.createElement("div", { className: classnames(cnCalendarGrid(), cnCalendarYears()) }, years === null || years === void 0 ? void 0 : years.map(function (dpYear) { return (React.createElement(CalendarItem, __assign({ key: dpYear.$date.toDateString(), current: dpYear.now, selected: String(dpYear.year) === year, size: size }, yearButton(dpYear, {
40
+ step === 'years' && (React.createElement("div", { className: classnames(cnCalendarGrid(), cnCalendarYears()) }, years === null || years === void 0 ? void 0 : years.map(function (dpYear) { return (React.createElement(CalendarItem, __assign({ key: dpYear.$date.toDateString(), current: dpYear.now, selected: dpYear.selected, size: size }, yearButton(dpYear, {
42
41
  onClick: handleClickOnYear,
43
42
  }), { tabIndex: dpYear.disabled ? -1 : 0 }), dpYear.year)); })))));
44
43
  };
package/__inner__/esm/components/Input/Input.css CHANGED
@@ -7,7 +7,7 @@
7
7
  box-sizing: border-box;
8
8
  padding: 0 var(--textfield-gutter-x);
9
9
  background-color: var(--textfield-background-color);
10
- transition: background-color var(--transition-slow);
10
+ transition: background-color box-shadow var(--transition-slow);
11
11
  color: var(--textfield-color);
12
12
  border-radius: var(--textfield-border-radius);
13
13
  }
@@ -25,6 +25,7 @@
25
25
  color: var(--textfield-color);
26
26
  box-sizing: border-box;
27
27
  block-size: var(--textfield-input-height);
28
+
28
29
  font: inherit;
29
30
  }
30
31
  .Input-Field::placeholder {
@@ -36,7 +37,7 @@
36
37
  .Input-Field:-webkit-autofill:focus {
37
38
  box-shadow: 0 0 0 1000px var(--textfield-background-color) inset !important;
38
39
  background-color: transparent !important;
39
- -webkit-text-fill-color: var(--color-content-info-dark);
40
+ -webkit-text-fill-color: var(--textfield-color);
40
41
  }
41
42
  .Input-Field::-webkit-outer-spin-button,
42
43
  .Input-Field::-webkit-inner-spin-button {
package/__inner__/esm/components/Input/types.d.ts CHANGED
@@ -20,6 +20,7 @@ type InputPropsDeprecated = {
20
20
  inputRef?: Ref<HTMLInputElement>;
21
21
  };
22
22
  type InputElement = ComponentPropsWithRef<'input'>;
23
+ export type InputOnChange = InputElement['onChange'];
23
24
  export type InputProps = Omit<ComponentPropsWithRef<typeof FIELD_CONTROL_DEFAULT_TAG>, 'size' | 'onChange'> & {
24
25
  /** Атрибут id для элемента input */
25
26
  id?: string;
@@ -58,7 +59,7 @@ export type InputProps = Omit<ComponentPropsWithRef<typeof FIELD_CONTROL_DEFAULT
58
59
  /** Значение по умолчанию (неконтролируемый компонент) */
59
60
  defaultValue?: InputElement['defaultValue'];
60
61
  /** Обработчик события на изменение значения поля */
61
- onChange?: InputElement['onChange'];
62
+ onChange?: InputOnChange;
62
63
  /** Свойства элемента input */
63
64
  inputProps?: InputElement & {
64
65
  'data-testid'?: string;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@ozen-ui/kit",
3
- "version": "0.47.0",
3
+ "version": "0.47.2",
4
4
  "description": "React component library",
5
5
  "files": [
6
6
  "*"
@@ -28,9 +28,9 @@
28
28
  "react-popper": "^2.3.0",
29
29
  "react-transition-group": "^4.4.5",
30
30
  "tslib": "^2.6.2",
31
- "@ozen-ui/fonts": "0.47.0",
32
- "@ozen-ui/logger": "0.47.0",
33
- "@ozen-ui/icons": "0.47.0"
31
+ "@ozen-ui/fonts": "0.47.2",
32
+ "@ozen-ui/icons": "0.47.2",
33
+ "@ozen-ui/logger": "0.47.2"
34
34
  },
35
35
  "peerDependencies": {
36
36
  "react": ">=17.0.2 <19.0.0",