@gxp-dev/mod-ui 2.0.8 → 2.0.12

package/dist/components/compositions/elements/code/PullRequestsList.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,262 @@
+import { cn as e } from "../../../../lib/utils.js";
+import t from "../../../ui/avatar/Avatar.js";
+import n from "../../../ui/avatar/AvatarFallback.js";
+import r from "../../../ui/avatar/AvatarImage.js";
+import "../../../ui/avatar/index.js";
+import i from "../../../ui/badge/Badge.js";
+import "../../../ui/badge/index.js";
+import a from "../../../ui/card/Card.js";
+import o from "../../../ui/card/CardContent.js";
+import s from "../../../ui/card/CardHeader.js";
+import ee from "../../../ui/card/CardTitle.js";
+import "../../../ui/card/index.js";
+import te from "../../../ui/input/Input.js";
+import "../../../ui/input/index.js";
+import c from "../../../ui/skeleton/Skeleton.js";
+import "../../../ui/skeleton/index.js";
+import { Fragment as l, computed as ne, createBlock as u, createCommentVNode as d, createElementBlock as f, createElementVNode as p, createTextVNode as m, createVNode as h, defineComponent as g, normalizeClass as _, onMounted as re, openBlock as v, ref as y, renderList as b, resolveDynamicComponent as ie, toDisplayString as x, unref as S, watch as ae, withCtx as C } from "vue";
+import { ArrowRight as oe, GitMerge as se, GitPullRequest as w, GitPullRequestDraft as ce, Search as le, XCircle as ue } from "@lucide/vue";
+//#region src/components/compositions/elements/code/PullRequestsList.vue?vue&type=script&setup=true&lang.ts
+var de = { class: "flex flex-wrap items-center gap-2" }, fe = { class: "flex flex-wrap items-center gap-1" }, T = [
+	"data-testid",
+	"aria-pressed",
+	"onClick"
+], E = { class: "relative flex-1 min-w-48" }, D = {
+	key: 0,
+	class: "text-sm text-muted-foreground",
+	"data-testid": "pull-requests-list-help"
+}, O = {
+	key: 0,
+	class: "flex flex-col gap-2 px-2 py-2",
+	"data-testid": "pull-requests-list-loading"
+}, k = {
+	key: 1,
+	class: "px-2 py-2 text-sm text-destructive",
+	"data-testid": "pull-requests-list-error",
+	role: "alert"
+}, A = {
+	key: 2,
+	class: "px-2 py-4 text-center text-sm text-muted-foreground",
+	"data-testid": "pull-requests-list-empty"
+}, j = {
+	key: 3,
+	class: "flex flex-col",
+	role: "list",
+	"data-testid": "pull-requests-list-rows"
+}, M = [
+	"data-testid",
+	"aria-selected",
+	"onClick"
+], N = { class: "flex min-w-0 flex-1 flex-col gap-0.5" }, P = { class: "flex items-center gap-2" }, F = { class: "truncate text-sm font-medium" }, I = {
+	key: 0,
+	class: "text-xs text-muted-foreground"
+}, L = { class: "flex flex-wrap items-center gap-2 text-xs text-muted-foreground" }, R = {
+	key: 0,
+	class: "flex items-center gap-1.5"
+}, z = {
+	key: 1,
+	class: "flex items-center gap-1"
+}, B = {
+	key: 0,
+	class: "font-mono"
+}, V = {
+	key: 2,
+	class: "font-mono"
+}, pe = { key: 2 }, me = {
+	key: 4,
+	class: "px-2 pt-2 text-sm text-destructive",
+	"data-testid": "pull-requests-list-errors",
+	role: "alert"
+}, H = /* @__PURE__ */ g({
+	__name: "PullRequestsList",
+	props: {
+		onLoadPullRequests: {},
+		defaultFilter: {},
+		selectedId: {},
+		onSelect: {},
+		label: { default: "Pull Requests" },
+		name: {},
+		helpText: {},
+		errors: { default: () => [] },
+		classList: {}
+	},
+	emits: ["update:selectedId"],
+	setup(g, { expose: H, emit: he }) {
+		let U = g, ge = he, W = y(U.defaultFilter?.status ?? "all"), G = y(U.defaultFilter?.query ?? ""), K = y([]), q = y(!1), J = y(null), Y = 0, _e = [
+			{
+				value: "all",
+				label: "All"
+			},
+			{
+				value: "open",
+				label: "Open"
+			},
+			{
+				value: "draft",
+				label: "Draft"
+			},
+			{
+				value: "merged",
+				label: "Merged"
+			},
+			{
+				value: "closed",
+				label: "Closed"
+			}
+		];
+		function ve(e) {
+			switch (e) {
+				case "open": return "success";
+				case "merged": return "info";
+				case "closed": return "destructive";
+				default: return "secondary";
+			}
+		}
+		function ye(e) {
+			return e === "merged" ? se : e === "closed" ? ue : e === "draft" ? ce : w;
+		}
+		function be(e) {
+			if (!e) return "";
+			let t = e instanceof Date ? e : new Date(e), n = Date.now() - t.getTime();
+			if (Number.isNaN(n)) return "";
+			let r = Math.round(n / 1e3);
+			if (r < 60) return `${r}s ago`;
+			let i = Math.round(r / 60);
+			if (i < 60) return `${i}m ago`;
+			let a = Math.round(i / 60);
+			if (a < 24) return `${a}h ago`;
+			let o = Math.round(a / 24);
+			if (o < 30) return `${o}d ago`;
+			let s = Math.round(o / 30);
+			return s < 12 ? `${s}mo ago` : `${Math.round(s / 12)}y ago`;
+		}
+		function xe() {
+			let e = {};
+			return W.value !== "all" && (e.status = W.value), G.value && (e.query = G.value), e;
+		}
+		async function X() {
+			let e = ++Y;
+			q.value = !0, J.value = null;
+			try {
+				let t = await U.onLoadPullRequests(xe());
+				if (e !== Y) return;
+				K.value = Array.isArray(t) ? t : [];
+			} catch (t) {
+				if (e !== Y) return;
+				J.value = t instanceof Error ? t.message : String(t), K.value = [];
+			} finally {
+				e === Y && (q.value = !1);
+			}
+		}
+		let Z = null;
+		function Q() {
+			Z !== null && clearTimeout(Z), Z = setTimeout(() => {
+				Z = null, X();
+			}, 200);
+		}
+		function Se(e) {
+			W.value !== e && (W.value = e, X());
+		}
+		function Ce(e) {
+			G.value = e.target.value, Q();
+		}
+		function we(e) {
+			ge("update:selectedId", e.id), U.onSelect && U.onSelect(e);
+		}
+		function Te(e) {
+			return e ? e.split(/\s+/).filter(Boolean).slice(0, 2).map((e) => e[0]?.toUpperCase() ?? "").join("") : "?";
+		}
+		let $ = ne(() => U.selectedId);
+		return re(() => {
+			X();
+		}), ae(() => U.defaultFilter, (e) => {
+			e && (W.value = e.status ?? "all", G.value = e.query ?? "", X());
+		}, { deep: !0 }), H({ reload: X }), (ne, g) => (v(), u(S(a), {
+			class: _(S(e)(U.classList)),
+			"data-element-name": U.name ?? void 0,
+			"data-testid": "pull-requests-list"
+		}, {
+			default: C(() => [h(S(s), { class: "flex flex-col gap-3 pb-3" }, {
+				default: C(() => [
+					h(S(ee), { class: "flex items-center gap-2 text-base" }, {
+						default: C(() => [h(S(w), { class: "size-5 text-muted-foreground" }), p("span", null, x(U.label), 1)]),
+						_: 1
+					}),
+					p("div", de, [p("div", fe, [(v(), f(l, null, b(_e, (t) => p("button", {
+						key: t.value,
+						type: "button",
+						class: _(S(e)("rounded-full border px-3 py-1 text-xs font-medium transition-colors", W.value === t.value ? "border-primary bg-primary text-primary-foreground" : "border-input bg-background text-foreground hover:bg-accent hover:text-accent-foreground")),
+						"data-testid": `pull-requests-list-chip-${t.value}`,
+						"aria-pressed": W.value === t.value,
+						onClick: (e) => Se(t.value)
+					}, x(t.label), 11, T)), 64))]), p("div", E, [h(S(le), { class: "absolute left-2 top-1/2 -translate-y-1/2 size-4 text-muted-foreground" }), h(S(te), {
+						"model-value": G.value,
+						placeholder: "Search…",
+						class: "pl-8",
+						"data-testid": "pull-requests-list-search",
+						onInput: Ce
+					}, null, 8, ["model-value"])])]),
+					U.helpText ? (v(), f("p", D, x(U.helpText), 1)) : d("", !0)
+				]),
+				_: 1
+			}), h(S(o), { class: "flex flex-col gap-1 p-2" }, {
+				default: C(() => [q.value ? (v(), f("div", O, [
+					h(S(c), { class: "h-12 w-full" }),
+					h(S(c), { class: "h-12 w-full" }),
+					h(S(c), { class: "h-12 w-full" })
+				])) : J.value ? (v(), f("p", k, x(J.value), 1)) : K.value.length === 0 ? (v(), f("p", A, " No pull requests. ")) : (v(), f("ul", j, [(v(!0), f(l, null, b(K.value, (a) => (v(), f("li", {
+					key: a.id,
+					class: _(S(e)("flex cursor-pointer items-center gap-3 rounded-md border border-transparent px-2 py-2 hover:bg-accent", $.value === a.id ? "border-primary bg-accent" : "")),
+					"data-testid": `pull-requests-list-row-${a.id}`,
+					"aria-selected": $.value === a.id,
+					onClick: (e) => we(a)
+				}, [
+					(v(), u(ie(ye(a.status)), { class: "size-4 shrink-0 text-muted-foreground" })),
+					p("div", N, [p("div", P, [
+						p("span", F, x(a.title), 1),
+						a.number === void 0 ? d("", !0) : (v(), f("span", I, " #" + x(a.number), 1)),
+						h(S(i), {
+							variant: ve(a.status),
+							size: "sm",
+							class: "capitalize"
+						}, {
+							default: C(() => [m(x(a.status), 1)]),
+							_: 2
+						}, 1032, ["variant"])
+					]), p("div", L, [
+						a.authorName ? (v(), f("span", R, [h(S(t), {
+							size: "sm",
+							class: "size-5 text-[10px]"
+						}, {
+							default: C(() => [a.authorAvatarUrl ? (v(), u(S(r), {
+								key: 0,
+								src: a.authorAvatarUrl,
+								alt: a.authorName
+							}, null, 8, ["src", "alt"])) : d("", !0), h(S(n), null, {
+								default: C(() => [m(x(Te(a.authorName)), 1)]),
+								_: 2
+							}, 1024)]),
+							_: 2
+						}, 1024), p("span", null, x(a.authorName), 1)])) : d("", !0),
+						a.branchName || a.targetBranch ? (v(), f("span", z, [
+							a.branchName ? (v(), f("span", B, x(a.branchName), 1)) : d("", !0),
+							a.branchName && a.targetBranch ? (v(), u(S(oe), {
+								key: 1,
+								class: "size-3"
+							})) : d("", !0),
+							a.targetBranch ? (v(), f("span", V, x(a.targetBranch), 1)) : d("", !0)
+						])) : d("", !0),
+						a.updatedAt || a.createdAt ? (v(), f("span", pe, x(be(a.updatedAt ?? a.createdAt)), 1)) : d("", !0)
+					])]),
+					d("", !0)
+				], 10, M))), 128))])), U.errors.length ? (v(), f("ul", me, [(v(!0), f(l, null, b(U.errors, (e, t) => (v(), f("li", { key: t }, x(e), 1))), 128))])) : d("", !0)]),
+				_: 1
+			})]),
+			_: 1
+		}, 8, ["class", "data-element-name"]));
+	}
+});
+//#endregion
+export { H as default };
+
+//# sourceMappingURL=PullRequestsList.vue_vue_type_script_setup_true_lang.js.map

