@gxp-dev/mod-ui 2.0.0 → 2.0.1

package/dist/components/compositions/elements/display/CarouselDisplay.vue2.js

@@ -1,147 +1,5 @@
-import { defineComponent as L, computed as y, ref as D, watch as h, onBeforeUnmount as M, openBlock as t, createElementBlock as l, normalizeClass as k, unref as b, Fragment as c, createElementVNode as d, renderList as w, toDisplayString as x, createCommentVNode as p, createVNode as _ } from "vue";
-import T from "embla-carousel-vue";
-import { ChevronLeft as z, ChevronRight as S } from "lucide-vue-next";
-import { cn as V } from "../../../../lib/utils.js";
-const P = {
-  key: 0,
-  class: "flex h-32 w-full items-center justify-center rounded border border-dashed bg-muted text-sm text-muted-foreground",
-  "data-testid": "carousel-display-empty"
-}, R = { class: "flex" }, E = ["src", "alt"], H = ["innerHTML"], $ = {
-  key: 2,
-  class: "flex h-full w-full items-center justify-center p-6 text-center text-sm"
-}, F = {
-  key: 3,
-  class: "mt-2 text-sm text-muted-foreground",
-  "data-testid": "carousel-slide-caption"
-}, G = {
-  key: 1,
-  class: "mt-2 flex items-center justify-center gap-1.5",
-  "data-testid": "carousel-indicators"
-}, U = ["aria-label", "aria-current", "onClick"], W = /* @__PURE__ */ L({
-  __name: "CarouselDisplay",
-  props: {
-    slides: { default: () => [] },
-    loop: { type: Boolean, default: !0 },
-    autoplay: { type: Boolean, default: !1 },
-    autoplayDelayMs: { default: 5e3 },
-    showIndicators: { type: Boolean, default: !0 },
-    showArrows: { type: Boolean, default: !0 },
-    classList: {}
-  },
-  setup(n) {
-    const r = n, [C, a] = T(
-      y(() => ({ loop: r.loop }))
-    ), f = D(0), i = y(() => r.slides.length);
-    function v() {
-      const e = a.value;
-      e && (f.value = e.selectedScrollSnap());
-    }
-    h(a, (e) => {
-      e && (v(), e.on("select", v), e.on("reInit", v));
-    });
-    let u = null;
-    function g() {
-      u !== null && (clearInterval(u), u = null);
-    }
-    function N() {
-      g(), !(!r.autoplay || i.value <= 1) && (u = setInterval(() => {
-        var e;
-        (e = a.value) == null || e.scrollNext();
-      }, r.autoplayDelayMs));
-    }
-    h(
-      () => [r.autoplay, r.autoplayDelayMs, i.value],
-      () => {
-        N();
-      },
-      { immediate: !0 }
-    ), M(() => {
-      g();
-    });
-    function A() {
-      var e;
-      (e = a.value) == null || e.scrollPrev();
-    }
-    function B() {
-      var e;
-      (e = a.value) == null || e.scrollNext();
-    }
-    function j(e) {
-      var m;
-      (m = a.value) == null || m.scrollTo(e);
-    }
-    const I = y(() => {
-      const e = r.classList;
-      return e ? Array.isArray(e) ? e.join(" ") : e : "";
-    });
-    return (e, m) => (t(), l("div", {
-      class: k(b(V)("relative w-full overflow-hidden", I.value)),
-      "data-testid": "carousel-display"
-    }, [
-      i.value === 0 ? (t(), l("div", P, " No slides ")) : (t(), l(c, { key: 1 }, [
-        d("div", {
-          ref_key: "emblaRef",
-          ref: C,
-          class: "overflow-hidden",
-          "data-testid": "carousel-viewport"
-        }, [
-          d("div", R, [
-            (t(!0), l(c, null, w(n.slides, (o, s) => (t(), l("div", {
-              key: s,
-              class: "min-w-0 flex-[0_0_100%]",
-              "data-testid": "carousel-slide"
-            }, [
-              o.src ? (t(), l("img", {
-                key: 0,
-                src: o.src,
-                alt: o.alt ?? "",
-                class: "block h-auto w-full rounded",
-                loading: "lazy"
-              }, null, 8, E)) : o.html ? (t(), l("div", {
-                key: 1,
-                class: "h-full w-full",
-                innerHTML: o.html
-              }, null, 8, H)) : (t(), l("div", $, x(o.caption ?? ""), 1)),
-              o.src && o.caption ? (t(), l("p", F, x(o.caption), 1)) : p("", !0)
-            ]))), 128))
-          ])
-        ], 512),
-        n.showArrows && i.value > 1 ? (t(), l(c, { key: 0 }, [
-          d("button", {
-            type: "button",
-            class: "absolute left-2 top-1/2 -translate-y-1/2 inline-flex h-8 w-8 items-center justify-center rounded-full bg-background/70 text-foreground shadow ring-1 ring-border hover:bg-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
-            "aria-label": "Previous slide",
-            "data-testid": "carousel-prev",
-            onClick: A
-          }, [
-            _(b(z), { class: "size-4" })
-          ]),
-          d("button", {
-            type: "button",
-            class: "absolute right-2 top-1/2 -translate-y-1/2 inline-flex h-8 w-8 items-center justify-center rounded-full bg-background/70 text-foreground shadow ring-1 ring-border hover:bg-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
-            "aria-label": "Next slide",
-            "data-testid": "carousel-next",
-            onClick: B
-          }, [
-            _(b(S), { class: "size-4" })
-          ])
-        ], 64)) : p("", !0),
-        n.showIndicators && i.value > 1 ? (t(), l("div", G, [
-          (t(!0), l(c, null, w(n.slides, (o, s) => (t(), l("button", {
-            key: s,
-            type: "button",
-            class: k(["h-2 w-2 rounded-full bg-muted-foreground/40 transition-colors hover:bg-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring", s === f.value ? "bg-primary" : ""]),
-            "aria-label": `Go to slide ${s + 1}`,
-            "aria-current": s === f.value ? "true" : void 0,
-            "data-testid": "carousel-indicator",
-            onClick: (q) => j(s)
-          }, null, 10, U))), 128))
-        ])) : p("", !0)
-      ], 64))
-    ], 2));
-  }
-});
+import f from "./CarouselDisplay.vue.js";
 export {
-  W as default
+  f as default
 };
 //# sourceMappingURL=CarouselDisplay.vue2.js.map

package/dist/components/compositions/elements/display/CarouselDisplay.vue2.js.map

