jcicl 0.0.143 → 0.0.145

package/Pagination/Pagination.js

@@ -0,0 +1,781 @@
+import { jsx as d, jsxs as Z } from "react/jsx-runtime";
+import { n as tt } from "../.chunks/emotion-styled.browser.esm.js";
+import { c as at } from "../.chunks/emotion-react.browser.esm.js";
+import et from "../theme.js";
+import * as G from "react";
+import { a as _, g as H, s as B, e as N, u as q, b as U, P as a, c as I, d as J } from "../.chunks/DefaultPropsProvider.js";
+import { b as ot, u as st } from "../.chunks/index.js";
+import { u as j, i as w } from "../.chunks/useSlot.js";
+import { c as D } from "../.chunks/createSimplePaletteValueFilter.js";
+import { c as h } from "../.chunks/createSvgIcon.js";
+import { m as V } from "../.chunks/memoTheme.js";
+import { B as nt } from "../.chunks/ButtonBase.js";
+function it(t) {
+  return H("MuiPagination", t);
+}
+_("MuiPagination", ["root", "ul", "outlined", "text"]);
+function rt(t = {}) {
+  const {
+    boundaryCount: e = 1,
+    componentName: o = "usePagination",
+    count: n = 1,
+    defaultPage: y = 1,
+    disabled: b = !1,
+    hideNextButton: x = !1,
+    hidePrevButton: u = !1,
+    onChange: g,
+    page: P,
+    showFirstButton: T = !1,
+    showLastButton: R = !1,
+    siblingCount: m = 1,
+    ...O
+  } = t, [l, p] = ot({
+    controlled: P,
+    default: y,
+    name: o,
+    state: "page"
+  }), C = (s, i) => {
+    P || p(i), g && g(s, i);
+  }, $ = (s, i) => {
+    const M = i - s + 1;
+    return Array.from({
+      length: M
+    }, (W, F) => s + F);
+  }, c = $(1, Math.min(e, n)), k = $(Math.max(n - e + 1, e + 1), n), v = Math.max(
+    Math.min(
+      // Natural start
+      l - m,
+      // Lower boundary when page is high
+      n - e - m * 2 - 1
+    ),
+    // Greater than startPages
+    e + 2
+  ), f = Math.min(
+    Math.max(
+      // Natural end
+      l + m,
+      // Upper boundary when page is low
+      e + m * 2 + 2
+    ),
+    // Less than endPages
+    n - e - 1
+  ), L = [
+    ...T ? ["first"] : [],
+    ...u ? [] : ["previous"],
+    ...c,
+    // Start ellipsis
+    // eslint-disable-next-line no-nested-ternary
+    ...v > e + 2 ? ["start-ellipsis"] : e + 1 < n - e ? [e + 1] : [],
+    // Sibling pages
+    ...$(v, f),
+    // End ellipsis
+    // eslint-disable-next-line no-nested-ternary
+    ...f < n - e - 1 ? ["end-ellipsis"] : n - e > e ? [n - e] : [],
+    ...k,
+    ...x ? [] : ["next"],
+    ...R ? ["last"] : []
+  ], S = (s) => {
+    switch (s) {
+      case "first":
+        return 1;
+      case "previous":
+        return l - 1;
+      case "next":
+        return l + 1;
+      case "last":
+        return n;
+      default:
+        return null;
+    }
+  };
+  return {
+    items: L.map((s) => typeof s == "number" ? {
+      onClick: (i) => {
+        C(i, s);
+      },
+      type: "page",
+      page: s,
+      selected: s === l,
+      disabled: b,
+      "aria-current": s === l ? "true" : void 0
+    } : {
+      onClick: (i) => {
+        C(i, S(s));
+      },
+      type: s,
+      page: S(s),
+      selected: !1,
+      disabled: b || !s.includes("ellipsis") && (s === "next" || s === "last" ? l >= n : l <= 1)
+    }),
+    ...O
+  };
+}
+function lt(t) {
+  return H("MuiPaginationItem", t);
+}
+const r = _("MuiPaginationItem", ["root", "page", "sizeSmall", "sizeLarge", "text", "textPrimary", "textSecondary", "outlined", "outlinedPrimary", "outlinedSecondary", "rounded", "ellipsis", "firstLast", "previousNext", "focusVisible", "disabled", "selected", "icon", "colorPrimary", "colorSecondary"]), pt = h(/* @__PURE__ */ d("path", {
+  d: "M18.41 16.59L13.82 12l4.59-4.59L17 6l-6 6 6 6zM6 6h2v12H6z"
+}), "FirstPage"), ct = h(/* @__PURE__ */ d("path", {
+  d: "M5.59 7.41L10.18 12l-4.59 4.59L7 18l6-6-6-6zM16 6h2v12h-2z"
+}), "LastPage"), dt = h(/* @__PURE__ */ d("path", {
+  d: "M15.41 7.41L14 6l-6 6 6 6 1.41-1.41L10.83 12z"
+}), "NavigateBefore"), ut = h(/* @__PURE__ */ d("path", {
+  d: "M10 6L8.59 7.41 13.17 12l-4.58 4.59L10 18l6-6z"
+}), "NavigateNext"), K = (t, e) => {
+  const {
+    ownerState: o
+  } = t;
+  return [e.root, e[o.variant], e[`size${I(o.size)}`], o.variant === "text" && e[`text${I(o.color)}`], o.variant === "outlined" && e[`outlined${I(o.color)}`], o.shape === "rounded" && e.rounded, o.type === "page" && e.page, (o.type === "start-ellipsis" || o.type === "end-ellipsis") && e.ellipsis, (o.type === "previous" || o.type === "next") && e.previousNext, (o.type === "first" || o.type === "last") && e.firstLast];
+}, gt = (t) => {
+  const {
+    classes: e,
+    color: o,
+    disabled: n,
+    selected: y,
+    size: b,
+    shape: x,
+    type: u,
+    variant: g
+  } = t, P = {
+    root: ["root", `size${I(b)}`, g, x, o !== "standard" && `color${I(o)}`, o !== "standard" && `${g}${I(o)}`, n && "disabled", y && "selected", {
+      page: "page",
+      first: "firstLast",
+      last: "firstLast",
+      "start-ellipsis": "ellipsis",
+      "end-ellipsis": "ellipsis",
+      previous: "previousNext",
+      next: "previousNext"
+    }[u]],
+    icon: ["icon"]
+  };
+  return J(P, lt, e);
+}, ft = B("div", {
+  name: "MuiPaginationItem",
+  slot: "Root",
+  overridesResolver: K
+})(V(({
+  theme: t
+}) => ({
+  ...t.typography.body2,
+  borderRadius: 32 / 2,
+  textAlign: "center",
+  boxSizing: "border-box",
+  minWidth: 32,
+  padding: "0 6px",
+  margin: "0 3px",
+  color: (t.vars || t).palette.text.primary,
+  height: "auto",
+  [`&.${r.disabled}`]: {
+    opacity: (t.vars || t).palette.action.disabledOpacity
+  },
+  variants: [{
+    props: {
+      size: "small"
+    },
+    style: {
+      minWidth: 26,
+      borderRadius: 26 / 2,
+      margin: "0 1px",
+      padding: "0 4px"
+    }
+  }, {
+    props: {
+      size: "large"
+    },
+    style: {
+      minWidth: 40,
+      borderRadius: 40 / 2,
+      padding: "0 10px",
+      fontSize: t.typography.pxToRem(15)
+    }
+  }]
+}))), vt = B(nt, {
+  name: "MuiPaginationItem",
+  slot: "Root",
+  overridesResolver: K
+})(V(({
+  theme: t
+}) => ({
+  ...t.typography.body2,
+  borderRadius: 32 / 2,
+  textAlign: "center",
+  boxSizing: "border-box",
+  minWidth: 32,
+  height: 32,
+  padding: "0 6px",
+  margin: "0 3px",
+  color: (t.vars || t).palette.text.primary,
+  [`&.${r.focusVisible}`]: {
+    backgroundColor: (t.vars || t).palette.action.focus
+  },
+  [`&.${r.disabled}`]: {
+    opacity: (t.vars || t).palette.action.disabledOpacity
+  },
+  transition: t.transitions.create(["color", "background-color"], {
+    duration: t.transitions.duration.short
+  }),
+  "&:hover": {
+    backgroundColor: (t.vars || t).palette.action.hover,
+    // Reset on touch devices, it doesn't add specificity
+    "@media (hover: none)": {
+      backgroundColor: "transparent"
+    }
+  },
+  [`&.${r.selected}`]: {
+    backgroundColor: (t.vars || t).palette.action.selected,
+    "&:hover": {
+      backgroundColor: t.vars ? `rgba(${t.vars.palette.action.selectedChannel} / calc(${t.vars.palette.action.selectedOpacity} + ${t.vars.palette.action.hoverOpacity}))` : N(t.palette.action.selected, t.palette.action.selectedOpacity + t.palette.action.hoverOpacity),
+      // Reset on touch devices, it doesn't add specificity
+      "@media (hover: none)": {
+        backgroundColor: (t.vars || t).palette.action.selected
+      }
+    },
+    [`&.${r.focusVisible}`]: {
+      backgroundColor: t.vars ? `rgba(${t.vars.palette.action.selectedChannel} / calc(${t.vars.palette.action.selectedOpacity} + ${t.vars.palette.action.focusOpacity}))` : N(t.palette.action.selected, t.palette.action.selectedOpacity + t.palette.action.focusOpacity)
+    },
+    [`&.${r.disabled}`]: {
+      opacity: 1,
+      color: (t.vars || t).palette.action.disabled,
+      backgroundColor: (t.vars || t).palette.action.selected
+    }
+  },
+  variants: [{
+    props: {
+      size: "small"
+    },
+    style: {
+      minWidth: 26,
+      height: 26,
+      borderRadius: 26 / 2,
+      margin: "0 1px",
+      padding: "0 4px"
+    }
+  }, {
+    props: {
+      size: "large"
+    },
+    style: {
+      minWidth: 40,
+      height: 40,
+      borderRadius: 40 / 2,
+      padding: "0 10px",
+      fontSize: t.typography.pxToRem(15)
+    }
+  }, {
+    props: {
+      shape: "rounded"
+    },
+    style: {
+      borderRadius: (t.vars || t).shape.borderRadius
+    }
+  }, {
+    props: {
+      variant: "outlined"
+    },
+    style: {
+      border: t.vars ? `1px solid rgba(${t.vars.palette.common.onBackgroundChannel} / 0.23)` : `1px solid ${t.palette.mode === "light" ? "rgba(0, 0, 0, 0.23)" : "rgba(255, 255, 255, 0.23)"}`,
+      [`&.${r.selected}`]: {
+        [`&.${r.disabled}`]: {
+          borderColor: (t.vars || t).palette.action.disabledBackground,
+          color: (t.vars || t).palette.action.disabled
+        }
+      }
+    }
+  }, {
+    props: {
+      variant: "text"
+    },
+    style: {
+      [`&.${r.selected}`]: {
+        [`&.${r.disabled}`]: {
+          color: (t.vars || t).palette.action.disabled
+        }
+      }
+    }
+  }, ...Object.entries(t.palette).filter(D(["dark", "contrastText"])).map(([e]) => ({
+    props: {
+      variant: "text",
+      color: e
+    },
+    style: {
+      [`&.${r.selected}`]: {
+        color: (t.vars || t).palette[e].contrastText,
+        backgroundColor: (t.vars || t).palette[e].main,
+        "&:hover": {
+          backgroundColor: (t.vars || t).palette[e].dark,
+          // Reset on touch devices, it doesn't add specificity
+          "@media (hover: none)": {
+            backgroundColor: (t.vars || t).palette[e].main
+          }
+        },
+        [`&.${r.focusVisible}`]: {
+          backgroundColor: (t.vars || t).palette[e].dark
+        },
+        [`&.${r.disabled}`]: {
+          color: (t.vars || t).palette.action.disabled
+        }
+      }
+    }
+  })), ...Object.entries(t.palette).filter(D(["light"])).map(([e]) => ({
+    props: {
+      variant: "outlined",
+      color: e
+    },
+    style: {
+      [`&.${r.selected}`]: {
+        color: (t.vars || t).palette[e].main,
+        border: `1px solid ${t.vars ? `rgba(${t.vars.palette[e].mainChannel} / 0.5)` : N(t.palette[e].main, 0.5)}`,
+        backgroundColor: t.vars ? `rgba(${t.vars.palette[e].mainChannel} / ${t.vars.palette.action.activatedOpacity})` : N(t.palette[e].main, t.palette.action.activatedOpacity),
+        "&:hover": {
+          backgroundColor: t.vars ? `rgba(${t.vars.palette[e].mainChannel} / calc(${t.vars.palette.action.activatedOpacity} + ${t.vars.palette.action.focusOpacity}))` : N(t.palette[e].main, t.palette.action.activatedOpacity + t.palette.action.focusOpacity),
+          // Reset on touch devices, it doesn't add specificity
+          "@media (hover: none)": {
+            backgroundColor: "transparent"
+          }
+        },
+        [`&.${r.focusVisible}`]: {
+          backgroundColor: t.vars ? `rgba(${t.vars.palette[e].mainChannel} / calc(${t.vars.palette.action.activatedOpacity} + ${t.vars.palette.action.focusOpacity}))` : N(t.palette[e].main, t.palette.action.activatedOpacity + t.palette.action.focusOpacity)
+        }
+      }
+    }
+  }))]
+}))), yt = B("div", {
+  name: "MuiPaginationItem",
+  slot: "Icon",
+  overridesResolver: (t, e) => e.icon
+})(V(({
+  theme: t
+}) => ({
+  fontSize: t.typography.pxToRem(20),
+  margin: "0 -8px",
+  variants: [{
+    props: {
+      size: "small"
+    },
+    style: {
+      fontSize: t.typography.pxToRem(18)
+    }
+  }, {
+    props: {
+      size: "large"
+    },
+    style: {
+      fontSize: t.typography.pxToRem(22)
+    }
+  }]
+}))), Q = /* @__PURE__ */ G.forwardRef(function(e, o) {
+  const n = q({
+    props: e,
+    name: "MuiPaginationItem"
+  }), {
+    className: y,
+    color: b = "standard",
+    component: x,
+    components: u = {},
+    disabled: g = !1,
+    page: P,
+    selected: T = !1,
+    shape: R = "circular",
+    size: m = "medium",
+    slots: O = {},
+    slotProps: l = {},
+    type: p = "page",
+    variant: C = "text",
+    ...$
+  } = n, c = {
+    ...n,
+    color: b,
+    disabled: g,
+    selected: T,
+    shape: R,
+    size: m,
+    type: p,
+    variant: C
+  }, k = st(), v = gt(c), f = {
+    slots: {
+      previous: O.previous ?? u.previous,
+      next: O.next ?? u.next,
+      first: O.first ?? u.first,
+      last: O.last ?? u.last
+    },
+    slotProps: l
+  }, [L, S] = j("previous", {
+    elementType: dt,
+    externalForwardedProps: f,
+    ownerState: c
+  }), [z, s] = j("next", {
+    elementType: ut,
+    externalForwardedProps: f,
+    ownerState: c
+  }), [i, M] = j("first", {
+    elementType: pt,
+    externalForwardedProps: f,
+    ownerState: c
+  }), [W, F] = j("last", {
+    elementType: ct,
+    externalForwardedProps: f,
+    ownerState: c
+  }), A = k ? {
+    previous: "next",
+    next: "previous",
+    first: "last",
+    last: "first"
+  }[p] : p, E = {
+    previous: L,
+    next: z,
+    first: i,
+    last: W
+  }[A], Y = {
+    previous: S,
+    next: s,
+    first: M,
+    last: F
+  }[A];
+  return p === "start-ellipsis" || p === "end-ellipsis" ? /* @__PURE__ */ d(ft, {
+    ref: o,
+    ownerState: c,
+    className: U(v.root, y),
+    children: "…"
+  }) : /* @__PURE__ */ Z(vt, {
+    ref: o,
+    ownerState: c,
+    component: x,
+    disabled: g,
+    className: U(v.root, y),
+    ...$,
+    children: [p === "page" && P, E ? /* @__PURE__ */ d(yt, {
+      ...Y,
+      className: v.icon,
+      as: E
+    }) : null]
+  });
+});
+process.env.NODE_ENV !== "production" && (Q.propTypes = {
+  // ┌────────────────────────────── Warning ──────────────────────────────┐
+  // │ These PropTypes are generated from the TypeScript type definitions. │
+  // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
+  // └─────────────────────────────────────────────────────────────────────┘
+  /**
+   * @ignore
+   */
+  children: a.node,
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes: a.object,
+  /**
+   * @ignore
+   */
+  className: a.string,
+  /**
+   * The active color.
+   * It supports both default and custom theme colors, which can be added as shown in the
+   * [palette customization guide](https://mui.com/material-ui/customization/palette/#custom-colors).
+   * @default 'standard'
+   */
+  color: a.oneOfType([a.oneOf(["primary", "secondary", "standard"]), a.string]),
+  /**
+   * The component used for the root node.
+   * Either a string to use a HTML element or a component.
+   */
+  component: a.elementType,
+  /**
+   * The components used for each slot inside.
+   *
+   * This prop is an alias for the `slots` prop.
+   * It's recommended to use the `slots` prop instead.
+   *
+   * @default {}
+   * @deprecated use the `slots` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details.
+   */
+  components: a.shape({
+    first: a.elementType,
+    last: a.elementType,
+    next: a.elementType,
+    previous: a.elementType
+  }),
+  /**
+   * If `true`, the component is disabled.
+   * @default false
+   */
+  disabled: a.bool,
+  /**
+   * The current page number.
+   */
+  page: a.node,
+  /**
+   * If `true` the pagination item is selected.
+   * @default false
+   */
+  selected: a.bool,
+  /**
+   * The shape of the pagination item.
+   * @default 'circular'
+   */
+  shape: a.oneOf(["circular", "rounded"]),
+  /**
+   * The size of the component.
+   * @default 'medium'
+   */
+  size: a.oneOfType([a.oneOf(["small", "medium", "large"]), a.string]),
+  /**
+   * The props used for each slot inside.
+   * @default {}
+   */
+  slotProps: a.shape({
+    first: a.oneOfType([a.func, a.object]),
+    last: a.oneOfType([a.func, a.object]),
+    next: a.oneOfType([a.func, a.object]),
+    previous: a.oneOfType([a.func, a.object])
+  }),
+  /**
+   * The components used for each slot inside.
+   * @default {}
+   */
+  slots: a.shape({
+    first: a.elementType,
+    last: a.elementType,
+    next: a.elementType,
+    previous: a.elementType
+  }),
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx: a.oneOfType([a.arrayOf(a.oneOfType([a.func, a.object, a.bool])), a.func, a.object]),
+  /**
+   * The type of pagination item.
+   * @default 'page'
+   */
+  type: a.oneOf(["end-ellipsis", "first", "last", "next", "page", "previous", "start-ellipsis"]),
+  /**
+   * The variant to use.
+   * @default 'text'
+   */
+  variant: a.oneOfType([a.oneOf(["outlined", "text"]), a.string])
+});
+const bt = (t) => {
+  const {
+    classes: e,
+    variant: o
+  } = t;
+  return J({
+    root: ["root", o],
+    ul: ["ul"]
+  }, it, e);
+}, xt = B("nav", {
+  name: "MuiPagination",
+  slot: "Root",
+  overridesResolver: (t, e) => {
+    const {
+      ownerState: o
+    } = t;
+    return [e.root, e[o.variant]];
+  }
+})({}), Pt = B("ul", {
+  name: "MuiPagination",
+  slot: "Ul",
+  overridesResolver: (t, e) => e.ul
+})({
+  display: "flex",
+  flexWrap: "wrap",
+  alignItems: "center",
+  padding: 0,
+  margin: 0,
+  listStyle: "none"
+});
+function mt(t, e, o) {
+  return t === "page" ? `${o ? "" : "Go to "}page ${e}` : `Go to ${t} page`;
+}
+const X = /* @__PURE__ */ G.forwardRef(function(e, o) {
+  const n = q({
+    props: e,
+    name: "MuiPagination"
+  }), {
+    boundaryCount: y = 1,
+    className: b,
+    color: x = "standard",
+    count: u = 1,
+    defaultPage: g = 1,
+    disabled: P = !1,
+    getItemAriaLabel: T = mt,
+    hideNextButton: R = !1,
+    hidePrevButton: m = !1,
+    onChange: O,
+    page: l,
+    renderItem: p = (i) => /* @__PURE__ */ d(Q, {
+      ...i
+    }),
+    shape: C = "circular",
+    showFirstButton: $ = !1,
+    showLastButton: c = !1,
+    siblingCount: k = 1,
+    size: v = "medium",
+    variant: f = "text",
+    ...L
+  } = n, {
+    items: S
+  } = rt({
+    ...n,
+    componentName: "Pagination"
+  }), z = {
+    ...n,
+    boundaryCount: y,
+    color: x,
+    count: u,
+    defaultPage: g,
+    disabled: P,
+    getItemAriaLabel: T,
+    hideNextButton: R,
+    hidePrevButton: m,
+    renderItem: p,
+    shape: C,
+    showFirstButton: $,
+    showLastButton: c,
+    siblingCount: k,
+    size: v,
+    variant: f
+  }, s = bt(z);
+  return /* @__PURE__ */ d(xt, {
+    "aria-label": "pagination navigation",
+    className: U(s.root, b),
+    ownerState: z,
+    ref: o,
+    ...L,
+    children: /* @__PURE__ */ d(Pt, {
+      className: s.ul,
+      ownerState: z,
+      children: S.map((i, M) => /* @__PURE__ */ d("li", {
+        children: p({
+          ...i,
+          color: x,
+          "aria-label": T(i.type, i.page, i.selected),
+          shape: C,
+          size: v,
+          variant: f
+        })
+      }, M))
+    })
+  });
+});
+process.env.NODE_ENV !== "production" && (X.propTypes = {
+  // ┌────────────────────────────── Warning ──────────────────────────────┐
+  // │ These PropTypes are generated from the TypeScript type definitions. │
+  // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
+  // └─────────────────────────────────────────────────────────────────────┘
+  /**
+   * Number of always visible pages at the beginning and end.
+   * @default 1
+   */
+  boundaryCount: w,
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes: a.object,
+  /**
+   * @ignore
+   */
+  className: a.string,
+  /**
+   * The active color.
+   * It supports both default and custom theme colors, which can be added as shown in the
+   * [palette customization guide](https://mui.com/material-ui/customization/palette/#custom-colors).
+   * @default 'standard'
+   */
+  color: a.oneOfType([a.oneOf(["primary", "secondary", "standard"]), a.string]),
+  /**
+   * The total number of pages.
+   * @default 1
+   */
+  count: w,
+  /**
+   * The page selected by default when the component is uncontrolled.
+   * @default 1
+   */
+  defaultPage: w,
+  /**
+   * If `true`, the component is disabled.
+   * @default false
+   */
+  disabled: a.bool,
+  /**
+   * Accepts a function which returns a string value that provides a user-friendly name for the current page.
+   * This is important for screen reader users.
+   *
+   * For localization purposes, you can use the provided [translations](https://mui.com/material-ui/guides/localization/).
+   * @param {string} type The link or button type to format ('page' | 'first' | 'last' | 'next' | 'previous' | 'start-ellipsis' | 'end-ellipsis'). Defaults to 'page'.
+   * @param {number | null} page The page number to format.
+   * @param {boolean} selected If true, the current page is selected.
+   * @returns {string}
+   */
+  getItemAriaLabel: a.func,
+  /**
+   * If `true`, hide the next-page button.
+   * @default false
+   */
+  hideNextButton: a.bool,
+  /**
+   * If `true`, hide the previous-page button.
+   * @default false
+   */
+  hidePrevButton: a.bool,
+  /**
+   * Callback fired when the page is changed.
+   *
+   * @param {React.ChangeEvent<unknown>} event The event source of the callback.
+   * @param {number} page The page selected.
+   */
+  onChange: a.func,
+  /**
+   * The current page. Unlike `TablePagination`, which starts numbering from `0`, this pagination starts from `1`.
+   */
+  page: w,
+  /**
+   * Render the item.
+   * @param {PaginationRenderItemParams} params The props to spread on a PaginationItem.
+   * @returns {ReactNode}
+   * @default (item) => <PaginationItem {...item} />
+   */
+  renderItem: a.func,
+  /**
+   * The shape of the pagination items.
+   * @default 'circular'
+   */
+  shape: a.oneOf(["circular", "rounded"]),
+  /**
+   * If `true`, show the first-page button.
+   * @default false
+   */
+  showFirstButton: a.bool,
+  /**
+   * If `true`, show the last-page button.
+   * @default false
+   */
+  showLastButton: a.bool,
+  /**
+   * Number of always visible pages before and after the current page.
+   * @default 1
+   */
+  siblingCount: w,
+  /**
+   * The size of the component.
+   * @default 'medium'
+   */
+  size: a.oneOfType([a.oneOf(["small", "medium", "large"]), a.string]),
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx: a.oneOfType([a.arrayOf(a.oneOfType([a.func, a.object, a.bool])), a.func, a.object]),
+  /**
+   * The variant to use.
+   * @default 'text'
+   */
+  variant: a.oneOfType([a.oneOf(["outlined", "text"]), a.string])
+});
+const Ot = tt(X)(() => ({
+  ...at`
+    color: ${et.colors.green};
+  `
+})), wt = (t) => /* @__PURE__ */ d(Ot, { ...t });
+export {
+  wt as default
+};