@gxp-dev/mod-ui 2.0.0 → 2.0.1

package/dist/components/compositions/cards/TabListCard.vue.js.map

@@ -1 +1 @@
-{"version":3,"file":"TabListCard.vue.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}
+{"version":3,"file":"TabListCard.vue.js","sources":["../../../../src/components/compositions/cards/TabListCard.vue"],"sourcesContent":["<script setup lang=\"ts\">\n/**\n * Props-driven `tab-list` composition — renders the shadcn-vue Tabs\n * primitive where each panel is a nested DisplayCard rendered via\n * `CardRenderer`. Each tab is a fully-resolved DisplayCard (not an ID\n * lookup).\n *\n * Self-contained — directly mountable in any Vue app:\n *\n *   <TabListCard\n *     v-model=\"activeTab\"\n *     :tabs=\"[generalCard, advancedCard]\"\n *     :item=\"dataModel\"\n *   />\n *\n * The tab label comes from the child card's `title`, falling back to\n * the card's `id`. The first child is the default active tab.\n */\nimport { computed, ref, watch } from \"vue\"\nimport type { DisplayCard } from \"@/definitions/cards\"\nimport type { TabListCardStyle } from \"@/definitions/cards/TabListCard\"\nimport CardRenderer from \"@/engine/CardRenderer.vue\"\nimport {\n  Tabs,\n  TabsContent,\n  TabsList,\n  TabsTrigger,\n} from \"@/components/ui/tabs\"\n\nexport interface TabListCardProps {\n  title?: string\n  subtitle?: string\n  showCard?: boolean\n  /** Resolved tab cards (NOT IDs). */\n  tabs?: DisplayCard[]\n  /** Page-level data model passed through to child renderers. */\n  item?: Record<string, unknown>\n  /** Initial active tab id. Falls back to the first tab. */\n  defaultTab?: string\n  /** Vertical or horizontal nav layout. */\n  style?: TabListCardStyle\n  /** Force the nav bar to render above the panel content. */\n  navOnTop?: boolean\n  /** Hide the nav bar entirely (used when an external nav controls the tabs). */\n  hideNav?: boolean\n}\n\nconst props = withDefaults(defineProps<TabListCardProps>(), {\n  tabs: () => [],\n  item: () => ({}),\n  style: \"default\",\n  navOnTop: false,\n  hideNav: false,\n})\n\nconst activeTab = defineModel<string>(\"modelValue\")\n\nconst tabList = computed<DisplayCard[]>(() => props.tabs ?? [])\n\nconst tabIds = computed<string[]>(() => tabList.value.map((t) => t.id))\n\nfunction labelFor(card: DisplayCard): string {\n  if (card.title) {\n    return card.title\n  }\n  return card.id\n}\n\nconst internalActive = ref<string>(\n  activeTab.value ?? props.defaultTab ?? tabIds.value[0] ?? \"\",\n)\n\nwatch(\n  () => activeTab.value,\n  (next) => {\n    if (next !== undefined && next !== internalActive.value) {\n      internalActive.value = next\n    }\n  },\n)\n\nwatch(\n  () => tabIds.value,\n  (next) => {\n    if (!next.includes(internalActive.value)) {\n      internalActive.value = next[0] ?? \"\"\n      if (activeTab.value !== internalActive.value) {\n        activeTab.value = internalActive.value\n      }\n    }\n  },\n)\n\nfunction onTabChange(value: string | number): void {\n  const id = String(value)\n  internalActive.value = id\n  activeTab.value = id\n}\n\nconst navOnTopComputed = computed<boolean>(\n  () => props.style === \"horizontal\" || props.navOnTop === true,\n)\n\nconst wrapperClass = computed(() => [\n  \"gxp-tab-list\",\n  navOnTopComputed.value ? \"flex flex-col gap-3\" : \"flex flex-row gap-3\",\n])\n</script>\n\n<template>\n  <header v-if=\"title || subtitle\" class=\"mb-3 flex flex-col gap-0.5\">\n    <h3 v-if=\"title\" class=\"text-base font-semibold\">{{ title }}</h3>\n    <p v-if=\"subtitle\" class=\"text-sm text-muted-foreground\">\n      {{ subtitle }}\n    </p>\n  </header>\n  <Tabs\n    v-if=\"tabList.length > 0\"\n    :model-value=\"internalActive\"\n    :default-value=\"defaultTab ?? tabIds[0]\"\n    :class=\"wrapperClass\"\n    :orientation=\"navOnTopComputed ? 'horizontal' : 'vertical'\"\n    @update:model-value=\"onTabChange\"\n  >\n    <TabsList\n      v-if=\"!hideNav\"\n      :class=\"[\n        'inline-flex items-center rounded-md bg-muted p-1',\n        navOnTopComputed ? 'flex-row' : 'flex-col h-auto',\n      ]\"\n    >\n      <TabsTrigger\n        v-for=\"tab in tabList\"\n        :key=\"tab.id\"\n        :value=\"tab.id\"\n        :data-tab-id=\"tab.id\"\n        class=\"rounded-sm px-3 py-1.5 text-sm font-medium data-[state=active]:bg-background data-[state=active]:text-foreground data-[state=active]:shadow-sm\"\n      >\n        {{ labelFor(tab) }}\n      </TabsTrigger>\n    </TabsList>\n    <div class=\"flex-1\">\n      <TabsContent\n        v-for=\"tab in tabList\"\n        :key=\"tab.id\"\n        :value=\"tab.id\"\n        :data-tab-panel-id=\"tab.id\"\n      >\n        <CardRenderer :card=\"tab\" :item=\"item\" />\n      </TabsContent>\n    </div>\n  </Tabs>\n  <p\n    v-else\n    class=\"text-sm text-muted-foreground italic\"\n    data-testid=\"tab-list-empty\"\n  >\n    No tabs to display.\n  </p>\n</template>\n"],"names":["props","__props","activeTab","_useModel","tabList","computed","tabIds","t","labelFor","card","internalActive","ref","watch","next","onTabChange","value","id","navOnTopComputed","wrapperClass","_openBlock","_createElementBlock","_hoisted_1","_hoisted_2","_toDisplayString","_hoisted_3","_createBlock","_unref","Tabs","TabsList","_normalizeClass","_Fragment","_renderList","tab","TabsTrigger","_createTextVNode","_createElementVNode","_hoisted_4","TabsContent","_createVNode","CardRenderer","_hoisted_5"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA+CA,UAAMA,IAAQC,GAQRC,IAAYC,KAAoB,YAAY,GAE5CC,IAAUC,EAAwB,MAAML,EAAM,QAAQ,CAAA,CAAE,GAExDM,IAASD,EAAmB,MAAMD,EAAQ,MAAM,IAAI,CAACG,MAAMA,EAAE,EAAE,CAAC;AAEtE,aAASC,EAASC,GAA2B;AAC3C,aAAIA,EAAK,QACAA,EAAK,QAEPA,EAAK;AAAA,IACd;AAEA,UAAMC,IAAiBC;AAAA,MACrBT,EAAU,SAASF,EAAM,cAAcM,EAAO,MAAM,CAAC,KAAK;AAAA,IAAA;AAG5D,IAAAM;AAAA,MACE,MAAMV,EAAU;AAAA,MAChB,CAACW,MAAS;AACR,QAAIA,MAAS,UAAaA,MAASH,EAAe,UAChDA,EAAe,QAAQG;AAAA,MAE3B;AAAA,IAAA,GAGFD;AAAA,MACE,MAAMN,EAAO;AAAA,MACb,CAACO,MAAS;AACR,QAAKA,EAAK,SAASH,EAAe,KAAK,MACrCA,EAAe,QAAQG,EAAK,CAAC,KAAK,IAC9BX,EAAU,UAAUQ,EAAe,UACrCR,EAAU,QAAQQ,EAAe;AAAA,MAGvC;AAAA,IAAA;AAGF,aAASI,EAAYC,GAA8B;AACjD,YAAMC,IAAK,OAAOD,CAAK;AACvB,MAAAL,EAAe,QAAQM,GACvBd,EAAU,QAAQc;AAAA,IACpB;AAEA,UAAMC,IAAmBZ;AAAA,MACvB,MAAML,EAAM,UAAU,gBAAgBA,EAAM,aAAa;AAAA,IAAA,GAGrDkB,IAAeb,EAAS,MAAM;AAAA,MAClC;AAAA,MACAY,EAAiB,QAAQ,wBAAwB;AAAA,IAAA,CAClD;;MAIehB,EAAA,SAASA,EAAA,YAAvBkB,KAAAC,EAKS,UALTC,GAKS;AAAA,QAJGpB,EAAA,cAAVmB,EAAiE,MAAjEE,GAAiEC,EAAbtB,EAAA,KAAK,GAAA,CAAA;QAChDA,EAAA,iBAATmB,EAEI,KAFJI,GAEID,EADCtB,EAAA,QAAQ,GAAA,CAAA;;MAIPG,EAAA,MAAQ,SAAM,UADtBqB,EAmCOC,EAAAC,CAAA,GAAA;AAAA;QAjCJ,eAAajB,EAAA;AAAA,QACb,iBAAeT,EAAA,cAAcK,EAAA,MAAM,CAAA;AAAA,QACnC,SAAOY,EAAA,KAAY;AAAA,QACnB,aAAaD,EAAA,QAAgB,eAAA;AAAA,QAC7B,uBAAoBH;AAAA,MAAA;mBAErB,MAgBW;AAAA,UAfFb,EAAA,4BADTwB,EAgBWC,EAAAE,CAAA,GAAA;AAAA;YAdR,OAAKC,EAAA;AAAA;cAAwEZ,EAAA,QAAgB,aAAA;AAAA,YAAA;;uBAM5F,MAAsB;AAAA,sBADxBG,EAQcU,GAAA,MAAAC,EAPE3B,EAAA,OAAO,CAAd4B,YADTP,EAQcC,EAAAO,CAAA,GAAA;AAAA,gBANX,KAAKD,EAAI;AAAA,gBACT,OAAOA,EAAI;AAAA,gBACX,eAAaA,EAAI;AAAA,gBAClB,OAAM;AAAA,cAAA;2BAEN,MAAmB;AAAA,kBAAhBE,EAAAX,EAAAf,EAASwB,CAAG,CAAA,GAAA,CAAA;AAAA,gBAAA;;;;;;UAGnBG,EASM,OATNC,GASM;AAAA,oBARJhB,EAOcU,GAAA,MAAAC,EANE3B,EAAA,OAAO,CAAd4B,YADTP,EAOcC,EAAAW,CAAA,GAAA;AAAA,cALX,KAAKL,EAAI;AAAA,cACT,OAAOA,EAAI;AAAA,cACX,qBAAmBA,EAAI;AAAA,YAAA;yBAExB,MAAyC;AAAA,gBAAzCM,EAAyCC,GAAA;AAAA,kBAA1B,MAAMP;AAAA,kBAAM,MAAM/B,EAAA;AAAA,gBAAA;;;;;;;+EAIvCmB,EAMI,KANJoB,GAIC,uBAED;AAAA,IAAA;;;"}

package/dist/components/compositions/cards/TabListCard.vue2.js

@@ -1,127 +1,5 @@
-import { defineComponent as V, useModel as w, computed as n, ref as N, watch as y, openBlock as a, createElementBlock as u, Fragment as x, toDisplayString as h, createCommentVNode as r, createBlock as c, unref as m, normalizeClass as g, withCtx as f, renderList as k, createTextVNode as B, createElementVNode as $, createVNode as z, mergeModels as L } from "vue";
-import M from "../../../engine/CardRenderer.vue.js";
-import "../../ui/tabs/index.js";
-import O from "../../ui/tabs/Tabs.vue.js";
-import E from "../../ui/tabs/TabsList.vue.js";
-import F from "../../ui/tabs/TabsTrigger.vue.js";
-import S from "../../ui/tabs/TabsContent.vue.js";
-const A = {
-  key: 0,
-  class: "mb-3 flex flex-col gap-0.5"
-}, D = {
-  key: 0,
-  class: "text-base font-semibold"
-}, I = {
-  key: 1,
-  class: "text-sm text-muted-foreground"
-}, U = { class: "flex-1" }, j = {
-  key: 2,
-  class: "text-sm text-muted-foreground italic",
-  "data-testid": "tab-list-empty"
-}, R = /* @__PURE__ */ V({
-  __name: "TabListCard",
-  props: /* @__PURE__ */ L({
-    title: {},
-    subtitle: {},
-    showCard: { type: Boolean },
-    tabs: { default: () => [] },
-    item: { default: () => ({}) },
-    defaultTab: {},
-    style: { default: "default" },
-    navOnTop: { type: Boolean, default: !1 },
-    hideNav: { type: Boolean, default: !1 }
-  }, {
-    modelValue: {},
-    modelModifiers: {}
-  }),
-  emits: ["update:modelValue"],
-  setup(t) {
-    const d = t, i = w(t, "modelValue"), s = n(() => d.tabs ?? []), v = n(() => s.value.map((e) => e.id));
-    function T(e) {
-      return e.title ? e.title : e.id;
-    }
-    const o = N(
-      i.value ?? d.defaultTab ?? v.value[0] ?? ""
-    );
-    y(
-      () => i.value,
-      (e) => {
-        e !== void 0 && e !== o.value && (o.value = e);
-      }
-    ), y(
-      () => v.value,
-      (e) => {
-        e.includes(o.value) || (o.value = e[0] ?? "", i.value !== o.value && (i.value = o.value));
-      }
-    );
-    function _(e) {
-      const p = String(e);
-      o.value = p, i.value = p;
-    }
-    const b = n(
-      () => d.style === "horizontal" || d.navOnTop === !0
-    ), C = n(() => [
-      "gxp-tab-list",
-      b.value ? "flex flex-col gap-3" : "flex flex-row gap-3"
-    ]);
-    return (e, p) => (a(), u(x, null, [
-      t.title || t.subtitle ? (a(), u("header", A, [
-        t.title ? (a(), u("h3", D, h(t.title), 1)) : r("", !0),
-        t.subtitle ? (a(), u("p", I, h(t.subtitle), 1)) : r("", !0)
-      ])) : r("", !0),
-      s.value.length > 0 ? (a(), c(m(O), {
-        key: 1,
-        "model-value": o.value,
-        "default-value": t.defaultTab ?? v.value[0],
-        class: g(C.value),
-        orientation: b.value ? "horizontal" : "vertical",
-        "onUpdate:modelValue": _
-      }, {
-        default: f(() => [
-          t.hideNav ? r("", !0) : (a(), c(m(E), {
-            key: 0,
-            class: g([
-              "inline-flex items-center rounded-md bg-muted p-1",
-              b.value ? "flex-row" : "flex-col h-auto"
-            ])
-          }, {
-            default: f(() => [
-              (a(!0), u(x, null, k(s.value, (l) => (a(), c(m(F), {
-                key: l.id,
-                value: l.id,
-                "data-tab-id": l.id,
-                class: "rounded-sm px-3 py-1.5 text-sm font-medium data-[state=active]:bg-background data-[state=active]:text-foreground data-[state=active]:shadow-sm"
-              }, {
-                default: f(() => [
-                  B(h(T(l)), 1)
-                ]),
-                _: 2
-              }, 1032, ["value", "data-tab-id"]))), 128))
-            ]),
-            _: 1
-          }, 8, ["class"])),
-          $("div", U, [
-            (a(!0), u(x, null, k(s.value, (l) => (a(), c(m(S), {
-              key: l.id,
-              value: l.id,
-              "data-tab-panel-id": l.id
-            }, {
-              default: f(() => [
-                z(M, {
-                  card: l,
-                  item: t.item
-                }, null, 8, ["card", "item"])
-              ]),
-              _: 2
-            }, 1032, ["value", "data-tab-panel-id"]))), 128))
-          ])
-        ]),
-        _: 1
-      }, 8, ["model-value", "default-value", "class", "orientation"])) : (a(), u("p", j, " No tabs to display. "))
-    ], 64));
-  }
-});
+import f from "./TabListCard.vue.js";
 export {
-  R as default
+  f as default
 };
 //# sourceMappingURL=TabListCard.vue2.js.map

package/dist/components/compositions/cards/TabListCard.vue2.js.map

@@ -1 +1 @@
-{"version":3,"file":"TabListCard.vue2.js","sources":["../../../../src/components/compositions/cards/TabListCard.vue"],"sourcesContent":["<script setup lang=\"ts\">\n/**\n * Props-driven `tab-list` composition — renders the shadcn-vue Tabs\n * primitive where each panel is a nested DisplayCard rendered via\n * `CardRenderer`. Each tab is a fully-resolved DisplayCard (not an ID\n * lookup).\n *\n * Self-contained — directly mountable in any Vue app:\n *\n *   <TabListCard\n *     v-model=\"activeTab\"\n *     :tabs=\"[generalCard, advancedCard]\"\n *     :item=\"dataModel\"\n *   />\n *\n * The tab label comes from the child card's `title`, falling back to\n * the card's `id`. The first child is the default active tab.\n */\nimport { computed, ref, watch } from \"vue\"\nimport type { DisplayCard } from \"@/definitions/cards\"\nimport type { TabListCardStyle } from \"@/definitions/cards/TabListCard\"\nimport CardRenderer from \"@/engine/CardRenderer.vue\"\nimport {\n  Tabs,\n  TabsContent,\n  TabsList,\n  TabsTrigger,\n} from \"@/components/ui/tabs\"\n\nexport interface TabListCardProps {\n  title?: string\n  subtitle?: string\n  showCard?: boolean\n  /** Resolved tab cards (NOT IDs). */\n  tabs?: DisplayCard[]\n  /** Page-level data model passed through to child renderers. */\n  item?: Record<string, unknown>\n  /** Initial active tab id. Falls back to the first tab. */\n  defaultTab?: string\n  /** Vertical or horizontal nav layout. */\n  style?: TabListCardStyle\n  /** Force the nav bar to render above the panel content. */\n  navOnTop?: boolean\n  /** Hide the nav bar entirely (used when an external nav controls the tabs). */\n  hideNav?: boolean\n}\n\nconst props = withDefaults(defineProps<TabListCardProps>(), {\n  tabs: () => [],\n  item: () => ({}),\n  style: \"default\",\n  navOnTop: false,\n  hideNav: false,\n})\n\nconst activeTab = defineModel<string>(\"modelValue\")\n\nconst tabList = computed<DisplayCard[]>(() => props.tabs ?? [])\n\nconst tabIds = computed<string[]>(() => tabList.value.map((t) => t.id))\n\nfunction labelFor(card: DisplayCard): string {\n  if (card.title) {\n    return card.title\n  }\n  return card.id\n}\n\nconst internalActive = ref<string>(\n  activeTab.value ?? props.defaultTab ?? tabIds.value[0] ?? \"\",\n)\n\nwatch(\n  () => activeTab.value,\n  (next) => {\n    if (next !== undefined && next !== internalActive.value) {\n      internalActive.value = next\n    }\n  },\n)\n\nwatch(\n  () => tabIds.value,\n  (next) => {\n    if (!next.includes(internalActive.value)) {\n      internalActive.value = next[0] ?? \"\"\n      if (activeTab.value !== internalActive.value) {\n        activeTab.value = internalActive.value\n      }\n    }\n  },\n)\n\nfunction onTabChange(value: string | number): void {\n  const id = String(value)\n  internalActive.value = id\n  activeTab.value = id\n}\n\nconst navOnTopComputed = computed<boolean>(\n  () => props.style === \"horizontal\" || props.navOnTop === true,\n)\n\nconst wrapperClass = computed(() => [\n  \"gxp-tab-list\",\n  navOnTopComputed.value ? \"flex flex-col gap-3\" : \"flex flex-row gap-3\",\n])\n</script>\n\n<template>\n  <header v-if=\"title || subtitle\" class=\"mb-3 flex flex-col gap-0.5\">\n    <h3 v-if=\"title\" class=\"text-base font-semibold\">{{ title }}</h3>\n    <p v-if=\"subtitle\" class=\"text-sm text-muted-foreground\">\n      {{ subtitle }}\n    </p>\n  </header>\n  <Tabs\n    v-if=\"tabList.length > 0\"\n    :model-value=\"internalActive\"\n    :default-value=\"defaultTab ?? tabIds[0]\"\n    :class=\"wrapperClass\"\n    :orientation=\"navOnTopComputed ? 'horizontal' : 'vertical'\"\n    @update:model-value=\"onTabChange\"\n  >\n    <TabsList\n      v-if=\"!hideNav\"\n      :class=\"[\n        'inline-flex items-center rounded-md bg-muted p-1',\n        navOnTopComputed ? 'flex-row' : 'flex-col h-auto',\n      ]\"\n    >\n      <TabsTrigger\n        v-for=\"tab in tabList\"\n        :key=\"tab.id\"\n        :value=\"tab.id\"\n        :data-tab-id=\"tab.id\"\n        class=\"rounded-sm px-3 py-1.5 text-sm font-medium data-[state=active]:bg-background data-[state=active]:text-foreground data-[state=active]:shadow-sm\"\n      >\n        {{ labelFor(tab) }}\n      </TabsTrigger>\n    </TabsList>\n    <div class=\"flex-1\">\n      <TabsContent\n        v-for=\"tab in tabList\"\n        :key=\"tab.id\"\n        :value=\"tab.id\"\n        :data-tab-panel-id=\"tab.id\"\n      >\n        <CardRenderer :card=\"tab\" :item=\"item\" />\n      </TabsContent>\n    </div>\n  </Tabs>\n  <p\n    v-else\n    class=\"text-sm text-muted-foreground italic\"\n    data-testid=\"tab-list-empty\"\n  >\n    No tabs to display.\n  </p>\n</template>\n"],"names":["props","__props","activeTab","_useModel","tabList","computed","tabIds","t","labelFor","card","internalActive","ref","watch","next","onTabChange","value","id","navOnTopComputed","wrapperClass","_openBlock","_createElementBlock","_hoisted_1","_hoisted_2","_toDisplayString","_hoisted_3","_createBlock","_unref","Tabs","TabsList","_normalizeClass","_Fragment","_renderList","tab","TabsTrigger","_createTextVNode","_createElementVNode","_hoisted_4","TabsContent","_createVNode","CardRenderer","_hoisted_5"],"mappings":"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"}
+{"version":3,"file":"TabListCard.vue2.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}

package/dist/components/compositions/elements/action/ButtonAction.vue.d.ts

@@ -0,0 +1,42 @@
+export type ButtonActionVariant = "default" | "secondary" | "destructive" | "outline" | "ghost" | "link" | "success" | "warning" | "info";
+export type ButtonActionSize = "sm" | "md" | "lg";
+export interface ButtonActionProps {
+    label?: string;
+    variant?: ButtonActionVariant;
+    size?: ButtonActionSize;
+    /** Lucide icon name rendered before the label. */
+    icon?: string;
+    /** Navigation target — renders as an anchor when set and confirm is false. */
+    href?: string;
+    target?: "_self" | "_blank" | "_parent" | "_top";
+    /** Custom event name emitted via `action` when clicked. */
+    emit?: string;
+    /** Show a confirmation dialog before firing. */
+    confirm?: boolean;
+    /** Confirmation message displayed in the dialog. */
+    confirmMessage?: string;
+    disabled?: boolean;
+    /** Render full width. */
+    block?: boolean;
+    /** HTML name attribute. */
+    name?: string;
+    /** HTML id attribute. */
+    id?: string;
+}
+declare const _default: import('vue').DefineComponent<ButtonActionProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {} & {
+    action: (payload: {
+        name: string;
+    }) => any;
+    click: (event: MouseEvent) => any;
+}, string, import('vue').PublicProps, Readonly<ButtonActionProps> & Readonly<{
+    onAction?: ((payload: {
+        name: string;
+    }) => any) | undefined;
+    onClick?: ((event: MouseEvent) => any) | undefined;
+}>, {
+    variant: ButtonActionVariant;
+    size: ButtonActionSize;
+    target: "_self" | "_blank" | "_parent" | "_top";
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+export default _default;
+//# sourceMappingURL=ButtonAction.vue.d.ts.map

package/dist/components/compositions/elements/action/ButtonAction.vue.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ButtonAction.vue.d.ts","sourceRoot":"","sources":["../../../../../src/components/compositions/elements/action/ButtonAction.vue"],"names":[],"mappings":"AAyNA,MAAM,MAAM,mBAAmB,GAC3B,SAAS,GACT,WAAW,GACX,aAAa,GACb,SAAS,GACT,OAAO,GACP,MAAM,GACN,SAAS,GACT,SAAS,GACT,MAAM,CAAA;AAEV,MAAM,MAAM,gBAAgB,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAA;AAEjD,MAAM,WAAW,iBAAiB;IAChC,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,OAAO,CAAC,EAAE,mBAAmB,CAAA;IAC7B,IAAI,CAAC,EAAE,gBAAgB,CAAA;IACvB,kDAAkD;IAClD,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,8EAA8E;IAC9E,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,MAAM,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,SAAS,GAAG,MAAM,CAAA;IAChD,2DAA2D;IAC3D,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,gDAAgD;IAChD,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,oDAAoD;IACpD,cAAc,CAAC,EAAE,MAAM,CAAA;IACvB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,yBAAyB;IACzB,KAAK,CAAC,EAAE,OAAO,CAAA;IACf,2BAA2B;IAC3B,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,yBAAyB;IACzB,EAAE,CAAC,EAAE,MAAM,CAAA;CACZ;;;cAWgC,MAAM;;;;;cAAN,MAAM;;;;aA/B3B,mBAAmB;UACtB,gBAAgB;YAKd,OAAO,GAAG,QAAQ,GAAG,SAAS,GAAG,MAAM;;AAiTlD,wBAQG"}

package/dist/components/compositions/elements/action/ButtonAction.vue.js

@@ -1,5 +1,160 @@
-import f from "./ButtonAction.vue2.js";
+import { defineComponent as N, computed as d, ref as M, openBlock as m, createElementBlock as g, Fragment as V, createVNode as l, unref as i, normalizeClass as _, withCtx as o, createBlock as C, resolveDynamicComponent as I, createCommentVNode as p, toDisplayString as w, createTextVNode as u } from "vue";
+import * as L from "lucide-vue-next";
+import "../../../ui/button/index.js";
+import S from "../../../ui/dialog/Dialog.vue.js";
+import "reka-ui";
+import U from "../../../ui/dialog/DialogContent.vue.js";
+import j from "../../../ui/dialog/DialogDescription.vue.js";
+import E from "../../../ui/dialog/DialogFooter.vue.js";
+import F from "../../../ui/dialog/DialogHeader.vue.js";
+import "@vueuse/core";
+import "clsx";
+import "tailwind-merge";
+import O from "../../../ui/dialog/DialogTitle.vue.js";
+import v from "../../../ui/button/Button.vue.js";
+const T = { key: 1 }, te = /* @__PURE__ */ N({
+  __name: "ButtonAction",
+  props: {
+    label: {},
+    variant: { default: "default" },
+    size: { default: "md" },
+    icon: {},
+    href: {},
+    target: { default: "_self" },
+    emit: {},
+    confirm: { type: Boolean },
+    confirmMessage: {},
+    disabled: { type: Boolean },
+    block: { type: Boolean },
+    name: {},
+    id: {}
+  },
+  emits: ["click", "action"],
+  setup(t, { emit: B }) {
+    const e = t, c = B, h = {
+      sm: "sm",
+      md: "default",
+      lg: "lg"
+    }, z = d(
+      () => h[e.size] ?? "default"
+    ), b = L;
+    function $(a) {
+      if (!a)
+        return;
+      const n = a.split(/[-_\s]/).filter(Boolean).map((f) => f.charAt(0).toUpperCase() + f.slice(1)).join("");
+      return b[n] ?? b[a];
+    }
+    const k = d(() => $(e.icon)), r = M(!1);
+    function y() {
+      if (e.href) {
+        e.target === "_blank" ? window.open(e.href, "_blank") : window.location.assign(e.href);
+        return;
+      }
+      e.emit && c("action", { name: e.emit });
+    }
+    function A(a) {
+      if (c("click", a), e.confirm) {
+        a.preventDefault(), r.value = !0;
+        return;
+      }
+      if (!e.href && e.emit) {
+        a.preventDefault(), y();
+        return;
+      }
+      !e.href && !e.emit && a.preventDefault();
+    }
+    function D() {
+      r.value = !1, y();
+    }
+    function x() {
+      r.value = !1;
+    }
+    const s = d(
+      () => e.href && !e.confirm ? "a" : "button"
+    );
+    return (a, n) => (m(), g(V, null, [
+      l(i(v), {
+        id: t.id,
+        as: s.value,
+        variant: t.variant,
+        size: z.value,
+        disabled: t.disabled,
+        class: _(t.block ? "w-full" : ""),
+        "data-action-name": c ?? t.label,
+        "data-element-name": t.name ?? void 0,
+        href: s.value === "a" ? t.href : void 0,
+        target: s.value === "a" ? t.target : void 0,
+        onClick: A
+      }, {
+        default: o(() => [
+          k.value ? (m(), C(I(k.value), {
+            key: 0,
+            class: "h-4 w-4"
+          })) : p("", !0),
+          t.label ? (m(), g("span", T, w(t.label), 1)) : p("", !0)
+        ]),
+        _: 1
+      }, 8, ["id", "as", "variant", "size", "disabled", "class", "data-action-name", "data-element-name", "href", "target"]),
+      t.confirm ? (m(), C(i(S), {
+        key: 0,
+        open: r.value,
+        "onUpdate:open": n[0] || (n[0] = (f) => r.value = f)
+      }, {
+        default: o(() => [
+          l(i(U), null, {
+            default: o(() => [
+              l(i(F), null, {
+                default: o(() => [
+                  l(i(O), null, {
+                    default: o(() => [...n[1] || (n[1] = [
+                      u("Confirm action", -1)
+                    ])]),
+                    _: 1
+                  }),
+                  l(i(j), null, {
+                    default: o(() => [
+                      u(w(t.confirmMessage ?? "Are you sure you want to continue?"), 1)
+                    ]),
+                    _: 1
+                  })
+                ]),
+                _: 1
+              }),
+              l(i(E), null, {
+                default: o(() => [
+                  l(i(v), {
+                    variant: "outline",
+                    type: "button",
+                    onClick: x
+                  }, {
+                    default: o(() => [...n[2] || (n[2] = [
+                      u(" Cancel ", -1)
+                    ])]),
+                    _: 1
+                  }),
+                  l(i(v), {
+                    variant: "default",
+                    type: "button",
+                    onClick: D
+                  }, {
+                    default: o(() => [...n[3] || (n[3] = [
+                      u(" Confirm ", -1)
+                    ])]),
+                    _: 1
+                  })
+                ]),
+                _: 1
+              })
+            ]),
+            _: 1
+          })
+        ]),
+        _: 1
+      }, 8, ["open"])) : p("", !0)
+    ], 64));
+  }
+});
 export {
-  f as default
+  te as default
 };
 //# sourceMappingURL=ButtonAction.vue.js.map

package/dist/components/compositions/elements/action/ButtonAction.vue.js.map

@@ -1 +1 @@
-{"version":3,"file":"ButtonAction.vue.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}
+{"version":3,"file":"ButtonAction.vue.js","sources":["../../../../../src/components/compositions/elements/action/ButtonAction.vue"],"sourcesContent":["<script setup lang=\"ts\">\n/**\n * Props-driven button composition. Composes the shadcn `Button`\n * primitive with click / href / emit / confirm behaviour.\n *\n * Self-contained — usable directly in any Vue app:\n *\n *   <ButtonAction label=\"Save\" variant=\"default\" @click=\"save\" />\n *   <ButtonAction label=\"Docs\" href=\"https://example.com\" target=\"_blank\" />\n *   <ButtonAction label=\"Delete\" variant=\"destructive\" confirm @action=\"onDelete\" />\n *\n * Action elements do NOT use FieldFrame — they're not form inputs and\n * don't need label/help/error chrome.\n */\nimport { computed, ref } from \"vue\"\nimport * as LucideIcons from \"lucide-vue-next\"\nimport type { FunctionalComponent } from \"vue\"\n\ntype LucideIcon = FunctionalComponent\n\nimport { Button, type ButtonVariants } from \"@/components/ui/button\"\nimport {\n  Dialog,\n  DialogContent,\n  DialogDescription,\n  DialogFooter,\n  DialogHeader,\n  DialogTitle,\n} from \"@/components/ui/dialog\"\n\nexport type ButtonActionVariant =\n  | \"default\"\n  | \"secondary\"\n  | \"destructive\"\n  | \"outline\"\n  | \"ghost\"\n  | \"link\"\n  | \"success\"\n  | \"warning\"\n  | \"info\"\n\nexport type ButtonActionSize = \"sm\" | \"md\" | \"lg\"\n\nexport interface ButtonActionProps {\n  label?: string\n  variant?: ButtonActionVariant\n  size?: ButtonActionSize\n  /** Lucide icon name rendered before the label. */\n  icon?: string\n  /** Navigation target — renders as an anchor when set and confirm is false. */\n  href?: string\n  target?: \"_self\" | \"_blank\" | \"_parent\" | \"_top\"\n  /** Custom event name emitted via `action` when clicked. */\n  emit?: string\n  /** Show a confirmation dialog before firing. */\n  confirm?: boolean\n  /** Confirmation message displayed in the dialog. */\n  confirmMessage?: string\n  disabled?: boolean\n  /** Render full width. */\n  block?: boolean\n  /** HTML name attribute. */\n  name?: string\n  /** HTML id attribute. */\n  id?: string\n}\n\nconst props = withDefaults(defineProps<ButtonActionProps>(), {\n  variant: \"default\",\n  size: \"md\",\n  target: \"_self\",\n})\n\nconst emit = defineEmits<{\n  (e: \"click\", event: MouseEvent): void\n  (e: \"action\", payload: { name: string }): void\n}>()\n\nconst sizeMap: Record<ButtonActionSize, ButtonVariants[\"size\"]> = {\n  sm: \"sm\",\n  md: \"default\",\n  lg: \"lg\",\n}\n\nconst mappedSize = computed<ButtonVariants[\"size\"]>(\n  () => sizeMap[props.size] ?? \"default\",\n)\n\nconst iconLibrary = LucideIcons as unknown as Record<string, LucideIcon>\nfunction resolveIcon(name: string | undefined): LucideIcon | undefined {\n  if (!name) {\n    return undefined\n  }\n  const pascal = name\n    .split(/[-_\\s]/)\n    .filter(Boolean)\n    .map((s) => s.charAt(0).toUpperCase() + s.slice(1))\n    .join(\"\")\n  return iconLibrary[pascal] ?? iconLibrary[name]\n}\nconst icon = computed(() => resolveIcon(props.icon))\n\nconst confirmOpen = ref(false)\n\nfunction performAction(): void {\n  if (props.href) {\n    if (props.target === \"_blank\") {\n      window.open(props.href, \"_blank\")\n    } else {\n      window.location.assign(props.href)\n    }\n    return\n  }\n  if (props.emit) {\n    emit(\"action\", { name: props.emit })\n  }\n}\n\nfunction onClick(event: MouseEvent): void {\n  emit(\"click\", event)\n  if (props.confirm) {\n    event.preventDefault()\n    confirmOpen.value = true\n    return\n  }\n  if (!props.href && props.emit) {\n    event.preventDefault()\n    performAction()\n    return\n  }\n  if (!props.href && !props.emit) {\n    event.preventDefault()\n  }\n}\n\nfunction confirmYes(): void {\n  confirmOpen.value = false\n  performAction()\n}\n\nfunction confirmNo(): void {\n  confirmOpen.value = false\n}\n\nconst renderAs = computed<\"a\" | \"button\">(() =>\n  props.href && !props.confirm ? \"a\" : \"button\",\n)\n</script>\n\n<template>\n  <Button\n    :id=\"id\"\n    :as=\"renderAs\"\n    :variant=\"variant\"\n    :size=\"mappedSize\"\n    :disabled=\"disabled\"\n    :class=\"block ? 'w-full' : ''\"\n    :data-action-name=\"emit ?? label\"\n    :data-element-name=\"name ?? undefined\"\n    :href=\"renderAs === 'a' ? href : undefined\"\n    :target=\"renderAs === 'a' ? target : undefined\"\n    @click=\"onClick\"\n  >\n    <component :is=\"icon\" v-if=\"icon\" class=\"h-4 w-4\" />\n    <span v-if=\"label\">{{ label }}</span>\n  </Button>\n\n  <Dialog v-if=\"confirm\" v-model:open=\"confirmOpen\">\n    <DialogContent>\n      <DialogHeader>\n        <DialogTitle>Confirm action</DialogTitle>\n        <DialogDescription>\n          {{ confirmMessage ?? \"Are you sure you want to continue?\" }}\n        </DialogDescription>\n      </DialogHeader>\n      <DialogFooter>\n        <Button variant=\"outline\" type=\"button\" @click=\"confirmNo\">\n          Cancel\n        </Button>\n        <Button variant=\"default\" type=\"button\" @click=\"confirmYes\">\n          Confirm\n        </Button>\n      </DialogFooter>\n    </DialogContent>\n  </Dialog>\n</template>\n"],"names":["props","__props","emit","__emit","sizeMap","mappedSize","computed","iconLibrary","LucideIcons","resolveIcon","name","pascal","s","icon","confirmOpen","ref","performAction","onClick","event","confirmYes","confirmNo","renderAs","_createVNode","_unref","Button","_openBlock","_createBlock","_resolveDynamicComponent","_createElementBlock","Dialog","$event","DialogContent","DialogHeader","DialogTitle","_cache","DialogDescription","DialogFooter"],"mappings":"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"}

package/dist/components/compositions/elements/action/ButtonAction.vue2.js

@@ -1,160 +1,5 @@
-import { defineComponent as N, computed as d, ref as M, openBlock as m, createElementBlock as g, Fragment as V, createVNode as l, unref as i, normalizeClass as _, withCtx as o, createBlock as C, resolveDynamicComponent as I, createCommentVNode as p, toDisplayString as w, createTextVNode as u } from "vue";
-import * as L from "lucide-vue-next";
-import "../../../ui/button/index.js";
-import S from "../../../ui/dialog/Dialog.vue.js";
-import "reka-ui";
-import U from "../../../ui/dialog/DialogContent.vue.js";
-import j from "../../../ui/dialog/DialogDescription.vue.js";
-import E from "../../../ui/dialog/DialogFooter.vue.js";
-import F from "../../../ui/dialog/DialogHeader.vue.js";
-import "@vueuse/core";
-import "clsx";
-import "tailwind-merge";
-import O from "../../../ui/dialog/DialogTitle.vue.js";
-import v from "../../../ui/button/Button.vue.js";
-const T = { key: 1 }, te = /* @__PURE__ */ N({
-  __name: "ButtonAction",
-  props: {
-    label: {},
-    variant: { default: "default" },
-    size: { default: "md" },
-    icon: {},
-    href: {},
-    target: { default: "_self" },
-    emit: {},
-    confirm: { type: Boolean },
-    confirmMessage: {},
-    disabled: { type: Boolean },
-    block: { type: Boolean },
-    name: {},
-    id: {}
-  },
-  emits: ["click", "action"],
-  setup(t, { emit: B }) {
-    const e = t, c = B, h = {
-      sm: "sm",
-      md: "default",
-      lg: "lg"
-    }, z = d(
-      () => h[e.size] ?? "default"
-    ), b = L;
-    function $(a) {
-      if (!a)
-        return;
-      const n = a.split(/[-_\s]/).filter(Boolean).map((f) => f.charAt(0).toUpperCase() + f.slice(1)).join("");
-      return b[n] ?? b[a];
-    }
-    const k = d(() => $(e.icon)), r = M(!1);
-    function y() {
-      if (e.href) {
-        e.target === "_blank" ? window.open(e.href, "_blank") : window.location.assign(e.href);
-        return;
-      }
-      e.emit && c("action", { name: e.emit });
-    }
-    function A(a) {
-      if (c("click", a), e.confirm) {
-        a.preventDefault(), r.value = !0;
-        return;
-      }
-      if (!e.href && e.emit) {
-        a.preventDefault(), y();
-        return;
-      }
-      !e.href && !e.emit && a.preventDefault();
-    }
-    function D() {
-      r.value = !1, y();
-    }
-    function x() {
-      r.value = !1;
-    }
-    const s = d(
-      () => e.href && !e.confirm ? "a" : "button"
-    );
-    return (a, n) => (m(), g(V, null, [
-      l(i(v), {
-        id: t.id,
-        as: s.value,
-        variant: t.variant,
-        size: z.value,
-        disabled: t.disabled,
-        class: _(t.block ? "w-full" : ""),
-        "data-action-name": c ?? t.label,
-        "data-element-name": t.name ?? void 0,
-        href: s.value === "a" ? t.href : void 0,
-        target: s.value === "a" ? t.target : void 0,
-        onClick: A
-      }, {
-        default: o(() => [
-          k.value ? (m(), C(I(k.value), {
-            key: 0,
-            class: "h-4 w-4"
-          })) : p("", !0),
-          t.label ? (m(), g("span", T, w(t.label), 1)) : p("", !0)
-        ]),
-        _: 1
-      }, 8, ["id", "as", "variant", "size", "disabled", "class", "data-action-name", "data-element-name", "href", "target"]),
-      t.confirm ? (m(), C(i(S), {
-        key: 0,
-        open: r.value,
-        "onUpdate:open": n[0] || (n[0] = (f) => r.value = f)
-      }, {
-        default: o(() => [
-          l(i(U), null, {
-            default: o(() => [
-              l(i(F), null, {
-                default: o(() => [
-                  l(i(O), null, {
-                    default: o(() => [...n[1] || (n[1] = [
-                      u("Confirm action", -1)
-                    ])]),
-                    _: 1
-                  }),
-                  l(i(j), null, {
-                    default: o(() => [
-                      u(w(t.confirmMessage ?? "Are you sure you want to continue?"), 1)
-                    ]),
-                    _: 1
-                  })
-                ]),
-                _: 1
-              }),
-              l(i(E), null, {
-                default: o(() => [
-                  l(i(v), {
-                    variant: "outline",
-                    type: "button",
-                    onClick: x
-                  }, {
-                    default: o(() => [...n[2] || (n[2] = [
-                      u(" Cancel ", -1)
-                    ])]),
-                    _: 1
-                  }),
-                  l(i(v), {
-                    variant: "default",
-                    type: "button",
-                    onClick: D
-                  }, {
-                    default: o(() => [...n[3] || (n[3] = [
-                      u(" Confirm ", -1)
-                    ])]),
-                    _: 1
-                  })
-                ]),
-                _: 1
-              })
-            ]),
-            _: 1
-          })
-        ]),
-        _: 1
-      }, 8, ["open"])) : p("", !0)
-    ], 64));
-  }
-});
+import f from "./ButtonAction.vue.js";
 export {
-  te as default
+  f as default
 };
 //# sourceMappingURL=ButtonAction.vue2.js.map

package/dist/components/compositions/elements/action/ButtonAction.vue2.js.map

@@ -1 +1 @@
-{"version":3,"file":"ButtonAction.vue2.js","sources":["../../../../../src/components/compositions/elements/action/ButtonAction.vue"],"sourcesContent":["<script setup lang=\"ts\">\n/**\n * Props-driven button composition. Composes the shadcn `Button`\n * primitive with click / href / emit / confirm behaviour.\n *\n * Self-contained — usable directly in any Vue app:\n *\n *   <ButtonAction label=\"Save\" variant=\"default\" @click=\"save\" />\n *   <ButtonAction label=\"Docs\" href=\"https://example.com\" target=\"_blank\" />\n *   <ButtonAction label=\"Delete\" variant=\"destructive\" confirm @action=\"onDelete\" />\n *\n * Action elements do NOT use FieldFrame — they're not form inputs and\n * don't need label/help/error chrome.\n */\nimport { computed, ref } from \"vue\"\nimport * as LucideIcons from \"lucide-vue-next\"\nimport type { FunctionalComponent } from \"vue\"\n\ntype LucideIcon = FunctionalComponent\n\nimport { Button, type ButtonVariants } from \"@/components/ui/button\"\nimport {\n  Dialog,\n  DialogContent,\n  DialogDescription,\n  DialogFooter,\n  DialogHeader,\n  DialogTitle,\n} from \"@/components/ui/dialog\"\n\nexport type ButtonActionVariant =\n  | \"default\"\n  | \"secondary\"\n  | \"destructive\"\n  | \"outline\"\n  | \"ghost\"\n  | \"link\"\n  | \"success\"\n  | \"warning\"\n  | \"info\"\n\nexport type ButtonActionSize = \"sm\" | \"md\" | \"lg\"\n\nexport interface ButtonActionProps {\n  label?: string\n  variant?: ButtonActionVariant\n  size?: ButtonActionSize\n  /** Lucide icon name rendered before the label. */\n  icon?: string\n  /** Navigation target — renders as an anchor when set and confirm is false. */\n  href?: string\n  target?: \"_self\" | \"_blank\" | \"_parent\" | \"_top\"\n  /** Custom event name emitted via `action` when clicked. */\n  emit?: string\n  /** Show a confirmation dialog before firing. */\n  confirm?: boolean\n  /** Confirmation message displayed in the dialog. */\n  confirmMessage?: string\n  disabled?: boolean\n  /** Render full width. */\n  block?: boolean\n  /** HTML name attribute. */\n  name?: string\n  /** HTML id attribute. */\n  id?: string\n}\n\nconst props = withDefaults(defineProps<ButtonActionProps>(), {\n  variant: \"default\",\n  size: \"md\",\n  target: \"_self\",\n})\n\nconst emit = defineEmits<{\n  (e: \"click\", event: MouseEvent): void\n  (e: \"action\", payload: { name: string }): void\n}>()\n\nconst sizeMap: Record<ButtonActionSize, ButtonVariants[\"size\"]> = {\n  sm: \"sm\",\n  md: \"default\",\n  lg: \"lg\",\n}\n\nconst mappedSize = computed<ButtonVariants[\"size\"]>(\n  () => sizeMap[props.size] ?? \"default\",\n)\n\nconst iconLibrary = LucideIcons as unknown as Record<string, LucideIcon>\nfunction resolveIcon(name: string | undefined): LucideIcon | undefined {\n  if (!name) {\n    return undefined\n  }\n  const pascal = name\n    .split(/[-_\\s]/)\n    .filter(Boolean)\n    .map((s) => s.charAt(0).toUpperCase() + s.slice(1))\n    .join(\"\")\n  return iconLibrary[pascal] ?? iconLibrary[name]\n}\nconst icon = computed(() => resolveIcon(props.icon))\n\nconst confirmOpen = ref(false)\n\nfunction performAction(): void {\n  if (props.href) {\n    if (props.target === \"_blank\") {\n      window.open(props.href, \"_blank\")\n    } else {\n      window.location.assign(props.href)\n    }\n    return\n  }\n  if (props.emit) {\n    emit(\"action\", { name: props.emit })\n  }\n}\n\nfunction onClick(event: MouseEvent): void {\n  emit(\"click\", event)\n  if (props.confirm) {\n    event.preventDefault()\n    confirmOpen.value = true\n    return\n  }\n  if (!props.href && props.emit) {\n    event.preventDefault()\n    performAction()\n    return\n  }\n  if (!props.href && !props.emit) {\n    event.preventDefault()\n  }\n}\n\nfunction confirmYes(): void {\n  confirmOpen.value = false\n  performAction()\n}\n\nfunction confirmNo(): void {\n  confirmOpen.value = false\n}\n\nconst renderAs = computed<\"a\" | \"button\">(() =>\n  props.href && !props.confirm ? \"a\" : \"button\",\n)\n</script>\n\n<template>\n  <Button\n    :id=\"id\"\n    :as=\"renderAs\"\n    :variant=\"variant\"\n    :size=\"mappedSize\"\n    :disabled=\"disabled\"\n    :class=\"block ? 'w-full' : ''\"\n    :data-action-name=\"emit ?? label\"\n    :data-element-name=\"name ?? undefined\"\n    :href=\"renderAs === 'a' ? href : undefined\"\n    :target=\"renderAs === 'a' ? target : undefined\"\n    @click=\"onClick\"\n  >\n    <component :is=\"icon\" v-if=\"icon\" class=\"h-4 w-4\" />\n    <span v-if=\"label\">{{ label }}</span>\n  </Button>\n\n  <Dialog v-if=\"confirm\" v-model:open=\"confirmOpen\">\n    <DialogContent>\n      <DialogHeader>\n        <DialogTitle>Confirm action</DialogTitle>\n        <DialogDescription>\n          {{ confirmMessage ?? \"Are you sure you want to continue?\" }}\n        </DialogDescription>\n      </DialogHeader>\n      <DialogFooter>\n        <Button variant=\"outline\" type=\"button\" @click=\"confirmNo\">\n          Cancel\n        </Button>\n        <Button variant=\"default\" type=\"button\" @click=\"confirmYes\">\n          Confirm\n        </Button>\n      </DialogFooter>\n    </DialogContent>\n  </Dialog>\n</template>\n"],"names":["props","__props","emit","__emit","sizeMap","mappedSize","computed","iconLibrary","LucideIcons","resolveIcon","name","pascal","s","icon","confirmOpen","ref","performAction","onClick","event","confirmYes","confirmNo","renderAs","_createVNode","_unref","Button","_openBlock","_createBlock","_resolveDynamicComponent","_createElementBlock","Dialog","$event","DialogContent","DialogHeader","DialogTitle","_cache","DialogDescription","DialogFooter"],"mappings":"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"}
+{"version":3,"file":"ButtonAction.vue2.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}

package/dist/components/compositions/elements/action/ButtonGroupAction.vue.d.ts

@@ -0,0 +1,46 @@
+import { ButtonActionSize, ButtonActionVariant } from './ButtonAction.vue';
+export interface ButtonGroupItem {
+    id?: string;
+    label: string;
+    /** Lucide icon name rendered before the label. */
+    icon?: string;
+    /** Navigation target — renders as an anchor when set. */
+    href?: string;
+    target?: "_self" | "_blank" | "_parent" | "_top";
+    /** Visual variant; falls back to the group's variant prop. */
+    variant?: ButtonActionVariant;
+    /** Custom event name emitted via `action` when clicked. */
+    emit?: string;
+    disabled?: boolean;
+}
+export interface ButtonGroupActionProps {
+    items?: ButtonGroupItem[];
+    /** Default variant applied to items that don't specify one. */
+    variant?: ButtonActionVariant;
+    size?: ButtonActionSize;
+    /** Render the group stretched (each child becomes flex-1). */
+    block?: boolean;
+    /** Group HTML id. */
+    id?: string;
+    /** Group name (used as `data-element-name`). */
+    name?: string;
+}
+declare const _default: import('vue').DefineComponent<ButtonGroupActionProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {} & {
+    action: (payload: {
+        name: string;
+        item: ButtonGroupItem;
+    }) => any;
+    click: (event: MouseEvent, item: ButtonGroupItem) => any;
+}, string, import('vue').PublicProps, Readonly<ButtonGroupActionProps> & Readonly<{
+    onAction?: ((payload: {
+        name: string;
+        item: ButtonGroupItem;
+    }) => any) | undefined;
+    onClick?: ((event: MouseEvent, item: ButtonGroupItem) => any) | undefined;
+}>, {
+    variant: ButtonActionVariant;
+    size: ButtonActionSize;
+    items: ButtonGroupItem[];
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLDivElement>;
+export default _default;
+//# sourceMappingURL=ButtonGroupAction.vue.d.ts.map

package/dist/components/compositions/elements/action/ButtonGroupAction.vue.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ButtonGroupAction.vue.d.ts","sourceRoot":"","sources":["../../../../../src/components/compositions/elements/action/ButtonGroupAction.vue"],"names":[],"mappings":"AA0JA,OAAO,KAAK,EACV,gBAAgB,EAChB,mBAAmB,EACpB,MAAM,oBAAoB,CAAA;AAE3B,MAAM,WAAW,eAAe;IAC9B,EAAE,CAAC,EAAE,MAAM,CAAA;IACX,KAAK,EAAE,MAAM,CAAA;IACb,kDAAkD;IAClD,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,yDAAyD;IACzD,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,MAAM,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,SAAS,GAAG,MAAM,CAAA;IAChD,8DAA8D;IAC9D,OAAO,CAAC,EAAE,mBAAmB,CAAA;IAC7B,2DAA2D;IAC3D,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB;AAED,MAAM,WAAW,sBAAsB;IACrC,KAAK,CAAC,EAAE,eAAe,EAAE,CAAA;IACzB,+DAA+D;IAC/D,OAAO,CAAC,EAAE,mBAAmB,CAAA;IAC7B,IAAI,CAAC,EAAE,gBAAgB,CAAA;IACvB,8DAA8D;IAC9D,KAAK,CAAC,EAAE,OAAO,CAAA;IACf,qBAAqB;IACrB,EAAE,CAAC,EAAE,MAAM,CAAA;IACX,gDAAgD;IAChD,IAAI,CAAC,EAAE,MAAM,CAAA;CACd;;;cAYoB,MAAM;cAAQ,eAAe;;;;;cAA7B,MAAM;cAAQ,eAAe;;;;aApBtC,mBAAmB;UACtB,gBAAgB;WAHf,eAAe,EAAE;;AAuK3B,wBASG"}