@skdx/vue 0.26.0 → 0.28.0

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

@@ -1,20 +1,10 @@
 /**
  * Backdrop rendered behind `SkdxDialogContent`, typically styled to dim the
  * page. Exposes `data-state` (`open`/`closed`) for animation and mounts only
- * while open unless `forceMount` is set. Must be used inside `<SkdxDialog>`.
- *
- * `SkdxDialogContent` is a native `<dialog>` shown with `showModal()`, so the UA
- * already paints a real `::backdrop`. This part is therefore a styling hook for
- * anatomy parity with the other framework ports — the skin animates
- * `.skdx-dialog__overlay` on `data-state` — not a functional requirement. It is
- * deliberately identical to `SkdxAlertDialogOverlay` and `SkdxDrawerOverlay`,
- * which sit beside a native `<dialog>` in exactly the same way.
- *
- * `pointer-events: auto` matches React's `DialogOverlay`. Here it is inert —
- * the native `<dialog>`'s `::backdrop` is what actually catches outside clicks
- * — but it keeps the rendered style identical across ports, and it survives an
- * ancestor that sets `pointer-events: none`. Declared on the element, so a
- * consumer's fallthrough `style` merges over it and still wins.
+ * while open unless `forceMount` is set. Inert styling hook: the native
+ * `<dialog>`'s `::backdrop` already catches outside clicks. This part exists
+ * for anatomy parity across frameworks and survives ancestors with
+ * `pointer-events: none`. Must be used inside `<SkdxDialog>`.
  */
 type __VLS_Props = {
     /** Keep this overlay mounted even while the dialog is closed, instead of unmounting it. */

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

@@ -1,20 +1,10 @@
 /**
  * Backdrop rendered behind `SkdxDialogContent`, typically styled to dim the
  * page. Exposes `data-state` (`open`/`closed`) for animation and mounts only
- * while open unless `forceMount` is set. Must be used inside `<SkdxDialog>`.
- *
- * `SkdxDialogContent` is a native `<dialog>` shown with `showModal()`, so the UA
- * already paints a real `::backdrop`. This part is therefore a styling hook for
- * anatomy parity with the other framework ports — the skin animates
- * `.skdx-dialog__overlay` on `data-state` — not a functional requirement. It is
- * deliberately identical to `SkdxAlertDialogOverlay` and `SkdxDrawerOverlay`,
- * which sit beside a native `<dialog>` in exactly the same way.
- *
- * `pointer-events: auto` matches React's `DialogOverlay`. Here it is inert —
- * the native `<dialog>`'s `::backdrop` is what actually catches outside clicks
- * — but it keeps the rendered style identical across ports, and it survives an
- * ancestor that sets `pointer-events: none`. Declared on the element, so a
- * consumer's fallthrough `style` merges over it and still wins.
+ * while open unless `forceMount` is set. Inert styling hook: the native
+ * `<dialog>`'s `::backdrop` already catches outside clicks. This part exists
+ * for anatomy parity across frameworks and survives ancestors with
+ * `pointer-events: none`. Must be used inside `<SkdxDialog>`.
  */
 type __VLS_Props = {
     /** Keep this overlay mounted even while the dialog is closed, instead of unmounting it. */

package/dist/dialog/DialogRoot.vue.cjs

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

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

@@ -0,0 +1,40 @@
+import { type DialogDismiss } from './context.cjs';
+/**
+ * Dialog's state/context primitive: owns open state and provides it to
+ * `<SkdxDialogTrigger>`, `<SkdxDialogContent>`, `<SkdxDialogTitle>`,
+ * `<SkdxDialogDescription>`, and `<SkdxDialogClose>`. For full primitive
+ * composition, use `SkdxDialogRoot` from `@skdx/vue/primitives/dialog`.
+ */
+type __VLS_Props = {
+    open?: boolean;
+    defaultOpen?: boolean;
+    modal?: boolean;
+    dismiss?: DialogDismiss;
+    dismissible?: 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, {
+    "update:open": (open: boolean) => any;
+    "open-change": (open: boolean) => any;
+    "open-change-complete": (open: boolean) => 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;
+}>, {
+    dismissible: boolean;
+    open: boolean;
+    defaultOpen: boolean;
+    modal: boolean;
+    dismiss: DialogDismiss;
+}, {}, {}, {}, 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/DialogRoot.vue.d.ts

@@ -0,0 +1,40 @@
+import { type DialogDismiss } from './context.js';
+/**
+ * Dialog's state/context primitive: owns open state and provides it to
+ * `<SkdxDialogTrigger>`, `<SkdxDialogContent>`, `<SkdxDialogTitle>`,
+ * `<SkdxDialogDescription>`, and `<SkdxDialogClose>`. For full primitive
+ * composition, use `SkdxDialogRoot` from `@skdx/vue/primitives/dialog`.
+ */
+type __VLS_Props = {
+    open?: boolean;
+    defaultOpen?: boolean;
+    modal?: boolean;
+    dismiss?: DialogDismiss;
+    dismissible?: 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, {
+    "update:open": (open: boolean) => any;
+    "open-change": (open: boolean) => any;
+    "open-change-complete": (open: boolean) => 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;
+}>, {
+    dismissible: boolean;
+    open: boolean;
+    defaultOpen: boolean;
+    modal: boolean;
+    dismiss: DialogDismiss;
+}, {}, {}, {}, 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/DialogRoot.vue.js

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

package/dist/dialog/DialogRoot.vue_vue_type_script_setup_true_lang.cjs

@@ -0,0 +1 @@
+const n=require("./context.cjs"),_=require("../utils/useOpenChangeComplete.cjs");let e=require("vue");var v=(0,e.defineComponent)({__name:"DialogRoot",props:{open:{type:Boolean,default:void 0},defaultOpen:{type:Boolean,default:!1},modal:{type:Boolean,default:!0},dismiss:{default:"any"},dismissible:{type:Boolean,default:!0}},emits:["update:open","open-change","open-change-complete"],setup(d,{emit:c}){const o=d,s=c,a=(0,e.ref)(null),l=(0,e.ref)(!1),i=(0,e.ref)(!1),p=(0,e.ref)(o.defaultOpen),u=(0,e.computed)(()=>o.open??p.value),r=(0,e.computed)(()=>o.modal),f=(0,e.computed)(()=>o.dismissible?o.dismiss:"none");_.useOpenChangeComplete(u,a,t=>s("open-change-complete",t));function m(t){o.open===void 0&&(p.value=t),s("update:open",t),s("open-change",t)}return(0,e.provide)(n.DIALOG_CONTEXT,{isOpen:u,contentRef:a,isModal:r,dismiss:f,contentId:n.nextDialogId("content"),titleId:n.nextDialogId("title"),descriptionId:n.nextDialogId("description"),hasTitle:(0,e.computed)(()=>l.value),hasDescription:(0,e.computed)(()=>i.value),setHasTitle:t=>{l.value=t},setHasDescription:t=>{i.value=t},setOpen:m}),(t,g)=>(0,e.renderSlot)(t.$slots,"default")}});exports.default=v;

package/dist/dialog/DialogRoot.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1 @@
+import{DIALOG_CONTEXT as e,nextDialogId as t}from"./context.js";import{useOpenChangeComplete as o}from"../utils/useOpenChangeComplete.js";import{computed as n,defineComponent as a,provide as s,ref as i,renderSlot as l}from"vue";var p=/* @__PURE__ */a({__name:"DialogRoot",props:{open:{type:Boolean,default:void 0},defaultOpen:{type:Boolean,default:!1},modal:{type:Boolean,default:!0},dismiss:{default:"any"},dismissible:{type:Boolean,default:!0}},emits:["update:open","open-change","open-change-complete"],setup(a,{emit:p}){const d=a,u=p,m=i(null),r=i(!1),c=i(!1),f=i(d.defaultOpen),v=n(()=>d.open??f.value),g=n(()=>d.modal),h=n(()=>d.dismissible?d.dismiss:"none");return o(v,m,e=>u("open-change-complete",e)),s(e,{isOpen:v,contentRef:m,isModal:g,dismiss:h,contentId:t("content"),titleId:t("title"),descriptionId:t("description"),hasTitle:n(()=>r.value),hasDescription:n(()=>c.value),setHasTitle:e=>{r.value=e},setHasDescription:e=>{c.value=e},setOpen:function(e){void 0===d.open&&(f.value=e),u("update:open",e),u("open-change",e)}}),(e,t)=>l(e.$slots,"default")}});export{p as default};

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

@@ -1,7 +1,10 @@
 /**
- * The dialog's accessible name: renders an `<h2>` wired to `<SkdxDialogContent>`
- * via `aria-labelledby`. Every dialog should include one. Must be used
- * inside `<SkdxDialog>`.
+ * The dialog's accessible name: renders an `<h2>` wired to
+ * `<SkdxDialogContent>` via `aria-labelledby`. Every dialog should include one
+ * — a `role="dialog"` with no name announces as bare "dialog". Registers
+ * itself on mount, which is what makes Content emit `aria-labelledby` at all:
+ * without a Title, the attribute is omitted rather than point at nothing.
+ * Must be used inside `<SkdxDialog>`.
  */
 type __VLS_Props = {};
 declare var __VLS_1: {};

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

@@ -1,7 +1,10 @@
 /**
- * The dialog's accessible name: renders an `<h2>` wired to `<SkdxDialogContent>`
- * via `aria-labelledby`. Every dialog should include one. Must be used
- * inside `<SkdxDialog>`.
+ * The dialog's accessible name: renders an `<h2>` wired to
+ * `<SkdxDialogContent>` via `aria-labelledby`. Every dialog should include one
+ * — a `role="dialog"` with no name announces as bare "dialog". Registers
+ * itself on mount, which is what makes Content emit `aria-labelledby` at all:
+ * without a Title, the attribute is omitted rather than point at nothing.
+ * Must be used inside `<SkdxDialog>`.
  */
 type __VLS_Props = {};
 declare var __VLS_1: {};

package/dist/dialog/DialogTitle.vue_vue_type_script_setup_true_lang.cjs

@@ -1 +1 @@
-const i=require("./context.cjs");let e=require("vue");var l=["id"],o=(0,e.defineComponent)({__name:"DialogTitle",setup(_){const t=(0,e.inject)(i.DIALOG_CONTEXT);if(!t)throw new Error("<SkdxDialogTitle> must be used inside <SkdxDialog>.");return(r,a)=>((0,e.openBlock)(),(0,e.createElementBlock)("h2",{class:"skdx-dialog__title","data-part":"title",id:(0,e.unref)(t).titleId},[(0,e.renderSlot)(r.$slots,"default")],8,l))}});exports.default=o;
+const l=require("./context.cjs");let e=require("vue");var r=["id"],o=(0,e.defineComponent)({__name:"DialogTitle",setup(a){const t=(0,e.inject)(l.DIALOG_CONTEXT);if(!t)throw new Error("<SkdxDialogTitle> must be used inside <SkdxDialog>.");return t.setHasTitle(!0),(0,e.onUnmounted)(()=>t.setHasTitle(!1)),(i,n)=>((0,e.openBlock)(),(0,e.createElementBlock)("h2",{class:"skdx-dialog__title","data-part":"title",id:(0,e.unref)(t).titleId},[(0,e.renderSlot)(i.$slots,"default")],8,r))}});exports.default=o;

package/dist/dialog/DialogTitle.vue_vue_type_script_setup_true_lang.js

@@ -1 +1 @@
-import{DIALOG_CONTEXT as e}from"./context.js";import{createElementBlock as t,defineComponent as a,inject as o,openBlock as s,renderSlot as i,unref as l}from"vue";var r=["id"],d=/* @__PURE__ */a({__name:"DialogTitle",setup(a){const d=o(e);if(!d)throw new Error("<SkdxDialogTitle> must be used inside <SkdxDialog>.");return(e,a)=>(s(),t("h2",{class:"skdx-dialog__title","data-part":"title",id:l(d).titleId},[i(e.$slots,"default")],8,r))}});export{d as default};
+import{DIALOG_CONTEXT as e}from"./context.js";import{createElementBlock as t,defineComponent as a,inject as s,onUnmounted as o,openBlock as i,renderSlot as l,unref as n}from"vue";var r=["id"],d=/* @__PURE__ */a({__name:"DialogTitle",setup(a){const d=s(e);if(!d)throw new Error("<SkdxDialogTitle> must be used inside <SkdxDialog>.");return d.setHasTitle(!0),o(()=>d.setHasTitle(!1)),(e,a)=>(i(),t("h2",{class:"skdx-dialog__title","data-part":"title",id:n(d).titleId},[l(e.$slots,"default")],8,r))}});export{d as default};

package/dist/dialog/context.d.cts

@@ -1,13 +1,26 @@
-import type { InjectionKey, Ref } from 'vue';
+import type { ComputedRef, InjectionKey, Ref } from 'vue';
+/**
+ * Which dismissal channels may close a dialog: `'any'`, `'escape'`, `'outside'`,
+ * or `'none'`. Policy over *dismissal*, not events (all fire in every mode).
+ */
+export type DialogDismiss = 'any' | 'escape' | 'outside' | 'none';
 /** @internal Injection key a Dialog provides so its parts can read/drive shared state. */
 export interface DialogContext {
     isOpen: Readonly<Ref<boolean>>;
-    /** The native `<dialog>` panel, mirrored up by `SkdxDialogContent` so the root can watch an open change settle. */
+    /** Native `<dialog>` panel (mirrored by Content to track open state). */
     contentRef: Ref<HTMLElement | null>;
     isModal: Readonly<Ref<boolean>>;
+    /** Dismissal policy (gates channels, emits data-dismiss). */
+    dismiss: Readonly<Ref<DialogDismiss>>;
     contentId: string;
     titleId: string;
     descriptionId: string;
+    /** Whether Title is mounted (panel aria-labelledby points only if exists). */
+    hasTitle: ComputedRef<boolean>;
+    /** Whether Description is mounted (panel aria-describedby points only if exists). */
+    hasDescription: ComputedRef<boolean>;
+    setHasTitle: (present: boolean) => void;
+    setHasDescription: (present: boolean) => void;
     setOpen: (open: boolean) => void;
 }
 /** @internal Injection key the Dialog root provides so its Trigger, Content, Title, and Description share open state and part ids. */

package/dist/dialog/context.d.ts

@@ -1,13 +1,26 @@
-import type { InjectionKey, Ref } from 'vue';
+import type { ComputedRef, InjectionKey, Ref } from 'vue';
+/**
+ * Which dismissal channels may close a dialog: `'any'`, `'escape'`, `'outside'`,
+ * or `'none'`. Policy over *dismissal*, not events (all fire in every mode).
+ */
+export type DialogDismiss = 'any' | 'escape' | 'outside' | 'none';
 /** @internal Injection key a Dialog provides so its parts can read/drive shared state. */
 export interface DialogContext {
     isOpen: Readonly<Ref<boolean>>;
-    /** The native `<dialog>` panel, mirrored up by `SkdxDialogContent` so the root can watch an open change settle. */
+    /** Native `<dialog>` panel (mirrored by Content to track open state). */
     contentRef: Ref<HTMLElement | null>;
     isModal: Readonly<Ref<boolean>>;
+    /** Dismissal policy (gates channels, emits data-dismiss). */
+    dismiss: Readonly<Ref<DialogDismiss>>;
     contentId: string;
     titleId: string;
     descriptionId: string;
+    /** Whether Title is mounted (panel aria-labelledby points only if exists). */
+    hasTitle: ComputedRef<boolean>;
+    /** Whether Description is mounted (panel aria-describedby points only if exists). */
+    hasDescription: ComputedRef<boolean>;
+    setHasTitle: (present: boolean) => void;
+    setHasDescription: (present: boolean) => void;
     setOpen: (open: boolean) => void;
 }
 /** @internal Injection key the Dialog root provides so its Trigger, Content, Title, and Description share open state and part ids. */

package/dist/dialog/focusTargets.cjs

@@ -0,0 +1 @@
+const o=require("../utils/tabbable.cjs"),a=require("../utils/is-dev-mode.cjs");function n(e,t,i){if(!t)return null;let l;try{l=e.querySelector(t)}catch{return a.isDevMode()&&console.warn(`[skdx] Dialog: ${i}="${t}" is not a valid CSS selector. Falling back to the default focus target.`),null}return!l&&a.isDevMode()&&console.warn(c(i,t)),l}function r(e,t){const i=n(e,t,"initialFocus");if(i){i.focus({preventScroll:!0});return}if(e.contains(document.activeElement))return;const l=e.querySelector(o.TABBABLE_SELECTOR)??e;l===e&&e.tabIndex<0&&(e.tabIndex=-1),l.focus?.({preventScroll:!0})}function u(e){const t=n(document,e,"finalFocus");return t?(t.focus({preventScroll:!0}),!0):!1}function c(e,t){return e==="initialFocus"?`[skdx] Dialog: initialFocus="${t}" matched no element inside the dialog panel. Falling back to the first tabbable element, then the panel itself.`:`[skdx] Dialog: finalFocus="${t}" matched no element in the document. Falling back to the element that was focused before the dialog opened.`}exports.applyFinalFocus=u;exports.applyInitialFocus=r;exports.resolveFocusSelector=n;

package/dist/dialog/focusTargets.d.cts

@@ -0,0 +1,20 @@
+/**
+ * Resolves `SkdxDialogContent`'s `initial-focus` / `final-focus` selectors.
+ * Uses CSS selector strings to survive as HTML attributes across all packages.
+ * A miss falls back to the default focus target and warns on console.
+ * @internal
+ */
+export declare function resolveFocusSelector(root: ParentNode, selector: string | undefined, prop: 'initialFocus' | 'finalFocus'): HTMLElement | null;
+/**
+ * Places initial focus for a native-`<dialog>` after `showModal()`.
+ * Only called when a selector is given; falls back to the first tabbable
+ * element, then the panel itself.
+ * @internal
+ */
+export declare function applyInitialFocus(content: HTMLElement, selector: string): void;
+/**
+ * Sends focus to the `final-focus` target, resolved at document level since
+ * the panel may be closed by then. Reports whether focus was placed.
+ * @internal
+ */
+export declare function applyFinalFocus(selector: string | undefined): boolean;

package/dist/dialog/focusTargets.d.ts

@@ -0,0 +1,20 @@
+/**
+ * Resolves `SkdxDialogContent`'s `initial-focus` / `final-focus` selectors.
+ * Uses CSS selector strings to survive as HTML attributes across all packages.
+ * A miss falls back to the default focus target and warns on console.
+ * @internal
+ */
+export declare function resolveFocusSelector(root: ParentNode, selector: string | undefined, prop: 'initialFocus' | 'finalFocus'): HTMLElement | null;
+/**
+ * Places initial focus for a native-`<dialog>` after `showModal()`.
+ * Only called when a selector is given; falls back to the first tabbable
+ * element, then the panel itself.
+ * @internal
+ */
+export declare function applyInitialFocus(content: HTMLElement, selector: string): void;
+/**
+ * Sends focus to the `final-focus` target, resolved at document level since
+ * the panel may be closed by then. Reports whether focus was placed.
+ * @internal
+ */
+export declare function applyFinalFocus(selector: string | undefined): boolean;

package/dist/dialog/focusTargets.js

@@ -0,0 +1 @@
+import{TABBABLE_SELECTOR as e}from"../utils/tabbable.js";import{isDevMode as t}from"../utils/is-dev-mode.js";function n(e,n,o){if(!n)return null;let l;try{l=e.querySelector(n)}catch{return t()&&console.warn(`[skdx] Dialog: ${o}="${n}" is not a valid CSS selector. Falling back to the default focus target.`),null}return!l&&t()&&console.warn(function(e,t){return"initialFocus"===e?`[skdx] Dialog: initialFocus="${t}" matched no element inside the dialog panel. Falling back to the first tabbable element, then the panel itself.`:`[skdx] Dialog: finalFocus="${t}" matched no element in the document. Falling back to the element that was focused before the dialog opened.`}(o,n)),l}function o(t,o){const l=n(t,o,"initialFocus");if(l)return void l.focus({preventScroll:!0});if(t.contains(document.activeElement))return;const a=t.querySelector(e)??t;a===t&&t.tabIndex<0&&(t.tabIndex=-1),a.focus?.({preventScroll:!0})}function l(e){const t=n(document,e,"finalFocus");return!!t&&(t.focus({preventScroll:!0}),!0)}export{l as applyFinalFocus,o as applyInitialFocus,n as resolveFocusSelector};

package/dist/dialog/index.cjs

@@ -1 +1 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./Dialog.vue.cjs"),r=require("./DialogTrigger.vue.cjs"),i=require("./DialogOverlay.vue.cjs"),o=require("./DialogContent.vue.cjs"),l=require("./DialogTitle.vue.cjs"),t=require("./DialogDescription.vue.cjs"),a=require("./DialogClose.vue.cjs");exports.SkdxDialog=e.default;exports.SkdxDialogClose=a.default;exports.SkdxDialogContent=o.default;exports.SkdxDialogDescription=t.default;exports.SkdxDialogOverlay=i.default;exports.SkdxDialogTitle=l.default;exports.SkdxDialogTrigger=r.default;
+Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./Dialog.vue.cjs");exports.SkdxDialog=e.default;

package/dist/dialog/index.d.cts

@@ -1,7 +1,2 @@
 export { default as SkdxDialog } from './Dialog.vue.cjs';
-export { default as SkdxDialogTrigger } from './DialogTrigger.vue.cjs';
-export { default as SkdxDialogOverlay } from './DialogOverlay.vue.cjs';
-export { default as SkdxDialogContent } from './DialogContent.vue.cjs';
-export { default as SkdxDialogTitle } from './DialogTitle.vue.cjs';
-export { default as SkdxDialogDescription } from './DialogDescription.vue.cjs';
-export { default as SkdxDialogClose } from './DialogClose.vue.cjs';
+export type { DialogDismiss } from './context.cjs';

package/dist/dialog/index.d.ts

@@ -1,7 +1,2 @@
 export { default as SkdxDialog } from './Dialog.vue.js';
-export { default as SkdxDialogTrigger } from './DialogTrigger.vue.js';
-export { default as SkdxDialogOverlay } from './DialogOverlay.vue.js';
-export { default as SkdxDialogContent } from './DialogContent.vue.js';
-export { default as SkdxDialogTitle } from './DialogTitle.vue.js';
-export { default as SkdxDialogDescription } from './DialogDescription.vue.js';
-export { default as SkdxDialogClose } from './DialogClose.vue.js';
+export type { DialogDismiss } from './context.js';

package/dist/dialog/index.js

@@ -1 +1 @@
-import o from"./Dialog.vue.js";import i from"./DialogTrigger.vue.js";import a from"./DialogOverlay.vue.js";import r from"./DialogContent.vue.js";import e from"./DialogTitle.vue.js";import l from"./DialogDescription.vue.js";import g from"./DialogClose.vue.js";export{o as SkdxDialog,g as SkdxDialogClose,r as SkdxDialogContent,l as SkdxDialogDescription,a as SkdxDialogOverlay,e as SkdxDialogTitle,i as SkdxDialogTrigger};
+import o from"./Dialog.vue.js";export{o as SkdxDialog};

package/dist/dialog/primitives.cjs

@@ -0,0 +1 @@
+Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./DialogClose.vue.cjs"),r=require("./DialogContent.vue.cjs"),i=require("./DialogDescription.vue.cjs"),o=require("./DialogOverlay.vue.cjs"),l=require("./DialogTitle.vue.cjs"),t=require("./DialogRoot.vue.cjs"),a=require("./DialogTrigger.vue.cjs");exports.SkdxDialogClose=e.default;exports.SkdxDialogContent=r.default;exports.SkdxDialogDescription=i.default;exports.SkdxDialogOverlay=o.default;exports.SkdxDialogRoot=t.default;exports.SkdxDialogTitle=l.default;exports.SkdxDialogTrigger=a.default;

package/dist/dialog/primitives.d.cts

@@ -0,0 +1,30 @@
+/**
+ * Primitives for `SkdxDialog` — composable building blocks.
+ * Use these when you need a custom layout beyond the derived recipe.
+ *
+ * @example
+ * ```vue
+ * <script setup lang="ts">
+ * import { SkdxDialogClose, SkdxDialogContent, SkdxDialogDescription, SkdxDialogOverlay, SkdxDialogRoot, SkdxDialogTitle, SkdxDialogTrigger } from '@skdx/vue/primitives/dialog';
+ * </script>
+ *
+ * <template>
+ *   <SkdxDialogRoot v-model:open="open">
+ *     <SkdxDialogTrigger>Open</SkdxDialogTrigger>
+ *     <SkdxDialogOverlay />
+ *     <SkdxDialogContent>
+ *       <SkdxDialogTitle>Edit profile</SkdxDialogTitle>
+ *       <SkdxDialogDescription>Make changes to your profile here.</SkdxDialogDescription>
+ *       <SkdxDialogClose>Close</SkdxDialogClose>
+ *     </SkdxDialogContent>
+ *   </SkdxDialogRoot>
+ * </template>
+ * ```
+ */
+export { default as SkdxDialogRoot } from './DialogRoot.vue.cjs';
+export { default as SkdxDialogClose } from './DialogClose.vue.cjs';
+export { default as SkdxDialogContent } from './DialogContent.vue.cjs';
+export { default as SkdxDialogDescription } from './DialogDescription.vue.cjs';
+export { default as SkdxDialogOverlay } from './DialogOverlay.vue.cjs';
+export { default as SkdxDialogTitle } from './DialogTitle.vue.cjs';
+export { default as SkdxDialogTrigger } from './DialogTrigger.vue.cjs';

package/dist/dialog/primitives.d.ts

@@ -0,0 +1,30 @@
+/**
+ * Primitives for `SkdxDialog` — composable building blocks.
+ * Use these when you need a custom layout beyond the derived recipe.
+ *
+ * @example
+ * ```vue
+ * <script setup lang="ts">
+ * import { SkdxDialogClose, SkdxDialogContent, SkdxDialogDescription, SkdxDialogOverlay, SkdxDialogRoot, SkdxDialogTitle, SkdxDialogTrigger } from '@skdx/vue/primitives/dialog';
+ * </script>
+ *
+ * <template>
+ *   <SkdxDialogRoot v-model:open="open">
+ *     <SkdxDialogTrigger>Open</SkdxDialogTrigger>
+ *     <SkdxDialogOverlay />
+ *     <SkdxDialogContent>
+ *       <SkdxDialogTitle>Edit profile</SkdxDialogTitle>
+ *       <SkdxDialogDescription>Make changes to your profile here.</SkdxDialogDescription>
+ *       <SkdxDialogClose>Close</SkdxDialogClose>
+ *     </SkdxDialogContent>
+ *   </SkdxDialogRoot>
+ * </template>
+ * ```
+ */
+export { default as SkdxDialogRoot } from './DialogRoot.vue.js';
+export { default as SkdxDialogClose } from './DialogClose.vue.js';
+export { default as SkdxDialogContent } from './DialogContent.vue.js';
+export { default as SkdxDialogDescription } from './DialogDescription.vue.js';
+export { default as SkdxDialogOverlay } from './DialogOverlay.vue.js';
+export { default as SkdxDialogTitle } from './DialogTitle.vue.js';
+export { default as SkdxDialogTrigger } from './DialogTrigger.vue.js';

package/dist/dialog/primitives.js

@@ -0,0 +1 @@
+import o from"./DialogClose.vue.js";import i from"./DialogContent.vue.js";import a from"./DialogDescription.vue.js";import r from"./DialogOverlay.vue.js";import e from"./DialogTitle.vue.js";import l from"./DialogRoot.vue.js";import g from"./DialogTrigger.vue.js";export{o as SkdxDialogClose,i as SkdxDialogContent,a as SkdxDialogDescription,r as SkdxDialogOverlay,l as SkdxDialogRoot,e as SkdxDialogTitle,g as SkdxDialogTrigger};

package/dist/drawer/Drawer.vue.d.cts

@@ -1,39 +1,36 @@
-import { type DrawerPlacement } from './context.cjs';
+import type { DrawerDismiss, DrawerPlacement } from './context.cjs';
 /**
- * The Vue implementation of the shared Drawer contract (see `@skdx/shared`'s
- * `drawerContract`) — a panel anchored to one edge of the viewport. Renders no
- * DOM element of its own: it owns open state, placement and modality and
- * `provide()`s them to `<SkdxDrawerTrigger>` / `<SkdxDrawerPortal>` /
- * `<SkdxDrawerOverlay>` / `<SkdxDrawerContent>` / `<SkdxDrawerTitle>` /
- * `<SkdxDrawerDescription>` / `<SkdxDrawerClose>`.
- *
- * Unlike `<SkdxDialogContent>`, `SkdxDrawerContent` is **not** a native
- * `<dialog>` — it is a plain portalled element with a hand-written focus trap
- * (`useFocusTrap`), exactly as React does. `drawerContract`'s doc comment has
- * the full reasoning; the short version is that `showModal()`'s uncancelable
- * focus move would make `open-auto-focus` mean something different here than
- * in React, and a native backdrop cannot be a styleable Overlay part.
+ * Panel anchored to one edge of the viewport with slide-in/out animation.
+ * Works controlled (`v-model:open`) or uncontrolled (`default-open`).
+ * Renders title, description, body content, optional footer, and optional close
+ * button. Like AlertDialog but positioned, and with configurable dismissal
+ * policy.
  *
  * Emits `open-change` the instant the state flips and `open-change-complete`
- * once the change has finished on screen — after `SkdxDrawerContent`'s enter
- * or exit animation ends, or in the same task when it declares none.
- *
- * Works controlled (`v-model:open`) or uncontrolled (`default-open`).
+ * once the animation finishes — after `SkdxDrawerContent`'s slide-in or
+ * slide-out animation ends, or immediately when it declares none.
  *
  * @example
  * ```vue
- * <SkdxDrawer placement="start">
- *   <SkdxDrawerTrigger>Menu</SkdxDrawerTrigger>
- *   <SkdxDrawerPortal>
- *     <SkdxDrawerOverlay />
- *     <SkdxDrawerContent>
- *       <SkdxDrawerTitle>Navigation</SkdxDrawerTitle>
- *       <SkdxDrawerDescription>Jump to a section.</SkdxDrawerDescription>
- *       <SkdxDrawerClose>Close</SkdxDrawerClose>
- *     </SkdxDrawerContent>
- *   </SkdxDrawerPortal>
+ * <SkdxDrawer v-model:open="open" placement="start" title="Navigation">
+ *   <nav>…</nav>
  * </SkdxDrawer>
  * ```
+ *
+ * @example Full primitive composition —
+ * `import * as Drawer from '@skdx/vue/primitives/drawer'`:
+ * ```vue
+ * <Drawer.Root placement="start">
+ *   <Drawer.Trigger>Menu</Drawer.Trigger>
+ *   <Drawer.Portal>
+ *     <Drawer.Overlay />
+ *     <Drawer.Content>
+ *       <Drawer.Title>Navigation</Drawer.Title>
+ *       <Drawer.Close>Close</Drawer.Close>
+ *     </Drawer.Content>
+ *   </Drawer.Portal>
+ * </Drawer.Root>
+ * ```
  */
 type __VLS_Props = {
     /** Controlled open state. Pair with `v-model:open` or `@open-change`. */
@@ -50,10 +47,46 @@ type __VLS_Props = {
      * page interactive but keeps Escape and outside-interaction dismissal.
      */
     modal?: boolean;
+    /**
+     * Which dismissal channels are allowed to close the drawer: `'any'` — both;
+     * `'escape'` — the Escape key only; `'outside'` — an outside pointer-down
+     * or focus move only; `'none'` — neither, leaving the drawer closable only
+     * through `<SkdxDrawerClose>`, `<SkdxDrawerTrigger>` or the `open` prop.
+     *
+     * A policy, not a mute switch: `@escape-key-down`, `@pointer-down-outside`,
+     * `@focus-outside` and `@interact-outside` all still fire under every
+     * value, and `preventDefault()` still vetoes an attempt the policy allows.
+     *
+     * Unlike Dialog, a drawer dismisses on an outside interaction whether or
+     * not it is modal — so `:modal="false"` does not switch outside dismissal
+     * off, and this prop is the only declarative way to do it. Reflected as
+     * `data-dismiss` on `<SkdxDrawerContent>`; this root renders no element.
+     */
+    dismiss?: DrawerDismiss;
+    /**
+     * Title rendered by the derived anatomy as `SkdxDrawerTitle`.
+     * @default undefined — no title is rendered.
+     */
+    title?: string;
+    /**
+     * Description rendered by the derived anatomy as `SkdxDrawerDescription`.
+     * @default undefined — no description is rendered.
+     */
+    description?: string;
+    /**
+     * Whether the drawer can be dismissed at all. `false` forces `dismiss` to
+     * `'none'` regardless of that prop's own value **and** withholds the
+     * derived close button, leaving `open` and `SkdxDrawerTrigger` as the only
+     * ways out.
+     * @default true
+     */
+    dismissible?: boolean;
 };
-declare var __VLS_1: {};
+declare var __VLS_14: {}, __VLS_16: {};
 type __VLS_Slots = {} & {
-    default?: (props: typeof __VLS_1) => any;
+    default?: (props: typeof __VLS_14) => any;
+} & {
+    footer?: (props: typeof __VLS_16) => any;
 };
 declare const __VLS_component: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     "update:open": (open: boolean) => any;
@@ -64,9 +97,13 @@ declare const __VLS_component: import("vue").DefineComponent<__VLS_Props, {}, {}
     "onOpen-change"?: ((open: boolean) => any) | undefined;
     "onOpen-change-complete"?: ((open: boolean) => any) | undefined;
 }>, {
+    title: string;
+    description: string;
+    dismissible: boolean;
     open: boolean;
     defaultOpen: boolean;
     modal: boolean;
+    dismiss: DrawerDismiss;
     placement: DrawerPlacement;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;