@yamada-ui/pagination 1.1.5-next-20241126031955 → 1.1.6-next-20241126024522

package/dist/chunk-5QYB2MRA.mjs

@@ -0,0 +1,91 @@
+"use client"
+import {
+  PaginationEllipsisIcon,
+  PaginationFirstIcon,
+  PaginationLastIcon,
+  PaginationNextIcon,
+  PaginationPrevIcon
+} from "./chunk-VZWGYG76.mjs";
+import {
+  usePaginationContext
+} from "./chunk-E66Q4CU7.mjs";
+
+// src/pagination-item.tsx
+import { forwardRef, ui } from "@yamada-ui/core";
+import { Ripple, useRipple } from "@yamada-ui/ripple";
+import { cx, dataAttr } from "@yamada-ui/utils";
+import { jsx, jsxs } from "react/jsx-runtime";
+var iconMap = {
+  ellipsis: /* @__PURE__ */ jsx(PaginationEllipsisIcon, {}),
+  first: /* @__PURE__ */ jsx(PaginationFirstIcon, {}),
+  last: /* @__PURE__ */ jsx(PaginationLastIcon, {}),
+  next: /* @__PURE__ */ jsx(PaginationNextIcon, {}),
+  prev: /* @__PURE__ */ jsx(PaginationPrevIcon, {})
+};
+var PaginationItem = forwardRef(
+  ({
+    className,
+    active,
+    children,
+    disabled,
+    disableRipple,
+    isActive,
+    isDisabled,
+    page,
+    ...rest
+  }, ref) => {
+    var _a;
+    const styles = usePaginationContext();
+    const isEllipsis = page === "ellipsis";
+    const { onPointerDown, ...rippleProps } = useRipple({
+      ...rest,
+      isDisabled: disableRipple || isDisabled || isEllipsis
+    });
+    children != null ? children : children = (_a = iconMap[page]) != null ? _a : page;
+    active != null ? active : active = isActive;
+    disabled != null ? disabled : disabled = isDisabled;
+    const css = {
+      alignItems: "center",
+      display: "flex",
+      justifyContent: "center",
+      overflow: "hidden",
+      position: "relative",
+      userSelect: "none",
+      ...styles.item,
+      ...styles[page]
+    };
+    const Component = ui[isEllipsis ? "span" : "button"];
+    return /* @__PURE__ */ jsxs(
+      Component,
+      {
+        ref,
+        ...!isEllipsis ? {
+          type: "button",
+          "data-disabled": dataAttr(disabled),
+          "data-selected": dataAttr(active),
+          disabled
+        } : {},
+        className: cx(
+          "ui-pagination__item",
+          isEllipsis ? "ui-pagination__item--ellipsis" : void 0,
+          className
+        ),
+        tabIndex: !isEllipsis ? 0 : -1,
+        __css: css,
+        ...rest,
+        onPointerDown,
+        children: [
+          children,
+          /* @__PURE__ */ jsx(Ripple, { ...rippleProps })
+        ]
+      }
+    );
+  }
+);
+PaginationItem.displayName = "PaginationItem";
+PaginationItem.__ui__ = "PaginationItem";
+
+export {
+  PaginationItem
+};
+//# sourceMappingURL=chunk-5QYB2MRA.mjs.map

