@ioca/react 1.3.4 → 1.3.6

package/lib/cjs/components/image/image.js

@@ -0,0 +1,76 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var jsxRuntime = require('react/jsx-runtime');
+var material = require('@ricons/material');
+var ahooks = require('ahooks');
+var classNames = require('classnames');
+var react = require('react');
+var hooks = require('../../js/hooks.js');
+var index = require('../../js/usePreview/index.js');
+var icon = require('../icon/icon.js');
+var loading = require('../loading/loading.js');
+
+const Image = (props) => {
+    const { src, round, size, initSize, lazyload, fallback = (jsxRuntime.jsx(icon.default, { icon: jsxRuntime.jsx(material.HideImageTwotone, {}), size: '2em', className: 'color-5' })), fit, style, className, cover, coverClass, usePreview: previewable, onLoad, onError, onClick, ...restProps } = props;
+    const state = ahooks.useReactive({
+        status: "loading",
+    });
+    const ref = react.useRef(null);
+    const wh = fit ? "100%" : undefined;
+    const { observe, unobserve } = hooks.useIntersectionObserver();
+    const preview = index.default();
+    const handleError = (err) => {
+        onError?.(err);
+        state.status = "error";
+    };
+    const handleLoad = (e) => {
+        onLoad?.(e);
+        state.status = undefined;
+    };
+    const handleClick = (e) => {
+        onClick?.(e);
+        previewable &&
+            src &&
+            preview({
+                items: [
+                    {
+                        src,
+                        type: "IMAGE",
+                    },
+                ],
+            });
+    };
+    react.useEffect(() => {
+        if (!src)
+            return;
+        if (!ref.current?.complete) {
+            state.status = "loading";
+        }
+        if (!lazyload || !ref.current)
+            return;
+        observe(ref.current, (tar, visible) => {
+            if (!visible)
+                return;
+            tar.setAttribute("src", tar.dataset.src || "");
+            unobserve(tar);
+        });
+        return () => {
+            ref.current && unobserve(ref.current);
+        };
+    }, [src]);
+    restProps[lazyload ? "data-src" : "src"] = src;
+    const iSize = state.status === "loading" ? initSize : undefined;
+    return (jsxRuntime.jsx("div", { style: {
+            width: size ?? iSize,
+            height: size ?? iSize,
+            ...style,
+        }, className: classNames("i-image", className, {
+            rounded: round,
+            [`i-image-${state.status}`]: state.status,
+        }), children: state.status === "error" ? (fallback) : (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [src && (jsxRuntime.jsx("img", { ref: ref, style: { objectFit: fit, width: wh, height: wh }, ...restProps, onLoad: handleLoad, onError: handleError, onClick: handleClick })), src && state.status === "loading" && jsxRuntime.jsx(loading.default, { absolute: true }), cover && (jsxRuntime.jsx("div", { className: classNames("i-image-cover", coverClass), onClick: handleClick, children: cover }))] })) }));
+};
+
+exports.default = Image;
+//# sourceMappingURL=image.js.map

package/lib/cjs/components/image/image.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"image.js","sources":["../../../../packages/components/image/image.tsx"],"sourcesContent":["import { HideImageTwotone } from \"@ricons/material\";\nimport { useReactive } from \"ahooks\";\nimport classNames from \"classnames\";\nimport { useEffect, useRef } from \"react\";\nimport { useIntersectionObserver } from \"../../js/hooks\";\nimport usePreview from \"../../js/usePreview\";\nimport Icon from \"../icon\";\nimport Loading from \"../loading\";\nimport \"./index.css\";\nimport type { CompositionImage, IImage } from \"./type\";\n\nconst Image = (props: IImage) => {\n\tconst {\n\t\tsrc,\n\t\tround,\n\t\tsize,\n\t\tinitSize,\n\t\tlazyload,\n\t\tfallback = (\n\t\t\t<Icon icon={<HideImageTwotone />} size='2em' className='color-5' />\n\t\t),\n\t\tfit,\n\t\tstyle,\n\t\tclassName,\n\t\tcover,\n\t\tcoverClass,\n\t\tusePreview: previewable,\n\t\tonLoad,\n\t\tonError,\n\t\tonClick,\n\t\t...restProps\n\t} = props;\n\n\tconst state = useReactive<{ status?: string }>({\n\t\tstatus: \"loading\",\n\t});\n\tconst ref = useRef<HTMLImageElement>(null);\n\tconst wh = fit ? \"100%\" : undefined;\n\n\tconst { observe, unobserve } = useIntersectionObserver();\n\tconst preview = usePreview();\n\n\tconst handleError = (err) => {\n\t\tonError?.(err);\n\t\tstate.status = \"error\";\n\t};\n\n\tconst handleLoad = (e) => {\n\t\tonLoad?.(e);\n\t\tstate.status = undefined;\n\t};\n\n\tconst handleClick = (e) => {\n\t\tonClick?.(e);\n\n\t\tpreviewable &&\n\t\t\tsrc &&\n\t\t\tpreview({\n\t\t\t\titems: [\n\t\t\t\t\t{\n\t\t\t\t\t\tsrc,\n\t\t\t\t\t\ttype: \"IMAGE\",\n\t\t\t\t\t},\n\t\t\t\t],\n\t\t\t});\n\t};\n\n\tuseEffect(() => {\n\t\tif (!src) return;\n\n\t\tif (!ref.current?.complete) {\n\t\t\tstate.status = \"loading\";\n\t\t}\n\n\t\tif (!lazyload || !ref.current) return;\n\n\t\tobserve(ref.current, (tar: HTMLElement, visible: boolean) => {\n\t\t\tif (!visible) return;\n\n\t\t\ttar.setAttribute(\"src\", tar.dataset.src || \"\");\n\t\t\tunobserve(tar);\n\t\t});\n\n\t\treturn () => {\n\t\t\tref.current && unobserve(ref.current);\n\t\t};\n\t}, [src]);\n\n\trestProps[lazyload ? \"data-src\" : \"src\"] = src;\n\tconst iSize = state.status === \"loading\" ? initSize : undefined;\n\n\treturn (\n\t\t<div\n\t\t\tstyle={{\n\t\t\t\twidth: size ?? iSize,\n\t\t\t\theight: size ?? iSize,\n\t\t\t\t...style,\n\t\t\t}}\n\t\t\tclassName={classNames(\"i-image\", className, {\n\t\t\t\trounded: round,\n\t\t\t\t[`i-image-${state.status}`]: state.status,\n\t\t\t})}\n\t\t>\n\t\t\t{state.status === \"error\" ? (\n\t\t\t\tfallback\n\t\t\t) : (\n\t\t\t\t<>\n\t\t\t\t\t{src && (\n\t\t\t\t\t\t<img\n\t\t\t\t\t\t\tref={ref}\n\t\t\t\t\t\t\tstyle={{ objectFit: fit, width: wh, height: wh }}\n\t\t\t\t\t\t\t{...restProps}\n\t\t\t\t\t\t\tonLoad={handleLoad}\n\t\t\t\t\t\t\tonError={handleError}\n\t\t\t\t\t\t\tonClick={handleClick}\n\t\t\t\t\t\t/>\n\t\t\t\t\t)}\n\n\t\t\t\t\t{src && state.status === \"loading\" && <Loading absolute />}\n\n\t\t\t\t\t{cover && (\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tclassName={classNames(\"i-image-cover\", coverClass)}\n\t\t\t\t\t\t\tonClick={handleClick}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{cover}\n\t\t\t\t\t\t</div>\n\t\t\t\t\t)}\n\t\t\t\t</>\n\t\t\t)}\n\t\t</div>\n\t);\n};\n\nexport default Image as CompositionImage;\n"],"names":["_jsx","Icon","HideImageTwotone","useReactive","useRef","useIntersectionObserver","usePreview","useEffect","_jsxs","Loading"],"mappings":";;;;;;;;;;;;;;AAWA,MAAM,KAAK,GAAG,CAAC,KAAa,KAAI;IAC/B,MAAM,EACL,GAAG,EACH,KAAK,EACL,IAAI,EACJ,QAAQ,EACR,QAAQ,EACR,QAAQ,IACPA,cAAA,CAACC,YAAI,EAAA,EAAC,IAAI,EAAED,cAAC,CAAAE,yBAAgB,EAAG,EAAA,CAAA,EAAE,IAAI,EAAC,KAAK,EAAC,SAAS,EAAC,SAAS,EAAG,CAAA,CACnE,EACD,GAAG,EACH,KAAK,EACL,SAAS,EACT,KAAK,EACL,UAAU,EACV,UAAU,EAAE,WAAW,EACvB,MAAM,EACN,OAAO,EACP,OAAO,EACP,GAAG,SAAS,EACZ,GAAG,KAAK;IAET,MAAM,KAAK,GAAGC,kBAAW,CAAsB;AAC9C,QAAA,MAAM,EAAE,SAAS;AACjB,KAAA,CAAC;AACF,IAAA,MAAM,GAAG,GAAGC,YAAM,CAAmB,IAAI,CAAC;IAC1C,MAAM,EAAE,GAAG,GAAG,GAAG,MAAM,GAAG,SAAS;IAEnC,MAAM,EAAE,OAAO,EAAE,SAAS,EAAE,GAAGC,6BAAuB,EAAE;AACxD,IAAA,MAAM,OAAO,GAAGC,aAAU,EAAE;AAE5B,IAAA,MAAM,WAAW,GAAG,CAAC,GAAG,KAAI;AAC3B,QAAA,OAAO,GAAG,GAAG,CAAC;AACd,QAAA,KAAK,CAAC,MAAM,GAAG,OAAO;AACvB,KAAC;AAED,IAAA,MAAM,UAAU,GAAG,CAAC,CAAC,KAAI;AACxB,QAAA,MAAM,GAAG,CAAC,CAAC;AACX,QAAA,KAAK,CAAC,MAAM,GAAG,SAAS;AACzB,KAAC;AAED,IAAA,MAAM,WAAW,GAAG,CAAC,CAAC,KAAI;AACzB,QAAA,OAAO,GAAG,CAAC,CAAC;QAEZ,WAAW;YACV,GAAG;AACH,YAAA,OAAO,CAAC;AACP,gBAAA,KAAK,EAAE;AACN,oBAAA;wBACC,GAAG;AACH,wBAAA,IAAI,EAAE,OAAO;AACb,qBAAA;AACD,iBAAA;AACD,aAAA,CAAC;AACJ,KAAC;IAEDC,eAAS,CAAC,MAAK;AACd,QAAA,IAAI,CAAC,GAAG;YAAE;AAEV,QAAA,IAAI,CAAC,GAAG,CAAC,OAAO,EAAE,QAAQ,EAAE;AAC3B,YAAA,KAAK,CAAC,MAAM,GAAG,SAAS;;AAGzB,QAAA,IAAI,CAAC,QAAQ,IAAI,CAAC,GAAG,CAAC,OAAO;YAAE;QAE/B,OAAO,CAAC,GAAG,CAAC,OAAO,EAAE,CAAC,GAAgB,EAAE,OAAgB,KAAI;AAC3D,YAAA,IAAI,CAAC,OAAO;gBAAE;AAEd,YAAA,GAAG,CAAC,YAAY,CAAC,KAAK,EAAE,GAAG,CAAC,OAAO,CAAC,GAAG,IAAI,EAAE,CAAC;YAC9C,SAAS,CAAC,GAAG,CAAC;AACf,SAAC,CAAC;AAEF,QAAA,OAAO,MAAK;YACX,GAAG,CAAC,OAAO,IAAI,SAAS,CAAC,GAAG,CAAC,OAAO,CAAC;AACtC,SAAC;AACF,KAAC,EAAE,CAAC,GAAG,CAAC,CAAC;AAET,IAAA,SAAS,CAAC,QAAQ,GAAG,UAAU,GAAG,KAAK,CAAC,GAAG,GAAG;AAC9C,IAAA,MAAM,KAAK,GAAG,KAAK,CAAC,MAAM,KAAK,SAAS,GAAG,QAAQ,GAAG,SAAS;IAE/D,QACCP,cACC,CAAA,KAAA,EAAA,EAAA,KAAK,EAAE;YACN,KAAK,EAAE,IAAI,IAAI,KAAK;YACpB,MAAM,EAAE,IAAI,IAAI,KAAK;AACrB,YAAA,GAAG,KAAK;AACR,SAAA,EACD,SAAS,EAAE,UAAU,CAAC,SAAS,EAAE,SAAS,EAAE;AAC3C,YAAA,OAAO,EAAE,KAAK;YACd,CAAC,CAAA,QAAA,EAAW,KAAK,CAAC,MAAM,EAAE,GAAG,KAAK,CAAC,MAAM;SACzC,CAAC,EAAA,QAAA,EAED,KAAK,CAAC,MAAM,KAAK,OAAO,IACxB,QAAQ,KAERQ,kDACE,GAAG,KACHR,cACC,CAAA,KAAA,EAAA,EAAA,GAAG,EAAE,GAAG,EACR,KAAK,EAAE,EAAE,SAAS,EAAE,GAAG,EAAE,KAAK,EAAE,EAAE,EAAE,MAAM,EAAE,EAAE,EAAE,KAC5C,SAAS,EACb,MAAM,EAAE,UAAU,EAClB,OAAO,EAAE,WAAW,EACpB,OAAO,EAAE,WAAW,EACnB,CAAA,CACF,EAEA,GAAG,IAAI,KAAK,CAAC,MAAM,KAAK,SAAS,IAAIA,eAACS,eAAO,EAAA,EAAC,QAAQ,EAAA,IAAA,EAAA,CAAG,EAEzD,KAAK,KACLT,cAAA,CAAA,KAAA,EAAA,EACC,SAAS,EAAE,UAAU,CAAC,eAAe,EAAE,UAAU,CAAC,EAClD,OAAO,EAAE,WAAW,YAEnB,KAAK,EAAA,CACD,CACN,CACC,EAAA,CAAA,CACH,EACI,CAAA;AAER;;;;"}

