@declarion/react 0.65.1 → 0.66.1

package/dist-lib/components/fields/FileReferenceField.js

@@ -0,0 +1,60 @@
+import { extractPkValues as e } from "../../types/schema.js";
+import { Btn as t } from "../primitives/Btn.js";
+import { useText as n } from "../../hooks/useText.js";
+import { saveBlob as r } from "../../lib/download.js";
+import { failureTitle as i } from "../../lib/failure.js";
+import { readFileReference as a } from "../../api/fileReferences.js";
+import { useState as o } from "react";
+import { jsx as s, jsxs as c } from "react/jsx-runtime";
+//#region src/components/fields/FileReferenceField.tsx
+function l({ entityCode: e, pkValues: l, fieldCode: u, t: d }) {
+	let f = n("errors"), [p, m] = o(!1), [h, g] = o(null);
+	async function _() {
+		if (e && l && !p) {
+			m(!0), g(null);
+			try {
+				let t = await a(e, l, u);
+				r(t.blob, t.filename || `${e}-${u}.bin`);
+			} catch (e) {
+				g(i(f, e));
+			} finally {
+				m(!1);
+			}
+		}
+	}
+	return /* @__PURE__ */ c("span", {
+		style: {
+			display: "inline-flex",
+			flexDirection: "column",
+			alignItems: "flex-start",
+			gap: 4,
+			minWidth: 0
+		},
+		children: [/* @__PURE__ */ s(t, {
+			kind: "ghost",
+			size: "xs",
+			disabled: p || !e || !l,
+			onClick: _,
+			children: d("file.download", "Download")
+		}), h && /* @__PURE__ */ s("span", {
+			role: "alert",
+			style: {
+				color: "var(--danger)",
+				whiteSpace: "normal"
+			},
+			children: h
+		})]
+	});
+}
+function u({ value: t, entityCode: n, entity: r, record: i, fieldName: a, t: o }) {
+	if (typeof t != "string" || t === "") return /* @__PURE__ */ s("span", { children: "—" });
+	let c = r && i ? e(r, i) : void 0, u = c && Object.values(c).every(Boolean) ? c : void 0;
+	return /* @__PURE__ */ s(l, {
+		entityCode: n,
+		pkValues: u,
+		fieldCode: a,
+		t: o
+	});
+}
+//#endregion
+export { u as FileReferenceField, l as FileReferenceValue };

package/dist-lib/components/fields/IntArrayField.js

