@ioca/react 1.4.78 → 1.4.80

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

@@ -0,0 +1,123 @@
+const require_runtime = require("../../_virtual/_rolldown/runtime.js");
+let _Users_iann_codes_ioca_react_node_modules__pnpm_radash_12_1_1_node_modules_radash_dist_esm_index_mjs = require("/Users/iann/codes/ioca-react/node_modules/.pnpm/radash@12.1.1/node_modules/radash/dist/esm/index.mjs");
+let react = require("react");
+let _Users_iann_codes_ioca_react_node_modules__pnpm_pubsub_js_1_9_5_node_modules_pubsub_js_src_pubsub_js = require("/Users/iann/codes/ioca-react/node_modules/.pnpm/pubsub-js@1.9.5/node_modules/pubsub-js/src/pubsub.js");
+_Users_iann_codes_ioca_react_node_modules__pnpm_pubsub_js_1_9_5_node_modules_pubsub_js_src_pubsub_js = require_runtime.__toESM(_Users_iann_codes_ioca_react_node_modules__pnpm_pubsub_js_1_9_5_node_modules_pubsub_js_src_pubsub_js);
+//#region packages/components/form/useForm.ts
+var IFormInstance = class {
+	id;
+	data = {};
+	cacheData = {};
+	rules = {};
+	constructor() {
+		this.id = (0, _Users_iann_codes_ioca_react_node_modules__pnpm_radash_12_1_1_node_modules_radash_dist_esm_index_mjs.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;
+			_Users_iann_codes_ioca_react_node_modules__pnpm_pubsub_js_1_9_5_node_modules_pubsub_js_src_pubsub_js.default.publish(`${id}:set:${field}`, value);
+			return;
+		}
+		Object.keys(field).map((name) => {
+			this.data[name] = field[name];
+			this.cacheData[name] = field[name];
+			_Users_iann_codes_ioca_react_node_modules__pnpm_pubsub_js_1_9_5_node_modules_pubsub_js_src_pubsub_js.default.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) => {
+			_Users_iann_codes_ioca_react_node_modules__pnpm_pubsub_js_1_9_5_node_modules_pubsub_js_src_pubsub_js.default.publish(`${this.id}:set:${name}`, void 0);
+			this.data[name] = void 0;
+		});
+	}
+	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 : ![
+					void 0,
+					null,
+					""
+				].includes(v),
+				message: void 0
+			};
+			if (typeof o === "function") rule.validator = o;
+			else if (o === true) {
+				rule.validator = (v) => ![
+					void 0,
+					null,
+					""
+				].includes(v);
+				rule.message = "required";
+			} else Object.assign(rule, o);
+			const isValid = rule.validator?.(data[field], this);
+			if (typeof isValid === "string") rule.message = isValid;
+			if (isValid !== true) {
+				_Users_iann_codes_ioca_react_node_modules__pnpm_pubsub_js_1_9_5_node_modules_pubsub_js_src_pubsub_js.default.publish(`${id}:invalid:${field}`, {
+					message: rule.message,
+					status: "error"
+				});
+				return false;
+			}
+			_Users_iann_codes_ioca_react_node_modules__pnpm_pubsub_js_1_9_5_node_modules_pubsub_js_src_pubsub_js.default.publish(`${id}:invalid:${name}`, {
+				message: null,
+				status: "normal"
+			});
+			return true;
+		}
+		let isAllValid = true;
+		Object.keys(data).map((name) => {
+			const o = rules[name];
+			if (o === void 0) return;
+			const rule = {
+				validator: (v) => Array.isArray(v) ? v.length > 0 : !!v,
+				message: void 0
+			};
+			if (typeof o === "function") rule.validator = o;
+			else if (o === true) {
+				rule.validator = (v) => ![
+					void 0,
+					null,
+					""
+				].includes(v);
+				rule.message = "required";
+			} else Object.assign(rule, o);
+			const isValid = rule.validator?.(data[name], this);
+			if (typeof isValid === "string") rule.message = isValid;
+			if (isValid !== true) {
+				_Users_iann_codes_ioca_react_node_modules__pnpm_pubsub_js_1_9_5_node_modules_pubsub_js_src_pubsub_js.default.publish(`${id}:invalid:${name}`, {
+					message: rule.message,
+					status: "error"
+				});
+				isAllValid = false;
+			} else _Users_iann_codes_ioca_react_node_modules__pnpm_pubsub_js_1_9_5_node_modules_pubsub_js_src_pubsub_js.default.publish(`${id}:invalid:${name}`, {
+				message: null,
+				status: "normal"
+			});
+		});
+		return isAllValid ? Promise.resolve(data) : false;
+	}
+};
+function useForm(form) {
+	const formRef = (0, react.useRef)(null);
+	if (!formRef.current) formRef.current = form ?? new IFormInstance();
+	return formRef.current;
+}
+//#endregion
+exports.default = useForm;
+
+//# sourceMappingURL=useForm.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"useForm.js","names":[],"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.validator = (v) => ![undefined, null, \"\"].includes(v);\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\t\t\tif (typeof isValid === \"string\") {\n\t\t\t\trule.message = isValid;\n\t\t\t}\n\n\t\t\tif (isValid !== true) {\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.validator = (v) => ![undefined, null, \"\"].includes(v);\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\t\t\tif (typeof isValid === \"string\") {\n\t\t\t\trule.message = isValid;\n\t\t\t}\n\n\t\t\tif (isValid !== true) {\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"],"mappings":"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"}

