@ioca/react 1.4.79 → 1.4.81

package/lib/es/components/modal/modal.js

@@ -1,115 +1,91 @@
-import { useKeydown } from "../../js/hooks.js";
-import Content from "./content.js";
-import ModalContext from "./context.js";
-import useModal from "./useModal.js";
-import classNames from "classnames";
-import { useEffect, useRef, useState } from "react";
-import { jsx, jsxs } from "react/jsx-runtime";
-import { createPortal } from "react-dom";
-//#region packages/components/modal/modal.tsx
+import { jsx, jsxs } from 'react/jsx-runtime';
+import classNames from 'classnames';
+import { useState, useRef, useEffect } from 'react';
+import { createPortal } from 'react-dom';
+import { useKeydown } from '../../js/hooks.js';
+import Content from './content.js';
+import ModalContext from './context.js';
+import useModal from './useModal.js';
+
 function Modal(props) {
-	const { visible, title, footer, okButtonProps, cancelButtonProps, closable = true, hideBackdrop, backdropClosable = true, hideCloseButton, disableEsc, width, height, customized, fixed, hideShadow, children, style, className, keepDOM, footerLeft, onClick, onVisibleChange, onClose, onOk, ...restProps } = props;
-	const [show, setShow] = useState(visible);
-	const [active, setActive] = useState(false);
-	const [bounced, setBounced] = useState(false);
-	const [mounted, setMounted] = useState(false);
-	const toggable = useRef(true);
-	const handleShow = async () => {
-		if (!toggable.current) return;
-		(!keepDOM || !show) && setShow(true);
-		toggable.current = false;
-		const timer = setTimeout(() => {
-			setActive(true);
-			onVisibleChange?.(true);
-			toggable.current = true;
-		}, 64);
-		return () => clearTimeout(timer);
-	};
-	const handleHide = () => {
-		if (!toggable.current) return;
-		toggable.current = false;
-		if (!closable) {
-			setBounced(true);
-			const timer = setTimeout(() => {
-				setBounced(false);
-				toggable.current = true;
-			}, 400);
-			return () => clearTimeout(timer);
-		}
-		setActive(false);
-		const timer = setTimeout(() => {
-			!keepDOM && setShow(false);
-			toggable.current = true;
-			onVisibleChange?.(false);
-			onClose?.();
-		}, 240);
-		return () => clearTimeout(timer);
-	};
-	const handleBackdropClick = () => {
-		backdropClosable && handleHide();
-	};
-	useKeydown((e) => {
-		if (e.code !== "Escape" || !visible) return;
-		handleHide();
-	}, { disabled: disableEsc });
-	useEffect(() => {
-		visible ? handleShow() : handleHide();
-	}, [visible]);
-	useEffect(() => {
-		setMounted(true);
-	}, []);
-	const handleClick = () => {
-		if (typeof document === "undefined") return;
-		document.documentElement.click();
-	};
-	if (!show || !mounted) return null;
-	return createPortal(/* @__PURE__ */ jsx("div", {
-		className: classNames("i-modal-container", {
-			"i-modal-backdrop": !hideBackdrop,
-			"i-modal-customized": customized,
-			"i-modal-active": active,
-			fixed
-		}, className),
-		style,
-		onClick: handleBackdropClick,
-		"aria-modal": "true",
-		inert: !active,
-		children: /* @__PURE__ */ jsx("div", {
-			className: classNames("i-modal", {
-				bounced,
-				shadow: !hideShadow
-			}),
-			style: {
-				width,
-				height
-			},
-			onClick: (e) => {
-				e.stopPropagation();
-				handleClick();
-				onClick?.(e);
-			},
-			role: "dialog",
-			"aria-labelledby": title ? "modal-title" : void 0,
-			...restProps,
-			children: /* @__PURE__ */ jsxs(ModalContext.Provider, {
-				value: true,
-				children: [customized && children, !customized && /* @__PURE__ */ jsx(Content, {
-					title,
-					hideCloseButton,
-					footer,
-					okButtonProps,
-					cancelButtonProps,
-					children,
-					footerLeft,
-					onOk,
-					onClose: handleHide
-				})]
-			})
-		})
-	}), document?.body ?? null);
+    const { visible, title, footer, okButtonProps, cancelButtonProps, closable = true, hideBackdrop, backdropClosable = true, hideCloseButton, disableEsc, width, height, customized, fixed, hideShadow, children, style, className, keepDOM, footerLeft, onClick, onVisibleChange, onClose, onOk, ...restProps } = props;
+    const [show, setShow] = useState(visible);
+    const [active, setActive] = useState(false);
+    const [bounced, setBounced] = useState(false);
+    const [mounted, setMounted] = useState(false);
+    const toggable = useRef(true);
+    const handleShow = async () => {
+        if (!toggable.current)
+            return;
+        (!keepDOM || !show) && setShow(true);
+        toggable.current = false;
+        const timer = setTimeout(() => {
+            setActive(true);
+            onVisibleChange?.(true);
+            toggable.current = true;
+        }, 64);
+        return () => clearTimeout(timer);
+    };
+    const handleHide = () => {
+        if (!toggable.current)
+            return;
+        toggable.current = false;
+        if (!closable) {
+            setBounced(true);
+            const timer = setTimeout(() => {
+                setBounced(false);
+                toggable.current = true;
+            }, 400);
+            return () => clearTimeout(timer);
+        }
+        setActive(false);
+        const timer = setTimeout(() => {
+            !keepDOM && setShow(false);
+            toggable.current = true;
+            onVisibleChange?.(false);
+            onClose?.();
+        }, 240);
+        return () => clearTimeout(timer);
+    };
+    const handleBackdropClick = () => {
+        backdropClosable && handleHide();
+    };
+    useKeydown((e) => {
+        if (e.code !== "Escape" || !visible)
+            return;
+        handleHide();
+    }, { disabled: disableEsc });
+    useEffect(() => {
+        visible ? handleShow() : handleHide();
+    }, [visible]);
+    useEffect(() => {
+        setMounted(true);
+    }, []);
+    const handleClick = () => {
+        if (typeof document === "undefined")
+            return;
+        document.documentElement.click();
+    };
+    if (!show || !mounted)
+        return null;
+    return createPortal(jsx("div", { className: classNames("i-modal-container", {
+            "i-modal-backdrop": !hideBackdrop,
+            "i-modal-customized": customized,
+            "i-modal-active": active,
+            fixed,
+        }, className), style: style, onClick: handleBackdropClick, "aria-modal": 'true', inert: !active, children: jsx("div", { className: classNames("i-modal", {
+                bounced,
+                shadow: !hideShadow,
+            }), style: {
+                width,
+                height,
+            }, onClick: (e) => {
+                e.stopPropagation();
+                handleClick();
+                onClick?.(e);
+            }, role: 'dialog', "aria-labelledby": title ? "modal-title" : undefined, ...restProps, children: jsxs(ModalContext.Provider, { value: true, children: [customized && children, !customized && (jsx(Content, { title: title, hideCloseButton: hideCloseButton, footer: footer, okButtonProps: okButtonProps, cancelButtonProps: cancelButtonProps, children: children, footerLeft: footerLeft, onOk: onOk, onClose: handleHide }))] }) }) }), document?.body ?? null);
 }
 Modal.useModal = useModal;
