@ioca/react 1.3.3 → 1.3.5

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

@@ -0,0 +1 @@
+{"version":3,"file":"editor.js","sources":["../../../../packages/components/editor/editor.tsx"],"sourcesContent":["import classNames from \"classnames\";\nimport { useImperativeHandle, useRef } from \"react\";\nimport xss from \"xss\";\nimport { IButton } from \"../button/type\";\nimport getControls, { exec, xssOptions } from \"./controls\";\nimport \"./index.css\";\nimport { IEditor } from \"./type\";\n\nconst Editor = (props: IEditor) => {\n\tconst {\n\t\tref,\n\t\twidth,\n\t\theight = \"10em\",\n\t\tplaceholder,\n\t\tautosize,\n\t\tborder = true,\n\t\trichPaste,\n\t\tcontrols = \"simple\",\n\t\tclassName,\n\t\tstyle,\n\t\tonInput,\n\t\tonPaste,\n\t\tonKeyDown,\n\t\t...restProps\n\t} = props;\n\tconst editorRef = useRef<HTMLDivElement>(null);\n\tconst controlBtnProps: IButton = {\n\t\tsquare: true,\n\t\tflat: true,\n\t\tsize: \"small\",\n\t};\n\n\tconst handlePaste = async (e) => {\n\t\tonPaste?.(e);\n\n\t\tif (richPaste) return;\n\t\te.preventDefault();\n\t\tconst text = e.clipboardData.getData(\"text/plain\");\n\t\texec(\"insertText\", false, text);\n\t};\n\n\tconst handleKeyDown = (e) => {\n\t\tonKeyDown?.(e);\n\n\t\tswitch (e.key) {\n\t\t\tcase \"Tab\":\n\t\t\t\te.preventDefault();\n\t\t\t\texec(\"insertHTML\", false, \"&#09;\");\n\t\t\t\tbreak;\n\t\t\tcase \"Enter\":\n\t\t\t\te.preventDefault();\n\t\t\t\texec(\"insertLineBreak\");\n\n\t\t\t\tif (!editorRef.current) return;\n\t\t\t\teditorRef.current.scrollBy({\n\t\t\t\t\ttop: 20,\n\t\t\t\t\tleft: -1000,\n\t\t\t\t});\n\n\t\t\t\tif (!autosize) return;\n\t\t\t\teditorRef.current.style.height = `${editorRef.current.scrollHeight}px`;\n\n\t\t\t\tbreak;\n\t\t\tdefault:\n\t\t\t\tbreak;\n\t\t}\n\t};\n\n\tuseImperativeHandle(ref, () => {\n\t\treturn {\n\t\t\tsetValue(html) {\n\t\t\t\tif (!editorRef.current) return;\n\t\t\t\tconst safeHtml = xss(html, xssOptions);\n\n\t\t\t\teditorRef.current.innerHTML = safeHtml;\n\t\t\t},\n\t\t\tgetSafeValue() {\n\t\t\t\tconst html = editorRef.current?.innerHTML ?? \"\";\n\n\t\t\t\treturn xss(html, xssOptions);\n\t\t\t},\n\t\t};\n\t});\n\n\tconst handleInput = (e) => {\n\t\tlet html = editorRef.current?.innerHTML ?? \"\";\n\n\t\tif ([\"<br>\", \"\\n\"].includes(html) && editorRef.current) {\n\t\t\thtml = \"\";\n\t\t\teditorRef.current.innerHTML = html;\n\t\t}\n\n\t\tonInput?.(html, e);\n\t};\n\n\treturn (\n\t\t<div\n\t\t\tclassName={classNames(\"i-editor\", className, {\n\t\t\t\t\"i-editor-borderless\": !border,\n\t\t\t})}\n\t\t\tstyle={{\n\t\t\t\t...style,\n\t\t\t\t[autosize ? \"minHeight\" : \"height\"]: height,\n\t\t\t\twidth,\n\t\t\t}}\n\t\t>\n\t\t\t{controls !== \"none\" && (\n\t\t\t\t<div className='i-editor-controls'>\n\t\t\t\t\t{getControls(controls, {\n\t\t\t\t\t\tcontrolBtnProps,\n\t\t\t\t\t})}\n\t\t\t\t</div>\n\t\t\t)}\n\n\t\t\t<div\n\t\t\t\tref={editorRef}\n\t\t\t\tclassName='i-editor-content'\n\t\t\t\tdata-placeholder={placeholder}\n\t\t\t\tcontentEditable\n\t\t\t\tonPaste={handlePaste}\n\t\t\t\tonInput={handleInput}\n\t\t\t\tonKeyDown={handleKeyDown}\n\t\t\t\t{...restProps}\n\t\t\t/>\n\t\t</div>\n\t);\n};\n\nexport default Editor;\n"],"names":["_jsxs","_jsx"],"mappings":"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"}

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

@@ -0,0 +1,6 @@
+import Editor from './editor.js';
+
+
+
+export { Editor as default };
+//# sourceMappingURL=index.js.map

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

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

package/lib/es/components/flex/flex.js

