@skdx/vue 0.27.0 → 0.29.0

package/dist/dialog/Dialog.vue.d.cts

@@ -1,58 +1,100 @@
+import type { DialogDismiss, DialogRole } from './context.cjs';
 /**
- * The Vue implementation of the shared Dialog contract (see `@skdx/shared`'s
- * `dialogContract`). Renders no DOM element of its own — it only owns open
- * state and `provide()`s it to `<SkdxDialogTrigger>` / `<SkdxDialogContent>` /
- * `<SkdxDialogTitle>` / `<SkdxDialogDescription>` / `<SkdxDialogClose>`.
- * `SkdxDialogContent` renders the actual native `<dialog>`, whose
- * `showModal()`/`show()`/`close()` give top-layer rendering, a native focus
- * trap, and focus-return-to-invoker for free — no manual portal or
- * focus-trap logic needed here.
- *
- * Emits `open-change` the instant the state flips and `open-change-complete`
- * once the change has finished on screen — after `SkdxDialogContent`'s enter
- * or exit animation ends, or in the same task when it declares none.
- *
- * Works controlled (`v-model:open`) or uncontrolled (`default-open`).
+ * Modal dialog component: renders a native `<dialog>` element with title, description, body and footer.
  *
  * @example
  * ```vue
- * <SkdxDialog>
- *   <SkdxDialogTrigger>Open</SkdxDialogTrigger>
- *   <SkdxDialogContent>
- *     <SkdxDialogTitle>Edit profile</SkdxDialogTitle>
- *     <SkdxDialogDescription>Make changes to your profile here.</SkdxDialogDescription>
- *     <SkdxDialogClose>Close</SkdxDialogClose>
- *   </SkdxDialogContent>
+ * <SkdxDialog v-model:open="open" title="Settings">
+ *   <p>Body content.</p>
+ *   <template #footer>
+ *     <SkdxButton @click="open = false">Save</SkdxButton>
+ *   </template>
  * </SkdxDialog>
  * ```
  */
 type __VLS_Props = {
     /** Controlled open state. Pair with `v-model:open` or `@open-change`. */
-    open?: boolean;
+    open?: boolean | undefined;
     /** Initial open state, for uncontrolled usage. */
     defaultOpen?: boolean;
+    /** Whether the dialog traps focus and blocks page interaction (`showModal()`) or remains non-blocking (`show()`). */
+    modal?: boolean;
     /**
-     * Whether the dialog traps focus and blocks page interaction (native
-     * `showModal()`) or remains non-blocking (native `show()`).
+     * Which dismissal channels can close the dialog: `'any'`, `'escape'`, `'outside'`, or `'none'`.
+     * Reflected as `data-dismiss` on the panel.
      */
-    modal?: boolean;
+    dismiss?: DialogDismiss;
+    /**
+     * Title rendered by the derived anatomy as `SkdxDialogTitle`.
+     * @default undefined
+     */
+    title?: string | undefined;
+    /**
+     * Description rendered by the derived anatomy as `SkdxDialogDescription`.
+     * @default undefined
+     */
+    description?: string | undefined;
+    /**
+     * Whether the dialog can be dismissed at all; `false` forces `dismiss` to `'none'` and withholds the derived close button.
+     * @default true
+     */
+    dismissible?: boolean;
+    /**
+     * Size rung the skin renders the panel at, applied to the derived Content part.
+     * @default undefined — falls back to a `data-size` attribute.
+     */
+    size?: 'sm' | 'md' | 'lg' | (string & {}) | undefined;
+    /**
+     * The panel's role. `'alertdialog'` is the interruptive confirmation: always modal, never
+     * closed by an outside interaction, focused on Cancel, and derived with both footer buttons
+     * in place of the close button.
+     */
+    role?: DialogRole;
+    /**
+     * Severity rung the skin paints the panel and its derived action button with.
+     * @default undefined — falls back to a `data-status` attribute.
+     */
+    status?: 'info' | 'success' | 'warning' | 'danger' | (string & {}) | undefined;
+    /**
+     * Label of the derived action button, which renders only when given — or always under `role="alertdialog"`.
+     * @default undefined — `'Confirm'` under `role="alertdialog"`.
+     */
+    confirmLabel?: string | undefined;
+    /**
+     * Label of the derived cancel button, which renders only when given — or always under `role="alertdialog"`.
+     * @default undefined — `'Cancel'` under `role="alertdialog"`.
+     */
+    cancelLabel?: string | undefined;
 };
-declare var __VLS_1: {};
+declare var __VLS_16: {}, __VLS_18: {};
 type __VLS_Slots = {} & {
-    default?: (props: typeof __VLS_1) => any;
+    default?: (props: typeof __VLS_16) => any;
+} & {
+    footer?: (props: typeof __VLS_18) => any;
 };
 declare const __VLS_component: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     "update:open": (open: boolean) => any;
     "open-change": (open: boolean) => any;