-//#endregion
-export { Modal as default };
 
-//# sourceMappingURL=modal.js.map
+export { Modal as default };
+//# sourceMappingURL=modal.js.map

package/lib/es/components/modal/modal.js.map

@@ -1 +1 @@
-{"version":3,"file":"modal.js","names":[],"sources":["../../../../packages/components/modal/modal.tsx"],"sourcesContent":["import classNames from \"classnames\";\nimport { useEffect, useRef, useState } from \"react\";\nimport { createPortal } from \"react-dom\";\nimport { useKeydown } from \"../../js/hooks\";\nimport Content from \"./content\";\nimport ModalContext from \"./context\";\nimport \"./index.css\";\nimport { CompositionModal, IModal } from \"./type\";\nimport useModal from \"./useModal\";\n\nfunction Modal(props: IModal) {\n\tconst {\n\t\tvisible,\n\t\ttitle,\n\t\tfooter,\n\t\tokButtonProps,\n\t\tcancelButtonProps,\n\t\tclosable = true,\n\t\thideBackdrop,\n\t\tbackdropClosable = true,\n\t\thideCloseButton,\n\t\tdisableEsc,\n\t\twidth,\n\t\theight,\n\t\tcustomized,\n\t\tfixed,\n\t\thideShadow,\n\t\tchildren,\n\t\tstyle,\n\t\tclassName,\n\t\tkeepDOM,\n\t\tfooterLeft,\n\t\tonClick,\n\t\tonVisibleChange,\n\t\tonClose,\n\t\tonOk,\n\t\t...restProps\n\t} = props;\n\n\tconst [show, setShow] = useState(visible);\n\tconst [active, setActive] = useState(false);\n\tconst [bounced, setBounced] = useState(false);\n\tconst [mounted, setMounted] = useState(false);\n\tconst toggable = useRef(true);\n\n\tconst handleShow = async () => {\n\t\tif (!toggable.current) return;\n\n\t\t(!keepDOM || !show) && setShow(true);\n\t\ttoggable.current = false;\n\n\t\tconst timer = setTimeout(() => {\n\t\t\tsetActive(true);\n\t\t\tonVisibleChange?.(true);\n\t\t\ttoggable.current = true;\n\t\t}, 64);\n\n\t\treturn () => clearTimeout(timer);\n\t};\n\n\tconst handleHide = () => {\n\t\tif (!toggable.current) return;\n\t\ttoggable.current = false;\n\n\t\tif (!closable) {\n\t\t\tsetBounced(true);\n\t\t\tconst timer = setTimeout(() => {\n\t\t\t\tsetBounced(false);\n\t\t\t\ttoggable.current = true;\n\t\t\t}, 400);\n\t\t\treturn () => clearTimeout(timer);\n\t\t}\n\n\t\tsetActive(false);\n\t\tconst timer = setTimeout(() => {\n\t\t\t!keepDOM && setShow(false);\n\t\t\ttoggable.current = true;\n\t\t\tonVisibleChange?.(false);\n\t\t\tonClose?.();\n\t\t}, 240);\n\n\t\treturn () => clearTimeout(timer);\n\t};\n\n\tconst handleBackdropClick = () => {\n\t\tbackdropClosable && handleHide();\n\t};\n\n\tuseKeydown(\n\t\t(e) => {\n\t\t\tif (e.code !== \"Escape\" || !visible) return;\n\t\t\thandleHide();\n\t\t},\n\t\t{ disabled: disableEsc }\n\t);\n\n\tuseEffect(() => {\n\t\tvisible ? handleShow() : handleHide();\n\t}, [visible]);\n\n\tuseEffect(() => {\n\t\tsetMounted(true);\n\t}, []);\n\n\tconst handleClick = () => {\n\t\tif (typeof document === \"undefined\") return;\n\t\tdocument.documentElement.click();\n\t};\n\n\tif (!show || !mounted) return null;\n\n\treturn createPortal(\n\t\t<div\n\t\t\tclassName={classNames(\n\t\t\t\t\"i-modal-container\",\n\t\t\t\t{\n\t\t\t\t\t\"i-modal-backdrop\": !hideBackdrop,\n\t\t\t\t\t\"i-modal-customized\": customized,\n\t\t\t\t\t\"i-modal-active\": active,\n\t\t\t\t\tfixed,\n\t\t\t\t},\n\t\t\t\tclassName\n\t\t\t)}\n\t\t\tstyle={style}\n\t\t\tonClick={handleBackdropClick}\n\t\t\taria-modal='true'\n\t\t\tinert={!active}\n\t\t>\n\t\t\t<div\n\t\t\t\tclassName={classNames(\"i-modal\", {\n\t\t\t\t\tbounced,\n\t\t\t\t\tshadow: !hideShadow,\n\t\t\t\t})}\n\t\t\t\tstyle={{\n\t\t\t\t\twidth,\n\t\t\t\t\theight,\n\t\t\t\t}}\n\t\t\t\tonClick={(e) => {\n\t\t\t\t\te.stopPropagation();\n\t\t\t\t\thandleClick();\n\t\t\t\t\tonClick?.(e);\n\t\t\t\t}}\n\t\t\t\trole='dialog'\n\t\t\t\taria-labelledby={title ? \"modal-title\" : undefined}\n\t\t\t\t{...restProps}\n\t\t\t>\n\t\t\t\t<ModalContext.Provider value={true}>\n\t\t\t\t\t{customized && children}\n\n\t\t\t\t\t{!customized && (\n\t\t\t\t\t\t<Content\n\t\t\t\t\t\t\ttitle={title}\n\t\t\t\t\t\t\thideCloseButton={hideCloseButton}\n\t\t\t\t\t\t\tfooter={footer}\n\t\t\t\t\t\t\tokButtonProps={okButtonProps}\n\t\t\t\t\t\t\tcancelButtonProps={cancelButtonProps}\n\t\t\t\t\t\t\tchildren={children}\n\t\t\t\t\t\t\tfooterLeft={footerLeft}\n\t\t\t\t\t\t\tonOk={onOk}\n\t\t\t\t\t\t\tonClose={handleHide}\n\t\t\t\t\t\t/>\n\t\t\t\t\t)}\n\t\t\t\t</ModalContext.Provider>\n\t\t\t</div>\n\t\t</div>,\n\t\tdocument?.body ?? null\n\t);\n}\n\nModal.useModal = useModal;\n\nexport default Modal as CompositionModal;\n"],"mappings":";;;;;;;;;;CAUA,MAAA,EACC,SACC,OACA,QACA,eACA,mBACA,WAAA,MACA,cACA,mBAAY,MACZ,iBACA,YACA,OACA,QACA,YACA,OACA,YACA,UACA,OACA,WACA,SACA,YACA,SACA,iBACA,SACA,MACA,GAAA,cACG;;CAGJ,MAAM,CAAC,QAAM,aAAW,SAAS,MAAQ;CACzC,MAAM,CAAC,SAAQ,cAAa,SAAS,MAAM;CAC3C,MAAM,CAAC,SAAS,cAAc,SAAS,MAAM;CAC7C,MAAM,WAAU,OAAA,KAAa;;AAG7B,MAAK,CAAC,SAAA,QAAkB;;AAGvB,WAAS,UAAU;;AAGnB,aAAW,KAAG;AACb,qBAAe,KAAA;AACf,YAAA,UAAkB;KAClB,GAAA;;;;AAMF,MAAK,CAAC,SAAA,QAAkB;AACvB,WAAK,UAAS;;AAGd,cAAK,KAAU;GACd,MAAA,QAAW,iBAAK;AAChB,eAAY,MAAE;AACb,aAAA,UAAiB;MACjB,IAAA;AACD,gBAAO,aAAA,MAAA;;;EAIR,MAAA,QAAU,iBAAM;AAChB,IAAA,WAAa,QAAC,MAAa;AAC1B,YAAS,UAAU;AACnB,qBAAkB,MAAK;AACvB,cAAA;KACA,IAAA;;;;AAMF,sBAAM,YAA2B;;aAIjC,MAAA;AACE,MAAI,EAAE,SAAA,YAAA,CAAA,QAAA;AACN,cAAY;IAEb,EAAC,UAAA,YAAA,CACD;;AAGD,YAAW,YAAK,GAAA,YAAA;IACf,CAAA,QAAU,CAAA;;AAGX,aAAY,KAAI;IACf,EAAA,CAAA;;AAGD,MAAK,OAAC,aAAmB,YAAC;AACzB,WAAI,gBAAqB,OAAA;;;qBAM1B,oBAAA,OAAA;EACE,WAAA,WACA,qBACC;GACA,oBAAA,CAAA;GACC,sBAAqB;GACrB,kBAAS;GACT;GACA,EACD,UACA;EACA;EACD,SAAO;EACP,cAAS;EACT,OAAK,CAAA;YAEN,oBAAA,OAAA;GACE,WAAA,WAAA,WAAA;IACA;IACC,QAAO,CAAA;IACP,CAAA;GACD,OAAE;IACF;IACC;IACA;GACD,UAAC,MAAA;AACD,MAAA,iBAAgB;AACf,iBAAE;AACF,cAAA,EAAY;;GAEb,MAAC;GACD,mBAAY,QAAA,gBAAA,KAAA;GACZ,GAAI;aAEL,qBAAA,aAAA,UAAA;IAAA,OAAA;cAAA,CACE,cAAa,UAAA,CAAA,cAGZ,oBAAC,SAAD;KACC;KACY;KACZ;KACc;KACC;KACf;KACU;KACV;KACA,SAAM;KACN,CAAA,CAED;;GACA,CAAA;EACE,CAAA,EACN,UAAM,QAAA,KACN"}
+{"version":3,"file":"modal.js","sources":["../../../../packages/components/modal/modal.tsx"],"sourcesContent":["import classNames from \"classnames\";\nimport { useEffect, useRef, useState } from \"react\";\nimport { createPortal } from \"react-dom\";\nimport { useKeydown } from \"../../js/hooks\";\nimport Content from \"./content\";\nimport ModalContext from \"./context\";\nimport \"./index.css\";\nimport { CompositionModal, IModal } from \"./type\";\nimport useModal from \"./useModal\";\n\nfunction Modal(props: IModal) {\n\tconst {\n\t\tvisible,\n\t\ttitle,\n\t\tfooter,\n\t\tokButtonProps,\n\t\tcancelButtonProps,\n\t\tclosable = true,\n\t\thideBackdrop,\n\t\tbackdropClosable = true,\n\t\thideCloseButton,\n\t\tdisableEsc,\n\t\twidth,\n\t\theight,\n\t\tcustomized,\n\t\tfixed,\n\t\thideShadow,\n\t\tchildren,\n\t\tstyle,\n\t\tclassName,\n\t\tkeepDOM,\n\t\tfooterLeft,\n\t\tonClick,\n\t\tonVisibleChange,\n\t\tonClose,\n\t\tonOk,\n\t\t...restProps\n\t} = props;\n\n\tconst [show, setShow] = useState(visible);\n\tconst [active, setActive] = useState(false);\n\tconst [bounced, setBounced] = useState(false);\n\tconst [mounted, setMounted] = useState(false);\n\tconst toggable = useRef(true);\n\n\tconst handleShow = async () => {\n\t\tif (!toggable.current) return;\n\n\t\t(!keepDOM || !show) && setShow(true);\n\t\ttoggable.current = false;\n\n\t\tconst timer = setTimeout(() => {\n\t\t\tsetActive(true);\n\t\t\tonVisibleChange?.(true);\n\t\t\ttoggable.current = true;\n\t\t}, 64);\n\n\t\treturn () => clearTimeout(timer);\n\t};\n\n\tconst handleHide = () => {\n\t\tif (!toggable.current) return;\n\t\ttoggable.current = false;\n\n\t\tif (!closable) {\n\t\t\tsetBounced(true);\n\t\t\tconst timer = setTimeout(() => {\n\t\t\t\tsetBounced(false);\n\t\t\t\ttoggable.current = true;\n\t\t\t}, 400);\n\t\t\treturn () => clearTimeout(timer);\n\t\t}\n\n\t\tsetActive(false);\n\t\tconst timer = setTimeout(() => {\n\t\t\t!keepDOM && setShow(false);\n\t\t\ttoggable.current = true;\n\t\t\tonVisibleChange?.(false);\n\t\t\tonClose?.();\n\t\t}, 240);\n\n\t\treturn () => clearTimeout(timer);\n\t};\n\n\tconst handleBackdropClick = () => {\n\t\tbackdropClosable && handleHide();\n\t};\n\n\tuseKeydown(\n\t\t(e) => {\n\t\t\tif (e.code !== \"Escape\" || !visible) return;\n\t\t\thandleHide();\n\t\t},\n\t\t{ disabled: disableEsc }\n\t);\n\n\tuseEffect(() => {\n\t\tvisible ? handleShow() : handleHide();\n\t}, [visible]);\n\n\tuseEffect(() => {\n\t\tsetMounted(true);\n\t}, []);\n\n\tconst handleClick = () => {\n\t\tif (typeof document === \"undefined\") return;\n\t\tdocument.documentElement.click();\n\t};\n\n\tif (!show || !mounted) return null;\n\n\treturn createPortal(\n\t\t<div\n\t\t\tclassName={classNames(\n\t\t\t\t\"i-modal-container\",\n\t\t\t\t{\n\t\t\t\t\t\"i-modal-backdrop\": !hideBackdrop,\n\t\t\t\t\t\"i-modal-customized\": customized,\n\t\t\t\t\t\"i-modal-active\": active,\n\t\t\t\t\tfixed,\n\t\t\t\t},\n\t\t\t\tclassName\n\t\t\t)}\n\t\t\tstyle={style}\n\t\t\tonClick={handleBackdropClick}\n\t\t\taria-modal='true'\n\t\t\tinert={!active}\n\t\t>\n\t\t\t<div\n\t\t\t\tclassName={classNames(\"i-modal\", {\n\t\t\t\t\tbounced,\n\t\t\t\t\tshadow: !hideShadow,\n\t\t\t\t})}\n\t\t\t\tstyle={{\n\t\t\t\t\twidth,\n\t\t\t\t\theight,\n\t\t\t\t}}\n\t\t\t\tonClick={(e) => {\n\t\t\t\t\te.stopPropagation();\n\t\t\t\t\thandleClick();\n\t\t\t\t\tonClick?.(e);\n\t\t\t\t}}\n\t\t\t\trole='dialog'\n\t\t\t\taria-labelledby={title ? \"modal-title\" : undefined}\n\t\t\t\t{...restProps}\n\t\t\t>\n\t\t\t\t<ModalContext.Provider value={true}>\n\t\t\t\t\t{customized && children}\n\n\t\t\t\t\t{!customized && (\n\t\t\t\t\t\t<Content\n\t\t\t\t\t\t\ttitle={title}\n\t\t\t\t\t\t\thideCloseButton={hideCloseButton}\n\t\t\t\t\t\t\tfooter={footer}\n\t\t\t\t\t\t\tokButtonProps={okButtonProps}\n\t\t\t\t\t\t\tcancelButtonProps={cancelButtonProps}\n\t\t\t\t\t\t\tchildren={children}\n\t\t\t\t\t\t\tfooterLeft={footerLeft}\n\t\t\t\t\t\t\tonOk={onOk}\n\t\t\t\t\t\t\tonClose={handleHide}\n\t\t\t\t\t\t/>\n\t\t\t\t\t)}\n\t\t\t\t</ModalContext.Provider>\n\t\t\t</div>\n\t\t</div>,\n\t\tdocument?.body ?? null\n\t);\n}\n\nModal.useModal = useModal;\n\nexport default Modal as CompositionModal;\n"],"names":["_jsx","_jsxs"],"mappings":"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"}