package/dist/chunk-5QYB2MRA.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/pagination-item.tsx"],"sourcesContent":["import type { CSSUIObject, HTMLUIProps } from \"@yamada-ui/core\"\nimport type { ReactNode } from \"react\"\nimport { forwardRef, ui } from \"@yamada-ui/core\"\nimport { Ripple, useRipple } from \"@yamada-ui/ripple\"\nimport { cx, dataAttr } from \"@yamada-ui/utils\"\nimport {\n  PaginationEllipsisIcon,\n  PaginationFirstIcon,\n  PaginationLastIcon,\n  PaginationNextIcon,\n  PaginationPrevIcon,\n} from \"./pagination-icon\"\nimport { usePaginationContext } from \"./use-pagination\"\n\ninterface PaginationItemOptions {\n  /**\n   * The type of the page or item assigned to the pagination item.\n   */\n  page: \"ellipsis\" | \"first\" | \"last\" | \"next\" | \"prev\" | number\n  /**\n   * If `true`, the pagination item will be activated.\n   *\n   * @default false\n   */\n  active?: boolean\n  /**\n   * If `true`, the pagination item will be disabled.\n   *\n   * @default false\n   */\n  disabled?: boolean\n  /**\n   * If `true`, disable ripple effects when pressing a element.\n   *\n   * @default false\n   */\n  disableRipple?: boolean\n  /**\n   * If `true`, the pagination item will be activated.\n   *\n   * @default false\n   *\n   * @deprecated Use `active` instead.\n   */\n  isActive?: boolean\n  /**\n   * If `true`, the pagination item will be disabled.\n   *\n   * @default false\n   *\n   * @deprecated Use `disabled` instead.\n   */\n  isDisabled?: boolean\n}\n\nexport interface PaginationItemProps\n  extends Omit<HTMLUIProps<\"button\">, \"page\">,\n    PaginationItemOptions {}\n\nconst iconMap: {\n  [key in \"ellipsis\" | \"first\" | \"last\" | \"next\" | \"prev\" | number]: ReactNode\n} = {\n  ellipsis: <PaginationEllipsisIcon />,\n  first: <PaginationFirstIcon />,\n  last: <PaginationLastIcon />,\n  next: <PaginationNextIcon />,\n  prev: <PaginationPrevIcon />,\n}\n\nexport const PaginationItem = forwardRef<PaginationItemProps, \"button\">(\n  (\n    {\n      className,\n      active,\n      children,\n      disabled,\n      disableRipple,\n      isActive,\n      isDisabled,\n      page,\n      ...rest\n    },\n    ref,\n  ) => {\n    const styles = usePaginationContext()\n    const isEllipsis = page === \"ellipsis\"\n    const { onPointerDown, ...rippleProps } = useRipple({\n      ...rest,\n      isDisabled: disableRipple || isDisabled || isEllipsis,\n    })\n\n    children ??= iconMap[page] ?? page\n    active ??= isActive\n    disabled ??= isDisabled\n\n    const css: CSSUIObject = {\n      alignItems: \"center\",\n      display: \"flex\",\n      justifyContent: \"center\",\n      overflow: \"hidden\",\n      position: \"relative\",\n      userSelect: \"none\",\n      ...styles.item,\n      ...styles[page],\n    }\n\n    const Component = ui[isEllipsis ? \"span\" : \"button\"]\n\n    return (\n      <Component\n        ref={ref}\n        {...(!isEllipsis\n          ? {\n              type: \"button\",\n              \"data-disabled\": dataAttr(disabled),\n              \"data-selected\": dataAttr(active),\n              disabled,\n            }\n          : {})}\n        className={cx(\n          \"ui-pagination__item\",\n          isEllipsis ? \"ui-pagination__item--ellipsis\" : undefined,\n          className,\n        )}\n        tabIndex={!isEllipsis ? 0 : -1}\n        __css={css}\n        {...rest}\n        onPointerDown={onPointerDown}\n      >\n        {children}\n\n        <Ripple {...rippleProps} />\n      </Component>\n    )\n  },\n)\n\nPaginationItem.displayName = \"PaginationItem\"\nPaginationItem.__ui__ = \"PaginationItem\"\n"],"mappings":";;;;;;;;;;;;;AAEA,SAAS,YAAY,UAAU;AAC/B,SAAS,QAAQ,iBAAiB;AAClC,SAAS,IAAI,gBAAgB;AA0DjB,cA+CN,YA/CM;AAHZ,IAAM,UAEF;AAAA,EACF,UAAU,oBAAC,0BAAuB;AAAA,EAClC,OAAO,oBAAC,uBAAoB;AAAA,EAC5B,MAAM,oBAAC,sBAAmB;AAAA,EAC1B,MAAM,oBAAC,sBAAmB;AAAA,EAC1B,MAAM,oBAAC,sBAAmB;AAC5B;AAEO,IAAM,iBAAiB;AAAA,EAC5B,CACE;AAAA,IACE;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EACL,GACA,QACG;AAnFP;AAoFI,UAAM,SAAS,qBAAqB;AACpC,UAAM,aAAa,SAAS;AAC5B,UAAM,EAAE,eAAe,GAAG,YAAY,IAAI,UAAU;AAAA,MAClD,GAAG;AAAA,MACH,YAAY,iBAAiB,cAAc;AAAA,IAC7C,CAAC;AAED,8CAAa,aAAQ,IAAI,MAAZ,YAAiB;AAC9B,uCAAW;AACX,6CAAa;AAEb,UAAM,MAAmB;AAAA,MACvB,YAAY;AAAA,MACZ,SAAS;AAAA,MACT,gBAAgB;AAAA,MAChB,UAAU;AAAA,MACV,UAAU;AAAA,MACV,YAAY;AAAA,MACZ,GAAG,OAAO;AAAA,MACV,GAAG,OAAO,IAAI;AAAA,IAChB;AAEA,UAAM,YAAY,GAAG,aAAa,SAAS,QAAQ;AAEnD,WACE;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACC,GAAI,CAAC,aACF;AAAA,UACE,MAAM;AAAA,UACN,iBAAiB,SAAS,QAAQ;AAAA,UAClC,iBAAiB,SAAS,MAAM;AAAA,UAChC;AAAA,QACF,IACA,CAAC;AAAA,QACL,WAAW;AAAA,UACT;AAAA,UACA,aAAa,kCAAkC;AAAA,UAC/C;AAAA,QACF;AAAA,QACA,UAAU,CAAC,aAAa,IAAI;AAAA,QAC5B,OAAO;AAAA,QACN,GAAG;AAAA,QACJ;AAAA,QAEC;AAAA;AAAA,UAED,oBAAC,UAAQ,GAAG,aAAa;AAAA;AAAA;AAAA,IAC3B;AAAA,EAEJ;AACF;AAEA,eAAe,cAAc;AAC7B,eAAe,SAAS;","names":[]}

