@web-utils/form-ui 1.0.0-beta2 → 1.0.0-beta20

package/chunks/Bb43eI1f.mjs

@@ -0,0 +1,93 @@
+import { columnSizeContextKey as e, setColumnSizeContextKey as t } from "../constants.mjs";
+import n from "../form-cell/index.mjs";
+import { ElTooltip as r } from "element-plus/es";
+import { Comment as i, Fragment as a, Text as o, createVNode as s, inject as c, isVNode as l } from "vue";
+import { camelize as u, isDef as d, isString as f } from "@web-utils/core";
+//#region src/components/red-form/FormRow.vue?vue&type=script&lang.jsx
+function p(e) {
+	return typeof e == "function" || Object.prototype.toString.call(e) === "[object Object]" && !l(e);
+}
+var m = (e) => {
+	let t = Object.keys({});
+	for (let n in e) t[u(n)] = e[n];
+	return t;
+}, h = (e, { columnSize: t }) => {
+	if (!e || !e.length) return null;
+	e = e.filter((e) => e.type !== i);
+	let n = [], c = e.length === 1;
+	for (let i = 0; i < e.length; i++) {
+		let v = e[i], { name: y } = v.type;
+		if (v.type === o) n.push({
+			tag: y,
+			type: "text",
+			content: v,
+			colspan: c ? t : 0
+		});
+		else if (v.type === a) n.push(...h(v.children, { columnSize: t }));
+		else if (f(v.type) && v.type === "td") n.push({
+			tag: v.type,
+			type: "td",
+			content: v
+		});
+		else if (y === "FormCell") n.push({
+			tag: y,
+			type: "FormCell",
+			content: v
+		});
+		else if (typeof v.type == "object") {
+			var l, u;
+			let { label: e, hideLabel: i, labelColspan: a, inputColspan: o, labelRowspan: f, inputRowspan: h, tipsAfterLabel: b, tips: x } = m(v.props);
+			if (!d(i)) {
+				var p, g, _;
+				let t = (p = v.children) == null ? void 0 : p.tips, i = t || x ? s(r, {
+					effect: "light",
+					content: x,
+					offset: 4
+				}, {
+					default: () => s("i", { class: "el-icon-info form-item-input-info" }, null),
+					content: t || null
+				}) : null;
+				n.push({
+					tag: y,
+					type: "label",
+					colspan: a,
+					rowspan: f,
+					content: [((g = v.children) == null || (_ = g.label) == null ? void 0 : _.call(g)) || e, b === "" ? i : null]
+				});
+			}
+			let S;
+			S = c && d(i) ? t : d(o) ? o : c ? t - 1 : 0, n.push({
+				tag: y,
+				type: "input",
+				colspan: S,
+				rowspan: h,
+				content: [v, (l = v.children) == null || (u = l.below) == null ? void 0 : u.call(l)]
+			});
+		} else console.error("未知节点");
+	}
+	return n;
+}, g = {
+	name: "FormRow",
+	props: {
+		isLabel: Boolean,
+		alignCenter: Boolean
+	},
+	setup(r, { slots: i }) {
+		let a = c(t, null), o = c(e, null);
+		return () => {
+			var e;
+			let t = (e = i.default) == null ? void 0 : e.call(i), c = [];
+			return c.push(...h(t, { columnSize: (o == null ? void 0 : o.value) ?? 0 })), ((o == null ? void 0 : o.value) ?? 0) < c.length && (a == null || a(c.length)), s("tr", null, [c.map(({ tag: e, type: t, colspan: i, rowspan: a, content: o }) => e === "td" || t === "FormCell" ? o : t === "text" ? s(n, {
+				isLabel: r.isLabel,
+				alignCenter: r.alignCenter,
+				colspan: i
+			}, p(o) ? o : { default: () => [o] }) : s("td", {
+				class: t,
+				colspan: i,
+				rowspan: a
+			}, [o]))]);
+		};
+	}
+};
+//#endregion
+export { g as t };

package/chunks/Be_E_4G0.mjs

