@rytass/bpm-core-react 0.10.0 → 0.12.0

package/dist/chunks/FormRendererView-D8QHLvd0.js

@@ -1,577 +0,0 @@
-"use client";
-import { t as e } from "./bpm-form-field-Cao0rMol.js";
-import { useCallback as t, useEffect as n, useMemo as r, useRef as i, useState as a } from "react";
-import { AutoComplete as o, Button as s, CheckboxGroup as c, DatePicker as l, DateTimePicker as u, Input as d, RadioGroup as f, Select as p, Textarea as m, Toggle as h, Typography as g, Upload as _ } from "@mezzanine-ui/react";
-import { jsx as v, jsxs as y } from "react/jsx-runtime";
-import { buildFormRendererValues as b, clampOptionalNumber as x, formatDatePickerValue as S, formatDateTimePickerValue as C, isFormRendererFieldReadonly as w, isFormRendererFieldRequired as T, mergeFormDataSourceOptions as E, parseOptionalNumberInput as D, previewFormFieldOptions as ee, previewResolveFormFieldOptions as te, readDatePickerValue as O, readFieldOptionAsSelectOption as k, readFormDataSourceErrorCode as ne, readFormDataSourceErrorMessage as re, readFormDataSourceSelectedValues as ie, readFormDataSourceValueSignature as A, readFormFieldOptions as ae, readMissingFormDataSourceDependencies as oe, readMissingFormDataSourceOptionValues as j, readSelectOption as M, readSelectedFormDataSourceOptions as N, readVisibleFormRendererFields as se, resolveFormFieldOptions as ce } from "@rytass/bpm-core-client/form";
-import { isFormDataSourceFieldDefinition as le, isFormStaticOptionFieldDefinition as P, readFormFieldSelectionMode as F } from "@rytass/bpm-core-shared/form";
-//#region src/views/forms/renderer/form-data-source-field.ts
-var ue = {
-	canRetry: !1,
-	error: null,
-	hasValue: !1,
-	hasNextPage: !1,
-	invalidValues: [],
-	onReachBottom: () => void 0,
-	onSearch: () => void 0,
-	options: [],
-	retry: () => void 0,
-	status: "IDLE"
-}, I = [], de = 10, fe = ["FORM_DATA_SOURCE_SEARCH_NOT_SUPPORTED", "FORM_DATA_SOURCE_SEARCH_TOO_SHORT"];
-function L(e) {
-	let o = le(e.field) ? e.field : null, s = o ? e.optionSnapshots?.[o.fieldKey] : void 0, c = o ? JSON.stringify({
-		dataSource: o.dataSource,
-		fieldKey: o.fieldKey,
-		type: o.type
-	}) : "", l = JSON.stringify(s ?? null), u = r(() => s?.options ?? [], [l]), d = JSON.stringify(e.formData), f = JSON.stringify(e.initialFormData ?? {}), p = JSON.stringify(e.schema), m = JSON.stringify(e.uiSchema), h = e.context?.kind, g = e.context?.kind === "runtime" ? e.context.instanceId : void 0, _ = e.context?.kind === "runtime" ? e.context.templateId : void 0, v = o ? e.formData[o.fieldKey] : void 0, y = A(v), b = r(() => ie(v), [y]), x = b.length > 0, S = o ? JSON.stringify({
-		bindings: o.dataSource.bindings.map((t) => t.from.kind === "FIELD" ? {
-			fieldKey: t.from.fieldKey,
-			value: e.formData[t.from.fieldKey]
-		} : { value: t.from.value }),
-		value: e.initialFormData !== void 0 || e.initialValue !== void 0 ? e.formData[o.fieldKey] : void 0
-	}) : "", C = r(() => {
-		if (h === "preview") return { kind: "preview" };
-		if (h === "runtime" && !e.readonly) return {
-			instanceId: g,
-			kind: "runtime",
-			templateId: _
-		};
-	}, [
-		g,
-		h,
-		_,
-		e.readonly
-	]), w = o ? (e.initialFormData !== void 0 || e.initialValue !== void 0) && A(e.initialValue) !== y : !1, T = o ? e.initialFormData !== void 0 && o.dataSource.bindings.some((t) => t.from.kind === "FIELD" ? A(e.initialFormData?.[t.from.fieldKey]) !== A(e.formData[t.from.fieldKey]) : !1) : !1, D = !!((s || x) && (w || T)), O = !!(o && C && D && x), k = he({
-		hasSnapshot: !!s,
-		hasValue: x,
-		isStale: D,
-		readonly: e.readonly
-	}), j = !!(o && C && o.type !== "autocomplete"), M = ge(D, j && o !== null && oe(o, e.formData).length > 0), [se, P] = a([]), [F, I] = a(""), [L, R] = a(null), [z, pe] = a(null), [ye, V] = a(() => o ? j ? M : k : "IDLE"), [be, H] = a(null), U = i(0), W = i(0), G = i(0), K = i(null), q = i(null), J = i({
-		cursor: null,
-		searchText: ""
-	}), Y = r(() => Object.entries(e.formData).reduce((e, [t, n]) => n === void 0 ? e : {
-		...e,
-		[t]: n
-	}, {}), [d]), X = r(() => E(u, se), [se, u]), Z = z && z.signature === S ? z : null, xe = O && !Z, Q = me({
-		options: X,
-		resolution: Z,
-		resolvePending: xe,
-		value: v
-	}), $ = t((t, n) => {
-		if (!o || !C) return;
-		let r = W.current + 1;
-		W.current = r, J.current = {
-			cursor: n,
-			searchText: t
-		}, K.current?.abort();
-		let i = new AbortController();
-		K.current = i, V(M), H(null), (C.kind === "preview" ? ee({
-			cursor: n,
-			fieldKey: o.fieldKey,
-			formData: Y,
-			schema: e.schema,
-			searchText: t,
-			signal: i.signal,
-			uiSchema: e.uiSchema
-		}) : ae({
-			cursor: n,
-			fieldKey: o.fieldKey,
-			formData: Y,
-			instanceId: C.instanceId ?? null,
-			searchText: t,
-			signal: i.signal,
-			templateId: C.templateId ?? null
-		})).then((a) => {
-			B(i, W, r) || (P((t) => E(N(o ? e.formData[o.fieldKey] : void 0, t), n ? t : [], a.options)), R(a.nextCursor), H(null), U.current = n ? U.current + a.options.length : a.options.length, a.nextCursor && a.options.length > 0 && U.current < de && Se.current(t, a.nextCursor), V(a.waitingForFieldKeys.length ? "WAITING_FOR_DEPENDENCIES" : "VALID"));
-		}).catch((e) => {
-			if (B(i, W, r)) return;
-			let t = re(e) ?? "選項來源暫時無法使用。", n = ne(e);
-			H(t), V(_e(!!(n && fe.includes(n)), x));
-		});
-	}, [
-		c,
-		C,
-		x,
-		M,
-		Y,
-		p,
-		m
-	]), Se = i($);
-	Se.current = $;
-	let Ce = t(() => {
-		if (!o || !C || b.length === 0) return;
-		let t = S, n = G.current + 1;
-		G.current = n, q.current?.abort();
-		let r = new AbortController();
-		q.current = r, H(null), (C.kind === "preview" ? te({
-			fieldKey: o.fieldKey,
-			formData: Y,
-			schema: e.schema,
-			signal: r.signal,
-			uiSchema: e.uiSchema,
-			values: b
-		}) : ce({
-			fieldKey: o.fieldKey,
-			formData: Y,
-			instanceId: C.instanceId ?? null,
-			signal: r.signal,
-			templateId: C.templateId ?? null,
-			values: b
-		})).then((e) => {
-			if (!B(r, G, n)) {
-				if (e.waitingForFieldKeys.length) {
-					V("WAITING_FOR_DEPENDENCIES");
-					return;
-				}
-				P((t) => E(t, e.options)), pe({
-					signature: t,
-					unresolvedValues: e.unresolvedValues
-				}), V("VALID");
-			}
-		}).catch((e) => {
-			B(r, G, n) || (V("UNAVAILABLE"), H(re(e) ?? "選項來源暫時無法使用。"));
-		});
-	}, [
-		S,
-		c,
-		C,
-		Y,
-		p,
-		b,
-		m
-	]), we = i(Ce);
-	we.current = Ce, n(() => {
-		if (W.current += 1, K.current?.abort(), P((e) => N(v, e)), R((e) => e === null ? e : null), I((e) => e && ""), H((e) => e && null), !o) {
-			V("IDLE");
-			return;
-		}
-		if (!j) {
-			V(k);
-			return;
-		}
-		Se.current("", null);
-	}, [
-		j,
-		c,
-		C,
-		S,
-		f,
-		e.readonly,
-		M,
-		k,
-		l
-	]), n(() => {
-		O && we.current();
-	}, [
-		S,
-		C,
-		O
-	]), n(() => () => {
-		K.current?.abort(), q.current?.abort();
-	}, []);
-	let Te = t((e) => {
-		I(e), P((e) => N(v, e)), R(null), $(e, null);
-	}, [$]), Ee = t(() => {
-		L && $(F, L);
-	}, [
-		$,
-		L,
-		F
-	]), De = t(() => {
-		C && ($(J.current.searchText, J.current.cursor), O && we.current());
-	}, [
-		C,
-		$,
-		O
-	]);
-	return o ? {
-		canRetry: !!C,
-		error: be,
-		hasValue: x,
-		hasNextPage: !!L,
-		invalidValues: Q,
-		onReachBottom: Ee,
-		onSearch: Te,
-		options: X,
-		retry: De,
-		status: ve({
-			invalidValues: Q,
-			resolvePending: xe,
-			status: ye
-		})
-	} : ue;
-}
-function R(e) {
-	switch (e.status) {
-		case "WAITING_FOR_DEPENDENCIES": return "請先填寫相依欄位。";
-		case "STALE": return "選項需要重新載入或驗證。";
-		case "INVALID": return e.invalidValues.length ? `無法辨識選項：${e.invalidValues.join("、")}` : "目前選項已失效，請重新選擇。";
-		case "UNAVAILABLE": return e.error ?? "選項來源暫時無法使用。";
-		case "VALID": return e.error ?? (e.options.length ? null : "目前沒有可用選項。");
-		default: return e.error;
-	}
-}
-function z(e) {
-	return e.hasValue && e.status !== "VALID";
-}
-function pe(e) {
-	let t = e.filter(z);
-	return t.length === 0 ? null : t.every((e) => e.status === "LOADING" || e.status === "STALE") ? "選項驗證中，請稍候再送出。" : "請先完成動態選項驗證。";
-}
-function me(e) {
-	return e.resolution ? e.resolution.unresolvedValues : e.resolvePending ? I : j(e.value, e.options);
-}
-function he(e) {
-	return e.isStale ? "STALE" : e.hasSnapshot ? "VALID" : e.readonly && e.hasValue ? "UNAVAILABLE" : "IDLE";
-}
-function ge(e, t) {
-	return t ? "WAITING_FOR_DEPENDENCIES" : e ? "STALE" : "LOADING";
-}
-function _e(e, t) {
-	return e ? t ? "VALID" : "IDLE" : "UNAVAILABLE";
-}
-function ve(e) {
-	return e.status === "LOADING" || e.status === "UNAVAILABLE" || e.status === "WAITING_FOR_DEPENDENCIES" ? e.status : e.invalidValues.length ? "INVALID" : e.resolvePending ? "STALE" : e.status;
-}
-function B(e, t, n) {
-	return e.signal.aborted || t.current !== n;
-}
-//#endregion
-//#region src/views/forms/renderer/FormRendererView.tsx
-var ye = {
-	alignItems: "start",
-	display: "grid",
-	gap: 12,
-	gridTemplateColumns: "repeat(12, minmax(0, 1fr))"
-}, V = { gridColumn: "1 / -1" }, be = {
-	alignItems: "start",
-	display: "grid",
-	gap: 8,
-	minWidth: 0
-}, H = {
-	minWidth: "100%",
-	width: "100%"
-};
-function U(e) {
-	e && (e.style.width = "100%");
-}
-function W({ dataSourceContext: e, dataSourceInitialValues: t, emptyText: o = "尚未建立欄位。", errors: s = {}, maxWidth: c, onChange: l, onDataSourceStateChange: u, onUploadAttachment: d, optionSnapshots: f, readonly: p = !1, schema: m, singleColumn: h = !1, uiSchema: _, value: y }) {
-	let [x, S] = a(() => b(m.fields, y ?? {})), C = r(() => b(m.fields, y ?? x), [
-		x,
-		m.fields,
-		y
-	]), w = i(C), T = r(() => se(m, _, C), [
-		m,
-		_,
-		C
-	]);
-	n(() => {
-		w.current = C;
-	}, [C]), n(() => {
-		S((e) => b(m.fields, y ?? e));
-	}, [m.fields, y]);
-	function E(e, t) {
-		let n = {
-			...w.current,
-			[e]: t
-		};
-		w.current = n, y || S(n), l?.(n);
-	}
-	return T.length ? /* @__PURE__ */ v("div", {
-		style: {
-			...ye,
-			...h ? {
-				maxWidth: c,
-				width: "100%"
-			} : {}
-		},
-		children: T.map((n) => /* @__PURE__ */ v(G, {
-			dataSourceContext: e,
-			dataSourceInitialValues: t,
-			field: n,
-			error: s[n.fieldKey] ?? null,
-			fields: m.fields,
-			onChange: E,
-			onDataSourceStateChange: u,
-			onUploadAttachment: d,
-			optionSnapshots: f,
-			readonly: p,
-			schema: m,
-			style: {
-				...be,
-				gridColumn: `span ${h ? 12 : Y(n, _)}`
-			},
-			value: C[n.fieldKey],
-			values: C,
-			uiSchema: _
-		}, n.fieldKey))
-	}) : /* @__PURE__ */ v("div", {
-		style: ye,
-		children: /* @__PURE__ */ v(g, {
-			color: "text-neutral",
-			style: V,
-			variant: "body",
-			children: m.fields.length > 0 ? "目前條件下沒有可填寫欄位。" : o
-		})
-	});
-}
-function G({ dataSourceContext: t, dataSourceInitialValues: r, error: i, field: a, fields: o, onChange: c, onDataSourceStateChange: l, onUploadAttachment: u, optionSnapshots: d, readonly: f, schema: p, style: m, value: h, values: _, uiSchema: b }) {
-	let x = T(a, o, _), S = f || w(a, o, _), C = L({
-		context: t,
-		field: a,
-		formData: _,
-		initialFormData: r,
-		initialValue: r?.[a.fieldKey],
-		optionSnapshots: d,
-		readonly: S,
-		schema: p,
-		uiSchema: b
-	}), E = R(C);
-	return n(() => {
-		le(a) && l?.(a.fieldKey, {
-			hasValue: C.hasValue,
-			invalidValues: C.invalidValues,
-			status: C.status
-		});
-	}, [
-		JSON.stringify({
-			hasValue: C.hasValue,
-			invalidValues: C.invalidValues,
-			status: C.status
-		}),
-		a.fieldKey,
-		l
-	]), /* @__PURE__ */ y("div", {
-		"data-form-field-key": a.fieldKey,
-		style: m,
-		children: [
-			/* @__PURE__ */ v(e, {
-				label: a.label,
-				name: a.fieldKey,
-				required: x,
-				children: q(a, h, S, c, u, t, C)
-			}),
-			i ? /* @__PURE__ */ v(g, {
-				color: "text-error",
-				variant: "caption",
-				children: i
-			}) : null,
-			E ? /* @__PURE__ */ y("div", {
-				style: K,
-				children: [/* @__PURE__ */ v(g, {
-					color: C.status === "INVALID" || C.status === "UNAVAILABLE" ? "text-error" : "text-neutral",
-					variant: "caption",
-					children: E
-				}), C.status === "UNAVAILABLE" && C.canRetry ? /* @__PURE__ */ v(s, {
-					onClick: C.retry,
-					size: "sub",
-					type: "button",
-					variant: "base-ghost",
-					children: "重試"
-				}) : null]
-			}) : null
-		]
-	});
-}
-var K = {
-	alignItems: "center",
-	display: "flex",
-	gap: 8
-};
-function q(e, t, n, r, i, a, o) {
-	if (e.type === "textarea") return /* @__PURE__ */ v(m, {
-		onChange: (t) => r(e.fieldKey, t.target.value),
-		placeholder: e.placeholder ?? "請輸入多行文字",
-		readOnly: n,
-		ref: U,
-		rows: 3,
-		style: H,
-		value: X(t)
-	});
-	if (e.type === "boolean") return /* @__PURE__ */ v(h, {
-		checked: t === !0,
-		disabled: n,
-		label: "啟用",
-		onChange: (t) => r(e.fieldKey, t.target.checked)
-	});
-	if (le(e)) return J(e, t, n, r, a, o);
-	if (P(e) && e.type === "checkbox") {
-		let i = e.options.map(k);
-		return /* @__PURE__ */ v(p, {
-			mode: "multiple",
-			onChange: (t) => r(e.fieldKey, t?.length ? t.map((e) => e.id) : void 0),
-			options: i,
-			placeholder: e.placeholder ?? "請選擇一或多個選項",
-			readOnly: n,
-			value: i.filter((e) => Z(t).includes(e.id))
-		});
-	}
-	if (P(e)) {
-		let i = e.options.map(k);
-		return /* @__PURE__ */ v(p, {
-			onChange: (t) => r(e.fieldKey, t?.id ?? void 0),
-			options: i,
-			placeholder: e.placeholder ?? "請選擇",
-			readOnly: n,
-			value: M(i, X(t))
-		});
-	}
-	return e.type === "file_upload" ? /* @__PURE__ */ v(_, {
-		accept: e.acceptedMimeTypes?.join(","),
-		disabled: n,
-		maxFiles: e.maxFiles,
-		mode: "button-list",
-		...(e.maxFiles ?? 1) > 1 ? { multiple: !0 } : {},
-		onChange: (t) => r(e.fieldKey, t.length ? t.map((e) => e.id) : void 0),
-		onUpload: async (t) => Promise.all(t.map(async (t) => ({
-			file: t,
-			id: (i ? await i(e, t) : { id: `${t.name}-${t.lastModified}` }).id,
-			progress: 100,
-			status: "done"
-		}))),
-		size: "sub"
-	}) : e.type === "date" ? /* @__PURE__ */ v(l, {
-		format: "YYYY-MM-DD",
-		fullWidth: !0,
-		onChange: (t) => r(e.fieldKey, S(t)),
-		placeholder: e.placeholder ?? Q(e.type),
-		readOnly: n,
-		value: O(t)
-	}) : e.type === "datetime" ? /* @__PURE__ */ v(u, {
-		formatDate: "YYYY-MM-DD",
-		formatTime: "HH:mm",
-		fullWidth: !0,
-		hideSecond: !0,
-		onChange: (t) => r(e.fieldKey, C(t)),
-		placeholderLeft: "選擇日期",
-		placeholderRight: "選擇時間",
-		readOnly: n,
-		value: O(t)
-	}) : e.type === "number" || e.type === "money" ? /* @__PURE__ */ v(d, {
-		fullWidth: !0,
-		max: e.maximum,
-		min: e.minimum,
-		onChange: (t) => r(e.fieldKey, x(D(t.target.value), {
-			max: e.maximum,
-			min: e.minimum
-		})),
-		placeholder: e.placeholder ?? Q(e.type),
-		...n ? { readonly: !0 } : {},
-		showSpinner: !0,
-		value: xe(t),
-		variant: "measure"
-	}) : /* @__PURE__ */ v(d, {
-		fullWidth: !0,
-		onChange: (t) => r(e.fieldKey, t.target.value),
-		placeholder: e.placeholder ?? Q(e.type),
-		...n ? { readonly: !0 } : {},
-		value: X(t),
-		variant: "base"
-	});
-}
-function J(e, t, n, r, i, a) {
-	let s = a.options.map(k), l = N(t, a.options).map(k), u = a.status === "LOADING", d = a.status === "WAITING_FOR_DEPENDENCIES", m = !!i && !n, h = n || d, g = n;
-	return e.type === "autocomplete" ? F(e) === "multiple" ? /* @__PURE__ */ v(o, {
-		asyncData: m,
-		clearSearchText: !0,
-		disabled: g,
-		disabledOptionsFilter: m,
-		globalPortal: !0,
-		loading: u,
-		mode: "multiple",
-		onChange: (t) => r(e.fieldKey, t.length ? t.map((e) => e.id) : void 0),
-		onReachBottom: a.hasNextPage ? a.onReachBottom : void 0,
-		onSearch: m ? a.onSearch : void 0,
-		options: s,
-		placeholder: e.placeholder ?? "請輸入或選擇",
-		readOnly: n,
-		searchDebounceTime: 300,
-		value: l
-	}) : /* @__PURE__ */ v(o, {
-		asyncData: m,
-		clearSearchText: !0,
-		disabled: g,
-		disabledOptionsFilter: m,
-		globalPortal: !0,
-		loading: u,
-		mode: "single",
-		onChange: (t) => r(e.fieldKey, t?.id ?? void 0),
-		onReachBottom: a.hasNextPage ? a.onReachBottom : void 0,
-		onSearch: m ? a.onSearch : void 0,
-		options: s,
-		placeholder: e.placeholder ?? "請輸入或選擇",
-		readOnly: n,
-		searchDebounceTime: 300,
-		value: l[0] ?? null
-	}) : e.type === "radio" ? /* @__PURE__ */ v(f, {
-		disabled: h,
-		name: e.fieldKey,
-		onChange: (t) => r(e.fieldKey, t.target.value || void 0),
-		options: s,
-		value: X(t)
-	}) : e.type === "checkbox" ? /* @__PURE__ */ v(c, {
-		disabled: h,
-		name: e.fieldKey,
-		onChange: (t) => r(e.fieldKey, t.target.values.length ? t.target.values : void 0),
-		options: s.map((e) => ({
-			label: e.name,
-			value: e.id
-		})),
-		value: [...Z(t)]
-	}) : F(e) === "multiple" ? /* @__PURE__ */ v(p, {
-		disabled: h,
-		loading: u,
-		mode: "multiple",
-		onChange: (t) => r(e.fieldKey, t.length ? t.map((e) => e.id) : void 0),
-		onReachBottom: a.hasNextPage ? a.onReachBottom : void 0,
-		options: s,
-		placeholder: e.placeholder ?? "請選擇一或多個選項",
-		readOnly: n,
-		value: l
-	}) : /* @__PURE__ */ v(p, {
-		disabled: h,
-		loading: u,
-		onChange: (t) => r(e.fieldKey, t?.id ?? void 0),
-		onReachBottom: a.hasNextPage ? a.onReachBottom : void 0,
-		options: s,
-		placeholder: e.placeholder ?? "請選擇",
-		readOnly: n,
-		value: l[0] ?? null
-	});
-}
-function Y(e, t) {
-	return {
-		FULL: 12,
-		HALF: 6,
-		THIRD: 4
-	}[t.layout.find((t) => t.fieldKey === e.fieldKey)?.width ?? "FULL"];
-}
-function X(e) {
-	return typeof e == "string" ? e : "";
-}
-function Z(e) {
-	return Array.isArray(e) ? e : [];
-}
-function xe(e) {
-	return typeof e == "number" ? String(e) : "";
-}
-function Q(e) {
-	return {
-		boolean: "",
-		autocomplete: "請輸入或選擇",
-		checkbox: "請選擇一或多個選項",
-		date: "請選擇日期",
-		datetime: "請選擇日期與時間",
-		file_upload: "請上傳附件",
-		money: "請輸入金額",
-		number: "請輸入數字",
-		radio: "請選擇一個選項",
-		select: "請選擇一個選項",
-		text: "請輸入文字",
-		textarea: "請輸入多行文字"
-	}[e];
-}
-//#endregion
-export { L as a, pe as i, z as n, R as r, W as t };
-
-//# sourceMappingURL=FormRendererView-D8QHLvd0.js.map