@gxp-dev/mod-ui 2.0.12 → 2.0.14

package/dist/components/compositions/elements/card/TabCard.vue_vue_type_script_setup_true_lang.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"TabCard.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../../../src/components/compositions/elements/card/TabCard.vue"],"sourcesContent":["<script setup lang=\"ts\">\n/**\n * `card.tab` element composition.\n *\n * Renders a tabbed container. Each tab in `tabs` owns an optional\n * `nestedElements` array of resolved child elements. In the FormBuilder\n * each tab's `elementList` IDs are resolved before being forwarded here.\n */\nimport { computed, ref } from \"vue\"\nimport type { CardElement } from \"@/definitions/elements\"\nimport {\n  Card,\n  CardContent,\n  CardHeader,\n} from \"@/components/ui/card\"\nimport { Tabs, TabsContent, TabsList, TabsTrigger } from \"@/components/ui/tabs\"\nimport ElementRenderer from \"@/engine/ElementRenderer.vue\"\nimport { cn } from \"@/lib/utils\"\n\ninterface TabEntry {\n  id: string\n  label: string\n  nestedElements?: Array<Record<string, unknown>>\n}\n\nexport interface TabCardProps {\n  label?: string\n  title?: string\n  showCard?: boolean\n  gutterY?: string\n  gutterX?: string\n  /** Tab definitions including resolved child elements. */\n  tabs?: TabEntry[]\n  activeTab?: number\n  item?: Record<string, unknown>\n  classList?: string[] | string\n}\n\nconst props = withDefaults(defineProps<TabCardProps>(), {\n  showCard: true,\n  gutterY: \"1rem\",\n  gutterX: \"0\",\n  tabs: () => [],\n  activeTab: 0,\n  item: () => ({}),\n})\n\nconst resolvedTabs = computed(() =>\n  (props.tabs ?? []).map((tab) => ({\n    ...tab,\n    children: (tab.nestedElements ?? []).filter(\n      (e): boolean =>\n        typeof e === \"object\" &&\n        e !== null &&\n        typeof (e as Record<string, unknown>).type === \"string\",\n    ) as unknown as CardElement[],\n  })),\n)\n\nconst activeTabId = computed(\n  () => resolvedTabs.value[props.activeTab ?? 0]?.id ?? resolvedTabs.value[0]?.id ?? \"\",\n)\nconst currentTab = ref(activeTabId.value)\n\nconst bodyStyle = computed(() => ({\n  rowGap: props.gutterY,\n  columnGap: props.gutterX,\n}))\n\nconst heading = computed(() => props.title ?? props.label)\n</script>\n\n<template>\n  <Card v-if=\"props.showCard !== false\" :class=\"cn(props.classList)\">\n    <CardHeader v-if=\"heading\">\n      <span class=\"text-base font-semibold\">{{ heading }}</span>\n    </CardHeader>\n    <CardContent>\n      <Tabs v-model=\"currentTab\">\n        <TabsList v-if=\"resolvedTabs.length\">\n          <TabsTrigger\n            v-for=\"tab in resolvedTabs\"\n            :key=\"tab.id\"\n            :value=\"tab.id\"\n          >\n            {{ tab.label }}\n          </TabsTrigger>\n        </TabsList>\n        <TabsContent\n          v-for=\"tab in resolvedTabs\"\n          :key=\"tab.id\"\n          :value=\"tab.id\"\n          class=\"flex flex-col pt-3\"\n          :style=\"bodyStyle\"\n        >\n          <ElementRenderer\n            v-for=\"child in tab.children\"\n            :key=\"child.id\"\n            :element=\"child\"\n            :item=\"props.item\"\n          />\n          <p v-if=\"!tab.children.length\" class=\"py-3 text-sm text-muted-foreground\">\n            No elements configured for this tab.\n          </p>\n        </TabsContent>\n      </Tabs>\n      <p v-if=\"!resolvedTabs.length\" class=\"py-3 text-sm text-muted-foreground\">\n        No tabs configured.\n      </p>\n    </CardContent>\n  </Card>\n\n  <div v-else :class=\"cn(props.classList)\">\n    <Tabs v-model=\"currentTab\">\n      <TabsList v-if=\"resolvedTabs.length\">\n        <TabsTrigger\n          v-for=\"tab in resolvedTabs\"\n          :key=\"tab.id\"\n          :value=\"tab.id\"\n        >\n          {{ tab.label }}\n        </TabsTrigger>\n      </TabsList>\n      <TabsContent\n        v-for=\"tab in resolvedTabs\"\n        :key=\"tab.id\"\n        :value=\"tab.id\"\n        class=\"flex flex-col pt-3\"\n        :style=\"bodyStyle\"\n      >\n        <ElementRenderer\n          v-for=\"child in tab.children\"\n          :key=\"child.id\"\n          :element=\"child\"\n          :item=\"props.item\"\n        />\n      </TabsContent>\n    </Tabs>\n  </div>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAsCA,IAAM,IAAQ,GASR,IAAe,SAClB,EAAM,QAAQ,CAAC,GAAG,KAAK,OAAS;GAC/B,GAAG;GACH,WAAW,EAAI,kBAAkB,CAAC,GAAG,QAClC,MACC,OAAO,KAAM,cACb,KACA,OAAQ,EAA8B,QAAS,QACnD;EACF,EAAE,CACJ,GAKM,IAAa,EAHC,QACZ,EAAa,MAAM,EAAM,aAAa,IAAI,MAAM,EAAa,MAAM,IAAI,MAAM,EAE9D,EAAY,KAAK,GAElC,IAAY,SAAgB;GAChC,QAAQ,EAAM;GACd,WAAW,EAAM;EACnB,EAAE,GAEI,IAAU,QAAe,EAAM,SAAS,EAAM,KAAK;mBAI3C,EAAM,aAAQ,WAuC1B,EA0BM,OAAA;;GA1BO,OAAK,EAAE,EAAA,CAAA,EAAG,EAAM,SAAS,CAAA;MACpC,EAwBO,EAAA,CAAA,GAAA;eAxBQ,EAAA;4CAAU,QAAA;;oBASZ,CARK,EAAA,MAAa,UAAA,EAAA,GAA7B,EAQW,EAAA,CAAA,GAAA,EAAA,KAAA,EAAA,GAAA;qBANoB,EAAA,EAAA,EAAA,GAD7B,EAMc,GAAA,MAAA,EALE,EAAA,QAAP,YADT,EAMc,EAAA,CAAA,GAAA;KAJX,KAAK,EAAI;KACT,OAAO,EAAI;;sBAEG,CAAA,EAAA,EAAZ,EAAI,KAAK,GAAA,CAAA,CAAA,CAAA;;;;4BAGhB,EAac,GAAA,MAAA,EAZE,EAAA,QAAP,YADT,EAac,EAAA,CAAA,GAAA;IAXX,KAAK,EAAI;IACT,OAAO,EAAI;IACZ,OAAM;IACL,OAAK,EAAE,EAAA,KAAS;;qBAGc,EAAA,EAAA,EAAA,GAD/B,EAKE,GAAA,MAAA,EAJgB,EAAI,WAAb,YADT,EAKE,GAAA;KAHC,KAAK,EAAM;KACX,SAAS;KACT,MAAM,EAAM;;;;;iCA7DK,EAAA,GAA1B,EAqCO,EAAA,CAAA,GAAA;;GArCgC,OAAK,EAAE,EAAA,CAAA,EAAG,EAAM,SAAS,CAAA;;oBAGjD,CAFK,EAAA,SAAA,EAAA,GAAlB,EAEa,EAAA,CAAA,GAAA,EAAA,KAAA,EAAA,GAAA;qBAD+C,CAA1D,EAA0D,QAA1D,GAA0D,EAAjB,EAAA,KAAO,GAAA,CAAA,CAAA,CAAA;;oBAElD,EAgCc,EAAA,CAAA,GAAA,MAAA;qBAJL,CA3BP,EA2BO,EAAA,CAAA,GAAA;iBA3BQ,EAAA;8CAAU,QAAA;;sBASZ,CARK,EAAA,MAAa,UAAA,EAAA,GAA7B,EAQW,EAAA,CAAA,GAAA,EAAA,KAAA,EAAA,GAAA;uBANoB,EAAA,EAAA,EAAA,GAD7B,EAMc,GAAA,MAAA,EALE,EAAA,QAAP,YADT,EAMc,EAAA,CAAA,GAAA;OAJX,KAAK,EAAI;OACT,OAAO,EAAI;;wBAEG,CAAA,EAAA,EAAZ,EAAI,KAAK,GAAA,CAAA,CAAA,CAAA;;;;8BAGhB,EAgBc,GAAA,MAAA,EAfE,EAAA,QAAP,YADT,EAgBc,EAAA,CAAA,GAAA;MAdX,KAAK,EAAI;MACT,OAAO,EAAI;MACZ,OAAM;MACL,OAAK,EAAE,EAAA,KAAS;;uBAGc,EAAA,EAAA,EAAA,GAD/B,EAKE,GAAA,MAAA,EAJgB,EAAI,WAAb,YADT,EAKE,GAAA;OAHC,KAAK,EAAM;OACX,SAAS;OACT,MAAM,EAAM;iDAEL,EAAI,SAAS,SAEvB,EAAA,IAAA,EAAA,KAFuB,EAAA,GAAvB,EAEI,KAFJ,GAA0E,wCAE1E,EAAA,CAAA;;;;2BAGM,EAAA,MAAa,SAEvB,EAAA,IAAA,EAAA,KAFuB,EAAA,GAAvB,EAEI,KAFJ,GAA0E,uBAE1E,EAAA,CAAA"}

package/dist/components/compositions/elements/code/BuildStatus.js

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