package/dist/components/compositions/elements/code/PullRequestsList.vue_vue_type_script_setup_true_lang.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PullRequestsList.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../../../src/components/compositions/elements/code/PullRequestsList.vue"],"sourcesContent":["<script setup lang=\"ts\">\n/**\n * Props-driven pull-request list composition. Renders a toolbar with\n * status-filter chips + a search input, then a list of PR rows. The\n * composition makes no HTTP calls — the consumer supplies a single\n * Promise-returning `onLoadPullRequests` callback that receives the\n * current filter object.\n *\n *   <PullRequestsList\n *     :on-load-pull-requests=\"(f) => fetch(`/api/prs?...`).then(r => r.json())\"\n *     v-model:selected-id=\"selectedPr\"\n *     @select=\"(pr) => router.push(pr.url)\"\n *   />\n */\nimport { computed, onMounted, ref, watch } from \"vue\"\nimport {\n  ArrowRight,\n  GitMerge,\n  GitPullRequest,\n  GitPullRequestDraft,\n  Loader2,\n  Search,\n  XCircle,\n} from \"@lucide/vue\"\nimport { Avatar, AvatarFallback, AvatarImage } from \"@/components/ui/avatar\"\nimport { Badge } from \"@/components/ui/badge\"\nimport { Card, CardContent, CardHeader, CardTitle } from \"@/components/ui/card\"\nimport { Input } from \"@/components/ui/input\"\nimport { Skeleton } from \"@/components/ui/skeleton\"\nimport { cn } from \"@/lib/utils\"\n\nexport type PullRequestStatus =\n  | \"open\"\n  | \"closed\"\n  | \"merged\"\n  | \"draft\"\n\nexport interface PullRequest {\n  id: string\n  number?: number\n  title: string\n  authorName?: string\n  authorAvatarUrl?: string\n  status: PullRequestStatus\n  createdAt?: string | Date\n  updatedAt?: string | Date\n  branchName?: string\n  targetBranch?: string\n  url?: string\n}\n\nexport interface PullRequestsListFilter {\n  status?: PullRequestStatus\n  query?: string\n}\n\nexport interface PullRequestsListProps {\n  /** REQUIRED loader, invoked on mount and whenever the filter changes. */\n  onLoadPullRequests: (\n    filter?: PullRequestsListFilter,\n  ) => Promise<PullRequest[]>\n  /** Initial filter applied on mount. */\n  defaultFilter?: PullRequestsListFilter\n  /** Currently selected PR id (v-modelable as `selectedId`). */\n  selectedId?: string\n  /** Fired when a PR row is clicked. */\n  onSelect?: (pr: PullRequest) => void\n  label?: string\n  name?: string | null\n  helpText?: string\n  errors?: string[]\n  classList?: string[] | string\n}\n\nconst props = withDefaults(defineProps<PullRequestsListProps>(), {\n  errors: () => [],\n  label: \"Pull Requests\",\n})\n\nconst emit = defineEmits<{\n  \"update:selectedId\": [value: string]\n}>()\n\nconst status = ref<PullRequestStatus | \"all\">(\n  props.defaultFilter?.status ?? \"all\",\n)\nconst query = ref<string>(props.defaultFilter?.query ?? \"\")\n\nconst items = ref<PullRequest[]>([])\nconst loading = ref<boolean>(false)\nconst error = ref<string | null>(null)\nlet token = 0\n\nconst STATUS_CHIPS: { value: PullRequestStatus | \"all\"; label: string }[] = [\n  { value: \"all\", label: \"All\" },\n  { value: \"open\", label: \"Open\" },\n  { value: \"draft\", label: \"Draft\" },\n  { value: \"merged\", label: \"Merged\" },\n  { value: \"closed\", label: \"Closed\" },\n]\n\nfunction statusVariant(s: PullRequestStatus): string {\n  switch (s) {\n    case \"open\":\n      return \"success\"\n    case \"merged\":\n      return \"info\"\n    case \"closed\":\n      return \"destructive\"\n    case \"draft\":\n    default:\n      return \"secondary\"\n  }\n}\n\nfunction statusIcon(s: PullRequestStatus) {\n  if (s === \"merged\") {\n    return GitMerge\n  }\n  if (s === \"closed\") {\n    return XCircle\n  }\n  if (s === \"draft\") {\n    return GitPullRequestDraft\n  }\n  return GitPullRequest\n}\n\nfunction relativeTime(value: string | Date | undefined): string {\n  if (!value) {\n    return \"\"\n  }\n  const d = value instanceof Date ? value : new Date(value)\n  const diff = Date.now() - d.getTime()\n  if (Number.isNaN(diff)) {\n    return \"\"\n  }\n  const sec = Math.round(diff / 1000)\n  if (sec < 60) {\n    return `${sec}s ago`\n  }\n  const min = Math.round(sec / 60)\n  if (min < 60) {\n    return `${min}m ago`\n  }\n  const hr = Math.round(min / 60)\n  if (hr < 24) {\n    return `${hr}h ago`\n  }\n  const day = Math.round(hr / 24)\n  if (day < 30) {\n    return `${day}d ago`\n  }\n  const month = Math.round(day / 30)\n  if (month < 12) {\n    return `${month}mo ago`\n  }\n  const year = Math.round(month / 12)\n  return `${year}y ago`\n}\n\nfunction currentFilter(): PullRequestsListFilter {\n  const f: PullRequestsListFilter = {}\n  if (status.value !== \"all\") {\n    f.status = status.value\n  }\n  if (query.value) {\n    f.query = query.value\n  }\n  return f\n}\n\nasync function reload(): Promise<void> {\n  const myToken = ++token\n  loading.value = true\n  error.value = null\n  try {\n    const next = await props.onLoadPullRequests(currentFilter())\n    if (myToken !== token) {\n      return\n    }\n    items.value = Array.isArray(next) ? next : []\n  } catch (err) {\n    if (myToken !== token) {\n      return\n    }\n    error.value = err instanceof Error ? err.message : String(err)\n    items.value = []\n  } finally {\n    if (myToken === token) {\n      loading.value = false\n    }\n  }\n}\n\nlet debounceTimer: ReturnType<typeof setTimeout> | null = null\nfunction scheduleReload(): void {\n  if (debounceTimer !== null) {\n    clearTimeout(debounceTimer)\n  }\n  debounceTimer = setTimeout(() => {\n    debounceTimer = null\n    void reload()\n  }, 200)\n}\n\nfunction setStatus(next: PullRequestStatus | \"all\"): void {\n  if (status.value === next) {\n    return\n  }\n  status.value = next\n  void reload()\n}\n\nfunction onQueryInput(e: Event): void {\n  const next = (e.target as HTMLInputElement).value\n  query.value = next\n  scheduleReload()\n}\n\nfunction selectRow(pr: PullRequest): void {\n  emit(\"update:selectedId\", pr.id)\n  if (props.onSelect) {\n    props.onSelect(pr)\n  }\n}\n\nfunction authorFallback(name?: string): string {\n  if (!name) {\n    return \"?\"\n  }\n  return name\n    .split(/\\s+/)\n    .filter(Boolean)\n    .slice(0, 2)\n    .map((s) => s[0]?.toUpperCase() ?? \"\")\n    .join(\"\")\n}\n\nconst selectedIdRef = computed<string | undefined>(() => props.selectedId)\n\nonMounted(() => {\n  void reload()\n})\n\nwatch(\n  () => props.defaultFilter,\n  (next) => {\n    if (!next) {\n      return\n    }\n    status.value = next.status ?? \"all\"\n    query.value = next.query ?? \"\"\n    void reload()\n  },\n  { deep: true },\n)\n\ndefineExpose({ reload })\n</script>\n\n<template>\n  <Card\n    :class=\"cn(props.classList)\"\n    :data-element-name=\"props.name ?? undefined\"\n    data-testid=\"pull-requests-list\"\n  >\n    <CardHeader class=\"flex flex-col gap-3 pb-3\">\n      <CardTitle class=\"flex items-center gap-2 text-base\">\n        <GitPullRequest class=\"size-5 text-muted-foreground\" />\n        <span>{{ props.label }}</span>\n      </CardTitle>\n      <div class=\"flex flex-wrap items-center gap-2\">\n        <div class=\"flex flex-wrap items-center gap-1\">\n          <button\n            v-for=\"chip in STATUS_CHIPS\"\n            :key=\"chip.value\"\n            type=\"button\"\n            :class=\"\n              cn(\n                'rounded-full border px-3 py-1 text-xs font-medium transition-colors',\n                status === chip.value\n                  ? 'border-primary bg-primary text-primary-foreground'\n                  : 'border-input bg-background text-foreground hover:bg-accent hover:text-accent-foreground',\n              )\n            \"\n            :data-testid=\"`pull-requests-list-chip-${chip.value}`\"\n            :aria-pressed=\"status === chip.value\"\n            @click=\"setStatus(chip.value)\"\n          >\n            {{ chip.label }}\n          </button>\n        </div>\n        <div class=\"relative flex-1 min-w-48\">\n          <Search\n            class=\"absolute left-2 top-1/2 -translate-y-1/2 size-4 text-muted-foreground\"\n          />\n          <Input\n            :model-value=\"query\"\n            placeholder=\"Search…\"\n            class=\"pl-8\"\n            data-testid=\"pull-requests-list-search\"\n            @input=\"onQueryInput\"\n          />\n        </div>\n      </div>\n      <p\n        v-if=\"props.helpText\"\n        class=\"text-sm text-muted-foreground\"\n        data-testid=\"pull-requests-list-help\"\n      >\n        {{ props.helpText }}\n      </p>\n    </CardHeader>\n    <CardContent class=\"flex flex-col gap-1 p-2\">\n      <div\n        v-if=\"loading\"\n        class=\"flex flex-col gap-2 px-2 py-2\"\n        data-testid=\"pull-requests-list-loading\"\n      >\n        <Skeleton class=\"h-12 w-full\" />\n        <Skeleton class=\"h-12 w-full\" />\n        <Skeleton class=\"h-12 w-full\" />\n      </div>\n      <p\n        v-else-if=\"error\"\n        class=\"px-2 py-2 text-sm text-destructive\"\n        data-testid=\"pull-requests-list-error\"\n        role=\"alert\"\n      >\n        {{ error }}\n      </p>\n      <p\n        v-else-if=\"items.length === 0\"\n        class=\"px-2 py-4 text-center text-sm text-muted-foreground\"\n        data-testid=\"pull-requests-list-empty\"\n      >\n        No pull requests.\n      </p>\n      <ul\n        v-else\n        class=\"flex flex-col\"\n        role=\"list\"\n        data-testid=\"pull-requests-list-rows\"\n      >\n        <li\n          v-for=\"pr in items\"\n          :key=\"pr.id\"\n          :class=\"\n            cn(\n              'flex cursor-pointer items-center gap-3 rounded-md border border-transparent px-2 py-2 hover:bg-accent',\n              selectedIdRef === pr.id\n                ? 'border-primary bg-accent'\n                : '',\n            )\n          \"\n          :data-testid=\"`pull-requests-list-row-${pr.id}`\"\n          :aria-selected=\"selectedIdRef === pr.id\"\n          @click=\"selectRow(pr)\"\n        >\n          <component\n            :is=\"statusIcon(pr.status)\"\n            class=\"size-4 shrink-0 text-muted-foreground\"\n          />\n          <div class=\"flex min-w-0 flex-1 flex-col gap-0.5\">\n            <div class=\"flex items-center gap-2\">\n              <span class=\"truncate text-sm font-medium\">{{ pr.title }}</span>\n              <span\n                v-if=\"pr.number !== undefined\"\n                class=\"text-xs text-muted-foreground\"\n              >\n                #{{ pr.number }}\n              </span>\n              <Badge\n                :variant=\"(statusVariant(pr.status) as 'success' | 'info' | 'destructive' | 'secondary')\"\n                size=\"sm\"\n                class=\"capitalize\"\n              >\n                {{ pr.status }}\n              </Badge>\n            </div>\n            <div\n              class=\"flex flex-wrap items-center gap-2 text-xs text-muted-foreground\"\n            >\n              <span\n                v-if=\"pr.authorName\"\n                class=\"flex items-center gap-1.5\"\n              >\n                <Avatar size=\"sm\" class=\"size-5 text-[10px]\">\n                  <AvatarImage\n                    v-if=\"pr.authorAvatarUrl\"\n                    :src=\"pr.authorAvatarUrl\"\n                    :alt=\"pr.authorName\"\n                  />\n                  <AvatarFallback>{{ authorFallback(pr.authorName) }}</AvatarFallback>\n                </Avatar>\n                <span>{{ pr.authorName }}</span>\n              </span>\n              <span\n                v-if=\"pr.branchName || pr.targetBranch\"\n                class=\"flex items-center gap-1\"\n              >\n                <span v-if=\"pr.branchName\" class=\"font-mono\">{{ pr.branchName }}</span>\n                <ArrowRight v-if=\"pr.branchName && pr.targetBranch\" class=\"size-3\" />\n                <span v-if=\"pr.targetBranch\" class=\"font-mono\">{{ pr.targetBranch }}</span>\n              </span>\n              <span v-if=\"pr.updatedAt || pr.createdAt\">\n                {{ relativeTime(pr.updatedAt ?? pr.createdAt) }}\n              </span>\n            </div>\n          </div>\n          <Loader2\n            v-if=\"false\"\n            class=\"size-3 animate-spin text-muted-foreground\"\n          />\n        </li>\n      </ul>\n      <ul\n        v-if=\"props.errors.length\"\n        class=\"px-2 pt-2 text-sm text-destructive\"\n        data-testid=\"pull-requests-list-errors\"\n        role=\"alert\"\n      >\n        <li v-for=\"(err, i) in props.errors\" :key=\"i\">{{ err }}</li>\n      </ul>\n    </CardContent>\n  </Card>\n</template>\n"],"mappings":"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"}