+    cancel: (event: Event) => any;
     "open-change-complete": (open: boolean) => any;
+    confirm: (event: Event) => any;
 }, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
-    "onUpdate:open"?: ((open: boolean) => any) | undefined;
-    "onOpen-change"?: ((open: boolean) => any) | undefined;
-    "onOpen-change-complete"?: ((open: boolean) => any) | undefined;
+    "onUpdate:open"?: (open: boolean) => any;
+    "onOpen-change"?: (open: boolean) => any;
+    onCancel?: (event: Event) => any;
+    "onOpen-change-complete"?: (open: boolean) => any;
+    onConfirm?: (event: Event) => any;
 }>, {
-    open: boolean;
+    size: "sm" | "md" | "lg" | (string & {}) | undefined;
+    status: "info" | "success" | "warning" | "danger" | (string & {}) | undefined;
+    role: DialogRole;
+    dismissible: boolean;
+    open: boolean | undefined;
     defaultOpen: boolean;
     modal: boolean;
+    confirmLabel: string | undefined;
+    cancelLabel: string | undefined;
+    dismiss: DialogDismiss;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
 export default _default;

package/dist/dialog/Dialog.vue.d.ts

@@ -1,58 +1,100 @@
+import type { DialogDismiss, DialogRole } from './context.js';
 /**
- * The Vue implementation of the shared Dialog contract (see `@skdx/shared`'s
- * `dialogContract`). Renders no DOM element of its own — it only owns open
- * state and `provide()`s it to `<SkdxDialogTrigger>` / `<SkdxDialogContent>` /
- * `<SkdxDialogTitle>` / `<SkdxDialogDescription>` / `<SkdxDialogClose>`.
- * `SkdxDialogContent` renders the actual native `<dialog>`, whose
- * `showModal()`/`show()`/`close()` give top-layer rendering, a native focus
- * trap, and focus-return-to-invoker for free — no manual portal or
- * focus-trap logic needed here.
- *
- * Emits `open-change` the instant the state flips and `open-change-complete`
- * once the change has finished on screen — after `SkdxDialogContent`'s enter
- * or exit animation ends, or in the same task when it declares none.
- *
- * Works controlled (`v-model:open`) or uncontrolled (`default-open`).
+ * Modal dialog component: renders a native `<dialog>` element with title, description, body and footer.
  *
  * @example
  * ```vue
- * <SkdxDialog>
- *   <SkdxDialogTrigger>Open</SkdxDialogTrigger>
- *   <SkdxDialogContent>
- *     <SkdxDialogTitle>Edit profile</SkdxDialogTitle>
- *     <SkdxDialogDescription>Make changes to your profile here.</SkdxDialogDescription>
- *     <SkdxDialogClose>Close</SkdxDialogClose>
- *   </SkdxDialogContent>
+ * <SkdxDialog v-model:open="open" title="Settings">
+ *   <p>Body content.</p>
+ *   <template #footer>
+ *     <SkdxButton @click="open = false">Save</SkdxButton>
+ *   </template>
  * </SkdxDialog>
  * ```
  */
 type __VLS_Props = {
     /** Controlled open state. Pair with `v-model:open` or `@open-change`. */
-    open?: boolean;
+    open?: boolean | undefined;
     /** Initial open state, for uncontrolled usage. */
     defaultOpen?: boolean;
+    /** Whether the dialog traps focus and blocks page interaction (`showModal()`) or remains non-blocking (`show()`). */
+    modal?: boolean;
     /**
-     * Whether the dialog traps focus and blocks page interaction (native
-     * `showModal()`) or remains non-blocking (native `show()`).
+     * Which dismissal channels can close the dialog: `'any'`, `'escape'`, `'outside'`, or `'none'`.
+     * Reflected as `data-dismiss` on the panel.
      */
-    modal?: boolean;
+    dismiss?: DialogDismiss;
+    /**
+     * Title rendered by the derived anatomy as `SkdxDialogTitle`.
+     * @default undefined
+     */
+    title?: string | undefined;
+    /**
+     * Description rendered by the derived anatomy as `SkdxDialogDescription`.
+     * @default undefined
+     */
+    description?: string | undefined;
+    /**
+     * Whether the dialog can be dismissed at all; `false` forces `dismiss` to `'none'` and withholds the derived close button.
+     * @default true
+     */
+    dismissible?: boolean;
+    /**
+     * Size rung the skin renders the panel at, applied to the derived Content part.
+     * @default undefined — falls back to a `data-size` attribute.
+     */
+    size?: 'sm' | 'md' | 'lg' | (string & {}) | undefined;
+    /**
+     * The panel's role. `'alertdialog'` is the interruptive confirmation: always modal, never
+     * closed by an outside interaction, focused on Cancel, and derived with both footer buttons
+     * in place of the close button.
+     */
+    role?: DialogRole;
+    /**
+     * Severity rung the skin paints the panel and its derived action button with.
+     * @default undefined — falls back to a `data-status` attribute.
+     */
+    status?: 'info' | 'success' | 'warning' | 'danger' | (string & {}) | undefined;
+    /**
+     * Label of the derived action button, which renders only when given — or always under `role="alertdialog"`.
+     * @default undefined — `'Confirm'` under `role="alertdialog"`.
+     */
+    confirmLabel?: string | undefined;
+    /**
+     * Label of the derived cancel button, which renders only when given — or always under `role="alertdialog"`.
+     * @default undefined — `'Cancel'` under `role="alertdialog"`.
+     */
+    cancelLabel?: string | undefined;
 };
-declare var __VLS_1: {};
+declare var __VLS_16: {}, __VLS_18: {};
 type __VLS_Slots = {} & {
-    default?: (props: typeof __VLS_1) => any;
+    default?: (props: typeof __VLS_16) => any;
+} & {
+    footer?: (props: typeof __VLS_18) => any;
 };
 declare const __VLS_component: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     "update:open": (open: boolean) => any;
     "open-change": (open: boolean) => any;
+    cancel: (event: Event) => any;
     "open-change-complete": (open: boolean) => any;
+    confirm: (event: Event) => any;
 }, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