package/dist/components/compositions/elements/code/BuildStatus.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"BuildStatus.js","names":[],"sources":["../../../../../src/components/compositions/elements/code/BuildStatus.vue"],"sourcesContent":["<script setup lang=\"ts\">\n/**\n * Props-driven real-time build status composition. Subscribes to an\n * `EventSource` OR `WebSocket` (whichever is provided) and renders the\n * latest decoded `BuildStatusEvent`. The composition does NOT open or\n * close the underlying stream — the caller owns its lifecycle. The\n * optional `onUnsubscribe` callback fires on unmount for any extra\n * cleanup the caller wants.\n *\n *   <BuildStatus\n *     :initial=\"{ status: 'pending' }\"\n *     :event-stream=\"es\"\n *     :on-unsubscribe=\"() => es.close()\"\n *   />\n */\nimport { computed, onBeforeUnmount, onMounted, ref, watch } from \"vue\"\nimport {\n  Activity,\n  AlertTriangle,\n  Ban,\n  CheckCircle2,\n  ChevronDown,\n  ChevronRight,\n  Clock,\n  Loader2,\n  XCircle,\n} from \"@lucide/vue\"\nimport { Badge } from \"@/components/ui/badge\"\nimport { Button } from \"@/components/ui/button\"\nimport {\n  Card,\n  CardContent,\n  CardHeader,\n  CardTitle,\n} from \"@/components/ui/card\"\nimport { cn } from \"@/lib/utils\"\n\nexport type BuildStatusValue =\n  | \"pending\"\n  | \"running\"\n  | \"success\"\n  | \"failed\"\n  | \"cancelled\"\n\nexport interface BuildStatusEvent {\n  status: BuildStatusValue\n  startedAt?: string | Date\n  finishedAt?: string | Date\n  durationMs?: number\n  commitSha?: string\n  commitMessage?: string\n  triggeredBy?: string\n  logs?: string[]\n}\n\ninterface MessageEventLike {\n  data?: unknown\n}\ninterface EventListenerTarget {\n  addEventListener: (type: string, listener: (e: MessageEventLike) => void) => void\n  removeEventListener: (\n    type: string,\n    listener: (e: MessageEventLike) => void,\n  ) => void\n}\n\nexport interface BuildStatusProps {\n  /** Initial status to show before the stream emits. */\n  initial?: BuildStatusEvent\n  /** Optional EventSource to subscribe to (`message` events). */\n  eventStream?: EventListenerTarget\n  /** Optional WebSocket to subscribe to (`message` events). */\n  socket?: EventListenerTarget\n  /** Cleanup callback fired on unmount. The composition does NOT close\n   *  the underlying stream itself — caller owns the lifecycle. */\n  onUnsubscribe?: () => void\n  /** When true, render `logs[]` as a collapsible monospace block. */\n  showLogs?: boolean\n  label?: string\n  name?: string | null\n  classList?: string[] | string\n}\n\nconst props = withDefaults(defineProps<BuildStatusProps>(), {\n  showLogs: true,\n  label: \"Build Status\",\n})\n\nconst current = ref<BuildStatusEvent>({\n  status: props.initial?.status ?? \"pending\",\n  startedAt: props.initial?.startedAt,\n  finishedAt: props.initial?.finishedAt,\n  durationMs: props.initial?.durationMs,\n  commitSha: props.initial?.commitSha,\n  commitMessage: props.initial?.commitMessage,\n  triggeredBy: props.initial?.triggeredBy,\n  logs: props.initial?.logs ? [...props.initial.logs] : [],\n})\n\nconst logsExpanded = ref<boolean>(true)\nconst parseError = ref<string | null>(null)\n\nwatch(\n  () => props.initial,\n  (next) => {\n    if (!next) {\n      return\n    }\n    current.value = {\n      status: next.status,\n      startedAt: next.startedAt,\n      finishedAt: next.finishedAt,\n      durationMs: next.durationMs,\n      commitSha: next.commitSha,\n      commitMessage: next.commitMessage,\n      triggeredBy: next.triggeredBy,\n      logs: next.logs ? [...next.logs] : [],\n    }\n  },\n  { deep: true },\n)\n\nfunction applyEvent(payload: unknown): void {\n  if (!payload || typeof payload !== \"object\") {\n    return\n  }\n  const next = payload as Partial<BuildStatusEvent>\n  current.value = {\n    status: (next.status as BuildStatusValue) ?? current.value.status,\n    startedAt: next.startedAt ?? current.value.startedAt,\n    finishedAt: next.finishedAt ?? current.value.finishedAt,\n    durationMs:\n      next.durationMs !== undefined ? next.durationMs : current.value.durationMs,\n    commitSha: next.commitSha ?? current.value.commitSha,\n    commitMessage: next.commitMessage ?? current.value.commitMessage,\n    triggeredBy: next.triggeredBy ?? current.value.triggeredBy,\n    logs: Array.isArray(next.logs) ? next.logs : current.value.logs,\n  }\n}\n\nfunction handleMessage(e: MessageEventLike): void {\n  const raw = e.data\n  if (typeof raw === \"string\") {\n    try {\n      applyEvent(JSON.parse(raw))\n      parseError.value = null\n    } catch (err) {\n      parseError.value = err instanceof Error ? err.message : String(err)\n    }\n  } else if (raw && typeof raw === \"object\") {\n    applyEvent(raw)\n  }\n}\n\nlet attached: { target: EventListenerTarget; handler: (e: MessageEventLike) => void } | null = null\n\nonMounted(() => {\n  const target = props.eventStream ?? props.socket\n  if (!target) {\n    return\n  }\n  const handler = (e: MessageEventLike): void => {\n    handleMessage(e)\n  }\n  target.addEventListener(\"message\", handler)\n  attached = { target, handler }\n})\n\nonBeforeUnmount(() => {\n  if (attached) {\n    attached.target.removeEventListener(\"message\", attached.handler)\n    attached = null\n  }\n  if (props.onUnsubscribe) {\n    props.onUnsubscribe()\n  }\n})\n\n// -------- visual helpers ------------------------------------------------\n\nconst statusBadgeVariant = computed<\n  \"secondary\" | \"info\" | \"success\" | \"destructive\" | \"warning\"\n>(() => {\n  switch (current.value.status) {\n    case \"running\":\n      return \"info\"\n    case \"success\":\n      return \"success\"\n    case \"failed\":\n      return \"destructive\"\n    case \"cancelled\":\n      return \"warning\"\n    case \"pending\":\n    default:\n      return \"secondary\"\n  }\n})\n\nconst statusIcon = computed(() => {\n  switch (current.value.status) {\n    case \"running\":\n      return Loader2\n    case \"success\":\n      return CheckCircle2\n    case \"failed\":\n      return XCircle\n    case \"cancelled\":\n      return Ban\n    case \"pending\":\n    default:\n      return Clock\n  }\n})\n\nfunction formatDuration(value: number | undefined): string {\n  if (value === undefined || Number.isNaN(value)) {\n    return \"\"\n  }\n  const sec = Math.round(value / 1000)\n  if (sec < 60) {\n    return `${sec}s`\n  }\n  const m = Math.floor(sec / 60)\n  const s = sec % 60\n  return `${m}m ${s}s`\n}\n\nconst shortSha = computed<string>(() => {\n  const sha = current.value.commitSha\n  if (!sha) {\n    return \"\"\n  }\n  return sha.length > 7 ? sha.slice(0, 7) : sha\n})\n\nconst durationLabel = computed<string>(() =>\n  formatDuration(current.value.durationMs),\n)\n\nconst isRunning = computed<boolean>(() => current.value.status === \"running\")\n\ndefineExpose({ applyEvent })\n</script>\n\n<template>\n  <Card\n    :class=\"cn(props.classList)\"\n    :data-element-name=\"props.name ?? undefined\"\n    data-testid=\"build-status\"\n  >\n    <CardHeader class=\"flex flex-col gap-2 pb-3\">\n      <div class=\"flex items-center justify-between gap-2\">\n        <CardTitle class=\"flex items-center gap-2 text-base\">\n          <Activity class=\"size-5 text-muted-foreground\" />\n          <span>{{ props.label }}</span>\n        </CardTitle>\n        <Badge\n          :variant=\"statusBadgeVariant\"\n          size=\"default\"\n          class=\"capitalize\"\n          data-testid=\"build-status-badge\"\n        >\n          <component\n            :is=\"statusIcon\"\n            :class=\"\n              cn(\n                'size-3.5',\n                isRunning ? 'animate-spin' : '',\n              )\n            \"\n            :data-testid=\"\n              isRunning\n                ? 'build-status-spinner'\n                : 'build-status-icon'\n            \"\n          />\n          <span>{{ current.status }}</span>\n        </Badge>\n      </div>\n      <div\n        class=\"flex flex-wrap items-center gap-x-3 gap-y-1 text-xs text-muted-foreground\"\n      >\n        <span\n          v-if=\"shortSha\"\n          class=\"font-mono\"\n          data-testid=\"build-status-sha\"\n        >\n          {{ shortSha }}\n        </span>\n        <span\n          v-if=\"current.commitMessage\"\n          class=\"truncate\"\n          data-testid=\"build-status-commit-message\"\n        >\n          {{ current.commitMessage }}\n        </span>\n        <span\n          v-if=\"current.triggeredBy\"\n          data-testid=\"build-status-triggered-by\"\n        >\n          by {{ current.triggeredBy }}\n        </span>\n        <span\n          v-if=\"durationLabel\"\n          class=\"flex items-center gap-1\"\n          data-testid=\"build-status-duration\"\n        >\n          <Clock class=\"size-3\" />\n          {{ durationLabel }}\n        </span>\n      </div>\n      <p\n        v-if=\"parseError\"\n        class=\"text-xs text-destructive\"\n        role=\"alert\"\n        data-testid=\"build-status-parse-error\"\n      >\n        <AlertTriangle class=\"inline size-3\" />\n        {{ parseError }}\n      </p>\n    </CardHeader>\n    <CardContent\n      v-if=\"props.showLogs && current.logs && current.logs.length > 0\"\n      class=\"flex flex-col gap-2 pt-0\"\n    >\n      <Button\n        type=\"button\"\n        variant=\"ghost\"\n        size=\"sm\"\n        class=\"w-fit -ml-2 text-xs\"\n        data-testid=\"build-status-logs-toggle\"\n        @click=\"logsExpanded = !logsExpanded\"\n      >\n        <component\n          :is=\"logsExpanded ? ChevronDown : ChevronRight\"\n          class=\"size-4\"\n        />\n        <span>{{ logsExpanded ? \"Hide logs\" : \"Show logs\" }} ({{ current.logs.length }})</span>\n      </Button>\n      <pre\n        v-if=\"logsExpanded\"\n        class=\"max-h-80 overflow-auto rounded-md bg-muted p-3 font-mono text-xs leading-snug\"\n        data-testid=\"build-status-logs\"\n      ><code><template\n          v-for=\"(line, i) in current.logs\"\n          :key=\"i\"\n        >{{ line }}<br></template></code></pre>\n    </CardContent>\n  </Card>\n</template>\n"],"mappings":""}

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