@@ -0,0 +1,83 @@
+import { Icon as e } from "../primitives/Icons.js";
+import { Btn as t } from "../primitives/Btn.js";
+import { Chip as n } from "../primitives/Chip.js";
+import { TextInput as r } from "../primitives/Fields.js";
+import { useState as i } from "react";
+import { jsx as a, jsxs as o } from "react/jsx-runtime";
+//#region src/components/fields/IntArrayField.tsx
+function s(e) {
+	return Array.isArray(e) ? e.filter((e) => e != null).map(Number).filter((e) => !isNaN(e)) : [];
+}
+function c({ field: c, fieldName: l, value: u, mode: d, onChange: f, fieldId: p, t: m }) {
+	let h = s(u), [g, _] = i("");
+	if (d === "display") return h.length === 0 ? /* @__PURE__ */ a("span", {
+		style: {
+			fontSize: 12.5,
+			color: "var(--text-4)"
+		},
+		children: "—"
+	}) : /* @__PURE__ */ a("div", {
+		style: {
+			display: "flex",
+			flexWrap: "wrap",
+			gap: 4
+		},
+		children: h.map((e, t) => /* @__PURE__ */ a(n, {
+			tone: "slate",
+			children: e
+		}, t))
+	});
+	let v = () => {
+		let e = g.trim();
+		if (!e) return;
+		let t = Number(e);
+		!isNaN(t) && Number.isInteger(t) && (f?.([...h, t]), _(""));
+	}, y = (e) => {
+		f?.(h.filter((t, n) => n !== e));
+	};
+	return /* @__PURE__ */ o("div", {
+		style: {
+			display: "flex",
+			flexDirection: "column",
+			gap: 6
+		},
+		children: [h.length > 0 && /* @__PURE__ */ a("div", {
+			style: {
+				display: "flex",
+				flexWrap: "wrap",
+				gap: 4
+			},
+			children: h.map((e, t) => /* @__PURE__ */ a(n, {
+				tone: "slate",
+				onRemove: () => y(t),
+				children: e
+			}, t))
+		}), /* @__PURE__ */ o("div", {
+			style: {
+				display: "flex",
+				gap: 4
+			},
+			children: [/* @__PURE__ */ a("div", {
+				style: { flex: 1 },
+				children: /* @__PURE__ */ a(r, {
+					id: p,
+					name: l,
+					"aria-required": c.required || void 0,
+					type: "number",
+					value: g,
+					onChange: _,
+					onKeyDown: (e) => {
+						e.key === "Enter" && (e.preventDefault(), v());
+					},
+					placeholder: m("field.array.add_number", "Add number…")
+				})
+			}), /* @__PURE__ */ a(t, {
+				icon: /* @__PURE__ */ a(e.plus, { size: 13 }),
+				onClick: v,
+				children: m("field.array.add", "Add")
+			})]
+		})]
+	});
+}
+//#endregion
+export { c as IntArrayField };

package/dist-lib/components/fields/JsonField.js

@@ -0,0 +1,51 @@
+import { Suspense as e, lazy as t } from "react";
+import { jsx as n } from "react/jsx-runtime";
+//#region src/components/fields/JsonField.tsx
+var r = t(() => import("./JsonEditor.js").then((e) => ({ default: e.JsonEditor })));
+function i() {
+	return /* @__PURE__ */ n("div", { className: "h-20 rounded-md border border-border bg-muted animate-pulse" });
+}
+function a(e) {
+	return e == null ? !0 : typeof e == "string" ? e.trim() === "" : Array.isArray(e) ? e.length === 0 : typeof e == "object" && Object.keys(e).length === 0;
+}
+function o(e) {
+	return Array.isArray(e) && e.every((e) => [
+		"string",
+		"number",
+		"boolean"
+	].includes(typeof e));
+}
+function s({ value: t, mode: s, onChange: c, fieldId: l }) {
+	return s === "display" ? a(t) ? /* @__PURE__ */ n("span", {
+		style: {
+			fontSize: 12.5,
+			color: "var(--text-4)"
+		},
+		children: "—"
+	}) : o(t) ? /* @__PURE__ */ n("ul", {
+		className: "mono",
+		style: {
+			margin: 0,
+			padding: 0,
+			listStyle: "none",
+			fontSize: 12.5,
+			lineHeight: 1.7
+		},
+		children: t.map((e, t) => /* @__PURE__ */ n("li", { children: String(e) }, t))
+	}) : /* @__PURE__ */ n(e, {
+		fallback: /* @__PURE__ */ n(i, {}),
+		children: /* @__PURE__ */ n(r, {
+			value: t,
+			readOnly: !0
+		})
+	}) : /* @__PURE__ */ n(e, {
+		fallback: /* @__PURE__ */ n(i, {}),
+		children: /* @__PURE__ */ n(r, {
+			value: t,
+			onChange: c,
+			id: l
+		})
+	});
+}
+//#endregion
+export { s as JsonField, a as isEmptyJsonValue };

package/dist-lib/components/fields/MultilangArrayField.js