package/lib/cjs/components/image/index.js

@@ -0,0 +1,11 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var image = require('./image.js');
+var list = require('./list.js');
+
+image.default.List = list.default;
+
+exports.default = image.default;
+//# sourceMappingURL=index.js.map

package/lib/cjs/components/image/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../../../../packages/components/image/index.tsx"],"sourcesContent":["import Image from \"./image\";\nimport List from \"./list\";\n\nImage.List = List;\n\nexport default Image;\n"],"names":["Image","List"],"mappings":";;;;;;;AAGAA,aAAK,CAAC,IAAI,GAAGC,YAAI;;;;"}

package/lib/cjs/components/image/list.js

@@ -0,0 +1,47 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var jsxRuntime = require('react/jsx-runtime');
+var react = require('react');
+var index = require('../../js/usePreview/index.js');
+var utils = require('../../js/utils.js');
+var flex = require('../flex/flex.js');
+var image = require('./image.js');
+
+function List(props) {
+    const { items = [], gap = 8, columns, wrap, direction, usePreview: previewable, onClick, ...restProps } = props;
+    const preview = index.default();
+    const files = react.useMemo(() => {
+        return items.map((item) => {
+            const o = {
+                src: "",
+            };
+            if (typeof item === "string") {
+                o.src = item;
+            }
+            else {
+                Object.assign(o, item);
+            }
+            o.suffix = utils.getSuffixByUrl(o.src) || "";
+            o.type = utils.getFileType(o.suffix, item["type"]);
+            return o;
+        });
+    }, [items]);
+    const handleClick = (e, i) => {
+        onClick?.(e);
+        previewable &&
+            preview({
+                items: files,
+                initial: i,
+            });
+    };
+    if (!files.length)
+        return "";
+    return (jsxRuntime.jsx(flex.default, { className: 'i-image-list', gap: gap, columns: columns, wrap: wrap, direction: direction, children: files.map((img, i) => {
+            return (jsxRuntime.jsx(image.default, { src: img.src, size: 60, usePreview: false, onClick: (e) => handleClick(e, i), ...restProps }, i));
+        }) }));
+}
+
+exports.default = List;
+//# sourceMappingURL=list.js.map

