mimir-ui-kit 1.34.4-t → 1.34.4

package/dist/components/Pagination/Pagination.js

@@ -1,167 +1,209 @@
-import { jsxs as P, jsx as e } from "react/jsx-runtime";
-import { c as k } from "../../index-DIxK0V-G.js";
-import { forwardRef as g, useState as j, useEffect as b } from "react";
-import { FIRST_PAGE_NUMBER as d, DEFAULT_PER_PAGE as C } from "./constants.js";
-import { useWindowSize as x } from "../../hooks/useWindowSize/index.js";
-import { Icon as v } from "../../icons/Icon.js";
-import '../../assets/Pagination.css';const E = "_container_18kj0_2", D = "_item_18kj0_11", R = "_link_18kj0_18", I = "_isActive_18kj0_53", w = "_disabled_18kj0_56", s = {
-  container: E,
-  item: D,
-  link: R,
-  isActive: I,
-  disabled: w
-}, L = ({ currentPageNumber: t, onClick: n, setCurrentPage: r }) => {
-  const l = (i) => {
-    i.preventDefault(), t !== d && (r(t - 1), n(t - 1));
+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_18kj0_2";
+const item = "_item_18kj0_11";
+const link = "_link_18kj0_18";
+const isActive = "_isActive_18kj0_53";
+const disabled = "_disabled_18kj0_56";
+const cls = {
+  container,
+  item,
+  link,
+  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__ */ e(
+  return /* @__PURE__ */ jsx(
     "span",
     {
-      className: k(s.item, s.prev, {
-        [s.disabled]: t === d
+      className: classNames(cls.item, cls.prev, {
+        [cls.disabled]: currentPageNumber === FIRST_PAGE_NUMBER
       }),
-      children: /* @__PURE__ */ e(
+      children: /* @__PURE__ */ jsx(
         "a",
         {
-          className: s.link,
-          onClick: l,
+          className: cls.link,
+          onClick: handleClick,
           href: "#",
           "aria-label": "Назад",
           rel: "prev",
-          children: /* @__PURE__ */ e(v, { iconName: "ArrowLeft16px" })
+          children: /* @__PURE__ */ jsx(Icon, { iconName: "ArrowLeft16px" })
         }
       )
     }
   );
-}, M = ({
-  currentPageNumber: t,
-  lastPageNumber: n,
-  onClick: r,
-  setCurrentPage: l
+};
+const Next = ({
+  currentPageNumber,
+  lastPageNumber,
+  onClick,
+  setCurrentPage
 }) => {
-  const i = t >= n, o = (a) => {
-    a.preventDefault(), !i && (l(t + 1), r == null || r(t + 1));
+  const isOnLastPage = currentPageNumber >= lastPageNumber;
+  const handleClick = (event) => {
+    event.preventDefault();
+    if (isOnLastPage) return;
+    setCurrentPage(currentPageNumber + 1);
+    onClick == null ? void 0 : onClick(currentPageNumber + 1);
   };
-  return /* @__PURE__ */ e(
+  return /* @__PURE__ */ jsx(
     "span",
     {
-      className: k(s.item, s.next, {
-        [s.disabled]: i
+      className: classNames(cls.item, cls.next, {
+        [cls.disabled]: isOnLastPage
       }),
-      children: /* @__PURE__ */ e(
+      children: /* @__PURE__ */ jsx(
         "a",
         {
-          className: s.link,
-          onClick: o,
+          className: cls.link,
+          onClick: handleClick,
           href: "#",
           "aria-label": "Вперед",
           rel: "next",
-          children: /* @__PURE__ */ e(v, { iconName: "ArrowRight16px" })
+          children: /* @__PURE__ */ jsx(Icon, { iconName: "ArrowRight16px" })
         }
       )
     }
   );
-}, N = () => {
-  const t = (n) => {
-    n.preventDefault();
+};
+const Ellipsis = () => {
+  const handleClick = (event) => {
+    event.preventDefault();
   };
-  return /* @__PURE__ */ e("span", { className: s.item, children: /* @__PURE__ */ e("a", { className: s.link, href: "#", onClick: t, children: /* @__PURE__ */ e("span", { children: "..." }) }) });
-}, _ = ({
-  currentPageNumber: t,
-  newPageNumber: n,
-  onClick: r,
-  setCurrentPage: l
+  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 i = t === n, o = (c) => {
-    c.preventDefault(), l(n), r == null || r(n);
-  }, a = n < 10 ? `0${n}` : n;
-  return /* @__PURE__ */ e("span", { className: k(s.item, { [s.isActive]: i }), children: i ? /* @__PURE__ */ e("span", { className: s.link, children: a }) : /* @__PURE__ */ e("a", { href: "#", className: s.link, onClick: o, children: a }) });
-}, S = ({
-  start: t,
-  end: n,
-  currentPageNumber: r,
-  onClick: l,
-  setCurrentPage: i
+  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 o = [];
-  for (let a = t; a <= n; a++)
-    o.push(
-      /* @__PURE__ */ e(
-        _,
+  const items = [];
+  for (let i = start; i <= end; i++) {
+    items.push(
+      /* @__PURE__ */ jsx(
+        Item,
         {
-          currentPageNumber: r,
-          setCurrentPage: i,
-          newPageNumber: a,
-          onClick: l
+          currentPageNumber,
+          setCurrentPage,
+          newPageNumber: i,
+          onClick
         },
-        a
+        i
       )
     );
-  return o;
-}, O = g(
-  (t, n) => {
+  }
+  return items;
+};
+const Pagination = forwardRef(
+  (props, ref) => {
     const {
-      rootClassName: r,
-      total: l,
-      perPage: i = C,
-      currentPageNumber: o = d,
-      onChange: a
-    } = t, [c, f] = j(o), m = Math.ceil(l / i), { width: A } = x(), h = A <= 650 ? 2 : 4;
-    let p = 0, u = 0;
-    return b(() => {
-      f(o);
-    }, [o]), c <= h ? (p = d, u = Math.min(
-      d + h,
-      m
-    )) : c > m - h ? (p = m - h, u = m) : (p = c - h / 2, u = c + h / 2), l <= i ? null : /* @__PURE__ */ P(
+      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: k(s.container, r),
-        ref: n,
+        className: classNames(cls.container, rootClassName),
+        ref,
         children: [
-          /* @__PURE__ */ e(
-            L,
+          /* @__PURE__ */ jsx(
+            Back,
             {
-              currentPageNumber: c,
-              onClick: a,
-              setCurrentPage: f
+              currentPageNumber: currentPage,
+              onClick: onChange,
+              setCurrentPage
             }
           ),
-          p > d && /* @__PURE__ */ e(
-            _,
+          firstAdjacentPage > FIRST_PAGE_NUMBER && /* @__PURE__ */ jsx(
+            Item,
             {
-              newPageNumber: d,
-              currentPageNumber: c,
-              onClick: a,
-              setCurrentPage: f
+              newPageNumber: FIRST_PAGE_NUMBER,
+              currentPageNumber: currentPage,
+              onClick: onChange,
+              setCurrentPage
             }
           ),
-          p > d + 1 && /* @__PURE__ */ e(N, {}),
-          S({
-            start: p,
-            end: u,
-            currentPageNumber: c,
-            setCurrentPage: f,
-            onClick: a
+          firstAdjacentPage > FIRST_PAGE_NUMBER + 1 && /* @__PURE__ */ jsx(Ellipsis, {}),
+          renderItems({
+            start: firstAdjacentPage,
+            end: lastAdjacentPage,
+            currentPageNumber: currentPage,
+            setCurrentPage,
+            onClick: onChange
           }),
-          u < m - 1 && /* @__PURE__ */ e(N, {}),
-          u < m && /* @__PURE__ */ e(
-            _,
+          lastAdjacentPage < lastPageNumber - 1 && /* @__PURE__ */ jsx(Ellipsis, {}),
+          lastAdjacentPage < lastPageNumber && /* @__PURE__ */ jsx(
+            Item,
             {
-              newPageNumber: m,
-              currentPageNumber: c,
-              setCurrentPage: f,
-              onClick: a
+              newPageNumber: lastPageNumber,
+              currentPageNumber: currentPage,
+              setCurrentPage,
+              onClick: onChange
             }
           ),
-          /* @__PURE__ */ e(
-            M,
+          /* @__PURE__ */ jsx(
+            Next,
             {
-              currentPageNumber: c,
-              setCurrentPage: f,
-              lastPageNumber: m,
-              onClick: a
+              currentPageNumber: currentPage,
+              setCurrentPage,
+              lastPageNumber,
+              onClick: onChange
             }
           )
         ]
@@ -170,5 +212,5 @@ import '../../assets/Pagination.css';const E = "_container_18kj0_2", D = "_item_
   }
 );
 export {
-  O as Pagination
+  Pagination
 };

package/dist/components/Pagination/constants.js

@@ -1,5 +1,6 @@
-const E = 1, _ = 5;
+const FIRST_PAGE_NUMBER = 1;
+const DEFAULT_PER_PAGE = 5;
 export {
-  _ as DEFAULT_PER_PAGE,
-  E as FIRST_PAGE_NUMBER
+  DEFAULT_PER_PAGE,
+  FIRST_PAGE_NUMBER
 };

package/dist/components/Pagination/index.js

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

package/dist/components/Portal/Portal.js

@@ -1,8 +1,10 @@
-import { createPortal as t } from "react-dom";
-const a = ({
-  element: o = document.body,
-  children: r
-}) => t(r, o);
+import { createPortal } from "react-dom";
+const Portal = ({
+  element = document.body,
+  children
+}) => {
+  return createPortal(children, element);
+};
 export {
-  a as Portal
+  Portal
 };

package/dist/components/Portal/index.js

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