mimir-ui-kit 1.25.0 → 1.26.1

Sign up to get free protection for your applications and to get access to all the features.
@@ -1 +1 @@
1
- ._input_mam1g_2{padding-right:var(--space-3xl)}._wrapper_mam1g_6{position:relative;display:flex;align-items:center;border-radius:8px}._input-wrapper_mam1g_13{flex:1}._button-wrapper_mam1g_17{position:absolute;top:0;right:0;z-index:2;display:flex;width:44px;height:100%;max-height:var(--button-height-xxl)}._button_mam1g_17{align-self:center;background-color:transparent;border-radius:8px}
1
+ ._input_34v9n_2{padding-right:var(--space-3xl)}._wrapper_34v9n_6{position:relative;display:flex;align-items:center;border-radius:8px}._input-wrapper_34v9n_13{flex:1}._button-wrapper_34v9n_17{position:absolute;top:0;right:0;z-index:2;display:flex;width:44px;height:100%;max-height:var(--button-height-xxl)}._button_34v9n_17{align-self:center;background-color:transparent;border-radius:8px}._button_34v9n_17 ._icon_34v9n_33{color:var(--black-60);transition:all .15s ease;fill:var(--black-60)}._button_34v9n_17 ._icon_34v9n_33._show_34v9n_38{color:var(--sapphire-normal);fill:var(--sapphire-normal)}
@@ -1 +1 @@
1
- ._otp_196ev_3{display:flex;align-items:center;width:100%;-moz-column-gap:var(--space-xs);column-gap:var(--space-xs)}@media (max-width: 768px){._otp_196ev_3{-moz-column-gap:4.65px;column-gap:4.65px}}._otp_196ev_3 ._input-wrapper_196ev_14{flex:0 0 64px;padding:0}@media (max-width: 768px){._otp_196ev_3 ._input-wrapper_196ev_14{flex:0 0 48px}}._input_196ev_14{text-align:center}._separator_196ev_28{display:block;flex:0 0 54px;align-self:center;height:1px;margin:0 var(--space-xs);background-color:var(--black-100)}
1
+ ._otp_19unm_3{display:flex;align-items:center;width:100%;-moz-column-gap:var(--space-xs);column-gap:var(--space-xs)}@media (max-width: 768px){._otp_19unm_3{-moz-column-gap:4.65px;column-gap:4.65px}}._otp_19unm_3 ._input-wrapper_19unm_14{flex:0 0 64px;padding:0}@media (max-width: 767.9px){._otp_19unm_3 ._input-wrapper_19unm_14{flex:0 0 48px}}._input_19unm_14{text-align:center}._separator_19unm_28{display:block;flex:0 0 54px;align-self:center;height:1px;margin:0 var(--space-xs);background-color:var(--black-100)}
@@ -24,9 +24,11 @@ export type TAccordionProps = {
24
24
  classNameAccordion?: string;
25
25
  /** Дополнительный класс для кнопки с иконкой */
26
26
  classNameIconButton?: string;
27
- /** Дополнительный класс для react-ноды для отображения под заголовком */
28
- classNameSubtitleNode?: string;
29
27
  /** React-нода для отображения под заголовком */
30
28
  subtitleNode?: ReactNode;
29
+ /** React-нода для отображения под заголовком когда аккордеон открыт */
30
+ onlyOpenSubtitleNode?: ReactNode;
31
+ /** Дополнительный класс для контейнера subtitle */
32
+ classNameSubtitleContainer?: string;
31
33
  };
32
34
  export declare const Accordion: import('react').ForwardRefExoticComponent<TAccordionProps & import('react').RefAttributes<HTMLElement>>;
@@ -1,6 +1,6 @@
1
1
  import { jsxs, Fragment as Fragment$1, jsx } from "react/jsx-runtime";
2
2
  import { c as classNames } from "../../index-CweZ_OcN.js";
3
- import React__default, { createContext, useRef, Fragment, useReducer, useMemo, useId, useEffect, useContext, forwardRef } from "react";
3
+ import React__default, { createContext, useRef, Fragment, useReducer, useMemo, useId, useEffect, useContext, forwardRef, useState } from "react";
4
4
  import { AccordionItem } from "./AccordionItem/AccordionItem.js";