package/lib/es/components/modal/useModal.js

@@ -1,38 +1,34 @@
-import { renderNode } from "../../js/utils.js";
-import HookModal from "./hookModal.js";
-import { useRef } from "react";
-import { jsx } from "react/jsx-runtime";
-//#region packages/components/modal/useModal.tsx
+import { jsx } from 'react/jsx-runtime';
+import { useRef } from 'react';
+import { renderNode } from '../../js/utils.js';
+import HookModal from './hookModal.js';
+
 function useModal() {
-	const ref = useRef(null);
-	const handleOpen = (props) => {
-		const unMount = renderNode(/* @__PURE__ */ jsx(HookModal, {
-			ref,
-			visible: true,
-			...props,
-			onClose: () => {
-				props.onClose?.();
-				unMount?.();
-			}
-		}));
-	};
-	const handleUpdate = (props) => {
-		if (!ref.current) return;
-		const { update } = ref.current;
-		update(props);
-	};
-	const handleClose = () => {
-		if (!ref.current) return;
-		const { close } = ref.current;
-		close();
-	};
-	return {
-		open: handleOpen,
-		update: handleUpdate,
-		close: handleClose
-	};
+    const ref = useRef(null);
+    const handleOpen = (props) => {
+        const unMount = renderNode(jsx(HookModal, { ref: ref, visible: true, ...props, onClose: () => {
+                props.onClose?.();
+                unMount?.();
+            } }));
+    };
+    const handleUpdate = (props) => {
+        if (!ref.current)
+            return;
+        const { update } = ref.current;
+        update(props);
+    };
+    const handleClose = () => {
+        if (!ref.current)
+            return;
+        const { close } = ref.current;
+        close();
+    };
+    return {
+        open: handleOpen,
+        update: handleUpdate,
+        close: handleClose,
+    };
 }