@@ -0,0 +1,28 @@
+import { jsx } from 'react/jsx-runtime';
+import classNames from 'classnames';
+import { useMemo } from 'react';
+
+const Flex = (props) => {
+    const { as: Component = "div", align, justify, direction, wrap, gap, columns, className, style, ...restProps } = props;
+    const gridColumns = useMemo(() => {
+        if (!columns)
+            return;
+        if (typeof columns === "number")
+            return `repeat(${columns}, 1fr)`;
+        return columns;
+    }, [columns]);
+    return (jsx(Component, { ...restProps, style: {
+            alignItems: align,
+            justifyContent: justify,
+            gap,
+            flexDirection: direction,
+            flexWrap: wrap === true ? "wrap" : wrap,
+            gridTemplateColumns: gridColumns,
+            ...style,
+        }, className: classNames(className, {
+            [columns ? "grid" : "flex"]: true,
+        }) }));
+};
+
+export { Flex as default };
+//# sourceMappingURL=flex.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"flex.js","sources":["../../../../packages/components/flex/flex.tsx"],"sourcesContent":["import classNames from \"classnames\";\nimport { useMemo } from \"react\";\nimport \"./index.css\";\nimport { IFlex } from \"./type\";\n\nconst Flex: React.FC<IFlex> = (props: IFlex) => {\n\tconst {\n\t\tas: Component = \"div\" as any,\n\t\talign,\n\t\tjustify,\n\t\tdirection,\n\t\twrap,\n\t\tgap,\n\t\tcolumns,\n\t\tclassName,\n\t\tstyle,\n\t\t...restProps\n\t} = props;\n\n\tconst gridColumns = useMemo(() => {\n\t\tif (!columns) return;\n\n\t\tif (typeof columns === \"number\") return `repeat(${columns}, 1fr)`;\n\n\t\treturn columns;\n\t}, [columns]);\n\n\treturn (\n\t\t<Component\n\t\t\t{...restProps}\n\t\t\tstyle={{\n\t\t\t\talignItems: align,\n\t\t\t\tjustifyContent: justify,\n\t\t\t\tgap,\n\t\t\t\tflexDirection: direction,\n\t\t\t\tflexWrap: wrap === true ? \"wrap\" : wrap,\n\t\t\t\tgridTemplateColumns: gridColumns as any,\n\t\t\t\t...style,\n\t\t\t}}\n\t\t\tclassName={classNames(className, {\n\t\t\t\t[columns ? \"grid\" : \"flex\"]: true,\n\t\t\t})}\n\t\t/>\n\t);\n};\n\nexport default Flex;\n"],"names":["_jsx"],"mappings":";;;;AAKA,MAAM,IAAI,GAAoB,CAAC,KAAY,KAAI;AAC9C,IAAA,MAAM,EACL,EAAE,EAAE,SAAS,GAAG,KAAY,EAC5B,KAAK,EACL,OAAO,EACP,SAAS,EACT,IAAI,EACJ,GAAG,EACH,OAAO,EACP,SAAS,EACT,KAAK,EACL,GAAG,SAAS,EACZ,GAAG,KAAK;AAET,IAAA,MAAM,WAAW,GAAG,OAAO,CAAC,MAAK;AAChC,QAAA,IAAI,CAAC,OAAO;YAAE;QAEd,IAAI,OAAO,OAAO,KAAK,QAAQ;YAAE,OAAO,CAAA,OAAA,EAAU,OAAO,CAAA,MAAA,CAAQ;AAEjE,QAAA,OAAO,OAAO;AACf,KAAC,EAAE,CAAC,OAAO,CAAC,CAAC;AAEb,IAAA,QACCA,GAAC,CAAA,SAAS,OACL,SAAS,EACb,KAAK,EAAE;AACN,YAAA,UAAU,EAAE,KAAK;AACjB,YAAA,cAAc,EAAE,OAAO;YACvB,GAAG;AACH,YAAA,aAAa,EAAE,SAAS;YACxB,QAAQ,EAAE,IAAI,KAAK,IAAI,GAAG,MAAM,GAAG,IAAI;AACvC,YAAA,mBAAmB,EAAE,WAAkB;AACvC,YAAA,GAAG,KAAK;AACR,SAAA,EACD,SAAS,EAAE,UAAU,CAAC,SAAS,EAAE;YAChC,CAAC,OAAO,GAAG,MAAM,GAAG,MAAM,GAAG,IAAI;SACjC,CAAC,EAAA,CACD;AAEJ;;;;"}

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

@@ -0,0 +1,6 @@
+import Flex from './flex.js';
+
+
+
+export { Flex as default };
+//# sourceMappingURL=index.js.map

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

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

package/lib/es/components/form/context.js

@@ -0,0 +1,6 @@
+import { createContext } from 'react';
+
+const Context = createContext({});
+
+export { Context as default };
+//# sourceMappingURL=context.js.map

package/lib/es/components/form/context.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"context.js","sources":["../../../../packages/components/form/context.tsx"],"sourcesContent":["import { createContext } from \"react\";\nimport { IFormInstance } from \"./useForm\";\n\nconst Context = createContext({} as IFormInstance);\n\nexport default Context;\n"],"names":[],"mappings":";;AAGA,MAAM,OAAO,GAAG,aAAa,CAAC,EAAmB;;;;"}

package/lib/es/components/form/field.js

@@ -0,0 +1,73 @@
+import { useReactive } from 'ahooks';
+import PubSub from 'pubsub-js';
+import { useContext, useMemo, Children, isValidElement, cloneElement, useEffect } from 'react';
+import Context from './context.js';
+
+function Field(props) {
+    const { name, required, children } = props;
+    const state = useReactive({
+        value: undefined,
+        status: "normal",
+        message: undefined,
+        update: 0,
+    });
+    const form = useContext(Context);
+    const { id } = form;
+    const handleChange = (v) => {
+        if (!name)
+            return;
+        form.set(name, v);
+        PubSub.publish(`${id}:change`, {
+            name,
+            value: v,
+        });
+    };
+    const hijackChildren = useMemo(() => {
+        return Children.map(children, (node) => {
+            if (!isValidElement(node))
+                return null;
+            const { onChange } = node.props;
+            const { value, status, message } = state;
+            return cloneElement(node, {
+                value,
+                status,
+                message,
+                required,
+                onChange: (...args) => {
+                    handleChange(args[0]);
+                    onChange?.(...args);
+                    Object.assign(state, {
+                        status: "normal",
+                        message: undefined,
+                    });
+                },
+            });
+        });
+    }, [children, state.update]);
+    useEffect(() => {
+        if (!name)
+            return;
+        PubSub.subscribe(`${id}:set:${name}`, (evt, v) => {
+            state.value = v;
+            state.update += 1;
+        });
+        PubSub.subscribe(`${id}:invalid:${name}`, (evt, v) => {
+            Object.assign(state, v);
+            state.update += 1;
+        });
+        Promise.resolve().then(() => {
+            form.set(name, form.cacheData[name] ?? undefined);
+        });
+        return () => {
+            PubSub.unsubscribe(`${id}:set:${name}`);
+            PubSub.unsubscribe(`${id}:invalid:${name}`);
+            form.delete(name);
+        };
+    }, [name, children]);
+    if (!name)
+        return children;
+    return hijackChildren;
+}
+
+export { Field as default };
+//# sourceMappingURL=field.js.map