package/dist/components/compositions/elements/configuration-block/DialogBlock.js

@@ -0,0 +1,7 @@
+import e from "./DialogBlock.vue_vue_type_script_setup_true_lang.js";
+//#region src/components/compositions/elements/configuration-block/DialogBlock.vue
+var t = e;
+//#endregion
+export { t as default };
+
+//# sourceMappingURL=DialogBlock.js.map

package/dist/components/compositions/elements/configuration-block/DialogBlock.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DialogBlock.js","names":[],"sources":["../../../../../src/components/compositions/elements/configuration-block/DialogBlock.vue"],"sourcesContent":["<script setup lang=\"ts\">\n/**\n * Props-driven renderer for `configuration-block/dialog`.\n *\n * Wraps the inner children (`nestedElements`) in a Dialog opened by a\n * trigger Button. Full FormBuilder integration arrives in task #7.\n */\nimport { computed } from \"vue\"\nimport { Construction } from \"@lucide/vue\"\nimport type { CardElement } from \"@/definitions/elements\"\nimport {\n  Dialog,\n  DialogContent,\n  DialogHeader,\n  DialogTitle,\n  DialogTrigger,\n} from \"@/components/ui/dialog\"\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 DialogBlockProps {\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<DialogBlockProps>(), {\n  label: \"Dialog\",\n  nestedElements: () => [],\n  item: () => ({}),\n})\n\nconst styleKey = \"dialog\"\n\nconst resolvedTrigger = computed(\n  () => props.triggerLabel ?? props.label ?? \"Open dialog\",\n)\nconst resolvedTitle = computed(\n  () => props.title ?? props.label ?? \"Dialog\",\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  <Dialog>\n    <DialogTrigger 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    </DialogTrigger>\n    <DialogContent>\n      <DialogHeader>\n        <DialogTitle>{{ resolvedTitle }}</DialogTitle>\n      </DialogHeader>\n      <div v-if=\"children.length\" class=\"flex flex-col gap-3\">\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=\"text-sm text-muted-foreground\">\n        Dialog block — FormBuilder integration coming in task #7.\n      </p>\n    </DialogContent>\n  </Dialog>\n</template>\n"],"mappings":""}