-//#endregion
-export { useModal as default };
 
-//# sourceMappingURL=useModal.js.map
+export { useModal as default };
+//# sourceMappingURL=useModal.js.map

package/lib/es/components/modal/useModal.js.map

@@ -1 +1 @@
-{"version":3,"file":"useModal.js","names":[],"sources":["../../../../packages/components/modal/useModal.tsx"],"sourcesContent":["import { useRef } from \"react\";\nimport { renderNode } from \"../../js/utils\";\nimport HookModal from \"./hookModal\";\nimport { IModal, RefHookModal } from \"./type\";\n\nexport default function useModal() {\n\tconst ref = useRef<RefHookModal>(null);\n\n\tconst handleOpen = (props: IModal) => {\n\t\tconst unMount = renderNode(\n\t\t\t<HookModal\n\t\t\t\tref={ref}\n\t\t\t\tvisible\n\t\t\t\t{...props}\n\t\t\t\tonClose={() => {\n\t\t\t\t\tprops.onClose?.();\n\t\t\t\t\tunMount?.();\n\t\t\t\t}}\n\t\t\t/>\n\t\t);\n\t};\n\n\tconst handleUpdate = (props: IModal) => {\n\t\tif (!ref.current) return;\n\n\t\tconst { update } = ref.current;\n\t\tupdate(props);\n\t};\n\n\tconst handleClose = () => {\n\t\tif (!ref.current) return;\n\n\t\tconst { close } = ref.current;\n\t\tclose();\n\t};\n\n\treturn {\n\t\topen: handleOpen,\n\t\tupdate: handleUpdate,\n\t\tclose: handleClose,\n\t};\n}\n"],"mappings":";;;;;AAKA,SAAwB,WAAW;CAClC,MAAM,MAAM,OAAqB,KAAK;CAEtC,MAAM,cAAc,UAAkB;EACrC,MAAM,UAAU,WACf,oBAAC,WAAD;GACM;GACL,SAAA;GACA,GAAI;GACJ,eAAe;AACd,UAAM,WAAW;AACjB,eAAW;;GAEX,CAAA,CACF;;CAGF,MAAM,gBAAgB,UAAkB;AACvC,MAAI,CAAC,IAAI,QAAS;EAElB,MAAM,EAAE,WAAW,IAAI;AACvB,SAAO,MAAM;;CAGd,MAAM,oBAAoB;AACzB,MAAI,CAAC,IAAI,QAAS;EAElB,MAAM,EAAE,UAAU,IAAI;AACtB,SAAO;;AAGR,QAAO;EACN,MAAM;EACN,QAAQ;EACR,OAAO;EACP"}
+{"version":3,"file":"useModal.js","sources":["../../../../packages/components/modal/useModal.tsx"],"sourcesContent":["import { useRef } from \"react\";\nimport { renderNode } from \"../../js/utils\";\nimport HookModal from \"./hookModal\";\nimport { IModal, RefHookModal } from \"./type\";\n\nexport default function useModal() {\n\tconst ref = useRef<RefHookModal>(null);\n\n\tconst handleOpen = (props: IModal) => {\n\t\tconst unMount = renderNode(\n\t\t\t<HookModal\n\t\t\t\tref={ref}\n\t\t\t\tvisible\n\t\t\t\t{...props}\n\t\t\t\tonClose={() => {\n\t\t\t\t\tprops.onClose?.();\n\t\t\t\t\tunMount?.();\n\t\t\t\t}}\n\t\t\t/>\n\t\t);\n\t};\n\n\tconst handleUpdate = (props: IModal) => {\n\t\tif (!ref.current) return;\n\n\t\tconst { update } = ref.current;\n\t\tupdate(props);\n\t};\n\n\tconst handleClose = () => {\n\t\tif (!ref.current) return;\n\n\t\tconst { close } = ref.current;\n\t\tclose();\n\t};\n\n\treturn {\n\t\topen: handleOpen,\n\t\tupdate: handleUpdate,\n\t\tclose: handleClose,\n\t};\n}\n"],"names":["_jsx"],"mappings":";;;;;AAKc,SAAU,QAAQ,GAAA;AAC/B,IAAA,MAAM,GAAG,GAAG,MAAM,CAAe,IAAI,CAAC;AAEtC,IAAA,MAAM,UAAU,GAAG,CAAC,KAAa,KAAI;AACpC,QAAA,MAAM,OAAO,GAAG,UAAU,CACzBA,GAAA,CAAC,SAAS,IACT,GAAG,EAAE,GAAG,EACR,OAAO,EAAA,IAAA,EAAA,GACH,KAAK,EACT,OAAO,EAAE,MAAK;AACb,gBAAA,KAAK,CAAC,OAAO,IAAI;gBACjB,OAAO,IAAI;YACZ,CAAC,EAAA,CACA,CACF;AACF,IAAA,CAAC;AAED,IAAA,MAAM,YAAY,GAAG,CAAC,KAAa,KAAI;QACtC,IAAI,CAAC,GAAG,CAAC,OAAO;YAAE;AAElB,QAAA,MAAM,EAAE,MAAM,EAAE,GAAG,GAAG,CAAC,OAAO;QAC9B,MAAM,CAAC,KAAK,CAAC;AACd,IAAA,CAAC;IAED,MAAM,WAAW,GAAG,MAAK;QACxB,IAAI,CAAC,GAAG,CAAC,OAAO;YAAE;AAElB,QAAA,MAAM,EAAE,KAAK,EAAE,GAAG,GAAG,CAAC,OAAO;AAC7B,QAAA,KAAK,EAAE;AACR,IAAA,CAAC;IAED,OAAO;AACN,QAAA,IAAI,EAAE,UAAU;AAChB,QAAA,MAAM,EAAE,YAAY;AACpB,QAAA,KAAK,EAAE,WAAW;KAClB;AACF;;;;"}

