@gxp-dev/mod-ui 2.0.10 → 2.0.14

package/dist/chunks/ModalBlock-B1EezrzH.js

@@ -0,0 +1,82 @@
+import { t as e } from "./rolldown-runtime-Dy4uBu1J.js";
+import { n as t } from "./utils-DAErOi9O.js";
+import { n } from "./badge-4iQG4kuk.js";
+import { n as r } from "./button-BAwcISlK.js";
+import { d as i, i as a, n as o, r as s, s as c } from "./sheet-7uxecGyn.js";
+import { t as l } from "./ElementRenderer-DUhlfnFD.js";
+import { Fragment as u, computed as d, createBlock as f, createElementBlock as p, createTextVNode as m, createVNode as h, defineComponent as g, normalizeClass as _, openBlock as v, renderList as y, toDisplayString as b, unref as x, withCtx as S } from "vue";
+import { Construction as C } from "@lucide/vue";
+//#region src/components/compositions/elements/configuration-block/ModalBlock.vue?vue&type=script&setup=true&lang.ts
+var w = {
+	key: 0,
+	class: "flex flex-col gap-3 py-4"
+}, T = {
+	key: 1,
+	class: "py-4 text-sm text-muted-foreground"
+}, E = "modal", D = /* @__PURE__ */ g({
+	__name: "ModalBlock",
+	props: {
+		label: { default: "Modal" },
+		name: {},
+		triggerLabel: {},
+		title: {},
+		nestedElements: { default: () => [] },
+		item: { default: () => ({}) },
+		classList: {}
+	},
+	setup(e) {
+		let g = e, D = d(() => g.triggerLabel ?? g.label ?? "Open modal"), O = d(() => g.title ?? g.label ?? "Modal"), k = d(() => (g.nestedElements ?? []).filter((e) => typeof e == "object" && !!e && typeof e.type == "string"));
+		return (e, d) => (v(), f(x(i), null, {
+			default: S(() => [h(x(o), { "as-child": "" }, {
+				default: S(() => [h(x(r), {
+					type: "button",
+					variant: "outline",
+					class: _(x(t)(g.classList)),
+					"data-element-name": g.name ?? void 0,
+					"data-stub": `configuration-block/${E}`,
+					"aria-label": g.label
+				}, {
+					default: S(() => [
+						h(x(C), { class: "size-4" }),
+						m(" " + b(D.value) + " ", 1),
+						h(x(n), {
+							variant: "outline",
+							size: "sm"
+						}, {
+							default: S(() => [m(b(E))]),
+							_: 1
+						})
+					]),
+					_: 1
+				}, 8, [
+					"class",
+					"data-element-name",
+					"data-stub",
+					"aria-label"
+				])]),
+				_: 1
+			}), h(x(c), {
+				side: "right",
+				class: "sm:max-w-xl"
+			}, {
+				default: S(() => [h(x(a), null, {
+					default: S(() => [h(x(s), null, {
+						default: S(() => [m(b(O.value), 1)]),
+						_: 1
+					})]),
+					_: 1
+				}), k.value.length ? (v(), p("div", w, [(v(!0), p(u, null, y(k.value, (e) => (v(), f(l, {
+					key: e.id,
+					element: e,
+					item: g.item
+				}, null, 8, ["element", "item"]))), 128))])) : (v(), p("p", T, " Modal block — FormBuilder integration coming in task #7. "))]),
+				_: 1
+			})]),
+			_: 1
+		}));
+	}
+}), O = /* @__PURE__ */ e({ default: () => k }), k = D;
+//#endregion
+export { O as n, k as t };
+
+//# sourceMappingURL=ModalBlock-B1EezrzH.js.map