-    "onUpdate:open"?: ((open: boolean) => any) | undefined;
-    "onOpen-change"?: ((open: boolean) => any) | undefined;
-    "onOpen-change-complete"?: ((open: boolean) => any) | undefined;
+    "onUpdate:open"?: (open: boolean) => any;
+    "onOpen-change"?: (open: boolean) => any;
+    onCancel?: (event: Event) => any;
+    "onOpen-change-complete"?: (open: boolean) => any;
+    onConfirm?: (event: Event) => any;
 }>, {
-    open: boolean;
+    size: "sm" | "md" | "lg" | (string & {}) | undefined;
+    status: "info" | "success" | "warning" | "danger" | (string & {}) | undefined;
+    role: DialogRole;
+    dismissible: boolean;
+    open: boolean | undefined;
     defaultOpen: boolean;
     modal: boolean;
+    confirmLabel: string | undefined;
+    cancelLabel: string | undefined;
+    dismiss: DialogDismiss;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
 export default _default;

package/dist/dialog/Dialog.vue_vue_type_script_setup_true_lang.cjs

@@ -1 +1 @@
-const s=require("../utils/useOpenChangeComplete.cjs"),o=require("./context.cjs");let t=require("vue");var f=(0,t.defineComponent)({__name:"Dialog",props:{open:{type:Boolean,default:void 0},defaultOpen:{type:Boolean,default:!1},modal:{type:Boolean,default:!0}},emits:["update:open","open-change","open-change-complete"],setup(d,{emit:i}){const n=d,p=i,l=(0,t.ref)(null),a=(0,t.ref)(n.defaultOpen),u=(0,t.computed)(()=>n.open??a.value),r=(0,t.computed)(()=>n.modal);s.useOpenChangeComplete(u,l,e=>p("open-change-complete",e));function c(e){n.open===void 0&&(a.value=e),p("update:open",e),p("open-change",e)}return(0,t.provide)(o.DIALOG_CONTEXT,{isOpen:u,contentRef:l,isModal:r,contentId:o.nextDialogId("content"),titleId:o.nextDialogId("title"),descriptionId:o.nextDialogId("description"),setOpen:c}),(e,_)=>(0,t.renderSlot)(e.$slots,"default")}});exports.default=f;
+const r=require("./DialogAnatomy.vue.cjs"),m=require("./DialogRoot.vue.cjs");let e=require("vue");var f=(0,e.defineComponent)({inheritAttrs:!1,__name:"Dialog",props:{open:{type:Boolean,default:void 0},defaultOpen:{type:Boolean,default:!1},modal:{type:Boolean,default:!0},dismiss:{default:"any"},title:{},description:{},dismissible:{type:Boolean,default:!0},size:{default:void 0},role:{default:"dialog"},status:{default:void 0},confirmLabel:{default:void 0},cancelLabel:{default:void 0}},emits:["update:open","open-change","open-change-complete","confirm","cancel"],setup(t){const s=t,a=(0,e.useAttrs)(),n=(0,e.computed)(()=>s.size??a["data-size"]),d=(0,e.computed)(()=>s.status??a["data-status"]),u=(0,e.computed)(()=>{const{"data-size":i,"data-status":l,...o}=a;return o});return(i,l)=>((0,e.openBlock)(),(0,e.createBlock)(m.default,{open:t.open,"default-open":t.defaultOpen,modal:t.modal,dismiss:t.dismiss,dismissible:t.dismissible,role:t.role,"onUpdate:open":l[0]||(l[0]=o=>i.$emit("update:open",o)),onOpenChange:l[1]||(l[1]=o=>i.$emit("open-change",o)),onOpenChangeComplete:l[2]||(l[2]=o=>i.$emit("open-change-complete",o)),onConfirm:l[3]||(l[3]=o=>i.$emit("confirm",o)),onCancel:l[4]||(l[4]=o=>i.$emit("cancel",o))},{default:(0,e.withCtx)(()=>[(0,e.createVNode)(r.default,(0,e.mergeProps)(u.value,{size:n.value,status:d.value,title:t.title,description:t.description,dismissible:s.dismissible,role:s.role,"confirm-label":t.confirmLabel,"cancel-label":t.cancelLabel}),(0,e.createSlots)({default:(0,e.withCtx)(()=>[(0,e.renderSlot)(i.$slots,"default")]),_:2},[i.$slots.footer?{name:"footer",fn:(0,e.withCtx)(()=>[(0,e.renderSlot)(i.$slots,"footer")]),key:"0"}:void 0]),1040,["size","status","title","description","dismissible","role","confirm-label","cancel-label"])]),_:3},8,["open","default-open","modal","dismiss","dismissible","role"]))}});exports.default=f;

package/dist/dialog/Dialog.vue_vue_type_script_setup_true_lang.js

@@ -1 +1 @@
-import{useOpenChangeComplete as e}from"../utils/useOpenChangeComplete.js";import{DIALOG_CONTEXT as o,nextDialogId as t}from"./context.js";import{computed as n,defineComponent as a,provide as p,ref as l,renderSlot as s}from"vue";var d=/* @__PURE__ */a({__name:"Dialog",props:{open:{type:Boolean,default:void 0},defaultOpen:{type:Boolean,default:!1},modal:{type:Boolean,default:!0}},emits:["update:open","open-change","open-change-complete"],setup(a,{emit:d}){const i=a,u=d,m=l(null),r=l(i.defaultOpen),c=n(()=>i.open??r.value),f=n(()=>i.modal);return e(c,m,e=>u("open-change-complete",e)),p(o,{isOpen:c,contentRef:m,isModal:f,contentId:t("content"),titleId:t("title"),descriptionId:t("description"),setOpen:function(e){void 0===i.open&&(r.value=e),u("update:open",e),u("open-change",e)}}),(e,o)=>s(e.$slots,"default")}});export{d as default};
+import e from"./DialogAnatomy.vue.js";import o from"./DialogRoot.vue.js";import{computed as t,createBlock as a,createSlots as s,createVNode as l,defineComponent as i,mergeProps as n,openBlock as d,renderSlot as r,useAttrs as m,withCtx as p}from"vue";var c=/* @__PURE__ */i({inheritAttrs:!1,__name:"Dialog",props:{open:{type:Boolean,default:void 0},defaultOpen:{type:Boolean,default:!1},modal:{type:Boolean,default:!0},dismiss:{default:"any"},title:{},description:{},dismissible:{type:Boolean,default:!0},size:{default:void 0},role:{default:"dialog"},status:{default:void 0},confirmLabel:{default:void 0},cancelLabel:{default:void 0}},emits:["update:open","open-change","open-change-complete","confirm","cancel"],setup(i){const c=i,u=m(),f=t(()=>c.size??u["data-size"]),b=t(()=>c.status??u["data-status"]),v=t(()=>{const{"data-size":e,"data-status":o,...t}=u;return t});return(t,m)=>(d(),a(o,{open:i.open,"default-open":i.defaultOpen,modal:i.modal,dismiss:i.dismiss,dismissible:i.dismissible,role:i.role,"onUpdate:open":m[0]||(m[0]=e=>t.$emit("update:open",e)),onOpenChange:m[1]||(m[1]=e=>t.$emit("open-change",e)),onOpenChangeComplete:m[2]||(m[2]=e=>t.$emit("open-change-complete",e)),onConfirm:m[3]||(m[3]=e=>t.$emit("confirm",e)),onCancel:m[4]||(m[4]=e=>t.$emit("cancel",e))},{default:p(()=>[l(e,n(v.value,{size:f.value,status:b.value,title:i.title,description:i.description,dismissible:c.dismissible,role:c.role,"confirm-label":i.confirmLabel,"cancel-label":i.cancelLabel}),s({default:p(()=>[r(t.$slots,"default")]),_:2},[t.$slots.footer?{name:"footer",fn:p(()=>[r(t.$slots,"footer")]),key:"0"}:void 0]),1040,["size","status","title","description","dismissible","role","confirm-label","cancel-label"])]),_:3},8,["open","default-open","modal","dismiss","dismissible","role"]))}});export{c as default};

package/dist/dialog/DialogAction.vue.cjs

@@ -0,0 +1 @@
+const e=require("./DialogAction.vue_vue_type_script_setup_true_lang.cjs");var t=e.default;exports.default=t;

package/dist/dialog/DialogAction.vue.d.cts

@@ -0,0 +1,29 @@
+/**
+ * Button that carries out the confirmed action, closing the dialog after the root's `confirm` event unless it was prevented.
+ *
+ * @example
+ * ```vue
+ * <SkdxDialogAction>Delete</SkdxDialogAction>
+ * ```
+ */
+type __VLS_Props = {
+    /**
+     * Disables the button natively so it neither confirms nor closes the dialog.
+     * @default false
+     */
+    disabled?: boolean;
+};
+declare var __VLS_1: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_1) => any;
+};
+declare const __VLS_component: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
+    disabled: boolean;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/dialog/DialogAction.vue.d.ts