package/lib/es/components/pagination/index.js

@@ -1,7 +1,6 @@
-import Pagination from "./pagination.js";
-//#region packages/components/pagination/index.tsx
-var pagination_default = Pagination;
-//#endregion
-export { pagination_default as default };
+import Pagination from './pagination.js';
 
-//# sourceMappingURL=index.js.map
+
+
+export { Pagination as default };
+//# sourceMappingURL=index.js.map

package/lib/es/components/pagination/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":[],"sources":["../../../../packages/components/pagination/index.tsx"],"sourcesContent":["import Pagination from \"./pagination\";\n\nexport default Pagination;\n"],"mappings":";;AAEA,IAAA,qBAAe"}
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}

package/lib/es/components/pagination/page.js

@@ -1,29 +1,24 @@
-import loading_default from "../loading/index.js";
-import classNames from "classnames";
-import { useState } from "react";
-import { jsx, jsxs } from "react/jsx-runtime";
-//#region packages/components/pagination/page.tsx
+import { jsxs, jsx } from 'react/jsx-runtime';
+import classNames from 'classnames';
+import { useState } from 'react';
+import Loading from '../loading/loading.js';
+
 const Page = (props) => {
-	const { page, active, disabled, children, onChange } = props;
-	const [loading, setLoading] = useState(false);
-	const handleClick = async () => {
-		if (active || loading || disabled) return;
-		setLoading(true);
-		await onChange?.(page);
-		setLoading(false);
-	};
-	return /* @__PURE__ */ jsxs("a", {
-		className: classNames("i-page", {
-			"i-page-active": active,
-			"i-page-loading": loading,
-			"i-page-disabled": disabled
-		}),
-		"data-page": page,
-		onClick: handleClick,
-		children: [loading && /* @__PURE__ */ jsx(loading_default, { absolute: true }), children]
-	});
+    const { page, active, disabled, children, onChange } = props;
+    const [loading, setLoading] = useState(false);
+    const handleClick = async () => {
+        if (active || loading || disabled)
+            return;
+        setLoading(true);
+        await onChange?.(page);
+        setLoading(false);
+    };
+    return (jsxs("a", { className: classNames("i-page", {
+            "i-page-active": active,
+            "i-page-loading": loading,
+            "i-page-disabled": disabled,
+        }), "data-page": page, onClick: handleClick, children: [loading && jsx(Loading, { absolute: true }), children] }));
 };
-//#endregion
-export { Page as default };
 
-//# sourceMappingURL=page.js.map
+export { Page as default };
+//# sourceMappingURL=page.js.map

package/lib/es/components/pagination/page.js.map