5
5
  import { EAccordionButtonType, EAccordionSize, EAccordionButtonStyle, EAccordionIconType, EAccordionLinkIconSize, EAccordionButtonIconSize } from "./constants.js";
6
6
  import { useMediaQuery } from "../../hooks/useMediaQuery/useMediaQuery.js";
@@ -158,9 +158,11 @@ const Accordion = forwardRef(
158
158
  classNameContent,
159
159
  classNameAccordion,
160
160
  classNameIconButton,
161
- classNameSubtitleNode,
162
- subtitleNode
161
+ subtitleNode,
162
+ onlyOpenSubtitleNode,
163
+ classNameSubtitleContainer
163
164
  }, ref) => {
165
+ const [isOpen, setIsOpen] = useState(false);
164
166
  const isMobile = useMediaQuery(EMediaQuery.XS1);
165
167
  const isLink = buttonType === "link";
166
168
  const linkClasses = {
@@ -233,32 +235,40 @@ const Accordion = forwardRef(
233
235
  linkClasses,
234
236
  classNameAccordion
235
237
  ),
236
- children: /* @__PURE__ */ jsx(We, { ref, children: ({ open: open2 }) => /* @__PURE__ */ jsxs(Fragment$1, { children: [
237
- /* @__PURE__ */ jsx(
238
- Ce,
239
- {
240
- as: isLink ? Fragment : EAccordionButtonType.BUTTON,
241
- className: classNames({
242
- [cls.header]: !isLink
243
- }),
244
- children: renderButton(open2)
245
- }
246
- ),
247
- /* @__PURE__ */ jsx(
248
- Ie,
249
- {
250
- className: classNames(
251
- cls.panel,
252
- classNameContent,
253
- linkClasses
254
- ),
255
- children: /* @__PURE__ */ jsx(AccordionItem, { size, children })
256
- }
257
- )
258
- ] }) })
238
+ children: /* @__PURE__ */ jsx(We, { ref, children: ({ open: open2 }) => {
239
+ if (open2 !== isOpen) {
240
+ setIsOpen(open2);
241
+ }
242
+ return /* @__PURE__ */ jsxs(Fragment$1, { children: [
243
+ /* @__PURE__ */ jsx(
244
+ Ce,
245
+ {
246
+ as: isLink ? Fragment : EAccordionButtonType.BUTTON,
247
+ className: classNames({
248
+ [cls.header]: !isLink
249
+ }),
250
+ children: renderButton(open2)
251
+ }
252
+ ),
253
+ /* @__PURE__ */ jsx(
254
+ Ie,
255
+ {
256
+ className: classNames(
257
+ cls.panel,
258
+ classNameContent,
259
+ linkClasses
260
+ ),
261
+ children: /* @__PURE__ */ jsx(AccordionItem, { size, children })
262
+ }
263
+ )
264
+ ] });
265
+ } })
259
266
  }
260
267
  ),
261
- subtitleNode && /* @__PURE__ */ jsx("div", { className: classNames(cls.subtitle, classNameSubtitleNode), children: subtitleNode })
268
+ (subtitleNode || onlyOpenSubtitleNode) && /* @__PURE__ */ jsxs("div", { className: classNameSubtitleContainer, children: [
269
+ subtitleNode,
270
+ isOpen && onlyOpenSubtitleNode
271
+ ] })
262
272
  ] });
263
273
  }
264
274
  );
@@ -48,9 +48,13 @@ type TProps = {
48
48
  footer?: ReactNode | ((props: {
49
49
  handleClose: VoidFunction;
50
50
  }) => JSX.Element);
51
+ /**
52
+ * Дополнительный класс для inner.
53
+ */
54
+ classNameInner?: string;
51
55
  };
52
56
  /**
53
57
  * Компонент шторки, который может выезжать слева, справа или внизу.
54
58
  */
55
- export declare const Drawer: ({ isOpen, onClose, title, className, unmount, isLoading, stickyHeader, fullBottomHeight, position, paddingRight, footer, children }: PropsWithChildren<TProps>) => import("react/jsx-runtime").JSX.Element | null;
59
+ export declare const Drawer: ({ isOpen, onClose, title, className, unmount, isLoading, stickyHeader, fullBottomHeight, position, paddingRight, footer, children, classNameInner }: PropsWithChildren<TProps>) => import("react/jsx-runtime").JSX.Element | null;
56
60
  export {};