@@ -0,0 +1,106 @@
+import { i as e, n as t } from "./C1DlzLpD.mjs";
+import { n } from "./DynLjTwi.mjs";
+import { ElSwitch as r } from "element-plus/es";
+import { createVNode as i, mergeProps as a, useModel as o } from "vue";
+//#region src/components/form/props/switch.js
+var s = {
+	...n,
+	modelValue: [
+		Boolean,
+		String,
+		Number
+	],
+	loading: {
+		type: Boolean,
+		default: !1
+	},
+	size: {
+		type: String,
+		default: ""
+	},
+	width: [Number, String],
+	inlinePrompt: {
+		type: Boolean,
+		default: !1
+	},
+	activeIcon: [String, Object],
+	inactiveIcon: [String, Object],
+	activeActionIcon: [String, Object],
+	inactiveActionIcon: [String, Object],
+	activeText: {
+		type: String,
+		default: ""
+	},
+	inactiveText: {
+		type: String,
+		default: ""
+	},
+	activeValue: {
+		type: [
+			Boolean,
+			String,
+			Number
+		],
+		default: !0
+	},
+	inactiveValue: {
+		type: [
+			Boolean,
+			String,
+			Number
+		],
+		default: !1
+	},
+	name: {
+		type: String,
+		default: ""
+	},
+	validateEvent: {
+		type: Boolean,
+		default: !0
+	},
+	beforeChange: Function,
+	id: String,
+	tabindex: [String, Number],
+	ariaLabel: String,
+	activeColor: {
+		type: String,
+		default: ""
+	},
+	inactiveColor: {
+		type: String,
+		default: ""
+	},
+	borderColor: {
+		type: String,
+		default: ""
+	}
+}, c = { modelValue: !0 }, l = ["change"], u = (e) => n[e] === void 0 && c[e] !== !0, d = {
+	name: "FormSwitch",
+	inheritAttrs: !1,
+	props: { ...s },
+	emits: {
+		...t,
+		change: null
+	},
+	setup(t, { emit: n, slots: s, attrs: c }) {
+		let d = o(t, "modelValue"), { render: f, disabled: p, autoBind: m } = e(t, {
+			emit: n,
+			slots: s,
+			events: l,
+			predicate: u
+		});
+		return () => f({ vNodes: i(r, a(m.value, c, {
+			modelValue: d.value,
+			"onUpdate:modelValue": (e) => d.value = e,
+			disabled: p.value
+		}), {
+			"active-action": s["active-action"],
+			"inactive-action": s["inactive-action"],
+			active: s.active,
+			inactive: s.inactive
+		}) });
+	}
+};
+//#endregion
+export { d as t };

package/chunks/Bh_CMUlo.mjs

@@ -0,0 +1,12 @@
+import { computed as e } from "vue";
+import { capitalize as t } from "@web-utils/core";
+//#region src/util/index.js
+var n = (e, n, r, i) => {
+	let a = {};
+	if (n) for (let t in e) n(t) && (a[t] = e[t]);
+	return r && r.forEach((e) => {
+		a[`on${t(e)}`] = (...t) => i(e, ...t);
+	}), a;
+}, r = (t, { emit: r, events: i, predicate: a }) => e(() => n(t, a, i, r));
+//#endregion
+export { r as n, n as t };

package/chunks/Bk3PtIYo.mjs