package/lib/cjs/components/image/list.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"list.js","sources":["../../../../packages/components/image/list.tsx"],"sourcesContent":["import { useMemo } from \"react\";\nimport usePreview from \"../../js/usePreview\";\nimport { TPreviewItem } from \"../../js/usePreview/type\";\nimport { getFileType, getSuffixByUrl } from \"../../js/utils\";\nimport Flex from \"../flex\";\nimport Image from \"./image\";\nimport { IImageList } from \"./type\";\n\nexport default function List(props: IImageList) {\n\tconst {\n\t\titems = [],\n\t\tgap = 8,\n\t\tcolumns,\n\t\twrap,\n\t\tdirection,\n\t\tusePreview: previewable,\n\t\tonClick,\n\t\t...restProps\n\t} = props;\n\tconst preview = usePreview();\n\n\tconst files = useMemo(() => {\n\t\treturn items.map((item) => {\n\t\t\tconst o: TPreviewItem = {\n\t\t\t\tsrc: \"\",\n\t\t\t};\n\t\t\tif (typeof item === \"string\") {\n\t\t\t\to.src = item;\n\t\t\t} else {\n\t\t\t\tObject.assign(o, item);\n\t\t\t}\n\n\t\t\to.suffix = getSuffixByUrl(o.src) || \"\";\n\t\t\to.type = getFileType(o.suffix, item[\"type\"]);\n\n\t\t\treturn o;\n\t\t});\n\t}, [items]);\n\n\tconst handleClick = (e, i) => {\n\t\tonClick?.(e);\n\n\t\tpreviewable &&\n\t\t\tpreview({\n\t\t\t\titems: files,\n\t\t\t\tinitial: i,\n\t\t\t});\n\t};\n\n\tif (!files.length) return \"\";\n\n\treturn (\n\t\t<Flex\n\t\t\tclassName='i-image-list'\n\t\t\tgap={gap}\n\t\t\tcolumns={columns}\n\t\t\twrap={wrap}\n\t\t\tdirection={direction}\n\t\t>\n\t\t\t{files.map((img, i) => {\n\t\t\t\treturn (\n\t\t\t\t\t<Image\n\t\t\t\t\t\tkey={i}\n\t\t\t\t\t\tsrc={img.src}\n\t\t\t\t\t\tsize={60}\n\t\t\t\t\t\tusePreview={false}\n\t\t\t\t\t\tonClick={(e) => handleClick(e, i)}\n\t\t\t\t\t\t{...restProps}\n\t\t\t\t\t/>\n\t\t\t\t);\n\t\t\t})}\n\t\t</Flex>\n\t);\n}\n"],"names":["usePreview","useMemo","getSuffixByUrl","getFileType","_jsx","Flex","Image"],"mappings":";;;;;;;;;;;AAQwB,SAAA,IAAI,CAAC,KAAiB,EAAA;IAC7C,MAAM,EACL,KAAK,GAAG,EAAE,EACV,GAAG,GAAG,CAAC,EACP,OAAO,EACP,IAAI,EACJ,SAAS,EACT,UAAU,EAAE,WAAW,EACvB,OAAO,EACP,GAAG,SAAS,EACZ,GAAG,KAAK;AACT,IAAA,MAAM,OAAO,GAAGA,aAAU,EAAE;AAE5B,IAAA,MAAM,KAAK,GAAGC,aAAO,CAAC,MAAK;AAC1B,QAAA,OAAO,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,KAAI;AACzB,YAAA,MAAM,CAAC,GAAiB;AACvB,gBAAA,GAAG,EAAE,EAAE;aACP;AACD,YAAA,IAAI,OAAO,IAAI,KAAK,QAAQ,EAAE;AAC7B,gBAAA,CAAC,CAAC,GAAG,GAAG,IAAI;;iBACN;AACN,gBAAA,MAAM,CAAC,MAAM,CAAC,CAAC,EAAE,IAAI,CAAC;;YAGvB,CAAC,CAAC,MAAM,GAAGC,oBAAc,CAAC,CAAC,CAAC,GAAG,CAAC,IAAI,EAAE;AACtC,YAAA,CAAC,CAAC,IAAI,GAAGC,iBAAW,CAAC,CAAC,CAAC,MAAM,EAAE,IAAI,CAAC,MAAM,CAAC,CAAC;AAE5C,YAAA,OAAO,CAAC;AACT,SAAC,CAAC;AACH,KAAC,EAAE,CAAC,KAAK,CAAC,CAAC;AAEX,IAAA,MAAM,WAAW,GAAG,CAAC,CAAC,EAAE,CAAC,KAAI;AAC5B,QAAA,OAAO,GAAG,CAAC,CAAC;QAEZ,WAAW;AACV,YAAA,OAAO,CAAC;AACP,gBAAA,KAAK,EAAE,KAAK;AACZ,gBAAA,OAAO,EAAE,CAAC;AACV,aAAA,CAAC;AACJ,KAAC;IAED,IAAI,CAAC,KAAK,CAAC,MAAM;AAAE,QAAA,OAAO,EAAE;AAE5B,IAAA,QACCC,cAAA,CAACC,YAAI,EAAA,EACJ,SAAS,EAAC,cAAc,EACxB,GAAG,EAAE,GAAG,EACR,OAAO,EAAE,OAAO,EAChB,IAAI,EAAE,IAAI,EACV,SAAS,EAAE,SAAS,EAEnB,QAAA,EAAA,KAAK,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,CAAC,KAAI;AACrB,YAAA,QACCD,cAAC,CAAAE,aAAK,EAEL,EAAA,GAAG,EAAE,GAAG,CAAC,GAAG,EACZ,IAAI,EAAE,EAAE,EACR,UAAU,EAAE,KAAK,EACjB,OAAO,EAAE,CAAC,CAAC,KAAK,WAAW,CAAC,CAAC,EAAE,CAAC,CAAC,EAC7B,GAAA,SAAS,IALR,CAAC,CAML;SAEH,CAAC,EACI,CAAA;AAET;;;;"}

package/lib/cjs/components/input/container.js

@@ -0,0 +1,18 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var jsxRuntime = require('react/jsx-runtime');
+var classNames = require('classnames');
+
+function InputContainer(props) {
+    const { as: As = "label", label, className, labelInline, style, children, status, tip, required, } = props;
+    return (jsxRuntime.jsxs(As, { className: classNames("i-input-label", className, {
+            "i-input-inline": labelInline,
+        }), style: style, children: [label && (jsxRuntime.jsxs("span", { className: 'i-input-label-text', children: [required && jsxRuntime.jsx("span", { className: 'error', children: "*" }), label] })), children, tip && (jsxRuntime.jsx("span", { className: classNames("i-input-message", {
+                    [`i-input-${status}`]: status !== "normal",
+                }), children: tip }))] }));
+}
+
+exports.default = InputContainer;
+//# sourceMappingURL=container.js.map

package/lib/cjs/components/input/container.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"container.js","sources":["../../../../packages/components/input/container.tsx"],"sourcesContent":["import classNames from \"classnames\";\nimport { IInputContainer } from \"./type\";\n\nexport default function InputContainer(props: IInputContainer) {\n\tconst {\n\t\tas: As = \"label\",\n\t\tlabel,\n\t\tclassName,\n\t\tlabelInline,\n\t\tstyle,\n\t\tchildren,\n\t\tstatus,\n\t\ttip,\n\t\trequired,\n\t} = props;\n\n\treturn (\n\t\t<As\n\t\t\tclassName={classNames(\"i-input-label\", className, {\n\t\t\t\t\"i-input-inline\": labelInline,\n\t\t\t})}\n\t\t\tstyle={style}\n\t\t>\n\t\t\t{label && (\n\t\t\t\t<span className='i-input-label-text'>\n\t\t\t\t\t{required && <span className='error'>*</span>}\n\t\t\t\t\t{label}\n\t\t\t\t</span>\n\t\t\t)}\n\n\t\t\t{children}\n\n\t\t\t{tip && (\n\t\t\t\t<span\n\t\t\t\t\tclassName={classNames(\"i-input-message\", {\n\t\t\t\t\t\t[`i-input-${status}`]: status !== \"normal\",\n\t\t\t\t\t})}\n\t\t\t\t>\n\t\t\t\t\t{tip}\n\t\t\t\t</span>\n\t\t\t)}\n\t\t</As>\n\t);\n}\n"],"names":["_jsxs","_jsx"],"mappings":";;;;;;;AAGwB,SAAA,cAAc,CAAC,KAAsB,EAAA;IAC5D,MAAM,EACL,EAAE,EAAE,EAAE,GAAG,OAAO,EAChB,KAAK,EACL,SAAS,EACT,WAAW,EACX,KAAK,EACL,QAAQ,EACR,MAAM,EACN,GAAG,EACH,QAAQ,GACR,GAAG,KAAK;IAET,QACCA,eAAC,CAAA,EAAE,EACF,EAAA,SAAS,EAAE,UAAU,CAAC,eAAe,EAAE,SAAS,EAAE;AACjD,YAAA,gBAAgB,EAAE,WAAW;AAC7B,SAAA,CAAC,EACF,KAAK,EAAE,KAAK,EAAA,QAAA,EAAA,CAEX,KAAK,KACLA,eAAM,CAAA,MAAA,EAAA,EAAA,SAAS,EAAC,oBAAoB,EAAA,QAAA,EAAA,CAClC,QAAQ,IAAIC,yBAAM,SAAS,EAAC,OAAO,EAAA,QAAA,EAAA,GAAA,EAAA,CAAS,EAC5C,KAAK,CAAA,EAAA,CACA,CACP,EAEA,QAAQ,EAER,GAAG,KACHA,yBACC,SAAS,EAAE,UAAU,CAAC,iBAAiB,EAAE;AACxC,oBAAA,CAAC,WAAW,MAAM,CAAA,CAAE,GAAG,MAAM,KAAK,QAAQ;AAC1C,iBAAA,CAAC,YAED,GAAG,EAAA,CACE,CACP,CAAA,EAAA,CACG;AAEP;;;;"}