@@ -1,194 +0,0 @@
-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/card/Card.js";
-import i from "../../../ui/card/CardContent.js";
-import a from "../../../ui/card/CardHeader.js";
-import o from "../../../ui/card/CardTitle.js";
-import "../../../ui/card/index.js";
-import { Fragment as s, computed as c, createBlock as l, createCommentVNode as u, createElementBlock as d, createElementVNode as f, createTextVNode as p, createVNode as m, defineComponent as h, normalizeClass as g, onBeforeUnmount as _, onMounted as v, openBlock as y, ref as b, renderList as x, resolveDynamicComponent as S, toDisplayString as C, unref as w, watch as T, withCtx as E } from "vue";
-import { Activity as ee, AlertTriangle as te, Ban as ne, CheckCircle2 as D, ChevronDown as O, ChevronRight as k, Clock as A, Loader2 as j, XCircle as M } from "@lucide/vue";
-//#region src/components/compositions/elements/code/BuildStatus.vue?vue&type=script&setup=true&lang.ts
-var N = { class: "flex items-center justify-between gap-2" }, P = { class: "flex flex-wrap items-center gap-x-3 gap-y-1 text-xs text-muted-foreground" }, F = {
-	key: 0,
-	class: "font-mono",
-	"data-testid": "build-status-sha"
-}, I = {
-	key: 1,
-	class: "truncate",
-	"data-testid": "build-status-commit-message"
-}, L = {
-	key: 2,
-	"data-testid": "build-status-triggered-by"
-}, R = {
-	key: 3,
-	class: "flex items-center gap-1",
-	"data-testid": "build-status-duration"
-}, z = {
-	key: 0,
-	class: "text-xs text-destructive",
-	role: "alert",
-	"data-testid": "build-status-parse-error"
-}, B = {
-	key: 0,
-	class: "max-h-80 overflow-auto rounded-md bg-muted p-3 font-mono text-xs leading-snug",
-	"data-testid": "build-status-logs"
-}, V = /* @__PURE__ */ h({
-	__name: "BuildStatus",
-	props: {
-		initial: {},
-		eventStream: {},
-		socket: {},
-		onUnsubscribe: {},
-		showLogs: {
-			type: Boolean,
-			default: !0
-		},
-		label: { default: "Build Status" },
-		name: {},
-		classList: {}
-	},
-	setup(h, { expose: V }) {
-		let H = h, U = b({
-			status: H.initial?.status ?? "pending",
-			startedAt: H.initial?.startedAt,
-			finishedAt: H.initial?.finishedAt,
-			durationMs: H.initial?.durationMs,
-			commitSha: H.initial?.commitSha,
-			commitMessage: H.initial?.commitMessage,
-			triggeredBy: H.initial?.triggeredBy,
-			logs: H.initial?.logs ? [...H.initial.logs] : []
-		}), W = b(!0), G = b(null);
-		T(() => H.initial, (e) => {
-			e && (U.value = {
-				status: e.status,
-				startedAt: e.startedAt,
-				finishedAt: e.finishedAt,
-				durationMs: e.durationMs,
-				commitSha: e.commitSha,
-				commitMessage: e.commitMessage,
-				triggeredBy: e.triggeredBy,
-				logs: e.logs ? [...e.logs] : []
-			});
-		}, { deep: !0 });
-		function K(e) {
-			if (!e || typeof e != "object") return;
-			let t = e;
-			U.value = {
-				status: t.status ?? U.value.status,
-				startedAt: t.startedAt ?? U.value.startedAt,
-				finishedAt: t.finishedAt ?? U.value.finishedAt,
-				durationMs: t.durationMs === void 0 ? U.value.durationMs : t.durationMs,
-				commitSha: t.commitSha ?? U.value.commitSha,
-				commitMessage: t.commitMessage ?? U.value.commitMessage,
-				triggeredBy: t.triggeredBy ?? U.value.triggeredBy,
-				logs: Array.isArray(t.logs) ? t.logs : U.value.logs
-			};
-		}
-		function q(e) {
-			let t = e.data;
-			if (typeof t == "string") try {
-				K(JSON.parse(t)), G.value = null;
-			} catch (e) {
-				G.value = e instanceof Error ? e.message : String(e);
-			}
-			else t && typeof t == "object" && K(t);
-		}
-		let J = null;
-		v(() => {
-			let e = H.eventStream ?? H.socket;
-			if (!e) return;
-			let t = (e) => {
-				q(e);
-			};
-			e.addEventListener("message", t), J = {
-				target: e,
-				handler: t
-			};
-		}), _(() => {
-			J &&= (J.target.removeEventListener("message", J.handler), null), H.onUnsubscribe && H.onUnsubscribe();
-		});
-		let Y = c(() => {
-			switch (U.value.status) {
-				case "running": return "info";
-				case "success": return "success";
-				case "failed": return "destructive";
-				case "cancelled": return "warning";
-				default: return "secondary";
-			}
-		}), X = c(() => {
-			switch (U.value.status) {
-				case "running": return j;
-				case "success": return D;
-				case "failed": return M;
-				case "cancelled": return ne;
-				default: return A;
-			}
-		});
-		function re(e) {
-			if (e === void 0 || Number.isNaN(e)) return "";
-			let t = Math.round(e / 1e3);
-			return t < 60 ? `${t}s` : `${Math.floor(t / 60)}m ${t % 60}s`;
-		}
-		let Z = c(() => {
-			let e = U.value.commitSha;
-			return e ? e.length > 7 ? e.slice(0, 7) : e : "";
-		}), Q = c(() => re(U.value.durationMs)), $ = c(() => U.value.status === "running");
-		return V({ applyEvent: K }), (c, h) => (y(), l(w(r), {
-			class: g(w(e)(H.classList)),
-			"data-element-name": H.name ?? void 0,
-			"data-testid": "build-status"
-		}, {
-			default: E(() => [m(w(a), { class: "flex flex-col gap-2 pb-3" }, {
-				default: E(() => [
-					f("div", N, [m(w(o), { class: "flex items-center gap-2 text-base" }, {
-						default: E(() => [m(w(ee), { class: "size-5 text-muted-foreground" }), f("span", null, C(H.label), 1)]),
-						_: 1
-					}), m(w(t), {
-						variant: Y.value,
-						size: "default",
-						class: "capitalize",
-						"data-testid": "build-status-badge"
-					}, {
-						default: E(() => [(y(), l(S(X.value), {
-							class: g(w(e)("size-3.5", $.value ? "animate-spin" : "")),
-							"data-testid": $.value ? "build-status-spinner" : "build-status-icon"
-						}, null, 8, ["class", "data-testid"])), f("span", null, C(U.value.status), 1)]),
-						_: 1
-					}, 8, ["variant"])]),
-					f("div", P, [
-						Z.value ? (y(), d("span", F, C(Z.value), 1)) : u("", !0),
-						U.value.commitMessage ? (y(), d("span", I, C(U.value.commitMessage), 1)) : u("", !0),
-						U.value.triggeredBy ? (y(), d("span", L, " by " + C(U.value.triggeredBy), 1)) : u("", !0),
-						Q.value ? (y(), d("span", R, [m(w(A), { class: "size-3" }), p(" " + C(Q.value), 1)])) : u("", !0)
-					]),
-					G.value ? (y(), d("p", z, [m(w(te), { class: "inline size-3" }), p(" " + C(G.value), 1)])) : u("", !0)
-				]),
-				_: 1
-			}), H.showLogs && U.value.logs && U.value.logs.length > 0 ? (y(), l(w(i), {
-				key: 0,
-				class: "flex flex-col gap-2 pt-0"
-			}, {
-				default: E(() => [m(w(n), {
-					type: "button",
-					variant: "ghost",
-					size: "sm",
-					class: "w-fit -ml-2 text-xs",
-					"data-testid": "build-status-logs-toggle",
-					onClick: h[0] ||= (e) => W.value = !W.value
-				}, {
-					default: E(() => [(y(), l(S(W.value ? w(O) : w(k)), { class: "size-4" })), f("span", null, C(W.value ? "Hide logs" : "Show logs") + " (" + C(U.value.logs.length) + ")", 1)]),
-					_: 1
-				}), W.value ? (y(), d("pre", B, [f("code", null, [(y(!0), d(s, null, x(U.value.logs, (e, t) => (y(), d(s, { key: t }, [p(C(e), 1), h[1] ||= f("br", null, null, -1)], 64))), 128))])])) : u("", !0)]),
-				_: 1
-			})) : u("", !0)]),
-			_: 1
-		}, 8, ["class", "data-element-name"]));
-	}
-});
-//#endregion
-export { V as default };
-
-//# sourceMappingURL=BuildStatus.vue_vue_type_script_setup_true_lang.js.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"BuildStatus.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../../../src/components/compositions/elements/code/BuildStatus.vue"],"sourcesContent":["<script setup lang=\"ts\">\n/**\n * Props-driven real-time build status composition. Subscribes to an\n * `EventSource` OR `WebSocket` (whichever is provided) and renders the\n * latest decoded `BuildStatusEvent`. The composition does NOT open or\n * close the underlying stream — the caller owns its lifecycle. The\n * optional `onUnsubscribe` callback fires on unmount for any extra\n * cleanup the caller wants.\n *\n *   <BuildStatus\n *     :initial=\"{ status: 'pending' }\"\n *     :event-stream=\"es\"\n *     :on-unsubscribe=\"() => es.close()\"\n *   />\n */\nimport { computed, onBeforeUnmount, onMounted, ref, watch } from \"vue\"\nimport {\n  Activity,\n  AlertTriangle,\n  Ban,\n  CheckCircle2,\n  ChevronDown,\n  ChevronRight,\n  Clock,\n  Loader2,\n  XCircle,\n} from \"@lucide/vue\"\nimport { Badge } from \"@/components/ui/badge\"\nimport { Button } from \"@/components/ui/button\"\nimport {\n  Card,\n  CardContent,\n  CardHeader,\n  CardTitle,\n} from \"@/components/ui/card\"\nimport { cn } from \"@/lib/utils\"\n\nexport type BuildStatusValue =\n  | \"pending\"\n  | \"running\"\n  | \"success\"\n  | \"failed\"\n  | \"cancelled\"\n\nexport interface BuildStatusEvent {\n  status: BuildStatusValue\n  startedAt?: string | Date\n  finishedAt?: string | Date\n  durationMs?: number\n  commitSha?: string\n  commitMessage?: string\n  triggeredBy?: string\n  logs?: string[]\n}\n\ninterface MessageEventLike {\n  data?: unknown\n}\ninterface EventListenerTarget {\n  addEventListener: (type: string, listener: (e: MessageEventLike) => void) => void\n  removeEventListener: (\n    type: string,\n    listener: (e: MessageEventLike) => void,\n  ) => void\n}\n\nexport interface BuildStatusProps {\n  /** Initial status to show before the stream emits. */\n  initial?: BuildStatusEvent\n  /** Optional EventSource to subscribe to (`message` events). */\n  eventStream?: EventListenerTarget\n  /** Optional WebSocket to subscribe to (`message` events). */\n  socket?: EventListenerTarget\n  /** Cleanup callback fired on unmount. The composition does NOT close\n   *  the underlying stream itself — caller owns the lifecycle. */\n  onUnsubscribe?: () => void\n  /** When true, render `logs[]` as a collapsible monospace block. */\n  showLogs?: boolean\n  label?: string\n  name?: string | null\n  classList?: string[] | string\n}\n\nconst props = withDefaults(defineProps<BuildStatusProps>(), {\n  showLogs: true,\n  label: \"Build Status\",\n})\n\nconst current = ref<BuildStatusEvent>({\n  status: props.initial?.status ?? \"pending\",\n  startedAt: props.initial?.startedAt,\n  finishedAt: props.initial?.finishedAt,\n  durationMs: props.initial?.durationMs,\n  commitSha: props.initial?.commitSha,\n  commitMessage: props.initial?.commitMessage,\n  triggeredBy: props.initial?.triggeredBy,\n  logs: props.initial?.logs ? [...props.initial.logs] : [],\n})\n\nconst logsExpanded = ref<boolean>(true)\nconst parseError = ref<string | null>(null)\n\nwatch(\n  () => props.initial,\n  (next) => {\n    if (!next) {\n      return\n    }\n    current.value = {\n      status: next.status,\n      startedAt: next.startedAt,\n      finishedAt: next.finishedAt,\n      durationMs: next.durationMs,\n      commitSha: next.commitSha,\n      commitMessage: next.commitMessage,\n      triggeredBy: next.triggeredBy,\n      logs: next.logs ? [...next.logs] : [],\n    }\n  },\n  { deep: true },\n)\n\nfunction applyEvent(payload: unknown): void {\n  if (!payload || typeof payload !== \"object\") {\n    return\n  }\n  const next = payload as Partial<BuildStatusEvent>\n  current.value = {\n    status: (next.status as BuildStatusValue) ?? current.value.status,\n    startedAt: next.startedAt ?? current.value.startedAt,\n    finishedAt: next.finishedAt ?? current.value.finishedAt,\n    durationMs:\n      next.durationMs !== undefined ? next.durationMs : current.value.durationMs,\n    commitSha: next.commitSha ?? current.value.commitSha,\n    commitMessage: next.commitMessage ?? current.value.commitMessage,\n    triggeredBy: next.triggeredBy ?? current.value.triggeredBy,\n    logs: Array.isArray(next.logs) ? next.logs : current.value.logs,\n  }\n}\n\nfunction handleMessage(e: MessageEventLike): void {\n  const raw = e.data\n  if (typeof raw === \"string\") {\n    try {\n      applyEvent(JSON.parse(raw))\n      parseError.value = null\n    } catch (err) {\n      parseError.value = err instanceof Error ? err.message : String(err)\n    }\n  } else if (raw && typeof raw === \"object\") {\n    applyEvent(raw)\n  }\n}\n\nlet attached: { target: EventListenerTarget; handler: (e: MessageEventLike) => void } | null = null\n\nonMounted(() => {\n  const target = props.eventStream ?? props.socket\n  if (!target) {\n    return\n  }\n  const handler = (e: MessageEventLike): void => {\n    handleMessage(e)\n  }\n  target.addEventListener(\"message\", handler)\n  attached = { target, handler }\n})\n\nonBeforeUnmount(() => {\n  if (attached) {\n    attached.target.removeEventListener(\"message\", attached.handler)\n    attached = null\n  }\n  if (props.onUnsubscribe) {\n    props.onUnsubscribe()\n  }\n})\n\n// -------- visual helpers ------------------------------------------------\n\nconst statusBadgeVariant = computed<\n  \"secondary\" | \"info\" | \"success\" | \"destructive\" | \"warning\"\n>(() => {\n  switch (current.value.status) {\n    case \"running\":\n      return \"info\"\n    case \"success\":\n      return \"success\"\n    case \"failed\":\n      return \"destructive\"\n    case \"cancelled\":\n      return \"warning\"\n    case \"pending\":\n    default:\n      return \"secondary\"\n  }\n})\n\nconst statusIcon = computed(() => {\n  switch (current.value.status) {\n    case \"running\":\n      return Loader2\n    case \"success\":\n      return CheckCircle2\n    case \"failed\":\n      return XCircle\n    case \"cancelled\":\n      return Ban\n    case \"pending\":\n    default:\n      return Clock\n  }\n})\n\nfunction formatDuration(value: number | undefined): string {\n  if (value === undefined || Number.isNaN(value)) {\n    return \"\"\n  }\n  const sec = Math.round(value / 1000)\n  if (sec < 60) {\n    return `${sec}s`\n  }\n  const m = Math.floor(sec / 60)\n  const s = sec % 60\n  return `${m}m ${s}s`\n}\n\nconst shortSha = computed<string>(() => {\n  const sha = current.value.commitSha\n  if (!sha) {\n    return \"\"\n  }\n  return sha.length > 7 ? sha.slice(0, 7) : sha\n})\n\nconst durationLabel = computed<string>(() =>\n  formatDuration(current.value.durationMs),\n)\n\nconst isRunning = computed<boolean>(() => current.value.status === \"running\")\n\ndefineExpose({ applyEvent })\n</script>\n\n<template>\n  <Card\n    :class=\"cn(props.classList)\"\n    :data-element-name=\"props.name ?? undefined\"\n    data-testid=\"build-status\"\n  >\n    <CardHeader class=\"flex flex-col gap-2 pb-3\">\n      <div class=\"flex items-center justify-between gap-2\">\n        <CardTitle class=\"flex items-center gap-2 text-base\">\n          <Activity class=\"size-5 text-muted-foreground\" />\n          <span>{{ props.label }}</span>\n        </CardTitle>\n        <Badge\n          :variant=\"statusBadgeVariant\"\n          size=\"default\"\n          class=\"capitalize\"\n          data-testid=\"build-status-badge\"\n        >\n          <component\n            :is=\"statusIcon\"\n            :class=\"\n              cn(\n                'size-3.5',\n                isRunning ? 'animate-spin' : '',\n              )\n            \"\n            :data-testid=\"\n              isRunning\n                ? 'build-status-spinner'\n                : 'build-status-icon'\n            \"\n          />\n          <span>{{ current.status }}</span>\n        </Badge>\n      </div>\n      <div\n        class=\"flex flex-wrap items-center gap-x-3 gap-y-1 text-xs text-muted-foreground\"\n      >\n        <span\n          v-if=\"shortSha\"\n          class=\"font-mono\"\n          data-testid=\"build-status-sha\"\n        >\n          {{ shortSha }}\n        </span>\n        <span\n          v-if=\"current.commitMessage\"\n          class=\"truncate\"\n          data-testid=\"build-status-commit-message\"\n        >\n          {{ current.commitMessage }}\n        </span>\n        <span\n          v-if=\"current.triggeredBy\"\n          data-testid=\"build-status-triggered-by\"\n        >\n          by {{ current.triggeredBy }}\n        </span>\n        <span\n          v-if=\"durationLabel\"\n          class=\"flex items-center gap-1\"\n          data-testid=\"build-status-duration\"\n        >\n          <Clock class=\"size-3\" />\n          {{ durationLabel }}\n        </span>\n      </div>\n      <p\n        v-if=\"parseError\"\n        class=\"text-xs text-destructive\"\n        role=\"alert\"\n        data-testid=\"build-status-parse-error\"\n      >\n        <AlertTriangle class=\"inline size-3\" />\n        {{ parseError }}\n      </p>\n    </CardHeader>\n    <CardContent\n      v-if=\"props.showLogs && current.logs && current.logs.length > 0\"\n      class=\"flex flex-col gap-2 pt-0\"\n    >\n      <Button\n        type=\"button\"\n        variant=\"ghost\"\n        size=\"sm\"\n        class=\"w-fit -ml-2 text-xs\"\n        data-testid=\"build-status-logs-toggle\"\n        @click=\"logsExpanded = !logsExpanded\"\n      >\n        <component\n          :is=\"logsExpanded ? ChevronDown : ChevronRight\"\n          class=\"size-4\"\n        />\n        <span>{{ logsExpanded ? \"Hide logs\" : \"Show logs\" }} ({{ current.logs.length }})</span>\n      </Button>\n      <pre\n        v-if=\"logsExpanded\"\n        class=\"max-h-80 overflow-auto rounded-md bg-muted p-3 font-mono text-xs leading-snug\"\n        data-testid=\"build-status-logs\"\n      ><code><template\n          v-for=\"(line, i) in current.logs\"\n          :key=\"i\"\n        >{{ line }}<br></template></code></pre>\n    </CardContent>\n  </Card>\n</template>\n"],"mappings":"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"}