package/dist/{chunk-US4OATQR.mjs → chunk-IH2XPMDF.mjs}

@@ -1,7 +1,7 @@
 "use client"
 import {
   PaginationItem
-} from "./chunk-4CVSJB46.mjs";
+} from "./chunk-5QYB2MRA.mjs";
 import {
   PaginationProvider,
   usePagination
@@ -172,4 +172,4 @@ Pagination.__ui__ = "Pagination";
 export {
   Pagination
 };
-//# sourceMappingURL=chunk-US4OATQR.mjs.map
+//# sourceMappingURL=chunk-IH2XPMDF.mjs.map

package/dist/chunk-VZWGYG76.mjs

@@ -0,0 +1,69 @@
+"use client"
+
+// src/pagination-icon.tsx
+import { Icon } from "@yamada-ui/icon";
+import { jsx } from "react/jsx-runtime";
+var PaginationEllipsisIcon = (props) => {
+  return /* @__PURE__ */ jsx(Icon, { viewBox: "0 0 16 16", ...props, children: /* @__PURE__ */ jsx(
+    "path",
+    {
+      d: "M2 8c0-.733.6-1.333 1.333-1.333.734 0 1.334.6 1.334 1.333s-.6 1.333-1.334 1.333C2.6 9.333 2 8.733 2 8zm9.333 0c0-.733.6-1.333 1.334-1.333C13.4 6.667 14 7.267 14 8s-.6 1.333-1.333 1.333c-.734 0-1.334-.6-1.334-1.333zM6.667 8c0-.733.6-1.333 1.333-1.333s1.333.6 1.333 1.333S8.733 9.333 8 9.333 6.667 8.733 6.667 8z",
+      fill: "currentColor"
+    }
+  ) });
+};
+PaginationEllipsisIcon.displayName = "PaginationEllipsisIcon";
+PaginationEllipsisIcon.__ui__ = "PaginationEllipsisIcon";
+var PaginationFirstIcon = (props) => {
+  return /* @__PURE__ */ jsx(Icon, { viewBox: "0 0 16 16", ...props, children: /* @__PURE__ */ jsx(
+    "path",
+    {
+      d: "M6.85355 3.85355C7.04882 3.65829 7.04882 3.34171 6.85355 3.14645C6.65829 2.95118 6.34171 2.95118 6.14645 3.14645L2.14645 7.14645C1.95118 7.34171 1.95118 7.65829 2.14645 7.85355L6.14645 11.8536C6.34171 12.0488 6.65829 12.0488 6.85355 11.8536C7.04882 11.6583 7.04882 11.3417 6.85355 11.1464L3.20711 7.5L6.85355 3.85355ZM12.8536 3.85355C13.0488 3.65829 13.0488 3.34171 12.8536 3.14645C12.6583 2.95118 12.3417 2.95118 12.1464 3.14645L8.14645 7.14645C7.95118 7.34171 7.95118 7.65829 8.14645 7.85355L12.1464 11.8536C12.3417 12.0488 12.6583 12.0488 12.8536 11.8536C13.0488 11.6583 13.0488 11.3417 12.8536 11.1464L9.20711 7.5L12.8536 3.85355Z",
+      fill: "currentColor"
+    }
+  ) });
+};
+PaginationFirstIcon.displayName = "PaginationFirstIcon";
+PaginationFirstIcon.__ui__ = "PaginationFirstIcon";
+var PaginationLastIcon = (props) => {
+  return /* @__PURE__ */ jsx(Icon, { viewBox: "0 0 16 16", ...props, children: /* @__PURE__ */ jsx(
+    "path",
+    {
+      d: "M2.14645 11.1464C1.95118 11.3417 1.95118 11.6583 2.14645 11.8536C2.34171 12.0488 2.65829 12.0488 2.85355 11.8536L6.85355 7.85355C7.04882 7.65829 7.04882 7.34171 6.85355 7.14645L2.85355 3.14645C2.65829 2.95118 2.34171 2.95118 2.14645 3.14645C1.95118 3.34171 1.95118 3.65829 2.14645 3.85355L5.79289 7.5L2.14645 11.1464ZM8.14645 11.1464C7.95118 11.3417 7.95118 11.6583 8.14645 11.8536C8.34171 12.0488 8.65829 12.0488 8.85355 11.8536L12.8536 7.85355C13.0488 7.65829 13.0488 7.34171 12.8536 7.14645L8.85355 3.14645C8.65829 2.95118 8.34171 2.95118 8.14645 3.14645C7.95118 3.34171 7.95118 3.65829 8.14645 3.85355L11.7929 7.5L8.14645 11.1464Z",
+      fill: "currentColor"
+    }
+  ) });
+};
+PaginationLastIcon.displayName = "PaginationLastIcon";
+PaginationLastIcon.__ui__ = "PaginationLastIcon";
+var PaginationPrevIcon = (props) => {
+  return /* @__PURE__ */ jsx(Icon, { viewBox: "0 0 16 16", ...props, children: /* @__PURE__ */ jsx(
+    "path",
+    {
+      d: "M7.219 8l3.3 3.3-.943.943L5.333 8l4.243-4.243.943.943-3.3 3.3z",
+      fill: "currentColor"
+    }
+  ) });
+};
+PaginationPrevIcon.displayName = "PaginationPrevIcon";
+PaginationPrevIcon.__ui__ = "PaginationPrevIcon";
+var PaginationNextIcon = (props) => {
+  return /* @__PURE__ */ jsx(Icon, { viewBox: "0 0 16 16", ...props, children: /* @__PURE__ */ jsx(
+    "path",
+    {
+      d: "M8.781 8l-3.3-3.3.943-.943L10.667 8l-4.243 4.243-.943-.943 3.3-3.3z",
+      fill: "currentColor"
+    }
+  ) });
+};
+PaginationNextIcon.displayName = "PaginationNextIcon";
+PaginationNextIcon.__ui__ = "PaginationNextIcon";
+
+export {
+  PaginationEllipsisIcon,
+  PaginationFirstIcon,
+  PaginationLastIcon,
+  PaginationPrevIcon,
+  PaginationNextIcon
+};
+//# sourceMappingURL=chunk-VZWGYG76.mjs.map

package/dist/chunk-VZWGYG76.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/pagination-icon.tsx"],"sourcesContent":["import type { FC } from \"@yamada-ui/core\"\nimport type { IconProps } from \"@yamada-ui/icon\"\nimport { Icon } from \"@yamada-ui/icon\"\n\nexport const PaginationEllipsisIcon: FC<IconProps> = (props) => {\n  return (\n    <Icon viewBox=\"0 0 16 16\" {...props}>\n      <path\n        d=\"M2 8c0-.733.6-1.333 1.333-1.333.734 0 1.334.6 1.334 1.333s-.6 1.333-1.334 1.333C2.6 9.333 2 8.733 2 8zm9.333 0c0-.733.6-1.333 1.334-1.333C13.4 6.667 14 7.267 14 8s-.6 1.333-1.333 1.333c-.734 0-1.334-.6-1.334-1.333zM6.667 8c0-.733.6-1.333 1.333-1.333s1.333.6 1.333 1.333S8.733 9.333 8 9.333 6.667 8.733 6.667 8z\"\n        fill=\"currentColor\"\n      />\n    </Icon>\n  )\n}\n\nPaginationEllipsisIcon.displayName = \"PaginationEllipsisIcon\"\nPaginationEllipsisIcon.__ui__ = \"PaginationEllipsisIcon\"\n\nexport const PaginationFirstIcon: FC<IconProps> = (props) => {\n  return (\n    <Icon viewBox=\"0 0 16 16\" {...props}>\n      <path\n        d=\"M6.85355 3.85355C7.04882 3.65829 7.04882 3.34171 6.85355 3.14645C6.65829 2.95118 6.34171 2.95118 6.14645 3.14645L2.14645 7.14645C1.95118 7.34171 1.95118 7.65829 2.14645 7.85355L6.14645 11.8536C6.34171 12.0488 6.65829 12.0488 6.85355 11.8536C7.04882 11.6583 7.04882 11.3417 6.85355 11.1464L3.20711 7.5L6.85355 3.85355ZM12.8536 3.85355C13.0488 3.65829 13.0488 3.34171 12.8536 3.14645C12.6583 2.95118 12.3417 2.95118 12.1464 3.14645L8.14645 7.14645C7.95118 7.34171 7.95118 7.65829 8.14645 7.85355L12.1464 11.8536C12.3417 12.0488 12.6583 12.0488 12.8536 11.8536C13.0488 11.6583 13.0488 11.3417 12.8536 11.1464L9.20711 7.5L12.8536 3.85355Z\"\n        fill=\"currentColor\"\n      />\n    </Icon>\n  )\n}\n\nPaginationFirstIcon.displayName = \"PaginationFirstIcon\"\nPaginationFirstIcon.__ui__ = \"PaginationFirstIcon\"\n\nexport const PaginationLastIcon: FC<IconProps> = (props) => {\n  return (\n    <Icon viewBox=\"0 0 16 16\" {...props}>\n      <path\n        d=\"M2.14645 11.1464C1.95118 11.3417 1.95118 11.6583 2.14645 11.8536C2.34171 12.0488 2.65829 12.0488 2.85355 11.8536L6.85355 7.85355C7.04882 7.65829 7.04882 7.34171 6.85355 7.14645L2.85355 3.14645C2.65829 2.95118 2.34171 2.95118 2.14645 3.14645C1.95118 3.34171 1.95118 3.65829 2.14645 3.85355L5.79289 7.5L2.14645 11.1464ZM8.14645 11.1464C7.95118 11.3417 7.95118 11.6583 8.14645 11.8536C8.34171 12.0488 8.65829 12.0488 8.85355 11.8536L12.8536 7.85355C13.0488 7.65829 13.0488 7.34171 12.8536 7.14645L8.85355 3.14645C8.65829 2.95118 8.34171 2.95118 8.14645 3.14645C7.95118 3.34171 7.95118 3.65829 8.14645 3.85355L11.7929 7.5L8.14645 11.1464Z\"\n        fill=\"currentColor\"\n      />\n    </Icon>\n  )\n}\n\nPaginationLastIcon.displayName = \"PaginationLastIcon\"\nPaginationLastIcon.__ui__ = \"PaginationLastIcon\"\n\nexport const PaginationPrevIcon: FC<IconProps> = (props) => {\n  return (\n    <Icon viewBox=\"0 0 16 16\" {...props}>\n      <path\n        d=\"M7.219 8l3.3 3.3-.943.943L5.333 8l4.243-4.243.943.943-3.3 3.3z\"\n        fill=\"currentColor\"\n      />\n    </Icon>\n  )\n}\n\nPaginationPrevIcon.displayName = \"PaginationPrevIcon\"\nPaginationPrevIcon.__ui__ = \"PaginationPrevIcon\"\n\nexport const PaginationNextIcon: FC<IconProps> = (props) => {\n  return (\n    <Icon viewBox=\"0 0 16 16\" {...props}>\n      <path\n        d=\"M8.781 8l-3.3-3.3.943-.943L10.667 8l-4.243 4.243-.943-.943 3.3-3.3z\"\n        fill=\"currentColor\"\n      />\n    </Icon>\n  )\n}\n\nPaginationNextIcon.displayName = \"PaginationNextIcon\"\nPaginationNextIcon.__ui__ = \"PaginationNextIcon\"\n"],"mappings":";;;AAEA,SAAS,YAAY;AAKf;AAHC,IAAM,yBAAwC,CAAC,UAAU;AAC9D,SACE,oBAAC,QAAK,SAAQ,aAAa,GAAG,OAC5B;AAAA,IAAC;AAAA;AAAA,MACC,GAAE;AAAA,MACF,MAAK;AAAA;AAAA,EACP,GACF;AAEJ;AAEA,uBAAuB,cAAc;AACrC,uBAAuB,SAAS;AAEzB,IAAM,sBAAqC,CAAC,UAAU;AAC3D,SACE,oBAAC,QAAK,SAAQ,aAAa,GAAG,OAC5B;AAAA,IAAC;AAAA;AAAA,MACC,GAAE;AAAA,MACF,MAAK;AAAA;AAAA,EACP,GACF;AAEJ;AAEA,oBAAoB,cAAc;AAClC,oBAAoB,SAAS;AAEtB,IAAM,qBAAoC,CAAC,UAAU;AAC1D,SACE,oBAAC,QAAK,SAAQ,aAAa,GAAG,OAC5B;AAAA,IAAC;AAAA;AAAA,MACC,GAAE;AAAA,MACF,MAAK;AAAA;AAAA,EACP,GACF;AAEJ;AAEA,mBAAmB,cAAc;AACjC,mBAAmB,SAAS;AAErB,IAAM,qBAAoC,CAAC,UAAU;AAC1D,SACE,oBAAC,QAAK,SAAQ,aAAa,GAAG,OAC5B;AAAA,IAAC;AAAA;AAAA,MACC,GAAE;AAAA,MACF,MAAK;AAAA;AAAA,EACP,GACF;AAEJ;AAEA,mBAAmB,cAAc;AACjC,mBAAmB,SAAS;AAErB,IAAM,qBAAoC,CAAC,UAAU;AAC1D,SACE,oBAAC,QAAK,SAAQ,aAAa,GAAG,OAC5B;AAAA,IAAC;AAAA;AAAA,MACC,GAAE;AAAA,MACF,MAAK;AAAA;AAAA,EACP,GACF;AAEJ;AAEA,mBAAmB,cAAc;AACjC,mBAAmB,SAAS;","names":[]}