package/dist/chunks/ModalBlock-B1EezrzH.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ModalBlock-B1EezrzH.js","names":[],"sources":["../../src/components/compositions/elements/configuration-block/ModalBlock.vue","../../src/components/compositions/elements/configuration-block/ModalBlock.vue"],"sourcesContent":["<script setup lang=\"ts\">\n/**\n * Props-driven renderer for `configuration-block/modal`.\n *\n * Sister to DialogBlock — wraps inner children (`nestedElements`) in a\n * full-bleed Sheet-style modal opened by a trigger Button. Full\n * FormBuilder integration arrives in task #7.\n */\nimport { computed } from \"vue\"\nimport { Construction } from \"@lucide/vue\"\nimport type { CardElement } from \"@/definitions/elements\"\nimport {\n  Sheet,\n  SheetContent,\n  SheetHeader,\n  SheetTitle,\n  SheetTrigger,\n} from \"@/components/ui/sheet\"\nimport { Button } from \"@/components/ui/button\"\nimport { Badge } from \"@/components/ui/badge\"\nimport ElementRenderer from \"@/engine/ElementRenderer.vue\"\nimport { cn } from \"@/lib/utils\"\n\nexport interface ModalBlockProps {\n  label?: string\n  name?: string | null\n  triggerLabel?: string\n  title?: string\n  nestedElements?: CardElement[]\n  item?: Record<string, unknown>\n  classList?: string[] | string\n}\n\nconst props = withDefaults(defineProps<ModalBlockProps>(), {\n  label: \"Modal\",\n  nestedElements: () => [],\n  item: () => ({}),\n})\n\nconst styleKey = \"modal\"\n\nconst resolvedTrigger = computed(\n  () => props.triggerLabel ?? props.label ?? \"Open modal\",\n)\nconst resolvedTitle = computed(\n  () => props.title ?? props.label ?? \"Modal\",\n)\n\nconst children = computed<CardElement[]>(() =>\n  (props.nestedElements ?? []).filter(\n    (entry): entry is CardElement =>\n      typeof entry === \"object\" &&\n      entry !== null &&\n      typeof (entry as { type?: unknown }).type === \"string\",\n  ),\n)\n</script>\n\n<template>\n  <Sheet>\n    <SheetTrigger as-child>\n      <Button\n        type=\"button\"\n        variant=\"outline\"\n        :class=\"cn(props.classList)\"\n        :data-element-name=\"props.name ?? undefined\"\n        :data-stub=\"`configuration-block/${styleKey}`\"\n        :aria-label=\"props.label\"\n      >\n        <Construction class=\"size-4\" />\n        {{ resolvedTrigger }}\n        <Badge variant=\"outline\" size=\"sm\">{{ styleKey }}</Badge>\n      </Button>\n    </SheetTrigger>\n    <SheetContent side=\"right\" class=\"sm:max-w-xl\">\n      <SheetHeader>\n        <SheetTitle>{{ resolvedTitle }}</SheetTitle>\n      </SheetHeader>\n      <div v-if=\"children.length\" class=\"flex flex-col gap-3 py-4\">\n        <ElementRenderer\n          v-for=\"child in children\"\n          :key=\"child.id\"\n          :element=\"child\"\n          :item=\"props.item\"\n        />\n      </div>\n      <p v-else class=\"py-4 text-sm text-muted-foreground\">\n        Modal block — FormBuilder integration coming in task #7.\n      </p>\n    </SheetContent>\n  </Sheet>\n</template>\n","<script setup lang=\"ts\">\n/**\n * Props-driven renderer for `configuration-block/modal`.\n *\n * Sister to DialogBlock — wraps inner children (`nestedElements`) in a\n * full-bleed Sheet-style modal opened by a trigger Button. Full\n * FormBuilder integration arrives in task #7.\n */\nimport { computed } from \"vue\"\nimport { Construction } from \"@lucide/vue\"\nimport type { CardElement } from \"@/definitions/elements\"\nimport {\n  Sheet,\n  SheetContent,\n  SheetHeader,\n  SheetTitle,\n  SheetTrigger,\n} from \"@/components/ui/sheet\"\nimport { Button } from \"@/components/ui/button\"\nimport { Badge } from \"@/components/ui/badge\"\nimport ElementRenderer from \"@/engine/ElementRenderer.vue\"\nimport { cn } from \"@/lib/utils\"\n\nexport interface ModalBlockProps {\n  label?: string\n  name?: string | null\n  triggerLabel?: string\n  title?: string\n  nestedElements?: CardElement[]\n  item?: Record<string, unknown>\n  classList?: string[] | string\n}\n\nconst props = withDefaults(defineProps<ModalBlockProps>(), {\n  label: \"Modal\",\n  nestedElements: () => [],\n  item: () => ({}),\n})\n\nconst styleKey = \"modal\"\n\nconst resolvedTrigger = computed(\n  () => props.triggerLabel ?? props.label ?? \"Open modal\",\n)\nconst resolvedTitle = computed(\n  () => props.title ?? props.label ?? \"Modal\",\n)\n\nconst children = computed<CardElement[]>(() =>\n  (props.nestedElements ?? []).filter(\n    (entry): entry is CardElement =>\n      typeof entry === \"object\" &&\n      entry !== null &&\n      typeof (entry as { type?: unknown }).type === \"string\",\n  ),\n)\n</script>\n\n<template>\n  <Sheet>\n    <SheetTrigger as-child>\n      <Button\n        type=\"button\"\n        variant=\"outline\"\n        :class=\"cn(props.classList)\"\n        :data-element-name=\"props.name ?? undefined\"\n        :data-stub=\"`configuration-block/${styleKey}`\"\n        :aria-label=\"props.label\"\n      >\n        <Construction class=\"size-4\" />\n        {{ resolvedTrigger }}\n        <Badge variant=\"outline\" size=\"sm\">{{ styleKey }}</Badge>\n      </Button>\n    </SheetTrigger>\n    <SheetContent side=\"right\" class=\"sm:max-w-xl\">\n      <SheetHeader>\n        <SheetTitle>{{ resolvedTitle }}</SheetTitle>\n      </SheetHeader>\n      <div v-if=\"children.length\" class=\"flex flex-col gap-3 py-4\">\n        <ElementRenderer\n          v-for=\"child in children\"\n          :key=\"child.id\"\n          :element=\"child\"\n          :item=\"props.item\"\n        />\n      </div>\n      <p v-else class=\"py-4 text-sm text-muted-foreground\">\n        Modal block — FormBuilder integration coming in task #7.\n      </p>\n    </SheetContent>\n  </Sheet>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;GAuCM,IAAW;;;;;;;;;;;;EANjB,IAAM,IAAQ,GAQR,IAAkB,QAChB,EAAM,gBAAgB,EAAM,SAAS,YAC7C,GACM,IAAgB,QACd,EAAM,SAAS,EAAM,SAAS,OACtC,GAEM,IAAW,SACd,EAAM,kBAAkB,CAAC,GAAG,QAC1B,MACC,OAAO,KAAU,cACjB,KACA,OAAQ,EAA6B,QAAS,QAClD,CACF;yBAIE,EA+BQ,EAAA,CAAA,GAAA,MAAA;oBAjBS,CAbf,EAae,EAAA,CAAA,GAAA,EAbD,YAAA,GAAQ,GAAA;qBAYX,CAXT,EAWS,EAAA,CAAA,GAAA;KAVP,MAAK;KACL,SAAQ;KACP,OAAK,EAAE,EAAA,CAAA,EAAG,EAAM,SAAS,CAAA;KACzB,qBAAmB,EAAM,QAAQ,KAAA;KACjC,aAAS,uBAAyB;KAClC,cAAY,EAAM;;sBAEY;MAA/B,EAA+B,EAAA,CAAA,GAAA,EAAjB,OAAM,SAAQ,CAAA;QAAG,MAC/B,EAAG,EAAA,KAAe,IAAG,KACrB,CAAA;MAAA,EAAyD,EAAA,CAAA,GAAA;OAAlD,SAAQ;OAAU,MAAK;;wBAAmB,CAAA,EAAA,EAAX,CAAQ,CAAA,CAAA,CAAA;;;;;;;;;;;;OAGlD,EAee,EAAA,CAAA,GAAA;IAfD,MAAK;IAAQ,OAAM;;qBAGjB,CAFd,EAEc,EAAA,CAAA,GAAA,MAAA;sBADgC,CAA5C,EAA4C,EAAA,CAAA,GAAA,MAAA;uBAAb,CAAA,EAAA,EAAhB,EAAA,KAAa,GAAA,CAAA,CAAA,CAAA;;;;QAEnB,EAAA,MAAS,UAAA,EAAA,GAApB,EAOM,OAPN,GAOM,EAAA,EAAA,EAAA,GANJ,EAKE,GAAA,MAAA,EAJgB,EAAA,QAAT,YADT,EAKE,GAAA;KAHC,KAAK,EAAM;KACX,SAAS;KACT,MAAM,EAAM;yDAGjB,EAEI,KAFJ,GAAqD,4DAErD,EAAA,CAAA"}