package/dist/components/compositions/elements/configuration-block/DialogBlock.vue_vue_type_script_setup_true_lang.js

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

package/dist/components/compositions/elements/configuration-block/DialogBlock.vue_vue_type_script_setup_true_lang.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DialogBlock.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../../../src/components/compositions/elements/configuration-block/DialogBlock.vue"],"sourcesContent":["<script setup lang=\"ts\">\n/**\n * Props-driven renderer for `configuration-block/dialog`.\n *\n * Wraps the inner children (`nestedElements`) in a Dialog opened by a\n * trigger Button. Full FormBuilder integration arrives in task #7.\n */\nimport { computed } from \"vue\"\nimport { Construction } from \"@lucide/vue\"\nimport type { CardElement } from \"@/definitions/elements\"\nimport {\n  Dialog,\n  DialogContent,\n  DialogHeader,\n  DialogTitle,\n  DialogTrigger,\n} from \"@/components/ui/dialog\"\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 DialogBlockProps {\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<DialogBlockProps>(), {\n  label: \"Dialog\",\n  nestedElements: () => [],\n  item: () => ({}),\n})\n\nconst styleKey = \"dialog\"\n\nconst resolvedTrigger = computed(\n  () => props.triggerLabel ?? props.label ?? \"Open dialog\",\n)\nconst resolvedTitle = computed(\n  () => props.title ?? props.label ?? \"Dialog\",\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  <Dialog>\n    <DialogTrigger 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    </DialogTrigger>\n    <DialogContent>\n      <DialogHeader>\n        <DialogTitle>{{ resolvedTitle }}</DialogTitle>\n      </DialogHeader>\n      <div v-if=\"children.length\" class=\"flex flex-col gap-3\">\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=\"text-sm text-muted-foreground\">\n        Dialog block — FormBuilder integration coming in task #7.\n      </p>\n    </DialogContent>\n  </Dialog>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;GAsCM,IAAW;;;;;;;;;;;;EANjB,IAAM,IAAQ,GAQR,IAAkB,QAChB,EAAM,gBAAgB,EAAM,SAAS,aAC7C,GACM,IAAgB,QACd,EAAM,SAAS,EAAM,SAAS,QACtC,GAEM,IAAW,SACd,EAAM,kBAAkB,CAAC,GAAG,QAC1B,MACC,OAAO,KAAU,cACjB,KACA,OAAQ,EAA6B,QAAS,QAClD,CACF;yBAIE,EA+BS,EAAA,CAAA,GAAA,MAAA;oBAjBS,CAbhB,EAagB,EAAA,CAAA,GAAA,EAbD,YAAA,GAAQ,GAAA;qBAYZ,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,EAegB,EAAA,CAAA,GAAA,MAAA;qBAZC,CAFf,EAEe,EAAA,CAAA,GAAA,MAAA;sBADiC,CAA9C,EAA8C,EAAA,CAAA,GAAA,MAAA;uBAAd,CAAA,EAAA,EAAhB,EAAA,KAAa,GAAA,CAAA,CAAA,CAAA;;;;QAEpB,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,GAAgD,6DAEhD,EAAA,CAAA"}