@@ -0,0 +1,56 @@
+import { Icon as e } from "../primitives/Icons.js";
+import { Btn as t } from "../primitives/Btn.js";
+import { IconBtn as n } from "../primitives/IconBtn.js";
+import { Chip as r } from "../primitives/Chip.js";
+import { parseLangMap as i } from "./langMap.js";
+import { MultilangField as a } from "./MultilangField.js";
+import { jsx as o, jsxs as s } from "react/jsx-runtime";
+//#region src/components/fields/MultilangArrayField.tsx
+function c(e) {
+	return Array.isArray(e) ? e.map(i) : [];
+}
+function l(l) {
+	let { value: u, mode: d, onChange: f, fieldId: p, fieldName: m, t: h } = l, g = c(u);
+	if (d === "display") return g.length === 0 ? /* @__PURE__ */ o("span", {
+		className: "text-muted-foreground",
+		children: "—"
+	}) : /* @__PURE__ */ o("div", {
+		className: "flex flex-wrap gap-1",
+		children: g.map((e, t) => /* @__PURE__ */ o(r, {
+			tone: "slate",
+			children: h(e) || "—"
+		}, t))
+	});
+	let _ = (e, t) => {
+		f?.(g.map((n, r) => r === e ? i(t) : n));
+	};
+	return /* @__PURE__ */ s("div", {
+		className: "flex flex-col gap-2",
+		id: p,
+		role: "group",
+		children: [g.map((t, r) => /* @__PURE__ */ s("div", {
+			className: "flex items-start gap-2",
+			children: [/* @__PURE__ */ o("div", {
+				className: "flex-1",
+				children: /* @__PURE__ */ o(a, {
+					...l,
+					fieldId: p ? `${p}-${r}` : void 0,
+					fieldName: m && `${m}.${r}`,
+					value: t,
+					onChange: (e) => _(r, e)
+				})
+			}), /* @__PURE__ */ o(n, {
+				size: 24,
+				icon: /* @__PURE__ */ o(e.trash, { size: 12 }),
+				onClick: () => f?.(g.filter((e, t) => t !== r)),
+				title: h("field.array.remove", "Remove")
+			})]
+		}, r)), /* @__PURE__ */ o("div", { children: /* @__PURE__ */ o(t, {
+			icon: /* @__PURE__ */ o(e.plus, { size: 13 }),
+			onClick: () => f?.([...g, {}]),
+			children: h("field.array.add", "Add")
+		}) })]
+	});
+}
+//#endregion
+export { l as MultilangArrayField };

package/dist-lib/components/fields/MultilangField.js

@@ -0,0 +1,65 @@
+import { useSchema as e } from "../../hooks/useSchema.js";
+import { TextInput as t } from "../primitives/Fields.js";
+import { parseLangMap as n } from "./langMap.js";
+import { jsx as r, jsxs as i } from "react/jsx-runtime";
+//#region src/components/fields/MultilangField.tsx
+function a({ field: a, fieldName: o, value: s, mode: c, onChange: l, fieldId: u, t: d }) {
+	let { data: f } = e(), p = f?.languages ?? [], m = n(s);
+	if (c === "display") {
+		let e = d(m) || "—";
+		return /* @__PURE__ */ r("span", {
+			style: { fontSize: 12.5 },
+			children: e
+		});
+	}
+	let h = (e, t) => {
+		let n = {
+			...m,
+			[e]: t
+		};
+		for (let e of Object.keys(n)) n[e] || delete n[e];
+		l?.(Object.keys(n).length > 0 ? n : null);
+	};
+	return /* @__PURE__ */ r("div", {
+		style: {
+			display: "flex",
+			flexDirection: "column",
+			gap: 6
+		},
+		children: p.map((e, n) => {
+			let s = u ? n === 0 ? u : `${u}-${e.code}` : void 0;
+			return /* @__PURE__ */ i("div", {
+				style: {
+					display: "flex",
+					alignItems: "center",
+					gap: 8
+				},
+				children: [/* @__PURE__ */ r("label", {
+					htmlFor: s,
+					style: {
+						width: 24,
+						fontSize: 10.5,
+						color: "var(--text-3)",
+						textTransform: "uppercase",
+						flexShrink: 0,
+						letterSpacing: "0.04em",
+						fontWeight: 500
+					},
+					children: e.code
+				}), /* @__PURE__ */ r("div", {
+					style: { flex: 1 },
+					children: /* @__PURE__ */ r(t, {
+						id: s,
+						name: o ? `${o}.${e.code}` : void 0,
+						"aria-required": a.required && n === 0 ? !0 : void 0,
+						value: m[e.code] ?? "",
+						onChange: (t) => h(e.code, t),
+						placeholder: d("field.multilang.value", "Value ({language})", { language: e.code })
+					})
+				})]
+			}, e.code);
+		})
+	});
+}
+//#endregion
+export { a as MultilangField };

