@bouko/react 2.7.6 → 2.7.7

package/dist/assets/icons/arrow-left.svg

@@ -0,0 +1,6 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 640" width="1em" height="1em">
+    <path 
+        d="M73.4 297.4C60.9 309.9 60.9 330.2 73.4 342.7L233.4 502.7C245.9 515.2 266.2 515.2 278.7 502.7C291.2 490.2 291.2 469.9 278.7 457.4L173.3 352L544 352C561.7 352 576 337.7 576 320C576 302.3 561.7 288 544 288L173.3 288L278.7 182.6C291.2 170.1 291.2 149.8 278.7 137.3C266.2 124.8 245.9 124.8 233.4 137.3L73.4 297.3z" 
+        fill="currentColor" 
+    />
+</svg>

package/dist/assets/icons/arrow-right.svg

@@ -0,0 +1,6 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 640" width="1em" height="1em">
+    <path 
+        d="M566.6 342.6C579.1 330.1 579.1 309.8 566.6 297.3L406.6 137.3C394.1 124.8 373.8 124.8 361.3 137.3C348.8 149.8 348.8 170.1 361.3 182.6L466.7 288L96 288C78.3 288 64 302.3 64 320C64 337.7 78.3 352 96 352L466.7 352L361.3 457.4C348.8 469.9 348.8 490.2 361.3 502.7C373.8 515.2 394.1 515.2 406.6 502.7L566.6 342.7z" 
+        fill="currentColor" 
+    />
+</svg>

package/dist/components/index.d.ts

@@ -5,6 +5,7 @@ export { default as AbsoluteBox } from "./layout/absolute";
 export { default as Heading } from "./heading/normal";
 export { default as PageHeading } from "./heading/page";
 export * from "./layout/flex";
+export { default as Pagination } from "./pagination";
 export { default as Button } from "./button/normal";
 export { default as IconButton } from "./button/icon";
 export { default as Badge } from "./text/badge";

package/dist/components/index.js

@@ -5,6 +5,7 @@ export { default as AbsoluteBox } from "./layout/absolute";
 export { default as Heading } from "./heading/normal";
 export { default as PageHeading } from "./heading/page";
 export * from "./layout/flex";
+export { default as Pagination } from "./pagination";
 export { default as Button } from "./button/normal";
 export { default as IconButton } from "./button/icon";
 export { default as Badge } from "./text/badge";

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

@@ -0,0 +1,9 @@
+type Props = {
+    style?: string;
+    page: number;
+    prev: () => void;
+    next: () => void;
+    count: number;
+};
+export default function Pagination({ style, page, prev, next, count }: Props): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/pagination/index.js

@@ -0,0 +1,13 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import LeftArrow from "../../assets/icons/arrow-left.svg";
+import RightArrow from "../../assets/icons/arrow-right.svg";
+import { RowBox } from "@bouko/react";
+import { cn } from "@bouko/style";
+export default function Pagination({ style, page, prev, next, count }) {
+    return (_jsxs(RowBox, { style: cn(styles.container, style), children: [_jsx(LeftArrow, { className: cn(styles.arrow, page === 1 && "cursor-not-allowed"), onClick: page > 1 ? prev : undefined }), _jsx("span", { className: styles.page, children: page }), _jsx(RightArrow, { className: cn(styles.arrow, count === 0 && "cursor-not-allowed"), onClick: count > 0 ? next : undefined })] }));
+}
+const styles = {
+    container: "justify-between items-center gap-4 text-primary-darker",
+    arrow: "text-xs duration-200 hover:text-primary-dark cursor-pointer",
+    page: "text-sm font-mono font-semibold"
+};

package/package.json

@@ -1,7 +1,7 @@
 {
 
   "name": "@bouko/react",
-  "version": "2.7.6",
+  "version": "2.7.7",
   "main": "./dist/index.js",
   "types": "./dist/index.d.ts",
   "license": "MIT",