package/lib/es/components/form/field.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"field.js","sources":["../../../../packages/components/form/field.tsx"],"sourcesContent":["import { useReactive } from \"ahooks\";\nimport PubSub from \"pubsub-js\";\nimport {\n\tChildren,\n\tcloneElement,\n\tisValidElement,\n\tuseContext,\n\tuseEffect,\n\tuseMemo,\n} from \"react\";\nimport Context from \"./context\";\nimport { IField } from \"./type\";\n\nfunction Field(props: IField) {\n\tconst { name, required, children } = props;\n\tconst state = useReactive({\n\t\tvalue: undefined,\n\t\tstatus: \"normal\",\n\t\tmessage: undefined,\n\t\tupdate: 0,\n\t});\n\tconst form = useContext(Context);\n\tconst { id } = form;\n\n\tconst handleChange = (v) => {\n\t\tif (!name) return;\n\n\t\tform.set(name, v);\n\t\tPubSub.publish(`${id}:change`, {\n\t\t\tname,\n\t\t\tvalue: v,\n\t\t});\n\t};\n\n\tconst hijackChildren = useMemo(() => {\n\t\treturn Children.map(children, (node) => {\n\t\t\tif (!isValidElement(node)) return null;\n\n\t\t\tconst { onChange } = node.props as any;\n\t\t\tconst { value, status, message } = state;\n\n\t\t\treturn cloneElement(node, {\n\t\t\t\tvalue,\n\t\t\t\tstatus,\n\t\t\t\tmessage,\n\t\t\t\trequired,\n\t\t\t\tonChange: (...args) => {\n\t\t\t\t\thandleChange(args[0]);\n\t\t\t\t\tonChange?.(...args);\n\t\t\t\t\tObject.assign(state, {\n\t\t\t\t\t\tstatus: \"normal\",\n\t\t\t\t\t\tmessage: undefined,\n\t\t\t\t\t});\n\t\t\t\t},\n\t\t\t} as any);\n\t\t});\n\t}, [children, state.update]);\n\n\tuseEffect(() => {\n\t\tif (!name) return;\n\n\t\tPubSub.subscribe(`${id}:set:${name}`, (evt, v) => {\n\t\t\tstate.value = v;\n\t\t\tstate.update += 1;\n\t\t});\n\t\tPubSub.subscribe(`${id}:invalid:${name}`, (evt, v) => {\n\t\t\tObject.assign(state, v);\n\t\t\tstate.update += 1;\n\t\t});\n\n\t\tPromise.resolve().then(() => {\n\t\t\tform.set(name, form.cacheData[name] ?? undefined);\n\t\t});\n\n\t\treturn () => {\n\t\t\tPubSub.unsubscribe(`${id}:set:${name}`);\n\t\t\tPubSub.unsubscribe(`${id}:invalid:${name}`);\n\t\t\tform.delete(name);\n\t\t};\n\t}, [name, children]);\n\n\tif (!name) return children;\n\n\treturn hijackChildren;\n}\n\nexport default Field;\n"],"names":[],"mappings":"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"}

package/lib/es/components/form/form.js