package/dist/chunks/NumberInput-DNQo57YU.js

@@ -0,0 +1,95 @@
+import { t as e } from "./rolldown-runtime-Dy4uBu1J.js";
+import { t } from "./input-tw5ZQGKQ.js";
+import { t as n } from "./field-frame-n5oLDNBT.js";
+import { createBlock as r, createVNode as i, defineComponent as a, mergeModels as o, normalizeClass as s, onMounted as c, openBlock as l, unref as u, useModel as d, useTemplateRef as f, withCtx as p } from "vue";
+//#region src/components/compositions/elements/input/NumberInput.vue?vue&type=script&setup=true&lang.ts
+var m = /* @__PURE__ */ a({
+	__name: "NumberInput",
+	props: /* @__PURE__ */ o({
+		modelValue: {},
+		id: {},
+		name: {},
+		label: {},
+		hideLabel: { type: Boolean },
+		placeholder: {},
+		required: { type: Boolean },
+		readonly: { type: Boolean },
+		disabled: { type: Boolean },
+		min: {},
+		max: {},
+		step: {},
+		helpText: {},
+		errors: { default: () => [] },
+		autoFocus: { type: Boolean }
+	}, {
+		modelValue: {},
+		modelModifiers: {}
+	}),
+	emits: ["update:modelValue"],
+	setup(e) {
+		let a = e, o = d(e, "modelValue"), m = f("inputRef");
+		c(() => {
+			a.autoFocus && m.value?.focus();
+		});
+		function h(e) {
+			if (e === void 0 || e === "" || e === null) {
+				o.value = null;
+				return;
+			}
+			let t = typeof e == "number" ? e : Number(e);
+			o.value = Number.isFinite(t) ? t : null;
+		}
+		return (a, c) => (l(), r(u(n), {
+			label: e.label,
+			required: e.required,
+			"hide-label": e.hideLabel,
+			for: e.id,
+			"help-text": e.helpText,
+			errors: e.errors
+		}, {
+			default: p(() => [i(u(t), {
+				ref_key: "inputRef",
+				ref: m,
+				"model-value": o.value ?? void 0,
+				id: e.id,
+				name: e.name ?? void 0,
+				type: "number",
+				placeholder: e.placeholder ?? "",
+				readonly: e.readonly,
+				disabled: e.disabled,
+				required: e.required,
+				min: e.min,
+				max: e.max,
+				step: e.step,
+				"data-element-name": e.name ?? void 0,
+				class: s(e.errors.length ? "border-destructive ring-destructive" : ""),
+				"onUpdate:modelValue": h
+			}, null, 8, [
+				"model-value",
+				"id",
+				"name",
+				"placeholder",
+				"readonly",
+				"disabled",
+				"required",
+				"min",
+				"max",
+				"step",
+				"data-element-name",
+				"class"
+			])]),
+			_: 1
+		}, 8, [
+			"label",
+			"required",
+			"hide-label",
+			"for",
+			"help-text",
+			"errors"
+		]));
+	}
+}), h = /* @__PURE__ */ e({ default: () => g }), g = m;
+//#endregion
+export { h as n, g as t };
+
+//# sourceMappingURL=NumberInput-DNQo57YU.js.map