package/lib/cjs/components/input/index.js

@@ -0,0 +1,15 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var input = require('./input.js');
+var number = require('./number.js');
+var range = require('./range.js');
+var textarea = require('./textarea.js');
+
+input.default.Textarea = textarea.default;
+input.default.Number = number.default;
+input.default.Range = range.default;
+
+exports.default = input.default;
+//# sourceMappingURL=index.js.map

package/lib/cjs/components/input/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../../../../packages/components/input/index.tsx"],"sourcesContent":["import Input from \"./input\";\nimport Number from \"./number\";\nimport Range from \"./range\";\nimport Textarea from \"./textarea\";\n\nInput.Textarea = Textarea;\nInput.Number = Number;\nInput.Range = Range;\n\nexport default Input;\n"],"names":["Input","Textarea","Number","Range"],"mappings":";;;;;;;;;AAKAA,aAAK,CAAC,QAAQ,GAAGC,gBAAQ;AACzBD,aAAK,CAAC,MAAM,GAAGE,cAAM;AACrBF,aAAK,CAAC,KAAK,GAAGG,aAAK;;;;"}

package/lib/cjs/components/input/input.js

@@ -0,0 +1,67 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var jsxRuntime = require('react/jsx-runtime');
+var material = require('@ricons/material');
+var ahooks = require('ahooks');
+var classNames = require('classnames');
+var react = require('react');
+var helpericon = require('../utils/helpericon/helpericon.js');
+var container = require('./container.js');
+
+const Input = ((props) => {
+    const { ref, type = "text", label, name, value = props.initValue ?? "", initValue = "", prepend, append, labelInline, className, status = "normal", message, tip, clear, hideVisible, border, required, onChange, onEnter, style, ...restProps } = props;
+    const state = ahooks.useReactive({
+        value,
+        type,
+        visible: false,
+    });
+    const handleChange = (e) => {
+        const v = e.target.value;
+        state.value = v;
+        onChange?.(v, e);
+    };
+    const handleKeydown = (e) => {
+        e.code === "Enter" && onEnter?.(e);
+    };
+    const handleHelperClick = () => {
+        if (type === "password" && !hideVisible) {
+            Object.assign(state, {
+                visible: !state.visible,
+                type: !state.visible ? "text" : "password",
+            });
+            return;
+        }
+        const v = "";
+        onChange?.(v);
+    };
+    const HelperIcon = react.useMemo(() => {
+        if (type === "password") {
+            return state.visible ? jsxRuntime.jsx(material.VisibilityRound, {}) : jsxRuntime.jsx(material.VisibilityOffRound, {});
+        }
+        return undefined;
+    }, [state.visible]);
+    react.useEffect(() => {
+        state.value = value;
+    }, [value]);
+    const inputProps = {
+        ref,
+        type: state.type,
+        name,
+        value: state.value,
+        className: classNames("i-input", `i-input-${type}`),
+        onChange: handleChange,
+        onKeyDown: handleKeydown,
+        ...restProps,
+    };
+    const clearable = clear && state.value;
+    const showHelper = type === "password" && !!state.value;
+    return (jsxRuntime.jsx(container.default, { label: label, labelInline: labelInline, className: className, style: style, tip: message ?? tip, status: status, required: required, children: jsxRuntime.jsxs("div", { className: classNames("i-input-item", {
+                [`i-input-${status}`]: status !== "normal",
+                "i-input-borderless": !border,
+            }), children: [prepend && jsxRuntime.jsx("div", { className: 'i-input-prepend', children: prepend }), jsxRuntime.jsx("input", { ...inputProps }), jsxRuntime.jsx(helpericon.default, { active: !!clearable || showHelper, icon: HelperIcon, onClick: handleHelperClick }), append && jsxRuntime.jsx("div", { className: 'i-input-append', children: append })] }) }));
+});
+
+exports.default = Input;
+//# sourceMappingURL=input.js.map

package/lib/cjs/components/input/input.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"input.js","sources":["../../../../packages/components/input/input.tsx"],"sourcesContent":["import { VisibilityOffRound, VisibilityRound } from \"@ricons/material\";\nimport { useReactive } from \"ahooks\";\nimport classNames from \"classnames\";\nimport { ChangeEvent, useEffect, useMemo } from \"react\";\nimport \"../../css/input.css\";\nimport Helpericon from \"../utils/helpericon\";\nimport InputContainer from \"./container\";\nimport type { CompositionInput, IInput } from \"./type\";\n\nconst Input = ((props: IInput) => {\n\tconst {\n\t\tref,\n\t\ttype = \"text\",\n\t\tlabel,\n\t\tname,\n\t\tvalue = props.initValue ?? \"\",\n\t\tinitValue = \"\",\n\t\tprepend,\n\t\tappend,\n\t\tlabelInline,\n\t\tclassName,\n\t\tstatus = \"normal\",\n\t\tmessage,\n\t\ttip,\n\t\tclear,\n\t\thideVisible,\n\t\tborder,\n\t\trequired,\n\t\tonChange,\n\t\tonEnter,\n\t\tstyle,\n\t\t...restProps\n\t} = props;\n\n\tconst state = useReactive({\n\t\tvalue,\n\t\ttype,\n\t\tvisible: false,\n\t});\n\n\tconst handleChange = (e: ChangeEvent<HTMLInputElement>) => {\n\t\tconst v = e.target.value;\n\n\t\tstate.value = v;\n\t\tonChange?.(v, e);\n\t};\n\n\tconst handleKeydown = (e) => {\n\t\te.code === \"Enter\" && onEnter?.(e);\n\t};\n\n\tconst handleHelperClick = () => {\n\t\tif (type === \"password\" && !hideVisible) {\n\t\t\tObject.assign(state, {\n\t\t\t\tvisible: !state.visible,\n\t\t\t\ttype: !state.visible ? \"text\" : \"password\",\n\t\t\t});\n\t\t\treturn;\n\t\t}\n\n\t\tconst v = \"\";\n\t\tonChange?.(v);\n\t};\n\n\tconst HelperIcon = useMemo(() => {\n\t\tif (type === \"password\") {\n\t\t\treturn state.visible ? <VisibilityRound /> : <VisibilityOffRound />;\n\t\t}\n\n\t\treturn undefined;\n\t}, [state.visible]);\n\n\tuseEffect(() => {\n\t\tstate.value = value;\n\t}, [value]);\n\n\tconst inputProps = {\n\t\tref,\n\t\ttype: state.type,\n\t\tname,\n\t\tvalue: state.value,\n\t\tclassName: classNames(\"i-input\", `i-input-${type}`),\n\t\tonChange: handleChange,\n\t\tonKeyDown: handleKeydown,\n\t\t...restProps,\n\t};\n\n\tconst clearable = clear && state.value;\n\tconst showHelper = type === \"password\" && !!state.value;\n\n\treturn (\n\t\t<InputContainer\n\t\t\tlabel={label}\n\t\t\tlabelInline={labelInline}\n\t\t\tclassName={className}\n\t\t\tstyle={style}\n\t\t\ttip={message ?? tip}\n\t\t\tstatus={status}\n\t\t\trequired={required}\n\t\t>\n\t\t\t<div\n\t\t\t\tclassName={classNames(\"i-input-item\", {\n\t\t\t\t\t[`i-input-${status}`]: status !== \"normal\",\n\t\t\t\t\t\"i-input-borderless\": !border,\n\t\t\t\t})}\n\t\t\t>\n\t\t\t\t{prepend && <div className='i-input-prepend'>{prepend}</div>}\n\n\t\t\t\t<input {...inputProps} />\n\n\t\t\t\t<Helpericon\n\t\t\t\t\tactive={!!clearable || showHelper}\n\t\t\t\t\ticon={HelperIcon}\n\t\t\t\t\tonClick={handleHelperClick}\n\t\t\t\t/>\n\n\t\t\t\t{append && <div className='i-input-append'>{append}</div>}\n\t\t\t</div>\n\t\t</InputContainer>\n\t);\n}) as CompositionInput;\n\nexport default Input;\n"],"names":["useReactive","useMemo","_jsx","VisibilityRound","VisibilityOffRound","useEffect","InputContainer","_jsxs","Helpericon"],"mappings":"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"}

package/lib/cjs/components/input/number.js