@@ -0,0 +1,53 @@
+import { jsx } from 'react/jsx-runtime';
+import classNames from 'classnames';
+import PubSub from 'pubsub-js';
+import { useMemo, useEffect } from 'react';
+import Context from './context.js';
+import Field from './field.js';
+import useForm from './useForm.js';
+
+const Form = (props) => {
+    const { form = {}, rules, initialValues, style, className, width, columns = 1, gap = "1em", labelInline, labelWidth, labelRight, children, onKeyDown, onEnter, onChange, ...restProps } = props;
+    const handleKeyDown = (e) => {
+        onKeyDown?.(e);
+        if (e.keyCode !== 13)
+            return;
+        onEnter?.(form.data, form);
+    };
+    const gridColumns = useMemo(() => {
+        if (!columns)
+            return;
+        if (typeof columns === "number")
+            return `minmax(0, 1fr) `.repeat(columns);
+        return columns;
+    }, [columns]);
+    useEffect(() => {
+        Object.assign(form, {
+            data: { ...initialValues },
+            rules,
+        });
+    }, [form]);
+    useEffect(() => {
+        PubSub.subscribe(`${form.id}:change`, (evt, v) => {
+            onChange?.(v.name, v.value);
+        });
+        return () => {
+            PubSub.unsubscribe(`${form.id}:change`);
+        };
+    }, []);
+    return (jsx(Context, { value: form, children: jsx("form", { style: {
+                ...style,
+                width,
+                gap,
+                gridTemplateColumns: gridColumns,
+                "--label-width": labelWidth,
+                "--label-align": labelRight ? "right" : undefined,
+            }, className: classNames("i-form", className, {
+                "i-form-inline": labelInline,
+            }), onKeyDown: handleKeyDown, ...restProps, children: children }) }));
+};
+Form.useForm = useForm;
+Form.Field = Field;
+
+export { Form as default };
+//# sourceMappingURL=form.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"form.js","sources":["../../../../packages/components/form/form.tsx"],"sourcesContent":["import classNames from \"classnames\";\nimport PubSub from \"pubsub-js\";\nimport { CSSProperties, useEffect, useMemo } from \"react\";\nimport Context from \"./context\";\nimport Field from \"./field\";\nimport \"./index.css\";\nimport { IForm } from \"./type\";\nimport useForm, { IFormInstance } from \"./useForm\";\n\nconst Form = (props: IForm) => {\n\tconst {\n\t\tform = {} as IFormInstance,\n\t\trules,\n\t\tinitialValues,\n\t\tstyle,\n\t\tclassName,\n\t\twidth,\n\t\tcolumns = 1,\n\t\tgap = \"1em\",\n\t\tlabelInline,\n\t\tlabelWidth,\n\t\tlabelRight,\n\t\tchildren,\n\t\tonKeyDown,\n\t\tonEnter,\n\t\tonChange,\n\t\t...restProps\n\t} = props;\n\n\tconst handleKeyDown = (e) => {\n\t\tonKeyDown?.(e);\n\n\t\tif (e.keyCode !== 13) return;\n\n\t\tonEnter?.(form.data, form);\n\t};\n\n\tconst gridColumns = useMemo(() => {\n\t\tif (!columns) return;\n\n\t\tif (typeof columns === \"number\")\n\t\t\treturn `minmax(0, 1fr) `.repeat(columns);\n\n\t\treturn columns;\n\t}, [columns]);\n\n\tuseEffect(() => {\n\t\tObject.assign(form, {\n\t\t\tdata: { ...initialValues },\n\t\t\trules,\n\t\t});\n\t}, [form]);\n\n\tuseEffect(() => {\n\t\tPubSub.subscribe(`${form.id}:change`, (evt, v) => {\n\t\t\tonChange?.(v.name, v.value);\n\t\t});\n\n\t\treturn () => {\n\t\t\tPubSub.unsubscribe(`${form.id}:change`);\n\t\t};\n\t}, []);\n\n\treturn (\n\t\t<Context value={form}>\n\t\t\t<form\n\t\t\t\tstyle={\n\t\t\t\t\t{\n\t\t\t\t\t\t...style,\n\t\t\t\t\t\twidth,\n\t\t\t\t\t\tgap,\n\t\t\t\t\t\tgridTemplateColumns: gridColumns as any,\n\t\t\t\t\t\t\"--label-width\": labelWidth,\n\t\t\t\t\t\t\"--label-align\": labelRight ? \"right\" : undefined,\n\t\t\t\t\t} as CSSProperties\n\t\t\t\t}\n\t\t\t\tclassName={classNames(\"i-form\", className, {\n\t\t\t\t\t\"i-form-inline\": labelInline,\n\t\t\t\t})}\n\t\t\t\tonKeyDown={handleKeyDown}\n\t\t\t\t{...restProps}\n\t\t\t>\n\t\t\t\t{children}\n\t\t\t</form>\n\t\t</Context>\n\t);\n};\n\nForm.useForm = useForm;\nForm.Field = Field;\n\nexport default Form;\n"],"names":["_jsx"],"mappings":";;;;;;;;AASA,MAAM,IAAI,GAAG,CAAC,KAAY,KAAI;AAC7B,IAAA,MAAM,EACL,IAAI,GAAG,EAAmB,EAC1B,KAAK,EACL,aAAa,EACb,KAAK,EACL,SAAS,EACT,KAAK,EACL,OAAO,GAAG,CAAC,EACX,GAAG,GAAG,KAAK,EACX,WAAW,EACX,UAAU,EACV,UAAU,EACV,QAAQ,EACR,SAAS,EACT,OAAO,EACP,QAAQ,EACR,GAAG,SAAS,EACZ,GAAG,KAAK;AAET,IAAA,MAAM,aAAa,GAAG,CAAC,CAAC,KAAI;AAC3B,QAAA,SAAS,GAAG,CAAC,CAAC;AAEd,QAAA,IAAI,CAAC,CAAC,OAAO,KAAK,EAAE;YAAE;QAEtB,OAAO,GAAG,IAAI,CAAC,IAAI,EAAE,IAAI,CAAC;AAC3B,KAAC;AAED,IAAA,MAAM,WAAW,GAAG,OAAO,CAAC,MAAK;AAChC,QAAA,IAAI,CAAC,OAAO;YAAE;QAEd,IAAI,OAAO,OAAO,KAAK,QAAQ;AAC9B,YAAA,OAAO,iBAAiB,CAAC,MAAM,CAAC,OAAO,CAAC;AAEzC,QAAA,OAAO,OAAO;AACf,KAAC,EAAE,CAAC,OAAO,CAAC,CAAC;IAEb,SAAS,CAAC,MAAK;AACd,QAAA,MAAM,CAAC,MAAM,CAAC,IAAI,EAAE;AACnB,YAAA,IAAI,EAAE,EAAE,GAAG,aAAa,EAAE;YAC1B,KAAK;AACL,SAAA,CAAC;AACH,KAAC,EAAE,CAAC,IAAI,CAAC,CAAC;IAEV,SAAS,CAAC,MAAK;AACd,QAAA,MAAM,CAAC,SAAS,CAAC,CAAA,EAAG,IAAI,CAAC,EAAE,CAAS,OAAA,CAAA,EAAE,CAAC,GAAG,EAAE,CAAC,KAAI;YAChD,QAAQ,GAAG,CAAC,CAAC,IAAI,EAAE,CAAC,CAAC,KAAK,CAAC;AAC5B,SAAC,CAAC;AAEF,QAAA,OAAO,MAAK;YACX,MAAM,CAAC,WAAW,CAAC,CAAA,EAAG,IAAI,CAAC,EAAE,CAAS,OAAA,CAAA,CAAC;AACxC,SAAC;KACD,EAAE,EAAE,CAAC;IAEN,QACCA,GAAC,CAAA,OAAO,EAAC,EAAA,KAAK,EAAE,IAAI,EAAA,QAAA,EACnBA,GACC,CAAA,MAAA,EAAA,EAAA,KAAK,EACJ;AACC,gBAAA,GAAG,KAAK;gBACR,KAAK;gBACL,GAAG;AACH,gBAAA,mBAAmB,EAAE,WAAkB;AACvC,gBAAA,eAAe,EAAE,UAAU;gBAC3B,eAAe,EAAE,UAAU,GAAG,OAAO,GAAG,SAAS;AAChC,aAAA,EAEnB,SAAS,EAAE,UAAU,CAAC,QAAQ,EAAE,SAAS,EAAE;AAC1C,gBAAA,eAAe,EAAE,WAAW;aAC5B,CAAC,EACF,SAAS,EAAE,aAAa,EAAA,GACpB,SAAS,EAAA,QAAA,EAEZ,QAAQ,EAAA,CACH,EACE,CAAA;AAEZ;AAEA,IAAI,CAAC,OAAO,GAAG,OAAO;AACtB,IAAI,CAAC,KAAK,GAAG,KAAK;;;;"}

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

@@ -0,0 +1,6 @@
+import Form from './form.js';
+
+
+
+export { Form as default };
+//# sourceMappingURL=index.js.map

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

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

package/lib/es/components/form/useForm.js