package/dist/components/compositions/elements/configuration-block/ElementsBlock.js

@@ -0,0 +1,7 @@
+import e from "./ElementsBlock.vue_vue_type_script_setup_true_lang.js";
+//#region src/components/compositions/elements/configuration-block/ElementsBlock.vue
+var t = e;
+//#endregion
+export { t as default };
+
+//# sourceMappingURL=ElementsBlock.js.map

package/dist/components/compositions/elements/configuration-block/ElementsBlock.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ElementsBlock.js","names":[],"sources":["../../../../../src/components/compositions/elements/configuration-block/ElementsBlock.vue"],"sourcesContent":["<script setup lang=\"ts\">\n/**\n * Backward-compatibility shim for `configuration-block.elements-block`.\n *\n * New schemas should use `card.list` directly. This component delegates\n * entirely to ListCard so existing JSON continues to render correctly\n * without any migration required.\n */\nimport ListCard from \"@/components/compositions/elements/card/ListCard.vue\"\n\nexport interface ElementsBlockProps {\n  label?: string\n  name?: string | null\n  nestedElements?: Array<Record<string, unknown>>\n  item?: Record<string, unknown>\n  classList?: string[] | string\n  showCard?: boolean\n  title?: string\n  subtitle?: string\n  gutterY?: string\n  gutterX?: string\n}\n\nconst props = withDefaults(defineProps<ElementsBlockProps>(), {\n  label: \"Elements Block\",\n  showCard: true,\n  nestedElements: () => [],\n  item: () => ({}),\n})\n</script>\n\n<template>\n  <ListCard\n    :label=\"props.label\"\n    :title=\"props.title\"\n    :subtitle=\"props.subtitle\"\n    :show-card=\"props.showCard\"\n    :gutter-y=\"props.gutterY\"\n    :gutter-x=\"props.gutterX\"\n    :nested-elements=\"props.nestedElements\"\n    :item=\"props.item\"\n    :class-list=\"props.classList\"\n    :data-element-name=\"props.name ?? undefined\"\n  />\n</template>\n"],"mappings":""}