@@ -60,7 +60,8 @@ const Drawer = ({
60
60
  position = EDrawerPosition.RIGHT,
61
61
  paddingRight = 8,
62
62
  footer: footer2,
63
- children
63
+ children,
64
+ classNameInner
64
65
  }) => {
65
66
  const [isClosing, setIsClosing] = useState(false);
66
67
  const [isMounted, setIsMounted] = useState(false);
@@ -150,7 +151,7 @@ const Drawer = ({
150
151
  ]
151
152
  }
152
153
  ),
153
- /* @__PURE__ */ jsx("div", { className: cls.inner, children }),
154
+ /* @__PURE__ */ jsx("div", { className: classNames(cls.inner, classNameInner), children }),
154
155
  /* @__PURE__ */ jsx("footer", { className: cls.footer, children: typeof footer2 === "function" ? footer2({ handleClose }) : footer2 || /* @__PURE__ */ jsx(
155
156
  Button,
156
157
  {
@@ -1,17 +1,22 @@
1
1
  import { jsxs, jsx } from "react/jsx-runtime";
2
+ import { c as classNames } from "../../index-CweZ_OcN.js";
2
3
  import { memo, forwardRef, useState } from "react";
3
4
  import { Icon } from "../../icons/Icon.js";
4
5
  import { Button } from "../Button/Button.js";
5
6
  import { I as Input } from "../../Input-6mudFqTb.js";
6
- import '../../assets/InputPassword.css';const input = "_input_mam1g_2";
7
- const wrapper = "_wrapper_mam1g_6";
8
- const button = "_button_mam1g_17";
7
+ import '../../assets/InputPassword.css';const input = "_input_34v9n_2";
8
+ const wrapper = "_wrapper_34v9n_6";
9
+ const button = "_button_34v9n_17";
10
+ const icon = "_icon_34v9n_33";
11
+ const show = "_show_34v9n_38";
9
12
  const cls = {
10
13
  input,
11
14
  wrapper,
12
- "input-wrapper": "_input-wrapper_mam1g_13",
13
- "button-wrapper": "_button-wrapper_mam1g_17",
14
- button
15
+ "input-wrapper": "_input-wrapper_34v9n_13",
16
+ "button-wrapper": "_button-wrapper_34v9n_17",
17
+ button,
18
+ icon,
19
+ show
15
20
  };
16
21
  const InputPassword = memo(
17
22
  forwardRef(
@@ -37,7 +42,15 @@ const InputPassword = memo(
37
42
  type: "button",
38
43
  className: cls.button,
39
44
  onClick: handleClick,
40
- children: /* @__PURE__ */ jsx(Icon, { iconName: "Eye24px" })
45
+ children: /* @__PURE__ */ jsx(
46
+ Icon,
47
+ {
48
+ className: classNames(cls.icon, {
49
+ [cls.show]: showPassword
50
+ }),
51
+ iconName: "Eye24px"
52
+ }
53
+ )
41
54
  }
42
55
  ) })
43
56
  ] });
@@ -4,12 +4,12 @@ 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
6
  import { I as Input } from "../../Input-6mudFqTb.js";
7
- import '../../assets/OtpInput.css';const otp = "_otp_196ev_3";
8
- const input = "_input_196ev_14";
9
- const separator = "_separator_196ev_28";
7
+ import '../../assets/OtpInput.css';const otp = "_otp_19unm_3";
8
+ const input = "_input_19unm_14";
9
+ const separator = "_separator_19unm_28";
10
10
  const cls = {
11
11
  otp,
12
- "input-wrapper": "_input-wrapper_196ev_14",
12
+ "input-wrapper": "_input-wrapper_19unm_14",
13
13
  input,
14
14
  separator
15
15
  };
@@ -149,7 +149,7 @@ const RadioGroup = forwardRef(
149
149
  /* @__PURE__ */ jsx(
150
150
  K,
151
151
  {
152
- as: "button",
152
+ as: "span",
153
153
  className: classNames(cls.radio, {
154
154
  [cls.disabled]: props.disabled
155
155
  }),
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "mimir-ui-kit",
3
3
  "private": false,
4
- "version": "1.25.0",
4
+ "version": "1.26.1",
5
5
  "type": "module",
6
6
  "exports": {
7
7
  ".": {