@@ -0,0 +1,58 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var jsxRuntime = require('react/jsx-runtime');
+var material = require('@ricons/material');
+var ahooks = require('ahooks');
+var classNames = require('classnames');
+var react = require('react');
+var utils = require('../../js/utils.js');
+var helpericon = require('../utils/helpericon/helpericon.js');
+var container = require('./container.js');
+
+const Number = (props) => {
+    const { ref, label, name, value = props.initValue ?? "", initValue, labelInline, step = 1, min = -Infinity, max = Infinity, thousand, precision, type, className, status = "normal", append, border, prepend, message, tip, hideControl, style, onChange, onEnter, onInput, onBlur, ...restProps } = props;
+    const state = ahooks.useReactive({
+        value,
+    });
+    const getRangeNumber = (v) => utils.clamp(v, min, max);
+    const getFormatNumber = (v) => utils.formatNumber(v, { precision, thousand });
+    const formatInputValue = (v) => {
+        if (!v)
+            return "";
+        if (typeof v === "number" || !thousand)
+            return v;
+        return v.replaceAll(thousand, "");
+    };
+    const handleChange = (e) => {
+        const { value } = e.target;
+        const v = formatInputValue(value.replace(/[^\d\.-]/g, ""));
+        state.value = v;
+        onChange?.(+v, e);
+    };
+    const handleOperate = (param) => {
+        const value = formatInputValue(state.value) ?? 0;
+        const result = getRangeNumber(+value + param);
+        state.value = getFormatNumber(result);
+        onChange?.(result);
+    };
+    react.useEffect(() => {
+        state.value = value;
+    }, [value]);
+    const inputProps = {
+        ref,
+        name,
+        value: state.value,
+        className: "i-input i-input-number",
+        onChange: handleChange,
+        ...restProps,
+    };
+    return (jsxRuntime.jsx(container.default, { label: label, labelInline: labelInline, className: className, style: style, tip: message ?? tip, status: status, children: jsxRuntime.jsxs("div", { className: classNames("i-input-item", {
+                [`i-input-${status}`]: status !== "normal",
+                "i-input-borderless": !border,
+            }), children: [prepend && jsxRuntime.jsx("div", { className: 'i-input-prepend', children: prepend }), !hideControl && (jsxRuntime.jsx(helpericon.default, { active: true, icon: jsxRuntime.jsx(material.MinusRound, {}), onClick: () => handleOperate(-step) })), jsxRuntime.jsx("input", { ...inputProps }), !hideControl && (jsxRuntime.jsx(helpericon.default, { active: true, icon: jsxRuntime.jsx(material.PlusRound, {}), onClick: () => handleOperate(step) })), append && jsxRuntime.jsx("div", { className: 'i-input-append', children: append })] }) }));
+};
+
+exports.default = Number;
+//# sourceMappingURL=number.js.map

package/lib/cjs/components/input/number.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"number.js","sources":["../../../../packages/components/input/number.tsx"],"sourcesContent":["import { MinusRound, PlusRound } from \"@ricons/material\";\nimport { useReactive } from \"ahooks\";\nimport classNames from \"classnames\";\nimport { ChangeEvent, useEffect } from \"react\";\nimport \"../../css/input.css\";\nimport { clamp, formatNumber } from \"../../js/utils\";\nimport Helpericon from \"../utils/helpericon\";\nimport InputContainer from \"./container\";\nimport type { IInputNumber } from \"./type\";\n\nconst Number = (props: IInputNumber) => {\n\tconst {\n\t\tref,\n\t\tlabel,\n\t\tname,\n\t\tvalue = props.initValue ?? \"\",\n\t\tinitValue,\n\t\tlabelInline,\n\t\tstep = 1,\n\t\tmin = -Infinity,\n\t\tmax = Infinity,\n\t\tthousand,\n\t\tprecision,\n\t\ttype,\n\t\tclassName,\n\t\tstatus = \"normal\",\n\t\tappend,\n\t\tborder,\n\t\tprepend,\n\t\tmessage,\n\t\ttip,\n\t\thideControl,\n\t\tstyle,\n\t\tonChange,\n\t\tonEnter,\n\t\tonInput,\n\t\tonBlur,\n\t\t...restProps\n\t} = props;\n\n\tconst state = useReactive({\n\t\tvalue,\n\t});\n\n\tconst getRangeNumber = (v: number) => clamp(v, min, max);\n\n\tconst getFormatNumber = (v: number) =>\n\t\tformatNumber(v, { precision, thousand });\n\n\tconst formatInputValue = (v?: string | number) => {\n\t\tif (!v) return \"\";\n\t\tif (typeof v === \"number\" || !thousand) return v;\n\n\t\treturn v.replaceAll(thousand, \"\");\n\t};\n\n\tconst handleChange = (e: ChangeEvent<HTMLInputElement>) => {\n\t\tconst { value } = e.target;\n\t\tconst v = formatInputValue(value.replace(/[^\\d\\.-]/g, \"\"));\n\n\t\tstate.value = v;\n\t\tonChange?.(+v, e);\n\t};\n\n\tconst handleOperate = (param: number) => {\n\t\tconst value = formatInputValue(state.value) ?? 0;\n\t\tconst result = getRangeNumber(+value + param);\n\n\t\tstate.value = getFormatNumber(result);\n\n\t\tonChange?.(result);\n\t};\n\n\tuseEffect(() => {\n\t\tstate.value = value;\n\t}, [value]);\n\n\tconst inputProps = {\n\t\tref,\n\t\tname,\n\t\tvalue: state.value,\n\t\tclassName: \"i-input i-input-number\",\n\t\tonChange: handleChange,\n\t\t...restProps,\n\t};\n\n\treturn (\n\t\t<InputContainer\n\t\t\tlabel={label}\n\t\t\tlabelInline={labelInline}\n\t\t\tclassName={className}\n\t\t\tstyle={style}\n\t\t\ttip={message ?? tip}\n\t\t\tstatus={status}\n\t\t>\n\t\t\t<div\n\t\t\t\tclassName={classNames(\"i-input-item\", {\n\t\t\t\t\t[`i-input-${status}`]: status !== \"normal\",\n\t\t\t\t\t\"i-input-borderless\": !border,\n\t\t\t\t})}\n\t\t\t>\n\t\t\t\t{prepend && <div className='i-input-prepend'>{prepend}</div>}\n\n\t\t\t\t{!hideControl && (\n\t\t\t\t\t<Helpericon\n\t\t\t\t\t\tactive\n\t\t\t\t\t\ticon={<MinusRound />}\n\t\t\t\t\t\tonClick={() => handleOperate(-step)}\n\t\t\t\t\t/>\n\t\t\t\t)}\n\n\t\t\t\t<input {...inputProps} />\n\n\t\t\t\t{!hideControl && (\n\t\t\t\t\t<Helpericon\n\t\t\t\t\t\tactive\n\t\t\t\t\t\ticon={<PlusRound />}\n\t\t\t\t\t\tonClick={() => handleOperate(step)}\n\t\t\t\t\t/>\n\t\t\t\t)}\n\n\t\t\t\t{append && <div className='i-input-append'>{append}</div>}\n\t\t\t</div>\n\t\t</InputContainer>\n\t);\n};\n\nexport default Number;\n"],"names":["useReactive","clamp","formatNumber","useEffect","_jsx","InputContainer","_jsxs","Helpericon","MinusRound","PlusRound"],"mappings":"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"}

package/lib/cjs/components/input/range.js