package/lib/cjs/components/icon/icon.js

@@ -0,0 +1,24 @@
+const require_runtime = require("../../_virtual/_rolldown/runtime.js");
+let classnames = require("classnames");
+classnames = require_runtime.__toESM(classnames);
+let react = require("react");
+//#region packages/components/icon/icon.tsx
+const Icon = (props) => {
+	const { ref, icon, size = "1.425em", rotate, style, className, ...restProps } = props;
+	if (!(0, react.isValidElement)(icon)) return icon;
+	return (0, react.cloneElement)(icon, {
+		ref,
+		style: {
+			transform: rotate ? `rotate(${rotate}deg)` : void 0,
+			...style,
+			width: size,
+			height: size
+		},
+		className: (0, classnames.default)("i-icon", className),
+		...restProps
+	});
+};
+//#endregion
+exports.default = Icon;
+
+//# sourceMappingURL=icon.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"icon.js","names":[],"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"],"mappings":""}

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

@@ -0,0 +1,6 @@
+//#region packages/components/icon/index.tsx
+var icon_default = require("./icon.js").default;
+//#endregion
+exports.default = icon_default;
+
+//# sourceMappingURL=index.js.map

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

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

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

@@ -0,0 +1,86 @@
+const require_runtime = require("../../_virtual/_rolldown/runtime.js");
+const require_index = require("../loading/index.js");
+const require_hooks = require("../../js/hooks.js");
+const require_index$1 = require("../../js/usePreview/index.js");
+const require_list = require("./list.js");
+let classnames = require("classnames");
+classnames = require_runtime.__toESM(classnames);
+let react = require("react");
+let react_jsx_runtime = require("react/jsx-runtime");
+//#region packages/components/image/image.tsx
+const Image = (props) => {
+	const { src, thumb, round, size, height, width, ratio, initSize, lazyload, fallback, fit, style, className, cover, coverClass, usePreview: previewable, onLoad, onError, onClick, ...restProps } = props;
+	const state = require_hooks.useReactive({ status: "loading" });
+	const ref = (0, react.useRef)(null);
+	const { observe, unobserve } = require_hooks.useIntersectionObserver();
+	const preview = require_index$1.default();
+	const handleError = (err) => {
+		onError?.(err);
+		state.status = "error";
+	};
+	const handleLoad = (e) => {
+		onLoad?.(e);
+		state.status = void 0;
+	};
+	const handleClick = (e) => {
+		onClick?.(e);
+		if (!previewable || !src) return;
+		preview({
+			...typeof previewable === "boolean" ? {} : previewable,
+			items: [{
+				src,
+				type: "IMAGE"
+			}]
+		});
+	};
+	(0, react.useEffect)(() => {
+		if (!src || typeof window === "undefined") return;
+		const img = ref.current;
+		const hasSrcAttr = img?.getAttribute("src");
+		if (Boolean(img && (!lazyload || hasSrcAttr)) && img?.complete) state.status = img.naturalWidth > 0 ? void 0 : "error";
+		if (!ref.current?.complete && observe && lazyload) state.status = "loading";
+		if (!lazyload || !ref.current || !observe) 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"] = thumb ?? src;
+	const iSize = state.status === "loading" ? initSize : void 0;
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+		style: {
+			width: width ?? size ?? iSize,
+			height: height ?? size ?? iSize,
+			aspectRatio: ratio,
+			...style
+		},
+		className: (0, classnames.default)("i-image", className, {
+			rounded: round,
+			[`i-image-${state.status}`]: state.status
+		}),
+		onClick: handleClick,
+		children: state.status === "error" ? fallback ?? null : /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [
+			src && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("img", {
+				ref,
+				style: { objectFit: fit },
+				...restProps,
+				onLoad: handleLoad,
+				onError: handleError
+			}),
+			src && state.status === "loading" && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_index.default, { absolute: true }),
+			cover && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				className: (0, classnames.default)("i-image-cover", coverClass),
+				children: cover
+			})
+		] })
+	});
+};
+Image.List = require_list.default;
+//#endregion
+exports.default = Image;
+
+//# sourceMappingURL=image.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"image.js","names":[],"sources":["../../../../packages/components/image/image.tsx"],"sourcesContent":["import classNames from \"classnames\";\nimport { useEffect, useRef } from \"react\";\nimport { useIntersectionObserver, useReactive } from \"../../js/hooks\";\nimport usePreview from \"../../js/usePreview\";\nimport Loading from \"../loading\";\nimport \"./index.css\";\nimport List from \"./list\";\nimport type { CompositionImage, IImage } from \"./type\";\n\nconst Image = (props: IImage) => {\n\tconst {\n\t\tsrc,\n\t\tthumb,\n\t\tround,\n\t\tsize,\n\t\theight,\n\t\twidth,\n\t\tratio,\n\t\tinitSize,\n\t\tlazyload,\n\t\tfallback,\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\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\tif (!previewable || !src) return;\n\n\t\tconst previewConfigs =\n\t\t\ttypeof previewable === \"boolean\" ? {} : previewable;\n\n\t\tpreview({\n\t\t\t...previewConfigs,\n\t\t\titems: [\n\t\t\t\t{\n\t\t\t\t\tsrc,\n\t\t\t\t\ttype: \"IMAGE\",\n\t\t\t\t},\n\t\t\t],\n\t\t});\n\t};\n\n\tuseEffect(() => {\n\t\tif (!src || typeof window === \"undefined\") return;\n\n\t\tconst img = ref.current;\n\t\tconst hasSrcAttr = img?.getAttribute(\"src\");\n\t\tconst canSyncStatus = Boolean(img && (!lazyload || hasSrcAttr));\n\t\tif (canSyncStatus && img?.complete) {\n\t\t\tstate.status = img.naturalWidth > 0 ? undefined : \"error\";\n\t\t}\n\n\t\tif (!ref.current?.complete && observe && lazyload) {\n\t\t\tstate.status = \"loading\";\n\t\t}\n\n\t\tif (!lazyload || !ref.current || !observe) 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\"] = thumb ?? 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: width ?? size ?? iSize,\n\t\t\t\theight: height ?? size ?? iSize,\n\t\t\t\taspectRatio: ratio,\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\tonClick={handleClick}\n\t\t>\n\t\t\t{state.status === \"error\" ? (\n\t\t\t\t(fallback ?? null)\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 }}\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/>\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>\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\nImage.List = List;\n\nexport default Image as CompositionImage;\n"],"mappings":""}

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