package/dist-lib/components/fields/MultilangTextField.js

@@ -0,0 +1,65 @@
+import { useSchema as e } from "../../hooks/useSchema.js";
+import { TextArea as t } from "../primitives/Fields.js";
+import { parseLangMap as n } from "./langMap.js";
+import { jsx as r, jsxs as i } from "react/jsx-runtime";
+//#region src/components/fields/MultilangTextField.tsx
+function a({ field: a, fieldName: o, value: s, mode: c, onChange: l, fieldId: u, t: d }) {
+	let { data: f } = e(), p = f?.languages ?? [], m = n(s);
+	if (c === "display") {
+		let e = d(m) || "—";
+		return /* @__PURE__ */ r("p", {
+			style: {
+				fontSize: 12.5,
+				whiteSpace: "pre-wrap",
+				margin: 0
+			},
+			children: e
+		});
+	}
+	let h = (e, t) => {
+		let n = {
+			...m,
+			[e]: t
+		};
+		for (let e of Object.keys(n)) n[e] || delete n[e];
+		l?.(Object.keys(n).length > 0 ? n : null);
+	};
+	return /* @__PURE__ */ r("div", {
+		style: {
+			display: "flex",
+			flexDirection: "column",
+			gap: 10
+		},
+		children: p.map((e, n) => {
+			let s = u ? n === 0 ? u : `${u}-${e.code}` : void 0;
+			return /* @__PURE__ */ i("div", {
+				style: {
+					display: "flex",
+					flexDirection: "column",
+					gap: 4
+				},
+				children: [/* @__PURE__ */ r("label", {
+					htmlFor: s,
+					style: {
+						fontSize: 10.5,
+						color: "var(--text-3)",
+						textTransform: "uppercase",
+						letterSpacing: "0.04em",
+						fontWeight: 500
+					},
+					children: e.code
+				}), /* @__PURE__ */ r(t, {
+					id: s,
+					name: o ? `${o}.${e.code}` : void 0,
+					ariaRequired: a.required && n === 0,
+					value: m[e.code] ?? "",
+					onChange: (t) => h(e.code, t),
+					placeholder: d("field.multilang.value", "Value ({language})", { language: e.code }),
+					rows: 4
+				})]
+			}, e.code);
+		})
+	});
+}
+//#endregion
+export { a as MultilangTextField };

package/dist-lib/components/fields/NumberField.js