@@ -0,0 +1,125 @@
+import PubSub from 'pubsub-js';
+import { uid } from 'radash';
+import { useRef } from 'react';
+
+class IFormInstance {
+    id;
+    data = {};
+    cacheData = {};
+    rules = {};
+    constructor() {
+        this.id = uid(8);
+        this.data = {};
+    }
+    get(field) {
+        return field ? this.data[field] : this.data;
+    }
+    set(field, value) {
+        const id = this.id;
+        if (!this.data)
+            return;
+        if (typeof field === "string") {
+            this.data[field] = value;
+            this.cacheData[field] = value;
+            PubSub.publish(`${id}:set:${field}`, value);
+            return;
+        }
+        Object.keys(field).map((name) => {
+            this.data[name] = field[name];
+            this.cacheData[name] = field[name];
+            PubSub.publish(`${id}:set:${name}`, field[name]);
+        });
+    }
+    delete(field) {
+        delete this.data[field];
+    }
+    clear() {
+        if (!this.data)
+            return;
+        this.cacheData = {};
+        Object.keys(this.data).map((name) => {
+            PubSub.publish(`${this.id}:set:${name}`, undefined);
+            this.data[name] = undefined;
+        });
+    }
+    async validate(field) {
+        const { id, rules, data } = this;
+        if (!rules)
+            return data;
+        if (field) {
+            const o = rules[field];
+            const rule = {
+                validator: (v) => Array.isArray(v)
+                    ? v.length > 0
+                    : ![undefined, null, ""].includes(v),
+                message: undefined,
+            };
+            if (typeof o === "function") {
+                rule.validator = o;
+            }
+            else if (o === true) {
+                rule.message = "required";
+            }
+            else {
+                Object.assign(rule, o);
+            }
+            const isValid = rule.validator?.(data[field], this);
+            if (!isValid) {
+                PubSub.publish(`${id}:invalid:${field}`, {
+                    message: rule.message,
+                    status: "error",
+                });
+                return false;
+            }
+            PubSub.publish(`${id}:invalid:${name}`, {
+                message: null,
+                status: "normal",
+            });
+            return true;
+        }
+        let isAllValid = true;
+        Object.keys(data).map((name) => {
+            const o = rules[name];
+            if (o === undefined)
+                return;
+            const rule = {
+                validator: (v) => (Array.isArray(v) ? v.length > 0 : !!v),
+                message: undefined,
+            };
+            if (typeof o === "function") {
+                rule.validator = o;
+            }
+            else if (o === true) {
+                rule.message = "required";
+            }
+            else {
+                Object.assign(rule, o);
+            }
+            const isValid = rule.validator?.(data[name], this);
+            if (!isValid) {
+                PubSub.publish(`${id}:invalid:${name}`, {
+                    message: rule.message,
+                    status: "error",
+                });
+                isAllValid = false;
+            }
+            else {
+                PubSub.publish(`${id}:invalid:${name}`, {
+                    message: null,
+                    status: "normal",
+                });
+            }
+        });
+        return isAllValid ? Promise.resolve(data) : false;
+    }
+}
+function useForm(form) {
+    const formRef = useRef(null);
+    if (!formRef.current) {
+        formRef.current = form ?? new IFormInstance();
+    }
+    return formRef.current;
+}
+
+export { IFormInstance, useForm as default };
+//# sourceMappingURL=useForm.js.map

