@gxp-dev/mod-ui 2.0.0

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

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"ChatMessage.vue2.js","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-next\")\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"],"names":["props","__props","emit","__emit","resolvedAlign","computed","isEnd","ROLE_VARIANT","resolvedVariant","bubbleVariants","cva","bubbleClass","derivedAvatarFallback","source","formattedTimestamp","ts","date","rootClass","cl","showRoleBadge","ActionIcons","ref","toPascalCase","input","_","ch","m","loadActionIcons","actions","needed","a","registry","next","raw","name","watch","onAction","id","_createElementBlock","_normalizeClass","_unref","cn","_createBlock","Avatar","AvatarImage","_createVNode","AvatarFallback","_createElementVNode","_openBlock","_hoisted_2","_toDisplayString","Badge","_createTextVNode","_hoisted_3","_cache","_hoisted_5","_hoisted_6","_Fragment","_renderList","action","Button","$event","_resolveDynamicComponent"],"mappings":"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"}

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

@@ -0,0 +1,5 @@
+import f from "./FileTree.vue2.js";
+export {
+  f as default
+};
+//# sourceMappingURL=FileTree.vue.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"FileTree.vue.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}

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

@@ -0,0 +1,254 @@
+import { defineComponent as R, ref as m, computed as V, watch as C, onMounted as M, openBlock as i, createBlock as E, unref as l, normalizeClass as G, withCtx as x, createVNode as o, createElementVNode as H, toDisplayString as P, createElementBlock as u, Fragment as J, renderList as K, h as r } from "vue";
+import { Folder as S, ChevronDown as Q, ChevronRight as U, File as W, FolderOpen as X } from "lucide-vue-next";
+import "../../../ui/card/index.js";
+import g from "../../../ui/skeleton/Skeleton.vue.js";
+import { cn as Y } from "../../../../lib/utils.js";
+import Z from "../../../ui/card/Card.vue.js";
+import ee from "../../../ui/card/CardHeader.vue.js";
+import te from "../../../ui/card/CardTitle.vue.js";
+import ae from "../../../ui/card/CardContent.vue.js";
+const re = {
+  key: 0,
+  "data-testid": "file-tree-loading",
+  class: "flex flex-col gap-1.5 px-2"
+}, le = {
+  key: 1,
+  class: "px-2 text-sm text-destructive",
+  "data-testid": "file-tree-error",
+  role: "alert"
+}, se = {
+  key: 2,
+  class: "px-2 text-sm text-muted-foreground",
+  "data-testid": "file-tree-empty"
+}, ne = {
+  key: 3,
+  class: "flex flex-col",
+  role: "tree",
+  "data-testid": "file-tree-list"
+}, xe = /* @__PURE__ */ R({
+  __name: "FileTree",
+  props: {
+    path: { default: "" },
+    onLoadTree: {},
+    selectedPath: {},
+    onSelectPath: {},
+    expandedPaths: {},
+    onExpandedChange: {},
+    label: { default: "File Tree" },
+    name: {},
+    classList: {}
+  },
+  emits: ["update:selectedPath", "update:expandedPaths"],
+  setup(F, { expose: L, emit: b }) {
+    const a = F, k = b;
+    function y(e) {
+      return {
+        path: e.path,
+        name: e.name,
+        kind: e.kind,
+        loading: !1,
+        loaded: Array.isArray(e.children),
+        error: null,
+        childNodes: Array.isArray(e.children) ? e.children.map(y) : []
+      };
+    }
+    const h = m([]), v = m(!1), f = m(null), d = m(
+      new Set(a.expandedPaths ?? [])
+    ), A = V(
+      () => Array.from(d.value)
+    );
+    C(
+      () => a.expandedPaths,
+      (e) => {
+        e !== void 0 && (d.value = new Set(e));
+      }
+    );
+    function T() {
+      const e = A.value;
+      k("update:expandedPaths", e), a.onExpandedChange && a.onExpandedChange(e);
+    }
+    async function _() {
+      v.value = !0, f.value = null;
+      try {
+        const e = await a.onLoadTree(a.path ?? "");
+        h.value = Array.isArray(e) ? e.map(y) : [];
+      } catch (e) {
+        f.value = e instanceof Error ? e.message : String(e), h.value = [];
+      } finally {
+        v.value = !1;
+      }
+    }
+    async function z(e) {
+      if (e.kind === "directory" && !(e.loading || e.loaded)) {
+        e.loading = !0, e.error = null;
+        try {
+          const t = await a.onLoadTree(e.path);
+          e.childNodes = Array.isArray(t) ? t.map(y) : [], e.loaded = !0;
+        } catch (t) {
+          e.error = t instanceof Error ? t.message : String(t), e.childNodes = [];
+        } finally {
+          e.loading = !1;
+        }
+      }
+    }
+    function B(e) {
+      return d.value.has(e);
+    }
+    async function D(e) {
+      const t = new Set(d.value);
+      t.has(e.path) ? t.delete(e.path) : (t.add(e.path), e.loaded || await z(e)), d.value = t, T();
+    }
+    function j(e) {
+      e.kind === "file" && (k("update:selectedPath", e.path), a.onSelectPath && a.onSelectPath(e.path));
+    }
+    M(() => {
+      _();
+    }), C(
+      () => a.path,
+      () => {
+        _();
+      }
+    );
+    const w = {
+      name: "FileTreeNode",
+      props: {
+        node: {
+          type: Object,
+          required: !0
+        },
+        depth: { type: Number, required: !0 }
+      },
+      setup(e) {
+        return () => {
+          const t = e.node, s = B(t.path), q = { paddingLeft: `${e.depth * 16 + 8}px` }, n = t.kind === "file", $ = n && a.selectedPath === t.path, I = [
+            "flex items-center gap-1.5 rounded-sm py-1 pr-2 text-sm cursor-pointer hover:bg-accent hover:text-accent-foreground",
+            $ ? "bg-accent text-accent-foreground font-medium" : ""
+          ].join(" "), O = r(
+            "div",
+            {
+              class: I,
+              style: q,
+              role: "treeitem",
+              "data-testid": `file-tree-row-${t.path}`,
+              "data-kind": t.kind,
+              "aria-expanded": n ? void 0 : String(s),
+              "aria-selected": n ? String($) : void 0,
+              onClick: (p) => {
+                p.stopPropagation(), n ? j(t) : D(t);
+              }
+            },
+            [
+              n ? r("span", { class: "inline-block w-4 shrink-0" }) : r(s ? Q : U, {
+                class: "size-4 shrink-0 text-muted-foreground",
+                "data-testid": s ? `file-tree-chevron-down-${t.path}` : `file-tree-chevron-right-${t.path}`
+              }),
+              n ? r(W, {
+                class: "size-4 shrink-0 text-muted-foreground"
+              }) : r(s ? X : S, {
+                class: "size-4 shrink-0 text-muted-foreground"
+              }),
+              r("span", { class: "truncate" }, t.name)
+            ]
+          ), c = [];
+          if (!n && s) {
+            const p = {
+              paddingLeft: `${(e.depth + 1) * 16 + 8}px`
+            };
+            if (t.loading)
+              c.push(
+                r(
+                  "li",
+                  {
+                    class: "py-1",
+                    style: p,
+                    "data-testid": `file-tree-child-loading-${t.path}`
+                  },
+                  [r(g, { class: "h-4 w-1/2" })]
+                )
+              );
+            else if (t.error)
+              c.push(
+                r(
+                  "li",
+                  {
+                    class: "py-1 text-sm text-destructive",
+                    style: p,
+                    role: "alert",
+                    "data-testid": `file-tree-child-error-${t.path}`
+                  },
+                  t.error
+                )
+              );
+            else if (t.childNodes.length === 0)
+              c.push(
+                r(
+                  "li",
+                  {
+                    class: "py-1 text-sm italic text-muted-foreground",
+                    style: p,
+                    "data-testid": `file-tree-child-empty-${t.path}`
+                  },
+                  "(empty)"
+                )
+              );
+            else
+              for (const N of t.childNodes)
+                c.push(
+                  r(w, {
+                    key: N.path,
+                    node: N,
+                    depth: e.depth + 1
+                  })
+                );
+          }
+          return r(
+            "li",
+            { class: "flex list-none flex-col" },
+            [O, ...c]
+          );
+        };
+      }
+    };
+    return L({ reload: _ }), (e, t) => (i(), E(l(Z), {
+      class: G(l(Y)(a.classList)),
+      "data-element-name": a.name ?? void 0,
+      "data-testid": "file-tree"
+    }, {
+      default: x(() => [
+        o(l(ee), null, {
+          default: x(() => [
+            o(l(te), { class: "flex items-center gap-2 text-base" }, {
+              default: x(() => [
+                o(l(S), { class: "size-5 text-muted-foreground" }),
+                H("span", null, P(a.label), 1)
+              ]),
+              _: 1
+            })
+          ]),
+          _: 1
+        }),
+        o(l(ae), { class: "px-2 pb-4" }, {
+          default: x(() => [
+            v.value ? (i(), u("div", re, [
+              o(l(g), { class: "h-5 w-3/4" }),
+              o(l(g), { class: "h-5 w-2/3" }),
+              o(l(g), { class: "h-5 w-1/2" })
+            ])) : f.value ? (i(), u("p", le, P(f.value), 1)) : h.value.length === 0 ? (i(), u("p", se, " No files. ")) : (i(), u("ul", ne, [
+              (i(!0), u(J, null, K(h.value, (s) => (i(), E(w, {
+                key: s.path,
+                node: s,
+                depth: 0
+              }, null, 8, ["node"]))), 128))
+            ]))
+          ]),
+          _: 1
+        })
+      ]),
+      _: 1
+    }, 8, ["class", "data-element-name"]));
+  }
+});
+export {
+  xe as default
+};
+//# sourceMappingURL=FileTree.vue2.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"FileTree.vue2.js","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-next\"\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"],"names":["props","__props","emit","__emit","toInternal","node","rootNodes","ref","rootLoading","rootError","localExpanded","expandedPathsList","computed","watch","next","notifyExpanded","list","loadRoot","result","err","loadChildren","isExpanded","path","toggleDirectory","selectFile","onMounted","FileTreeNode","nodeProps","expanded","indent","isFile","selected","rowClass","row","h","e","ChevronDown","ChevronRight","FileIcon","FolderOpen","Folder","children","childIndent","Skeleton","child","__expose","_createBlock","_unref","Card","_normalizeClass","cn","_createVNode","CardHeader","CardTitle","_createElementVNode","_toDisplayString","CardContent","_openBlock","_createElementBlock","_hoisted_1","_hoisted_2","_hoisted_3","_hoisted_4","_Fragment","_renderList"],"mappings":"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"}

package/dist/components/compositions/elements/code/GitCodeEditor.vue.js

@@ -0,0 +1,5 @@
+import f from "./GitCodeEditor.vue2.js";
+export {
+  f as default
+};
+//# sourceMappingURL=GitCodeEditor.vue.js.map

package/dist/components/compositions/elements/code/GitCodeEditor.vue.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"GitCodeEditor.vue.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}