package/dist/components/compositions/elements/code/ChatMessage.js

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

package/dist/components/compositions/elements/code/ChatMessage.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"ChatMessage.js","names":[],"sources":["../../../../../src/components/compositions/elements/code/ChatMessage.vue"],"sourcesContent":["<script setup lang=\"ts\">\n/**\n * Generic chat-message bubble composition.\n *\n * Display-only — renders a single chat bubble in the style of Slack /\n * Discord / iMessage. Side-aligned by role, color-tinted by variant,\n * optional avatar, role badge, timestamp, typing indicator, inline\n * error, and a row of ghost-button actions.\n *\n * No platform-specific integration. Form-data store is not touched.\n *\n *   <ChatMessage\n *     role=\"assistant\"\n *     authorName=\"Assistant\"\n *     message=\"Hello, how can I help?\"\n *     :timestamp=\"new Date()\"\n *   />\n */\nimport { computed, ref, watch, type Component } from \"vue\"\nimport { cva, type VariantProps } from \"class-variance-authority\"\nimport { Avatar, AvatarFallback, AvatarImage } from \"@/components/ui/avatar\"\nimport { Badge } from \"@/components/ui/badge\"\nimport { Button } from \"@/components/ui/button\"\nimport { cn } from \"@/lib/utils\"\n\nexport type ChatMessageAlign = \"auto\" | \"start\" | \"end\"\nexport type ChatMessageVariant =\n  | \"default\"\n  | \"muted\"\n  | \"accent\"\n  | \"destructive\"\n\nexport interface ChatMessageAction {\n  id: string\n  label: string\n  icon?: string\n}\n\nexport interface ChatMessageProps {\n  message?: string\n  role?: \"user\" | \"assistant\" | \"system\" | \"tool\" | string\n  authorName?: string\n  authorAvatarUrl?: string\n  authorAvatarFallback?: string\n  timestamp?: string | Date\n  pending?: boolean\n  error?: string\n  actions?: ChatMessageAction[]\n  align?: ChatMessageAlign\n  variant?: ChatMessageVariant\n  allowHtml?: boolean\n  classList?: string[] | string\n}\n\nconst props = withDefaults(defineProps<ChatMessageProps>(), {\n  role: \"user\",\n  align: \"auto\",\n  pending: false,\n  allowHtml: false,\n  actions: () => [],\n})\n\nconst emit = defineEmits<{\n  (e: \"action\", payload: { id: string }): void\n}>()\n\n/* ---------- alignment ---------- */\n\nconst resolvedAlign = computed<\"start\" | \"end\">(() => {\n  if (props.align === \"start\" || props.align === \"end\") {\n    return props.align\n  }\n  return props.role === \"user\" ? \"end\" : \"start\"\n})\n\nconst isEnd = computed<boolean>(() => resolvedAlign.value === \"end\")\n\n/* ---------- variant ---------- */\n\nconst ROLE_VARIANT: Record<string, ChatMessageVariant> = {\n  user: \"accent\",\n  assistant: \"muted\",\n  system: \"default\",\n  tool: \"muted\",\n}\n\nconst resolvedVariant = computed<ChatMessageVariant>(() => {\n  if (props.variant) {\n    return props.variant\n  }\n  return ROLE_VARIANT[props.role] ?? \"default\"\n})\n\nconst bubbleVariants = cva(\n  \"max-w-[36rem] min-w-0 break-words rounded-2xl border px-3 py-2 text-sm shadow-sm\",\n  {\n    variants: {\n      variant: {\n        default: \"bg-card text-card-foreground border-border\",\n        muted: \"bg-muted text-foreground border-transparent\",\n        accent: \"bg-primary text-primary-foreground border-transparent\",\n        destructive:\n          \"bg-destructive text-destructive-foreground border-transparent\",\n      },\n      align: {\n        start: \"rounded-tl-sm\",\n        end: \"rounded-tr-sm\",\n      },\n    },\n    defaultVariants: {\n      variant: \"default\",\n      align: \"start\",\n    },\n  },\n)\n\ntype BubbleVariants = VariantProps<typeof bubbleVariants>\n\nconst bubbleClass = computed<string>(() =>\n  bubbleVariants({\n    variant: resolvedVariant.value as BubbleVariants[\"variant\"],\n    align: resolvedAlign.value,\n  }),\n)\n\n/* ---------- avatar fallback ---------- */\n\nconst derivedAvatarFallback = computed<string>(() => {\n  if (props.authorAvatarFallback) {\n    return props.authorAvatarFallback\n  }\n  const source = (props.authorName ?? props.role ?? \"?\").trim()\n  return source ? source.charAt(0).toUpperCase() : \"?\"\n})\n\n/* ---------- timestamp ---------- */\n\nconst formattedTimestamp = computed<string>(() => {\n  const ts = props.timestamp\n  if (!ts) {\n    return \"\"\n  }\n  const date = ts instanceof Date ? ts : new Date(ts)\n  if (Number.isNaN(date.getTime())) {\n    return \"\"\n  }\n  try {\n    return new Intl.DateTimeFormat(undefined, {\n      hour: \"numeric\",\n      minute: \"2-digit\",\n    }).format(date)\n  } catch {\n    return date.toISOString()\n  }\n})\n\n/* ---------- root class ---------- */\n\nconst rootClass = computed<string>(() => {\n  const cl = props.classList\n  if (!cl) {\n    return \"\"\n  }\n  return Array.isArray(cl) ? cl.join(\" \") : cl\n})\n\n/* ---------- role badge ---------- */\n\nconst showRoleBadge = computed<boolean>(() => {\n  return Boolean(props.role) && props.role !== \"user\"\n})\n\n/* ---------- actions (lucide icons, lazy) ---------- */\n\nconst ActionIcons = ref<Record<string, Component | null>>({})\n\nfunction toPascalCase(input: string): string {\n  return input\n    .replace(/[-_\\s]+(.)?/g, (_, ch?: string) => (ch ? ch.toUpperCase() : \"\"))\n    .replace(/^(.)/, (m) => m.toUpperCase())\n}\n\nasync function loadActionIcons(actions: ChatMessageAction[]): Promise<void> {\n  const needed = actions.filter((a) => a.icon).map((a) => a.icon as string)\n  if (needed.length === 0) {\n    return\n  }\n  const mod = await import(\"@lucide/vue\")\n  const registry = mod as unknown as Record<string, Component | undefined>\n  const next: Record<string, Component | null> = { ...ActionIcons.value }\n  for (const raw of needed) {\n    const name = toPascalCase(raw)\n    next[raw] = registry[name] ?? null\n  }\n  ActionIcons.value = next\n}\n\nwatch(\n  () => props.actions,\n  (next) => {\n    void loadActionIcons(next ?? [])\n  },\n  { immediate: true, deep: true },\n)\n\nfunction onAction(id: string): void {\n  emit(\"action\", { id })\n}\n</script>\n\n<template>\n  <div\n    :class=\"\n      cn(\n        'flex w-full items-end gap-2',\n        isEnd ? 'justify-end' : 'justify-start',\n        rootClass,\n      )\n    \"\n    :data-role=\"props.role\"\n    :data-align=\"resolvedAlign\"\n    :data-variant=\"resolvedVariant\"\n    data-testid=\"chat-message\"\n  >\n    <!-- left-side avatar -->\n    <Avatar\n      v-if=\"!isEnd\"\n      size=\"sm\"\n      class=\"mb-1\"\n      data-testid=\"chat-message-avatar\"\n    >\n      <AvatarImage\n        v-if=\"props.authorAvatarUrl\"\n        :src=\"props.authorAvatarUrl\"\n        :alt=\"props.authorName ?? props.role\"\n      />\n      <AvatarFallback>{{ derivedAvatarFallback }}</AvatarFallback>\n    </Avatar>\n\n    <div\n      :class=\"\n        cn(\n          'flex min-w-0 flex-col gap-1',\n          isEnd ? 'items-end' : 'items-start',\n        )\n      \"\n    >\n      <!-- bubble -->\n      <div :class=\"bubbleClass\" data-testid=\"chat-message-bubble\">\n        <!-- header -->\n        <div\n          v-if=\"props.authorName || showRoleBadge || formattedTimestamp\"\n          :class=\"\n            cn(\n              'mb-1 flex w-full items-center gap-2 text-xs',\n              isEnd ? 'flex-row-reverse' : 'flex-row',\n            )\n          \"\n        >\n          <span\n            v-if=\"props.authorName\"\n            class=\"font-medium\"\n            data-testid=\"chat-message-author\"\n          >\n            {{ props.authorName }}\n          </span>\n          <Badge\n            v-if=\"showRoleBadge\"\n            variant=\"outline\"\n            size=\"sm\"\n            data-testid=\"chat-message-role-badge\"\n          >\n            {{ props.role }}\n          </Badge>\n          <span\n            v-if=\"formattedTimestamp\"\n            :class=\"\n              cn(\n                'text-[11px] opacity-70',\n                resolvedVariant === 'accent' || resolvedVariant === 'destructive'\n                  ? ''\n                  : 'text-muted-foreground',\n                isEnd ? 'mr-auto' : 'ml-auto',\n              )\n            \"\n            data-testid=\"chat-message-timestamp\"\n          >\n            {{ formattedTimestamp }}\n          </span>\n        </div>\n\n        <!-- body -->\n        <div\n          v-if=\"props.pending\"\n          class=\"flex items-center gap-1 py-1\"\n          data-testid=\"chat-message-pending\"\n          aria-label=\"Typing\"\n        >\n          <span class=\"size-1.5 animate-bounce rounded-full bg-current opacity-60\" />\n          <span\n            class=\"size-1.5 animate-bounce rounded-full bg-current opacity-60 [animation-delay:150ms]\"\n          />\n          <span\n            class=\"size-1.5 animate-bounce rounded-full bg-current opacity-60 [animation-delay:300ms]\"\n          />\n        </div>\n        <div\n          v-else-if=\"props.allowHtml && props.message\"\n          class=\"whitespace-pre-wrap leading-snug\"\n          data-testid=\"chat-message-body\"\n          v-html=\"props.message\"\n        />\n        <div\n          v-else-if=\"props.message\"\n          class=\"whitespace-pre-wrap leading-snug\"\n          data-testid=\"chat-message-body\"\n        >\n          {{ props.message }}\n        </div>\n      </div>\n\n      <!-- error -->\n      <p\n        v-if=\"props.error\"\n        class=\"text-xs text-destructive\"\n        data-testid=\"chat-message-error\"\n      >\n        {{ props.error }}\n      </p>\n\n      <!-- actions -->\n      <div\n        v-if=\"props.actions && props.actions.length > 0\"\n        :class=\"\n          cn(\n            'flex flex-wrap gap-1',\n            isEnd ? 'justify-end' : 'justify-start',\n          )\n        \"\n        data-testid=\"chat-message-actions\"\n      >\n        <Button\n          v-for=\"action in props.actions\"\n          :key=\"action.id\"\n          type=\"button\"\n          variant=\"ghost\"\n          size=\"sm\"\n          :data-action-id=\"action.id\"\n          @click=\"onAction(action.id)\"\n        >\n          <component\n            :is=\"action.icon ? ActionIcons[action.icon] : null\"\n            v-if=\"action.icon && ActionIcons[action.icon]\"\n          />\n          <span>{{ action.label }}</span>\n        </Button>\n      </div>\n    </div>\n\n    <!-- right-side avatar -->\n    <Avatar\n      v-if=\"isEnd\"\n      size=\"sm\"\n      class=\"mb-1\"\n      data-testid=\"chat-message-avatar\"\n    >\n      <AvatarImage\n        v-if=\"props.authorAvatarUrl\"\n        :src=\"props.authorAvatarUrl\"\n        :alt=\"props.authorName ?? props.role\"\n      />\n      <AvatarFallback>{{ derivedAvatarFallback }}</AvatarFallback>\n    </Avatar>\n  </div>\n</template>\n"],"mappings":""}

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