@@ -0,0 +1,64 @@
+import { coerceDisplayString as e } from "../../lib/display-value.js";
+import { TextInput as t } from "../primitives/Fields.js";
+import { formatDecimalText as n } from "../../lib/decimal-text.js";
+import { jsx as r, jsxs as i } from "react/jsx-runtime";
+//#region src/components/fields/NumberField.tsx
+function a({ field: a, fieldName: o, value: s, mode: c, onChange: l, record: u, fieldId: d, t: f }) {
+	let p = a.display?.widget === "money", m = a.type === "decimal" || p, h = u?.$units?.[o], g = !h && a.unit ? a.unit.display || a.unit.storage : void 0, _ = h || (g && !g.startsWith("$") ? g : void 0);
+	if (c === "display") {
+		if (s == null) return /* @__PURE__ */ r("span", {
+			style: {
+				fontSize: 12.5,
+				color: "var(--text-4)"
+			},
+			children: "—"
+		});
+		let e;
+		if (m && typeof s == "string") e = n(s, new Intl.NumberFormat(f.language));
+		else {
+			let t = Number(s);
+			e = isNaN(t) ? null : new Intl.NumberFormat(f.language).format(t);
+		}
+		return e == null ? /* @__PURE__ */ r("span", {
+			style: { fontSize: 12.5 },
+			children: "—"
+		}) : /* @__PURE__ */ i("span", {
+			className: "num",
+			style: {
+				fontSize: 12.5,
+				fontVariantNumeric: "tabular-nums"
+			},
+			children: [e, _ && /* @__PURE__ */ r("span", {
+				style: {
+					color: "var(--text-3)",
+					marginLeft: 4
+				},
+				children: _
+			})]
+		});
+	}
+	return m ? /* @__PURE__ */ r(t, {
+		id: d,
+		name: o,
+		"aria-required": a.required || void 0,
+		type: "text",
+		inputMode: "decimal",
+		pattern: "-?\\d*\\.?\\d*",
+		value: s == null ? "" : e(s),
+		onChange: (e) => {
+			e === "" ? l?.(null) : l?.(e);
+		}
+	}) : /* @__PURE__ */ r(t, {
+		id: d,
+		name: o,
+		"aria-required": a.required || void 0,
+		type: "number",
+		step: a.type === "float" ? "0.01" : "1",
+		value: s == null ? "" : e(s),
+		onChange: (e) => {
+			e === "" ? l?.(null) : l?.(a.type === "int" ? parseInt(e, 10) : parseFloat(e));
+		}
+	});
+}
+//#endregion
+export { a as NumberField };

package/dist-lib/components/fields/PasswordField.js

@@ -0,0 +1,34 @@
+import { PasswordInput as e } from "../primitives/Fields.js";
+import { SECRET_SENTINEL as t, holdsSecret as n } from "./secretValue.js";
+import { useState as r } from "react";
+import { jsx as i } from "react/jsx-runtime";
+//#region src/components/fields/PasswordField.tsx
+function a({ field: a, fieldName: o, value: s, mode: c, onChange: l, record: u, fieldId: d, t: f }) {
+	let [p, m] = r(""), h = u !== void 0, g = n(s);
+	return c === "display" ? g ? /* @__PURE__ */ i("span", {
+		className: "mono",
+		style: {
+			fontSize: 12.5,
+			color: "var(--text-3)"
+		},
+		children: f("field.secret.set", "Set")
+	}) : /* @__PURE__ */ i("span", {
+		style: {
+			fontSize: 12.5,
+			color: "var(--text-4)",
+			fontStyle: "italic"
+		},
+		children: f("field.secret.not_set", "Not set")
+	}) : /* @__PURE__ */ i(e, {
+		id: d,
+		name: o,
+		ariaRequired: a.required,
+		value: p,
+		onChange: (e) => {
+			m(e), h && e === "" ? l?.(g ? t : "") : l?.(e);
+		},
+		placeholder: h ? f("field.secret.keep_existing", "Leave blank to keep existing value") : f("field.password.placeholder", "Enter password")
+	});
+}
+//#endregion
+export { a as PasswordField };

package/dist-lib/components/fields/PhoneField.js