@@ -1 +1 @@
-{"version":3,"file":"page.js","names":["Loading"],"sources":["../../../../packages/components/pagination/page.tsx"],"sourcesContent":["import classNames from \"classnames\";\nimport { useState } from \"react\";\nimport Loading from \"../loading\";\nimport { IPageItem } from \"./type\";\n\nconst Page = (props: IPageItem) => {\n\tconst { page, active, disabled, children, onChange } = props;\n\tconst [loading, setLoading] = useState(false);\n\n\tconst handleClick = async () => {\n\t\tif (active || loading || disabled) return;\n\n\t\tsetLoading(true);\n\t\tawait onChange?.(page);\n\t\tsetLoading(false);\n\t};\n\n\treturn (\n\t\t<a\n\t\t\tclassName={classNames(\"i-page\", {\n\t\t\t\t\"i-page-active\": active,\n\t\t\t\t\"i-page-loading\": loading,\n\t\t\t\t\"i-page-disabled\": disabled,\n\t\t\t})}\n\t\t\tdata-page={page}\n\t\t\tonClick={handleClick}\n\t\t>\n\t\t\t{loading && <Loading absolute />}\n\t\t\t{children}\n\t\t</a>\n\t);\n};\n\nexport default Page;\n"],"mappings":";;;;;AAKA,MAAM,QAAQ,UAAqB;CAClC,MAAM,EAAE,MAAM,QAAQ,UAAU,UAAU,aAAa;CACvD,MAAM,CAAC,SAAS,cAAc,SAAS,MAAM;CAE7C,MAAM,cAAc,YAAY;AAC/B,MAAI,UAAU,WAAW,SAAU;AAEnC,aAAW,KAAK;AAChB,QAAM,WAAW,KAAK;AACtB,aAAW,MAAM;;AAGlB,QACC,qBAAC,KAAD;EACC,WAAW,WAAW,UAAU;GAC/B,iBAAiB;GACjB,kBAAkB;GAClB,mBAAmB;GACnB,CAAC;EACF,aAAW;EACX,SAAS;YAPV,CASE,WAAW,oBAACA,iBAAD,EAAS,UAAA,MAAW,CAAA,EAC/B,SACE"}
+{"version":3,"file":"page.js","sources":["../../../../packages/components/pagination/page.tsx"],"sourcesContent":["import classNames from \"classnames\";\nimport { useState } from \"react\";\nimport Loading from \"../loading\";\nimport { IPageItem } from \"./type\";\n\nconst Page = (props: IPageItem) => {\n\tconst { page, active, disabled, children, onChange } = props;\n\tconst [loading, setLoading] = useState(false);\n\n\tconst handleClick = async () => {\n\t\tif (active || loading || disabled) return;\n\n\t\tsetLoading(true);\n\t\tawait onChange?.(page);\n\t\tsetLoading(false);\n\t};\n\n\treturn (\n\t\t<a\n\t\t\tclassName={classNames(\"i-page\", {\n\t\t\t\t\"i-page-active\": active,\n\t\t\t\t\"i-page-loading\": loading,\n\t\t\t\t\"i-page-disabled\": disabled,\n\t\t\t})}\n\t\t\tdata-page={page}\n\t\t\tonClick={handleClick}\n\t\t>\n\t\t\t{loading && <Loading absolute />}\n\t\t\t{children}\n\t\t</a>\n\t);\n};\n\nexport default Page;\n"],"names":["_jsxs","_jsx"],"mappings":";;;;;AAKA,MAAM,IAAI,GAAG,CAAC,KAAgB,KAAI;AACjC,IAAA,MAAM,EAAE,IAAI,EAAE,MAAM,EAAE,QAAQ,EAAE,QAAQ,EAAE,QAAQ,EAAE,GAAG,KAAK;IAC5D,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC;AAE7C,IAAA,MAAM,WAAW,GAAG,YAAW;AAC9B,QAAA,IAAI,MAAM,IAAI,OAAO,IAAI,QAAQ;YAAE;QAEnC,UAAU,CAAC,IAAI,CAAC;AAChB,QAAA,MAAM,QAAQ,GAAG,IAAI,CAAC;QACtB,UAAU,CAAC,KAAK,CAAC;AAClB,IAAA,CAAC;AAED,IAAA,QACCA,IAAA,CAAA,GAAA,EAAA,EACC,SAAS,EAAE,UAAU,CAAC,QAAQ,EAAE;AAC/B,YAAA,eAAe,EAAE,MAAM;AACvB,YAAA,gBAAgB,EAAE,OAAO;AACzB,YAAA,iBAAiB,EAAE,QAAQ;AAC3B,SAAA,CAAC,eACS,IAAI,EACf,OAAO,EAAE,WAAW,aAEnB,OAAO,IAAIC,GAAA,CAAC,OAAO,IAAC,QAAQ,EAAA,IAAA,EAAA,CAAG,EAC/B,QAAQ,CAAA,EAAA,CACN;AAEN;;;;"}

package/lib/es/components/pagination/pagination.js

@@ -1,84 +1,44 @@
-import icon_default from "../icon/index.js";
-import Page from "./page.js";
-import classNames from "classnames";
-import { useEffect, useMemo, useState } from "react";
-import { KeyboardArrowLeftRound, KeyboardArrowRightRound, MoreHorizRound } from "@ricons/material";
-import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
-//#region packages/components/pagination/pagination.tsx
+import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
+import { KeyboardArrowLeftRound, KeyboardArrowRightRound, MoreHorizRound } from '@ricons/material';
+import classNames from 'classnames';
+import { useState, useMemo, useEffect } from 'react';
+import Icon from '../icon/icon.js';
+import Page from './page.js';
+
 const Pagination = (props) => {
-	const { page: defaultPage = 1, size = 10, total = 0, sibling = 2, prev = /* @__PURE__ */ jsx(icon_default, { icon: /* @__PURE__ */ jsx(KeyboardArrowLeftRound, {}) }), next = /* @__PURE__ */ jsx(icon_default, { icon: /* @__PURE__ */ jsx(KeyboardArrowRightRound, {}) }), simple, jumper, className, renderEllipsis = () => /* @__PURE__ */ jsx(icon_default, {
-		icon: /* @__PURE__ */ jsx(MoreHorizRound, {}),
-		className: "color-7"
-	}), renderPage = (i) => i, onChange, ...restProps } = props;
-	const [page, setPage] = useState(defaultPage);
-	const [loading, setLoading] = useState(false);
-	const totalPage = useMemo(() => Math.ceil(total / size), [size, total]);
-	const [start, end, loop] = useMemo(() => {
-		const start = Math.max(1, page - sibling);
-		const end = Math.min(totalPage, page + sibling);
-		return [
-			start,
-			end,
-			Array.from({ length: end - start + 1 }).map((n, i) => start + i)
-		];
-	}, [
-		page,
-		totalPage,
-		sibling
-	]);
-	const handlePageChange = async (p) => {
-		if (!onChange || loading) return;
-		setLoading(true);
-		return new Promise(async (resolve) => {
-			if (p === void 0) return;
-			await onChange(p);
-			setPage(p);
-			setLoading(false);
-			resolve();
-		});
-	};
-	useEffect(() => setPage(defaultPage), [defaultPage]);
-	if (totalPage <= page && page === 1) return /* @__PURE__ */ jsx(Fragment$1, {});
-	return /* @__PURE__ */ jsxs("div", {
-		className: classNames("i-pagination", className),
-		...restProps,
-		children: [
-			prev && /* @__PURE__ */ jsx(Page, {
-				page: page - 1 || 1,
-				disabled: page === 1,
-				onChange: handlePageChange,
-				children: prev
-			}),
-			start > 1 && /* @__PURE__ */ jsx(Page, {
-				page: 1,
-				onChange: handlePageChange,
-				children: renderPage(1)
-			}),
-			start > 2 && renderEllipsis(),
-			loop.map((p) => {
-				return /* @__PURE__ */ jsx(Page, {
-					page: p,
-					active: p === page,
-					onChange: handlePageChange,
-					children: renderPage(p)
-				}, p);
-			}),
-			end < totalPage - 1 && renderEllipsis(),
-			end < totalPage && /* @__PURE__ */ jsx(Page, {
-				page: totalPage,
-				onChange: handlePageChange,
-				children: renderPage(totalPage)
-			}),
-			next && /* @__PURE__ */ jsx(Page, {
-				page: page + 1,
-				disabled: page === totalPage,
-				onChange: handlePageChange,
-				children: next
-			})
-		]
-	});
+    const { page: defaultPage = 1, size = 10, total = 0, sibling = 2, prev = jsx(Icon, { icon: jsx(KeyboardArrowLeftRound, {}) }), next = jsx(Icon, { icon: jsx(KeyboardArrowRightRound, {}) }), simple, jumper, className, renderEllipsis = () => (jsx(Icon, { icon: jsx(MoreHorizRound, {}), className: 'color-7' })), renderPage = (i) => i, onChange, ...restProps } = props;
+    const [page, setPage] = useState(defaultPage);
+    const [loading, setLoading] = useState(false);
+    const totalPage = useMemo(() => Math.ceil(total / size), [size, total]);
+    const [start, end, loop] = useMemo(() => {
+        const start = Math.max(1, page - sibling);
+        const end = Math.min(totalPage, page + sibling);
+        return [
+            start,
+            end,
+            Array.from({ length: end - start + 1 }).map((n, i) => start + i),
+        ];
+    }, [page, totalPage, sibling]);
+    const handlePageChange = async (p) => {
+        if (!onChange || loading)
+            return;
+        setLoading(true);
+        return new Promise(async (resolve) => {
+            if (p === undefined)
+                return;
+            await onChange(p);
+            setPage(p);
+            setLoading(false);
+            resolve();
+        });
+    };
+    useEffect(() => setPage(defaultPage), [defaultPage]);
+    if (totalPage <= page && page === 1)
+        return jsx(Fragment, {});
+    return (jsxs("div", { className: classNames("i-pagination", className), ...restProps, children: [prev && (jsx(Page, { page: page - 1 || 1, disabled: page === 1, onChange: handlePageChange, children: prev })), start > 1 && (jsx(Page, { page: 1, onChange: handlePageChange, children: renderPage(1) })), start > 2 && renderEllipsis(), loop.map((p) => {
+                return (jsx(Page, { page: p, active: p === page, onChange: handlePageChange, children: renderPage(p) }, p));
+            }), end < totalPage - 1 && renderEllipsis(), end < totalPage && (jsx(Page, { page: totalPage, onChange: handlePageChange, children: renderPage(totalPage) })), next && (jsx(Page, { page: page + 1, disabled: page === totalPage, onChange: handlePageChange, children: next }))] }));
 };