@@ -0,0 +1,29 @@
+/**
+ * Button that carries out the confirmed action, closing the dialog after the root's `confirm` event unless it was prevented.
+ *
+ * @example
+ * ```vue
+ * <SkdxDialogAction>Delete</SkdxDialogAction>
+ * ```
+ */
+type __VLS_Props = {
+    /**
+     * Disables the button natively so it neither confirms nor closes the dialog.
+     * @default false
+     */
+    disabled?: boolean;
+};
+declare var __VLS_1: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_1) => any;
+};
+declare const __VLS_component: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
+    disabled: boolean;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/dialog/DialogAction.vue.js

@@ -0,0 +1 @@
+import t from"./DialogAction.vue_vue_type_script_setup_true_lang.js";var e=t;export{e as default};

package/dist/dialog/DialogAction.vue_vue_type_script_setup_true_lang.cjs

@@ -0,0 +1 @@
+const o=require("../utils/injectRequired.cjs"),l=require("./context.cjs");let e=require("vue");var r=["disabled","data-disabled"],s=(0,e.defineComponent)({__name:"DialogAction",props:{disabled:{type:Boolean,default:!1}},setup(d){const a=d,i=o.injectRequired(l.DIALOG_CONTEXT,"<SkdxDialogAction> must be used inside <SkdxDialog>.");function n(t){i.confirm?.(t)!==!1&&i.setOpen(!1)}return(t,u)=>((0,e.openBlock)(),(0,e.createElementBlock)("button",{class:"skdx-dialog__action","data-part":"action",type:"button",disabled:a.disabled,"data-disabled":a.disabled?"":void 0,onClick:n},[(0,e.renderSlot)(t.$slots,"default")],8,r))}});exports.default=s;