@@ -0,0 +1,171 @@
+import { i as e, n as t } from "./C1DlzLpD.mjs";
+import { n } from "./DynLjTwi.mjs";
+import { ElDatePicker as r } from "element-plus/es";
+import { computed as i, createVNode as a, mergeProps as o } from "vue";
+//#region src/components/form/props/date.js
+var s = {
+	...n,
+	modelValue: [
+		Number,
+		String,
+		Date,
+		Array
+	],
+	readonly: {
+		type: Boolean,
+		default: !1
+	},
+	size: String,
+	editable: {
+		type: Boolean,
+		default: !0
+	},
+	clearable: {
+		type: Boolean,
+		default: !0
+	},
+	placeholder: {
+		type: String,
+		default: ""
+	},
+	startPlaceholder: String,
+	endPlaceholder: String,
+	type: {
+		type: String,
+		default: "date"
+	},
+	format: {
+		type: String,
+		default: "YYYY-MM-DD"
+	},
+	popperClass: String,
+	popperStyle: [String, Object],
+	popperOptions: {
+		type: Object,
+		default: () => ({})
+	},
+	rangeSeparator: {
+		type: String,
+		default: "-"
+	},
+	defaultValue: Object,
+	defaultTime: Object,
+	valueFormat: String,
+	id: [String, Array],
+	name: {
+		type: [String, Array],
+		default: ""
+	},
+	unlinkPanels: {
+		type: Boolean,
+		default: !1
+	},
+	prefixIcon: [String, Object],
+	clearIcon: [String, Object],
+	validateEvent: {
+		type: Boolean,
+		default: !0
+	},
+	disabledDate: Function,
+	shortcuts: {
+		type: Array,
+		default: () => []
+	},
+	cellClassName: Function,
+	teleported: {
+		type: Boolean,
+		default: !0
+	},
+	emptyValues: Array,
+	valueOnClear: [
+		String,
+		Number,
+		Boolean,
+		Function
+	],
+	fallbackPlacements: {
+		type: Array,
+		default: () => [
+			"bottom",
+			"top",
+			"right",
+			"left"
+		]
+	},
+	placement: {
+		type: String,
+		default: "bottom"
+	},
+	showFooter: {
+		type: Boolean,
+		default: !0
+	},
+	showConfirm: {
+		type: Boolean,
+		default: !0
+	},
+	showWeekNumber: {
+		type: Boolean,
+		default: !1
+	},
+	automaticDropdown: {
+		type: Boolean,
+		default: !0
+	},
+	split: Boolean,
+	startDate: String,
+	endDate: String
+}, c = {
+	modelValue: !0,
+	name: !0,
+	emptyValues: !0,
+	valueOnClear: !0
+}, l = ["change"], u = (e) => n[e] === void 0 && c[e] !== !0, d = {
+	name: "FormDatePicker",
+	inheritAttrs: !1,
+	props: { ...s },
+	emits: {
+		...t,
+		"update:startDate": null,
+		"update:endDate": null
+	},
+	setup(t, { emit: n, slots: s, attrs: c }) {
+		let { emitInput: d, render: f, placeholder: p, disabled: m, autoBind: h } = e(t, {
+			emit: n,
+			slots: s,
+			attrs: c,
+			events: l,
+			predicate: u,
+			messagePrefix: "请选择"
+		}), g = i(() => {
+			switch (t.type) {
+				case "date":
+				case "daterange": return "YYYY-MM-DD";
+				case "datetime":
+				case "datetimerange": return "YYYY-MM-DD HH:mm:ss";
+				default: return "";
+			}
+		}), _ = i(() => t.split && t.type.indexOf("range") > -1), v = (e, t) => {
+			n("update:startDate", e), n("update:endDate", t);
+		}, y = (e) => {
+			_.value ? e ? v(e[0], e[1]) : v(null, null) : d(e);
+		}, b = i(() => _.value ? [t.startDate, t.endDate] : t.modelValue);
+		return () => f({ vNodes: a(r, o({ style: "width: 100%" }, h.value, {
+			modelValue: b.value,
+			disabled: m.value,
+			placeholder: p.value,
+			format: g.value,
+			"value-format": g.value,
+			"onUpdate:modelValue": y
+		}), {
+			default: s.default,
+			"range-separator": s["range-separator"],
+			"pre-month": s["pre-month"],
+			"next-month": s["next-month"],
+			"pre-year": s["pre-year"],
+			"next-year": s["next-year"]
+		}) });
+	}
+};
+//#endregion
+export { d as t };

package/chunks/C1DlzLpD.mjs