@@ -1,219 +0,0 @@
-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/button/Button.js";
-import "../../../ui/button/index.js";
-import { Fragment as o, computed as s, createBlock as c, createCommentVNode as l, createElementBlock as u, createElementVNode as d, createTextVNode as f, createVNode as p, defineComponent as m, normalizeClass as h, openBlock as g, ref as _, renderList as v, resolveDynamicComponent as y, toDisplayString as b, unref as x, watch as S, withCtx as C } from "vue";
-import { cva as w } from "class-variance-authority";
-//#region src/components/compositions/elements/code/ChatMessage.vue?vue&type=script&setup=true&lang.ts
-var T = [
-	"data-role",
-	"data-align",
-	"data-variant"
-], E = {
-	key: 0,
-	class: "font-medium",
-	"data-testid": "chat-message-author"
-}, D = {
-	key: 1,
-	class: "flex items-center gap-1 py-1",
-	"data-testid": "chat-message-pending",
-	"aria-label": "Typing"
-}, O = ["innerHTML"], k = {
-	key: 3,
-	class: "whitespace-pre-wrap leading-snug",
-	"data-testid": "chat-message-body"
-}, A = {
-	key: 0,
-	class: "text-xs text-destructive",
-	"data-testid": "chat-message-error"
-}, j = /* @__PURE__ */ m({
-	__name: "ChatMessage",
-	props: {
-		message: {},
-		role: { default: "user" },
-		authorName: {},
-		authorAvatarUrl: {},
-		authorAvatarFallback: {},
-		timestamp: {},
-		pending: {
-			type: Boolean,
-			default: !1
-		},
-		error: {},
-		actions: { default: () => [] },
-		align: { default: "auto" },
-		variant: {},
-		allowHtml: {
-			type: Boolean,
-			default: !1
-		},
-		classList: {}
-	},
-	emits: ["action"],
-	setup(m, { emit: j }) {
-		let M = m, N = j, P = s(() => M.align === "start" || M.align === "end" ? M.align : M.role === "user" ? "end" : "start"), F = s(() => P.value === "end"), I = {
-			user: "accent",
-			assistant: "muted",
-			system: "default",
-			tool: "muted"
-		}, L = s(() => M.variant ? M.variant : I[M.role] ?? "default"), R = w("max-w-[36rem] min-w-0 break-words rounded-2xl border px-3 py-2 text-sm shadow-sm", {
-			variants: {
-				variant: {
-					default: "bg-card text-card-foreground border-border",
-					muted: "bg-muted text-foreground border-transparent",
-					accent: "bg-primary text-primary-foreground border-transparent",
-					destructive: "bg-destructive text-destructive-foreground border-transparent"
-				},
-				align: {
-					start: "rounded-tl-sm",
-					end: "rounded-tr-sm"
-				}
-			},
-			defaultVariants: {
-				variant: "default",
-				align: "start"
-			}
-		}), z = s(() => R({
-			variant: L.value,
-			align: P.value
-		})), B = s(() => {
-			if (M.authorAvatarFallback) return M.authorAvatarFallback;
-			let e = (M.authorName ?? M.role ?? "?").trim();
-			return e ? e.charAt(0).toUpperCase() : "?";
-		}), V = s(() => {
-			let e = M.timestamp;
-			if (!e) return "";
-			let t = e instanceof Date ? e : new Date(e);
-			if (Number.isNaN(t.getTime())) return "";
-			try {
-				return new Intl.DateTimeFormat(void 0, {
-					hour: "numeric",
-					minute: "2-digit"
-				}).format(t);
-			} catch {
-				return t.toISOString();
-			}
-		}), H = s(() => {
-			let e = M.classList;
-			return e ? Array.isArray(e) ? e.join(" ") : e : "";
-		}), U = s(() => !!M.role && M.role !== "user"), W = _({});
-		function G(e) {
-			return e.replace(/[-_\s]+(.)?/g, (e, t) => t ? t.toUpperCase() : "").replace(/^(.)/, (e) => e.toUpperCase());
-		}
-		async function K(e) {
-			let t = e.filter((e) => e.icon).map((e) => e.icon);
-			if (t.length === 0) return;
-			let n = await import("@lucide/vue"), r = { ...W.value };
-			for (let e of t) r[e] = n[G(e)] ?? null;
-			W.value = r;
-		}
-		S(() => M.actions, (e) => {
-			K(e ?? []);
-		}, {
-			immediate: !0,
-			deep: !0
-		});
-		function q(e) {
-			N("action", { id: e });
-		}
-		return (s, m) => (g(), u("div", {
-			class: h(x(e)("flex w-full items-end gap-2", F.value ? "justify-end" : "justify-start", H.value)),
-			"data-role": M.role,
-			"data-align": P.value,
-			"data-variant": L.value,
-			"data-testid": "chat-message"
-		}, [
-			F.value ? l("", !0) : (g(), c(x(t), {
-				key: 0,
-				size: "sm",
-				class: "mb-1",
-				"data-testid": "chat-message-avatar"
-			}, {
-				default: C(() => [M.authorAvatarUrl ? (g(), c(x(r), {
-					key: 0,
-					src: M.authorAvatarUrl,
-					alt: M.authorName ?? M.role
-				}, null, 8, ["src", "alt"])) : l("", !0), p(x(n), null, {
-					default: C(() => [f(b(B.value), 1)]),
-					_: 1
-				})]),
-				_: 1
-			})),
-			d("div", { class: h(x(e)("flex min-w-0 flex-col gap-1", F.value ? "items-end" : "items-start")) }, [
-				d("div", {
-					class: h(z.value),
-					"data-testid": "chat-message-bubble"
-				}, [M.authorName || U.value || V.value ? (g(), u("div", {
-					key: 0,
-					class: h(x(e)("mb-1 flex w-full items-center gap-2 text-xs", F.value ? "flex-row-reverse" : "flex-row"))
-				}, [
-					M.authorName ? (g(), u("span", E, b(M.authorName), 1)) : l("", !0),
-					U.value ? (g(), c(x(i), {
-						key: 1,
-						variant: "outline",
-						size: "sm",
-						"data-testid": "chat-message-role-badge"
-					}, {
-						default: C(() => [f(b(M.role), 1)]),
-						_: 1
-					})) : l("", !0),
-					V.value ? (g(), u("span", {
-						key: 2,
-						class: h(x(e)("text-[11px] opacity-70", L.value === "accent" || L.value === "destructive" ? "" : "text-muted-foreground", F.value ? "mr-auto" : "ml-auto")),
-						"data-testid": "chat-message-timestamp"
-					}, b(V.value), 3)) : l("", !0)
-				], 2)) : l("", !0), M.pending ? (g(), u("div", D, [...m[0] ||= [
-					d("span", { class: "size-1.5 animate-bounce rounded-full bg-current opacity-60" }, null, -1),
-					d("span", { class: "size-1.5 animate-bounce rounded-full bg-current opacity-60 [animation-delay:150ms]" }, null, -1),
-					d("span", { class: "size-1.5 animate-bounce rounded-full bg-current opacity-60 [animation-delay:300ms]" }, null, -1)
-				]])) : M.allowHtml && M.message ? (g(), u("div", {
-					key: 2,
-					class: "whitespace-pre-wrap leading-snug",
-					"data-testid": "chat-message-body",
-					innerHTML: M.message
-				}, null, 8, O)) : M.message ? (g(), u("div", k, b(M.message), 1)) : l("", !0)], 2),
-				M.error ? (g(), u("p", A, b(M.error), 1)) : l("", !0),
-				M.actions && M.actions.length > 0 ? (g(), u("div", {
-					key: 1,
-					class: h(x(e)("flex flex-wrap gap-1", F.value ? "justify-end" : "justify-start")),
-					"data-testid": "chat-message-actions"
-				}, [(g(!0), u(o, null, v(M.actions, (e) => (g(), c(x(a), {
-					key: e.id,
-					type: "button",
-					variant: "ghost",
-					size: "sm",
-					"data-action-id": e.id,
-					onClick: (t) => q(e.id)
-				}, {
-					default: C(() => [e.icon && W.value[e.icon] ? (g(), c(y(e.icon ? W.value[e.icon] : null), { key: 0 })) : l("", !0), d("span", null, b(e.label), 1)]),
-					_: 2
-				}, 1032, ["data-action-id", "onClick"]))), 128))], 2)) : l("", !0)
-			], 2),
-			F.value ? (g(), c(x(t), {
-				key: 1,
-				size: "sm",
-				class: "mb-1",
-				"data-testid": "chat-message-avatar"
-			}, {
-				default: C(() => [M.authorAvatarUrl ? (g(), c(x(r), {
-					key: 0,
-					src: M.authorAvatarUrl,
-					alt: M.authorName ?? M.role
-				}, null, 8, ["src", "alt"])) : l("", !0), p(x(n), null, {
-					default: C(() => [f(b(B.value), 1)]),
-					_: 1
-				})]),
-				_: 1
-			})) : l("", !0)
-		], 10, T));
-	}
-});
-//#endregion
-export { j as default };
-
-//# sourceMappingURL=ChatMessage.vue_vue_type_script_setup_true_lang.js.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"ChatMessage.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../../../src/components/compositions/elements/code/ChatMessage.vue"],"sourcesContent":["<script setup lang=\"ts\">\n/**\n * Generic chat-message bubble composition.\n *\n * Display-only — renders a single chat bubble in the style of Slack /\n * Discord / iMessage. Side-aligned by role, color-tinted by variant,\n * optional avatar, role badge, timestamp, typing indicator, inline\n * error, and a row of ghost-button actions.\n *\n * No platform-specific integration. Form-data store is not touched.\n *\n *   <ChatMessage\n *     role=\"assistant\"\n *     authorName=\"Assistant\"\n *     message=\"Hello, how can I help?\"\n *     :timestamp=\"new Date()\"\n *   />\n */\nimport { computed, ref, watch, type Component } from \"vue\"\nimport { cva, type VariantProps } from \"class-variance-authority\"\nimport { Avatar, AvatarFallback, AvatarImage } from \"@/components/ui/avatar\"\nimport { Badge } from \"@/components/ui/badge\"\nimport { Button } from \"@/components/ui/button\"\nimport { cn } from \"@/lib/utils\"\n\nexport type ChatMessageAlign = \"auto\" | \"start\" | \"end\"\nexport type ChatMessageVariant =\n  | \"default\"\n  | \"muted\"\n  | \"accent\"\n  | \"destructive\"\n\nexport interface ChatMessageAction {\n  id: string\n  label: string\n  icon?: string\n}\n\nexport interface ChatMessageProps {\n  message?: string\n  role?: \"user\" | \"assistant\" | \"system\" | \"tool\" | string\n  authorName?: string\n  authorAvatarUrl?: string\n  authorAvatarFallback?: string\n  timestamp?: string | Date\n  pending?: boolean\n  error?: string\n  actions?: ChatMessageAction[]\n  align?: ChatMessageAlign\n  variant?: ChatMessageVariant\n  allowHtml?: boolean\n  classList?: string[] | string\n}\n\nconst props = withDefaults(defineProps<ChatMessageProps>(), {\n  role: \"user\",\n  align: \"auto\",\n  pending: false,\n  allowHtml: false,\n  actions: () => [],\n})\n\nconst emit = defineEmits<{\n  (e: \"action\", payload: { id: string }): void\n}>()\n\n/* ---------- alignment ---------- */\n\nconst resolvedAlign = computed<\"start\" | \"end\">(() => {\n  if (props.align === \"start\" || props.align === \"end\") {\n    return props.align\n  }\n  return props.role === \"user\" ? \"end\" : \"start\"\n})\n\nconst isEnd = computed<boolean>(() => resolvedAlign.value === \"end\")\n\n/* ---------- variant ---------- */\n\nconst ROLE_VARIANT: Record<string, ChatMessageVariant> = {\n  user: \"accent\",\n  assistant: \"muted\",\n  system: \"default\",\n  tool: \"muted\",\n}\n\nconst resolvedVariant = computed<ChatMessageVariant>(() => {\n  if (props.variant) {\n    return props.variant\n  }\n  return ROLE_VARIANT[props.role] ?? \"default\"\n})\n\nconst bubbleVariants = cva(\n  \"max-w-[36rem] min-w-0 break-words rounded-2xl border px-3 py-2 text-sm shadow-sm\",\n  {\n    variants: {\n      variant: {\n        default: \"bg-card text-card-foreground border-border\",\n        muted: \"bg-muted text-foreground border-transparent\",\n        accent: \"bg-primary text-primary-foreground border-transparent\",\n        destructive:\n          \"bg-destructive text-destructive-foreground border-transparent\",\n      },\n      align: {\n        start: \"rounded-tl-sm\",\n        end: \"rounded-tr-sm\",\n      },\n    },\n    defaultVariants: {\n      variant: \"default\",\n      align: \"start\",\n    },\n  },\n)\n\ntype BubbleVariants = VariantProps<typeof bubbleVariants>\n\nconst bubbleClass = computed<string>(() =>\n  bubbleVariants({\n    variant: resolvedVariant.value as BubbleVariants[\"variant\"],\n    align: resolvedAlign.value,\n  }),\n)\n\n/* ---------- avatar fallback ---------- */\n\nconst derivedAvatarFallback = computed<string>(() => {\n  if (props.authorAvatarFallback) {\n    return props.authorAvatarFallback\n  }\n  const source = (props.authorName ?? props.role ?? \"?\").trim()\n  return source ? source.charAt(0).toUpperCase() : \"?\"\n})\n\n/* ---------- timestamp ---------- */\n\nconst formattedTimestamp = computed<string>(() => {\n  const ts = props.timestamp\n  if (!ts) {\n    return \"\"\n  }\n  const date = ts instanceof Date ? ts : new Date(ts)\n  if (Number.isNaN(date.getTime())) {\n    return \"\"\n  }\n  try {\n    return new Intl.DateTimeFormat(undefined, {\n      hour: \"numeric\",\n      minute: \"2-digit\",\n    }).format(date)\n  } catch {\n    return date.toISOString()\n  }\n})\n\n/* ---------- root class ---------- */\n\nconst rootClass = computed<string>(() => {\n  const cl = props.classList\n  if (!cl) {\n    return \"\"\n  }\n  return Array.isArray(cl) ? cl.join(\" \") : cl\n})\n\n/* ---------- role badge ---------- */\n\nconst showRoleBadge = computed<boolean>(() => {\n  return Boolean(props.role) && props.role !== \"user\"\n})\n\n/* ---------- actions (lucide icons, lazy) ---------- */\n\nconst ActionIcons = ref<Record<string, Component | null>>({})\n\nfunction toPascalCase(input: string): string {\n  return input\n    .replace(/[-_\\s]+(.)?/g, (_, ch?: string) => (ch ? ch.toUpperCase() : \"\"))\n    .replace(/^(.)/, (m) => m.toUpperCase())\n}\n\nasync function loadActionIcons(actions: ChatMessageAction[]): Promise<void> {\n  const needed = actions.filter((a) => a.icon).map((a) => a.icon as string)\n  if (needed.length === 0) {\n    return\n  }\n  const mod = await import(\"@lucide/vue\")\n  const registry = mod as unknown as Record<string, Component | undefined>\n  const next: Record<string, Component | null> = { ...ActionIcons.value }\n  for (const raw of needed) {\n    const name = toPascalCase(raw)\n    next[raw] = registry[name] ?? null\n  }\n  ActionIcons.value = next\n}\n\nwatch(\n  () => props.actions,\n  (next) => {\n    void loadActionIcons(next ?? [])\n  },\n  { immediate: true, deep: true },\n)\n\nfunction onAction(id: string): void {\n  emit(\"action\", { id })\n}\n</script>\n\n<template>\n  <div\n    :class=\"\n      cn(\n        'flex w-full items-end gap-2',\n        isEnd ? 'justify-end' : 'justify-start',\n        rootClass,\n      )\n    \"\n    :data-role=\"props.role\"\n    :data-align=\"resolvedAlign\"\n    :data-variant=\"resolvedVariant\"\n    data-testid=\"chat-message\"\n  >\n    <!-- left-side avatar -->\n    <Avatar\n      v-if=\"!isEnd\"\n      size=\"sm\"\n      class=\"mb-1\"\n      data-testid=\"chat-message-avatar\"\n    >\n      <AvatarImage\n        v-if=\"props.authorAvatarUrl\"\n        :src=\"props.authorAvatarUrl\"\n        :alt=\"props.authorName ?? props.role\"\n      />\n      <AvatarFallback>{{ derivedAvatarFallback }}</AvatarFallback>\n    </Avatar>\n\n    <div\n      :class=\"\n        cn(\n          'flex min-w-0 flex-col gap-1',\n          isEnd ? 'items-end' : 'items-start',\n        )\n      \"\n    >\n      <!-- bubble -->\n      <div :class=\"bubbleClass\" data-testid=\"chat-message-bubble\">\n        <!-- header -->\n        <div\n          v-if=\"props.authorName || showRoleBadge || formattedTimestamp\"\n          :class=\"\n            cn(\n              'mb-1 flex w-full items-center gap-2 text-xs',\n              isEnd ? 'flex-row-reverse' : 'flex-row',\n            )\n          \"\n        >\n          <span\n            v-if=\"props.authorName\"\n            class=\"font-medium\"\n            data-testid=\"chat-message-author\"\n          >\n            {{ props.authorName }}\n          </span>\n          <Badge\n            v-if=\"showRoleBadge\"\n            variant=\"outline\"\n            size=\"sm\"\n            data-testid=\"chat-message-role-badge\"\n          >\n            {{ props.role }}\n          </Badge>\n          <span\n            v-if=\"formattedTimestamp\"\n            :class=\"\n              cn(\n                'text-[11px] opacity-70',\n                resolvedVariant === 'accent' || resolvedVariant === 'destructive'\n                  ? ''\n                  : 'text-muted-foreground',\n                isEnd ? 'mr-auto' : 'ml-auto',\n              )\n            \"\n            data-testid=\"chat-message-timestamp\"\n          >\n            {{ formattedTimestamp }}\n          </span>\n        </div>\n\n        <!-- body -->\n        <div\n          v-if=\"props.pending\"\n          class=\"flex items-center gap-1 py-1\"\n          data-testid=\"chat-message-pending\"\n          aria-label=\"Typing\"\n        >\n          <span class=\"size-1.5 animate-bounce rounded-full bg-current opacity-60\" />\n          <span\n            class=\"size-1.5 animate-bounce rounded-full bg-current opacity-60 [animation-delay:150ms]\"\n          />\n          <span\n            class=\"size-1.5 animate-bounce rounded-full bg-current opacity-60 [animation-delay:300ms]\"\n          />\n        </div>\n        <div\n          v-else-if=\"props.allowHtml && props.message\"\n          class=\"whitespace-pre-wrap leading-snug\"\n          data-testid=\"chat-message-body\"\n          v-html=\"props.message\"\n        />\n        <div\n          v-else-if=\"props.message\"\n          class=\"whitespace-pre-wrap leading-snug\"\n          data-testid=\"chat-message-body\"\n        >\n          {{ props.message }}\n        </div>\n      </div>\n\n      <!-- error -->\n      <p\n        v-if=\"props.error\"\n        class=\"text-xs text-destructive\"\n        data-testid=\"chat-message-error\"\n      >\n        {{ props.error }}\n      </p>\n\n      <!-- actions -->\n      <div\n        v-if=\"props.actions && props.actions.length > 0\"\n        :class=\"\n          cn(\n            'flex flex-wrap gap-1',\n            isEnd ? 'justify-end' : 'justify-start',\n          )\n        \"\n        data-testid=\"chat-message-actions\"\n      >\n        <Button\n          v-for=\"action in props.actions\"\n          :key=\"action.id\"\n          type=\"button\"\n          variant=\"ghost\"\n          size=\"sm\"\n          :data-action-id=\"action.id\"\n          @click=\"onAction(action.id)\"\n        >\n          <component\n            :is=\"action.icon ? ActionIcons[action.icon] : null\"\n            v-if=\"action.icon && ActionIcons[action.icon]\"\n          />\n          <span>{{ action.label }}</span>\n        </Button>\n      </div>\n    </div>\n\n    <!-- right-side avatar -->\n    <Avatar\n      v-if=\"isEnd\"\n      size=\"sm\"\n      class=\"mb-1\"\n      data-testid=\"chat-message-avatar\"\n    >\n      <AvatarImage\n        v-if=\"props.authorAvatarUrl\"\n        :src=\"props.authorAvatarUrl\"\n        :alt=\"props.authorName ?? props.role\"\n      />\n      <AvatarFallback>{{ derivedAvatarFallback }}</AvatarFallback>\n    </Avatar>\n  </div>\n</template>\n"],"mappings":"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"}