package/dist/dialog/DialogAction.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1 @@
+import{injectRequired as e}from"../utils/injectRequired.js";import{DIALOG_CONTEXT as t}from"./context.js";import{createElementBlock as a,defineComponent as o,openBlock as d,renderSlot as i}from"vue";var s=["disabled","data-disabled"],n=/* @__PURE__ */o({__name:"DialogAction",props:{disabled:{type:Boolean,default:!1}},setup(o){const n=o,l=e(t,"<SkdxDialogAction> must be used inside <SkdxDialog>.");function r(e){!1!==l.confirm?.(e)&&l.setOpen(!1)}return(e,t)=>(d(),a("button",{class:"skdx-dialog__action","data-part":"action",type:"button",disabled:n.disabled,"data-disabled":n.disabled?"":void 0,onClick:r},[i(e.$slots,"default")],8,s))}});export{n as default};

package/dist/dialog/DialogAnatomy.vue.cjs

@@ -0,0 +1 @@
+const e=require("./DialogAnatomy.vue_vue_type_script_setup_true_lang.cjs");var t=e.default;exports.default=t;

package/dist/dialog/DialogAnatomy.vue.d.cts

@@ -0,0 +1,37 @@
+import type { DialogRole } from './context.cjs';
+/**
+ * The anatomy a `SkdxDialog` renders: backdrop, panel, derived title/description, slotted body, footer and close button.
+ * @internal
+ */
+type __VLS_Props = {
+    title?: string | undefined;
+    description?: string | undefined;
+    dismissible: boolean;
+    role: DialogRole;
+    confirmLabel?: string | undefined;
+    cancelLabel?: string | undefined;
+    /**
+     * Size rung the skin renders the panel at, applied to the derived Content part.
+     * @default undefined — falls back to a `data-size` attribute.
+     */
+    size?: 'sm' | 'md' | 'lg' | (string & {}) | undefined;
+    /**
+     * Severity rung the skin paints the panel and its action button with.
+     * @default undefined — falls back to a `data-status` attribute.
+     */
+    status?: 'info' | 'success' | 'warning' | 'danger' | (string & {}) | undefined;
+};
+declare var __VLS_13: {}, __VLS_15: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_13) => any;
+} & {
+    footer?: (props: typeof __VLS_15) => any;
+};
+declare const __VLS_component: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/dialog/DialogAnatomy.vue.d.ts

