mimir-ui-kit 1.14.0 → 1.14.1

package/dist/components/Pagination/Pagination.js

@@ -0,0 +1,220 @@
+import { jsxs, jsx } from "react/jsx-runtime";
+import { c as classNames } from "../../index-CweZ_OcN.js";
+import { forwardRef, useState, useEffect } from "react";
+import { FIRST_PAGE_NUMBER, DEFAULT_PER_PAGE } from "./constants.js";
+import { useWindowSize } from "../../hooks/useWindowSize/index.js";
+import { Icon } from "../../icons/Icon.js";
+import '../../assets/Pagination.css';const container = "_container_1s8aj_2";
+const link = "_link_1s8aj_11";
+const item = "_item_1s8aj_46";
+const isActive = "_isActive_1s8aj_52";
+const disabled = "_disabled_1s8aj_58";
+const cls = {
+  container,
+  link,
+  item,
+  isActive,
+  disabled
+};
+const Back = ({
+  currentPageNumber,
+  onClick,
+  setCurrentPage
+}) => {
+  const handleClick = (event) => {
+    event.preventDefault();
+    if (currentPageNumber === FIRST_PAGE_NUMBER) return;
+    setCurrentPage(currentPageNumber - 1);
+    onClick(currentPageNumber - 1);
+  };
+  return /* @__PURE__ */ jsx(
+    "span",
+    {
+      className: classNames(cls.item, cls.prev, {
+        [cls.disabled]: currentPageNumber === FIRST_PAGE_NUMBER
+      }),
+      children: /* @__PURE__ */ jsx(
+        "a",
+        {
+          className: cls.link,
+          onClick: handleClick,
+          href: "#",
+          "aria-label": "Назад",
+          rel: "prev",
+          children: /* @__PURE__ */ jsx(Icon, { iconName: "ArrowLeft16px" })
+        }
+      )
+    }
+  );
+};
+const Next = ({
+  currentPageNumber,
+  lastPageNumber,
+  onClick,
+  setCurrentPage
+}) => {
+  const isOnLastPage = currentPageNumber >= lastPageNumber;
+  const handleClick = (event) => {
+    event.preventDefault();
+    if (isOnLastPage) return;
+    setCurrentPage(currentPageNumber + 1);
+    onClick == null ? void 0 : onClick(currentPageNumber + 1);
+  };
+  return /* @__PURE__ */ jsx(
+    "span",
+    {
+      className: classNames(cls.item, cls.next, {
+        [cls.disabled]: isOnLastPage
+      }),
+      children: /* @__PURE__ */ jsx(
+        "a",
+        {
+          className: cls.link,
+          onClick: handleClick,
+          href: "#",
+          "aria-label": "Вперед",
+          rel: "next",
+          children: /* @__PURE__ */ jsx(Icon, { iconName: "ArrowRight16px" })
+        }
+      )
+    }
+  );
+};
+const Ellipsis = () => {
+  const handleClick = (event) => {
+    event.preventDefault();
+  };
+  return /* @__PURE__ */ jsx("span", { className: cls.item, children: /* @__PURE__ */ jsx("a", { className: cls.link, href: "#", onClick: handleClick, children: /* @__PURE__ */ jsx("span", { children: "..." }) }) });
+};
+const Item = ({
+  currentPageNumber,
+  newPageNumber,
+  onClick,
+  setCurrentPage
+}) => {
+  const isActive2 = currentPageNumber === newPageNumber;
+  const handleClick = (event) => {
+    event.preventDefault();
+    setCurrentPage(newPageNumber);
+    onClick == null ? void 0 : onClick(newPageNumber);
+  };
+  const formattedPageNumber = newPageNumber < 10 ? `0${newPageNumber}` : newPageNumber;
+  return /* @__PURE__ */ jsx("span", { className: classNames(cls.item, { [cls.isActive]: isActive2 }), children: !isActive2 ? /* @__PURE__ */ jsx("a", { href: "#", className: cls.link, onClick: handleClick, children: formattedPageNumber }) : /* @__PURE__ */ jsx("span", { className: cls.link, children: formattedPageNumber }) });
+};
+const renderItems = ({
+  start,
+  end,
+  currentPageNumber,
+  onClick,
+  setCurrentPage
+}) => {
+  const items = [];
+  for (let i = start; i <= end; i++) {
+    items.push(
+      /* @__PURE__ */ jsx(
+        Item,
+        {
+          currentPageNumber,
+          setCurrentPage,
+          newPageNumber: i,
+          onClick
+        },
+        i
+      )
+    );
+  }
+  return items;
+};
+const Pagination = forwardRef(
+  (props, ref) => {
+    const {
+      rootClassName,
+      total,
+      perPage = DEFAULT_PER_PAGE,
+      currentPageNumber = FIRST_PAGE_NUMBER,
+      onChange
+    } = props;
+    const [currentPage, setCurrentPage] = useState(currentPageNumber);
+    const lastPageNumber = Math.ceil(total / perPage);
+    const { width } = useWindowSize();
+    const adjacentCount = width <= 650 ? 2 : 4;
+    let firstAdjacentPage = 0;
+    let lastAdjacentPage = 0;
+    useEffect(() => {
+      setCurrentPage(currentPageNumber);
+    }, [currentPageNumber]);
+    if (currentPage <= adjacentCount) {
+      firstAdjacentPage = FIRST_PAGE_NUMBER;
+      lastAdjacentPage = Math.min(
+        FIRST_PAGE_NUMBER + adjacentCount,
+        lastPageNumber
+      );
+    } else if (currentPage > lastPageNumber - adjacentCount) {
+      firstAdjacentPage = lastPageNumber - adjacentCount;
+      lastAdjacentPage = lastPageNumber;
+    } else {
+      firstAdjacentPage = currentPage - adjacentCount / 2;
+      lastAdjacentPage = currentPage + adjacentCount / 2;
+    }
+    if (total <= perPage) {
+      return null;
+    }
+    return /* @__PURE__ */ jsxs(
+      "nav",
+      {
+        "aria-label": "Постраничная навигация",
+        className: classNames(cls.container, rootClassName),
+        ref,
+        children: [
+          /* @__PURE__ */ jsx(
+            Back,
+            {
+              currentPageNumber: currentPage,
+              onClick: onChange,
+              setCurrentPage
+            }
+          ),
+          firstAdjacentPage > FIRST_PAGE_NUMBER && /* @__PURE__ */ jsx(
+            Item,
+            {
+              newPageNumber: FIRST_PAGE_NUMBER,
+              currentPageNumber: currentPage,
+              onClick: onChange,
+              setCurrentPage
+            }
+          ),
+          firstAdjacentPage > FIRST_PAGE_NUMBER + 1 && /* @__PURE__ */ jsx(Ellipsis, {}),
+          renderItems({
+            start: firstAdjacentPage,
+            end: lastAdjacentPage,
+            currentPageNumber: currentPage,
+            setCurrentPage,
+            onClick: onChange
+          }),
+          lastAdjacentPage < lastPageNumber - 1 && /* @__PURE__ */ jsx(Ellipsis, {}),
+          lastAdjacentPage < lastPageNumber && /* @__PURE__ */ jsx(
+            Item,
+            {
+              newPageNumber: lastPageNumber,
+              currentPageNumber: currentPage,
+              setCurrentPage,
+              onClick: onChange
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            Next,
+            {
+              currentPageNumber: currentPage,
+              setCurrentPage,
+              lastPageNumber,
+              onClick: onChange
+            }
+          )
+        ]
+      }
+    );
+  }
+);
+export {
+  Pagination
+};

package/dist/components/Pagination/constants.d.ts

@@ -0,0 +1,2 @@
+export declare const FIRST_PAGE_NUMBER = 1;
+export declare const DEFAULT_PER_PAGE = 5;

package/dist/components/Pagination/constants.js

@@ -0,0 +1,6 @@
+const FIRST_PAGE_NUMBER = 1;
+const DEFAULT_PER_PAGE = 5;
+export {
+  DEFAULT_PER_PAGE,
+  FIRST_PAGE_NUMBER
+};

package/dist/components/Pagination/index.d.ts

@@ -0,0 +1 @@
+export { Pagination } from './Pagination';

package/dist/components/Pagination/index.js

@@ -0,0 +1,4 @@
+import { Pagination } from "./Pagination.js";
+export {
+  Pagination
+};

package/dist/components/Pagination/types.js

@@ -0,0 +1 @@
+

package/dist/components/Portal/Portal.d.ts

@@ -0,0 +1,7 @@
+import { PropsWithChildren } from 'react';
+
+type TProps = {
+    element?: HTMLElement;
+};
+export declare const Portal: ({ element, children }: PropsWithChildren<TProps>) => import('react').ReactPortal;
+export {};

package/dist/components/Portal/Portal.js

@@ -0,0 +1,10 @@
+import { createPortal } from "react-dom";
+const Portal = ({
+  element = document.body,
+  children
+}) => {
+  return createPortal(children, element);
+};
+export {
+  Portal
+};

package/dist/components/Portal/index.d.ts

@@ -0,0 +1 @@
+export { Portal } from './Portal';

package/dist/components/Portal/index.js

@@ -0,0 +1,4 @@
+import { Portal } from "./Portal.js";
+export {
+  Portal
+};

package/dist/components/RadioGroup/RadioGroup.d.ts

@@ -7,7 +7,7 @@ export interface TRadioOption {
 /**
  * Свойства компонента RadioGroup.
  */
-export type TProps = Omit<RadioGroupProps, 'value'> & {
+export type TRadioGroupProps = Omit<RadioGroupProps, 'value'> & {
     /**
      * Массив опций для радиогруппы.
      * Каждая опция должна содержать значение и метку.
@@ -27,4 +27,20 @@ export type TProps = Omit<RadioGroupProps, 'value'> & {
 /**
  * Компонент RadioGroup для выбора одной опции из нескольких.
  */
-export declare function RadioGroup({ options, value, onChange, label, ...props }: TProps): import("react/jsx-runtime").JSX.Element;
+export declare const RadioGroup: import('react').ForwardRefExoticComponent<Omit<RadioGroupProps, "value"> & {
+    /**
+     * Массив опций для радиогруппы.
+     * Каждая опция должна содержать значение и метку.
+     */
+    options: TRadioOption[];
+    /**
+     * Выбранное значение опции.
+     * Может быть необязательным, если нет выбранного значения.
+     */
+    value?: TRadioOption["value"];
+    /**
+     * Текст метки, отображаемой над радиогруппой.
+     * Может быть необязательным.
+     */
+    label?: string;
+} & import('react').RefAttributes<HTMLElement>>;