@judo/components 0.1.0

package/dist/FlexRenderer-0KCxU9QU.js

@@ -0,0 +1,1612 @@
+import { d as findActionByDefinition, f as getDestructiveConfirmationOptions, l as IconRenderer, n as TableRenderer, p as isDestructiveAction, u as getVisibleButtons } from "./find-on-init-action-C5CqxQaH.js";
+import { Autocomplete, Box, Button, ButtonGroup, Checkbox, CircularProgress, ClickAwayListener, Dialog, DialogActions, DialogContent, DialogTitle, FormControl, FormControlLabel, FormHelperText, FormLabel, Grow, IconButton, InputAdornment, InputLabel, ListItemIcon, ListItemText, Menu, MenuItem, MenuList, Paper, Popper, Radio, RadioGroup, Select, Switch, Tab, Tabs, TextField, ToggleButton, ToggleButtonGroup, Tooltip, Typography } from "@mui/material";
+import { createElement, useCallback, useEffect, useMemo, useRef, useState } from "react";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { Alignment, Axis, CrossAxisAlignment, MainAxisAlignment } from "@judo/model-api";
+import { getActionHandler, useActionDispatcher, useApi } from "@judo/actions";
+import { useApplication, useComponentInterceptor, useComponentOverride, useDataSelector, useDataStore, useDateValidationProps, useDebouncedCallback, useDispatchOptional, useEditMode, useElementDisabled, useElementVisibility, useEnumOptionFilter, useMuiProOptional, useNavigation, usePageContextOptional, useResolvedPageActionOverrides, useRuntimeConfigOptional, useSubThemeProvider, useTypeaheadProvider, useVisualBinding } from "@judo/core";
+import { useConfirmation, useNotifications } from "@judo/feedback";
+import { useModelLabel } from "@judo/i18n";
+import { getButtonGroupTestId, getButtonTestId, getInputTestId, getLinkTestId, getTabControllerTestId, getTabListTestId, getTabPanelTestId, getTabTestId } from "@judo/test-ids";
+import { DataGrid } from "@mui/x-data-grid";
+import Grid$1 from "@mui/material/Grid";
+import Stack$1 from "@mui/material/Stack";
+import DeleteIcon from "@mui/icons-material/Delete";
+import UploadIcon from "@mui/icons-material/Upload";
+import InputAdornment$1 from "@mui/material/InputAdornment";
+import { format, parseISO } from "date-fns";
+import VisibilityIcon from "@mui/icons-material/Visibility";
+import VisibilityOffIcon from "@mui/icons-material/VisibilityOff";
+import Typography$1 from "@mui/material/Typography";
+import KeyboardArrowDownIcon from "@mui/icons-material/KeyboardArrowDown";
+import ArrowDropDownIcon from "@mui/icons-material/ArrowDropDown";
+import { ThemeProvider, createTheme } from "@mui/material/styles";
+function mapMainAxisAlignment(e) {
+	switch (e) {
+		case MainAxisAlignment.START: return "flex-start";
+		case MainAxisAlignment.END: return "flex-end";
+		case MainAxisAlignment.CENTER: return "center";
+		case MainAxisAlignment.SPACEBETWEEN: return "space-between";
+		case MainAxisAlignment.SPACEAROUND: return "space-around";
+		case MainAxisAlignment.SPACEEVENLY: return "space-evenly";
+		default: return "flex-start";
+	}
+}
+function mapCrossAxisAlignment(e) {
+	switch (e) {
+		case CrossAxisAlignment.START: return "flex-start";
+		case CrossAxisAlignment.END: return "flex-end";
+		case CrossAxisAlignment.CENTER: return "center";
+		case CrossAxisAlignment.STRETCH: return "stretch";
+		case CrossAxisAlignment.BASELINE: return "baseline";
+		default: return "stretch";
+	}
+}
+function mapAlignment(e) {
+	switch (e) {
+		case Alignment.TOP_LEFT: return {
+			justifyContent: "flex-start",
+			alignItems: "flex-start"
+		};
+		case Alignment.TOP_CENTER: return {
+			justifyContent: "center",
+			alignItems: "flex-start"
+		};
+		case Alignment.TOP_RIGHT: return {
+			justifyContent: "flex-end",
+			alignItems: "flex-start"
+		};
+		case Alignment.CENTER_LEFT: return {
+			justifyContent: "flex-start",
+			alignItems: "center"
+		};
+		case Alignment.CENTER: return {
+			justifyContent: "center",
+			alignItems: "center"
+		};
+		case Alignment.CENTER_RIGHT: return {
+			justifyContent: "flex-end",
+			alignItems: "center"
+		};
+		case Alignment.BOTTOM_LEFT: return {
+			justifyContent: "flex-start",
+			alignItems: "flex-end"
+		};
+		case Alignment.BOTTOM_CENTER: return {
+			justifyContent: "center",
+			alignItems: "flex-end"
+		};
+		case Alignment.BOTTOM_RIGHT: return {
+			justifyContent: "flex-end",
+			alignItems: "flex-end"
+		};
+		default: return {
+			justifyContent: "flex-start",
+			alignItems: "flex-start"
+		};
+	}
+}
+const DEFAULT_COL = 4, FULL_GRID_WIDTH = 12;
+function calculateScaledSize(e, t) {
+	return e === 12 ? t : 12 / e * t;
+}
+function calculateHorizontalGridSize(e, t) {
+	let n = calculateScaledSize(e, t);
+	return n === 12 ? {
+		xs: 12,
+		sm: 12
+	} : {
+		xs: 12,
+		sm: 12,
+		md: n
+	};
+}
+function calculateVerticalGridSize() {
+	return {
+		xs: 12,
+		sm: 12
+	};
+}
+function isVerticalLayout(e) {
+	return e === Axis.VERTICAL;
+}
+function calculateChildGridSize(e, t, n) {
+	return isVerticalLayout(e) ? calculateVerticalGridSize() : calculateHorizontalGridSize(t, n);
+}
+function FrameRenderer({ frame: e, children: t, label: r, icon: i }) {
+	let a = r || i;
+	return /* @__PURE__ */ jsxs(Paper, {
+		sx: {
+			p: 2,
+			animation: "judoFadeInUp 0.35s cubic-bezier(0.4,0,0.2,1) both",
+			"&:hover": {
+				borderColor: "rgba(0, 0, 0, 0.15)",
+				boxShadow: (e) => e.palette.mode === "light" ? "0 4px 20px rgba(0,0,0,0.06)" : "0 4px 20px rgba(0,0,0,0.3)",
+				transform: "translateY(-1px)"
+			}
+		},
+		"data-testid": `frame::${e["xmi:id"]}`,
+		children: [a && /* @__PURE__ */ jsxs(Box, {
+			sx: {
+				display: "flex",
+				alignItems: "center",
+				gap: 1,
+				mb: 2,
+				pl: 1.5,
+				borderLeft: 3,
+				borderColor: "primary.main"
+			},
+			"data-testid": `frame::${e["xmi:id"]}::header`,
+			children: [i && /* @__PURE__ */ jsx(IconRenderer, { icon: i }), r && /* @__PURE__ */ jsx(Typography, {
+				variant: "h6",
+				component: "h3",
+				children: r
+			})]
+		}), t]
+	});
+}
+function BinaryInputComponent({ element: e, readOnly: t, value: n, onChange: r, error: i, disabled: a, fileName: o }) {
+	let l = getInputTestId(e), { label: u } = useModelLabel(e), [d, f] = useState(o ?? ""), p = (e) => {
+		let t = e.target.files?.[0];
+		if (t) {
+			f(t.name);
+			let e = new FileReader();
+			e.addEventListener("load", () => {
+				let t = e.result.split(",")[1];
+				r?.(t);
+			}), e.readAsDataURL(t);
+		}
+	}, m = () => {
+		f(""), r?.(null);
+	}, h = a ?? e.disabled, g = t ?? e.isReadOnly;
+	return /* @__PURE__ */ jsxs(Box, {
+		"data-testid": l,
+		children: [
+			/* @__PURE__ */ jsxs(Typography, {
+				variant: "body2",
+				gutterBottom: !0,
+				children: [u, e.required && " *"]
+			}),
+			/* @__PURE__ */ jsxs(Box, {
+				display: "flex",
+				alignItems: "center",
+				gap: 1,
+				children: [/* @__PURE__ */ jsxs(Button, {
+					component: "label",
+					variant: "outlined",
+					startIcon: /* @__PURE__ */ jsx(UploadIcon, {}),
+					disabled: h || g,
+					children: ["Upload", /* @__PURE__ */ jsx("input", {
+						type: "file",
+						hidden: !0,
+						onChange: p,
+						"data-testid": `${l}::file-input`
+					})]
+				}), d && /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(Typography, {
+					variant: "body2",
+					sx: { flexGrow: 1 },
+					children: d
+				}), !g && /* @__PURE__ */ jsx(IconButton, {
+					onClick: m,
+					disabled: h,
+					size: "small",
+					"data-testid": `${l}::clear`,
+					children: /* @__PURE__ */ jsx(DeleteIcon, {})
+				})] })]
+			}),
+			i && /* @__PURE__ */ jsx(Typography, {
+				variant: "caption",
+				color: "error",
+				children: i
+			})
+		]
+	});
+}
+function CheckboxComponent({ element: e, readOnly: t, value: n = !1, onChange: r, error: i, disabled: a }) {
+	let o = getInputTestId(e), { label: s } = useModelLabel(e), c = `${s}${e.required ? " *" : ""}`;
+	return /* @__PURE__ */ jsxs(FormControl, {
+		error: !!i,
+		disabled: a ?? e.disabled,
+		required: e.required,
+		children: [/* @__PURE__ */ jsx(FormControlLabel, {
+			control: /* @__PURE__ */ jsx(Checkbox, {
+				checked: n,
+				onChange: (e) => r?.(e.target.checked),
+				disabled: t ?? e.isReadOnly,
+				"data-testid": o
+			}),
+			label: c
+		}), i && /* @__PURE__ */ jsx(FormHelperText, { children: i })]
+	});
+}
+function buildIconAdornment(e) {
+	if (e?.iconName) return /* @__PURE__ */ jsx(InputAdornment$1, {
+		position: "start",
+		children: /* @__PURE__ */ jsx(IconRenderer, {
+			icon: e,
+			size: "small",
+			color: "action"
+		})
+	});
+}
+function formatDateForInput(e) {
+	return `${e.getFullYear()}-${String(e.getMonth() + 1).padStart(2, "0")}-${String(e.getDate()).padStart(2, "0")}`;
+}
+function parseDateInputValue(e) {
+	let [t, n, r] = e.split("-").map(Number);
+	return new Date(t, n - 1, r);
+}
+function toInputValue(e) {
+	return e == null ? "" : e instanceof Date ? formatDateForInput(e) : e;
+}
+function DateInputComponent({ element: e, readOnly: t, value: n, onChange: r, error: i, disabled: a }) {
+	let o = getInputTestId(e), { label: s } = useModelLabel(e), c = useDateValidationProps(e["xmi:id"]), l = buildIconAdornment(e.icon), u, d;
+	if (c) {
+		let e = /* @__PURE__ */ new Date();
+		c.disablePast && (u = formatDateForInput(e)), c.minDate && (u = formatDateForInput(c.minDate)), c.disableFuture && (d = formatDateForInput(e)), c.maxDate && (d = formatDateForInput(c.maxDate));
+	}
+	return /* @__PURE__ */ jsx(TextField, {
+		type: "date",
+		label: s,
+		value: toInputValue(n),
+		onChange: (e) => {
+			let t = e.target.value;
+			r?.(t ? parseDateInputValue(t) : null);
+		},
+		error: !!i,
+		helperText: i,
+		disabled: a ?? e.disabled,
+		required: e.required,
+		fullWidth: !0,
+		"data-testid": o,
+		slotProps: {
+			input: {
+				readOnly: t ?? e.isReadOnly,
+				startAdornment: l,
+				...u !== void 0 || d !== void 0 ? { inputProps: {
+					...u !== void 0 && { min: u },
+					...d !== void 0 && { max: d }
+				} } : {}
+			},
+			inputLabel: { shrink: !0 }
+		}
+	});
+}
+function toDateTimeLocalFormat(e) {
+	if (!e) return "";
+	try {
+		let t = parseISO(e);
+		return Number.isNaN(t.getTime()) ? "" : format(t, "yyyy-MM-dd'T'HH:mm");
+	} catch {
+		return "";
+	}
+}
+function formatDateTimeForInput(e) {
+	return `${e.getFullYear()}-${String(e.getMonth() + 1).padStart(2, "0")}-${String(e.getDate()).padStart(2, "0")}T${String(e.getHours()).padStart(2, "0")}:${String(e.getMinutes()).padStart(2, "0")}`;
+}
+function DateTimeInputComponent({ element: e, readOnly: t, value: n, onChange: r, error: i, disabled: a }) {
+	let o = getInputTestId(e), { label: s } = useModelLabel(e), c = useDateValidationProps(e["xmi:id"]), l = buildIconAdornment(e.icon), u = n instanceof Date ? formatDateTimeForInput(n) : toDateTimeLocalFormat(n), d, f;
+	if (c) {
+		let e = /* @__PURE__ */ new Date();
+		c.disablePast && (d = formatDateTimeForInput(e)), c.minDate && (d = formatDateTimeForInput(c.minDate)), c.disableFuture && (f = formatDateTimeForInput(e)), c.maxDate && (f = formatDateTimeForInput(c.maxDate));
+	}
+	return /* @__PURE__ */ jsx(TextField, {
+		type: "datetime-local",
+		label: s,
+		value: u,
+		onChange: (e) => {
+			let t = e.target.value;
+			if (!t) r?.(null);
+			else {
+				let e = parseISO(t);
+				r?.(Number.isNaN(e.getTime()) ? null : e);
+			}
+		},
+		error: !!i,
+		helperText: i,
+		disabled: a ?? e.disabled,
+		required: e.required,
+		fullWidth: !0,
+		"data-testid": o,
+		slotProps: {
+			input: {
+				readOnly: t ?? e.isReadOnly,
+				startAdornment: l,
+				...d !== void 0 || f !== void 0 ? { inputProps: {
+					...d !== void 0 && { min: d },
+					...f !== void 0 && { max: f }
+				} } : {}
+			},
+			inputLabel: { shrink: !0 }
+		}
+	});
+}
+function EnumerationComboComponent({ element: e, readOnly: t, value: n = "", onChange: r, error: i, disabled: a, options: o = [], nullable: s = !1 }) {
+	let c = getInputTestId(e), { label: l } = useModelLabel(e), u = `${c}-label`;
+	return /* @__PURE__ */ jsxs(FormControl, {
+		fullWidth: !0,
+		error: !!i,
+		disabled: a ?? e.disabled,
+		required: e.required,
+		children: [
+			/* @__PURE__ */ jsx(InputLabel, {
+				id: u,
+				shrink: !0,
+				children: l
+			}),
+			/* @__PURE__ */ jsxs(Select, {
+				labelId: u,
+				value: n,
+				onChange: (e) => r?.(e.target.value),
+				label: l,
+				readOnly: t ?? e.isReadOnly,
+				"data-testid": c,
+				displayEmpty: s,
+				children: [s && /* @__PURE__ */ jsx(MenuItem, {
+					value: "",
+					children: /* @__PURE__ */ jsx("em", { children: "—" })
+				}), o.map((e) => /* @__PURE__ */ jsx(MenuItem, {
+					value: e.value,
+					children: e.label
+				}, e.value))]
+			}),
+			i && /* @__PURE__ */ jsx(FormHelperText, { children: i })
+		]
+	});
+}
+function EnumerationRadioComponent({ element: e, readOnly: t, value: n = "", onChange: r, error: i, disabled: a, options: o = [], orientation: s = "vertical", nullable: c = !1 }) {
+	let l = getInputTestId(e), { label: u } = useModelLabel(e), d = (e) => {
+		c && n === e ? r?.("") : r?.(e);
+	};
+	return /* @__PURE__ */ jsxs(FormControl, {
+		error: !!i,
+		disabled: a ?? e.disabled,
+		required: e.required,
+		children: [
+			/* @__PURE__ */ jsx(FormLabel, { children: u }),
+			/* @__PURE__ */ jsx(RadioGroup, {
+				value: n,
+				row: s === "horizontal",
+				"data-testid": l,
+				children: o.map((n) => /* @__PURE__ */ jsx(FormControlLabel, {
+					value: n.value,
+					control: /* @__PURE__ */ jsx(Radio, {
+						disabled: t ?? e.isReadOnly,
+						onClick: () => d(n.value)
+					}),
+					label: n.label
+				}, n.value))
+			}),
+			i && /* @__PURE__ */ jsx(FormHelperText, { children: i })
+		]
+	});
+}
+function EnumerationToggleButtonbarComponent({ element: e, readOnly: t, value: n = "", onChange: r, error: i, disabled: a, options: o = [], orientation: s = "horizontal", nullable: c = !1 }) {
+	let l = getInputTestId(e), { label: u } = useModelLabel(e), d = a ?? e.disabled, f = t ?? e.isReadOnly;
+	return /* @__PURE__ */ jsxs(FormControl, {
+		error: !!i,
+		disabled: d,
+		required: e.required,
+		children: [
+			/* @__PURE__ */ jsx(InputLabel, {
+				shrink: !0,
+				children: u
+			}),
+			/* @__PURE__ */ jsx(ToggleButtonGroup, {
+				value: n || null,
+				exclusive: !0,
+				onChange: (e, t) => {
+					f || (t === null ? c && r?.("") : r?.(t));
+				},
+				orientation: s,
+				"data-testid": l,
+				disabled: d || f,
+				sx: { mt: 1.25 },
+				children: o.map((e) => /* @__PURE__ */ jsx(ToggleButton, {
+					value: e.value,
+					children: e.label
+				}, e.value))
+			}),
+			i && /* @__PURE__ */ jsx(FormHelperText, { children: i })
+		]
+	});
+}
+function NumericInputComponent({ element: e, readOnly: t, value: n, onChange: r, error: i, disabled: a }) {
+	let o = getInputTestId(e), { label: s } = useModelLabel(e), c = e, l = buildIconAdornment(e.icon);
+	return /* @__PURE__ */ jsx(TextField, {
+		type: "number",
+		label: s,
+		value: n ?? "",
+		onChange: (e) => {
+			let t = e.target.value;
+			if (t === "") r?.(null);
+			else {
+				let e = Number.parseFloat(t);
+				Number.isNaN(e) || r?.(e);
+			}
+		},
+		error: !!i,
+		helperText: i,
+		disabled: a ?? e.disabled,
+		required: e.required,
+		fullWidth: !0,
+		"data-testid": o,
+		slotProps: {
+			input: {
+				readOnly: t ?? e.isReadOnly,
+				startAdornment: l
+			},
+			htmlInput: { step: c.scale ? 10 ** -c.scale : void 0 },
+			inputLabel: { shrink: !0 }
+		}
+	});
+}
+function PasswordInputComponent({ element: e, readOnly: t, value: n = "", onChange: r, error: i, disabled: a }) {
+	let o = getInputTestId(e), { label: s } = useModelLabel(e), [c, l] = useState(!1), u = buildIconAdornment(e.icon);
+	return /* @__PURE__ */ jsx(TextField, {
+		type: c ? "text" : "password",
+		label: s,
+		value: n,
+		onChange: (e) => r?.(e.target.value),
+		error: !!i,
+		helperText: i,
+		disabled: a ?? e.disabled,
+		required: e.required,
+		fullWidth: !0,
+		"data-testid": o,
+		slotProps: {
+			input: {
+				readOnly: t ?? e.isReadOnly,
+				startAdornment: u,
+				endAdornment: /* @__PURE__ */ jsx(InputAdornment, {
+					position: "end",
+					children: /* @__PURE__ */ jsx(IconButton, {
+						onClick: () => l(!c),
+						edge: "end",
+						"data-testid": `${o}::toggle-visibility`,
+						children: jsx(c ? VisibilityOffIcon : VisibilityIcon, {})
+					})
+				})
+			},
+			inputLabel: { shrink: !0 }
+		}
+	});
+}
+function SwitchComponent({ element: e, readOnly: t, value: n = !1, onChange: r, error: i, disabled: a }) {
+	let o = getInputTestId(e), { label: s } = useModelLabel(e), c = `${s}${e.required ? " *" : ""}`;
+	return /* @__PURE__ */ jsxs(FormControl, {
+		error: !!i,
+		disabled: a ?? e.disabled,
+		required: e.required,
+		children: [/* @__PURE__ */ jsx(FormControlLabel, {
+			control: /* @__PURE__ */ jsx(Switch, {
+				checked: n,
+				onChange: (e) => r?.(e.target.checked),
+				disabled: t ?? e.isReadOnly,
+				"data-testid": o
+			}),
+			label: c
+		}), i && /* @__PURE__ */ jsx(FormHelperText, { children: i })]
+	});
+}
+function TextAreaComponent({ element: e, readOnly: t, value: n = "", onChange: r, error: i, disabled: a }) {
+	let o = getInputTestId(e), { label: s } = useModelLabel(e), c = e, l = buildIconAdornment(e.icon);
+	return /* @__PURE__ */ jsx(TextField, {
+		multiline: !0,
+		minRows: c.lines,
+		maxRows: 20,
+		label: s,
+		value: n,
+		onChange: (e) => r?.(e.target.value),
+		error: !!i,
+		helperText: i ?? (c.countCharacters ? `${n.length}${c.maxLength ? `/${c.maxLength}` : ""}` : void 0),
+		disabled: a ?? e.disabled,
+		required: e.required,
+		fullWidth: !0,
+		"data-testid": o,
+		slotProps: {
+			input: {
+				readOnly: t ?? e.isReadOnly,
+				startAdornment: l
+			},
+			htmlInput: { maxLength: c.maxLength },
+			inputLabel: { shrink: !0 }
+		}
+	});
+}
+function TextInputComponent({ element: e, readOnly: t, value: n = "", onChange: r, error: i, disabled: a }) {
+	let o = getInputTestId(e), { label: s } = useModelLabel(e), c = e, l = buildIconAdornment(e.icon), u = useTypeaheadProvider(String(c.isTypeAheadField) === "true" ? e["xmi:id"] : void 0);
+	return u ? /* @__PURE__ */ jsx(TypeaheadInput, {
+		label: s,
+		testId: o,
+		value: n,
+		onChange: r,
+		error: i,
+		disabled: a ?? e.disabled,
+		required: e.required,
+		readOnly: t ?? e.isReadOnly,
+		maxLength: c.maxLength,
+		regexp: c.regexp,
+		provider: u,
+		startAdornment: l
+	}) : /* @__PURE__ */ jsx(TextField, {
+		label: s,
+		value: n,
+		onChange: (e) => r?.(e.target.value),
+		error: !!i,
+		helperText: i,
+		disabled: a ?? e.disabled,
+		required: e.required,
+		fullWidth: !0,
+		"data-testid": o,
+		slotProps: {
+			input: {
+				readOnly: t ?? e.isReadOnly,
+				startAdornment: l
+			},
+			htmlInput: {
+				maxLength: c.maxLength,
+				pattern: c.regexp
+			},
+			inputLabel: { shrink: !0 }
+		}
+	});
+}
+function TypeaheadInput({ label: e, testId: t, value: n, onChange: r, error: i, disabled: a, required: s, readOnly: c, maxLength: l, regexp: u, provider: f, startAdornment: p }) {
+	let [m, h] = useState([]), [g, _] = useState(!1), v = useDebouncedCallback(async (e) => {
+		_(!0);
+		try {
+			h(await f(e));
+		} catch {
+			h([]);
+		} finally {
+			_(!1);
+		}
+	});
+	return /* @__PURE__ */ jsx(Autocomplete, {
+		freeSolo: !0,
+		options: m,
+		loading: g,
+		value: n,
+		inputValue: n,
+		onInputChange: (e, t, n) => {
+			n === "input" && (r?.(t), v(t));
+		},
+		onChange: (e, t) => {
+			r?.(typeof t == "string" ? t : "");
+		},
+		disabled: a,
+		readOnly: c,
+		fullWidth: !0,
+		"data-testid": t,
+		renderInput: (n) => /* @__PURE__ */ jsx(TextField, {
+			...n,
+			label: e,
+			error: !!i,
+			helperText: i,
+			required: s,
+			slotProps: {
+				input: {
+					...n.InputProps,
+					readOnly: c,
+					startAdornment: p ? /* @__PURE__ */ jsxs(Fragment, { children: [p, n.InputProps.startAdornment] }) : n.InputProps.startAdornment,
+					endAdornment: /* @__PURE__ */ jsxs(Fragment, { children: [g && /* @__PURE__ */ jsx(CircularProgress, {
+						color: "inherit",
+						size: 20,
+						"data-testid": `${t}::loading`
+					}), n.InputProps.endAdornment] })
+				},
+				htmlInput: {
+					...n.inputProps,
+					maxLength: l,
+					pattern: u
+				},
+				inputLabel: { shrink: !0 }
+			}
+		})
+	});
+}
+function TimeInputComponent({ element: e, readOnly: t, value: n, onChange: r, error: i, disabled: a }) {
+	let o = getInputTestId(e), { label: s } = useModelLabel(e), c = buildIconAdornment(e.icon);
+	return /* @__PURE__ */ jsx(TextField, {
+		type: "time",
+		label: s,
+		value: n ?? "",
+		onChange: (e) => r?.(e.target.value || null),
+		error: !!i,
+		helperText: i,
+		disabled: a ?? e.disabled,
+		required: e.required,
+		fullWidth: !0,
+		"data-testid": o,
+		slotProps: {
+			input: {
+				readOnly: t ?? e.isReadOnly,
+				startAdornment: c
+			},
+			inputLabel: { shrink: !0 }
+		}
+	});
+}
+function convertEnumOptions(e) {
+	return (e.options ?? []).map((e) => ({
+		value: e.enumerationMember?.name ?? e.name,
+		label: e.label ?? e.enumerationMember?.name ?? e.name
+	}));
+}
+function InputRenderer({ element: e, readOnly: t }) {
+	let n = useVisualBinding(e), r = useEnumOptionFilter(e["xmi:id"]);
+	if (n.hidden) return null;
+	let i = t ?? n.readOnly ?? e.isReadOnly ?? !1, a = n.required || e.required === !0 || e.attributeType?.isRequired === !0, o = {
+		...e,
+		label: n.label || e.label,
+		required: a
+	}, s = {
+		value: n.value,
+		onChange: n.onChange,
+		error: n.error ?? void 0,
+		disabled: n.disabled
+	};
+	switch (e["@type"]) {
+		case "TextInput": return /* @__PURE__ */ jsx(TextInputComponent, {
+			element: o,
+			readOnly: i,
+			...s
+		});
+		case "NumericInput": return /* @__PURE__ */ jsx(NumericInputComponent, {
+			element: o,
+			readOnly: i,
+			...s
+		});
+		case "DateInput": return /* @__PURE__ */ jsx(DateInputComponent, {
+			element: o,
+			readOnly: i,
+			...s
+		});
+		case "DateTimeInput": return /* @__PURE__ */ jsx(DateTimeInputComponent, {
+			element: o,
+			readOnly: i,
+			...s
+		});
+		case "TimeInput": return /* @__PURE__ */ jsx(TimeInputComponent, {
+			element: o,
+			readOnly: i,
+			...s
+		});
+		case "TextArea": return /* @__PURE__ */ jsx(TextAreaComponent, {
+			element: o,
+			readOnly: i,
+			...s
+		});
+		case "Checkbox": return /* @__PURE__ */ jsx(CheckboxComponent, {
+			element: o,
+			readOnly: i,
+			...s
+		});
+		case "Switch": return /* @__PURE__ */ jsx(SwitchComponent, {
+			element: o,
+			readOnly: i,
+			...s
+		});
+		case "EnumerationCombo": {
+			let e = o, t = !e.required && !e.attributeType?.isRequired, n = convertEnumOptions(e);
+			return /* @__PURE__ */ jsx(EnumerationComboComponent, {
+				element: o,
+				readOnly: i,
+				options: r ? r(n) : n,
+				nullable: t,
+				...s
+			});
+		}
+		case "EnumerationRadio": {
+			let e = o, t = !e.required && !e.attributeType?.isRequired, n = e.stretch === "HORIZONTAL" || e.stretch === "BOTH" ? "horizontal" : "vertical", a = convertEnumOptions(e);
+			return /* @__PURE__ */ jsx(EnumerationRadioComponent, {
+				element: o,
+				readOnly: i,
+				options: r ? r(a) : a,
+				nullable: t,
+				orientation: n,
+				...s
+			});
+		}
+		case "EnumerationToggleButtonbar": {
+			let e = o, t = !e.required && !e.attributeType?.isRequired, n = e.stretch === "VERTICAL" ? "vertical" : "horizontal", a = convertEnumOptions(e);
+			return /* @__PURE__ */ jsx(EnumerationToggleButtonbarComponent, {
+				element: o,
+				readOnly: i,
+				options: r ? r(a) : a,
+				nullable: t,
+				orientation: n,
+				...s
+			});
+		}
+		case "BinaryTypeInput": return /* @__PURE__ */ jsx(BinaryInputComponent, {
+			element: o,
+			readOnly: i,
+			...s
+		});
+		case "PasswordInput": return /* @__PURE__ */ jsx(PasswordInputComponent, {
+			element: o,
+			readOnly: i,
+			...s
+		});
+		default: return /* @__PURE__ */ jsx(TextInputComponent, {
+			element: o,
+			readOnly: i,
+			...s
+		});
+	}
+}
+function applyFormat(e, t) {
+	return t == null ? "" : e ? e.replace(/%([%sdf])/g, (e, n) => {
+		if (n === "%") return "%";
+		if (n === "d") {
+			let e = Number(t);
+			return Number.isNaN(e) ? String(t) : String(Math.trunc(e));
+		}
+		if (n === "f") {
+			let e = Number(t);
+			return Number.isNaN(e) ? String(t) : String(e);
+		}
+		return String(t);
+	}) : String(t);
+}
+function FormattedRenderer({ element: e }) {
+	let t = useVisualBinding(e);
+	if (t.hidden) return null;
+	let n = applyFormat(e.format, t.value), r = `formatted::${e.sourceId ?? e["xmi:id"]}`;
+	return e.isMultiLine ? /* @__PURE__ */ jsx(Typography$1, {
+		component: "div",
+		"data-testid": r,
+		sx: {
+			whiteSpace: "pre-wrap",
+			wordBreak: "break-word"
+		},
+		children: n
+	}) : /* @__PURE__ */ jsx(Typography$1, {
+		"data-testid": r,
+		children: n
+	});
+}
+function InlineButtonGroupRenderer({ element: t, page: r, editMode: i, onDispatch: o }) {
+	let s = useElementVisibility(t), u = usePageContextOptional(), d = useDispatchOptional(), { isEditMode: f } = useEditMode(), p = r ?? u?.pageDefinition, m = o ?? d?.dispatch, h = i ?? f, [g, _] = useState(null), v = !!g, y = (e) => {
+		_(e.currentTarget);
+	}, b = () => {
+		_(null);
+	}, x = (t) => {
+		let n = p ? findActionByDefinition(p, t.actionDefinition) : void 0;
+		n && m && m(n).catch((e) => {
+			console.error("Button action failed:", e);
+		});
+	}, S = (e) => {
+		x(e);
+	}, C = (e) => {
+		b(), x(e);
+	}, w = getVisibleButtons(t.buttons, p?.actions);
+	if (s || w.length === 0) return null;
+	let T = getButtonGroupTestId(t), { label: E } = useModelLabel(t), O = t.featuredActions ?? 0, Ot = O > 0 ? w.slice(0, O) : [], k = O > 0 ? w.slice(O) : w;
+	return /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsxs(ButtonGroup, {
+		"data-testid": T,
+		children: [Ot.map((e) => /* @__PURE__ */ jsx(InlineFeaturedButton, {
+			button: e,
+			onClick: () => S(e),
+			disabled: e.disabled === !0 || h === !0
+		}, e["xmi:id"])), k.length > 0 && /* @__PURE__ */ jsx(Button, {
+			variant: "outlined",
+			onClick: y,
+			disabled: h === !0,
+			"data-testid": `${T}::dropdown`,
+			startIcon: t.icon ? /* @__PURE__ */ jsx(IconRenderer, { icon: t.icon }) : void 0,
+			endIcon: /* @__PURE__ */ jsx(KeyboardArrowDownIcon, {}),
+			"aria-controls": v ? `${T}-menu` : void 0,
+			"aria-haspopup": "true",
+			"aria-expanded": v ? "true" : void 0,
+			children: E
+		})]
+	}), k.length > 0 && /* @__PURE__ */ jsx(Menu, {
+		id: `${T}-menu`,
+		anchorEl: g,
+		open: v,
+		onClose: b,
+		MenuListProps: { "aria-labelledby": `${T}::dropdown` },
+		children: k.map((e) => /* @__PURE__ */ jsx(InlineOverflowItem, {
+			button: e,
+			onClick: () => C(e),
+			disabled: e.disabled === !0 || h === !0
+		}, e["xmi:id"]))
+	})] });
+}
+function InlineFeaturedButton({ button: e, onClick: t, disabled: r }) {
+	let i = useElementVisibility(e), a = useElementDisabled(e), { label: o } = useModelLabel(e), s = getButtonTestId(e);
+	return i ? null : /* @__PURE__ */ jsx(Button, {
+		variant: "outlined",
+		onClick: t,
+		disabled: r || a,
+		"data-testid": s,
+		startIcon: e.icon ? /* @__PURE__ */ jsx(IconRenderer, { icon: e.icon }) : void 0,
+		children: o
+	});
+}
+function InlineOverflowItem({ button: e, onClick: t, disabled: r }) {
+	let i = useElementVisibility(e), a = useElementDisabled(e), { label: o } = useModelLabel(e), s = getButtonTestId(e);
+	return i ? null : /* @__PURE__ */ jsxs(MenuItem, {
+		onClick: t,
+		disabled: r || a,
+		"data-testid": s,
+		children: [e.icon && /* @__PURE__ */ jsx(ListItemIcon, { children: /* @__PURE__ */ jsx(IconRenderer, { icon: e.icon }) }), /* @__PURE__ */ jsx(ListItemText, { children: o })]
+	});
+}
+function LinkSelectorDialog({ open: e, element: t, relationType: n, api: r, transfer: i, onConfirm: a, onCancel: o }) {
+	let l = `${getLinkTestId(t)}::selector`, { label: u } = useModelLabel(t), d = useMuiProOptional()?.getComponent("DataGrid") ?? DataGrid, [f, _] = useState([]), [v, y] = useState(!1), [b, x] = useState(0), [S, C] = useState(""), [w, T] = useState(null), [E, D] = useState({
+		page: 0,
+		pageSize: t.selectorRowsPerPage ?? 10
+	});
+	useRef(!1);
+	let O = useMemo(() => {
+		if (n?.target?.attributes) return n.target.attributes.find((e) => e.dataType?.["@type"] === "StringType")?.name;
+	}, [n]), Ot = useMemo(() => t.parts.map((e) => ({
+		field: e.attributeType?.name ?? e.name,
+		headerName: e.label ?? e.name,
+		renderHeader: () => /* @__PURE__ */ jsx(TranslatedColumnHeader, { column: e }),
+		width: e.width ? Number.parseInt(e.width, 10) : 150,
+		sortable: !0,
+		filterable: !1
+	})), [t.parts]), k = useCallback(async (e, t, a) => {
+		y(!0);
+		try {
+			let o = { _seek: {
+				limit: t,
+				offset: e * t
+			} };
+			a && O && (o[O] = [{
+				operator: "like",
+				value: `%${a}%`
+			}]);
+			let s = await r.getRelationRange(n, i, o);
+			_(s.data), typeof s.totalCount == "number" ? x(s.totalCount) : x(s.data.length < t ? e * t + s.data.length : (e + 1) * t + 1);
+		} catch (e) {
+			console.error("Failed to fetch selector data:", e), _([]), x(0);
+		} finally {
+			y(!1);
+		}
+	}, [
+		r,
+		n,
+		i,
+		O
+	]);
+	useEffect(() => {
+		e && k(E.page, E.pageSize, S);
+	}, [
+		e,
+		E.page,
+		E.pageSize,
+		S,
+		k
+	]);
+	let A = useRef(null), j = useCallback((e) => {
+		let t = e.target.value;
+		A.current && clearTimeout(A.current), A.current = setTimeout(() => {
+			C(t), D((e) => ({
+				...e,
+				page: 0
+			}));
+		}, 300);
+	}, []), M = useCallback((e) => {
+		let t = e.type === "include" ? Array.from(e.ids) : [];
+		t.length > 0 ? T(f.find((e) => (e.__signedIdentifier ?? e.__identifier ?? e.__tempId ?? e.id) === t[0]) ?? null) : T(null);
+	}, [f]), N = useCallback(() => {
+		w && a(w);
+	}, [w, a]), P = useMemo(() => {
+		let e = [
+			5,
+			10,
+			25,
+			50
+		], n = t.selectorRowsPerPage ?? 10;
+		return e.includes(n) ? e : [...e, n].toSorted((e, t) => e - t);
+	}, [t.selectorRowsPerPage]);
+	return /* @__PURE__ */ jsxs(Dialog, {
+		open: e,
+		onClose: o,
+		maxWidth: "md",
+		fullWidth: !0,
+		"data-testid": l,
+		children: [
+			/* @__PURE__ */ jsx(DialogTitle, {
+				"data-testid": `${l}::title`,
+				children: u
+			}),
+			/* @__PURE__ */ jsxs(DialogContent, { children: [/* @__PURE__ */ jsx(Box, {
+				sx: {
+					mb: 2,
+					mt: 1
+				},
+				children: /* @__PURE__ */ jsx(TextField, {
+					fullWidth: !0,
+					size: "small",
+					placeholder: `Filter by ${O ?? "name"}...`,
+					onChange: j,
+					"data-testid": `${l}::filter`,
+					slotProps: { inputLabel: { shrink: !0 } }
+				})
+			}), /* @__PURE__ */ jsx(Box, {
+				sx: { height: 400 },
+				children: /* @__PURE__ */ jsx(d, {
+					columns: Ot,
+					rows: f,
+					rowCount: b,
+					loading: v,
+					paginationModel: E,
+					onPaginationModelChange: D,
+					paginationMode: "server",
+					pageSizeOptions: P,
+					getRowId: (e) => e.__signedIdentifier ?? e.__identifier ?? e.__tempId ?? e.id,
+					onRowSelectionModelChange: M,
+					"data-testid": `${l}::grid`,
+					sx: { height: "100%" }
+				})
+			})] }),
+			/* @__PURE__ */ jsxs(DialogActions, { children: [/* @__PURE__ */ jsx(Button, {
+				onClick: o,
+				"data-testid": `${l}::cancel`,
+				children: "Cancel"
+			}), /* @__PURE__ */ jsx(Button, {
+				onClick: N,
+				variant: "contained",
+				disabled: !w,
+				"data-testid": `${l}::confirm`,
+				children: "Confirm"
+			})] })
+		]
+	});
+}
+function TranslatedColumnHeader({ column: e }) {
+	let { label: t } = useModelLabel(e);
+	return /* @__PURE__ */ jsx(Fragment, { children: t });
+}
+function buildMaskString(e) {
+	let { attributes: t = [], relations: n = [] } = e, r = [];
+	for (let e of t) e.name && r.push(e.name);
+	for (let e of n) if (e.name) {
+		let t = (e.target?.attributes ?? []).map((e) => e.name).filter(Boolean);
+		t.length > 0 ? r.push(`${e.name}{${t.join(",")}}`) : r.push(`${e.name}{}`);
+	}
+	return `{${r.join(",")}}`;
+}
+function LinkRenderer({ element: n, page: r, readOnly: i }) {
+	let c = getLinkTestId(n), { label: l } = useModelLabel(n), u = buildIconAdornment(n.icon), d = usePageContextOptional(), p = r ?? d?.pageDefinition, m = useNavigation(), h = useDataStore(), g = useApplication(), _ = useApi(), v = useNotifications(), { confirm: y } = useConfirmation(), b = useRuntimeConfigOptional()?.config?.density ?? "compact", C = useMemo(() => {
+		let e = {
+			compact: {
+				top: 1.33333334,
+				bottom: .66666667
+			},
+			comfortable: {
+				top: 0,
+				bottom: 0
+			},
+			standard: {
+				top: 1.63333332,
+				bottom: .8
+			}
+		};
+		return e[b] ?? e.comfortable;
+	}, [b]), [w, T] = useState([]), [E, D] = useState(!1), [O, j] = useState(!1), M = useMemo(() => {
+		if (n.dataElement && typeof n.dataElement == "object" && n.dataElement["@type"] === "RelationType") return n.dataElement;
+	}, [n.dataElement]), N = useDataSelector(useCallback((e) => {
+		let t = d?.transferId;
+		if (!t) return null;
+		let r = e.transfers.get(t);
+		return r?.data ? r.data[n.relationName] ?? null : null;
+	}, [d?.transferId, n.relationName]));
+	useDataSelector(useCallback((e) => {
+		let t = d?.transferId;
+		return t ? e.transfers.get(t)?.isLoading ?? !1 : !1;
+	}, [d?.transferId]));
+	let P = useDataSelector(useCallback((e) => {
+		let t = d?.transferId;
+		return t ? e.transfers.get(t)?.data : void 0;
+	}, [d?.transferId])), F = useMemo(() => {
+		let e = d?.params?.signedIdentifier;
+		if (e && d?.transferId) return {
+			__identifier: d.transferId,
+			__signedIdentifier: e
+		};
+		if (P) return P;
+	}, [
+		P,
+		d?.transferId,
+		d?.params
+	]), I = i ?? n.isReadOnly ?? M?.isReadOnly ?? !1, kt = useResolvedPageActionOverrides(), L = useMemo(() => ({
+		navigation: m,
+		data: h,
+		registry: g,
+		api: _,
+		transfer: F,
+		notifications: v,
+		actionOverrides: kt,
+		additionalContext: {
+			isEager: n.isEager,
+			relationName: n.relationName,
+			pageTransferId: d?.transferId,
+			...n.isEager && { parentTransferId: d?.transferId }
+		}
+	}), [
+		m,
+		h,
+		g,
+		_,
+		F,
+		v,
+		n.isEager,
+		n.relationName,
+		d?.transferId,
+		kt
+	]), { dispatch: R } = useActionDispatcher(L), z = useCallback((e) => e ? n.parts.map((t) => e[t.name]).filter(Boolean).join(" ") : "", [n.parts]), B = useMemo(() => {
+		if (M?.target?.attributes) return M.target.attributes.find((e) => e.dataType?.["@type"] === "StringType")?.name;
+	}, [M]), V = useCallback(async (e) => {
+		if (!(!M || !_)) {
+			D(!0);
+			try {
+				let t = {
+					_seek: { limit: n.autoCompleteRows ?? 10 },
+					_mask: buildMaskString({
+						attributes: [...M.target.attributes ?? [], ...n.additionalMaskAttributes ?? []],
+						relations: n.additionalMaskRelations
+					})
+				};
+				e && B && (t[B] = [{
+					operator: "like",
+					value: `%${e}%`
+				}]), T((await _.getRelationRange(M, P ?? F, t)).data);
+			} catch (e) {
+				console.error("Failed to load autocomplete options:", e), T([]);
+			} finally {
+				D(!1);
+			}
+		}
+	}, [
+		n.autoCompleteRows,
+		n.additionalMaskAttributes,
+		n.additionalMaskRelations,
+		M,
+		_,
+		P,
+		F,
+		B
+	]), At = useCallback(() => {
+		V();
+	}, [V]), jt = useDebouncedCallback((e) => {
+		V(e);
+	}), Mt = useCallback((e, t, r) => {
+		r === "input" && (!n.autocompleteRangeActionDefinition || !M || jt(t));
+	}, [
+		n.autocompleteRangeActionDefinition,
+		M,
+		jt
+	]), Nt = useMemo(() => !N || w.some((e) => e.__identifier && N.__identifier ? e.__identifier === N.__identifier : e.__signedIdentifier && N.__signedIdentifier ? e.__signedIdentifier === N.__signedIdentifier : e === N) ? w : [N, ...w], [w, N]), Pt = useCallback(async (t, r) => {
+		if (!r) {
+			if (n.isEager && d?.transferId) h.updateTransferField(d.transferId, n.relationName, null);
+			else {
+				let t = n.actionButtonGroup?.buttons?.find((e) => e.actionDefinition?.["@type"] === "UnsetActionDefinition")?.actionDefinition, r = t ? findActionByDefinition(p, t) : void 0;
+				if (r) try {
+					let e = getActionHandler(r);
+					e && await e(r)({
+						navigation: m,
+						data: h,
+						registry: g,
+						api: _,
+						transfer: N ?? F,
+						notifications: v,
+						...L.additionalContext
+					});
+				} catch (e) {
+					console.error("Failed to unset autocomplete value:", e);
+				}
+			}
+			return;
+		}
+		let i = n.autocompleteSetActionDefinition ? findActionByDefinition(p, n.autocompleteSetActionDefinition) : void 0;
+		if (i) try {
+			await R(i, { selectedItem: r }), n.isEager && d?.transferId && h.updateTransferField(d.transferId, n.relationName, r);
+		} catch (e) {
+			console.error("Failed to set autocomplete value:", e);
+		}
+	}, [
+		n.autocompleteSetActionDefinition,
+		n.actionButtonGroup,
+		n.isEager,
+		n.relationName,
+		p,
+		R,
+		h,
+		d?.transferId,
+		m,
+		g,
+		_,
+		F,
+		N,
+		v,
+		L.additionalContext
+	]), Ft = useMemo(() => getVisibleButtons(n.actionButtonGroup?.buttons ?? [], p?.actions), [n.actionButtonGroup, p?.actions]), H = useMemo(() => {
+		let e = {};
+		for (let t of Ft) {
+			let n = t.actionDefinition?.["@type"];
+			n && (e[n] = t);
+		}
+		return e;
+	}, [Ft]), U = M?.isOptional !== !1, W = H.OpenPageActionDefinition ?? H.RowOpenPageActionDefinition ?? void 0, G = I ? void 0 : H.OpenSetSelectorActionDefinition, K = !I && U ? H.UnsetActionDefinition : void 0, q = I ? void 0 : H.OpenCreateFormActionDefinition ?? void 0, J = U ? H.RowDeleteActionDefinition : void 0, Y = !!N, It = useMemo(() => {
+		if (Y) return W ? [W] : [];
+		let e = [];
+		return G && e.push(G), q && e.push(q), e;
+	}, [
+		Y,
+		W,
+		G,
+		q
+	]), X = useMemo(() => {
+		if (!Y) return [];
+		let e = [];
+		return G && e.push(G), K && N && e.push(K), q && e.push(q), J && N?.__deleteable === !0 && e.push(J), e;
+	}, [
+		Y,
+		G,
+		K,
+		q,
+		J,
+		N
+	]), [Lt, Z] = useState(!1), Q = useRef(null), Rt = useCallback(() => {
+		Z((e) => !e);
+	}, []), zt = useCallback((e) => {
+		Q.current?.contains(e.target) || Z(!1);
+	}, []), $ = useCallback(async (t, n) => {
+		let r = p ? findActionByDefinition(p, t.actionDefinition) : void 0;
+		if (r) try {
+			let e = getActionHandler(r);
+			if (!e) throw Error(`No handler for action type: ${t.actionDefinition?.["@type"]}`);
+			await e(r)({
+				navigation: m,
+				data: h,
+				registry: g,
+				api: _,
+				transfer: n?.transfer ?? N ?? F,
+				notifications: v,
+				...L.additionalContext,
+				...n
+			});
+		} catch (e) {
+			console.error("Button action failed:", e);
+		}
+	}, [
+		p,
+		m,
+		h,
+		g,
+		_,
+		F,
+		N,
+		v,
+		L.additionalContext
+	]), Bt = useCallback(() => {
+		W && N && $(W, { transfer: N });
+	}, [
+		W,
+		N,
+		$
+	]), Vt = useCallback(() => {
+		j(!0);
+	}, []), Ht = useCallback(async () => {
+		if (K) {
+			if (!await y(getDestructiveConfirmationOptions("UnsetActionDefinition"))) return;
+			n.isEager && d?.transferId ? h.updateTransferField(d.transferId, n.relationName, null) : $(K);
+		}
+	}, [
+		K,
+		$,
+		n.isEager,
+		n.relationName,
+		h,
+		d?.transferId,
+		y
+	]), Ut = useCallback(() => {
+		q && $(q);
+	}, [q, $]), Wt = useCallback(async () => {
+		if (J && N) {
+			if (!await y(getDestructiveConfirmationOptions("RowDeleteActionDefinition"))) return;
+			$(J, { transfer: N });
+		}
+	}, [
+		J,
+		N,
+		$,
+		y
+	]), Gt = useCallback((e) => {
+		switch (e.actionDefinition?.["@type"]) {
+			case "OpenPageActionDefinition":
+			case "RowOpenPageActionDefinition": return Bt;
+			case "OpenSetSelectorActionDefinition": return Vt;
+			case "UnsetActionDefinition": return Ht;
+			case "OpenCreateFormActionDefinition": return Ut;
+			case "RowDeleteActionDefinition": return Wt;
+			default: return () => {};
+		}
+	}, [
+		Bt,
+		Vt,
+		Ht,
+		Ut,
+		Wt
+	]);
+	useCallback((e) => {
+		switch (e.actionDefinition?.["@type"]) {
+			case "OpenPageActionDefinition":
+			case "RowOpenPageActionDefinition": return "View";
+			case "OpenSetSelectorActionDefinition": return "Set";
+			case "UnsetActionDefinition": return "Unset";
+			case "OpenCreateFormActionDefinition": return "Create";
+			case "RowDeleteActionDefinition": return "Delete";
+			default: return "Action";
+		}
+	}, []);
+	let Kt = useCallback(async (t) => {
+		if (j(!1), !G) return;
+		let r = p ? findActionByDefinition(p, G.actionDefinition) : void 0;
+		if (r) try {
+			await R(r, { selectedItem: t }), n.isEager && d?.transferId && h.updateTransferField(d.transferId, n.relationName, t);
+		} catch (e) {
+			console.error("Failed to set from selector:", e);
+		}
+	}, [
+		G,
+		p,
+		R,
+		n.isEager,
+		n.relationName,
+		h,
+		d?.transferId
+	]), qt = useCallback(() => {
+		j(!1);
+	}, []), Jt = useCallback((e, t) => e.__identifier && t.__identifier ? e.__identifier === t.__identifier : e.__signedIdentifier && t.__signedIdentifier ? e.__signedIdentifier === t.__signedIdentifier : e === t, []), Yt = It.length > 0 || X.length > 0;
+	return /* @__PURE__ */ jsxs(Box, {
+		"data-testid": c,
+		sx: {
+			display: "flex",
+			alignItems: "stretch"
+		},
+		children: [
+			/* @__PURE__ */ jsx(Box, {
+				sx: { flexGrow: 1 },
+				children: /* @__PURE__ */ jsx(Autocomplete, {
+					value: N,
+					onChange: Pt,
+					onInputChange: Mt,
+					onOpen: At,
+					options: Nt,
+					getOptionLabel: z,
+					filterOptions: (e) => e,
+					isOptionEqualToValue: Jt,
+					loading: E,
+					disabled: I,
+					freeSolo: !1,
+					"data-testid": `${c}::autocomplete`,
+					...Yt && { sx: { "& .MuiOutlinedInput-root": {
+						borderTopRightRadius: 0,
+						borderBottomRightRadius: 0
+					} } },
+					renderOption: ({ key: e, ...t }, n) => {
+						let r = String(n.__identifier ?? n.__signedIdentifier ?? z(n));
+						return /* @__PURE__ */ createElement("li", {
+							...t,
+							key: r
+						}, z(n));
+					},
+					renderInput: ({ inputProps: e, InputProps: t, ...n }) => /* @__PURE__ */ jsx(TextField, {
+						...n,
+						label: l,
+						required: !U,
+						fullWidth: !0,
+						slotProps: {
+							input: {
+								...t,
+								startAdornment: u ? /* @__PURE__ */ jsxs(Fragment, { children: [u, t.startAdornment] }) : t.startAdornment
+							},
+							inputLabel: { shrink: !0 },
+							htmlInput: {
+								...e,
+								"data-testid": `${c}::autocomplete::input`
+							}
+						}
+					})
+				})
+			}),
+			Yt && /* @__PURE__ */ jsxs(Box, {
+				ref: Q,
+				"data-testid": `${c}::actions`,
+				"aria-label": "link actions",
+				role: "group",
+				sx: (e) => {
+					let t = e.shape.borderRadius;
+					return {
+						display: "flex",
+						alignItems: "center",
+						marginTop: C.top,
+						marginBottom: C.bottom,
+						border: `1px solid ${e.palette.mode === "light" ? "rgba(0, 0, 0, 0.15)" : "rgba(255, 255, 255, 0.15)"}`,
+						borderLeft: "none",
+						borderRadius: `0 ${t}px ${t}px 0`,
+						"&:hover": { borderColor: e.palette.text.primary }
+					};
+				},
+				children: [It.map((e) => /* @__PURE__ */ jsx(LinkActionButton, {
+					button: e,
+					onClick: Gt(e)
+				}, e["xmi:id"])), X.length > 0 && /* @__PURE__ */ jsx(IconButton, {
+					size: "small",
+					onClick: Rt,
+					"data-testid": `${c}::actions::dropdown`,
+					"aria-label": "more actions",
+					sx: {
+						borderRadius: 0,
+						px: .5
+					},
+					children: /* @__PURE__ */ jsx(ArrowDropDownIcon, { fontSize: "small" })
+				})]
+			}),
+			/* @__PURE__ */ jsx(Popper, {
+				open: Lt,
+				anchorEl: Q.current,
+				transition: !0,
+				placement: "bottom-end",
+				sx: { zIndex: 1 },
+				"data-testid": `${c}::actions::menu`,
+				children: ({ TransitionProps: e, placement: t }) => /* @__PURE__ */ jsx(Grow, {
+					...e,
+					style: { transformOrigin: t === "bottom-end" ? "right top" : "right bottom" },
+					children: /* @__PURE__ */ jsx(Paper, { children: /* @__PURE__ */ jsx(ClickAwayListener, {
+						onClickAway: zt,
+						children: /* @__PURE__ */ jsx(MenuList, {
+							autoFocusItem: Lt,
+							children: X.map((e) => /* @__PURE__ */ jsx(LinkDropdownItem, {
+								button: e,
+								onClick: () => {
+									Z(!1), Gt(e)();
+								}
+							}, e["xmi:id"]))
+						})
+					}) })
+				})
+			}),
+			O && M && /* @__PURE__ */ jsx(LinkSelectorDialog, {
+				open: O,
+				element: n,
+				relationType: M,
+				api: _,
+				transfer: F,
+				onConfirm: Kt,
+				onCancel: qt
+			})
+		]
+	});
+}
+function LinkActionButton({ button: e, onClick: t }) {
+	let { label: r } = useModelLabel(e);
+	return /* @__PURE__ */ jsx(Tooltip, {
+		title: r,
+		children: /* @__PURE__ */ jsx(IconButton, {
+			size: "small",
+			onClick: t,
+			"data-testid": getButtonTestId(e),
+			"aria-label": r,
+			sx: {
+				borderRadius: 0,
+				px: 1
+			},
+			children: e.icon ? /* @__PURE__ */ jsx(IconRenderer, { icon: e.icon }) : /* @__PURE__ */ jsx("span", {
+				style: { fontSize: "0.875rem" },
+				children: r
+			})
+		})
+	});
+}
+function LinkDropdownItem({ button: e, onClick: t }) {
+	let { label: r } = useModelLabel(e);
+	return /* @__PURE__ */ jsxs(MenuItem, {
+		onClick: t,
+		"data-testid": getButtonTestId(e),
+		children: [e.icon && /* @__PURE__ */ jsx(IconRenderer, { icon: e.icon }), /* @__PURE__ */ jsx("span", {
+			style: { marginLeft: e.icon ? 8 : 0 },
+			children: r
+		})]
+	});
+}
+function StandaloneButtonRenderer({ element: r, page: a, onDispatch: o }) {
+	let s = useElementVisibility(r), l = useElementDisabled(r), u = usePageContextOptional(), d = useDispatchOptional(), f = a ?? u?.pageDefinition, p = o ?? d?.dispatch, { confirm: m } = useConfirmation(), h = async () => {
+		let n = f ? findActionByDefinition(f, r.actionDefinition) : void 0;
+		if (n && p) {
+			let e = r.actionDefinition?.["@type"];
+			if (isDestructiveAction(e) && !await m(getDestructiveConfirmationOptions(e))) return;
+			p(n).catch((e) => {
+				console.error("Button action failed:", e);
+			});
+		}
+	}, g = getButtonTestId(r), { label: _ } = useModelLabel(r);
+	return s ? null : /* @__PURE__ */ jsx(Button, {
+		variant: (() => {
+			let e = r.buttonStyle;
+			return e === "outlined" ? "outlined" : e === "text" ? "text" : "contained";
+		})(),
+		onClick: h,
+		disabled: l,
+		"data-testid": g,
+		startIcon: r.icon ? /* @__PURE__ */ jsx(IconRenderer, { icon: r.icon }) : void 0,
+		children: _
+	});
+}
+function SubThemeWrapper({ element: e, data: t, children: n }) {
+	let r = useSubThemeProvider(e);
+	return r ? /* @__PURE__ */ jsx(ThemeProvider, {
+		theme: (e) => createTheme(e, r(e, t)),
+		children: n
+	}) : /* @__PURE__ */ jsx(Fragment, { children: n });
+}
+function TabControllerRenderer({ element: e, readOnly: t }) {
+	let [n, r] = useState(0), i = getTabControllerTestId(e), a = e.sourceId ?? e["xmi:id"] ?? "unknown", o = getTabListTestId(a);
+	return /* @__PURE__ */ jsxs(Box, {
+		"data-testid": i,
+		children: [/* @__PURE__ */ jsx(Tabs, {
+			value: n,
+			onChange: (e, t) => r(t),
+			orientation: e.orientation === "VERTICAL" ? "vertical" : "horizontal",
+			"data-testid": o,
+			children: e.tabs.map((e, t) => /* @__PURE__ */ jsx(TranslatedTab, {
+				tab: e,
+				testId: getTabTestId(a, e, t)
+			}, e["xmi:id"] ?? t))
+		}), e.tabs.map((e, r) => {
+			let i = getTabPanelTestId(a, e, r);
+			return /* @__PURE__ */ jsx(Box, {
+				role: "tabpanel",
+				hidden: n !== r,
+				p: 2,
+				"data-testid": i,
+				children: n === r && e.element && /* @__PURE__ */ jsx(VisualElementRenderer, {
+					element: e.element,
+					readOnly: t
+				})
+			}, e["xmi:id"] ?? r);
+		})]
+	});
+}
+function TranslatedTab({ tab: e, testId: t }) {
+	let { label: n } = useModelLabel(e);
+	return /* @__PURE__ */ jsx(Tab, {
+		label: n,
+		"data-testid": t
+	});
+}
+function VisualElementRenderer({ element: e, readOnly: t }) {
+	if (useElementVisibility(e)) return null;
+	let n = useComponentOverride(e), r = usePageContextOptional();
+	if (n) {
+		let t = r?.pageDefinition;
+		return t ? /* @__PURE__ */ jsx(SubThemeWrapper, {
+			element: e,
+			children: /* @__PURE__ */ jsx(n, {
+				element: e,
+				page: t
+			})
+		}) : null;
+	}
+	let i = useComponentInterceptor(e);
+	if (i) {
+		let t = r?.pageDefinition;
+		return t ? /* @__PURE__ */ jsx(SubThemeWrapper, {
+			element: e,
+			children: /* @__PURE__ */ jsx(i, {
+				element: e,
+				page: t
+			})
+		}) : null;
+	}
+	let a = renderByType(e, t);
+	return a ? /* @__PURE__ */ jsx(SubThemeWrapper, {
+		element: e,
+		children: a
+	}) : null;
+}
+function renderByType(e, t) {
+	switch (e["@type"]) {
+		case "Flex":
+		case "PageContainer": return /* @__PURE__ */ jsx(FlexRenderer, {
+			element: e,
+			readOnly: t
+		});
+		case "Table": return /* @__PURE__ */ jsx(TableRenderer, { element: e });
+		case "Link": return /* @__PURE__ */ jsx(LinkRenderer, {
+			element: e,
+			readOnly: t
+		});
+		case "ButtonGroup": return /* @__PURE__ */ jsx(InlineButtonGroupRenderer, { element: e });
+		case "Button": return /* @__PURE__ */ jsx(StandaloneButtonRenderer, { element: e });
+		case "TabController": return /* @__PURE__ */ jsx(TabControllerRenderer, {
+			element: e,
+			readOnly: t
+		});
+		case "TextInput":
+		case "NumericInput":
+		case "DateInput":
+		case "DateTimeInput":
+		case "TimeInput":
+		case "EnumerationCombo":
+		case "EnumerationRadio":
+		case "EnumerationToggleButtonbar":
+		case "Checkbox":
+		case "Switch":
+		case "TrinaryLogicCombo":
+		case "TextArea":
+		case "BinaryTypeInput":
+		case "PasswordInput": return /* @__PURE__ */ jsx(InputRenderer, {
+			element: e,
+			readOnly: t
+		});
+		case "Spacer": return /* @__PURE__ */ jsx("div", {
+			style: { flex: 1 },
+			"data-testid": `spacer::${e["xmi:id"]}`
+		});
+		case "Divider": return /* @__PURE__ */ jsx("hr", { "data-testid": `divider::${e["xmi:id"]}` });
+		case "Formatted": return /* @__PURE__ */ jsx(FormattedRenderer, { element: e });
+		default: return console.warn(`Unknown element type: ${e["@type"]}`), null;
+	}
+}
+function FlexRenderer({ element: e, readOnly: t }) {
+	let n = isVerticalLayout(e.direction), r = mapMainAxisAlignment(e.mainAxisAlignment), i = mapCrossAxisAlignment(e.crossAxisAlignment), a = e.col ?? 4, o = {
+		width: e.size?.width ?? "100%",
+		height: e.size?.height,
+		minWidth: e.sizeConstraint?.minWidth,
+		minHeight: e.sizeConstraint?.minHeight,
+		maxWidth: e.sizeConstraint?.maxWidth ?? "100%",
+		maxHeight: e.sizeConstraint?.maxHeight
+	}, s = e.children?.map((n) => /* @__PURE__ */ jsx(FlexChild, {
+		child: n,
+		gridSize: calculateChildGridSize(e.direction, a, n.col ?? 4),
+		readOnly: t
+	}, n["xmi:id"])), c = n ? /* @__PURE__ */ jsx(Stack$1, {
+		spacing: 2,
+		className: "force-full-width",
+		"data-testid": `flex::${e.sourceId ?? e["xmi:id"]}`,
+		sx: o,
+		children: s
+	}) : /* @__PURE__ */ jsx(Grid$1, {
+		container: !0,
+		justifyContent: r,
+		alignItems: i,
+		spacing: 2,
+		"data-testid": `flex::${e.sourceId ?? e["xmi:id"]}`,
+		sx: o,
+		children: s
+	});
+	return e.frame ? /* @__PURE__ */ jsx(TranslatedFrame, {
+		element: e,
+		children: c
+	}) : c;
+}
+function TranslatedFrame({ element: e, children: t }) {
+	let { label: n } = useModelLabel(e);
+	return /* @__PURE__ */ jsx(FrameRenderer, {
+		frame: e.frame,
+		label: n,
+		icon: e.icon,
+		children: t
+	});
+}
+function FlexChild({ child: e, gridSize: t, readOnly: n }) {
+	return useElementVisibility(e) ? null : /* @__PURE__ */ jsx(Grid$1, {
+		size: t,
+		sx: { minWidth: 0 },
+		children: /* @__PURE__ */ jsx(VisualElementRenderer, {
+			element: e,
+			readOnly: n
+		})
+	});
+}
+export { calculateVerticalGridSize as A, BinaryInputComponent as C, calculateChildGridSize as D, FULL_GRID_WIDTH as E, mapAlignment as M, mapCrossAxisAlignment as N, calculateHorizontalGridSize as O, mapMainAxisAlignment as P, CheckboxComponent as S, DEFAULT_COL as T, EnumerationToggleButtonbarComponent as _, StandaloneButtonRenderer as a, DateTimeInputComponent as b, LinkSelectorDialog as c, TimeInputComponent as d, TextInputComponent as f, NumericInputComponent as g, PasswordInputComponent as h, SubThemeWrapper as i, isVerticalLayout as j, calculateScaledSize as k, InlineButtonGroupRenderer as l, SwitchComponent as m, VisualElementRenderer as n, LinkRenderer as o, TextAreaComponent as p, TabControllerRenderer as r, buildMaskString as s, FlexRenderer as t, InputRenderer as u, EnumerationRadioComponent as v, FrameRenderer as w, DateInputComponent as x, EnumerationComboComponent as y };