@@ -0,0 +1,37 @@
+import type { DialogRole } from './context.js';
+/**
+ * The anatomy a `SkdxDialog` renders: backdrop, panel, derived title/description, slotted body, footer and close button.
+ * @internal
+ */
+type __VLS_Props = {
+    title?: string | undefined;
+    description?: string | undefined;
+    dismissible: boolean;
+    role: DialogRole;
+    confirmLabel?: string | undefined;
+    cancelLabel?: string | undefined;
+    /**
+     * Size rung the skin renders the panel at, applied to the derived Content part.
+     * @default undefined — falls back to a `data-size` attribute.
+     */
+    size?: 'sm' | 'md' | 'lg' | (string & {}) | undefined;
+    /**
+     * Severity rung the skin paints the panel and its action button with.
+     * @default undefined — falls back to a `data-status` attribute.
+     */
+    status?: 'info' | 'success' | 'warning' | 'danger' | (string & {}) | undefined;
+};
+declare var __VLS_13: {}, __VLS_15: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_13) => any;
+} & {
+    footer?: (props: typeof __VLS_15) => any;
+};
+declare const __VLS_component: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/dialog/DialogAnatomy.vue.js

@@ -0,0 +1 @@
+import t from"./DialogAnatomy.vue_vue_type_script_setup_true_lang.js";var e=t;export{e as default};

package/dist/dialog/DialogAnatomy.vue_vue_type_script_setup_true_lang.cjs

@@ -0,0 +1 @@
+const u=require("../utils/Glyph.vue.cjs"),n=require("./DialogAction.vue.cjs"),s=require("./DialogCancel.vue.cjs"),d=require("./DialogClose.vue.cjs"),m=require("./DialogContent.vue.cjs"),f=require("./DialogDescription.vue.cjs"),k=require("./DialogOverlay.vue.cjs"),g=require("./DialogTitle.vue.cjs");let e=require("vue");var C={key:2,class:"skdx-dialog__footer","data-part":"footer"},q=(0,e.defineComponent)({inheritAttrs:!1,__name:"DialogAnatomy",props:{title:{},description:{},dismissible:{type:Boolean},role:{},confirmLabel:{},cancelLabel:{},size:{},status:{}},setup(t){const a=t,c=(0,e.useSlots)(),o=(0,e.computed)(()=>a.role==="alertdialog"),l=(0,e.computed)(()=>o.value?a.confirmLabel??"Confirm":a.confirmLabel),r=(0,e.computed)(()=>o.value?a.cancelLabel??"Cancel":a.cancelLabel);return(i,v)=>((0,e.openBlock)(),(0,e.createElementBlock)(e.Fragment,null,[(0,e.createVNode)(k.default),(0,e.createVNode)(m.default,(0,e.mergeProps)(i.$attrs,{size:t.size,status:t.status}),{default:(0,e.withCtx)(()=>[t.title?((0,e.openBlock)(),(0,e.createBlock)(g.default,{key:0},{default:(0,e.withCtx)(()=>[(0,e.createTextVNode)((0,e.toDisplayString)(t.title),1)]),_:1})):(0,e.createCommentVNode)("",!0),t.description?((0,e.openBlock)(),(0,e.createBlock)(f.default,{key:1},{default:(0,e.withCtx)(()=>[(0,e.createTextVNode)((0,e.toDisplayString)(t.description),1)]),_:1})):(0,e.createCommentVNode)("",!0),(0,e.renderSlot)(i.$slots,"default"),(0,e.unref)(c).footer||l.value||r.value?((0,e.openBlock)(),(0,e.createElementBlock)("div",C,[(0,e.renderSlot)(i.$slots,"footer"),r.value?((0,e.openBlock)(),(0,e.createBlock)(s.default,{key:0},{default:(0,e.withCtx)(()=>[(0,e.createTextVNode)((0,e.toDisplayString)(r.value),1)]),_:1})):(0,e.createCommentVNode)("",!0),l.value?((0,e.openBlock)(),(0,e.createBlock)(n.default,{key:1,"data-status":t.status},{default:(0,e.withCtx)(()=>[(0,e.createTextVNode)((0,e.toDisplayString)(l.value),1)]),_:1},8,["data-status"])):(0,e.createCommentVNode)("",!0)])):(0,e.createCommentVNode)("",!0),t.dismissible&&!o.value?((0,e.openBlock)(),(0,e.createBlock)(d.default,{key:3,class:"skdx-dialog__close-icon","aria-label":"Close"},{default:(0,e.withCtx)(()=>[(0,e.createVNode)(u.default,{name:"close"})]),_:1})):(0,e.createCommentVNode)("",!0)]),_:3},16,["size","status"])],64))}});exports.default=q;