package/lib/es/components/form/useForm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useForm.js","sources":["../../../../packages/components/form/useForm.ts"],"sourcesContent":["import PubSub from \"pubsub-js\";\nimport { uid } from \"radash\";\nimport { useRef } from \"react\";\nimport { IForm, TRule } from \"./type\";\n\nexport class IFormInstance {\n\treadonly id?: string;\n\tdata: Record<string, any> = {};\n\tcacheData: Record<string, any> = {};\n\trules?: Pick<IForm, \"rules\"> = {};\n\n\tconstructor() {\n\t\tthis.id = uid(8);\n\t\tthis.data = {};\n\t}\n\n\tget(field?: string) {\n\t\treturn field ? this.data[field] : this.data;\n\t}\n\n\tset(field: any, value?: any) {\n\t\tconst id = this.id;\n\t\tif (!this.data) return;\n\n\t\tif (typeof field === \"string\") {\n\t\t\tthis.data[field] = value;\n\t\t\tthis.cacheData[field] = value;\n\t\t\tPubSub.publish(`${id}:set:${field}`, value);\n\t\t\treturn;\n\t\t}\n\n\t\tObject.keys(field).map((name) => {\n\t\t\tthis.data[name] = field[name];\n\t\t\tthis.cacheData[name] = field[name];\n\t\t\tPubSub.publish(`${id}:set:${name}`, field[name]);\n\t\t});\n\t}\n\n\tdelete(field) {\n\t\tdelete this.data[field];\n\t}\n\n\tclear() {\n\t\tif (!this.data) return;\n\t\tthis.cacheData = {};\n\n\t\tObject.keys(this.data).map((name) => {\n\t\t\tPubSub.publish(`${this.id}:set:${name}`, undefined);\n\t\t\tthis.data[name] = undefined;\n\t\t});\n\t}\n\n\tasync validate(field?: string) {\n\t\tconst { id, rules, data } = this;\n\t\tif (!rules) return data;\n\n\t\tif (field) {\n\t\t\tconst o = rules[field];\n\t\t\tconst rule: TRule = {\n\t\t\t\tvalidator: (v) =>\n\t\t\t\t\tArray.isArray(v)\n\t\t\t\t\t\t? v.length > 0\n\t\t\t\t\t\t: ![undefined, null, \"\"].includes(v),\n\t\t\t\tmessage: undefined,\n\t\t\t};\n\n\t\t\tif (typeof o === \"function\") {\n\t\t\t\trule.validator = o;\n\t\t\t} else if (o === true) {\n\t\t\t\trule.message = \"required\";\n\t\t\t} else {\n\t\t\t\tObject.assign(rule, o);\n\t\t\t}\n\n\t\t\tconst isValid = rule.validator?.(data[field], this);\n\n\t\t\tif (!isValid) {\n\t\t\t\tPubSub.publish(`${id}:invalid:${field}`, {\n\t\t\t\t\tmessage: rule.message,\n\t\t\t\t\tstatus: \"error\",\n\t\t\t\t});\n\t\t\t\treturn false;\n\t\t\t}\n\n\t\t\tPubSub.publish(`${id}:invalid:${name}`, {\n\t\t\t\tmessage: null,\n\t\t\t\tstatus: \"normal\",\n\t\t\t});\n\t\t\treturn true;\n\t\t}\n\n\t\tlet isAllValid = true;\n\n\t\tObject.keys(data).map((name) => {\n\t\t\tconst o = rules[name];\n\t\t\tif (o === undefined) return;\n\n\t\t\tconst rule: TRule = {\n\t\t\t\tvalidator: (v) => (Array.isArray(v) ? v.length > 0 : !!v),\n\t\t\t\tmessage: undefined,\n\t\t\t};\n\n\t\t\tif (typeof o === \"function\") {\n\t\t\t\trule.validator = o;\n\t\t\t} else if (o === true) {\n\t\t\t\trule.message = \"required\";\n\t\t\t} else {\n\t\t\t\tObject.assign(rule, o);\n\t\t\t}\n\n\t\t\tconst isValid = rule.validator?.(data[name], this);\n\n\t\t\tif (!isValid) {\n\t\t\t\tPubSub.publish(`${id}:invalid:${name}`, {\n\t\t\t\t\tmessage: rule.message,\n\t\t\t\t\tstatus: \"error\",\n\t\t\t\t});\n\t\t\t\tisAllValid = false;\n\t\t\t} else {\n\t\t\t\tPubSub.publish(`${id}:invalid:${name}`, {\n\t\t\t\t\tmessage: null,\n\t\t\t\t\tstatus: \"normal\",\n\t\t\t\t});\n\t\t\t}\n\t\t});\n\n\t\treturn isAllValid ? Promise.resolve(data) : false;\n\t}\n}\n\nexport default function useForm(form?: IFormInstance) {\n\tconst formRef = useRef<IFormInstance>(null);\n\n\tif (!formRef.current) {\n\t\tformRef.current = form ?? new IFormInstance();\n\t}\n\n\treturn formRef.current;\n}\n"],"names":[],"mappings":";;;;MAKa,aAAa,CAAA;AAChB,IAAA,EAAE;IACX,IAAI,GAAwB,EAAE;IAC9B,SAAS,GAAwB,EAAE;IACnC,KAAK,GAA0B,EAAE;AAEjC,IAAA,WAAA,GAAA;AACC,QAAA,IAAI,CAAC,EAAE,GAAG,GAAG,CAAC,CAAC,CAAC;AAChB,QAAA,IAAI,CAAC,IAAI,GAAG,EAAE;;AAGf,IAAA,GAAG,CAAC,KAAc,EAAA;AACjB,QAAA,OAAO,KAAK,GAAG,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,GAAG,IAAI,CAAC,IAAI;;IAG5C,GAAG,CAAC,KAAU,EAAE,KAAW,EAAA;AAC1B,QAAA,MAAM,EAAE,GAAG,IAAI,CAAC,EAAE;QAClB,IAAI,CAAC,IAAI,CAAC,IAAI;YAAE;AAEhB,QAAA,IAAI,OAAO,KAAK,KAAK,QAAQ,EAAE;AAC9B,YAAA,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,GAAG,KAAK;AACxB,YAAA,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,GAAG,KAAK;YAC7B,MAAM,CAAC,OAAO,CAAC,CAAG,EAAA,EAAE,CAAQ,KAAA,EAAA,KAAK,CAAE,CAAA,EAAE,KAAK,CAAC;YAC3C;;QAGD,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,GAAG,CAAC,CAAC,IAAI,KAAI;YAC/B,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,GAAG,KAAK,CAAC,IAAI,CAAC;YAC7B,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,GAAG,KAAK,CAAC,IAAI,CAAC;AAClC,YAAA,MAAM,CAAC,OAAO,CAAC,CAAA,EAAG,EAAE,CAAQ,KAAA,EAAA,IAAI,CAAE,CAAA,EAAE,KAAK,CAAC,IAAI,CAAC,CAAC;AACjD,SAAC,CAAC;;AAGH,IAAA,MAAM,CAAC,KAAK,EAAA;AACX,QAAA,OAAO,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC;;IAGxB,KAAK,GAAA;QACJ,IAAI,CAAC,IAAI,CAAC,IAAI;YAAE;AAChB,QAAA,IAAI,CAAC,SAAS,GAAG,EAAE;AAEnB,QAAA,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,GAAG,CAAC,CAAC,IAAI,KAAI;AACnC,YAAA,MAAM,CAAC,OAAO,CAAC,CAAA,EAAG,IAAI,CAAC,EAAE,CAAA,KAAA,EAAQ,IAAI,CAAA,CAAE,EAAE,SAAS,CAAC;AACnD,YAAA,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,GAAG,SAAS;AAC5B,SAAC,CAAC;;IAGH,MAAM,QAAQ,CAAC,KAAc,EAAA;QAC5B,MAAM,EAAE,EAAE,EAAE,KAAK,EAAE,IAAI,EAAE,GAAG,IAAI;AAChC,QAAA,IAAI,CAAC,KAAK;AAAE,YAAA,OAAO,IAAI;QAEvB,IAAI,KAAK,EAAE;AACV,YAAA,MAAM,CAAC,GAAG,KAAK,CAAC,KAAK,CAAC;AACtB,YAAA,MAAM,IAAI,GAAU;gBACnB,SAAS,EAAE,CAAC,CAAC,KACZ,KAAK,CAAC,OAAO,CAAC,CAAC;AACd,sBAAE,CAAC,CAAC,MAAM,GAAG;AACb,sBAAE,CAAC,CAAC,SAAS,EAAE,IAAI,EAAE,EAAE,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC;AACtC,gBAAA,OAAO,EAAE,SAAS;aAClB;AAED,YAAA,IAAI,OAAO,CAAC,KAAK,UAAU,EAAE;AAC5B,gBAAA,IAAI,CAAC,SAAS,GAAG,CAAC;;AACZ,iBAAA,IAAI,CAAC,KAAK,IAAI,EAAE;AACtB,gBAAA,IAAI,CAAC,OAAO,GAAG,UAAU;;iBACnB;AACN,gBAAA,MAAM,CAAC,MAAM,CAAC,IAAI,EAAE,CAAC,CAAC;;AAGvB,YAAA,MAAM,OAAO,GAAG,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC,KAAK,CAAC,EAAE,IAAI,CAAC;YAEnD,IAAI,CAAC,OAAO,EAAE;gBACb,MAAM,CAAC,OAAO,CAAC,CAAA,EAAG,EAAE,CAAY,SAAA,EAAA,KAAK,EAAE,EAAE;oBACxC,OAAO,EAAE,IAAI,CAAC,OAAO;AACrB,oBAAA,MAAM,EAAE,OAAO;AACf,iBAAA,CAAC;AACF,gBAAA,OAAO,KAAK;;YAGb,MAAM,CAAC,OAAO,CAAC,CAAA,EAAG,EAAE,CAAY,SAAA,EAAA,IAAI,EAAE,EAAE;AACvC,gBAAA,OAAO,EAAE,IAAI;AACb,gBAAA,MAAM,EAAE,QAAQ;AAChB,aAAA,CAAC;AACF,YAAA,OAAO,IAAI;;QAGZ,IAAI,UAAU,GAAG,IAAI;QAErB,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,GAAG,CAAC,CAAC,IAAI,KAAI;AAC9B,YAAA,MAAM,CAAC,GAAG,KAAK,CAAC,IAAI,CAAC;YACrB,IAAI,CAAC,KAAK,SAAS;gBAAE;AAErB,YAAA,MAAM,IAAI,GAAU;gBACnB,SAAS,EAAE,CAAC,CAAC,MAAM,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,MAAM,GAAG,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;AACzD,gBAAA,OAAO,EAAE,SAAS;aAClB;AAED,YAAA,IAAI,OAAO,CAAC,KAAK,UAAU,EAAE;AAC5B,gBAAA,IAAI,CAAC,SAAS,GAAG,CAAC;;AACZ,iBAAA,IAAI,CAAC,KAAK,IAAI,EAAE;AACtB,gBAAA,IAAI,CAAC,OAAO,GAAG,UAAU;;iBACnB;AACN,gBAAA,MAAM,CAAC,MAAM,CAAC,IAAI,EAAE,CAAC,CAAC;;AAGvB,YAAA,MAAM,OAAO,GAAG,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC,IAAI,CAAC,EAAE,IAAI,CAAC;YAElD,IAAI,CAAC,OAAO,EAAE;gBACb,MAAM,CAAC,OAAO,CAAC,CAAA,EAAG,EAAE,CAAY,SAAA,EAAA,IAAI,EAAE,EAAE;oBACvC,OAAO,EAAE,IAAI,CAAC,OAAO;AACrB,oBAAA,MAAM,EAAE,OAAO;AACf,iBAAA,CAAC;gBACF,UAAU,GAAG,KAAK;;iBACZ;gBACN,MAAM,CAAC,OAAO,CAAC,CAAA,EAAG,EAAE,CAAY,SAAA,EAAA,IAAI,EAAE,EAAE;AACvC,oBAAA,OAAO,EAAE,IAAI;AACb,oBAAA,MAAM,EAAE,QAAQ;AAChB,iBAAA,CAAC;;AAEJ,SAAC,CAAC;AAEF,QAAA,OAAO,UAAU,GAAG,OAAO,CAAC,OAAO,CAAC,IAAI,CAAC,GAAG,KAAK;;AAElD;AAEuB,SAAA,OAAO,CAAC,IAAoB,EAAA;AACnD,IAAA,MAAM,OAAO,GAAG,MAAM,CAAgB,IAAI,CAAC;AAE3C,IAAA,IAAI,CAAC,OAAO,CAAC,OAAO,EAAE;QACrB,OAAO,CAAC,OAAO,GAAG,IAAI,IAAI,IAAI,aAAa,EAAE;;IAG9C,OAAO,OAAO,CAAC,OAAO;AACvB;;;;"}