@@ -0,0 +1,6 @@
+//#region packages/components/image/index.tsx
+var image_default = require("./image.js").default;
+//#endregion
+exports.default = image_default;
+
+//# sourceMappingURL=index.js.map

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

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

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

@@ -0,0 +1,49 @@
+require("../../_virtual/_rolldown/runtime.js");
+const require_utils = require("../../js/utils.js");
+const require_index = require("../flex/index.js");
+const require_index$1 = require("../../js/usePreview/index.js");
+const require_image = require("./image.js");
+let react = require("react");
+let react_jsx_runtime = require("react/jsx-runtime");
+//#region packages/components/image/list.tsx
+function List(props) {
+	const { items = [], gap = 8, columns, wrap, direction, usePreview: previewable, onClick, ...restProps } = props;
+	const preview = require_index$1.default();
+	const files = (0, react.useMemo)(() => {
+		return items.map((item) => {
+			const o = { src: "" };
+			if (typeof item === "string") o.src = item;
+			else Object.assign(o, item);
+			o.suffix = require_utils.getSuffixByUrl(o.src) || "";
+			o.type = require_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 /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_index.default, {
+		className: "i-image-list",
+		gap,
+		columns,
+		wrap,
+		direction,
+		children: files.map((img, i) => {
+			return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_image.default, {
+				src: img.src,
+				usePreview: false,
+				onClick: (e) => handleClick(e, i),
+				...restProps
+			}, i);
+		})
+	});
+}
+//#endregion
+exports.default = List;
+
+//# sourceMappingURL=list.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"list.js","names":["usePreview","getSuffixByUrl","getFileType","Flex","Image"],"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\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"],"mappings":";;;;;;;;AAQA,SAAwB,KAAK,OAAmB;CAC/C,MAAM,EACL,QAAQ,EAAE,EACV,MAAM,GACN,SACA,MACA,WACA,YAAY,aACZ,SACA,GAAG,cACA;CACJ,MAAM,UAAUA,gBAAAA,SAAY;CAE5B,MAAM,SAAA,GAAA,MAAA,eAAsB;AAC3B,SAAO,MAAM,KAAK,SAAS;GAC1B,MAAM,IAAkB,EACvB,KAAK,IACL;AACD,OAAI,OAAO,SAAS,SACnB,GAAE,MAAM;OAER,QAAO,OAAO,GAAG,KAAK;AAGvB,KAAE,SAASC,cAAAA,eAAe,EAAE,IAAI,IAAI;AACpC,KAAE,OAAOC,cAAAA,YAAY,EAAE,QAAQ,KAAK,QAAQ;AAE5C,UAAO;IACN;IACA,CAAC,MAAM,CAAC;CAEX,MAAM,eAAe,GAAG,MAAM;AAC7B,YAAU,EAAE;AAEZ,iBACC,QAAQ;GACP,OAAO;GACP,SAAS;GACT,CAAC;;AAGJ,KAAI,CAAC,MAAM,OAAQ,QAAO;AAE1B,QACC,iBAAA,GAAA,kBAAA,KAACC,cAAAA,SAAD;EACC,WAAU;EACL;EACI;EACH;EACK;YAEV,MAAM,KAAK,KAAK,MAAM;AACtB,UACC,iBAAA,GAAA,kBAAA,KAACC,cAAAA,SAAD;IAEC,KAAK,IAAI;IACT,YAAY;IACZ,UAAU,MAAM,YAAY,GAAG,EAAE;IACjC,GAAI;IACH,EALI,EAKJ;IAEF;EACI,CAAA"}

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

@@ -0,0 +1,30 @@
+const require_runtime = require("../../_virtual/_rolldown/runtime.js");
+let classnames = require("classnames");
+classnames = require_runtime.__toESM(classnames);
+let react_jsx_runtime = require("react/jsx-runtime");
+//#region packages/components/input/container.tsx
+function InputContainer(props) {
+	const { as: As = "label", label, className, labelInline, style, children, status, tip, required } = props;
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(As, {
+		className: (0, classnames.default)("i-input-label", className, { "i-input-inline": labelInline }),
+		style,
+		children: [
+			label && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
+				className: "i-input-label-text",
+				children: [required && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+					className: "error",
+					children: "*"
+				}), label]
+			}),
+			children,
+			tip && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+				className: (0, classnames.default)("i-input-message", { [`i-input-${status}`]: status !== "normal" }),
+				children: tip
+			})
+		]
+	});
+}
+//#endregion
+exports.default = InputContainer;
+
+//# sourceMappingURL=container.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"container.js","names":[],"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"],"mappings":";;;;;AAGA,SAAwB,eAAe,OAAwB;CAC9D,MAAM,EACL,IAAI,KAAK,SACT,OACA,WACA,aACA,OACA,UACA,QACA,KACA,aACG;AAEJ,QACC,iBAAA,GAAA,kBAAA,MAAC,IAAD;EACC,YAAA,GAAA,WAAA,SAAsB,iBAAiB,WAAW,EACjD,kBAAkB,aAClB,CAAC;EACK;YAJR;GAME,SACA,iBAAA,GAAA,kBAAA,MAAC,QAAD;IAAM,WAAU;cAAhB,CACE,YAAY,iBAAA,GAAA,kBAAA,KAAC,QAAD;KAAM,WAAU;eAAQ;KAAQ,CAAA,EAC5C,MACK;;GAGP;GAEA,OACA,iBAAA,GAAA,kBAAA,KAAC,QAAD;IACC,YAAA,GAAA,WAAA,SAAsB,mBAAmB,GACvC,WAAW,WAAW,WAAW,UAClC,CAAC;cAED;IACK,CAAA;GAEJ"}

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