package/dist/dialog/DialogAnatomy.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1 @@
+import e from"../utils/Glyph.vue.js";import a from"./DialogAction.vue.js";import t from"./DialogCancel.vue.js";import o from"./DialogClose.vue.js";import s from"./DialogContent.vue.js";import l from"./DialogDescription.vue.js";import i from"./DialogOverlay.vue.js";import r from"./DialogTitle.vue.js";import{Fragment as u,computed as n,createBlock as m,createCommentVNode as c,createElementBlock as d,createTextVNode as f,createVNode as p,defineComponent as v,mergeProps as g,openBlock as _,renderSlot as k,toDisplayString as y,unref as D,useSlots as b,withCtx as C}from"vue";var j={key:2,class:"skdx-dialog__footer","data-part":"footer"},L=/* @__PURE__ */v({inheritAttrs:!1,__name:"DialogAnatomy",props:{title:{},description:{},dismissible:{type:Boolean},role:{},confirmLabel:{},cancelLabel:{},size:{},status:{}},setup(v){const L=v,x=b(),z=n(()=>"alertdialog"===L.role),B=n(()=>z.value?L.confirmLabel??"Confirm":L.confirmLabel),h=n(()=>z.value?L.cancelLabel??"Cancel":L.cancelLabel);return(n,b)=>(_(),d(u,null,[p(i),p(s,g(n.$attrs,{size:v.size,status:v.status}),{default:C(()=>[v.title?(_(),m(r,{key:0},{default:C(()=>[f(y(v.title),1)]),_:1})):c("",!0),v.description?(_(),m(l,{key:1},{default:C(()=>[f(y(v.description),1)]),_:1})):c("",!0),k(n.$slots,"default"),D(x).footer||B.value||h.value?(_(),d("div",j,[k(n.$slots,"footer"),h.value?(_(),m(t,{key:0},{default:C(()=>[f(y(h.value),1)]),_:1})):c("",!0),B.value?(_(),m(a,{key:1,"data-status":v.status},{default:C(()=>[f(y(B.value),1)]),_:1},8,["data-status"])):c("",!0)])):c("",!0),v.dismissible&&!z.value?(_(),m(o,{key:3,class:"skdx-dialog__close-icon","aria-label":"Close"},{default:C(()=>[p(e,{name:"close"})]),_:1})):c("",!0)]),_:3},16,["size","status"])],64))}});export{L as default};

package/dist/dialog/DialogCancel.vue.cjs

@@ -0,0 +1 @@
+const e=require("./DialogCancel.vue_vue_type_script_setup_true_lang.cjs");var a=e.default;exports.default=a;

package/dist/dialog/DialogCancel.vue.d.cts

@@ -0,0 +1,31 @@
+/**
+ * Button that abandons the action, closing the dialog after the root's `cancel` event unless it was prevented.
+ *
+ * Marked with `data-skdx-dialog-cancel`, which is where an alertdialog sends initial focus.
+ *
+ * @example
+ * ```vue
+ * <SkdxDialogCancel>Keep editing</SkdxDialogCancel>
+ * ```
+ */
+type __VLS_Props = {
+    /**
+     * Disables the button natively so it neither cancels nor closes the dialog.
+     * @default false
+     */
+    disabled?: boolean;
+};
+declare var __VLS_1: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_1) => any;
+};
+declare const __VLS_component: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
+    disabled: boolean;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/dialog/DialogCancel.vue.d.ts

@@ -0,0 +1,31 @@
+/**
+ * Button that abandons the action, closing the dialog after the root's `cancel` event unless it was prevented.
+ *
+ * Marked with `data-skdx-dialog-cancel`, which is where an alertdialog sends initial focus.
+ *
+ * @example
+ * ```vue
+ * <SkdxDialogCancel>Keep editing</SkdxDialogCancel>
+ * ```
+ */
+type __VLS_Props = {
+    /**
+     * Disables the button natively so it neither cancels nor closes the dialog.
+     * @default false
+     */
+    disabled?: boolean;
+};
+declare var __VLS_1: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_1) => any;
+};
+declare const __VLS_component: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
+    disabled: boolean;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/dialog/DialogCancel.vue.js

@@ -0,0 +1 @@
+import e from"./DialogCancel.vue_vue_type_script_setup_true_lang.js";var t=e;export{t as default};

package/dist/dialog/DialogCancel.vue_vue_type_script_setup_true_lang.cjs

@@ -0,0 +1 @@
+const i=require("../utils/injectRequired.cjs"),s=require("./context.cjs");let e=require("vue");var c=["disabled","data-disabled"],o=(0,e.defineComponent)({__name:"DialogCancel",props:{disabled:{type:Boolean,default:!1}},setup(d){const t=d,l=i.injectRequired(s.DIALOG_CONTEXT,"<SkdxDialogCancel> must be used inside <SkdxDialog>.");function n(a){l.cancel?.(a)!==!1&&l.setOpen(!1)}return(a,r)=>((0,e.openBlock)(),(0,e.createElementBlock)("button",{class:"skdx-dialog__cancel","data-part":"cancel",type:"button","data-skdx-dialog-cancel":"",disabled:t.disabled,"data-disabled":t.disabled?"":void 0,onClick:n},[(0,e.renderSlot)(a.$slots,"default")],8,c))}});exports.default=o;