@@ -0,0 +1,71 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var jsxRuntime = require('react/jsx-runtime');
+var material = require('@ricons/material');
+var ahooks = require('ahooks');
+var classNames = require('classnames');
+var react = require('react');
+var utils = require('../../js/utils.js');
+var helpericon = require('../utils/helpericon/helpericon.js');
+var container = require('./container.js');
+
+const Range = (props) => {
+    const { label, name, value = props.initValue ?? "", initValue, labelInline, min = -Infinity, max = Infinity, type, className, status = "normal", message, tip, append, prepend, step = 1, thousand, precision, hideControl, placeholder, border, onChange, onBlur, style, ...restProps } = props;
+    const state = ahooks.useReactive({
+        value,
+    });
+    const getRangeNumber = (v) => utils.clamp(v, min, max);
+    const getFormatNumber = (v) => utils.formatNumber(v, { precision, thousand });
+    const formatInputValue = (v) => {
+        if (!v)
+            return "";
+        if (typeof v === "number" || !thousand)
+            return v;
+        return v.replaceAll(thousand, "");
+    };
+    const handleChange = (e, i) => {
+        const { value } = e.target;
+        const v = formatInputValue(value.replace(/[^\d\.-]/g, ""));
+        const range = Array.isArray(state.value) ? state.value : [];
+        range[i] = +v;
+        state.value = range;
+        onChange?.(range, e);
+    };
+    const handleOperate = (e, param, i) => {
+        e.preventDefault();
+        e.stopPropagation();
+        const range = Array.isArray(state.value) ? state.value : [];
+        const value = formatInputValue(range[i]) ?? 0;
+        const result = getRangeNumber(+value + param);
+        range[i] = getFormatNumber(result);
+        state.value = range;
+        onChange?.(range, e);
+    };
+    const handleSwitch = (e) => {
+        e.preventDefault();
+        e.stopPropagation();
+        const range = state.value ? state.value : [];
+        const v = range[0];
+        range[0] = range[1];
+        range[1] = v;
+        state.value = range;
+        onChange?.(range);
+    };
+    react.useEffect(() => {
+        state.value = value;
+    }, [value]);
+    const inputProps = {
+        name,
+        className: "i-input i-input-number",
+        ...restProps,
+    };
+    return (jsxRuntime.jsx(container.default, { label: label, labelInline: labelInline, className: className, style: style, tip: message ?? tip, status: status, children: jsxRuntime.jsxs("div", { className: classNames("i-input-item", {
+                [`i-input-${status}`]: status !== "normal",
+                "i-input-borderless": !border,
+            }), children: [prepend && jsxRuntime.jsx("div", { className: 'i-input-prepend', children: prepend }), !hideControl && (jsxRuntime.jsx(helpericon.default, { active: true, icon: jsxRuntime.jsx(material.MinusRound, {}), onClick: (e) => handleOperate(e, -step, 0) })), jsxRuntime.jsx("input", { value: state.value?.[0] || "", placeholder: placeholder?.[0], ...inputProps, onChange: (e) => handleChange(e, 0) }), !hideControl && (jsxRuntime.jsx(helpericon.default, { active: true, icon: jsxRuntime.jsx(material.PlusRound, {}), onClick: (e) => handleOperate(e, step, 0) })), jsxRuntime.jsx(helpericon.default, { active: true, icon: jsxRuntime.jsx(material.SyncAltRound, {}), style: { margin: 0 }, onClick: handleSwitch }), !hideControl && (jsxRuntime.jsx(helpericon.default, { active: true, icon: jsxRuntime.jsx(material.MinusRound, {}), onClick: (e) => handleOperate(e, -step, 1) })), jsxRuntime.jsx("input", { value: state.value?.[1] || "", placeholder: placeholder?.[1], ...inputProps, onChange: (e) => handleChange(e, 1) }), !hideControl && (jsxRuntime.jsx(helpericon.default, { active: true, icon: jsxRuntime.jsx(material.PlusRound, {}), onClick: (e) => handleOperate(e, step, 1) })), append && jsxRuntime.jsx("div", { className: 'i-input-append', children: append })] }) }));
+};
+
+exports.default = Range;
+//# sourceMappingURL=range.js.map

package/lib/cjs/components/input/range.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"range.js","sources":["../../../../packages/components/input/range.tsx"],"sourcesContent":["import { MinusRound, PlusRound, SyncAltRound } from \"@ricons/material\";\nimport { useReactive } from \"ahooks\";\nimport classNames from \"classnames\";\nimport { ChangeEvent, MouseEvent, useEffect } from \"react\";\nimport \"../../css/input.css\";\nimport { clamp, formatNumber } from \"../../js/utils\";\nimport Helpericon from \"../utils/helpericon\";\nimport InputContainer from \"./container\";\nimport type { IInputRange } from \"./type\";\n\nconst Range = (props: IInputRange) => {\n\tconst {\n\t\tlabel,\n\t\tname,\n\t\tvalue = props.initValue ?? \"\",\n\t\tinitValue,\n\t\tlabelInline,\n\t\tmin = -Infinity,\n\t\tmax = Infinity,\n\t\ttype,\n\t\tclassName,\n\t\tstatus = \"normal\",\n\t\tmessage,\n\t\ttip,\n\t\tappend,\n\t\tprepend,\n\t\tstep = 1,\n\t\tthousand,\n\t\tprecision,\n\t\thideControl,\n\t\tplaceholder,\n\t\tborder,\n\t\tonChange,\n\t\tonBlur,\n\t\tstyle,\n\t\t...restProps\n\t} = props;\n\n\tconst state = useReactive({\n\t\tvalue,\n\t});\n\n\tconst getRangeNumber = (v: number) => clamp(v, min, max);\n\n\tconst getFormatNumber = (v: number) =>\n\t\tformatNumber(v, { precision, thousand });\n\n\tconst formatInputValue = (v?: string | number) => {\n\t\tif (!v) return \"\";\n\t\tif (typeof v === \"number\" || !thousand) return v;\n\n\t\treturn v.replaceAll(thousand, \"\");\n\t};\n\n\tconst handleChange = (e: ChangeEvent<HTMLInputElement>, i: number) => {\n\t\tconst { value } = e.target;\n\t\tconst v = formatInputValue(value.replace(/[^\\d\\.-]/g, \"\"));\n\n\t\tconst range = Array.isArray(state.value) ? state.value : [];\n\t\trange[i] = +v;\n\n\t\tstate.value = range;\n\t\tonChange?.(range, e);\n\t};\n\n\tconst handleOperate = (\n\t\te: MouseEvent<Element>,\n\t\tparam: number,\n\t\ti: number\n\t) => {\n\t\te.preventDefault();\n\t\te.stopPropagation();\n\n\t\tconst range = Array.isArray(state.value) ? state.value : [];\n\t\tconst value = formatInputValue(range[i]) ?? 0;\n\t\tconst result = getRangeNumber(+value + param);\n\n\t\trange[i] = getFormatNumber(result);\n\n\t\tstate.value = range;\n\t\tonChange?.(range, e);\n\t};\n\n\tconst handleSwitch = (e: MouseEvent) => {\n\t\te.preventDefault();\n\t\te.stopPropagation();\n\t\tconst range = state.value ? state.value : [];\n\t\tconst v = range[0];\n\t\trange[0] = range[1];\n\t\trange[1] = v;\n\n\t\tstate.value = range;\n\t\tonChange?.(range);\n\t};\n\n\tuseEffect(() => {\n\t\tstate.value = value;\n\t}, [value]);\n\n\tconst inputProps = {\n\t\tname,\n\t\tclassName: \"i-input i-input-number\",\n\t\t...restProps,\n\t};\n\n\treturn (\n\t\t<InputContainer\n\t\t\tlabel={label}\n\t\t\tlabelInline={labelInline}\n\t\t\tclassName={className}\n\t\t\tstyle={style}\n\t\t\ttip={message ?? tip}\n\t\t\tstatus={status}\n\t\t>\n\t\t\t<div\n\t\t\t\tclassName={classNames(\"i-input-item\", {\n\t\t\t\t\t[`i-input-${status}`]: status !== \"normal\",\n\t\t\t\t\t\"i-input-borderless\": !border,\n\t\t\t\t})}\n\t\t\t>\n\t\t\t\t{prepend && <div className='i-input-prepend'>{prepend}</div>}\n\n\t\t\t\t{!hideControl && (\n\t\t\t\t\t<Helpericon\n\t\t\t\t\t\tactive\n\t\t\t\t\t\ticon={<MinusRound />}\n\t\t\t\t\t\tonClick={(e) => handleOperate(e, -step, 0)}\n\t\t\t\t\t/>\n\t\t\t\t)}\n\n\t\t\t\t<input\n\t\t\t\t\tvalue={state.value?.[0] || \"\"}\n\t\t\t\t\tplaceholder={placeholder?.[0]}\n\t\t\t\t\t{...inputProps}\n\t\t\t\t\tonChange={(e) => handleChange(e, 0)}\n\t\t\t\t/>\n\n\t\t\t\t{!hideControl && (\n\t\t\t\t\t<Helpericon\n\t\t\t\t\t\tactive\n\t\t\t\t\t\ticon={<PlusRound />}\n\t\t\t\t\t\tonClick={(e) => handleOperate(e, step, 0)}\n\t\t\t\t\t/>\n\t\t\t\t)}\n\t\t\t\t<Helpericon\n\t\t\t\t\tactive\n\t\t\t\t\ticon={<SyncAltRound />}\n\t\t\t\t\tstyle={{ margin: 0 }}\n\t\t\t\t\tonClick={handleSwitch}\n\t\t\t\t/>\n\t\t\t\t{!hideControl && (\n\t\t\t\t\t<Helpericon\n\t\t\t\t\t\tactive\n\t\t\t\t\t\ticon={<MinusRound />}\n\t\t\t\t\t\tonClick={(e) => handleOperate(e, -step, 1)}\n\t\t\t\t\t/>\n\t\t\t\t)}\n\n\t\t\t\t<input\n\t\t\t\t\tvalue={state.value?.[1] || \"\"}\n\t\t\t\t\tplaceholder={placeholder?.[1]}\n\t\t\t\t\t{...inputProps}\n\t\t\t\t\tonChange={(e) => handleChange(e, 1)}\n\t\t\t\t/>\n\n\t\t\t\t{!hideControl && (\n\t\t\t\t\t<Helpericon\n\t\t\t\t\t\tactive\n\t\t\t\t\t\ticon={<PlusRound />}\n\t\t\t\t\t\tonClick={(e) => handleOperate(e, step, 1)}\n\t\t\t\t\t/>\n\t\t\t\t)}\n\n\t\t\t\t{append && <div className='i-input-append'>{append}</div>}\n\t\t\t</div>\n\t\t</InputContainer>\n\t);\n};\n\nexport default Range;\n"],"names":["useReactive","clamp","formatNumber","useEffect","_jsx","InputContainer","_jsxs","Helpericon","MinusRound","PlusRound","SyncAltRound"],"mappings":"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"}