-//#endregion
-export { Pagination as default };
 
-//# sourceMappingURL=pagination.js.map
+export { Pagination as default };
+//# sourceMappingURL=pagination.js.map

package/lib/es/components/pagination/pagination.js.map

@@ -1 +1 @@
-{"version":3,"file":"pagination.js","names":[],"sources":["../../../../packages/components/pagination/pagination.tsx"],"sourcesContent":["import {\n\tKeyboardArrowLeftRound,\n\tKeyboardArrowRightRound,\n\tMoreHorizRound,\n} from \"@ricons/material\";\nimport classNames from \"classnames\";\nimport { useEffect, useMemo, useState } from \"react\";\nimport Icon from \"../icon\";\nimport \"./index.css\";\nimport Page from \"./page\";\nimport { IPagination } from \"./type\";\n\nconst Pagination = (props: IPagination) => {\n\tconst {\n\t\tpage: defaultPage = 1,\n\t\tsize = 10,\n\t\ttotal = 0,\n\t\tsibling = 2,\n\t\tprev = <Icon icon={<KeyboardArrowLeftRound />} />,\n\t\tnext = <Icon icon={<KeyboardArrowRightRound />} />,\n\t\tsimple,\n\t\tjumper,\n\t\tclassName,\n\t\trenderEllipsis = () => (\n\t\t\t<Icon icon={<MoreHorizRound />} className='color-7' />\n\t\t),\n\t\trenderPage = (i) => i,\n\t\tonChange,\n\t\t...restProps\n\t} = props;\n\n\tconst [page, setPage] = useState(defaultPage);\n\tconst [loading, setLoading] = useState(false);\n\n\tconst totalPage = useMemo(() => Math.ceil(total / size), [size, total]);\n\n\tconst [start, end, loop] = useMemo(() => {\n\t\tconst start = Math.max(1, page - sibling);\n\t\tconst end = Math.min(totalPage, page + sibling);\n\n\t\treturn [\n\t\t\tstart,\n\t\t\tend,\n\t\t\tArray.from({ length: end - start + 1 }).map((n, i) => start + i),\n\t\t];\n\t}, [page, totalPage, sibling]);\n\n\tconst handlePageChange = async (p?: number) => {\n\t\tif (!onChange || loading) return;\n\t\tsetLoading(true);\n\n\t\treturn new Promise<void>(async (resolve) => {\n\t\t\tif (p === undefined) return;\n\t\t\tawait onChange(p);\n\t\t\tsetPage(p);\n\t\t\tsetLoading(false);\n\t\t\tresolve();\n\t\t});\n\t};\n\n\tuseEffect(() => setPage(defaultPage), [defaultPage]);\n\n\tif (totalPage <= page && page === 1) return <></>;\n\n\treturn (\n\t\t<div className={classNames(\"i-pagination\", className)} {...restProps}>\n\t\t\t{prev && (\n\t\t\t\t<Page\n\t\t\t\t\tpage={page - 1 || 1}\n\t\t\t\t\tdisabled={page === 1}\n\t\t\t\t\tonChange={handlePageChange}\n\t\t\t\t>\n\t\t\t\t\t{prev}\n\t\t\t\t</Page>\n\t\t\t)}\n\n\t\t\t{start > 1 && (\n\t\t\t\t<Page page={1} onChange={handlePageChange}>\n\t\t\t\t\t{renderPage(1)}\n\t\t\t\t</Page>\n\t\t\t)}\n\n\t\t\t{start > 2 && renderEllipsis()}\n\n\t\t\t{loop.map((p) => {\n\t\t\t\treturn (\n\t\t\t\t\t<Page\n\t\t\t\t\t\tkey={p}\n\t\t\t\t\t\tpage={p}\n\t\t\t\t\t\tactive={p === page}\n\t\t\t\t\t\tonChange={handlePageChange}\n\t\t\t\t\t>\n\t\t\t\t\t\t{renderPage(p)}\n\t\t\t\t\t</Page>\n\t\t\t\t);\n\t\t\t})}\n\n\t\t\t{end < totalPage - 1 && renderEllipsis()}\n\n\t\t\t{end < totalPage && (\n\t\t\t\t<Page page={totalPage} onChange={handlePageChange}>\n\t\t\t\t\t{renderPage(totalPage)}\n\t\t\t\t</Page>\n\t\t\t)}\n\n\t\t\t{next && (\n\t\t\t\t<Page\n\t\t\t\t\tpage={page + 1}\n\t\t\t\t\tdisabled={page === totalPage}\n\t\t\t\t\tonChange={handlePageChange}\n\t\t\t\t>\n\t\t\t\t\t{next}\n\t\t\t\t</Page>\n\t\t\t)}\n\t\t</div>\n\t);\n};\n\nexport default Pagination;\n"],"mappings":";;;;;;;;CAYA,MAAM,EACL,MAAM,cAAA,GACL,OAAM,IACN,QAAO,GACP,UAAS,GACT,OAAO,oBAAC,cAAD,EAAI,MAAA,oBAAA,wBAAA,EAAA,CAAA,EAAA,CAAA,EACX,OAAO,oBAAC,cAAD,EAAM,MAAM,oBAAC,yBAAD,EAA2B,CAAA,EAAG,CAAA,EACjD,QACA,QACA,WACA,uBACA,oBAAA,cAAA;EAAA,MAAA,oBAAc,gBAAd,EAAuB,CAAA;EAAA,WAAA;EAAA,CAAA,EAEvB,cAAC,MAAA,GACD,UACA,GAAA,cACG;;CAGJ,MAAM,CAAC,SAAM,cAAW,SAAS,MAAY;;;EAK7C,MAAO,QAAO,KAAK,IAAK,GAAG,OAAO,QAAO;EACxC,MAAM,MAAM,KAAE,IAAK,WAAa,OAAC,QAAQ;;GAGzC;GACC;GACA,MAAG,KAAA,EAAA,QAAA,MAAA,QAAA,GAAA,CAAA,CAAA,KAAA,GAAA,MAAA,QAAA,EAAA;GACH;IACA;EAAA;EAAA;EAAA;EAAA,CAAA;;AAGF,MAAK,CAAC,YAAA,QAAmB;AACxB,aAAK,KAAW;;AAGhB,OAAA,MAAW,KAAA,EAAQ;AAClB,SAAM,SAAI,EAAA;AACV,WAAM,EAAA;AACN,cAAU,MAAA;AACV,YAAA;IACA;;;;QAQF,qBAAA,OAAA;EAAM,WAAC,WAAA,gBAAA,UAAA;EAAA,GAAA;YAAP;GACE,QACC,oBAAA,MAAA;IACC,MAAA,OAAA,KAAA;IACA,UAAU,SAAS;IACnB,UAAU;cAEX;IACM,CAAA;gBAIN,oBAAA,MAAA;IAAM,MAAM;IAAC,UAAA;cACZ,WAAY,EAAE;IACb,CAAA;;;AAMF,WACA,oBAAA,MAAA;KAEE,MAAM;KACN,QAAO,MAAA;KACP,UAAU;eAEX,WAAA,EAAA;KACE,EAND,EAMC;KAEF;;sBAKD,oBAAA,MAAA;IAAM,MAAA;IAAa,UAAA;cAClB,WAAW,UAAW;IACrB,CAAA;WAIF,oBAAA,MAAA;IACC,MAAA,OAAA;IACA,UAAU,SAAI;IACd,UAAU;cAEX;IACM,CAAA;GAEN"}
+{"version":3,"file":"pagination.js","sources":["../../../../packages/components/pagination/pagination.tsx"],"sourcesContent":["import {\n\tKeyboardArrowLeftRound,\n\tKeyboardArrowRightRound,\n\tMoreHorizRound,\n} from \"@ricons/material\";\nimport classNames from \"classnames\";\nimport { useEffect, useMemo, useState } from \"react\";\nimport Icon from \"../icon\";\nimport \"./index.css\";\nimport Page from \"./page\";\nimport { IPagination } from \"./type\";\n\nconst Pagination = (props: IPagination) => {\n\tconst {\n\t\tpage: defaultPage = 1,\n\t\tsize = 10,\n\t\ttotal = 0,\n\t\tsibling = 2,\n\t\tprev = <Icon icon={<KeyboardArrowLeftRound />} />,\n\t\tnext = <Icon icon={<KeyboardArrowRightRound />} />,\n\t\tsimple,\n\t\tjumper,\n\t\tclassName,\n\t\trenderEllipsis = () => (\n\t\t\t<Icon icon={<MoreHorizRound />} className='color-7' />\n\t\t),\n\t\trenderPage = (i) => i,\n\t\tonChange,\n\t\t...restProps\n\t} = props;\n\n\tconst [page, setPage] = useState(defaultPage);\n\tconst [loading, setLoading] = useState(false);\n\n\tconst totalPage = useMemo(() => Math.ceil(total / size), [size, total]);\n\n\tconst [start, end, loop] = useMemo(() => {\n\t\tconst start = Math.max(1, page - sibling);\n\t\tconst end = Math.min(totalPage, page + sibling);\n\n\t\treturn [\n\t\t\tstart,\n\t\t\tend,\n\t\t\tArray.from({ length: end - start + 1 }).map((n, i) => start + i),\n\t\t];\n\t}, [page, totalPage, sibling]);\n\n\tconst handlePageChange = async (p?: number) => {\n\t\tif (!onChange || loading) return;\n\t\tsetLoading(true);\n\n\t\treturn new Promise<void>(async (resolve) => {\n\t\t\tif (p === undefined) return;\n\t\t\tawait onChange(p);\n\t\t\tsetPage(p);\n\t\t\tsetLoading(false);\n\t\t\tresolve();\n\t\t});\n\t};\n\n\tuseEffect(() => setPage(defaultPage), [defaultPage]);\n\n\tif (totalPage <= page && page === 1) return <></>;\n\n\treturn (\n\t\t<div className={classNames(\"i-pagination\", className)} {...restProps}>\n\t\t\t{prev && (\n\t\t\t\t<Page\n\t\t\t\t\tpage={page - 1 || 1}\n\t\t\t\t\tdisabled={page === 1}\n\t\t\t\t\tonChange={handlePageChange}\n\t\t\t\t>\n\t\t\t\t\t{prev}\n\t\t\t\t</Page>\n\t\t\t)}\n\n\t\t\t{start > 1 && (\n\t\t\t\t<Page page={1} onChange={handlePageChange}>\n\t\t\t\t\t{renderPage(1)}\n\t\t\t\t</Page>\n\t\t\t)}\n\n\t\t\t{start > 2 && renderEllipsis()}\n\n\t\t\t{loop.map((p) => {\n\t\t\t\treturn (\n\t\t\t\t\t<Page\n\t\t\t\t\t\tkey={p}\n\t\t\t\t\t\tpage={p}\n\t\t\t\t\t\tactive={p === page}\n\t\t\t\t\t\tonChange={handlePageChange}\n\t\t\t\t\t>\n\t\t\t\t\t\t{renderPage(p)}\n\t\t\t\t\t</Page>\n\t\t\t\t);\n\t\t\t})}\n\n\t\t\t{end < totalPage - 1 && renderEllipsis()}\n\n\t\t\t{end < totalPage && (\n\t\t\t\t<Page page={totalPage} onChange={handlePageChange}>\n\t\t\t\t\t{renderPage(totalPage)}\n\t\t\t\t</Page>\n\t\t\t)}\n\n\t\t\t{next && (\n\t\t\t\t<Page\n\t\t\t\t\tpage={page + 1}\n\t\t\t\t\tdisabled={page === totalPage}\n\t\t\t\t\tonChange={handlePageChange}\n\t\t\t\t>\n\t\t\t\t\t{next}\n\t\t\t\t</Page>\n\t\t\t)}\n\t\t</div>\n\t);\n};\n\nexport default Pagination;\n"],"names":["_jsx","_jsxs"],"mappings":"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"}