@vnejs/uis.react.page-selector 0.1.2

package/dist/PageSelector.d.ts

@@ -0,0 +1,12 @@
+export declare const PageSelector: ({ page, pagesCount, pagesMinCount, gap, size, transition, itemWidth, onNextPage, onPrevPage }: {
+    page: any;
+    pagesCount: any;
+    pagesMinCount: any;
+    gap?: number;
+    size?: number;
+    transition?: number;
+    itemWidth?: number;
+    onNextPage: any;
+    onPrevPage: any;
+}) => import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=PageSelector.d.ts.map

package/dist/PageSelector.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"PageSelector.d.ts","sourceRoot":"","sources":["../src/PageSelector.tsx"],"names":[],"mappings":"AA8BA,eAAO,MAAM,YAAY,GAAI;;;;;;;;;;CAAoH,4CAqChJ,CAAC"}

package/dist/PageSelector.js

@@ -0,0 +1,28 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useCallback, useMemo } from "react";
+import { getVneLength } from "@vnejs/uis.utils";
+import { Text, Flex } from "@vnejs/uis.react";
+const LINE_ARGS = { x1: "3", y1: "24", x2: "60", y2: "60" };
+const LINE_ARGS_1 = { ...LINE_ARGS, y1: "24" };
+const LINE_ARGS_2 = { ...LINE_ARGS, y1: "96" };
+const renderArrow = (style, angle, shift, onClick) => (_jsx("svg", { width: "60", height: "60", viewBox: "0 0 60 120", xmlns: "http://www.w3.org/2000/Text", fill: "none", stroke: "white", strokeWidth: "6", strokeLinecap: "round", style: style, onClick: onClick, children: _jsxs("g", { transform: `rotate(${angle} ${shift} 60)`, children: [_jsx("line", { ...LINE_ARGS_1 }), _jsx("line", { ...LINE_ARGS_2 })] }) }));
+export const PageSelector = ({ page, pagesCount, pagesMinCount, gap = 120, size = 60, transition = 300, itemWidth = 720, onNextPage, onPrevPage }) => {
+    const styleArrow = useMemo(() => {
+        const result = {};
+        if (size)
+            result.height = getVneLength(size);
+        if (itemWidth)
+            result.width = getVneLength(itemWidth);
+        if (transition)
+            result.transition = `${transition}ms`;
+        return result;
+    }, [size, itemWidth, transition]);
+    const showArrowLeft = page > pagesMinCount;
+    const showArrowRight = page < pagesCount;
+    const styleArrowLeft = useMemo(() => ({ ...styleArrow, opacity: showArrowLeft ? 1 : 0 }), [styleArrow, showArrowLeft]);
+    const styleArrowRight = useMemo(() => ({ ...styleArrow, opacity: showArrowRight ? 1 : 0 }), [styleArrow, showArrowRight]);
+    const onPrevPageHandler = useCallback(() => showArrowLeft && onPrevPage && onPrevPage(), [onPrevPage, showArrowLeft]);
+    const onNextPageHandler = useCallback(() => showArrowRight && onNextPage && onNextPage(), [onNextPage, showArrowRight]);
+    return (_jsxs(Flex, { align: Flex.ALIGN.CENTER, justify: Flex.JUSTIFY.CENTER, direction: Flex.DIRECTION.ROW, gap: gap, children: [renderArrow(styleArrowLeft, 180, 30, onPrevPageHandler), _jsx(Text, { width: itemWidth, size: size, text: `${page} / ${pagesCount}`, align: Text.ALIGNS.CENTER }), renderArrow(styleArrowRight, 0, 60, onNextPageHandler)] }));
+};
+//# sourceMappingURL=PageSelector.js.map

package/dist/PageSelector.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PageSelector.js","sourceRoot":"","sources":["../src/PageSelector.tsx"],"names":[],"mappings":"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"}

package/dist/index.d.ts

@@ -0,0 +1,2 @@
+export * from "./PageSelector";
+//# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,gBAAgB,CAAC"}

package/dist/index.js

@@ -0,0 +1,2 @@
+export * from "./PageSelector";
+//# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,gBAAgB,CAAC"}

package/package.json

@@ -0,0 +1,32 @@
+{
+  "name": "@vnejs/uis.react.page-selector",
+  "version": "0.1.2",
+  "main": "dist/index.js",
+  "types": "dist/index.d.ts",
+  "scripts": {
+    "build": "node ../../scripts/build-package.mjs",
+    "publish:major:plugin": "npm run publish:major",
+    "publish:minor:plugin": "npm run publish:minor",
+    "publish:patch:plugin": "npm run publish:patch",
+    "publish:major": "npm run build && npm version major && npm publish --access public",
+    "publish:minor": "npm run build && npm version minor && npm publish --access public",
+    "publish:patch": "npm run build && npm version patch && npm publish --access public"
+  },
+  "peerDependencies": {
+    "@bem-react/classname": "1.5.12",
+    "@vnejs/uis.utils": "~0.1.0",
+    "react": "19.2.4",
+    "react-dom": "19.2.4",
+    "@vnejs/uis.react": "~0.1.0"
+  },
+  "devDependencies": {
+    "@vnejs/uis.react": "~0.1.0",
+    "typescript": "^5.7.3",
+    "@types/react": "^19.0.10",
+    "@types/react-dom": "^19.0.4"
+  },
+  "files": [
+    "dist",
+    "package.json"
+  ]
+}