package/dist/components/compositions/elements/code/FileTree.js

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

package/dist/components/compositions/elements/code/FileTree.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"FileTree.js","names":[],"sources":["../../../../../src/components/compositions/elements/code/FileTree.vue"],"sourcesContent":["<script setup lang=\"ts\">\n/**\n * Props-driven file tree composition. Renders a recursive list of files\n * and folders sourced by a `onLoadTree` callback. The composition makes\n * no HTTP calls itself — the consumer provides a Promise-returning\n * loader for each node.\n *\n *   <FileTree\n *     :on-load-tree=\"(path) => fetch(`/api/tree?path=${path}`).then(r => r.json())\"\n *     v-model:selected-path=\"selected\"\n *     v-model:expanded-paths=\"expanded\"\n *   />\n */\nimport { computed, h, onMounted, ref, watch, type PropType } from \"vue\"\nimport {\n  ChevronDown,\n  ChevronRight,\n  File as FileIcon,\n  Folder,\n  FolderOpen,\n} from \"@lucide/vue\"\nimport { Card, CardContent, CardHeader, CardTitle } from \"@/components/ui/card\"\nimport { Skeleton } from \"@/components/ui/skeleton\"\nimport { cn } from \"@/lib/utils\"\n\nexport interface TreeNode {\n  /** Full path from the root, e.g. `src/components/Button.vue`. */\n  path: string\n  /** Display name (typically the trailing path segment). */\n  name: string\n  kind: \"file\" | \"directory\"\n  /** Pre-loaded children. When omitted for a directory, the loader is\n   *  invoked the first time the node is expanded. */\n  children?: TreeNode[]\n}\n\nexport interface FileTreeProps {\n  /** Root path. Passed to `onLoadTree` on mount. */\n  path?: string\n  /** REQUIRED loader for children at a given path. */\n  onLoadTree: (path: string) => Promise<TreeNode[]>\n  /** Current selected file path (v-modelable as `selectedPath`). */\n  selectedPath?: string\n  /** Called when the user clicks a file. */\n  onSelectPath?: (path: string) => void\n  /** Controlled expanded directory paths (v-modelable as `expandedPaths`). */\n  expandedPaths?: string[]\n  /** Fired when the set of expanded paths changes. */\n  onExpandedChange?: (paths: string[]) => void\n  label?: string\n  name?: string | null\n  classList?: string[] | string\n}\n\nconst props = withDefaults(defineProps<FileTreeProps>(), {\n  path: \"\",\n  label: \"File Tree\",\n})\n\nconst emit = defineEmits<{\n  \"update:selectedPath\": [path: string]\n  \"update:expandedPaths\": [paths: string[]]\n}>()\n\ninterface InternalNode {\n  path: string\n  name: string\n  kind: \"file\" | \"directory\"\n  loading: boolean\n  loaded: boolean\n  error: string | null\n  childNodes: InternalNode[]\n}\n\nfunction toInternal(node: TreeNode): InternalNode {\n  return {\n    path: node.path,\n    name: node.name,\n    kind: node.kind,\n    loading: false,\n    loaded: Array.isArray(node.children),\n    error: null,\n    childNodes: Array.isArray(node.children)\n      ? node.children.map(toInternal)\n      : [],\n  }\n}\n\nconst rootNodes = ref<InternalNode[]>([])\nconst rootLoading = ref<boolean>(false)\nconst rootError = ref<string | null>(null)\n\nconst localExpanded = ref<Set<string>>(\n  new Set<string>(props.expandedPaths ?? []),\n)\n\nconst expandedPathsList = computed<string[]>(() =>\n  Array.from(localExpanded.value),\n)\n\nwatch(\n  () => props.expandedPaths,\n  (next) => {\n    if (next === undefined) {\n      return\n    }\n    localExpanded.value = new Set(next)\n  },\n)\n\nfunction notifyExpanded(): void {\n  const list = expandedPathsList.value\n  emit(\"update:expandedPaths\", list)\n  if (props.onExpandedChange) {\n    props.onExpandedChange(list)\n  }\n}\n\nasync function loadRoot(): Promise<void> {\n  rootLoading.value = true\n  rootError.value = null\n  try {\n    const result = await props.onLoadTree(props.path ?? \"\")\n    rootNodes.value = Array.isArray(result) ? result.map(toInternal) : []\n  } catch (err) {\n    rootError.value = err instanceof Error ? err.message : String(err)\n    rootNodes.value = []\n  } finally {\n    rootLoading.value = false\n  }\n}\n\nasync function loadChildren(node: InternalNode): Promise<void> {\n  if (node.kind !== \"directory\") {\n    return\n  }\n  if (node.loading || node.loaded) {\n    return\n  }\n  node.loading = true\n  node.error = null\n  try {\n    const result = await props.onLoadTree(node.path)\n    node.childNodes = Array.isArray(result) ? result.map(toInternal) : []\n    node.loaded = true\n  } catch (err) {\n    node.error = err instanceof Error ? err.message : String(err)\n    node.childNodes = []\n  } finally {\n    node.loading = false\n  }\n}\n\nfunction isExpanded(path: string): boolean {\n  return localExpanded.value.has(path)\n}\n\nasync function toggleDirectory(node: InternalNode): Promise<void> {\n  const next = new Set(localExpanded.value)\n  if (next.has(node.path)) {\n    next.delete(node.path)\n  } else {\n    next.add(node.path)\n    if (!node.loaded) {\n      await loadChildren(node)\n    }\n  }\n  localExpanded.value = next\n  notifyExpanded()\n}\n\nfunction selectFile(node: InternalNode): void {\n  if (node.kind !== \"file\") {\n    return\n  }\n  emit(\"update:selectedPath\", node.path)\n  if (props.onSelectPath) {\n    props.onSelectPath(node.path)\n  }\n}\n\nonMounted(() => {\n  void loadRoot()\n})\n\nwatch(\n  () => props.path,\n  () => {\n    void loadRoot()\n  },\n)\n\nconst FileTreeNode = {\n  name: \"FileTreeNode\",\n  props: {\n    node: {\n      type: Object as PropType<InternalNode>,\n      required: true as const,\n    },\n    depth: { type: Number, required: true as const },\n  },\n  setup(nodeProps: { node: InternalNode; depth: number }) {\n    return () => {\n      const node = nodeProps.node\n      const expanded = isExpanded(node.path)\n      const indent = { paddingLeft: `${nodeProps.depth * 16 + 8}px` }\n      const isFile = node.kind === \"file\"\n      const selected = isFile && props.selectedPath === node.path\n      const rowClass = [\n        \"flex items-center gap-1.5 rounded-sm py-1 pr-2 text-sm cursor-pointer hover:bg-accent hover:text-accent-foreground\",\n        selected ? \"bg-accent text-accent-foreground font-medium\" : \"\",\n      ].join(\" \")\n\n      const row = h(\n        \"div\",\n        {\n          class: rowClass,\n          style: indent,\n          role: \"treeitem\",\n          \"data-testid\": `file-tree-row-${node.path}`,\n          \"data-kind\": node.kind,\n          \"aria-expanded\": isFile ? undefined : String(expanded),\n          \"aria-selected\": isFile ? String(selected) : undefined,\n          onClick: (e: Event) => {\n            e.stopPropagation()\n            if (isFile) {\n              selectFile(node)\n            } else {\n              void toggleDirectory(node)\n            }\n          },\n        },\n        [\n          isFile\n            ? h(\"span\", { class: \"inline-block w-4 shrink-0\" })\n            : h(expanded ? ChevronDown : ChevronRight, {\n                class: \"size-4 shrink-0 text-muted-foreground\",\n                \"data-testid\": expanded\n                  ? `file-tree-chevron-down-${node.path}`\n                  : `file-tree-chevron-right-${node.path}`,\n              }),\n          isFile\n            ? h(FileIcon, {\n                class: \"size-4 shrink-0 text-muted-foreground\",\n              })\n            : h(expanded ? FolderOpen : Folder, {\n                class: \"size-4 shrink-0 text-muted-foreground\",\n              }),\n          h(\"span\", { class: \"truncate\" }, node.name),\n        ],\n      )\n\n      const children: ReturnType<typeof h>[] = []\n      if (!isFile && expanded) {\n        const childIndent = {\n          paddingLeft: `${(nodeProps.depth + 1) * 16 + 8}px`,\n        }\n        if (node.loading) {\n          children.push(\n            h(\n              \"li\",\n              {\n                class: \"py-1\",\n                style: childIndent,\n                \"data-testid\": `file-tree-child-loading-${node.path}`,\n              },\n              [h(Skeleton, { class: \"h-4 w-1/2\" })],\n            ),\n          )\n        } else if (node.error) {\n          children.push(\n            h(\n              \"li\",\n              {\n                class: \"py-1 text-sm text-destructive\",\n                style: childIndent,\n                role: \"alert\",\n                \"data-testid\": `file-tree-child-error-${node.path}`,\n              },\n              node.error,\n            ),\n          )\n        } else if (node.childNodes.length === 0) {\n          children.push(\n            h(\n              \"li\",\n              {\n                class: \"py-1 text-sm italic text-muted-foreground\",\n                style: childIndent,\n                \"data-testid\": `file-tree-child-empty-${node.path}`,\n              },\n              \"(empty)\",\n            ),\n          )\n        } else {\n          for (const child of node.childNodes) {\n            children.push(\n              h(FileTreeNode, {\n                key: child.path,\n                node: child,\n                depth: nodeProps.depth + 1,\n              }),\n            )\n          }\n        }\n      }\n\n      return h(\n        \"li\",\n        { class: \"flex list-none flex-col\" },\n        [row, ...children],\n      )\n    }\n  },\n}\n\ndefineExpose({ reload: loadRoot })\n</script>\n\n<template>\n  <Card\n    :class=\"cn(props.classList)\"\n    :data-element-name=\"props.name ?? undefined\"\n    data-testid=\"file-tree\"\n  >\n    <CardHeader>\n      <CardTitle class=\"flex items-center gap-2 text-base\">\n        <Folder class=\"size-5 text-muted-foreground\" />\n        <span>{{ props.label }}</span>\n      </CardTitle>\n    </CardHeader>\n    <CardContent class=\"px-2 pb-4\">\n      <div\n        v-if=\"rootLoading\"\n        data-testid=\"file-tree-loading\"\n        class=\"flex flex-col gap-1.5 px-2\"\n      >\n        <Skeleton class=\"h-5 w-3/4\" />\n        <Skeleton class=\"h-5 w-2/3\" />\n        <Skeleton class=\"h-5 w-1/2\" />\n      </div>\n      <p\n        v-else-if=\"rootError\"\n        class=\"px-2 text-sm text-destructive\"\n        data-testid=\"file-tree-error\"\n        role=\"alert\"\n      >\n        {{ rootError }}\n      </p>\n      <p\n        v-else-if=\"rootNodes.length === 0\"\n        class=\"px-2 text-sm text-muted-foreground\"\n        data-testid=\"file-tree-empty\"\n      >\n        No files.\n      </p>\n      <ul\n        v-else\n        class=\"flex flex-col\"\n        role=\"tree\"\n        data-testid=\"file-tree-list\"\n      >\n        <FileTreeNode\n          v-for=\"node in rootNodes\"\n          :key=\"node.path\"\n          :node=\"node\"\n          :depth=\"0\"\n        />\n      </ul>\n    </CardContent>\n  </Card>\n</template>\n"],"mappings":""}