mimir-ui-kit 1.25.0 → 1.26.0

Sign up to get free protection for your applications and to get access to all the features.
@@ -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
  {
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.0",
5
5
  "type": "module",
6
6
  "exports": {
7
7
  ".": {