@@ -0,0 +1,6 @@
+//#region packages/components/input/index.tsx
+var input_default = require("./input.js").default;
+//#endregion
+exports.default = input_default;
+
+//# sourceMappingURL=index.js.map

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

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

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

@@ -0,0 +1,113 @@
+const require_runtime = require("../../_virtual/_rolldown/runtime.js");
+const require_index = require("../utils/helpericon/index.js");
+const require_container = require("./container.js");
+const require_number = require("./number.js");
+const require_range = require("./range.js");
+const require_textarea = require("./textarea.js");
+let classnames = require("classnames");
+classnames = require_runtime.__toESM(classnames);
+let react = require("react");
+let _ricons_material = require("@ricons/material");
+let react_jsx_runtime = require("react/jsx-runtime");
+//#region packages/components/input/input.tsx
+const Input = ((props) => {
+	const { ref, type = "text", label, name, value = "", prepend, append, labelInline, className, status = "normal", message, tip, clear, width, hideVisible, border, underline, required, maxLength, onChange, onEnter, onClear, style, ...restProps } = props;
+	const [inputValue, setInputValue] = (0, react.useState)(value);
+	const [inputType, setInputType] = (0, react.useState)(type);
+	const [visible, setVisible] = (0, react.useState)(false);
+	const handleChange = (e) => {
+		const v = e.target.value;
+		setInputValue(v);
+		onChange?.(v, e);
+	};
+	const handleKeydown = (e) => {
+		e.code === "Enter" && onEnter?.(e);
+	};
+	const handleHelperClick = () => {
+		if (type === "password" && !hideVisible) {
+			setVisible((v) => {
+				const next = !v;
+				setInputType(next ? "text" : "password");
+				return next;
+			});
+			return;
+		}
+		const v = "";
+		setInputValue(v);
+		onChange?.(v);
+		onClear?.();
+	};
+	const HelperIcon = (0, react.useMemo)(() => {
+		if (type === "password") return visible ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_ricons_material.VisibilityRound, {}) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_ricons_material.VisibilityOffRound, {});
+	}, [type, visible]);
+	(0, react.useEffect)(() => {
+		setInputValue(value);
+	}, [value]);
+	const inputProps = {
+		ref,
+		type: inputType,
+		name,
+		value: inputValue,
+		maxLength,
+		className: (0, classnames.default)("i-input", `i-input-${type}`),
+		onChange: handleChange,
+		onKeyDown: handleKeydown,
+		...restProps
+	};
+	(0, react.useEffect)(() => {
+		setInputType(type);
+		setVisible(false);
+	}, [type]);
+	const clearable = clear && inputValue;
+	const showHelper = type === "password" && !!inputValue;
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_container.default, {
+		label,
+		labelInline,
+		className,
+		style: {
+			width,
+			...style
+		},
+		tip: message ?? tip,
+		status,
+		required,
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+			className: (0, classnames.default)("i-input-item", {
+				[`i-input-${status}`]: status !== "normal",
+				"i-input-borderless": !border,
+				"i-input-underline": underline
+			}),
+			children: [
+				prepend && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+					className: "i-input-prepend",
+					children: prepend
+				}),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)("input", { ...inputProps }),
+				maxLength && inputValue?.length > 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
+					className: "color-8 pr-4 font-sm",
+					children: [
+						inputValue.length,
+						" / ",
+						maxLength
+					]
+				}),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_index.default, {
+					active: !!clearable || showHelper,
+					icon: HelperIcon,
+					onClick: handleHelperClick
+				}),
+				append && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+					className: "i-input-append",
+					children: append
+				})
+			]
+		})
+	});
+});
+Input.Textarea = require_textarea.default;
+Input.Number = require_number.default;
+Input.Range = require_range.default;
+//#endregion
+exports.default = Input;
+
+//# sourceMappingURL=input.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"input.js","names":[],"sources":["../../../../packages/components/input/input.tsx"],"sourcesContent":["import { VisibilityOffRound, VisibilityRound } from \"@ricons/material\";\nimport classNames from \"classnames\";\nimport {\n\tChangeEvent,\n\tuseEffect,\n\tuseMemo,\n\tuseState,\n\ttype KeyboardEvent,\n} from \"react\";\nimport \"../../css/input.css\";\nimport Helpericon from \"../utils/helpericon\";\nimport InputContainer from \"./container\";\nimport Number from \"./number\";\nimport Range from \"./range\";\nimport Textarea from \"./textarea\";\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 = \"\",\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\twidth,\n\t\thideVisible,\n\t\tborder,\n\t\tunderline,\n\t\trequired,\n\t\tmaxLength,\n\t\tonChange,\n\t\tonEnter,\n\t\tonClear,\n\t\tstyle,\n\t\t...restProps\n\t} = props;\n\n\tconst [inputValue, setInputValue] = useState(value);\n\tconst [inputType, setInputType] = useState(type);\n\tconst [visible, setVisible] = useState(false);\n\n\tconst handleChange = (e: ChangeEvent<HTMLInputElement>) => {\n\t\tconst v = e.target.value;\n\n\t\tsetInputValue(v);\n\t\tonChange?.(v, e);\n\t};\n\n\tconst handleKeydown = (e: KeyboardEvent<HTMLInputElement>) => {\n\t\te.code === \"Enter\" && onEnter?.(e);\n\t};\n\n\tconst handleHelperClick = () => {\n\t\tif (type === \"password\" && !hideVisible) {\n\t\t\tsetVisible((v) => {\n\t\t\t\tconst next = !v;\n\t\t\t\tsetInputType(next ? \"text\" : \"password\");\n\t\t\t\treturn next;\n\t\t\t});\n\t\t\treturn;\n\t\t}\n\n\t\tconst v = \"\";\n\t\tsetInputValue(v);\n\t\tonChange?.(v);\n\t\tonClear?.();\n\t};\n\n\tconst HelperIcon = useMemo(() => {\n\t\tif (type === \"password\") {\n\t\t\treturn visible ? <VisibilityRound /> : <VisibilityOffRound />;\n\t\t}\n\n\t\treturn undefined;\n\t}, [type, visible]);\n\n\tuseEffect(() => {\n\t\tsetInputValue(value);\n\t}, [value]);\n\n\tconst inputProps = {\n\t\tref,\n\t\ttype: inputType,\n\t\tname,\n\t\tvalue: inputValue,\n\t\tmaxLength,\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\tuseEffect(() => {\n\t\tsetInputType(type);\n\t\tsetVisible(false);\n\t}, [type]);\n\n\tconst clearable = clear && inputValue;\n\tconst showHelper = type === \"password\" && !!inputValue;\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={{ width, ...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\t\"i-input-underline\": underline,\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{maxLength && inputValue?.length > 0 && (\n\t\t\t\t\t<span className='color-8 pr-4 font-sm'>\n\t\t\t\t\t\t{inputValue.length} / {maxLength}\n\t\t\t\t\t</span>\n\t\t\t\t)}\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\nInput.Textarea = Textarea;\nInput.Number = Number;\nInput.Range = Range;\n\nexport default Input;\n"],"mappings":""}

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