@@ -0,0 +1,222 @@
+import { formHolderContextKey as e, formItemConfigProviderContextKey as t, formItemGroupContextKey as n } from "../constants.mjs";
+import { t as r } from "./Bh_CMUlo.mjs";
+import { ElCol as i, ElFormItem as a, ElTooltip as o } from "element-plus/es";
+import { computed as s, createVNode as c, h as l, inject as u, mergeProps as d, nextTick as f, unref as p, useTemplateRef as m } from "vue";
+import { ElCol as h, rowContextKey as g } from "element-plus";
+//#region src/components/form/props/form-item.js
+var _ = {
+	prop: [String, Array],
+	label: String,
+	labelPosition: {
+		type: String,
+		default: ""
+	},
+	labelWidth: [String, Number],
+	required: {
+		type: Boolean,
+		default: !1
+	},
+	rules: Object,
+	error: String,
+	showMessage: {
+		type: Boolean,
+		default: !0
+	},
+	inlineMessage: {
+		type: Boolean,
+		default: !1
+	},
+	size: String,
+	for: String,
+	validateStatus: String,
+	messagePrefix: String,
+	message: String,
+	wrapCol: {
+		type: Boolean,
+		default: !0
+	},
+	fixedSpan: Number,
+	block: Boolean,
+	unwrap: Boolean,
+	half: Boolean,
+	formItemClass: String,
+	hideLabel: Boolean,
+	tips: { type: String },
+	tipsAfterLabel: {
+		type: Boolean,
+		default: !1
+	},
+	labelColspan: [Number, String],
+	inputColspan: [Number, String],
+	labelRowspan: [Number, String],
+	inputRowspan: [Number, String]
+}, v = {
+	required: !0,
+	rules: !0,
+	messagePrefix: !0,
+	message: !0,
+	wrapCol: !0,
+	fixedSpan: !0,
+	block: !0,
+	unwrap: !0,
+	half: !0,
+	formItemClass: !0,
+	hideLabel: !0,
+	tips: !0,
+	tipsAfterLabel: !0,
+	labelColspan: !0,
+	inputColspan: !0,
+	labelRowspan: !0,
+	inputRowspan: !0
+}, y = (e) => _[e] !== void 0 && v[e] !== !0, b = (e, { emit: t, events: n, predicate: i }) => s(() => r(e, i, n, t)), x = {
+	span: {
+		type: Number,
+		default: 12
+	},
+	offset: {
+		type: Number,
+		default: 0
+	},
+	push: {
+		type: Number,
+		default: 0
+	},
+	pull: {
+		type: Number,
+		default: 0
+	},
+	xs: { type: [Number, Object] },
+	sm: { type: [Number, Object] },
+	md: { type: [Number, Object] },
+	lg: { type: [Number, Object] },
+	xl: { type: [Number, Object] },
+	tag: {
+		type: String,
+		default: "div"
+	}
+}, S = { span: !0 }, C = (e) => x[e] !== void 0 && S[e] !== !0, w = (e, { emit: t, events: n, predicate: i }) => s(() => r(e, i, n, t)), T = (t) => {
+	let n = u(e, null);
+	return s(() => t.required === !0 ? !0 : (n == null ? void 0 : n.requiredFieldsMap[t.prop]) === !0);
+}, E = (e, { rules: t, attrs: n, messagePrefix: r, message: i } = {}) => {
+	let a = T(e);
+	return s(() => {
+		let o = { message: i }, s = p(t);
+		return Object.keys({
+			..._,
+			...x
+		}).forEach((t) => {
+			t === "rules" ? e[t] && s ? o[t] = [...e[t], ...s] : e[t] ? o[t] = e[t] : s && (o[t] = s) : t === "messagePrefix" ? o[t] = e.messagePrefix || r : o[t] = e[t];
+		}), o.required = a.value, o.class = n == null ? void 0 : n.class, o.style = n == null ? void 0 : n.style, o;
+	});
+}, D = {
+	name: "FormItemX",
+	inheritAttrs: !1,
+	props: {
+		..._,
+		...x
+	},
+	setup(n, { attrs: r, slots: l, expose: p }) {
+		let h = u(g, null), _ = u(t, null), v = u(e, null), x = r.embed ? s(() => r.disabled) : k(n), S = b(n, { predicate: y }), E = w(n, { predicate: C }), D = s(() => (_ == null ? void 0 : _.reactive) === !0 && _.block === !1 && n.fixedSpan === void 0 && !n.half), O = T(n), A = m("formItem"), j = s(() => (_ == null ? void 0 : _.wrapCol) === !1 ? !1 : !!h && n.wrapCol), M = s(() => v != null && v.tableForm ? "" : _ != null && _.block ? "100%" : n.half && j.value ? `calc(50% - ${h.gutter.value / 2}px)` : ""), N = s(() => (_ == null ? void 0 : _.block) === !0 || n.block || n.half ? 24 : n.span), P = s(() => {
+			if (x.value) return [];
+			if (O.value) {
+				let e = {
+					required: !0,
+					message: n.message || `${n.messagePrefix || "请输入"}${n.label}`
+				};
+				return n.rules ? [...n.rules, e] : [e];
+			}
+			return n.rules;
+		});
+		return p({
+			clearValidate: async () => {
+				var e;
+				await f(), (e = A.value) == null || e.clearValidate();
+			},
+			validate: async () => {
+				var e;
+				await f(), (e = A.value) == null || e.validate();
+			}
+		}), () => {
+			var e;
+			let t = l.tips || n.tips, r = t ? c(o, {
+				effect: "light",
+				content: n.tips,
+				offset: 4
+			}, {
+				default: () => c("i", { class: "el-icon-info form-item-input-info" }, null),
+				content: l.tips ? l.tips : null
+			}) : null, s = c(a, d(S.value, {
+				ref: "formItem",
+				style: { width: M.value },
+				class: [
+					"form-item",
+					n.formItemClass,
+					{
+						"form-item-hide-label": n.hideLabel,
+						"with-tips": !n.tipsAfterLabel && t,
+						required: x.value === !1 && O.value
+					}
+				],
+				rules: P.value
+			}), {
+				...l,
+				default: () => {
+					var e;
+					return [(e = l.default) == null ? void 0 : e.call(l, {
+						disabled: x.value,
+						required: O.value
+					}), t && !n.tipsAfterLabel ? r : null];
+				},
+				label: () => [l.label ? l.label() : n.label, n.tipsAfterLabel ? r : null]
+			}), u = [s, (e = l.below) == null ? void 0 : e.call(l)];
+			return n.unwrap ? u : j.value ? c(i, d(E.value, D.value ? {
+				xs: 24,
+				sm: 12,
+				md: 12,
+				lg: 8,
+				xl: 6
+			} : {}, { span: N.value }), { default: () => u }) : s;
+		};
+	}
+}, O = "update:modelValue", k = (t) => {
+	let r = u(e, null), i = u(n, null);
+	return s(() => {
+		if (t.disabled !== void 0) return t.disabled;
+		if (r) {
+			if (r.requiredFieldsMap[t.prop] === !0 || r.enabledFieldsMap[t.prop] === !0) return !1;
+			if (r.disabledFieldsMap[t.prop] === !0) return !0;
+		}
+		return (i == null ? void 0 : i.enabled) === !0 ? !1 : (i == null ? void 0 : i.disabled) === !0 ? !0 : (r == null ? void 0 : r.disabled) === !0;
+	});
+}, A = { [O]: null }, j = (e, t) => e(O, t), M = (e, { vNodes: t, formItemProps: n, slots: r, disabled: i }) => e.wrapFormItem ? l(D, {
+	...n.value,
+	embed: !0,
+	disabled: i == null ? void 0 : i.value
+}, {
+	default: () => t,
+	label: r.label,
+	error: r.error,
+	tips: r.tips,
+	below: r.below
+}) : t, N = (e, { emit: t, slots: n, attrs: i, rules: a, events: o, predicate: c, messagePrefix: u = "请输入" }) => {
+	let d = k(e), f = s(() => d.value ? "" : `${u}${e.label}`), p = E(e, {
+		rules: a,
+		attrs: i,
+		message: f.value
+	}), m = (e) => j(t, e), g = (t) => e.col ? l(h, { span: e.block ? 24 : e.span }, { default: () => t }) : t;
+	return {
+		emitInput: m,
+		render: ({ vNodes: t }) => M(e, {
+			vNodes: g(t),
+			formItemProps: p,
+			slots: n,
+			disabled: d
+		}),
+		placeholder: f,
+		disabled: d,
+		formItemProps: p,
+		autoBind: s(() => r(e, c, o, t))
+	};
+}, P = (e) => e.icon ? l("i", { class: e.icon }) : null;
+//#endregion
+export { D as a, _ as c, N as i, A as n, E as o, M as r, x as s, P as t };