@@ -1 +1 @@
-{"version":3,"file":"CarouselDisplay.vue2.js","sources":["../../../../../src/components/compositions/elements/display/CarouselDisplay.vue"],"sourcesContent":["<script setup lang=\"ts\">\n/**\n * Props-driven carousel display.\n *\n * Wraps `embla-carousel-vue` to render a slideshow of image / html / text\n * slides. Read-only — no `modelValue`. Supports looping, autoplay (via a\n * lightweight `setInterval`, since `embla-carousel-autoplay` is not a\n * dependency here), prev/next arrows, and dot indicators.\n *\n *   <CarouselDisplay :slides=\"[{ src: '/a.jpg', alt: 'A' }, { src: '/b.jpg' }]\" />\n */\nimport { computed, onBeforeUnmount, ref, watch } from \"vue\"\nimport emblaCarouselVue from \"embla-carousel-vue\"\nimport { ChevronLeft, ChevronRight } from \"lucide-vue-next\"\nimport { cn } from \"@/lib/utils\"\n\nexport interface CarouselSlide {\n  src?: string\n  alt?: string\n  caption?: string\n  html?: string\n}\n\nexport interface CarouselDisplayProps {\n  slides?: CarouselSlide[]\n  loop?: boolean\n  autoplay?: boolean\n  autoplayDelayMs?: number\n  showIndicators?: boolean\n  showArrows?: boolean\n  classList?: string[] | string\n}\n\nconst props = withDefaults(defineProps<CarouselDisplayProps>(), {\n  slides: () => [],\n  loop: true,\n  autoplay: false,\n  autoplayDelayMs: 5000,\n  showIndicators: true,\n  showArrows: true,\n})\n\nconst [emblaRef, emblaApi] = emblaCarouselVue(\n  computed(() => ({ loop: props.loop })),\n)\n\nconst selectedIndex = ref<number>(0)\nconst slideCount = computed<number>(() => props.slides.length)\n\nfunction onSelect(): void {\n  const api = emblaApi.value\n  if (!api) {\n    return\n  }\n  selectedIndex.value = api.selectedScrollSnap()\n}\n\nwatch(emblaApi, (api) => {\n  if (!api) {\n    return\n  }\n  onSelect()\n  api.on(\"select\", onSelect)\n  api.on(\"reInit\", onSelect)\n})\n\nlet autoplayTimer: ReturnType<typeof setInterval> | null = null\n\nfunction clearAutoplay(): void {\n  if (autoplayTimer !== null) {\n    clearInterval(autoplayTimer)\n    autoplayTimer = null\n  }\n}\n\nfunction startAutoplay(): void {\n  clearAutoplay()\n  if (!props.autoplay || slideCount.value <= 1) {\n    return\n  }\n  autoplayTimer = setInterval(() => {\n    emblaApi.value?.scrollNext()\n  }, props.autoplayDelayMs)\n}\n\nwatch(\n  () => [props.autoplay, props.autoplayDelayMs, slideCount.value] as const,\n  () => {\n    startAutoplay()\n  },\n  { immediate: true },\n)\n\nonBeforeUnmount(() => {\n  clearAutoplay()\n})\n\nfunction scrollPrev(): void {\n  emblaApi.value?.scrollPrev()\n}\n\nfunction scrollNext(): void {\n  emblaApi.value?.scrollNext()\n}\n\nfunction scrollTo(index: number): void {\n  emblaApi.value?.scrollTo(index)\n}\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</script>\n\n<template>\n  <div\n    :class=\"cn('relative w-full overflow-hidden', rootClass)\"\n    data-testid=\"carousel-display\"\n  >\n    <div\n      v-if=\"slideCount === 0\"\n      class=\"flex h-32 w-full items-center justify-center rounded border border-dashed bg-muted text-sm text-muted-foreground\"\n      data-testid=\"carousel-display-empty\"\n    >\n      No slides\n    </div>\n    <template v-else>\n      <div ref=\"emblaRef\" class=\"overflow-hidden\" data-testid=\"carousel-viewport\">\n        <div class=\"flex\">\n          <div\n            v-for=\"(slide, index) in slides\"\n            :key=\"index\"\n            class=\"min-w-0 flex-[0_0_100%]\"\n            data-testid=\"carousel-slide\"\n          >\n            <img\n              v-if=\"slide.src\"\n              :src=\"slide.src\"\n              :alt=\"slide.alt ?? ''\"\n              class=\"block h-auto w-full rounded\"\n              loading=\"lazy\"\n            >\n            <div\n              v-else-if=\"slide.html\"\n              class=\"h-full w-full\"\n              v-html=\"slide.html\"\n            />\n            <div\n              v-else\n              class=\"flex h-full w-full items-center justify-center p-6 text-center text-sm\"\n            >\n              {{ slide.caption ?? \"\" }}\n            </div>\n            <p\n              v-if=\"slide.src && slide.caption\"\n              class=\"mt-2 text-sm text-muted-foreground\"\n              data-testid=\"carousel-slide-caption\"\n            >\n              {{ slide.caption }}\n            </p>\n          </div>\n        </div>\n      </div>\n\n      <template v-if=\"showArrows && slideCount > 1\">\n        <button\n          type=\"button\"\n          class=\"absolute left-2 top-1/2 -translate-y-1/2 inline-flex h-8 w-8 items-center justify-center rounded-full bg-background/70 text-foreground shadow ring-1 ring-border hover:bg-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring\"\n          aria-label=\"Previous slide\"\n          data-testid=\"carousel-prev\"\n          @click=\"scrollPrev\"\n        >\n          <ChevronLeft class=\"size-4\" />\n        </button>\n        <button\n          type=\"button\"\n          class=\"absolute right-2 top-1/2 -translate-y-1/2 inline-flex h-8 w-8 items-center justify-center rounded-full bg-background/70 text-foreground shadow ring-1 ring-border hover:bg-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring\"\n          aria-label=\"Next slide\"\n          data-testid=\"carousel-next\"\n          @click=\"scrollNext\"\n        >\n          <ChevronRight class=\"size-4\" />\n        </button>\n      </template>\n\n      <div\n        v-if=\"showIndicators && slideCount > 1\"\n        class=\"mt-2 flex items-center justify-center gap-1.5\"\n        data-testid=\"carousel-indicators\"\n      >\n        <button\n          v-for=\"(_, index) in slides\"\n          :key=\"index\"\n          type=\"button\"\n          class=\"h-2 w-2 rounded-full bg-muted-foreground/40 transition-colors hover:bg-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring\"\n          :class=\"index === selectedIndex ? 'bg-primary' : ''\"\n          :aria-label=\"`Go to slide ${index + 1}`\"\n          :aria-current=\"index === selectedIndex ? 'true' : undefined\"\n          data-testid=\"carousel-indicator\"\n          @click=\"scrollTo(index)\"\n        />\n      </div>\n    </template>\n  </div>\n</template>\n"],"names":["props","__props","emblaRef","emblaApi","emblaCarouselVue","computed","selectedIndex","ref","slideCount","onSelect","api","watch","autoplayTimer","clearAutoplay","startAutoplay","_a","onBeforeUnmount","scrollPrev","scrollNext","scrollTo","index","rootClass","cl","_createElementBlock","_normalizeClass","_unref","cn","_hoisted_1","_Fragment","_createElementVNode","_hoisted_2","_openBlock","_renderList","slide","_hoisted_5","_toDisplayString","_hoisted_6","_createVNode","ChevronLeft","ChevronRight","_hoisted_7","_","$event"],"mappings":"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"}
+{"version":3,"file":"CarouselDisplay.vue2.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}

package/dist/components/compositions/elements/display/ChartDisplay.vue.d.ts

@@ -0,0 +1,17 @@
+import { ChartData, ChartOptions } from 'chart.js';
+export type ChartDisplayType = "line" | "bar" | "pie" | "doughnut" | "radar" | "polarArea" | "bubble" | "scatter";
+export interface ChartDisplayProps {
+    chartType?: ChartDisplayType;
+    data: ChartData;
+    options?: ChartOptions;
+    width?: number | string;
+    height?: number | string;
+    classList?: string[] | string;
+}
+declare const _default: import('vue').DefineComponent<ChartDisplayProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<ChartDisplayProps> & Readonly<{}>, {
+    height: number | string;
+    width: number | string;
+    chartType: ChartDisplayType;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLDivElement>;
+export default _default;
+//# sourceMappingURL=ChartDisplay.vue.d.ts.map

package/dist/components/compositions/elements/display/ChartDisplay.vue.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ChartDisplay.vue.d.ts","sourceRoot":"","sources":["../../../../../src/components/compositions/elements/display/ChartDisplay.vue"],"names":[],"mappings":"AAqKA,OAAO,KAAK,EAAE,SAAS,EAAE,YAAY,EAAE,MAAM,UAAU,CAAA;AA4DvD,MAAM,MAAM,gBAAgB,GACxB,MAAM,GACN,KAAK,GACL,KAAK,GACL,UAAU,GACV,OAAO,GACP,WAAW,GACX,QAAQ,GACR,SAAS,CAAA;AAEb,MAAM,WAAW,iBAAiB;IAChC,SAAS,CAAC,EAAE,gBAAgB,CAAA;IAC5B,IAAI,EAAE,SAAS,CAAA;IACf,OAAO,CAAC,EAAE,YAAY,CAAA;IACtB,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IACvB,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IACxB,SAAS,CAAC,EAAE,MAAM,EAAE,GAAG,MAAM,CAAA;CAC9B;;YAFU,MAAM,GAAG,MAAM;WADhB,MAAM,GAAG,MAAM;eAHX,gBAAgB;;AAkH9B,wBAQG"}

package/dist/components/compositions/elements/display/ChartDisplay.vue.js

@@ -1,5 +1,81 @@
-import f from "./ChartDisplay.vue2.js";
+import { defineComponent as u, computed as r, openBlock as n, createElementBlock as h, normalizeStyle as C, normalizeClass as y, createBlock as f, resolveDynamicComponent as b } from "vue";
+import { Chart as g, CategoryScale as B, LinearScale as L, RadialLinearScale as A, BarElement as S, LineElement as v, PointElement as E, ArcElement as P, BarController as T, LineController as w, PieController as x, DoughnutController as D, RadarController as R, PolarAreaController as _, BubbleController as k, ScatterController as z, Tooltip as j, Legend as F, Title as M, Filler as O } from "chart.js";
+import { Scatter as $, Bubble as q, PolarArea as G, Radar as H, Doughnut as I, Pie as J, Bar as K, Line as l } from "vue-chartjs";
+import { cn as N } from "../../../../lib/utils.js";
+const Q = ["data-chart-type"], Y = /* @__PURE__ */ u({
+  __name: "ChartDisplay",
+  props: {
+    chartType: { default: "line" },
+    data: {},
+    options: {},
+    width: { default: "100%" },
+    height: { default: 300 },
+    classList: {}
+  },
+  setup(o) {
+    g.register(
+      B,
+      L,
+      A,
+      S,
+      v,
+      E,
+      P,
+      T,
+      w,
+      x,
+      D,
+      R,
+      _,
+      k,
+      z,
+      j,
+      F,
+      M,
+      O
+    );
+    const a = o, i = {
+      line: l,
+      bar: K,
+      pie: J,
+      doughnut: I,
+      radar: H,
+      polarArea: G,
+      bubble: q,
+      scatter: $
+    }, s = r(
+      () => i[a.chartType] ?? l
+    ), c = r(() => {
+      const e = a.classList, t = "relative";
+      if (!e)
+        return t;
+      const m = Array.isArray(e) ? e.join(" ") : e;
+      return N(t, m);
+    }), p = r(() => {
+      const e = (t) => typeof t == "number" ? `${t}px` : t;
+      return {
+        width: e(a.width),
+        height: e(a.height)
+      };
+    }), d = r(() => ({
+      responsive: !0,
+      maintainAspectRatio: !1,
+      ...a.options ?? {}
+    }));
+    return (e, t) => (n(), h("div", {
+      class: y(c.value),
+      style: C(p.value),
+      "data-testid": "chart-display",
+      "data-chart-type": o.chartType
+    }, [
+      (n(), f(b(s.value), {
+        data: o.data,
+        options: d.value
+      }, null, 8, ["data", "options"]))
+    ], 14, Q));
+  }
+});
 export {
-  f as default
+  Y as default
 };
 //# sourceMappingURL=ChartDisplay.vue.js.map

package/dist/components/compositions/elements/display/ChartDisplay.vue.js.map

@@ -1 +1 @@
-{"version":3,"file":"ChartDisplay.vue.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}
+{"version":3,"file":"ChartDisplay.vue.js","sources":["../../../../../src/components/compositions/elements/display/ChartDisplay.vue"],"sourcesContent":["<script setup lang=\"ts\">\n/**\n * Props-driven chart display.\n *\n * Renders any of Chart.js's standard chart types via `vue-chartjs`.\n * Chart.js is \"tree-shakable\" — the components it needs (scales,\n * elements, plugins) have to be registered once at module load before\n * a chart can render. We do that side-effecting `Chart.register(...)`\n * call at the top of this module so consumers don't have to think\n * about it.\n */\nimport type { Component } from \"vue\"\nimport type { ChartData, ChartOptions } from \"chart.js\"\nimport { computed } from \"vue\"\nimport {\n  ArcElement,\n  BarElement,\n  BubbleController,\n  CategoryScale,\n  Chart,\n  DoughnutController,\n  Filler,\n  Legend,\n  LinearScale,\n  LineController,\n  LineElement,\n  PieController,\n  PointElement,\n  PolarAreaController,\n  RadarController,\n  RadialLinearScale,\n  ScatterController,\n  Title,\n  Tooltip,\n  BarController,\n} from \"chart.js\"\nimport {\n  Bar,\n  Bubble,\n  Doughnut,\n  Line,\n  Pie,\n  PolarArea,\n  Radar,\n  Scatter,\n} from \"vue-chartjs\"\nimport { cn } from \"@/lib/utils\"\n\n// Register everything we expose. Idempotent — Chart.register is safe\n// to call multiple times.\nChart.register(\n  CategoryScale,\n  LinearScale,\n  RadialLinearScale,\n  BarElement,\n  LineElement,\n  PointElement,\n  ArcElement,\n  BarController,\n  LineController,\n  PieController,\n  DoughnutController,\n  RadarController,\n  PolarAreaController,\n  BubbleController,\n  ScatterController,\n  Tooltip,\n  Legend,\n  Title,\n  Filler,\n)\n\nexport type ChartDisplayType =\n  | \"line\"\n  | \"bar\"\n  | \"pie\"\n  | \"doughnut\"\n  | \"radar\"\n  | \"polarArea\"\n  | \"bubble\"\n  | \"scatter\"\n\nexport interface ChartDisplayProps {\n  chartType?: ChartDisplayType\n  data: ChartData\n  options?: ChartOptions\n  width?: number | string\n  height?: number | string\n  classList?: string[] | string\n}\n\nconst props = withDefaults(defineProps<ChartDisplayProps>(), {\n  chartType: \"line\",\n  width: \"100%\",\n  height: 300,\n})\n\nconst componentMap: Record<ChartDisplayType, Component> = {\n  line: Line,\n  bar: Bar,\n  pie: Pie,\n  doughnut: Doughnut,\n  radar: Radar,\n  polarArea: PolarArea,\n  bubble: Bubble,\n  scatter: Scatter,\n}\n\nconst chartComponent = computed<Component>(\n  () => componentMap[props.chartType] ?? Line,\n)\n\nconst wrapperClass = computed<string>(() => {\n  const cl = props.classList\n  const base = \"relative\"\n  if (!cl) {\n    return base\n  }\n  const extra = Array.isArray(cl) ? cl.join(\" \") : cl\n  return cn(base, extra)\n})\n\nconst dimensionStyle = computed<Record<string, string>>(() => {\n  const toCss = (v: number | string): string =>\n    typeof v === \"number\" ? `${v}px` : v\n  return {\n    width: toCss(props.width),\n    height: toCss(props.height),\n  }\n})\n\nconst mergedOptions = computed<ChartOptions>(() => ({\n  responsive: true,\n  maintainAspectRatio: false,\n  ...(props.options ?? {}),\n}))\n</script>\n\n<template>\n  <div\n    :class=\"wrapperClass\"\n    :style=\"dimensionStyle\"\n    data-testid=\"chart-display\"\n    :data-chart-type=\"chartType\"\n  >\n    <component\n      :is=\"chartComponent\"\n      :data=\"data\"\n      :options=\"mergedOptions\"\n    />\n  </div>\n</template>\n"],"names":["Chart","CategoryScale","LinearScale","RadialLinearScale","BarElement","LineElement","PointElement","ArcElement","BarController","LineController","PieController","DoughnutController","RadarController","PolarAreaController","BubbleController","ScatterController","Tooltip","Legend","Title","Filler","props","__props","componentMap","Line","Bar","Pie","Doughnut","Radar","PolarArea","Bubble","Scatter","chartComponent","computed","wrapperClass","cl","base","extra","cn","dimensionStyle","toCss","v","mergedOptions","_createElementBlock","_openBlock","_createBlock","_resolveDynamicComponent"],"mappings":";;;;;;;;;;;;;;;AAkDA,IAAAA,EAAM;AAAA,MACJC;AAAA,MACAC;AAAA,MACAC;AAAA,MACAC;AAAA,MACAC;AAAA,MACAC;AAAA,MACAC;AAAA,MACAC;AAAA,MACAC;AAAA,MACAC;AAAA,MACAC;AAAA,MACAC;AAAA,MACAC;AAAA,MACAC;AAAA,MACAC;AAAA,MACAC;AAAA,MACAC;AAAA,MACAC;AAAA,MACAC;AAAA,IAAA;AAsBF,UAAMC,IAAQC,GAMRC,IAAoD;AAAA,MACxD,MAAMC;AAAA,MACN,KAAKC;AAAA,MACL,KAAKC;AAAA,MACL,UAAUC;AAAA,MACV,OAAOC;AAAA,MACP,WAAWC;AAAA,MACX,QAAQC;AAAA,MACR,SAASC;AAAA,IAAA,GAGLC,IAAiBC;AAAA,MACrB,MAAMV,EAAaF,EAAM,SAAS,KAAKG;AAAA,IAAA,GAGnCU,IAAeD,EAAiB,MAAM;AAC1C,YAAME,IAAKd,EAAM,WACXe,IAAO;AACb,UAAI,CAACD;AACH,eAAOC;AAET,YAAMC,IAAQ,MAAM,QAAQF,CAAE,IAAIA,EAAG,KAAK,GAAG,IAAIA;AACjD,aAAOG,EAAGF,GAAMC,CAAK;AAAA,IACvB,CAAC,GAEKE,IAAiBN,EAAiC,MAAM;AAC5D,YAAMO,IAAQ,CAACC,MACb,OAAOA,KAAM,WAAW,GAAGA,CAAC,OAAOA;AACrC,aAAO;AAAA,QACL,OAAOD,EAAMnB,EAAM,KAAK;AAAA,QACxB,QAAQmB,EAAMnB,EAAM,MAAM;AAAA,MAAA;AAAA,IAE9B,CAAC,GAEKqB,IAAgBT,EAAuB,OAAO;AAAA,MAClD,YAAY;AAAA,MACZ,qBAAqB;AAAA,MACrB,GAAIZ,EAAM,WAAW,CAAA;AAAA,IAAC,EACtB;2BAIAsB,EAWM,OAAA;AAAA,MAVH,SAAOT,EAAA,KAAY;AAAA,MACnB,SAAOK,EAAA,KAAc;AAAA,MACtB,eAAY;AAAA,MACX,mBAAiBjB,EAAA;AAAA,IAAA;OAElBsB,KAAAC,EAIEC,EAHKd,EAAA,KAAc,GAAA;AAAA,QAClB,MAAMV,EAAA;AAAA,QACN,SAASoB,EAAA;AAAA,MAAA;;;;"}

package/dist/components/compositions/elements/display/ChartDisplay.vue2.js

@@ -1,81 +1,5 @@
-import { defineComponent as u, computed as r, openBlock as n, createElementBlock as h, normalizeStyle as C, normalizeClass as y, createBlock as f, resolveDynamicComponent as b } from "vue";
-import { Chart as g, CategoryScale as B, LinearScale as L, RadialLinearScale as A, BarElement as S, LineElement as v, PointElement as E, ArcElement as P, BarController as T, LineController as w, PieController as x, DoughnutController as D, RadarController as R, PolarAreaController as _, BubbleController as k, ScatterController as z, Tooltip as j, Legend as F, Title as M, Filler as O } from "chart.js";
-import { Scatter as $, Bubble as q, PolarArea as G, Radar as H, Doughnut as I, Pie as J, Bar as K, Line as l } from "vue-chartjs";
-import { cn as N } from "../../../../lib/utils.js";
-const Q = ["data-chart-type"], Y = /* @__PURE__ */ u({
-  __name: "ChartDisplay",
-  props: {
-    chartType: { default: "line" },
-    data: {},
-    options: {},
-    width: { default: "100%" },
-    height: { default: 300 },
-    classList: {}
-  },
-  setup(o) {
-    g.register(
-      B,
-      L,
-      A,
-      S,
-      v,
-      E,
-      P,
-      T,
-      w,
-      x,
-      D,
-      R,
-      _,
-      k,
-      z,
-      j,
-      F,
-      M,
-      O
-    );
-    const a = o, i = {
-      line: l,
-      bar: K,
-      pie: J,
-      doughnut: I,
-      radar: H,
-      polarArea: G,
-      bubble: q,
-      scatter: $
-    }, s = r(
-      () => i[a.chartType] ?? l
-    ), c = r(() => {
-      const e = a.classList, t = "relative";
-      if (!e)
-        return t;
-      const m = Array.isArray(e) ? e.join(" ") : e;
-      return N(t, m);
-    }), p = r(() => {
-      const e = (t) => typeof t == "number" ? `${t}px` : t;
-      return {
-        width: e(a.width),
-        height: e(a.height)
-      };
-    }), d = r(() => ({
-      responsive: !0,
-      maintainAspectRatio: !1,
-      ...a.options ?? {}
-    }));
-    return (e, t) => (n(), h("div", {
-      class: y(c.value),
-      style: C(p.value),
-      "data-testid": "chart-display",
-      "data-chart-type": o.chartType
-    }, [
-      (n(), f(b(s.value), {
-        data: o.data,
-        options: d.value
-      }, null, 8, ["data", "options"]))
-    ], 14, Q));
-  }
-});
+import f from "./ChartDisplay.vue.js";
 export {
-  Y as default
+  f as default
 };
 //# sourceMappingURL=ChartDisplay.vue2.js.map

package/dist/components/compositions/elements/display/ChartDisplay.vue2.js.map

@@ -1 +1 @@
-{"version":3,"file":"ChartDisplay.vue2.js","sources":["../../../../../src/components/compositions/elements/display/ChartDisplay.vue"],"sourcesContent":["<script setup lang=\"ts\">\n/**\n * Props-driven chart display.\n *\n * Renders any of Chart.js's standard chart types via `vue-chartjs`.\n * Chart.js is \"tree-shakable\" — the components it needs (scales,\n * elements, plugins) have to be registered once at module load before\n * a chart can render. We do that side-effecting `Chart.register(...)`\n * call at the top of this module so consumers don't have to think\n * about it.\n */\nimport type { Component } from \"vue\"\nimport type { ChartData, ChartOptions } from \"chart.js\"\nimport { computed } from \"vue\"\nimport {\n  ArcElement,\n  BarElement,\n  BubbleController,\n  CategoryScale,\n  Chart,\n  DoughnutController,\n  Filler,\n  Legend,\n  LinearScale,\n  LineController,\n  LineElement,\n  PieController,\n  PointElement,\n  PolarAreaController,\n  RadarController,\n  RadialLinearScale,\n  ScatterController,\n  Title,\n  Tooltip,\n  BarController,\n} from \"chart.js\"\nimport {\n  Bar,\n  Bubble,\n  Doughnut,\n  Line,\n  Pie,\n  PolarArea,\n  Radar,\n  Scatter,\n} from \"vue-chartjs\"\nimport { cn } from \"@/lib/utils\"\n\n// Register everything we expose. Idempotent — Chart.register is safe\n// to call multiple times.\nChart.register(\n  CategoryScale,\n  LinearScale,\n  RadialLinearScale,\n  BarElement,\n  LineElement,\n  PointElement,\n  ArcElement,\n  BarController,\n  LineController,\n  PieController,\n  DoughnutController,\n  RadarController,\n  PolarAreaController,\n  BubbleController,\n  ScatterController,\n  Tooltip,\n  Legend,\n  Title,\n  Filler,\n)\n\nexport type ChartDisplayType =\n  | \"line\"\n  | \"bar\"\n  | \"pie\"\n  | \"doughnut\"\n  | \"radar\"\n  | \"polarArea\"\n  | \"bubble\"\n  | \"scatter\"\n\nexport interface ChartDisplayProps {\n  chartType?: ChartDisplayType\n  data: ChartData\n  options?: ChartOptions\n  width?: number | string\n  height?: number | string\n  classList?: string[] | string\n}\n\nconst props = withDefaults(defineProps<ChartDisplayProps>(), {\n  chartType: \"line\",\n  width: \"100%\",\n  height: 300,\n})\n\nconst componentMap: Record<ChartDisplayType, Component> = {\n  line: Line,\n  bar: Bar,\n  pie: Pie,\n  doughnut: Doughnut,\n  radar: Radar,\n  polarArea: PolarArea,\n  bubble: Bubble,\n  scatter: Scatter,\n}\n\nconst chartComponent = computed<Component>(\n  () => componentMap[props.chartType] ?? Line,\n)\n\nconst wrapperClass = computed<string>(() => {\n  const cl = props.classList\n  const base = \"relative\"\n  if (!cl) {\n    return base\n  }\n  const extra = Array.isArray(cl) ? cl.join(\" \") : cl\n  return cn(base, extra)\n})\n\nconst dimensionStyle = computed<Record<string, string>>(() => {\n  const toCss = (v: number | string): string =>\n    typeof v === \"number\" ? `${v}px` : v\n  return {\n    width: toCss(props.width),\n    height: toCss(props.height),\n  }\n})\n\nconst mergedOptions = computed<ChartOptions>(() => ({\n  responsive: true,\n  maintainAspectRatio: false,\n  ...(props.options ?? {}),\n}))\n</script>\n\n<template>\n  <div\n    :class=\"wrapperClass\"\n    :style=\"dimensionStyle\"\n    data-testid=\"chart-display\"\n    :data-chart-type=\"chartType\"\n  >\n    <component\n      :is=\"chartComponent\"\n      :data=\"data\"\n      :options=\"mergedOptions\"\n    />\n  </div>\n</template>\n"],"names":["Chart","CategoryScale","LinearScale","RadialLinearScale","BarElement","LineElement","PointElement","ArcElement","BarController","LineController","PieController","DoughnutController","RadarController","PolarAreaController","BubbleController","ScatterController","Tooltip","Legend","Title","Filler","props","__props","componentMap","Line","Bar","Pie","Doughnut","Radar","PolarArea","Bubble","Scatter","chartComponent","computed","wrapperClass","cl","base","extra","cn","dimensionStyle","toCss","v","mergedOptions","_createElementBlock","_openBlock","_createBlock","_resolveDynamicComponent"],"mappings":";;;;;;;;;;;;;;;AAkDA,IAAAA,EAAM;AAAA,MACJC;AAAA,MACAC;AAAA,MACAC;AAAA,MACAC;AAAA,MACAC;AAAA,MACAC;AAAA,MACAC;AAAA,MACAC;AAAA,MACAC;AAAA,MACAC;AAAA,MACAC;AAAA,MACAC;AAAA,MACAC;AAAA,MACAC;AAAA,MACAC;AAAA,MACAC;AAAA,MACAC;AAAA,MACAC;AAAA,MACAC;AAAA,IAAA;AAsBF,UAAMC,IAAQC,GAMRC,IAAoD;AAAA,MACxD,MAAMC;AAAA,MACN,KAAKC;AAAA,MACL,KAAKC;AAAA,MACL,UAAUC;AAAA,MACV,OAAOC;AAAA,MACP,WAAWC;AAAA,MACX,QAAQC;AAAA,MACR,SAASC;AAAA,IAAA,GAGLC,IAAiBC;AAAA,MACrB,MAAMV,EAAaF,EAAM,SAAS,KAAKG;AAAA,IAAA,GAGnCU,IAAeD,EAAiB,MAAM;AAC1C,YAAME,IAAKd,EAAM,WACXe,IAAO;AACb,UAAI,CAACD;AACH,eAAOC;AAET,YAAMC,IAAQ,MAAM,QAAQF,CAAE,IAAIA,EAAG,KAAK,GAAG,IAAIA;AACjD,aAAOG,EAAGF,GAAMC,CAAK;AAAA,IACvB,CAAC,GAEKE,IAAiBN,EAAiC,MAAM;AAC5D,YAAMO,IAAQ,CAACC,MACb,OAAOA,KAAM,WAAW,GAAGA,CAAC,OAAOA;AACrC,aAAO;AAAA,QACL,OAAOD,EAAMnB,EAAM,KAAK;AAAA,QACxB,QAAQmB,EAAMnB,EAAM,MAAM;AAAA,MAAA;AAAA,IAE9B,CAAC,GAEKqB,IAAgBT,EAAuB,OAAO;AAAA,MAClD,YAAY;AAAA,MACZ,qBAAqB;AAAA,MACrB,GAAIZ,EAAM,WAAW,CAAA;AAAA,IAAC,EACtB;2BAIAsB,EAWM,OAAA;AAAA,MAVH,SAAOT,EAAA,KAAY;AAAA,MACnB,SAAOK,EAAA,KAAc;AAAA,MACtB,eAAY;AAAA,MACX,mBAAiBjB,EAAA;AAAA,IAAA;OAElBsB,KAAAC,EAIEC,EAHKd,EAAA,KAAc,GAAA;AAAA,QAClB,MAAMV,EAAA;AAAA,QACN,SAASoB,EAAA;AAAA,MAAA;;;;"}
+{"version":3,"file":"ChartDisplay.vue2.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}

package/dist/components/compositions/elements/display/HtmlDisplay.vue.d.ts

@@ -0,0 +1,7 @@
+export interface HtmlDisplayProps {
+    value?: string | number | null;
+    classList?: string[] | string;
+}
+declare const _default: import('vue').DefineComponent<HtmlDisplayProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<HtmlDisplayProps> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLDivElement>;
+export default _default;
+//# sourceMappingURL=HtmlDisplay.vue.d.ts.map

package/dist/components/compositions/elements/display/HtmlDisplay.vue.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"HtmlDisplay.vue.d.ts","sourceRoot":"","sources":["../../../../../src/components/compositions/elements/display/HtmlDisplay.vue"],"names":[],"mappings":"AAsDA,MAAM,WAAW,gBAAgB;IAC/B,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,GAAG,IAAI,CAAA;IAC9B,SAAS,CAAC,EAAE,MAAM,EAAE,GAAG,MAAM,CAAA;CAC9B;;AA8DD,wBAOG"}

package/dist/components/compositions/elements/display/HtmlDisplay.vue.js

@@ -1,5 +1,23 @@
-import f from "./HtmlDisplay.vue2.js";
+import { defineComponent as a, computed as n, openBlock as o, createElementBlock as i, normalizeClass as c } from "vue";
+const u = ["innerHTML"], d = /* @__PURE__ */ a({
+  __name: "HtmlDisplay",
+  props: {
+    value: {},
+    classList: {}
+  },
+  setup(s) {
+    const e = s, l = n(() => e.value === void 0 || e.value === null ? "" : String(e.value)), r = n(() => {
+      const t = e.classList;
+      return t ? Array.isArray(t) ? t.join(" ") : t : "";
+    });
+    return (t, p) => (o(), i("div", {
+      class: c(["gxp-html-display", r.value]),
+      "data-testid": "html-display",
+      innerHTML: l.value
+    }, null, 10, u));
+  }
+});
 export {
-  f as default
+  d as default
 };
 //# sourceMappingURL=HtmlDisplay.vue.js.map

package/dist/components/compositions/elements/display/HtmlDisplay.vue.js.map

@@ -1 +1 @@
-{"version":3,"file":"HtmlDisplay.vue.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}
+{"version":3,"file":"HtmlDisplay.vue.js","sources":["../../../../../src/components/compositions/elements/display/HtmlDisplay.vue"],"sourcesContent":["<script setup lang=\"ts\">\n/**\n * Props-driven raw HTML display.\n *\n * SECURITY: the caller is responsible for trusting the source of\n * `value`. The wrapping `<div>` provides a styling boundary but does\n * not sanitise the markup. Pair with a server-side sanitiser when\n * accepting user input.\n */\nimport { computed } from \"vue\"\n\nexport interface HtmlDisplayProps {\n  value?: string | number | null\n  classList?: string[] | string\n}\n\nconst props = defineProps<HtmlDisplayProps>()\n\nconst content = computed<string>(() => {\n  if (props.value === undefined || props.value === null) {\n    return \"\"\n  }\n  return String(props.value)\n})\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</script>\n\n<template>\n  <div\n    class=\"gxp-html-display\"\n    :class=\"rootClass\"\n    data-testid=\"html-display\"\n    v-html=\"content\"\n  />\n</template>\n"],"names":["props","__props","content","computed","rootClass","cl","_createElementBlock","_normalizeClass"],"mappings":";;;;;;;;AAgBA,UAAMA,IAAQC,GAERC,IAAUC,EAAiB,MAC3BH,EAAM,UAAU,UAAaA,EAAM,UAAU,OACxC,KAEF,OAAOA,EAAM,KAAK,CAC1B,GAEKI,IAAYD,EAAiB,MAAM;AACvC,YAAME,IAAKL,EAAM;AACjB,aAAKK,IAGE,MAAM,QAAQA,CAAE,IAAIA,EAAG,KAAK,GAAG,IAAIA,IAFjC;AAAA,IAGX,CAAC;2BAICC,EAKE,OAAA;AAAA,MAJA,OAAKC,EAAA,CAAC,oBACEH,EAAA,KAAS,CAAA;AAAA,MACjB,eAAY;AAAA,MACZ,WAAQF,EAAA;AAAA,IAAA;;;"}

package/dist/components/compositions/elements/display/HtmlDisplay.vue2.js

@@ -1,23 +1,5 @@
-import { defineComponent as a, computed as n, openBlock as o, createElementBlock as i, normalizeClass as c } from "vue";
-const u = ["innerHTML"], d = /* @__PURE__ */ a({
-  __name: "HtmlDisplay",
-  props: {
-    value: {},
-    classList: {}
-  },
-  setup(s) {
-    const e = s, l = n(() => e.value === void 0 || e.value === null ? "" : String(e.value)), r = n(() => {
-      const t = e.classList;
-      return t ? Array.isArray(t) ? t.join(" ") : t : "";
-    });
-    return (t, p) => (o(), i("div", {
-      class: c(["gxp-html-display", r.value]),
-      "data-testid": "html-display",
-      innerHTML: l.value
-    }, null, 10, u));
-  }
-});
+import f from "./HtmlDisplay.vue.js";
 export {
-  d as default
+  f as default
 };
 //# sourceMappingURL=HtmlDisplay.vue2.js.map

package/dist/components/compositions/elements/display/HtmlDisplay.vue2.js.map

@@ -1 +1 @@
-{"version":3,"file":"HtmlDisplay.vue2.js","sources":["../../../../../src/components/compositions/elements/display/HtmlDisplay.vue"],"sourcesContent":["<script setup lang=\"ts\">\n/**\n * Props-driven raw HTML display.\n *\n * SECURITY: the caller is responsible for trusting the source of\n * `value`. The wrapping `<div>` provides a styling boundary but does\n * not sanitise the markup. Pair with a server-side sanitiser when\n * accepting user input.\n */\nimport { computed } from \"vue\"\n\nexport interface HtmlDisplayProps {\n  value?: string | number | null\n  classList?: string[] | string\n}\n\nconst props = defineProps<HtmlDisplayProps>()\n\nconst content = computed<string>(() => {\n  if (props.value === undefined || props.value === null) {\n    return \"\"\n  }\n  return String(props.value)\n})\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</script>\n\n<template>\n  <div\n    class=\"gxp-html-display\"\n    :class=\"rootClass\"\n    data-testid=\"html-display\"\n    v-html=\"content\"\n  />\n</template>\n"],"names":["props","__props","content","computed","rootClass","cl","_createElementBlock","_normalizeClass"],"mappings":";;;;;;;;AAgBA,UAAMA,IAAQC,GAERC,IAAUC,EAAiB,MAC3BH,EAAM,UAAU,UAAaA,EAAM,UAAU,OACxC,KAEF,OAAOA,EAAM,KAAK,CAC1B,GAEKI,IAAYD,EAAiB,MAAM;AACvC,YAAME,IAAKL,EAAM;AACjB,aAAKK,IAGE,MAAM,QAAQA,CAAE,IAAIA,EAAG,KAAK,GAAG,IAAIA,IAFjC;AAAA,IAGX,CAAC;2BAICC,EAKE,OAAA;AAAA,MAJA,OAAKC,EAAA,CAAC,oBACEH,EAAA,KAAS,CAAA;AAAA,MACjB,eAAY;AAAA,MACZ,WAAQF,EAAA;AAAA,IAAA;;;"}
+{"version":3,"file":"HtmlDisplay.vue2.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}

package/dist/components/compositions/elements/display/IconDisplay.vue.d.ts

@@ -0,0 +1,10 @@
+export interface IconDisplayProps {
+    iconName?: string;
+    size?: number;
+    classList?: string[] | string;
+}
+declare const _default: import('vue').DefineComponent<IconDisplayProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<IconDisplayProps> & Readonly<{}>, {
+    size: number;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLSpanElement>;
+export default _default;
+//# sourceMappingURL=IconDisplay.vue.d.ts.map

package/dist/components/compositions/elements/display/IconDisplay.vue.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"IconDisplay.vue.d.ts","sourceRoot":"","sources":["../../../../../src/components/compositions/elements/display/IconDisplay.vue"],"names":[],"mappings":"AAsGA,MAAM,WAAW,gBAAgB;IAC/B,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,SAAS,CAAC,EAAE,MAAM,EAAE,GAAG,MAAM,CAAA;CAC9B;;UAFQ,MAAM;;AAqIf,wBAQG"}

package/dist/components/compositions/elements/display/IconDisplay.vue.js

@@ -1,5 +1,58 @@
-import f from "./IconDisplay.vue2.js";
+import { defineComponent as y, computed as s, ref as v, watch as _, openBlock as r, createElementBlock as C, normalizeClass as h, createBlock as c, resolveDynamicComponent as k, normalizeStyle as u, unref as x, createCommentVNode as z } from "vue";
+import { X as N } from "lucide-vue-next";
+const g = ["data-icon-name"], w = /* @__PURE__ */ y({
+  __name: "IconDisplay",
+  props: {
+    iconName: {},
+    size: { default: 20 },
+    classList: {}
+  },
+  setup(m) {
+    const t = m;
+    function d(e) {
+      return e.replace(/[-_\s]+(.)?/g, (o, l) => l ? l.toUpperCase() : "").replace(/^(.)/, (o) => o.toUpperCase());
+    }
+    const a = s(() => t.iconName ? d(t.iconName) : ""), p = s(() => {
+      const e = t.classList;
+      return e ? Array.isArray(e) ? e.join(" ") : e : "";
+    }), i = s(() => ({
+      width: `${t.size}px`,
+      height: `${t.size}px`
+    })), n = v(null);
+    async function f(e) {
+      if (!e) {
+        n.value = null;
+        return;
+      }
+      const l = await import("lucide-vue-next");
+      n.value = l[e] ?? null;
+    }
+    return _(
+      a,
+      (e) => {
+        f(e);
+      },
+      { immediate: !0 }
+    ), (e, o) => (r(), C("span", {
+      class: h(["inline-flex items-center", p.value]),
+      "data-icon-name": a.value,
+      "data-testid": "icon-display"
+    }, [
+      n.value ? (r(), c(k(n.value), {
+        key: 0,
+        style: u(i.value),
+        "aria-label": a.value
+      }, null, 8, ["style", "aria-label"])) : a.value ? z("", !0) : (r(), c(x(N), {
+        key: 1,
+        style: u(i.value),
+        class: "text-muted-foreground",
+        "aria-hidden": "true",
+        "data-testid": "icon-display-fallback"
+      }, null, 8, ["style"]))
+    ], 10, g));
+  }
+});
 export {
-  f as default
+  w as default
 };
 //# sourceMappingURL=IconDisplay.vue.js.map

package/dist/components/compositions/elements/display/IconDisplay.vue.js.map

@@ -1 +1 @@
-{"version":3,"file":"IconDisplay.vue.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}
+{"version":3,"file":"IconDisplay.vue.js","sources":["../../../../../src/components/compositions/elements/display/IconDisplay.vue"],"sourcesContent":["<script setup lang=\"ts\">\n/**\n * Props-driven icon display.\n *\n * Dynamically resolves a lucide icon by its PascalCase name (kebab-case\n * is normalised). The library is lazy-imported so we only pay for it\n * when an icon actually renders.\n */\nimport { computed, ref, watch, type Component } from \"vue\"\nimport { X } from \"lucide-vue-next\"\n\nexport interface IconDisplayProps {\n  iconName?: string\n  size?: number\n  classList?: string[] | string\n}\n\nconst props = withDefaults(defineProps<IconDisplayProps>(), {\n  size: 20,\n})\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\nconst resolvedIconName = computed<string>(() => {\n  if (!props.iconName) {\n    return \"\"\n  }\n  return toPascalCase(props.iconName)\n})\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\nconst sizeStyle = computed<Record<string, string>>(() => ({\n  width: `${props.size}px`,\n  height: `${props.size}px`,\n}))\n\nconst ResolvedIcon = ref<Component | null>(null)\n\nasync function loadIcon(name: string): Promise<void> {\n  if (!name) {\n    ResolvedIcon.value = null\n    return\n  }\n  const mod = await import(\"lucide-vue-next\")\n  const registry = mod as unknown as Record<string, Component | undefined>\n  ResolvedIcon.value = registry[name] ?? null\n}\n\nwatch(\n  resolvedIconName,\n  (next) => {\n    void loadIcon(next)\n  },\n  { immediate: true },\n)\n</script>\n\n<template>\n  <span\n    class=\"inline-flex items-center\"\n    :class=\"rootClass\"\n    :data-icon-name=\"resolvedIconName\"\n    data-testid=\"icon-display\"\n  >\n    <component\n      :is=\"ResolvedIcon\"\n      v-if=\"ResolvedIcon\"\n      :style=\"sizeStyle\"\n      :aria-label=\"resolvedIconName\"\n    />\n    <X\n      v-else-if=\"!resolvedIconName\"\n      :style=\"sizeStyle\"\n      class=\"text-muted-foreground\"\n      aria-hidden=\"true\"\n      data-testid=\"icon-display-fallback\"\n    />\n  </span>\n</template>\n"],"names":["props","__props","toPascalCase","input","_","ch","m","resolvedIconName","computed","rootClass","cl","sizeStyle","ResolvedIcon","ref","loadIcon","name","registry","watch","next","_createElementBlock","_normalizeClass","_openBlock","_createBlock","_resolveDynamicComponent","_unref","X"],"mappings":";;;;;;;;;;AAiBA,UAAMA,IAAQC;AAId,aAASC,EAAaC,GAAuB;AAC3C,aAAOA,EACJ,QAAQ,gBAAgB,CAACC,GAAGC,MAAiBA,IAAKA,EAAG,YAAA,IAAgB,EAAG,EACxE,QAAQ,QAAQ,CAACC,MAAMA,EAAE,aAAa;AAAA,IAC3C;AAEA,UAAMC,IAAmBC,EAAiB,MACnCR,EAAM,WAGJE,EAAaF,EAAM,QAAQ,IAFzB,EAGV,GAEKS,IAAYD,EAAiB,MAAM;AACvC,YAAME,IAAKV,EAAM;AACjB,aAAKU,IAGE,MAAM,QAAQA,CAAE,IAAIA,EAAG,KAAK,GAAG,IAAIA,IAFjC;AAAA,IAGX,CAAC,GAEKC,IAAYH,EAAiC,OAAO;AAAA,MACxD,OAAO,GAAGR,EAAM,IAAI;AAAA,MACpB,QAAQ,GAAGA,EAAM,IAAI;AAAA,IAAA,EACrB,GAEIY,IAAeC,EAAsB,IAAI;AAE/C,mBAAeC,EAASC,GAA6B;AACnD,UAAI,CAACA,GAAM;AACT,QAAAH,EAAa,QAAQ;AACrB;AAAA,MACF;AAEA,YAAMI,IADM,MAAM,OAAO,iBAAiB;AAE1C,MAAAJ,EAAa,QAAQI,EAASD,CAAI,KAAK;AAAA,IACzC;AAEA,WAAAE;AAAA,MACEV;AAAA,MACA,CAACW,MAAS;AACR,QAAKJ,EAASI,CAAI;AAAA,MACpB;AAAA,MACA,EAAE,WAAW,GAAA;AAAA,IAAK,mBAKlBC,EAmBO,QAAA;AAAA,MAlBL,OAAKC,EAAA,CAAC,4BACEX,EAAA,KAAS,CAAA;AAAA,MAChB,kBAAgBF,EAAA;AAAA,MACjB,eAAY;AAAA,IAAA;MAIJK,EAAA,SAFRS,EAAA,GAAAC,EAKEC,EAJKX,EAAA,KAAY,GAAA;AAAA;QAEhB,SAAOD,EAAA,KAAS;AAAA,QAChB,cAAYJ,EAAA;AAAA,MAAA,wCAGDA,EAAA,0BADde,EAMEE,EAAAC,CAAA,GAAA;AAAA;QAJC,SAAOd,EAAA,KAAS;AAAA,QACjB,OAAM;AAAA,QACN,eAAY;AAAA,QACZ,eAAY;AAAA,MAAA;;;;"}

package/dist/components/compositions/elements/display/IconDisplay.vue2.js

@@ -1,58 +1,5 @@
-import { defineComponent as y, computed as s, ref as v, watch as _, openBlock as r, createElementBlock as C, normalizeClass as h, createBlock as c, resolveDynamicComponent as k, normalizeStyle as u, unref as x, createCommentVNode as z } from "vue";
-import { X as N } from "lucide-vue-next";
-const g = ["data-icon-name"], w = /* @__PURE__ */ y({
-  __name: "IconDisplay",
-  props: {
-    iconName: {},
-    size: { default: 20 },
-    classList: {}
-  },
-  setup(m) {
-    const t = m;
-    function d(e) {
-      return e.replace(/[-_\s]+(.)?/g, (o, l) => l ? l.toUpperCase() : "").replace(/^(.)/, (o) => o.toUpperCase());
-    }
-    const a = s(() => t.iconName ? d(t.iconName) : ""), p = s(() => {
-      const e = t.classList;
-      return e ? Array.isArray(e) ? e.join(" ") : e : "";
-    }), i = s(() => ({
-      width: `${t.size}px`,
-      height: `${t.size}px`
-    })), n = v(null);
-    async function f(e) {
-      if (!e) {
-        n.value = null;
-        return;
-      }
-      const l = await import("lucide-vue-next");
-      n.value = l[e] ?? null;
-    }
-    return _(
-      a,
-      (e) => {
-        f(e);
-      },
-      { immediate: !0 }
-    ), (e, o) => (r(), C("span", {
-      class: h(["inline-flex items-center", p.value]),
-      "data-icon-name": a.value,
-      "data-testid": "icon-display"
-    }, [
-      n.value ? (r(), c(k(n.value), {
-        key: 0,
-        style: u(i.value),
-        "aria-label": a.value
-      }, null, 8, ["style", "aria-label"])) : a.value ? z("", !0) : (r(), c(x(N), {
-        key: 1,
-        style: u(i.value),
-        class: "text-muted-foreground",
-        "aria-hidden": "true",
-        "data-testid": "icon-display-fallback"
-      }, null, 8, ["style"]))
-    ], 10, g));
-  }
-});
+import f from "./IconDisplay.vue.js";
 export {
-  w as default
+  f as default
 };
 //# sourceMappingURL=IconDisplay.vue2.js.map

package/dist/components/compositions/elements/display/IconDisplay.vue2.js.map

@@ -1 +1 @@
-{"version":3,"file":"IconDisplay.vue2.js","sources":["../../../../../src/components/compositions/elements/display/IconDisplay.vue"],"sourcesContent":["<script setup lang=\"ts\">\n/**\n * Props-driven icon display.\n *\n * Dynamically resolves a lucide icon by its PascalCase name (kebab-case\n * is normalised). The library is lazy-imported so we only pay for it\n * when an icon actually renders.\n */\nimport { computed, ref, watch, type Component } from \"vue\"\nimport { X } from \"lucide-vue-next\"\n\nexport interface IconDisplayProps {\n  iconName?: string\n  size?: number\n  classList?: string[] | string\n}\n\nconst props = withDefaults(defineProps<IconDisplayProps>(), {\n  size: 20,\n})\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\nconst resolvedIconName = computed<string>(() => {\n  if (!props.iconName) {\n    return \"\"\n  }\n  return toPascalCase(props.iconName)\n})\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\nconst sizeStyle = computed<Record<string, string>>(() => ({\n  width: `${props.size}px`,\n  height: `${props.size}px`,\n}))\n\nconst ResolvedIcon = ref<Component | null>(null)\n\nasync function loadIcon(name: string): Promise<void> {\n  if (!name) {\n    ResolvedIcon.value = null\n    return\n  }\n  const mod = await import(\"lucide-vue-next\")\n  const registry = mod as unknown as Record<string, Component | undefined>\n  ResolvedIcon.value = registry[name] ?? null\n}\n\nwatch(\n  resolvedIconName,\n  (next) => {\n    void loadIcon(next)\n  },\n  { immediate: true },\n)\n</script>\n\n<template>\n  <span\n    class=\"inline-flex items-center\"\n    :class=\"rootClass\"\n    :data-icon-name=\"resolvedIconName\"\n    data-testid=\"icon-display\"\n  >\n    <component\n      :is=\"ResolvedIcon\"\n      v-if=\"ResolvedIcon\"\n      :style=\"sizeStyle\"\n      :aria-label=\"resolvedIconName\"\n    />\n    <X\n      v-else-if=\"!resolvedIconName\"\n      :style=\"sizeStyle\"\n      class=\"text-muted-foreground\"\n      aria-hidden=\"true\"\n      data-testid=\"icon-display-fallback\"\n    />\n  </span>\n</template>\n"],"names":["props","__props","toPascalCase","input","_","ch","m","resolvedIconName","computed","rootClass","cl","sizeStyle","ResolvedIcon","ref","loadIcon","name","registry","watch","next","_createElementBlock","_normalizeClass","_openBlock","_createBlock","_resolveDynamicComponent","_unref","X"],"mappings":";;;;;;;;;;AAiBA,UAAMA,IAAQC;AAId,aAASC,EAAaC,GAAuB;AAC3C,aAAOA,EACJ,QAAQ,gBAAgB,CAACC,GAAGC,MAAiBA,IAAKA,EAAG,YAAA,IAAgB,EAAG,EACxE,QAAQ,QAAQ,CAACC,MAAMA,EAAE,aAAa;AAAA,IAC3C;AAEA,UAAMC,IAAmBC,EAAiB,MACnCR,EAAM,WAGJE,EAAaF,EAAM,QAAQ,IAFzB,EAGV,GAEKS,IAAYD,EAAiB,MAAM;AACvC,YAAME,IAAKV,EAAM;AACjB,aAAKU,IAGE,MAAM,QAAQA,CAAE,IAAIA,EAAG,KAAK,GAAG,IAAIA,IAFjC;AAAA,IAGX,CAAC,GAEKC,IAAYH,EAAiC,OAAO;AAAA,MACxD,OAAO,GAAGR,EAAM,IAAI;AAAA,MACpB,QAAQ,GAAGA,EAAM,IAAI;AAAA,IAAA,EACrB,GAEIY,IAAeC,EAAsB,IAAI;AAE/C,mBAAeC,EAASC,GAA6B;AACnD,UAAI,CAACA,GAAM;AACT,QAAAH,EAAa,QAAQ;AACrB;AAAA,MACF;AAEA,YAAMI,IADM,MAAM,OAAO,iBAAiB;AAE1C,MAAAJ,EAAa,QAAQI,EAASD,CAAI,KAAK;AAAA,IACzC;AAEA,WAAAE;AAAA,MACEV;AAAA,MACA,CAACW,MAAS;AACR,QAAKJ,EAASI,CAAI;AAAA,MACpB;AAAA,MACA,EAAE,WAAW,GAAA;AAAA,IAAK,mBAKlBC,EAmBO,QAAA;AAAA,MAlBL,OAAKC,EAAA,CAAC,4BACEX,EAAA,KAAS,CAAA;AAAA,MAChB,kBAAgBF,EAAA;AAAA,MACjB,eAAY;AAAA,IAAA;MAIJK,EAAA,SAFRS,EAAA,GAAAC,EAKEC,EAJKX,EAAA,KAAY,GAAA;AAAA;QAEhB,SAAOD,EAAA,KAAS;AAAA,QAChB,cAAYJ,EAAA;AAAA,MAAA,wCAGDA,EAAA,0BADde,EAMEE,EAAAC,CAAA,GAAA;AAAA;QAJC,SAAOd,EAAA,KAAS;AAAA,QACjB,OAAM;AAAA,QACN,eAAY;AAAA,QACZ,eAAY;AAAA,MAAA;;;;"}
+{"version":3,"file":"IconDisplay.vue2.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}