package/lib/es/components/icon/icon.js

@@ -0,0 +1,23 @@
+import classNames from 'classnames';
+import { isValidElement, cloneElement } from 'react';
+
+const Icon = (props) => {
+    const { ref, icon, size = "1.425em", rotate, style, className, ...restProps } = props;
+    if (!isValidElement(icon))
+        return icon;
+    const iconProps = {
+        ref,
+        style: {
+            transform: rotate ? `rotate(${rotate}deg)` : undefined,
+            ...style,
+            width: size,
+            height: size,
+        },
+        className: classNames("i-icon", className),
+        ...restProps,
+    };
+    return cloneElement(icon, iconProps);
+};
+
+export { Icon as default };
+//# sourceMappingURL=icon.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"icon.js","sources":["../../../../packages/components/icon/icon.tsx"],"sourcesContent":["import classNames from \"classnames\";\nimport { cloneElement, isValidElement } from \"react\";\nimport \"./index.css\";\nimport { IIcon } from \"./type\";\n\nconst Icon = (props: IIcon) => {\n\tconst {\n\t\tref,\n\t\ticon,\n\t\tsize = \"1.425em\",\n\t\trotate,\n\t\tstyle,\n\t\tclassName,\n\t\t...restProps\n\t} = props;\n\n\tif (!isValidElement(icon)) return icon;\n\n\tconst iconProps = {\n\t\tref,\n\t\tstyle: {\n\t\t\ttransform: rotate ? `rotate(${rotate}deg)` : undefined,\n\t\t\t...style,\n\t\t\twidth: size,\n\t\t\theight: size,\n\t\t},\n\t\tclassName: classNames(\"i-icon\", className),\n\t\t...restProps,\n\t};\n\n\treturn cloneElement(icon, iconProps);\n};\n\nexport default Icon;\n"],"names":[],"mappings":";;;AAKA,MAAM,IAAI,GAAG,CAAC,KAAY,KAAI;IAC7B,MAAM,EACL,GAAG,EACH,IAAI,EACJ,IAAI,GAAG,SAAS,EAChB,MAAM,EACN,KAAK,EACL,SAAS,EACT,GAAG,SAAS,EACZ,GAAG,KAAK;AAET,IAAA,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC;AAAE,QAAA,OAAO,IAAI;AAEtC,IAAA,MAAM,SAAS,GAAG;QACjB,GAAG;AACH,QAAA,KAAK,EAAE;YACN,SAAS,EAAE,MAAM,GAAG,CAAU,OAAA,EAAA,MAAM,CAAM,IAAA,CAAA,GAAG,SAAS;AACtD,YAAA,GAAG,KAAK;AACR,YAAA,KAAK,EAAE,IAAI;AACX,YAAA,MAAM,EAAE,IAAI;AACZ,SAAA;AACD,QAAA,SAAS,EAAE,UAAU,CAAC,QAAQ,EAAE,SAAS,CAAC;AAC1C,QAAA,GAAG,SAAS;KACZ;AAED,IAAA,OAAO,YAAY,CAAC,IAAI,EAAE,SAAS,CAAC;AACrC;;;;"}

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