package/lib/cjs/components/input/textarea.js

@@ -0,0 +1,51 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var jsxRuntime = require('react/jsx-runtime');
+var ahooks = require('ahooks');
+var classNames = require('classnames');
+var react = require('react');
+var container = require('./container.js');
+
+const Textarea = (props) => {
+    const { ref, label, name, value = props.initValue, initValue, labelInline, className, status = "normal", message, tip, autoSize, border, style, onChange, onEnter, ...restProps } = props;
+    const state = ahooks.useReactive({
+        value,
+    });
+    const refTextarea = react.useRef(null);
+    const handleChange = (e) => {
+        const v = e.target.value;
+        state.value = v;
+        const ta = refTextarea.current?.firstChild;
+        if (autoSize && ta) {
+            ta.style.height = `${ta.scrollHeight}px`;
+        }
+        onChange?.(v, e);
+    };
+    const handleKeydown = (e) => {
+        if (e.code !== "Enter")
+            return;
+        e.stopPropagation();
+        onEnter?.(e);
+    };
+    react.useEffect(() => {
+        state.value = value;
+    }, [value]);
+    const inputProps = {
+        ref,
+        name,
+        value: state.value,
+        className: "i-input i-textarea",
+        onChange: handleChange,
+        onKeyDown: handleKeydown,
+        ...restProps,
+    };
+    return (jsxRuntime.jsx(container.default, { label: label, labelInline: labelInline, className: className, style: style, tip: message ?? tip, status: status, children: jsxRuntime.jsx("div", { ref: refTextarea, className: classNames("i-input-item", {
+                [`i-input-${status}`]: status !== "normal",
+                "i-input-borderless": !border,
+            }), children: jsxRuntime.jsx("textarea", { ...inputProps }) }) }));
+};
+
+exports.default = Textarea;
+//# sourceMappingURL=textarea.js.map

package/lib/cjs/components/input/textarea.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"textarea.js","sources":["../../../../packages/components/input/textarea.tsx"],"sourcesContent":["import { useReactive } from \"ahooks\";\nimport classNames from \"classnames\";\nimport { ChangeEvent, useEffect, useRef } from \"react\";\nimport \"../../css/input.css\";\nimport InputContainer from \"./container\";\nimport type { ITextarea } from \"./type\";\n\nconst Textarea = (props: ITextarea) => {\n\tconst {\n\t\tref,\n\t\tlabel,\n\t\tname,\n\t\tvalue = props.initValue,\n\t\tinitValue,\n\t\tlabelInline,\n\t\tclassName,\n\t\tstatus = \"normal\",\n\t\tmessage,\n\t\ttip,\n\t\tautoSize,\n\t\tborder,\n\t\tstyle,\n\t\tonChange,\n\t\tonEnter,\n\t\t...restProps\n\t} = props;\n\n\tconst state = useReactive({\n\t\tvalue,\n\t});\n\tconst refTextarea = useRef<HTMLDivElement>(null);\n\n\tconst handleChange = (\n\t\te: ChangeEvent<HTMLInputElement | HTMLTextAreaElement>\n\t) => {\n\t\tconst v = e.target.value;\n\n\t\tstate.value = v;\n\n\t\tconst ta = refTextarea.current?.firstChild as HTMLElement;\n\t\tif (autoSize && ta) {\n\t\t\tta.style.height = `${ta.scrollHeight}px`;\n\t\t}\n\n\t\tonChange?.(v, e);\n\t};\n\n\tconst handleKeydown = (e) => {\n\t\tif (e.code !== \"Enter\") return;\n\n\t\te.stopPropagation();\n\t\tonEnter?.(e);\n\t};\n\n\tuseEffect(() => {\n\t\tstate.value = value;\n\t}, [value]);\n\n\tconst inputProps = {\n\t\tref,\n\t\tname,\n\t\tvalue: state.value,\n\t\tclassName: \"i-input i-textarea\",\n\t\tonChange: handleChange,\n\t\tonKeyDown: handleKeydown,\n\t\t...restProps,\n\t};\n\n\treturn (\n\t\t<InputContainer\n\t\t\tlabel={label}\n\t\t\tlabelInline={labelInline}\n\t\t\tclassName={className}\n\t\t\tstyle={style}\n\t\t\ttip={message ?? tip}\n\t\t\tstatus={status}\n\t\t>\n\t\t\t<div\n\t\t\t\tref={refTextarea}\n\t\t\t\tclassName={classNames(\"i-input-item\", {\n\t\t\t\t\t[`i-input-${status}`]: status !== \"normal\",\n\t\t\t\t\t\"i-input-borderless\": !border,\n\t\t\t\t})}\n\t\t\t>\n\t\t\t\t<textarea {...inputProps} />\n\t\t\t</div>\n\t\t</InputContainer>\n\t);\n};\n\nexport default Textarea;\n"],"names":["useReactive","useRef","useEffect","_jsx","InputContainer"],"mappings":";;;;;;;;;;AAOA,MAAM,QAAQ,GAAG,CAAC,KAAgB,KAAI;AACrC,IAAA,MAAM,EACL,GAAG,EACH,KAAK,EACL,IAAI,EACJ,KAAK,GAAG,KAAK,CAAC,SAAS,EACvB,SAAS,EACT,WAAW,EACX,SAAS,EACT,MAAM,GAAG,QAAQ,EACjB,OAAO,EACP,GAAG,EACH,QAAQ,EACR,MAAM,EACN,KAAK,EACL,QAAQ,EACR,OAAO,EACP,GAAG,SAAS,EACZ,GAAG,KAAK;IAET,MAAM,KAAK,GAAGA,kBAAW,CAAC;QACzB,KAAK;AACL,KAAA,CAAC;AACF,IAAA,MAAM,WAAW,GAAGC,YAAM,CAAiB,IAAI,CAAC;AAEhD,IAAA,MAAM,YAAY,GAAG,CACpB,CAAsD,KACnD;AACH,QAAA,MAAM,CAAC,GAAG,CAAC,CAAC,MAAM,CAAC,KAAK;AAExB,QAAA,KAAK,CAAC,KAAK,GAAG,CAAC;AAEf,QAAA,MAAM,EAAE,GAAG,WAAW,CAAC,OAAO,EAAE,UAAyB;AACzD,QAAA,IAAI,QAAQ,IAAI,EAAE,EAAE;YACnB,EAAE,CAAC,KAAK,CAAC,MAAM,GAAG,GAAG,EAAE,CAAC,YAAY,CAAA,EAAA,CAAI;;AAGzC,QAAA,QAAQ,GAAG,CAAC,EAAE,CAAC,CAAC;AACjB,KAAC;AAED,IAAA,MAAM,aAAa,GAAG,CAAC,CAAC,KAAI;AAC3B,QAAA,IAAI,CAAC,CAAC,IAAI,KAAK,OAAO;YAAE;QAExB,CAAC,CAAC,eAAe,EAAE;AACnB,QAAA,OAAO,GAAG,CAAC,CAAC;AACb,KAAC;IAEDC,eAAS,CAAC,MAAK;AACd,QAAA,KAAK,CAAC,KAAK,GAAG,KAAK;AACpB,KAAC,EAAE,CAAC,KAAK,CAAC,CAAC;AAEX,IAAA,MAAM,UAAU,GAAG;QAClB,GAAG;QACH,IAAI;QACJ,KAAK,EAAE,KAAK,CAAC,KAAK;AAClB,QAAA,SAAS,EAAE,oBAAoB;AAC/B,QAAA,QAAQ,EAAE,YAAY;AACtB,QAAA,SAAS,EAAE,aAAa;AACxB,QAAA,GAAG,SAAS;KACZ;AAED,IAAA,QACCC,cAAC,CAAAC,iBAAc,IACd,KAAK,EAAE,KAAK,EACZ,WAAW,EAAE,WAAW,EACxB,SAAS,EAAE,SAAS,EACpB,KAAK,EAAE,KAAK,EACZ,GAAG,EAAE,OAAO,IAAI,GAAG,EACnB,MAAM,EAAE,MAAM,EAEd,QAAA,EAAAD,cAAA,CAAA,KAAA,EAAA,EACC,GAAG,EAAE,WAAW,EAChB,SAAS,EAAE,UAAU,CAAC,cAAc,EAAE;AACrC,gBAAA,CAAC,WAAW,MAAM,CAAA,CAAE,GAAG,MAAM,KAAK,QAAQ;gBAC1C,oBAAoB,EAAE,CAAC,MAAM;AAC7B,aAAA,CAAC,YAEFA,cAAc,CAAA,UAAA,EAAA,EAAA,GAAA,UAAU,GAAI,EACvB,CAAA,EAAA,CACU;AAEnB;;;;"}

