dgz-ui-shared/dist/MyLimitSelect-Bzc40bxS.js

Custom ui library using React.js, Shadcn/ui, TailwindCSS, Typescript, dgz-ui library

import { j as e } from "./jsx-runtime-C5mzlN2N.js";
import { a as n } from "./index-DqTIeHVj-CeLMF2B2.js";
import * as f from "react";
import { useCallback as $ } from "react";
import { g as k } from "./button-Bp2lHjov-BTlHPcva.js";
import { m } from "./utils-B6fNqzRf-B1_jG1K7.js";
import { e as z } from "./chevron-right-HWBijj-I-CVwIY20F.js";
import { k as A } from "./createLucideIcon-B950nf2d-C2YhAyqE.js";
import { x as p, Y as h, F as j, W as N, X as v } from "./radio-group-CqPTye2U-DGs9dBuR.js";
import { u } from "./useTranslation-dH-uwymc.js";
/**
 * @license lucide-react v0.511.0 - ISC
 *
 * This source code is licensed under the ISC license.
 * See the LICENSE file in the root directory of this source tree.
 */
const I = [["path", { d: "m15 18-6-6 6-6", key: "1wnfg3" }]], M = A("chevron-left", I), b = ({ className: s, ...a }) => /* @__PURE__ */ n.jsx(
  "nav",
  {
    role: "navigation",
    "aria-label": "pagination",
    className: m("flex w-full justify-center", s),
    ...a
  }
);
b.displayName = "Pagination";
const w = f.forwardRef(({ className: s, ...a }, l) => /* @__PURE__ */ n.jsx(
  "ul",
  {
    ref: l,
    className: m("flex flex-row items-center gap-1", s),
    ...a
  }
));
w.displayName = "PaginationContent";
const r = f.forwardRef(({ className: s, ...a }, l) => /* @__PURE__ */ n.jsx("li", { ref: l, className: m("", s), ...a }));
r.displayName = "PaginationItem";
const x = ({
  className: s,
  isActive: a,
  size: l = "icon",
  ...o
}) => /* @__PURE__ */ n.jsx(
  "a",
  {
    "aria-current": a ? "page" : void 0,
    className: m(
      k({
        variant: a ? "tertiary" : "ghost",
        size: l
      }),
      "cursor-pointer",
      s
    ),
    ...o
  }
);
x.displayName = "PaginationLink";
const y = ({
  className: s,
  ...a
}) => /* @__PURE__ */ n.jsx(
  x,
  {
    "aria-label": "Go to previous page",
    size: "default",
    className: m("gap-1 px-2.5", s),
    ...a,
    children: /* @__PURE__ */ n.jsx(M, { className: "h-4 w-4" })
  }
);
y.displayName = "PaginationPrevious";
const R = ({
  className: s,
  ...a
}) => /* @__PURE__ */ n.jsx(
  x,
  {
    "aria-label": "Go to next page",
    size: "default",
    className: m("gap-1 px-2.5", s),
    ...a,
    children: /* @__PURE__ */ n.jsx(z, { className: "h-4 w-4" })
  }
);
R.displayName = "PaginationNext";
const U = ({
  currentPage: s = 1,
  totalPages: a = 0,
  onPageChange: l
}) => {
  const { t: o } = u(), t = $(() => {
    const i = [];
    i.push(1), s - 1 > 2 && i.push("...");
    for (let d = Math.max(2, s - 1); d <= Math.min(a - 1, s + 1); d++)
      i.push(d);
    return s + 1 < a - 1 && i.push("..."), a > 1 && i.push(a), i;
  }, [s, a]);
  return /* @__PURE__ */ e.jsxs("div", { className: "flex flex-col items-center justify-end gap-3 lg:flex-row", children: [
    /* @__PURE__ */ e.jsxs("div", { className: "flex items-center gap-3 text-sm", children: [
      /* @__PURE__ */ e.jsxs("div", { className: "min-w-20 font-semibold", children: [
        o("Go to page"),
        ":"
      ] }),
      /* @__PURE__ */ e.jsxs(
        p,
        {
          onValueChange: (i) => l(parseInt(i)),
          value: `${s}`,
          children: [
            /* @__PURE__ */ e.jsx(h, { className: "h-8.5 w-14", children: /* @__PURE__ */ e.jsx(j, {}) }),
            /* @__PURE__ */ e.jsx(N, { children: new Array(a).fill(0).map((i, c) => /* @__PURE__ */ e.jsx(v, { value: `${c + 1}`, children: c + 1 }, c + 1)) })
          ]
        }
      )
    ] }),
    /* @__PURE__ */ e.jsx(b, { className: "justify-end", children: /* @__PURE__ */ e.jsxs(w, { children: [
      /* @__PURE__ */ e.jsx(r, { children: /* @__PURE__ */ e.jsx(
        y,
        {
          isActive: s > 1,
          size: "sm",
          className: m(s > 1 ? "disabled" : "shadow"),
          onClick: () => {
            s > 1 && l(s - 1);
          }
        }
      ) }),
      t().map((i, c) => /* @__PURE__ */ e.jsx(
        r,
        {
          onClick: () => {
            typeof i == "number" && l(i);
          },
          children: /* @__PURE__ */ e.jsx(
            x,
            {
              size: "sm",
              className: m(
                "w-9 px-0 text-center",
                i === s && "shadow"
              ),
              isActive: i === s,
              children: i
            }
          )
        },
        c
      )),
      /* @__PURE__ */ e.jsx(r, { children: /* @__PURE__ */ e.jsx(
        R,
        {
          size: "sm",
          onClick: () => {
            s < a && l(s + 1);
          },
          className: m(s < a ? "disabled" : "shadow"),
          isActive: s < a
        }
      ) })
    ] }) })
  ] });
}, L = 50, T = [
  {
    value: 10,
    label: "10"
  },
  {
    value: 20,
    label: "20"
  },
  {
    value: 50,
    label: "50"
  },
  {
    value: 100,
    label: "100"
  }
], V = ({
  defaultValue: s = L,
  options: a = T,
  onLimitChange: l
}) => {
  const { t: o } = u();
  return /* @__PURE__ */ e.jsxs("div", { className: "flex items-center gap-3", children: [
    /* @__PURE__ */ e.jsxs("span", { className: "font-semibold", children: [
      o("Rows per page"),
      ":"
    ] }),
    /* @__PURE__ */ e.jsxs(p, { onValueChange: l, value: `${s}`, children: [
      /* @__PURE__ */ e.jsx(h, { className: "h-8.5 w-17", children: /* @__PURE__ */ e.jsx(j, {}) }),
      /* @__PURE__ */ e.jsx(N, { children: a == null ? void 0 : a.map((t) => /* @__PURE__ */ e.jsx(v, { value: `${t.value}`, children: t.label }, t.value)) })
    ] })
  ] });
};
export {
  L as D,
  U as M,
  V as a
};