@@ -0,0 +1,84 @@
+import { coerceDisplayString as e } from "../../lib/display-value.js";
+import { useLanguage as t } from "../../hooks/useLanguage.js";
+import { useText as n } from "../../hooks/useText.js";
+import { Select as r, TextInput as i } from "../primitives/Fields.js";
+import { flagOf as a, usePhoneLib as o } from "../../lib/phone.js";
+import { useMemo as s, useState as c } from "react";
+import { jsx as l, jsxs as u } from "react/jsx-runtime";
+//#region src/components/fields/PhoneField.tsx
+function d(e, t) {
+	let n = t.startsWith("+") ? e.parsePhoneNumberFromString(t) : void 0;
+	return n?.country ? {
+		country: n.country,
+		national: n.formatNational()
+	} : {
+		country: "",
+		national: t
+	};
+}
+function f(e, t, n) {
+	let r = n.trim();
+	return r === "" ? "" : r.startsWith("+") ? e.parsePhoneNumberFromString(r)?.number ?? r : t ? e.parsePhoneNumberFromString(r, t)?.number ?? `+${e.getCountryCallingCode(t)}${r.replace(/\D/g, "")}` : r;
+}
+function p({ lib: e, value: o, onChange: p, fieldId: m, fieldName: h, required: g }) {
+	let _ = n(), v = t(), y = s(() => d(e, o), [e, o]), [b, x] = c(y.country), [S, C] = c(y.national), w = s(() => {
+		let t = new Intl.DisplayNames([v], { type: "region" });
+		return e.getCountries().map((e) => ({
+			cc: e,
+			name: t.of(e) ?? e
+		})).sort((e, t) => e.name.localeCompare(t.name, v)).map(({ cc: t, name: n }) => ({
+			value: t,
+			label: `${a(t)} ${n} +${e.getCountryCallingCode(t)}`
+		}));
+	}, [e, v]), T = (t, n) => {
+		let r = n.trim(), i = r.startsWith("+") ? e.parsePhoneNumberFromString(r) : void 0;
+		i?.country && (t = i.country), x(t), C(n), p?.(f(e, t, n));
+	}, E = S.trim() !== "" && !S.trim().startsWith("+") && !b;
+	return /* @__PURE__ */ u("div", {
+		className: "flex flex-col gap-1",
+		children: [/* @__PURE__ */ u("div", {
+			className: "flex gap-1.5",
+			children: [/* @__PURE__ */ l("div", {
+				className: "w-44 shrink-0",
+				children: /* @__PURE__ */ l(r, {
+					value: b,
+					options: w,
+					onChange: (e) => T(e, S),
+					placeholder: _("field.phone.country", "Country"),
+					"aria-label": _("field.phone.country", "Country")
+				})
+			}), /* @__PURE__ */ l(i, {
+				id: m,
+				name: h,
+				"aria-required": g || void 0,
+				type: "tel",
+				value: S,
+				onChange: (e) => T(b, e)
+			})]
+		}), E && /* @__PURE__ */ l("span", {
+			role: "alert",
+			className: "text-xs text-destructive",
+			children: _("field.phone.country_missing", "Choose the country of this number.")
+		})]
+	});
+}
+function m({ field: t, fieldName: n, value: r, onChange: a, fieldId: s }) {
+	let c = o(), u = e(r);
+	return c ? /* @__PURE__ */ l(p, {
+		lib: c,
+		value: u,
+		onChange: a,
+		fieldId: s,
+		fieldName: n,
+		required: t.required
+	}) : /* @__PURE__ */ l(i, {
+		id: s,
+		name: n,
+		"aria-required": t.required || void 0,
+		type: "tel",
+		value: u,
+		onChange: (e) => a?.(e)
+	});
+}
+//#endregion
+export { m as PhoneField };

package/dist-lib/components/fields/RefCombobox.js