package/lib/cjs/components/list/index.js

@@ -0,0 +1,10 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var list = require('./list.js');
+
+
+
+exports.default = list.default;
+//# sourceMappingURL=index.js.map

package/lib/cjs/components/list/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;"}

package/lib/cjs/components/list/item.js

@@ -0,0 +1,18 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var jsxRuntime = require('react/jsx-runtime');
+var classNames = require('classnames');
+
+const Item = (props) => {
+    const { ref, active, type, align, disabled, label, style, className, children, ...restProps } = props;
+    return (jsxRuntime.jsxs("li", { ref: ref, className: classNames("i-list-item", className, {
+            "i-list-item-active": active,
+            "i-list-option": type === "option",
+            disabled,
+        }), style: { alignItems: align, ...style }, ...restProps, children: [label !== undefined && (jsxRuntime.jsx("span", { className: 'i-list-item-label', children: label })), children] }));
+};
+
+exports.default = Item;
+//# sourceMappingURL=item.js.map

package/lib/cjs/components/list/item.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"item.js","sources":["../../../../packages/components/list/item.tsx"],"sourcesContent":["import classNames from \"classnames\";\nimport { IListItem } from \"./type\";\n\nconst Item = (props: IListItem) => {\n\tconst {\n\t\tref,\n\t\tactive,\n\t\ttype,\n\t\talign,\n\t\tdisabled,\n\t\tlabel,\n\t\tstyle,\n\t\tclassName,\n\t\tchildren,\n\t\t...restProps\n\t} = props;\n\n\treturn (\n\t\t<li\n\t\t\tref={ref}\n\t\t\tclassName={classNames(\"i-list-item\", className, {\n\t\t\t\t\"i-list-item-active\": active,\n\t\t\t\t\"i-list-option\": type === \"option\",\n\t\t\t\tdisabled,\n\t\t\t})}\n\t\t\tstyle={{ alignItems: align, ...style }}\n\t\t\t{...restProps}\n\t\t>\n\t\t\t{label !== undefined && (\n\t\t\t\t<span className='i-list-item-label'>{label}</span>\n\t\t\t)}\n\t\t\t{children}\n\t\t</li>\n\t);\n};\n\nexport default Item;\n"],"names":["_jsxs","_jsx"],"mappings":";;;;;;;AAGA,MAAM,IAAI,GAAG,CAAC,KAAgB,KAAI;IACjC,MAAM,EACL,GAAG,EACH,MAAM,EACN,IAAI,EACJ,KAAK,EACL,QAAQ,EACR,KAAK,EACL,KAAK,EACL,SAAS,EACT,QAAQ,EACR,GAAG,SAAS,EACZ,GAAG,KAAK;AAET,IAAA,QACCA,eAAA,CAAA,IAAA,EAAA,EACC,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,UAAU,CAAC,aAAa,EAAE,SAAS,EAAE;AAC/C,YAAA,oBAAoB,EAAE,MAAM;YAC5B,eAAe,EAAE,IAAI,KAAK,QAAQ;YAClC,QAAQ;AACR,SAAA,CAAC,EACF,KAAK,EAAE,EAAE,UAAU,EAAE,KAAK,EAAE,GAAG,KAAK,EAAE,EAAA,GAClC,SAAS,EAEZ,QAAA,EAAA,CAAA,KAAK,KAAK,SAAS,KACnBC,cAAM,CAAA,MAAA,EAAA,EAAA,SAAS,EAAC,mBAAmB,EAAA,QAAA,EAAE,KAAK,EAAA,CAAQ,CAClD,EACA,QAAQ,CAAA,EAAA,CACL;AAEP;;;;"}

package/lib/cjs/components/list/list.js

@@ -0,0 +1,28 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var jsxRuntime = require('react/jsx-runtime');
+var classNames = require('classnames');
+var react = require('react');
+var item = require('./item.js');
+
+const List = (props) => {
+    const { label, type, className, children, ...restProps } = props;
+    return (jsxRuntime.jsx("ul", { className: classNames("i-list", className), ...restProps, children: react.Children.map(children, (node, i) => {
+            const renderLabel = typeof label === "function" ? label(i) : label;
+            const { type, props: nodeProps } = node;
+            if (type === item.default) {
+                return react.cloneElement(node, {
+                    label: renderLabel,
+                    ...nodeProps,
+                    type,
+                });
+            }
+            return node;
+        }) }));
+};
+List.Item = item.default;
+
+exports.default = List;
+//# sourceMappingURL=list.js.map

package/lib/cjs/components/list/list.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"list.js","sources":["../../../../packages/components/list/list.tsx"],"sourcesContent":["import classNames from \"classnames\";\nimport { Children, cloneElement } from \"react\";\nimport \"./index.css\";\nimport Item from \"./item\";\nimport { IList } from \"./type\";\n\nconst List = (props: IList) => {\n\tconst { label, type, className, children, ...restProps } = props;\n\n\treturn (\n\t\t<ul className={classNames(\"i-list\", className)} {...restProps}>\n\t\t\t{Children.map(children, (node: any, i) => {\n\t\t\t\tconst renderLabel =\n\t\t\t\t\ttypeof label === \"function\" ? label(i) : label;\n\n\t\t\t\tconst { type, props: nodeProps } = node;\n\n\t\t\t\tif (type === Item) {\n\t\t\t\t\treturn cloneElement(node, {\n\t\t\t\t\t\tlabel: renderLabel,\n\t\t\t\t\t\t...nodeProps,\n\t\t\t\t\t\ttype,\n\t\t\t\t\t});\n\t\t\t\t}\n\n\t\t\t\treturn node;\n\t\t\t})}\n\t\t</ul>\n\t);\n};\n\nList.Item = Item;\n\nexport default List;\n"],"names":["_jsx","Children","Item","cloneElement"],"mappings":";;;;;;;;;AAMA,MAAM,IAAI,GAAG,CAAC,KAAY,KAAI;AAC7B,IAAA,MAAM,EAAE,KAAK,EAAE,IAAI,EAAE,SAAS,EAAE,QAAQ,EAAE,GAAG,SAAS,EAAE,GAAG,KAAK;IAEhE,QACCA,cAAI,CAAA,IAAA,EAAA,EAAA,SAAS,EAAE,UAAU,CAAC,QAAQ,EAAE,SAAS,CAAC,EAAM,GAAA,SAAS,YAC3DC,cAAQ,CAAC,GAAG,CAAC,QAAQ,EAAE,CAAC,IAAS,EAAE,CAAC,KAAI;AACxC,YAAA,MAAM,WAAW,GAChB,OAAO,KAAK,KAAK,UAAU,GAAG,KAAK,CAAC,CAAC,CAAC,GAAG,KAAK;YAE/C,MAAM,EAAE,IAAI,EAAE,KAAK,EAAE,SAAS,EAAE,GAAG,IAAI;AAEvC,YAAA,IAAI,IAAI,KAAKC,YAAI,EAAE;gBAClB,OAAOC,kBAAY,CAAC,IAAI,EAAE;AACzB,oBAAA,KAAK,EAAE,WAAW;AAClB,oBAAA,GAAG,SAAS;oBACZ,IAAI;AACJ,iBAAA,CAAC;;AAGH,YAAA,OAAO,IAAI;SACX,CAAC,EACE,CAAA;AAEP;AAEA,IAAI,CAAC,IAAI,GAAGD,YAAI;;;;"}

package/lib/cjs/components/loading/index.js

@@ -0,0 +1,10 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var loading = require('./loading.js');
+
+
+
+exports.default = loading.default;
+//# sourceMappingURL=index.js.map

package/lib/cjs/components/loading/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;"}