package/chunks/CJeq96R0.mjs

@@ -0,0 +1,73 @@
+import { i as e, n as t, t as n } from "./C1DlzLpD.mjs";
+import { n as r, r as i, t as a } from "./B3DY36vM.mjs";
+import { ElInput as o } from "element-plus/es";
+import { computed as s, createVNode as c, mergeProps as l, useModel as u } from "vue";
+import { validatePhoneNum as d } from "@web-utils/core";
+//#region src/util/form-validate.js
+var f = (e, t, n) => t && !/^[A-Za-z0-9\u4e00-\u9fa5_-]+@[a-zA-Z0-9_-]+(\.[a-zA-Z0-9_-]+)+$/.test(t) ? n(/* @__PURE__ */ Error("invalid")) : n();
+function p(e, t, n) {
+	t && !/^[1-9][0-9]{5}(18|19|(2[0-9]))[0-9]{2}((0[1-9])|(10|11|12))(([0-2][1-9])|10|20|30|31)[0-9]{3}[0-9Xx]$/.test(t) ? n(/* @__PURE__ */ Error("invalid")) : n();
+}
+//#endregion
+//#region src/components/form/FormInput.vue
+var m = {
+	name: "FormInput",
+	inheritAttrs: !1,
+	props: { ...a },
+	emits: {
+		...t,
+		click: null,
+		blur: null,
+		focus: null,
+		change: null,
+		input: null,
+		clear: null,
+		keydown: null,
+		mouseleave: null,
+		mouseenter: null,
+		compositionstart: null,
+		compositionupdate: null,
+		compositionend: null
+	},
+	setup(t, { emit: a, slots: m, attrs: h }) {
+		let g = u(t, "modelValue"), _ = `请输入正确的${t.label}！`, { render: v, placeholder: y, disabled: b, autoBind: x } = e(t, {
+			emit: a,
+			slots: m,
+			attrs: h,
+			rules: s(() => {
+				if (!t.type || t.type === "textarea") return null;
+				let e = {
+					message: _,
+					trigger: "blur"
+				};
+				if (t.type === "email") e.validator = f;
+				else if (t.type === "idcard") e.validator = p;
+				else if (t.type === "phone") e.validator = d;
+				else return null;
+				return [e];
+			}),
+			events: r,
+			predicate: i
+		});
+		return () => v({ vNodes: c(o, l({ class: ["form-input", {
+			"is-readonly": t.readonlyGrey && t.readonly && !t.picker,
+			"el-input-cursor-pointer": t.picker && !b.value
+		}] }, x.value, {
+			modelValue: g.value,
+			"onUpdate:modelValue": (e) => g.value = e,
+			disabled: b.value,
+			placeholder: y.value,
+			readonly: t.readonly || t.picker,
+			"prefix-icon": n({ icon: t.picker ? "el-icon-search" : t.prefixIcon }),
+			"suffix-icon": n({ icon: t.suffixIcon })
+		}), {
+			prefix: m.prefix || t.prefix ? () => t.prefix : null,
+			suffix: m.suffix || t.suffix ? () => t.suffix : null,
+			"password-icon": m["password-icon"],
+			prepend: m.prepend || t.prepend ? () => t.prepend : null,
+			append: m.append || t.append ? () => t.append : null
+		}) });
+	}
+};
+//#endregion
+export { m as t };

package/chunks/CPE8fqJc.mjs

@@ -0,0 +1,26 @@
+import { n as e } from "./C1DlzLpD.mjs";
+import { t } from "./CJeq96R0.mjs";
+import { t as n } from "./B3DY36vM.mjs";
+import { createVNode as r, isVNode as i, mergeProps as a, useModel as o } from "vue";
+//#region src/components/form/FormInputPhoneNumber.vue?vue&type=script&lang.jsx
+function s(e) {
+	return typeof e == "function" || Object.prototype.toString.call(e) === "[object Object]" && !i(e);
+}
+//#endregion
+//#region src/components/form/FormInputPhoneNumber.vue
+var c = {
+	name: "FormInputPhoneNumber",
+	inheritAttrs: !1,
+	props: { ...n },
+	emits: { ...e },
+	setup(e, { slots: n, attrs: i }) {
+		let c = o(e, "modelValue");
+		return () => r(t, a(e, i, {
+			modelValue: c.value,
+			"onUpdate:modelValue": (e) => c.value = e,
+			type: "phone"
+		}), s(n) ? n : { default: () => [n] });
+	}
+};
+//#endregion
+export { c as t };