package/dist/chunks/NumberInput-DNQo57YU.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"NumberInput-DNQo57YU.js","names":[],"sources":["../../src/components/compositions/elements/input/NumberInput.vue","../../src/components/compositions/elements/input/NumberInput.vue"],"sourcesContent":["<script setup lang=\"ts\">\n/**\n * Props-driven number input composition. Composes the shadcn `Input`\n * primitive (with `type=\"number\"`) and `FieldFrame` chrome.\n *\n * Self-contained — usable directly in any Vue app:\n *\n *   <NumberInput v-model=\"age\" label=\"Age\" :min=\"0\" :max=\"120\" />\n *\n * The JSON-driven engine renders this via `ElementRenderer`, which\n * binds `modelValue` / `errors` to the form-data store automatically.\n */\nimport { onMounted, useTemplateRef } from \"vue\"\nimport { Input } from \"@/components/ui/input\"\nimport { FieldFrame } from \"@/components/ui/field-frame\"\n\nexport interface NumberInputProps {\n  modelValue?: number | null\n  id?: string\n  name?: string\n  label?: string\n  hideLabel?: boolean\n  placeholder?: string\n  required?: boolean\n  readonly?: boolean\n  disabled?: boolean\n  min?: number\n  max?: number\n  step?: number\n  helpText?: string\n  errors?: string[]\n  autoFocus?: boolean\n}\n\nconst props = withDefaults(defineProps<NumberInputProps>(), {\n  errors: () => [],\n})\n\nconst model = defineModel<number | null>(\"modelValue\")\n\nconst inputRef = useTemplateRef<HTMLInputElement>(\"inputRef\")\n\nonMounted(() => {\n  if (props.autoFocus) {\n    inputRef.value?.focus()\n  }\n})\n\nfunction onUpdate(raw: string | number | undefined): void {\n  if (raw === undefined || raw === \"\" || raw === null) {\n    model.value = null\n    return\n  }\n  const num = typeof raw === \"number\" ? raw : Number(raw)\n  model.value = Number.isFinite(num) ? num : null\n}\n</script>\n\n<template>\n  <FieldFrame\n    :label=\"label\"\n    :required=\"required\"\n    :hide-label=\"hideLabel\"\n    :for=\"id\"\n    :help-text=\"helpText\"\n    :errors=\"errors\"\n  >\n    <Input\n      ref=\"inputRef\"\n      :model-value=\"model ?? undefined\"\n      :id=\"id\"\n      :name=\"name ?? undefined\"\n      type=\"number\"\n      :placeholder=\"placeholder ?? ''\"\n      :readonly=\"readonly\"\n      :disabled=\"disabled\"\n      :required=\"required\"\n      :min=\"min\"\n      :max=\"max\"\n      :step=\"step\"\n      :data-element-name=\"name ?? undefined\"\n      :class=\"errors.length ? 'border-destructive ring-destructive' : ''\"\n      @update:model-value=\"onUpdate\"\n    />\n  </FieldFrame>\n</template>\n","<script setup lang=\"ts\">\n/**\n * Props-driven number input composition. Composes the shadcn `Input`\n * primitive (with `type=\"number\"`) and `FieldFrame` chrome.\n *\n * Self-contained — usable directly in any Vue app:\n *\n *   <NumberInput v-model=\"age\" label=\"Age\" :min=\"0\" :max=\"120\" />\n *\n * The JSON-driven engine renders this via `ElementRenderer`, which\n * binds `modelValue` / `errors` to the form-data store automatically.\n */\nimport { onMounted, useTemplateRef } from \"vue\"\nimport { Input } from \"@/components/ui/input\"\nimport { FieldFrame } from \"@/components/ui/field-frame\"\n\nexport interface NumberInputProps {\n  modelValue?: number | null\n  id?: string\n  name?: string\n  label?: string\n  hideLabel?: boolean\n  placeholder?: string\n  required?: boolean\n  readonly?: boolean\n  disabled?: boolean\n  min?: number\n  max?: number\n  step?: number\n  helpText?: string\n  errors?: string[]\n  autoFocus?: boolean\n}\n\nconst props = withDefaults(defineProps<NumberInputProps>(), {\n  errors: () => [],\n})\n\nconst model = defineModel<number | null>(\"modelValue\")\n\nconst inputRef = useTemplateRef<HTMLInputElement>(\"inputRef\")\n\nonMounted(() => {\n  if (props.autoFocus) {\n    inputRef.value?.focus()\n  }\n})\n\nfunction onUpdate(raw: string | number | undefined): void {\n  if (raw === undefined || raw === \"\" || raw === null) {\n    model.value = null\n    return\n  }\n  const num = typeof raw === \"number\" ? raw : Number(raw)\n  model.value = Number.isFinite(num) ? num : null\n}\n</script>\n\n<template>\n  <FieldFrame\n    :label=\"label\"\n    :required=\"required\"\n    :hide-label=\"hideLabel\"\n    :for=\"id\"\n    :help-text=\"helpText\"\n    :errors=\"errors\"\n  >\n    <Input\n      ref=\"inputRef\"\n      :model-value=\"model ?? undefined\"\n      :id=\"id\"\n      :name=\"name ?? undefined\"\n      type=\"number\"\n      :placeholder=\"placeholder ?? ''\"\n      :readonly=\"readonly\"\n      :disabled=\"disabled\"\n      :required=\"required\"\n      :min=\"min\"\n      :max=\"max\"\n      :step=\"step\"\n      :data-element-name=\"name ?? undefined\"\n      :class=\"errors.length ? 'border-destructive ring-destructive' : ''\"\n      @update:model-value=\"onUpdate\"\n    />\n  </FieldFrame>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAkCA,IAAM,IAAQ,GAIR,IAAQ,EAA0B,GAAC,YAAY,GAE/C,IAAW,EAAiC,UAAU;EAE5D,QAAgB;GACd,AAAI,EAAM,aACR,EAAS,OAAO,MAAM;EAE1B,CAAC;EAED,SAAS,EAAS,GAAwC;GACxD,IAAI,MAAQ,KAAA,KAAa,MAAQ,MAAM,MAAQ,MAAM;IACnD,EAAM,QAAQ;IACd;GACF;GACA,IAAM,IAAM,OAAO,KAAQ,WAAW,IAAM,OAAO,CAAG;GACtD,EAAM,QAAQ,OAAO,SAAS,CAAG,IAAI,IAAM;EAC7C;yBAIE,EAyBa,EAAA,CAAA,GAAA;GAxBV,OAAO,EAAA;GACP,UAAU,EAAA;GACV,cAAY,EAAA;GACZ,KAAK,EAAA;GACL,aAAW,EAAA;GACX,QAAQ,EAAA;;oBAkBP,CAhBF,EAgBE,EAAA,CAAA,GAAA;aAfI;IAAJ,KAAI;IACH,eAAa,EAAA,SAAS,KAAA;IACtB,IAAI,EAAA;IACJ,MAAM,EAAA,QAAQ,KAAA;IACf,MAAK;IACJ,aAAa,EAAA,eAAW;IACxB,UAAU,EAAA;IACV,UAAU,EAAA;IACV,UAAU,EAAA;IACV,KAAK,EAAA;IACL,KAAK,EAAA;IACL,MAAM,EAAA;IACN,qBAAmB,EAAA,QAAQ,KAAA;IAC3B,OAAK,EAAE,EAAA,OAAO,SAAM,wCAAA,EAAA;IACpB,uBAAoB"}