@@ -0,0 +1,6 @@
+import Icon from './icon.js';
+
+
+
+export { Icon as default };
+//# sourceMappingURL=index.js.map

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

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

package/lib/es/components/image/image.js

@@ -0,0 +1,72 @@
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
+import { HideImageTwotone } from '@ricons/material';
+import { useReactive } from 'ahooks';
+import classNames from 'classnames';
+import { useRef, useEffect } from 'react';
+import { useIntersectionObserver } from '../../js/hooks.js';
+import usePreview from '../../js/usePreview/index.js';
+import Icon from '../icon/icon.js';
+import Loading from '../loading/loading.js';
+
+const Image = (props) => {
+    const { src, round, size, initSize, lazyload, fallback = (jsx(Icon, { icon: jsx(HideImageTwotone, {}), size: '2em', className: 'color-5' })), fit, style, className, cover, coverClass, usePreview: previewable, onLoad, onError, onClick, ...restProps } = props;
+    const state = useReactive({
+        status: "loading",
+    });
+    const ref = useRef(null);
+    const wh = fit ? "100%" : undefined;
+    const { observe, unobserve } = useIntersectionObserver();
+    const preview = usePreview();
+    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",
+                    },
+                ],
+            });
+    };
+    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 (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) : (jsxs(Fragment, { children: [src && (jsx("img", { ref: ref, style: { objectFit: fit, width: wh, height: wh }, ...restProps, onLoad: handleLoad, onError: handleError, onClick: handleClick })), src && state.status === "loading" && jsx(Loading, { absolute: true }), cover && (jsx("div", { className: classNames("i-image-cover", coverClass), onClick: handleClick, children: cover }))] })) }));
+};
+
+export { Image as default };
+//# sourceMappingURL=image.js.map

package/lib/es/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","_jsxs"],"mappings":"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"}

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

@@ -0,0 +1,7 @@
+import Image from './image.js';
+import List from './list.js';
+
+Image.List = List;
+
+export { Image as default };
+//# sourceMappingURL=index.js.map

package/lib/es/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":[],"mappings":";;;AAGA,KAAK,CAAC,IAAI,GAAG,IAAI;;;;"}

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

@@ -0,0 +1,43 @@
+import { jsx } from 'react/jsx-runtime';
+import { useMemo } from 'react';
+import usePreview from '../../js/usePreview/index.js';
+import { getSuffixByUrl, getFileType } from '../../js/utils.js';
+import Flex from '../flex/flex.js';
+import Image from './image.js';
+
+function List(props) {
+    const { items = [], gap = 8, columns, wrap, direction, usePreview: previewable, onClick, ...restProps } = props;
+    const preview = usePreview();
+    const files = useMemo(() => {
+        return items.map((item) => {
+            const o = {
+                src: "",
+            };
+            if (typeof item === "string") {
+                o.src = item;
+            }
+            else {
+                Object.assign(o, item);
+            }
+            o.suffix = getSuffixByUrl(o.src) || "";
+            o.type = 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 (jsx(Flex, { className: 'i-image-list', gap: gap, columns: columns, wrap: wrap, direction: direction, children: files.map((img, i) => {
+            return (jsx(Image, { src: img.src, size: 60, usePreview: false, onClick: (e) => handleClick(e, i), ...restProps }, i));
+        }) }));
+}
+
+export { List as default };
+//# sourceMappingURL=list.js.map

package/lib/es/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":["_jsx"],"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,GAAG,UAAU,EAAE;AAE5B,IAAA,MAAM,KAAK,GAAG,OAAO,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,GAAG,cAAc,CAAC,CAAC,CAAC,GAAG,CAAC,IAAI,EAAE;AACtC,YAAA,CAAC,CAAC,IAAI,GAAG,WAAW,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,QACCA,GAAA,CAAC,IAAI,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,QACCA,GAAC,CAAA,KAAK,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/es/components/input/container.js

@@ -0,0 +1,14 @@
+import { jsxs, jsx } from 'react/jsx-runtime';
+import classNames from 'classnames';
+
+function InputContainer(props) {
+    const { as: As = "label", label, className, labelInline, style, children, status, tip, required, } = props;
+    return (jsxs(As, { className: classNames("i-input-label", className, {
+            "i-input-inline": labelInline,
+        }), style: style, children: [label && (jsxs("span", { className: 'i-input-label-text', children: [required && jsx("span", { className: 'error', children: "*" }), label] })), children, tip && (jsx("span", { className: classNames("i-input-message", {
+                    [`i-input-${status}`]: status !== "normal",
+                }), children: tip }))] }));
+}
+
+export { InputContainer as default };
+//# sourceMappingURL=container.js.map

package/lib/es/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,IAAC,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,IAAM,CAAA,MAAA,EAAA,EAAA,SAAS,EAAC,oBAAoB,EAAA,QAAA,EAAA,CAClC,QAAQ,IAAIC,cAAM,SAAS,EAAC,OAAO,EAAA,QAAA,EAAA,GAAA,EAAA,CAAS,EAC5C,KAAK,CAAA,EAAA,CACA,CACP,EAEA,QAAQ,EAER,GAAG,KACHA,cACC,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/es/components/input/index.js

@@ -0,0 +1,11 @@
+import Input from './input.js';
+import Number from './number.js';
+import Range from './range.js';
+import Textarea from './textarea.js';
+
+Input.Textarea = Textarea;
+Input.Number = Number;
+Input.Range = Range;
+
+export { Input as default };
+//# sourceMappingURL=index.js.map

package/lib/es/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":[],"mappings":";;;;;AAKA,KAAK,CAAC,QAAQ,GAAG,QAAQ;AACzB,KAAK,CAAC,MAAM,GAAG,MAAM;AACrB,KAAK,CAAC,KAAK,GAAG,KAAK;;;;"}