package/dist/components/compositions/elements/configuration-block/ElementsBlock.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,51 @@
+import e from "../card/ListCard.js";
+import { createBlock as t, defineComponent as n, openBlock as r } from "vue";
+//#region src/components/compositions/elements/configuration-block/ElementsBlock.vue?vue&type=script&setup=true&lang.ts
+var i = /* @__PURE__ */ n({
+	__name: "ElementsBlock",
+	props: {
+		label: { default: "Elements Block" },
+		name: {},
+		nestedElements: { default: () => [] },
+		item: { default: () => ({}) },
+		classList: {},
+		showCard: {
+			type: Boolean,
+			default: !0
+		},
+		title: {},
+		subtitle: {},
+		gutterY: {},
+		gutterX: {}
+	},
+	setup(n) {
+		let i = n;
+		return (n, a) => (r(), t(e, {
+			label: i.label,
+			title: i.title,
+			subtitle: i.subtitle,
+			"show-card": i.showCard,
+			"gutter-y": i.gutterY,
+			"gutter-x": i.gutterX,
+			"nested-elements": i.nestedElements,
+			item: i.item,
+			"class-list": i.classList,
+			"data-element-name": i.name ?? void 0
+		}, null, 8, [
+			"label",
+			"title",
+			"subtitle",
+			"show-card",
+			"gutter-y",
+			"gutter-x",
+			"nested-elements",
+			"item",
+			"class-list",
+			"data-element-name"
+		]));
+	}
+});
+//#endregion
+export { i as default };
+
+//# sourceMappingURL=ElementsBlock.vue_vue_type_script_setup_true_lang.js.map