@@ -0,0 +1,138 @@
+const require_runtime = require("../../_virtual/_rolldown/runtime.js");
+const require_utils = require("../../js/utils.js");
+const require_index = require("../utils/helpericon/index.js");
+const require_container = require("./container.js");
+let classnames = require("classnames");
+classnames = require_runtime.__toESM(classnames);
+let react = require("react");
+let _ricons_material = require("@ricons/material");
+let react_jsx_runtime = require("react/jsx-runtime");
+//#region packages/components/input/number.tsx
+const Number = (props) => {
+	const { ref, label, name, value = "", labelInline, step = 1, min = -Infinity, max = Infinity, thousand, precision, type, className, width, status = "normal", append, border, prepend, disabled, message, tip, hideControl, showMax, style, onChange, onEnter, onInput, onBlur, ...restProps } = props;
+	const [inputValue, setInputValue] = (0, react.useState)(value === void 0 || value === null ? "" : String(value));
+	const formatOut = (num) => {
+		const v = require_utils.clamp(num, min, max);
+		if (precision !== void 0) return require_utils.formatNumber(v, {
+			precision,
+			thousand
+		});
+		const s = String(v);
+		if (!thousand) return s;
+		const negative = s.startsWith("-");
+		const [integer, decimal] = (negative ? s.slice(1) : s).split(".");
+		const withThousand = integer.replace(/\B(?=(\d{3})+(?!\d))/g, thousand);
+		return decimal ? `${negative ? "-" : ""}${withThousand}.${decimal}` : `${negative ? "-" : ""}${withThousand}`;
+	};
+	const sanitizeNumberInput = (raw) => {
+		const hasMinus = raw.startsWith("-");
+		let v = raw.replace(/[^\d.]/g, "");
+		if (hasMinus) v = `-${v}`;
+		const parts = v.split(".");
+		if (parts.length > 1) v = `${parts.shift()}.${parts.join("")}`;
+		return v;
+	};
+	const formatInputValue = (v) => {
+		if (!v) return "";
+		if (typeof v === "number") return v.toString();
+		if (!thousand) return v;
+		return v.split(thousand).join("");
+	};
+	const handleChange = (e) => {
+		const { value } = e.target;
+		const v = sanitizeNumberInput(formatInputValue(value));
+		const isIntermediate = v === "" || v === "-" || v === "." || v === "-." || v.endsWith(".");
+		setInputValue(v);
+		if (isIntermediate) return;
+		const num = parseFloat(v);
+		if (globalThis.Number.isNaN(num)) return;
+		onChange?.(require_utils.clamp(num, min, max), e);
+		if (precision !== void 0) setInputValue(formatOut(num));
+	};
+	const handleOperate = (param) => {
+		const result = (parseFloat(formatInputValue(inputValue)) || 0) + param;
+		setInputValue(formatOut(result));
+		onChange?.(require_utils.clamp(result, min, max));
+	};
+	const handleMax = () => {
+		setInputValue(formatOut(max));
+		onChange?.(require_utils.clamp(max, min, max));
+	};
+	const handleBlur = (e) => {
+		onBlur?.(e);
+		const v = sanitizeNumberInput(formatInputValue(inputValue));
+		if (!v || v === "-" || v === "." || v === "-.") {
+			setInputValue("");
+			return;
+		}
+		const num = parseFloat(v);
+		if (globalThis.Number.isNaN(num)) return;
+		const numValue = require_utils.clamp(num, min, max);
+		setInputValue(formatOut(numValue));
+		onChange?.(numValue, e);
+	};
+	(0, react.useEffect)(() => {
+		setInputValue(value === void 0 || value === null ? "" : String(value));
+	}, [value]);
+	const inputProps = {
+		ref,
+		name,
+		disabled,
+		value: inputValue,
+		className: "i-input i-input-number",
+		onChange: handleChange,
+		onKeyDown: (e) => {
+			e.code === "Enter" && onEnter?.(e);
+		},
+		onInput,
+		onBlur: handleBlur,
+		...restProps
+	};
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_container.default, {
+		label,
+		labelInline,
+		className,
+		style: {
+			width,
+			...style
+		},
+		tip: message ?? tip,
+		status,
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+			className: (0, classnames.default)("i-input-item", {
+				[`i-input-${status}`]: status !== "normal",
+				"i-input-borderless": !border
+			}),
+			children: [
+				prepend && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+					className: "i-input-prepend",
+					children: prepend
+				}),
+				!hideControl && !disabled && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_index.default, {
+					active: true,
+					icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_ricons_material.MinusRound, {}),
+					onClick: () => handleOperate(-step)
+				}),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)("input", { ...inputProps }),
+				!hideControl && !disabled && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_index.default, {
+					active: true,
+					icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_ricons_material.PlusRound, {}),
+					onClick: () => handleOperate(step)
+				}),
+				showMax && max && !disabled && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_index.default, {
+					active: true,
+					icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_ricons_material.KeyboardDoubleArrowUpRound, {}),
+					onClick: handleMax
+				}),
+				append && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+					className: "i-input-append",
+					children: append
+				})
+			]
+		})
+	});
+};
+//#endregion
+exports.default = Number;
+
+//# sourceMappingURL=number.js.map