mimir-ui-kit 1.33.1 → 1.33.2

Sign up to get free protection for your applications and to get access to all the features.
@@ -229,7 +229,8 @@ const Input = memo(
229
229
  clear: true,
230
230
  disabled: disabled2 || readonly,
231
231
  variant: "secondary-gray",
232
- onClick: handleClear
232
+ onClick: handleClear,
233
+ "data-testid": "clear-button"
233
234
  }
234
235
  )
235
236
  ]
@@ -219,7 +219,15 @@ const Accordion = forwardRef(
219
219
  cls[buttonStyle],
220
220
  classNameIconButton
221
221
  ),
222
- children: /* @__PURE__ */ jsx(Icon, { iconName: getIconName(), className: cls.icon })
222
+ "data-testid": "accordion-icon-container",
223
+ children: /* @__PURE__ */ jsx(
224
+ Icon,
225
+ {
226
+ iconName: getIconName(),
227
+ className: cls.icon,
228
+ "data-testid": "accordion-icon"
229
+ }
230
+ )
223
231
  }
224
232
  )
225
233
  ] });
@@ -31,8 +31,17 @@ const Avatar = memo(
31
31
  className: classNames(cls.avatar, cls[size], className, {
32
32
  [cls.default]: !src
33
33
  }),
34
+ "data-testid": "avatar-container",
34
35
  children: [
35
- src ? /* @__PURE__ */ jsx(AppImage, { src, alt, className: cls.image }) : /* @__PURE__ */ jsx(Icon, { iconName: "User16px" }),
36
+ src ? /* @__PURE__ */ jsx(
37
+ AppImage,
38
+ {
39
+ src,
40
+ alt,
41
+ className: cls.image,
42
+ "data-testid": "avatar-image"
43
+ }
44
+ ) : /* @__PURE__ */ jsx(Icon, { iconName: "User16px" }),
36
45
  !!notificationsCount && /* @__PURE__ */ jsx(
37
46
  NotificationBadge,
38
47
  {
@@ -37,13 +37,15 @@ const cls = {
37
37
  const CheckboxMimir = forwardRef(
38
38
  (props, ref) => {
39
39
  const { checked, onChange, children, id, ...restProps } = props;
40
- const [enabled2, setEnabled] = useState(checked);
40
+ const [enabled2, setEnabled] = useState(checked ?? false);
41
41
  const handleChange = (value) => {
42
42
  setEnabled(value);
43
43
  onChange == null ? void 0 : onChange(value);
44
44
  };
45
45
  useEffect(() => {
46
- setEnabled(!!checked);
46
+ if (checked !== void 0) {
47
+ setEnabled(checked);
48
+ }
47
49
  }, [checked]);
48
50
  return /* @__PURE__ */ jsxs(H$1, { className: cls.container, children: [
49
51
  /* @__PURE__ */ jsx(
@@ -4,15 +4,15 @@ import { memo, forwardRef, useState, useEffect } from "react";
4
4
  import { DatePickerModal } from "./DatePickerModal.js";
5
5
  import { MonthPickerModal } from "./MonthPickerModal.js";
6
6
  import { c as cls } from "../../styles.module-7wzJYhR3.js";
7
- import { formatDatePart, getFullYear } from "./utils.js";
7
+ import { formatDatePart } from "./utils.js";
8
8
  import { YearPickerModal } from "./YearPickerModal.js";
9
9
  import { useClickOutside } from "../../hooks/useClickOutside/useClickOutside.js";
10
10
  import { formating } from "../../utils/index.js";
11
- import { I as Input } from "../../Input-ChCIy5oY.js";
11
+ import { I as Input } from "../../Input-CCNRdc6Q.js";
12
12
  import { EInputVariant } from "../Input/constants.js";
13
13
  const MAX_DAY = 31;
14
14
  const MAX_MONTH = 12;
15
- const DATE_LENGTH = 8;
15
+ const DATE_LENGTH = 10;
16
16
  const DatePicker = memo(
17
17
  forwardRef(
18
18
  ({
@@ -48,7 +48,7 @@ const DatePicker = memo(
48
48
  }, [value]);
49
49
  useEffect(() => {
50
50
  if (date && !(typeof date === "string") && !isNaN(date == null ? void 0 : date.getTime())) {
51
- setInputValue(formating.Date(date, "dd/mm/yy"));
51
+ setInputValue(formating.Date(date, "dd/mm/yyyy"));
52
52
  } else {
53
53
  setInputValue("");
54
54
  }
@@ -107,12 +107,12 @@ const DatePicker = memo(
107
107
  const [day, month, year] = [
108
108
  formatDatePart(newValue.substring(0, 2), MAX_DAY),
109
109
  formatDatePart(newValue.substring(2, 4), MAX_MONTH),
110
- newValue.substring(4, 6)
110
+ newValue.substring(4, 8)
111
111
  ];
112
112
  const formattedValue = [day, month, year].filter(Boolean).join("/");
113
113
  setInputValue(formattedValue);
114
114
  if (formattedValue.length === DATE_LENGTH) {
115
- const fullYear = getFullYear(year);
115
+ const fullYear = parseInt(year);
116
116
  const newDate = /* @__PURE__ */ new Date(
117
117
  `${fullYear}-${month.padStart(2, "0")}-${day.padStart(2, "0")}`
118
118
  );
@@ -149,6 +149,7 @@ const DatePicker = memo(
149
149
  addonType: "icon",
150
150
  addonContent: isActive ? "DropdownArrowUp24px" : "DropdownArrowDown24px"
151
151
  },
152
+ "data-error": isError,
152
153
  ...props
153
154
  }
154
155
  )
@@ -120,67 +120,83 @@ function DatePickerModal({
120
120
  );
121
121
  onExit();
122
122
  };
123
- return /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsxs("div", { className: [cls["calendar-block"]].join(" "), ref: field, children: [
124
- /* @__PURE__ */ jsxs("div", { className: cls["h"], children: [
125
- /* @__PURE__ */ jsx(
126
- Button,
127
- {
128
- isIconButton: true,
129
- iconName: "DropdownArrowLeft16px",
130
- onClick: prev,
131
- variant: "secondary-gray",
132
- size: "l"
133
- }
134
- ),
135
- /* @__PURE__ */ jsxs("div", { className: cls["d"], onClick: () => onType == null ? void 0 : onType("months"), children: [
136
- (_a = formating.Month(month.m)) == null ? void 0 : _a.name,
137
- "’",
138
- month.y.toString().slice(-2),
139
- /* @__PURE__ */ jsx(Icon, { iconName: "DropdownArrowBottom16px" })
140
- ] }),
141
- /* @__PURE__ */ jsx(
142
- Button,
143
- {
144
- isIconButton: true,
145
- iconName: "DropdownArrowRight16px",
146
- onClick: next,
147
- variant: "secondary-gray",
148
- size: "l"
149
- }
150
- )
151
- ] }),
152
- /* @__PURE__ */ jsxs("div", { className: cls["b"], children: [
153
- week.map((i, s) => /* @__PURE__ */ jsx(
154
- "div",
155
- {
156
- className: `${s > countWorkDays ? [cls["m"], cls["orange"]].join(" ") : cls["m"]}`,
157
- children: i
158
- },
159
- `v${s}`
160
- )),
161
- prevDaysArray.map((el, key) => /* @__PURE__ */ jsx("div", { className: cls["m"], children: el }, key)),
162
- days.map((i, s) => /* @__PURE__ */ jsx(
163
- "div",
164
- {
165
- className: isBefore(
166
- (/* @__PURE__ */ new Date(
167
- `${month.y}-${formating.Number(2, month.m)}-${formating.Number(2, i)}`
168
- )).getTime()
169
- ) ? cls["m"] : cls["a"],
170
- children: i !== 0 ? /* @__PURE__ */ jsx(
171
- "b",
123
+ return /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsxs(
124
+ "div",
125
+ {
126
+ className: [cls["calendar-block"]].join(" "),
127
+ ref: field,
128
+ "data-testid": "calendar-modal",
129
+ children: [
130
+ /* @__PURE__ */ jsxs("div", { className: cls["h"], children: [
131
+ /* @__PURE__ */ jsx(
132
+ Button,
172
133
  {
173
- className: current.y === month.y && current.m === month.m && current.d === i ? cls["current"] : "",
174
- onClick: () => send(i),
175
- children: i
134
+ isIconButton: true,
135
+ iconName: "DropdownArrowLeft16px",
136
+ onClick: prev,
137
+ variant: "secondary-gray",
138
+ size: "l"
139
+ }
140
+ ),
141
+ /* @__PURE__ */ jsxs(
142
+ "div",
143
+ {
144
+ className: cls["d"],
145
+ onClick: () => onType == null ? void 0 : onType("months"),
146
+ "data-testid": "month-year-button",
147
+ children: [
148
+ (_a = formating.Month(month.m)) == null ? void 0 : _a.name,
149
+ "’",
150
+ month.y.toString().slice(-2),
151
+ /* @__PURE__ */ jsx(Icon, { iconName: "DropdownArrowBottom16px" })
152
+ ]
153
+ }
154
+ ),
155
+ /* @__PURE__ */ jsx(
156
+ Button,
157
+ {
158
+ isIconButton: true,
159
+ iconName: "DropdownArrowRight16px",
160
+ onClick: next,
161
+ variant: "secondary-gray",
162
+ size: "l"
176
163
  }
177
- ) : /* @__PURE__ */ jsx("p", {})
178
- },
179
- s
180
- )),
181
- nextDaysArray.map((el, key) => /* @__PURE__ */ jsx("div", { className: cls["m"], children: el }, key))
182
- ] })
183
- ] }) });
164
+ )
165
+ ] }),
166
+ /* @__PURE__ */ jsxs("div", { className: cls["b"], children: [
167
+ week.map((i, s) => /* @__PURE__ */ jsx(
168
+ "div",
169
+ {
170
+ className: `${s > countWorkDays ? [cls["m"], cls["orange"]].join(" ") : cls["m"]}`,
171
+ children: i
172
+ },
173
+ `v${s}`
174
+ )),
175
+ prevDaysArray.map((el, key) => /* @__PURE__ */ jsx("div", { className: cls["m"], children: el }, key)),
176
+ days.map((i, s) => /* @__PURE__ */ jsx(
177
+ "div",
178
+ {
179
+ className: isBefore(
180
+ (/* @__PURE__ */ new Date(
181
+ `${month.y}-${formating.Number(2, month.m)}-${formating.Number(2, i)}`
182
+ )).getTime()
183
+ ) ? cls["m"] : cls["a"],
184
+ children: i !== 0 ? /* @__PURE__ */ jsx(
185
+ "b",
186
+ {
187
+ className: current.y === month.y && current.m === month.m && current.d === i ? cls["current"] : "",
188
+ onClick: () => send(i),
189
+ children: i
190
+ }
191
+ ) : /* @__PURE__ */ jsx("p", {})
192
+ },
193
+ s
194
+ )),
195
+ nextDaysArray.map((el, key) => /* @__PURE__ */ jsx("div", { className: cls["m"], children: el }, key))
196
+ ] })
197
+ ]
198
+ }
199
+ ) });
184
200
  }
185
201
  export {
186
202
  DatePickerModal
@@ -84,10 +84,18 @@ function MonthPickerModal({
84
84
  size: "l"
85
85
  }
86
86
  ),
87
- /* @__PURE__ */ jsxs("div", { onClick: () => onType == null ? void 0 : onType("years"), className: cls["d"], children: [
88
- year.toString(),
89
- /* @__PURE__ */ jsx(Icon, { iconName: "DropdownArrowBottom16px" })
90
- ] }),
87
+ /* @__PURE__ */ jsxs(
88
+ "div",
89
+ {
90
+ onClick: () => onType == null ? void 0 : onType("years"),
91
+ className: cls["d"],
92
+ "data-testid": "year-button",
93
+ children: [
94
+ year.toString(),
95
+ /* @__PURE__ */ jsx(Icon, { iconName: "DropdownArrowBottom16px" })
96
+ ]
97
+ }
98
+ ),
91
99
  /* @__PURE__ */ jsx(
92
100
  Button,
93
101
  {
@@ -99,7 +107,7 @@ function MonthPickerModal({
99
107
  }
100
108
  )
101
109
  ] }),
102
- /* @__PURE__ */ jsx("div", { className: cls["monthGrid"], children: months.map((i, s) => /* @__PURE__ */ jsx(
110
+ /* @__PURE__ */ jsx("div", { className: cls["monthGrid"], "data-testid": "month-picker", children: months.map((i, s) => /* @__PURE__ */ jsx(
103
111
  "div",
104
112
  {
105
113
  className: isBefore(
@@ -96,7 +96,7 @@ function YearPickerModal({
96
96
  }
97
97
  )
98
98
  ] }),
99
- /* @__PURE__ */ jsx("div", { className: cls["monthGrid"], children: years.map((i, s) => /* @__PURE__ */ jsx(
99
+ /* @__PURE__ */ jsx("div", { className: cls["monthGrid"], "data-testid": "year-picker", children: years.map((i, s) => /* @__PURE__ */ jsx(
100
100
  "div",
101
101
  {
102
102
  className: isBefore(
@@ -2,7 +2,7 @@ import "react/jsx-runtime";
2
2
  import "../../index-CweZ_OcN.js";
3
3
  import "react";
4
4
  import "./constants.js";
5
- import { I } from "../../Input-ChCIy5oY.js";
5
+ import { I } from "../../Input-CCNRdc6Q.js";
6
6
  import "../../hooks/useMergeRefs/useMergeRefs.js";
7
7
  import "../../icons/Icon.js";
8
8
  import "../Button/Button.js";
@@ -1,4 +1,4 @@
1
- import { I } from "../../Input-ChCIy5oY.js";
1
+ import { I } from "../../Input-CCNRdc6Q.js";
2
2
  import { EInputSize, EInputVariant } from "./constants.js";
3
3
  export {
4
4
  EInputSize,
@@ -3,7 +3,7 @@ import { c as classNames } from "../../index-CweZ_OcN.js";
3
3
  import { memo, forwardRef, useState } from "react";
4
4
  import { Icon } from "../../icons/Icon.js";
5
5
  import { Button } from "../Button/Button.js";
6
- import { I as Input } from "../../Input-ChCIy5oY.js";
6
+ import { I as Input } from "../../Input-CCNRdc6Q.js";
7
7
  import '../../assets/InputPassword.css';const input = "_input_34v9n_2";
8
8
  const wrapper = "_wrapper_34v9n_6";
9
9
  const button = "_button_34v9n_17";
@@ -1,7 +1,7 @@
1
1
  import { jsx } from "react/jsx-runtime";
2
2
  import { memo, forwardRef, useState, useCallback, useImperativeHandle } from "react";
3
3
  import { getMaskedInputPhoneValue, getUnmaskedInputValue } from "./utils.js";
4
- import { I as Input } from "../../Input-ChCIy5oY.js";
4
+ import { I as Input } from "../../Input-CCNRdc6Q.js";
5
5
  const InputPhoneNumber = memo(
6
6
  forwardRef(
7
7
  ({ value = "", onChange, ...props }, ref) => {
@@ -3,7 +3,7 @@ import { c as classNames } from "../../index-CweZ_OcN.js";
3
3
  import { forwardRef, useImperativeHandle, Fragment } from "react";
4
4
  import { ITEMS_PER_SEPARATOR, DEFAULT_VALUE_LENGTH } from "./constants.js";
5
5
  import { useOTPInput } from "./hooks.js";
6
- import { I as Input } from "../../Input-ChCIy5oY.js";
6
+ import { I as Input } from "../../Input-CCNRdc6Q.js";
7
7
  import '../../assets/OtpInput.css';const otp = "_otp_19unm_3";
8
8
  const input = "_input_19unm_14";
9
9
  const separator = "_separator_19unm_28";
@@ -4,7 +4,7 @@ import * as React from "react";
4
4
  import React__default, { useReducer, useMemo, useSyncExternalStore, useId as useId$1, useEffect, useCallback, useRef, useLayoutEffect, createContext, useContext, useState, Fragment, createRef, forwardRef } from "react";
5
5
  import { ESelectSearchSize } from "./constants.js";
6
6
  import { Icon } from "../../icons/Icon.js";
7
- import { I as Input } from "../../Input-ChCIy5oY.js";
7
+ import { I as Input } from "../../Input-CCNRdc6Q.js";
8
8
  import { EInputVariant, EInputSize } from "../Input/constants.js";
9
9
  import { n as n$2, u as u$3, d as o$1, s as s$3, o as o$2, p as p$1, t as t$3, e as s$4, W as W$1, y as y$3, T, H, M as M$1, a as u$5, $ as $f7dceffc5ad7768b$export$4e328f61c538687f, b as $6179b936705e76d3$export$ae780daf29e6d456, D as D$2, c as o$3 } from "../../keyboard-B256ZoM-.js";
10
10
  import * as ReactDOM from "react-dom";
@@ -3879,6 +3879,7 @@ const SelectSearch = forwardRef(
3879
3879
  disabled: disabled2,
3880
3880
  variant,
3881
3881
  withClearButton,
3882
+ "data-testid": "select-search-input",
3882
3883
  ...searchProps
3883
3884
  }
3884
3885
  ),
@@ -3926,6 +3927,7 @@ const SelectSearch = forwardRef(
3926
3927
  ) : /* @__PURE__ */ jsx(
3927
3928
  zo,
3928
3929
  {
3930
+ "data-testid": "select-search-options",
3929
3931
  className: classNames(
3930
3932
  cls.options,
3931
3933
  cls[size2],
@@ -3943,6 +3945,7 @@ const SelectSearch = forwardRef(
3943
3945
  [cls["option-active"]]: focus
3944
3946
  }
3945
3947
  ),
3948
+ "data-testid": `select-search-option-${item.id}`,
3946
3949
  children: ({ selected }) => /* @__PURE__ */ jsxs(Fragment$1, { children: [
3947
3950
  /* @__PURE__ */ jsxs("div", { className: cls["option-inner"], children: [
3948
3951
  item.name,
@@ -251,7 +251,7 @@ const TabTrail = forwardRef(
251
251
  const activeTab = (_a = tabListRef.current) == null ? void 0 : _a.querySelector(
252
252
  `.${cls.tab}[data-active="true"]`
253
253
  );
254
- if (activeTab) {
254
+ if (activeTab && typeof activeTab.scrollIntoView === "function") {
255
255
  activeTab.scrollIntoView({
256
256
  behavior: "smooth",
257
257
  block: "nearest",
@@ -5,7 +5,7 @@ import { useAutoResizeTextArea } from "./hooks.js";
5
5
  import { useMergeRefs } from "../../hooks/useMergeRefs/useMergeRefs.js";
6
6
  import { Icon } from "../../icons/Icon.js";
7
7
  import { Button } from "../Button/Button.js";
8
- import { c as cls } from "../../Input-ChCIy5oY.js";
8
+ import { c as cls } from "../../Input-CCNRdc6Q.js";
9
9
  import { EInputVariant } from "../Input/constants.js";
10
10
  import '../../assets/TextArea.css';const textarea = "_textarea_1axu4_2";
11
11
  const label = "_label_1axu4_22";
@@ -1,6 +1,6 @@
1
1
  import { Button } from "./Button/Button.js";
2
2
  import { EButtonForm, EButtonSize, EButtonVariantBorderless, EButtonVariantDefault, EButtonVariantOutline, EButtonVariantRound } from "./Button/constants.js";
3
- import { I } from "../Input-ChCIy5oY.js";
3
+ import { I } from "../Input-CCNRdc6Q.js";
4
4
  import { EInputSize, EInputVariant } from "./Input/constants.js";
5
5
  import { TextArea } from "./TextArea/TextArea.js";
6
6
  import { InputPassword } from "./InputPassword/InputPassword.js";
package/dist/index.js CHANGED
@@ -1,6 +1,6 @@
1
1
  import { Button } from "./components/Button/Button.js";
2
2
  import { EButtonForm, EButtonSize, EButtonVariantBorderless, EButtonVariantDefault, EButtonVariantOutline, EButtonVariantRound } from "./components/Button/constants.js";
3
- import { I } from "./Input-ChCIy5oY.js";
3
+ import { I } from "./Input-CCNRdc6Q.js";
4
4
  import { EInputSize, EInputVariant } from "./components/Input/constants.js";
5
5
  import { TextArea } from "./components/TextArea/TextArea.js";
6
6
  import { InputPassword } from "./components/InputPassword/InputPassword.js";
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "mimir-ui-kit",
3
3
  "private": false,
4
- "version": "1.33.1",
4
+ "version": "1.33.2",
5
5
  "type": "module",
6
6
  "exports": {
7
7
  ".": {