package/dist/dialog/DialogCancel.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1 @@
+import{injectRequired as e}from"../utils/injectRequired.js";import{DIALOG_CONTEXT as a}from"./context.js";import{createElementBlock as d,defineComponent as t,openBlock as l,renderSlot as s}from"vue";var o=["disabled","data-disabled"],i=/* @__PURE__ */t({__name:"DialogCancel",props:{disabled:{type:Boolean,default:!1}},setup(t){const i=t,n=e(a,"<SkdxDialogCancel> must be used inside <SkdxDialog>.");function c(e){!1!==n.cancel?.(e)&&n.setOpen(!1)}return(e,a)=>(l(),d("button",{class:"skdx-dialog__cancel","data-part":"cancel",type:"button","data-skdx-dialog-cancel":"",disabled:i.disabled,"data-disabled":i.disabled?"":void 0,onClick:c},[s(e.$slots,"default")],8,o))}});export{i as default};

package/dist/dialog/DialogClose.vue.d.cts

@@ -1,8 +1,4 @@
-/**
- * Button that closes the dialog when clicked. Renders inside
- * `<SkdxDialogContent>` anywhere (e.g. a footer "Cancel" button). Must be
- * used inside `<SkdxDialog>`.
- */
+/** Button that closes the dialog when clicked, rendered anywhere inside `<SkdxDialogContent>`. */
 type __VLS_Props = {};
 declare var __VLS_1: {};
 type __VLS_Slots = {} & {

package/dist/dialog/DialogClose.vue.d.ts

@@ -1,8 +1,4 @@
-/**
- * Button that closes the dialog when clicked. Renders inside
- * `<SkdxDialogContent>` anywhere (e.g. a footer "Cancel" button). Must be
- * used inside `<SkdxDialog>`.
- */
+/** Button that closes the dialog when clicked, rendered anywhere inside `<SkdxDialogContent>`. */
 type __VLS_Props = {};
 declare var __VLS_1: {};
 type __VLS_Slots = {} & {

package/dist/dialog/DialogClose.vue_vue_type_script_setup_true_lang.cjs

@@ -1 +1 @@
-const n=require("./context.cjs");let e=require("vue");var r=(0,e.defineComponent)({__name:"DialogClose",setup(s){const t=(0,e.inject)(n.DIALOG_CONTEXT);if(!t)throw new Error("<SkdxDialogClose> must be used inside <SkdxDialog>.");return(l,o)=>((0,e.openBlock)(),(0,e.createElementBlock)("button",{class:"skdx-dialog__close","data-part":"close",type:"button",onClick:o[0]||(o[0]=u=>(0,e.unref)(t).setOpen(!1))},[(0,e.renderSlot)(l.$slots,"default")]))}});exports.default=r;
+const o=require("../utils/injectRequired.cjs"),l=require("./context.cjs");let e=require("vue");var s=(0,e.defineComponent)({__name:"DialogClose",setup(u){const t=o.injectRequired(l.DIALOG_CONTEXT,"<SkdxDialogClose> must be used inside <SkdxDialog>.");return(n,r)=>((0,e.openBlock)(),(0,e.createElementBlock)("button",{class:(0,e.normalizeClass)(`skdx-${(0,e.unref)(t).family}__close`),"data-part":"close",type:"button",onClick:r[0]||(r[0]=i=>(0,e.unref)(t).setOpen(!1))},[(0,e.renderSlot)(n.$slots,"default")],2))}});exports.default=s;

package/dist/dialog/DialogClose.vue_vue_type_script_setup_true_lang.js

@@ -1 +1 @@
-import{DIALOG_CONTEXT as e}from"./context.js";import{createElementBlock as o,defineComponent as t,inject as s,openBlock as a,renderSlot as n,unref as l}from"vue";var r=/* @__PURE__ */t({__name:"DialogClose",setup(t){const r=s(e);if(!r)throw new Error("<SkdxDialogClose> must be used inside <SkdxDialog>.");return(e,t)=>(a(),o("button",{class:"skdx-dialog__close","data-part":"close",type:"button",onClick:t[0]||(t[0]=e=>l(r).setOpen(!1))},[n(e.$slots,"default")]))}});export{r as default};
+import{injectRequired as e}from"../utils/injectRequired.js";import{DIALOG_CONTEXT as s}from"./context.js";import{createElementBlock as t,defineComponent as o,normalizeClass as a,openBlock as l,renderSlot as n,unref as r}from"vue";var i=/* @__PURE__ */o({__name:"DialogClose",setup(o){const i=e(s,"<SkdxDialogClose> must be used inside <SkdxDialog>.");return(e,s)=>(l(),t("button",{class:a(`skdx-${r(i).family}__close`),"data-part":"close",type:"button",onClick:s[0]||(s[0]=e=>r(i).setOpen(!1))},[n(e.$slots,"default")],2))}});export{i as default};