@@ -0,0 +1,112 @@
+import { coerceDisplayString as e } from "../../lib/display-value.js";
+import { getPrimaryKeyFields as t, resolveRefRecordLabel as n } from "../../types/schema.js";
+import { useText as r } from "../../hooks/useText.js";
+import { Select as i } from "../primitives/Fields.js";
+import { useEntityData as a } from "../../hooks/useEntityData.js";
+import { useEntity as o } from "../../hooks/useEntity.js";
+import { readableFilters as s, readableSort as c } from "../../lib/field-classification.js";
+import { useDebounce as l } from "../../hooks/useDebounce.js";
+import { refChoicesEntity as u } from "../../lib/ref-choices.js";
+import { useMemo as d, useRef as f, useState as p } from "react";
+import { jsx as m } from "react/jsx-runtime";
+//#region src/components/fields/RefCombobox.tsx
+var h = 200;
+function g({ ref: g, value: _, onChange: v, refs: y, displayFieldOverride: b, id: x, labelId: S, ariaLabel: C, required: w, placeholder: T, specialValues: E }) {
+	let D = r(), O = r("errors"), k = g?.entity, A = u(k), j = o(A), M = b ?? g?.display?.field ?? (j?.display?.display_template ? "$display" : j?.display?.display_field) ?? "$display", N = M === "$display" ? j?.display?.display_field : M, P = d(() => j ? t(j)[0] ?? "id" : "id", [j]), F = g?.field || P, [I, L] = p(""), R = l(I, 300), { data: z, isLoading: B, isError: V } = a(A, {
+		per_page: h,
+		sort: c(j, N ? `${N}:asc` : void 0),
+		search: R || void 0,
+		filters: g?.options_filter && s(j, g.options_filter)
+	}), H = d(() => z?.data ?? [], [z?.data]), U = V ? O("record.ref_choices_unreadable", "The choices could not be loaded.") : T ?? D("field.select_placeholder", "Select…"), W = _ == null ? "" : e(_), G = d(() => H.some((e) => String(e[F]) === W), [
+		H,
+		F,
+		W
+	]), K = y && k ? y[k]?.[W] : void 0, q = !!E?.some((e) => e.code === W), { data: J } = a(W && !G && !q && !K && !B ? A : void 0, {
+		per_page: 1,
+		filters: [{
+			field: F,
+			op: "eq",
+			value: W
+		}]
+	}), Y = f(null), X = d(() => {
+		if (!W) return "";
+		let e;
+		if (K) e = n(D, K, M, W);
+		else {
+			let t = H.find((e) => String(e[F]) === W);
+			if (t) e = n(D, t, M, W);
+			else {
+				let t = J?.data?.find((e) => String(e[F]) === W);
+				t && (e = n(D, t, M, W));
+			}
+		}
+		return e === void 0 ? Y.current?.value === W ? Y.current.label : W : (Y.current = {
+			value: W,
+			label: e
+		}, e);
+	}, [
+		D,
+		W,
+		K,
+		H,
+		F,
+		M,
+		J
+	]), Z = d(() => {
+		let t = (E ?? []).map((e) => ({
+			value: e.code,
+			label: D(e.label) || e.code
+		})), r = H.map((t) => {
+			let r = e(t[F]);
+			return {
+				value: r,
+				label: n(D, t, M, r)
+			};
+		}), i = W && !G && !q ? [{
+			value: W,
+			label: X
+		}] : [], a = r.length > 0 || i.length > 0;
+		return [
+			{
+				value: "",
+				label: U
+			},
+			...t.length > 0 ? [{
+				value: "",
+				label: D("field.ref.special_values", "Special values"),
+				heading: !0
+			}, ...t] : [],
+			...t.length > 0 && a ? [{
+				value: "",
+				label: "",
+				divider: !0
+			}] : [],
+			...i,
+			...r
+		];
+	}, [
+		D,
+		U,
+		E,
+		W,
+		G,
+		q,
+		X,
+		H,
+		F,
+		M
+	]);
+	return /* @__PURE__ */ m(i, {
+		id: x,
+		"aria-label": C,
+		"aria-labelledby": S,
+		"aria-required": w || void 0,
+		value: W,
+		options: Z,
+		onChange: (e) => v(e || null),
+		onSearchChange: L,
+		placeholder: U
+	});
+}
+//#endregion
+export { g as RefCombobox };