package/dist/components/compositions/elements/configuration-block/ElementsBlock.vue_vue_type_script_setup_true_lang.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ElementsBlock.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../../../src/components/compositions/elements/configuration-block/ElementsBlock.vue"],"sourcesContent":["<script setup lang=\"ts\">\n/**\n * Backward-compatibility shim for `configuration-block.elements-block`.\n *\n * New schemas should use `card.list` directly. This component delegates\n * entirely to ListCard so existing JSON continues to render correctly\n * without any migration required.\n */\nimport ListCard from \"@/components/compositions/elements/card/ListCard.vue\"\n\nexport interface ElementsBlockProps {\n  label?: string\n  name?: string | null\n  nestedElements?: Array<Record<string, unknown>>\n  item?: Record<string, unknown>\n  classList?: string[] | string\n  showCard?: boolean\n  title?: string\n  subtitle?: string\n  gutterY?: string\n  gutterX?: string\n}\n\nconst props = withDefaults(defineProps<ElementsBlockProps>(), {\n  label: \"Elements Block\",\n  showCard: true,\n  nestedElements: () => [],\n  item: () => ({}),\n})\n</script>\n\n<template>\n  <ListCard\n    :label=\"props.label\"\n    :title=\"props.title\"\n    :subtitle=\"props.subtitle\"\n    :show-card=\"props.showCard\"\n    :gutter-y=\"props.gutterY\"\n    :gutter-x=\"props.gutterX\"\n    :nested-elements=\"props.nestedElements\"\n    :item=\"props.item\"\n    :class-list=\"props.classList\"\n    :data-element-name=\"props.name ?? undefined\"\n  />\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;EAuBA,IAAM,IAAQ;yBASZ,EAWE,GAAA;GAVC,OAAO,EAAM;GACb,OAAO,EAAM;GACb,UAAU,EAAM;GAChB,aAAW,EAAM;GACjB,YAAU,EAAM;GAChB,YAAU,EAAM;GAChB,mBAAiB,EAAM;GACvB,MAAM,EAAM;GACZ,cAAY,EAAM;GAClB,qBAAmB,EAAM,QAAQ,KAAA"}

package/dist/components/compositions/elements/configuration-block/ModalBlock.js

@@ -0,0 +1,7 @@
+import e from "./ModalBlock.vue_vue_type_script_setup_true_lang.js";
+//#region src/components/compositions/elements/configuration-block/ModalBlock.vue
+var t = e;
+//#endregion
+export { t as default };
+
+//# sourceMappingURL=ModalBlock.js.map

package/dist/components/compositions/elements/configuration-block/ModalBlock.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ModalBlock.js","names":[],"sources":["../../../../../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"],"mappings":""}

package/dist/components/compositions/elements/configuration-block/ModalBlock.vue_vue_type_script_setup_true_lang.js

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

package/dist/components/compositions/elements/configuration-block/ModalBlock.vue_vue_type_script_setup_true_lang.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ModalBlock.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../../../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"],"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/components/compositions/elements/configuration-block/RepeatableBlock.js

@@ -0,0 +1,7 @@
+import e from "./RepeatableBlock.vue_vue_type_script_setup_true_lang.js";
+//#region src/components/compositions/elements/configuration-block/RepeatableBlock.vue
+var t = e;
+//#endregion
+export { t as default };
+
+//# sourceMappingURL=RepeatableBlock.js.map