package/dist/chunks/ObjectBuilder-2gxFY61a.js

@@ -0,0 +1,381 @@
+import { t as e } from "./rolldown-runtime-Dy4uBu1J.js";
+import { n as t } from "./utils-DAErOi9O.js";
+import { n } from "./badge-4iQG4kuk.js";
+import { n as r } from "./button-BAwcISlK.js";
+import { n as ee, o as i, r as te, s as ne } from "./card-DAfWnvro.js";
+import { t as a } from "./input-tw5ZQGKQ.js";
+import { n as o } from "./label-I5voJX5E.js";
+import { l as s, n as re, s as ie, t as ae, u as oe } from "./select-DZcdBLiy.js";
+import { r as se } from "./switch--qhuMfjn.js";
+import { t as ce } from "./textarea-lgNOfYRH.js";
+import { a as c, i as le, r as ue } from "./objectBuilderStore-BE7Yqs0o.js";
+import { Fragment as l, computed as u, createBlock as d, createCommentVNode as f, createElementBlock as p, createElementVNode as m, createTextVNode as h, createVNode as g, defineComponent as _, mergeModels as v, normalizeClass as y, onMounted as de, openBlock as b, ref as x, renderList as S, toDisplayString as C, unref as w, useModel as fe, watch as T, withCtx as E } from "vue";
+import { ArrowDown as D, ArrowUp as O, Plus as k, Trash2 as A, X as j } from "@lucide/vue";
+//#region src/components/compositions/elements/builder/ObjectBuilder.vue?vue&type=script&setup=true&lang.ts
+var M = ["data-element-name"], N = {
+	class: "flex flex-col gap-2 border-r p-3 overflow-y-auto",
+	"data-testid": "object-builder-palette"
+}, P = { class: "text-xs font-semibold uppercase tracking-wide text-muted-foreground" }, F = { class: "flex flex-col gap-1" }, I = ["data-testid", "onClick"], L = { class: "flex min-w-0 flex-col gap-0.5" }, R = { class: "font-medium" }, z = { class: "line-clamp-2 text-[10px] text-muted-foreground" }, B = {
+	class: "flex flex-col gap-3 overflow-y-auto p-3",
+	"data-testid": "object-builder-canvas"
+}, V = { class: "flex items-center justify-between" }, pe = {
+	key: 0,
+	class: "rounded-md border border-dashed bg-background py-6 text-center text-xs text-muted-foreground",
+	"data-testid": "object-builder-canvas-empty"
+}, me = {
+	key: 1,
+	class: "flex flex-col gap-1 text-xs",
+	"data-testid": "object-builder-canvas-list"
+}, he = ["data-testid", "onClick"], ge = { class: "w-6 text-right tabular-nums text-muted-foreground" }, _e = { class: "font-medium" }, ve = { class: "ml-auto max-w-[12rem] truncate font-mono text-[10px] text-muted-foreground" }, ye = {
+	class: "flex flex-col gap-2 overflow-y-auto border-l p-3",
+	"data-testid": "object-builder-inspector"
+}, be = { class: "flex items-center justify-between" }, xe = {
+	key: 0,
+	class: "py-3 text-xs text-muted-foreground",
+	"data-testid": "object-builder-inspector-empty"
+}, Se = {
+	key: 1,
+	class: "flex flex-col gap-3",
+	"data-testid": "object-builder-inspector-fields"
+}, Ce = { class: "flex flex-col gap-1" }, we = { class: "flex flex-col gap-1" }, Te = {
+	key: 0,
+	class: "flex flex-col gap-1"
+}, Ee = {
+	key: 1,
+	class: "flex flex-col gap-1"
+}, De = {
+	key: 2,
+	class: "flex items-center justify-between rounded border bg-background px-2 py-1"
+}, Oe = {
+	key: 3,
+	class: "flex flex-col gap-1"
+}, ke = {
+	key: 0,
+	class: "text-[11px] text-destructive",
+	"data-testid": "object-builder-inspector-value-json-error"
+}, Ae = {
+	key: 4,
+	class: "rounded border bg-background px-2 py-1 text-xs text-muted-foreground",
+	"data-testid": "object-builder-inspector-value-null"
+}, je = { class: "flex items-center gap-1" }, H = /* @__PURE__ */ _({
+	__name: "ObjectBuilder",
+	props: /* @__PURE__ */ v({
+		modelValue: {},
+		builderId: {},
+		label: { default: "Object Builder" },
+		name: {},
+		classList: {}
+	}, {
+		modelValue: {},
+		modelModifiers: {}
+	}),
+	emits: ["update:modelValue"],
+	setup(e, { expose: _ }) {
+		let v = e, H = fe(e, "modelValue"), U = 0;
+		function W() {
+			return U += 1, `object-builder-${Date.now()}-${U}`;
+		}
+		let Me = x(W()), G = c(u(() => v.builderId ?? Me.value).value), K = [
+			{
+				type: "string",
+				displayLabel: "String",
+				description: "A text value."
+			},
+			{
+				type: "number",
+				displayLabel: "Number",
+				description: "A numeric value."
+			},
+			{
+				type: "boolean",
+				displayLabel: "Boolean",
+				description: "true or false."
+			},
+			{
+				type: "array",
+				displayLabel: "Array",
+				description: "A JSON array (edit as JSON)."
+			},
+			{
+				type: "object",
+				displayLabel: "Object",
+				description: "A nested object (edit as JSON)."
+			},
+			{
+				type: "null",
+				displayLabel: "Null",
+				description: "Explicit null."
+			}
+		];
+		function Ne(e) {
+			if (typeof e != "object" || !e) return !1;
+			let t = e;
+			return Array.isArray(t.entries);
+		}
+		de(() => {
+			let e = H.value;
+			e != null && (Ne(e) ? G.loadSchema(e) : typeof e == "object" && G.loadSchema(ue(e)));
+		}), T(() => G.schema.value, (e) => {
+			H.value = { entries: e.entries.map((e) => ({ ...e })) };
+		}, { deep: !0 });
+		let q = u(() => G.schema.value.entries), J = u(() => {
+			let e = G.selection.value;
+			return e.id ? q.value.find((t) => t.id === e.id) ?? null : null;
+		}), Y = u(() => {
+			let e = G.selection.value;
+			return e.id ? q.value.findIndex((t) => t.id === e.id) : -1;
+		}), X = u(() => Y.value >= 0 && Y.value < q.value.length - 1);
+		function Pe(e) {
+			let t = G.addEntry(e);
+			G.select(t);
+		}
+		function Fe(e) {
+			G.select(e);
+		}
+		function Ie() {
+			Y.value <= 0 || G.reorderEntry(Y.value, Y.value - 1);
+		}
+		function Le() {
+			X.value && G.reorderEntry(Y.value, Y.value + 1);
+		}
+		function Re() {
+			let e = G.selection.value;
+			e.id && G.removeEntry(e.id);
+		}
+		function ze() {
+			G.select(null);
+		}
+		function Z(e) {
+			let t = G.selection.value;
+			t.id && G.updateEntry(t.id, e);
+		}
+		function Be(e) {
+			switch (e.type) {
+				case "null": return "null";
+				case "boolean": return e.value ? "true" : "false";
+				case "string": return e.value === "" ? "\"\"" : String(e.value);
+				case "number": return String(e.value);
+				case "array":
+				case "object": try {
+					return JSON.stringify(e.value);
+				} catch {
+					return "(invalid)";
+				}
+			}
+		}
+		let Ve = u(() => J.value?.key ?? ""), He = u(() => J.value && J.value.type === "string" ? String(J.value.value ?? "") : ""), Ue = u(() => J.value && J.value.type === "number" ? String(J.value.value ?? 0) : ""), We = u(() => J.value && J.value.type === "boolean" ? !!J.value.value : !1), Q = x(""), $ = x("");
+		T(() => J.value, (e) => {
+			if (!e) {
+				Q.value = "", $.value = "";
+				return;
+			}
+			if (e.type === "array" || e.type === "object") {
+				try {
+					Q.value = JSON.stringify(e.value, null, 2);
+				} catch {
+					Q.value = "";
+				}
+				$.value = "";
+			}
+		}, { immediate: !0 });
+		function Ge(e) {
+			Q.value = e;
+			try {
+				let t = JSON.parse(e), n = J.value;
+				if (!n) return;
+				if (n.type === "array" && !Array.isArray(t)) {
+					$.value = "Value must be a JSON array.";
+					return;
+				}
+				if (n.type === "object" && (typeof t != "object" || !t || Array.isArray(t))) {
+					$.value = "Value must be a JSON object.";
+					return;
+				}
+				$.value = "", Z({ value: t });
+			} catch (e) {
+				$.value = e instanceof Error ? e.message : "Invalid JSON.";
+			}
+		}
+		function Ke(e) {
+			Z({ type: e });
+		}
+		return _({ toRecord: le }), (e, c) => (b(), p("div", {
+			class: y(w(t)("gxp-object-builder grid gap-3 rounded-lg border bg-card", v.classList)),
+			style: {
+				"grid-template-columns": "200px 1fr 300px",
+				"min-height": "22rem"
+			},
+			"data-testid": "object-builder",
+			"data-element-name": v.name ?? void 0
+		}, [
+			m("aside", N, [m("h4", P, C(v.label), 1), m("div", F, [(b(), p(l, null, S(K, (e) => m("button", {
+				key: e.type,
+				type: "button",
+				class: "flex items-start gap-2 rounded-md border bg-background px-2 py-1.5 text-left text-xs transition-colors hover:border-primary hover:bg-accent/40",
+				"data-testid": `object-builder-palette-${e.type}`,
+				onClick: (t) => Pe(e.type)
+			}, [g(w(k), { class: "mt-0.5 h-3.5 w-3.5 shrink-0" }), m("span", L, [m("span", R, C(e.displayLabel), 1), m("span", z, C(e.description), 1)])], 8, I)), 64))])]),
+			m("section", B, [m("header", V, [c[7] ||= m("h4", { class: "text-xs font-semibold uppercase tracking-wide text-muted-foreground" }, " Entries ", -1), g(w(n), {
+				variant: "outline",
+				class: "font-mono text-[10px]"
+			}, {
+				default: E(() => [...c[6] ||= [h(" builder/object-builder ", -1)]]),
+				_: 1
+			})]), q.value.length === 0 ? (b(), p("p", pe, " Click an entry type in the palette to add one. ")) : (b(), p("ul", me, [(b(!0), p(l, null, S(q.value, (e, t) => (b(), p("li", {
+				key: e.id,
+				class: y(["flex cursor-pointer items-center gap-2 rounded border bg-background px-2 py-1.5 transition-colors", w(G).selection.value.id === e.id ? "border-primary bg-accent/30" : ""]),
+				"data-testid": `object-builder-row-${e.id}`,
+				onClick: (t) => Fe(e.id)
+			}, [
+				m("span", ge, C(t + 1) + ". ", 1),
+				m("span", _e, C(e.key || "(unnamed)"), 1),
+				g(w(n), {
+					variant: "secondary",
+					class: "font-mono text-[9px]"
+				}, {
+					default: E(() => [h(C(e.type), 1)]),
+					_: 2
+				}, 1024),
+				m("span", ve, C(Be(e)), 1)
+			], 10, he))), 128))]))]),
+			m("aside", ye, [m("header", be, [c[8] ||= m("h4", { class: "text-xs font-semibold uppercase tracking-wide text-muted-foreground" }, " Inspector ", -1), w(G).selection.value.id ? (b(), d(w(r), {
+				key: 0,
+				variant: "ghost",
+				size: "icon-sm",
+				"aria-label": "Clear selection",
+				onClick: ze
+			}, {
+				default: E(() => [g(w(j), { class: "h-3.5 w-3.5" })]),
+				_: 1
+			})) : f("", !0)]), J.value ? (b(), p("div", Se, [g(w(ne), { class: "border-dashed" }, {
+				default: E(() => [g(w(te), { class: "py-2" }, {
+					default: E(() => [g(w(ee), { class: "font-mono text-xs uppercase tracking-wide" }, {
+						default: E(() => [h(C(J.value.type), 1)]),
+						_: 1
+					})]),
+					_: 1
+				}), g(w(i), { class: "flex flex-col gap-2 pb-3" }, {
+					default: E(() => [
+						m("div", Ce, [g(w(o), { for: "ob-key" }, {
+							default: E(() => [...c[9] ||= [h("Key", -1)]]),
+							_: 1
+						}), g(w(a), {
+							id: "ob-key",
+							"model-value": Ve.value,
+							"data-testid": "object-builder-inspector-key",
+							onInput: c[0] ||= (e) => Z({ key: e.target.value })
+						}, null, 8, ["model-value"])]),
+						m("div", we, [g(w(o), { for: "ob-type" }, {
+							default: E(() => [...c[10] ||= [h("Type", -1)]]),
+							_: 1
+						}), g(w(oe), {
+							"model-value": J.value.type,
+							"onUpdate:modelValue": c[1] ||= (e) => Ke(e)
+						}, {
+							default: E(() => [g(w(re), {
+								id: "ob-type",
+								"data-testid": "object-builder-inspector-type"
+							}, {
+								default: E(() => [g(w(ae))]),
+								_: 1
+							}), g(w(s), null, {
+								default: E(() => [(b(), p(l, null, S(K, (e) => g(w(ie), {
+									key: e.type,
+									value: e.type
+								}, {
+									default: E(() => [h(C(e.displayLabel), 1)]),
+									_: 2
+								}, 1032, ["value"])), 64))]),
+								_: 1
+							})]),
+							_: 1
+						}, 8, ["model-value"])]),
+						J.value.type === "string" ? (b(), p("div", Te, [g(w(o), { for: "ob-value-string" }, {
+							default: E(() => [...c[11] ||= [h("Value", -1)]]),
+							_: 1
+						}), g(w(a), {
+							id: "ob-value-string",
+							"model-value": He.value,
+							"data-testid": "object-builder-inspector-value-string",
+							onInput: c[2] ||= (e) => Z({ value: e.target.value })
+						}, null, 8, ["model-value"])])) : J.value.type === "number" ? (b(), p("div", Ee, [g(w(o), { for: "ob-value-number" }, {
+							default: E(() => [...c[12] ||= [h("Value", -1)]]),
+							_: 1
+						}), g(w(a), {
+							id: "ob-value-number",
+							type: "number",
+							"model-value": Ue.value,
+							"data-testid": "object-builder-inspector-value-number",
+							onInput: c[3] ||= (e) => {
+								let t = e.target.value, n = t === "" ? 0 : Number(t);
+								Z({ value: Number.isNaN(n) ? 0 : n });
+							}
+						}, null, 8, ["model-value"])])) : J.value.type === "boolean" ? (b(), p("div", De, [g(w(o), { for: "ob-value-boolean" }, {
+							default: E(() => [...c[13] ||= [h("Value", -1)]]),
+							_: 1
+						}), g(w(se), {
+							id: "ob-value-boolean",
+							"model-value": We.value,
+							"data-testid": "object-builder-inspector-value-boolean",
+							"onUpdate:modelValue": c[4] ||= (e) => Z({ value: e })
+						}, null, 8, ["model-value"])])) : J.value.type === "array" || J.value.type === "object" ? (b(), p("div", Oe, [
+							g(w(o), { for: "ob-value-json" }, {
+								default: E(() => [...c[14] ||= [h("Value (JSON)", -1)]]),
+								_: 1
+							}),
+							g(w(ce), {
+								id: "ob-value-json",
+								"model-value": Q.value,
+								rows: "6",
+								"data-testid": "object-builder-inspector-value-json",
+								onInput: c[5] ||= (e) => Ge(e.target.value)
+							}, null, 8, ["model-value"]),
+							$.value ? (b(), p("p", ke, C($.value), 1)) : f("", !0)
+						])) : J.value.type === "null" ? (b(), p("div", Ae, [...c[15] ||= [
+							h(" Value is fixed to ", -1),
+							m("code", { class: "font-mono" }, "null", -1),
+							h(". ", -1)
+						]])) : f("", !0)
+					]),
+					_: 1
+				})]),
+				_: 1
+			}), m("div", je, [
+				g(w(r), {
+					variant: "outline",
+					size: "sm",
+					disabled: Y.value <= 0,
+					"data-testid": "object-builder-move-up",
+					onClick: Ie
+				}, {
+					default: E(() => [g(w(O), { class: "h-3.5 w-3.5" })]),
+					_: 1
+				}, 8, ["disabled"]),
+				g(w(r), {
+					variant: "outline",
+					size: "sm",
+					disabled: !X.value,
+					"data-testid": "object-builder-move-down",
+					onClick: Le
+				}, {
+					default: E(() => [g(w(D), { class: "h-3.5 w-3.5" })]),
+					_: 1
+				}, 8, ["disabled"]),
+				g(w(r), {
+					variant: "destructive",
+					size: "sm",
+					class: "ml-auto",
+					"data-testid": "object-builder-remove",
+					onClick: Re
+				}, {
+					default: E(() => [g(w(A), { class: "h-3.5 w-3.5" }), c[16] ||= h(" Remove ", -1)]),
+					_: 1
+				})
+			])])) : (b(), p("p", xe, " Select an entry to edit its key, type, and value. "))])
+		], 10, M));
+	}
+}), U = /* @__PURE__ */ e({ default: () => W }), W = H;
+//#endregion
+export { U as n, W as t };
+
+//# sourceMappingURL=ObjectBuilder-2gxFY61a.js.map