mimir-ui-kit 1.25.0 → 1.26.0

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.
@@ -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
  ".": {