package/dist/components/compositions/elements/configuration-block/RepeatableBlock.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RepeatableBlock.js","names":[],"sources":["../../../../../src/components/compositions/elements/configuration-block/RepeatableBlock.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, inject, nextTick, ref, watch } from \"vue\"\nimport { ChevronDown, ChevronRight, Plus, Trash2 } from \"@lucide/vue\"\nimport type { CardElement } from \"@/definitions/elements\"\nimport { Button } from \"@/components/ui/button\"\nimport { useFormDataStore } from \"@/stores/formDataStore\"\nimport { FORM_ID_KEY } from \"@/engine/useFormData\"\nimport { cn } from \"@/lib/utils\"\nimport RepeatableRow from \"./RepeatableRow.vue\"\n\nexport interface RepeatableBlockProps {\n  label?: string\n  name?: string | null\n  modelValue?: unknown[]\n  /** Child element schema for each row. Engine remaps selectOptions → nestedElements. */\n  nestedElements?: Array<Record<string, unknown>>\n  addButtonLabel?: string\n  /** Field names whose values in a row are joined to form the row's header label. */\n  optionLabelFields?: ReadonlyArray<string>\n  /** Collapse all rows on initial render. */\n  collapsedByDefault?: boolean\n  item?: Record<string, unknown>\n  classList?: string[] | string\n}\n\nconst props = withDefaults(defineProps<RepeatableBlockProps>(), {\n  label: \"Repeatable\",\n  addButtonLabel: \"Add row\",\n  modelValue: () => [],\n  nestedElements: () => [],\n  optionLabelFields: () => [],\n  collapsedByDefault: false,\n  item: () => ({}),\n})\n\nconst emit = defineEmits<{\n  (e: \"update:modelValue\", value: unknown[]): void\n}>()\n\nconst parentFormId = inject(FORM_ID_KEY, \"default\")\nconst store = useFormDataStore()\n\nconst rowSchema = computed<CardElement[]>(() =>\n  (props.nestedElements ?? []).filter(\n    (entry): boolean =>\n      typeof entry === \"object\" &&\n      entry !== null &&\n      typeof (entry as { type?: unknown }).type === \"string\",\n  ) as unknown as CardElement[],\n)\n\ninterface RowEntry {\n  id: number\n  formId: string\n  collapsed: boolean\n}\n\nlet nextRowId = 0\n\nfunction makeRowFormId(rowId: number): string {\n  return `${parentFormId}__${props.name ?? \"repeatable\"}__${rowId}`\n}\n\nfunction makeRow(initialData?: Record<string, unknown>): RowEntry {\n  const id = nextRowId++\n  const formId = makeRowFormId(id)\n  store.ensureForm(formId)\n  if (initialData && Object.keys(initialData).length > 0) {\n    store.setInitialValues(formId, initialData)\n  }\n  return { id, formId, collapsed: props.collapsedByDefault }\n}\n\nfunction buildRows(data: unknown[]): RowEntry[] {\n  return data.map((d) => makeRow(typeof d === \"object\" && d !== null ? (d as Record<string, unknown>) : {}))\n}\n\nconst rows = ref<RowEntry[]>(\n  Array.isArray(props.modelValue) && props.modelValue.length > 0\n    ? buildRows(props.modelValue)\n    : [],\n)\n\nfunction collectRowData(): unknown[] {\n  return rows.value.map((row) => ({ ...(store.forms[row.formId]?.values ?? {}) }))\n}\n\nfunction rowLabel(row: RowEntry, index: number): string {\n  const labelFields = props.optionLabelFields ?? []\n  if (labelFields.length > 0) {\n    const values = store.forms[row.formId]?.values ?? {}\n    const parts = labelFields\n      .map((f) => values[f])\n      .filter((v) => typeof v === \"string\" && v.trim() !== \"\")\n      .join(\" \")\n    if (parts) {\n      return parts\n    }\n  }\n  return `${props.label} ${index + 1}`\n}\n\nlet suppressSync = false\n\nwatch(\n  () => rows.value.map((r) => ({ ...store.forms[r.formId]?.values })),\n  () => {\n    if (suppressSync) {\n      return\n    }\n    suppressSync = true\n    emit(\"update:modelValue\", collectRowData())\n    void nextTick(() => {\n      suppressSync = false\n    })\n  },\n  { deep: true },\n)\n\nwatch(\n  () => props.modelValue,\n  (next) => {\n    if (suppressSync || !Array.isArray(next)) {\n      return\n    }\n    if (next.length === rows.value.length) {\n      return\n    }\n    suppressSync = true\n    if (next.length > rows.value.length) {\n      while (rows.value.length < next.length) {\n        const d = next[rows.value.length]\n        rows.value.push(makeRow(typeof d === \"object\" && d !== null ? (d as Record<string, unknown>) : {}))\n      }\n    } else {\n      const removed = rows.value.splice(next.length)\n      removed.forEach((r) => store.resetForm(r.formId))\n    }\n    void nextTick(() => {\n      suppressSync = false\n    })\n  },\n)\n\nfunction addRow(): void {\n  rows.value.push(makeRow())\n}\n\nfunction removeRow(rowId: number): void {\n  const idx = rows.value.findIndex((r) => r.id === rowId)\n  if (idx < 0) {\n    return\n  }\n  const [removed] = rows.value.splice(idx, 1)\n  store.resetForm(removed.formId)\n}\n\nfunction toggleRow(rowId: number): void {\n  const row = rows.value.find((r) => r.id === rowId)\n  if (row) {\n    row.collapsed = !row.collapsed\n  }\n}\n</script>\n\n<template>\n  <div\n    :class=\"cn('flex flex-col gap-1', props.classList)\"\n    :data-element-name=\"props.name ?? undefined\"\n  >\n    <div v-if=\"rows.length\" class=\"flex flex-col gap-2\">\n      <div\n        v-for=\"(row, index) in rows\"\n        :key=\"row.id\"\n        class=\"rounded-md border bg-card\"\n        data-testid=\"repeatable-row\"\n      >\n        <!-- Row header -->\n        <div\n          class=\"flex cursor-pointer items-center justify-between gap-2 px-3 py-2\"\n          @click=\"toggleRow(row.id)\"\n        >\n          <div class=\"flex items-center gap-1.5 text-sm font-medium\">\n            <ChevronDown v-if=\"!row.collapsed\" class=\"size-3.5 shrink-0 text-muted-foreground\" />\n            <ChevronRight v-else class=\"size-3.5 shrink-0 text-muted-foreground\" />\n            <span>{{ rowLabel(row, index) }}</span>\n          </div>\n          <Button\n            variant=\"ghost\"\n            size=\"icon-sm\"\n            type=\"button\"\n            aria-label=\"Remove row\"\n            class=\"shrink-0 text-muted-foreground hover:text-destructive\"\n            @click.stop=\"removeRow(row.id)\"\n          >\n            <Trash2 class=\"size-3.5\" />\n          </Button>\n        </div>\n\n        <!-- Row content -->\n        <div v-if=\"!row.collapsed && rowSchema.length\" class=\"border-t px-3 py-3\">\n          <RepeatableRow\n            :form-id=\"row.formId\"\n            :schema=\"rowSchema\"\n            :item=\"props.item\"\n          />\n        </div>\n      </div>\n    </div>\n\n    <Button\n      type=\"button\"\n      variant=\"outline\"\n      size=\"sm\"\n      class=\"self-start\"\n      data-testid=\"repeatable-add\"\n      @click=\"addRow\"\n    >\n      <Plus class=\"size-3.5\" />\n      {{ props.addButtonLabel }}\n    </Button>\n  </div>\n</template>\n"],"mappings":""}