@skdx/vue 0.27.0 → 0.28.0

package/dist/speed-dial/SpeedDialRoot.vue.d.ts

@@ -0,0 +1,74 @@
+import { type SpeedDialDirection } from './context.js';
+/**
+ * FAB menu root; owns open state. Menu pattern with direction-based geometry.
+ * Controlled (`v-model:open`) or uncontrolled. Supports hover open/close with delays.
+ * @example
+ * ```vue
+ * <SkdxSpeedDialRoot direction="up">
+ *   <SkdxSpeedDialTrigger>+</SkdxSpeedDialTrigger>
+ *   <SkdxSpeedDialPortal>
+ *     <SkdxSpeedDialContent>
+ *       <SkdxSpeedDialItem @select="share">Share</SkdxSpeedDialItem>
+ *     </SkdxSpeedDialContent>
+ *   </SkdxSpeedDialPortal>
+ * </SkdxSpeedDialRoot>
+ * ```
+ */
+type __VLS_Props = {
+    /** Whether actions are revealed for controlled usage.
+     * @default undefined
+     */
+    open?: boolean;
+    /** Whether actions are revealed initially for uncontrolled usage.
+     * @default false
+     */
+    defaultOpen?: boolean;
+    /** Direction actions fan out (up/down/left/right). Decides geometry and navigation axis.
+     * @default 'up'
+     */
+    direction?: SpeedDialDirection;
+    /** Open on pointer-enter of trigger (not just click). Touch never takes hover.
+     * @default false
+     */
+    openOnHover?: boolean;
+    /** Milliseconds dial stays open after pointer leaves. Allows crossing gap to item.
+     * @default 300
+     */
+    hoverCloseDelay?: number;
+    /** Milliseconds pointer must rest before fan opens. Prevents accidental opening.
+     * @default 0
+     */
+    hoverOpenDelay?: number;
+    /** Blocks dial from opening; closes if already open.
+     * @default false
+     */
+    disabled?: boolean;
+};
+declare var __VLS_5: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_5) => 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;
+}>, {
+    disabled: boolean;
+    open: boolean;
+    defaultOpen: boolean;
+    direction: SpeedDialDirection;
+    openOnHover: boolean;
+    hoverCloseDelay: number;
+    hoverOpenDelay: number;
+}, {}, {}, {}, 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/speed-dial/SpeedDialRoot.vue.js

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

package/dist/speed-dial/SpeedDialRoot.vue_vue_type_script_setup_true_lang.cjs

@@ -0,0 +1 @@
+const T=require("../utils/useOpenChangeComplete.cjs"),y=require("../utils/PopperRoot.vue.cjs"),s=require("./context.cjs");let e=require("vue");var q=(0,e.defineComponent)({__name:"SpeedDialRoot",props:{open:{type:Boolean,default:void 0},defaultOpen:{type:Boolean,default:!1},direction:{default:"up"},openOnHover:{type:Boolean,default:!1},hoverCloseDelay:{default:300},hoverOpenDelay:{default:0},disabled:{type:Boolean,default:!1}},emits:["update:open","open-change","open-change-complete"],setup(_,{emit:h}){const o=_,i=h,f=(0,e.ref)(null),p=(0,e.ref)(null),v=(0,e.ref)(o.defaultOpen),a=(0,e.computed)(()=>o.open??v.value);T.useOpenChangeComplete(a,p,t=>i("open-change-complete",t));let c,d;function n(){clearTimeout(c),c=void 0}function u(){clearTimeout(d),d=void 0}(0,e.onBeforeUnmount)(()=>{n(),u()});const m={current:"programmatic"};function r(t,l="programmatic"){n(),u(),!(t&&o.disabled)&&t!==a.value&&(m.current=l,o.open===void 0&&(v.value=t),i("update:open",t),i("open-change",t))}(0,e.watch)(()=>o.disabled,t=>{if(!t||!a.value)return;const l=document.activeElement,D=!!l&&p.value?.contains(l)===!0;r(!1),D&&f.value?.focus()});function g(){n()}function O(){if(n(),u(),o.hoverOpenDelay<=0){r(!0,"hover");return}d=setTimeout(()=>r(!0,"hover"),o.hoverOpenDelay)}function C(){n(),u(),c=setTimeout(()=>r(!1),o.hoverCloseDelay)}return(0,e.provide)(s.SPEED_DIAL_CONTEXT,{triggerRef:f,contentRef:p,contentId:s.nextSpeedDialContentId(),triggerId:s.nextSpeedDialTriggerId(),open:a,direction:(0,e.computed)(()=>o.direction),disabled:(0,e.computed)(()=>o.disabled),openOnHover:(0,e.computed)(()=>o.openOnHover),openReason:m,setOpen:r,onPointerEnter:g,onHoverOpen:O,onPointerLeave:C}),(t,l)=>((0,e.openBlock)(),(0,e.createBlock)(y.default,null,{default:(0,e.withCtx)(()=>[(0,e.renderSlot)(t.$slots,"default")]),_:3}))}});exports.default=q;

package/dist/speed-dial/SpeedDialRoot.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1 @@
+import{useOpenChangeComplete as e}from"../utils/useOpenChangeComplete.js";import o from"../utils/PopperRoot.vue.js";import{SPEED_DIAL_CONTEXT as n,nextSpeedDialContentId as t,nextSpeedDialTriggerId as a}from"./context.js";import{computed as l,createBlock as r,defineComponent as p,onBeforeUnmount as i,openBlock as u,provide as d,ref as s,renderSlot as c,watch as f,withCtx as m}from"vue";var v=/* @__PURE__ */p({__name:"SpeedDialRoot",props:{open:{type:Boolean,default:void 0},defaultOpen:{type:Boolean,default:!1},direction:{default:"up"},openOnHover:{type:Boolean,default:!1},hoverCloseDelay:{default:300},hoverOpenDelay:{default:0},disabled:{type:Boolean,default:!1}},emits:["update:open","open-change","open-change-complete"],setup(p,{emit:v}){const h=p,g=v,O=s(null),C=s(null),D=s(h.defaultOpen),y=l(()=>h.open??D.value);let B,T;function b(){clearTimeout(B),B=void 0}function x(){clearTimeout(T),T=void 0}e(y,C,e=>g("open-change-complete",e)),i(()=>{b(),x()});const E={current:"programmatic"};function I(e,o="programmatic"){b(),x(),(!e||!h.disabled)&&e!==y.value&&(E.current=o,void 0===h.open&&(D.value=e),g("update:open",e),g("open-change",e))}return f(()=>h.disabled,e=>{if(!e||!y.value)return;const o=document.activeElement,n=!!o&&!0===C.value?.contains(o);I(!1),n&&O.value?.focus()}),d(n,{triggerRef:O,contentRef:C,contentId:t(),triggerId:a(),open:y,direction:l(()=>h.direction),disabled:l(()=>h.disabled),openOnHover:l(()=>h.openOnHover),openReason:E,setOpen:I,onPointerEnter:function(){b()},onHoverOpen:function(){b(),x(),h.hoverOpenDelay<=0?I(!0,"hover"):T=setTimeout(()=>I(!0,"hover"),h.hoverOpenDelay)},onPointerLeave:function(){b(),x(),B=setTimeout(()=>I(!1),h.hoverCloseDelay)}}),(e,n)=>(u(),r(o,null,{default:m(()=>[c(e.$slots,"default")]),_:3}))}});export{v as default};

package/dist/speed-dial/SpeedDialTrigger.vue.d.cts

@@ -1,17 +1,8 @@
 /**
- * The floating action button: toggles the fan on click, opens it with the
- * arrow keys along the fan's axis, and doubles as the positioning anchor for
- * `SkdxSpeedDialContent`. Sets `aria-haspopup="menu"`, `aria-expanded`,
- * `aria-controls`, `data-state` (`open`/`closed`) and `data-direction`, the
- * last so the icon can rotate from CSS alone.
- *
- * With `open-on-hover` on the root it also opens on pointer-enter (never for
- * touch pointers, which have no hover) and starts the close countdown on
- * pointer-leave.
- *
- * Give it an accessible name. A speed dial trigger is usually a bare `+`
- * glyph, which tells a screen-reader user nothing about what it opens. Must be
- * used inside `SkdxSpeedDial`.
+ * FAB toggling fan. Opens with arrows along axis, positioning anchor for
+ * content. Has aria-haspopup/aria-expanded/aria-controls/data-state/
+ * data-direction (for CSS rotation). Open-on-hover with pointer. Name it
+ * (bare `+` is unhelpful).
  *
  * @example
  * ```vue

package/dist/speed-dial/SpeedDialTrigger.vue.d.ts

@@ -1,17 +1,8 @@
 /**
- * The floating action button: toggles the fan on click, opens it with the
- * arrow keys along the fan's axis, and doubles as the positioning anchor for
- * `SkdxSpeedDialContent`. Sets `aria-haspopup="menu"`, `aria-expanded`,
- * `aria-controls`, `data-state` (`open`/`closed`) and `data-direction`, the
- * last so the icon can rotate from CSS alone.
- *
- * With `open-on-hover` on the root it also opens on pointer-enter (never for
- * touch pointers, which have no hover) and starts the close countdown on
- * pointer-leave.
- *
- * Give it an accessible name. A speed dial trigger is usually a bare `+`
- * glyph, which tells a screen-reader user nothing about what it opens. Must be
- * used inside `SkdxSpeedDial`.
+ * FAB toggling fan. Opens with arrows along axis, positioning anchor for
+ * content. Has aria-haspopup/aria-expanded/aria-controls/data-state/
+ * data-direction (for CSS rotation). Open-on-hover with pointer. Name it
+ * (bare `+` is unhelpful).
  *
  * @example
  * ```vue

package/dist/speed-dial/SpeedDialTrigger.vue_vue_type_script_setup_true_lang.cjs

@@ -1 +1 @@
-const f=require("../utils/popper.cjs"),v=require("./context.cjs");let r=require("vue");var _=["aria-expanded","aria-controls","data-state","data-direction","disabled","data-disabled"],h=(0,r.defineComponent)({__name:"SpeedDialTrigger",props:{disabled:{type:Boolean,default:!1}},setup(i){const d={up:["ArrowUp","ArrowDown"],down:["ArrowUp","ArrowDown"],left:["ArrowLeft","ArrowRight"],right:["ArrowLeft","ArrowRight"]},l=i,e=(0,r.inject)(v.SPEED_DIAL_CONTEXT);if(!e)throw new Error("SkdxSpeedDialTrigger must be used within SkdxSpeedDial.");const n=(0,r.inject)(f.POPPER_CONTEXT);if(!n)throw new Error("SkdxSpeedDialTrigger must be used within SkdxSpeedDial.");const o=(0,r.ref)(null),a=(0,r.computed)(()=>e.disabled.value||l.disabled);(0,r.onMounted)(()=>{e.triggerRef.value=o.value,n.setAnchor(o.value)}),(0,r.onBeforeUnmount)(()=>{n.anchor.value===o.value&&n.setAnchor(null)});function u(){e.setOpen(!e.open.value)}function p(t){d[e.direction.value].includes(t.key)&&(t.preventDefault(),e.setOpen(!0))}function s(t){!e.openOnHover.value||t.pointerType==="touch"||(e.onPointerEnter(),e.setOpen(!0))}function c(t){!e.openOnHover.value||t.pointerType==="touch"||e.onPointerLeave()}return(t,w)=>((0,r.openBlock)(),(0,r.createElementBlock)("button",{class:"skdx-speed-dial__trigger","data-part":"trigger",ref_key:"elRef",ref:o,type:"button","aria-haspopup":"menu","aria-expanded":(0,r.unref)(e).open.value,"aria-controls":(0,r.unref)(e).contentId,"data-state":(0,r.unref)(e).open.value?"open":"closed","data-direction":(0,r.unref)(e).direction.value,disabled:a.value,"data-disabled":a.value?"":void 0,onClick:u,onKeydown:p,onPointerenter:s,onPointerleave:c},[(0,r.renderSlot)(t.$slots,"default")],40,_))}});exports.default=h;
+const f=require("../utils/popper.cjs"),v=require("./context.cjs");let r=require("vue");var _=["id","aria-expanded","aria-controls","data-state","data-direction","disabled","data-disabled"],g=(0,r.defineComponent)({__name:"SpeedDialTrigger",props:{disabled:{type:Boolean,default:!1}},setup(i){const d={up:["ArrowUp","ArrowDown"],down:["ArrowUp","ArrowDown"],left:["ArrowLeft","ArrowRight"],right:["ArrowLeft","ArrowRight"]},l=i,e=(0,r.inject)(v.SPEED_DIAL_CONTEXT);if(!e)throw new Error("SkdxSpeedDialTrigger must be used within SkdxSpeedDial.");const t=(0,r.inject)(f.POPPER_CONTEXT);if(!t)throw new Error("SkdxSpeedDialTrigger must be used within SkdxSpeedDial.");const o=(0,r.ref)(null),a=(0,r.computed)(()=>e.disabled.value||l.disabled);(0,r.onMounted)(()=>{e.triggerRef.value=o.value,t.setAnchor(o.value)}),(0,r.onBeforeUnmount)(()=>{t.anchor.value===o.value&&t.setAnchor(null)});function u(){e.setOpen(!e.open.value,"pointer")}function p(n){d[e.direction.value].includes(n.key)&&(n.preventDefault(),e.setOpen(!0,"keyboard"))}function s(n){!e.openOnHover.value||n.pointerType==="touch"||e.onHoverOpen()}function c(n){!e.openOnHover.value||n.pointerType==="touch"||e.onPointerLeave()}return(n,h)=>((0,r.openBlock)(),(0,r.createElementBlock)("button",{class:"skdx-speed-dial__trigger","data-part":"trigger",ref_key:"elRef",ref:o,type:"button",id:(0,r.unref)(e).triggerId,"aria-haspopup":"menu","aria-expanded":(0,r.unref)(e).open.value,"aria-controls":(0,r.unref)(e).contentId,"data-state":(0,r.unref)(e).open.value?"open":"closed","data-direction":(0,r.unref)(e).direction.value,disabled:a.value,"data-disabled":a.value?"":void 0,onClick:u,onKeydown:p,onPointerenter:s,onPointerleave:c},[(0,r.renderSlot)(n.$slots,"default")],40,_))}});exports.default=g;

package/dist/speed-dial/SpeedDialTrigger.vue_vue_type_script_setup_true_lang.js

@@ -1 +1 @@
-import{POPPER_CONTEXT as e}from"../utils/popper.js";import{SPEED_DIAL_CONTEXT as o}from"./context.js";import{computed as t,createElementBlock as a,defineComponent as r,inject as n,onBeforeUnmount as i,onMounted as d,openBlock as l,ref as s,renderSlot as u,unref as p}from"vue";var c=["aria-expanded","aria-controls","data-state","data-direction","disabled","data-disabled"],f=/* @__PURE__ */r({__name:"SpeedDialTrigger",props:{disabled:{type:Boolean,default:!1}},setup(r){const f={up:["ArrowUp","ArrowDown"],down:["ArrowUp","ArrowDown"],left:["ArrowLeft","ArrowRight"],right:["ArrowLeft","ArrowRight"]},v=r,w=n(o);if(!w)throw new Error("SkdxSpeedDialTrigger must be used within SkdxSpeedDial.");const g=n(e);if(!g)throw new Error("SkdxSpeedDialTrigger must be used within SkdxSpeedDial.");const m=s(null),h=t(()=>w.disabled.value||v.disabled);function b(){w.setOpen(!w.open.value)}function A(e){f[w.direction.value].includes(e.key)&&(e.preventDefault(),w.setOpen(!0))}function S(e){!w.openOnHover.value||"touch"===e.pointerType||(w.onPointerEnter(),w.setOpen(!0))}function k(e){!w.openOnHover.value||"touch"===e.pointerType||w.onPointerLeave()}return d(()=>{w.triggerRef.value=m.value,g.setAnchor(m.value)}),i(()=>{g.anchor.value===m.value&&g.setAnchor(null)}),(e,o)=>(l(),a("button",{class:"skdx-speed-dial__trigger","data-part":"trigger",ref_key:"elRef",ref:m,type:"button","aria-haspopup":"menu","aria-expanded":p(w).open.value,"aria-controls":p(w).contentId,"data-state":p(w).open.value?"open":"closed","data-direction":p(w).direction.value,disabled:h.value,"data-disabled":h.value?"":void 0,onClick:b,onKeydown:A,onPointerenter:S,onPointerleave:k},[u(e.$slots,"default")],40,c))}});export{f as default};
+import{POPPER_CONTEXT as e}from"../utils/popper.js";import{SPEED_DIAL_CONTEXT as o}from"./context.js";import{computed as r,createElementBlock as t,defineComponent as a,inject as n,onBeforeUnmount as i,onMounted as d,openBlock as l,ref as s,renderSlot as p,unref as u}from"vue";var c=["id","aria-expanded","aria-controls","data-state","data-direction","disabled","data-disabled"],f=/* @__PURE__ */a({__name:"SpeedDialTrigger",props:{disabled:{type:Boolean,default:!1}},setup(a){const f={up:["ArrowUp","ArrowDown"],down:["ArrowUp","ArrowDown"],left:["ArrowLeft","ArrowRight"],right:["ArrowLeft","ArrowRight"]},v=a,w=n(o);if(!w)throw new Error("SkdxSpeedDialTrigger must be used within SkdxSpeedDial.");const g=n(e);if(!g)throw new Error("SkdxSpeedDialTrigger must be used within SkdxSpeedDial.");const m=s(null),h=r(()=>w.disabled.value||v.disabled);function b(){w.setOpen(!w.open.value,"pointer")}function k(e){f[w.direction.value].includes(e.key)&&(e.preventDefault(),w.setOpen(!0,"keyboard"))}function A(e){!w.openOnHover.value||"touch"===e.pointerType||w.onHoverOpen()}function S(e){!w.openOnHover.value||"touch"===e.pointerType||w.onPointerLeave()}return d(()=>{w.triggerRef.value=m.value,g.setAnchor(m.value)}),i(()=>{g.anchor.value===m.value&&g.setAnchor(null)}),(e,o)=>(l(),t("button",{class:"skdx-speed-dial__trigger","data-part":"trigger",ref_key:"elRef",ref:m,type:"button",id:u(w).triggerId,"aria-haspopup":"menu","aria-expanded":u(w).open.value,"aria-controls":u(w).contentId,"data-state":u(w).open.value?"open":"closed","data-direction":u(w).direction.value,disabled:h.value,"data-disabled":h.value?"":void 0,onClick:b,onKeydown:k,onPointerenter:A,onPointerleave:S},[p(e.$slots,"default")],40,c))}});export{f as default};

package/dist/speed-dial/context.cjs

@@ -1 +1 @@
-const e=require("../utils/id.cjs");var t='[role="menuitem"]',E='[role="menuitem"]:not([data-disabled])',I={up:"top",down:"bottom",left:"left",right:"right"},n={up:"vertical",down:"vertical",left:"horizontal",right:"horizontal"},d=Symbol("skdx-speed-dial-context"),T=Symbol("skdx-speed-dial-item-context");function i(){return e.nextId("speed-dial-content")}function a(){return e.nextId("speed-dial-item-label")}exports.ANY_ITEM_SELECTOR=t;exports.DIRECTION_ORIENTATION=n;exports.DIRECTION_SIDE=I;exports.ITEM_SELECTOR=E;exports.SPEED_DIAL_CONTEXT=d;exports.SPEED_DIAL_ITEM_CONTEXT=T;exports.nextSpeedDialContentId=i;exports.nextSpeedDialItemLabelId=a;
+const e=require("../utils/id.cjs");var t='[role="menuitem"]',I='[role="menuitem"]:not([data-disabled])',n={up:"top",down:"bottom",left:"left",right:"right"},E={up:"vertical",down:"vertical",left:"horizontal",right:"horizontal"},d=Symbol("skdx-speed-dial-context"),i=Symbol("skdx-speed-dial-item-context");function r(){return e.nextId("speed-dial-content")}function T(){return e.nextId("speed-dial-trigger")}function a(){return e.nextId("speed-dial-item-label")}exports.ANY_ITEM_SELECTOR=t;exports.DIRECTION_ORIENTATION=E;exports.DIRECTION_SIDE=n;exports.ITEM_SELECTOR=I;exports.SPEED_DIAL_CONTEXT=d;exports.SPEED_DIAL_ITEM_CONTEXT=i;exports.nextSpeedDialContentId=r;exports.nextSpeedDialItemLabelId=a;exports.nextSpeedDialTriggerId=T;

package/dist/speed-dial/context.d.cts

@@ -1,12 +1,12 @@
 import type { ComputedRef, InjectionKey, Ref } from 'vue';
 import type { Side } from '../utils/popper.cjs';
+/** Which way actions fan out (physical, not logical; unaffected by dir=rtl). */
+export type SpeedDialDirection = 'up' | 'down' | 'left' | 'right';
 /**
- * Which way the actions fan out from the trigger. Physical, not logical: a
- * speed dial is anchored to a corner of the viewport, and the corner does not
- * move under `dir="rtl"` — only the arrow keys that walk the fan do, which
- * `SkdxSpeedDialContent` resolves for itself.
+ * @internal Which route opened/closed the fan; internal signal between root and Content.
+ * Click focuses first action; hover alone does not.
  */
-export type SpeedDialDirection = 'up' | 'down' | 'left' | 'right';
+export type SpeedDialOpenReason = 'pointer' | 'hover' | 'keyboard' | 'programmatic';
 /**
  * @internal Every action slot, disabled ones included. Used for the positional
  * custom properties: a disabled action still occupies its place in the fan, so
@@ -24,15 +24,27 @@ export interface SpeedDialContext {
     triggerRef: Ref<HTMLElement | null>;
     contentRef: Ref<HTMLElement | null>;
     contentId: string;
+    /**
+     * Trigger id for Content's aria-labelledby; menu inherits button's name.
+     */
+    triggerId: string;
     open: Readonly<Ref<boolean>>;
     direction: ComputedRef<SpeedDialDirection>;
     disabled: ComputedRef<boolean>;
     openOnHover: ComputedRef<boolean>;
-    /** Guarded setter: a disabled speed dial never opens, whichever path asked. */
-    setOpen(open: boolean): void;
-    /** Pointer entered the trigger or the content — cancels any pending hover close. */
+    /**
+     * Last open route; plain state (read on open flip, not reactive).
+     */
+    readonly openReason: {
+        current: SpeedDialOpenReason;
+    };
+    /** Opens/closes; disabled speed dial never opens. */
+    setOpen(open: boolean, reason?: SpeedDialOpenReason): void;
+    /** Pointer entered trigger/content; cancels pending hover close. */
     onPointerEnter(): void;
-    /** Pointer left the trigger or the content — schedules the hover close. */
+    /** Pointer over trigger with openOnHover; opens after hoverOpenDelay. */
+    onHoverOpen(): void;
+    /** Pointer left trigger/content; schedules hover close. */
     onPointerLeave(): void;
 }
 /** @internal Injection key the SkdxSpeedDial root provides so its Trigger, Portal, Content and Items share state. */
@@ -46,5 +58,7 @@ export interface SpeedDialItemContext {
 export declare const SPEED_DIAL_ITEM_CONTEXT: InjectionKey<SpeedDialItemContext>;
 /** @internal Generates a unique id for a SpeedDial's content. */
 export declare function nextSpeedDialContentId(): string;
+/** @internal Generates a unique id for a SpeedDial's trigger, so Content can name itself from it. */
+export declare function nextSpeedDialTriggerId(): string;
 /** @internal Generates a unique id for a SpeedDialItemLabel, so an item can point `aria-labelledby` at it. */
 export declare function nextSpeedDialItemLabelId(): string;

package/dist/speed-dial/context.d.ts

@@ -1,12 +1,12 @@
 import type { ComputedRef, InjectionKey, Ref } from 'vue';
 import type { Side } from '../utils/popper.js';
+/** Which way actions fan out (physical, not logical; unaffected by dir=rtl). */
+export type SpeedDialDirection = 'up' | 'down' | 'left' | 'right';
 /**
- * Which way the actions fan out from the trigger. Physical, not logical: a
- * speed dial is anchored to a corner of the viewport, and the corner does not
- * move under `dir="rtl"` — only the arrow keys that walk the fan do, which
- * `SkdxSpeedDialContent` resolves for itself.
+ * @internal Which route opened/closed the fan; internal signal between root and Content.
+ * Click focuses first action; hover alone does not.
  */
-export type SpeedDialDirection = 'up' | 'down' | 'left' | 'right';
+export type SpeedDialOpenReason = 'pointer' | 'hover' | 'keyboard' | 'programmatic';
 /**
  * @internal Every action slot, disabled ones included. Used for the positional
  * custom properties: a disabled action still occupies its place in the fan, so
@@ -24,15 +24,27 @@ export interface SpeedDialContext {
     triggerRef: Ref<HTMLElement | null>;
     contentRef: Ref<HTMLElement | null>;
     contentId: string;
+    /**
+     * Trigger id for Content's aria-labelledby; menu inherits button's name.
+     */
+    triggerId: string;
     open: Readonly<Ref<boolean>>;
     direction: ComputedRef<SpeedDialDirection>;
     disabled: ComputedRef<boolean>;
     openOnHover: ComputedRef<boolean>;
-    /** Guarded setter: a disabled speed dial never opens, whichever path asked. */
-    setOpen(open: boolean): void;
-    /** Pointer entered the trigger or the content — cancels any pending hover close. */
+    /**
+     * Last open route; plain state (read on open flip, not reactive).
+     */
+    readonly openReason: {
+        current: SpeedDialOpenReason;
+    };
+    /** Opens/closes; disabled speed dial never opens. */
+    setOpen(open: boolean, reason?: SpeedDialOpenReason): void;
+    /** Pointer entered trigger/content; cancels pending hover close. */
     onPointerEnter(): void;
-    /** Pointer left the trigger or the content — schedules the hover close. */
+    /** Pointer over trigger with openOnHover; opens after hoverOpenDelay. */
+    onHoverOpen(): void;
+    /** Pointer left trigger/content; schedules hover close. */
     onPointerLeave(): void;
 }
 /** @internal Injection key the SkdxSpeedDial root provides so its Trigger, Portal, Content and Items share state. */
@@ -46,5 +58,7 @@ export interface SpeedDialItemContext {
 export declare const SPEED_DIAL_ITEM_CONTEXT: InjectionKey<SpeedDialItemContext>;
 /** @internal Generates a unique id for a SpeedDial's content. */
 export declare function nextSpeedDialContentId(): string;
+/** @internal Generates a unique id for a SpeedDial's trigger, so Content can name itself from it. */
+export declare function nextSpeedDialTriggerId(): string;
 /** @internal Generates a unique id for a SpeedDialItemLabel, so an item can point `aria-labelledby` at it. */
 export declare function nextSpeedDialItemLabelId(): string;

package/dist/speed-dial/context.js

@@ -1 +1 @@
-import{nextId as e}from"../utils/id.js";var t='[role="menuitem"]',a='[role="menuitem"]:not([data-disabled])',i={up:"top",down:"bottom",left:"left",right:"right"},o={up:"vertical",down:"vertical",left:"horizontal",right:"horizontal"},l=/* @__PURE__ */Symbol("skdx-speed-dial-context"),n=/* @__PURE__ */Symbol("skdx-speed-dial-item-context");function d(){return e("speed-dial-content")}function s(){return e("speed-dial-item-label")}export{t as ANY_ITEM_SELECTOR,o as DIRECTION_ORIENTATION,i as DIRECTION_SIDE,a as ITEM_SELECTOR,l as SPEED_DIAL_CONTEXT,n as SPEED_DIAL_ITEM_CONTEXT,d as nextSpeedDialContentId,s as nextSpeedDialItemLabelId};
+import{nextId as e}from"../utils/id.js";var t='[role="menuitem"]',a='[role="menuitem"]:not([data-disabled])',i={up:"top",down:"bottom",left:"left",right:"right"},n={up:"vertical",down:"vertical",left:"horizontal",right:"horizontal"},d=/* @__PURE__ */Symbol("skdx-speed-dial-context"),l=/* @__PURE__ */Symbol("skdx-speed-dial-item-context");function o(){return e("speed-dial-content")}function r(){return e("speed-dial-trigger")}function s(){return e("speed-dial-item-label")}export{t as ANY_ITEM_SELECTOR,n as DIRECTION_ORIENTATION,i as DIRECTION_SIDE,a as ITEM_SELECTOR,d as SPEED_DIAL_CONTEXT,l as SPEED_DIAL_ITEM_CONTEXT,o as nextSpeedDialContentId,s as nextSpeedDialItemLabelId,r as nextSpeedDialTriggerId};

package/dist/speed-dial/index.cjs

@@ -1 +1 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./SpeedDial.vue.cjs"),r=require("./SpeedDialContent.vue.cjs"),i=require("./SpeedDialItem.vue.cjs"),d=require("./SpeedDialItemLabel.vue.cjs"),t=require("./SpeedDialPortal.vue.cjs"),l=require("./SpeedDialTrigger.vue.cjs");exports.SkdxSpeedDial=e.default;exports.SkdxSpeedDialContent=r.default;exports.SkdxSpeedDialItem=i.default;exports.SkdxSpeedDialItemLabel=d.default;exports.SkdxSpeedDialPortal=t.default;exports.SkdxSpeedDialTrigger=l.default;
+Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./SpeedDial.vue.cjs");exports.SkdxSpeedDial=e.default;

package/dist/speed-dial/index.d.cts

@@ -1,7 +1,3 @@
 export { default as SkdxSpeedDial } from './SpeedDial.vue.cjs';
-export { default as SkdxSpeedDialContent } from './SpeedDialContent.vue.cjs';
-export { default as SkdxSpeedDialItem } from './SpeedDialItem.vue.cjs';
-export { default as SkdxSpeedDialItemLabel } from './SpeedDialItemLabel.vue.cjs';
-export { default as SkdxSpeedDialPortal } from './SpeedDialPortal.vue.cjs';
-export { default as SkdxSpeedDialTrigger } from './SpeedDialTrigger.vue.cjs';
 export type { SpeedDialDirection } from './context.cjs';
+export type { SpeedDialAction } from './types.cjs';

package/dist/speed-dial/index.d.ts

@@ -1,7 +1,3 @@
 export { default as SkdxSpeedDial } from './SpeedDial.vue.js';
-export { default as SkdxSpeedDialContent } from './SpeedDialContent.vue.js';
-export { default as SkdxSpeedDialItem } from './SpeedDialItem.vue.js';
-export { default as SkdxSpeedDialItemLabel } from './SpeedDialItemLabel.vue.js';
-export { default as SkdxSpeedDialPortal } from './SpeedDialPortal.vue.js';
-export { default as SkdxSpeedDialTrigger } from './SpeedDialTrigger.vue.js';
 export type { SpeedDialDirection } from './context.js';
+export type { SpeedDialAction } from './types.js';

package/dist/speed-dial/index.js

@@ -1 +1 @@
-import e from"./SpeedDial.vue.js";import a from"./SpeedDialContent.vue.js";import i from"./SpeedDialItem.vue.js";import p from"./SpeedDialItemLabel.vue.js";import r from"./SpeedDialPortal.vue.js";import d from"./SpeedDialTrigger.vue.js";export{e as SkdxSpeedDial,a as SkdxSpeedDialContent,i as SkdxSpeedDialItem,p as SkdxSpeedDialItemLabel,r as SkdxSpeedDialPortal,d as SkdxSpeedDialTrigger};
+import e from"./SpeedDial.vue.js";export{e as SkdxSpeedDial};

package/dist/speed-dial/primitives.cjs

@@ -0,0 +1 @@
+Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./SpeedDialContent.vue.cjs"),r=require("./SpeedDialItem.vue.cjs"),i=require("./SpeedDialItemLabel.vue.cjs"),d=require("./SpeedDialOverlay.vue.cjs"),l=require("./SpeedDialPortal.vue.cjs"),t=require("./SpeedDialTrigger.vue.cjs"),a=require("./SpeedDialRoot.vue.cjs");exports.SkdxSpeedDialContent=e.default;exports.SkdxSpeedDialItem=r.default;exports.SkdxSpeedDialItemLabel=i.default;exports.SkdxSpeedDialOverlay=d.default;exports.SkdxSpeedDialPortal=l.default;exports.SkdxSpeedDialRoot=a.default;exports.SkdxSpeedDialTrigger=t.default;

package/dist/speed-dial/primitives.d.cts

@@ -0,0 +1,33 @@
+/**
+ * Advanced primitives for `SkdxSpeedDial` — the parts the recipe composes.
+ * Use when you need a different structure.
+ *
+ * @example
+ * ```vue
+ * <script setup lang="ts">
+ * import { SkdxSpeedDialContent, SkdxSpeedDialItem, SkdxSpeedDialItemLabel, SkdxSpeedDialOverlay, SkdxSpeedDialPortal, SkdxSpeedDialRoot, SkdxSpeedDialTrigger } from '@skdx/vue/primitives/speed-dial';
+ * </script>
+ *
+ * <template>
+ *   <SkdxSpeedDialRoot>
+ *     <SkdxSpeedDialTrigger aria-label="Actions">+</SkdxSpeedDialTrigger>
+ *     <SkdxSpeedDialPortal>
+ *       <SkdxSpeedDialOverlay />
+ *       <SkdxSpeedDialContent>
+ *         <SkdxSpeedDialItem @select="share">
+ *           <SkdxSpeedDialItemLabel>Share</SkdxSpeedDialItemLabel>
+ *         </SkdxSpeedDialItem>
+ *       </SkdxSpeedDialContent>
+ *     </SkdxSpeedDialPortal>
+ *   </SkdxSpeedDialRoot>
+ * </template>
+ * ```
+ */
+export { default as SkdxSpeedDialRoot } from './SpeedDialRoot.vue.cjs';
+export { default as SkdxSpeedDialTrigger } from './SpeedDialTrigger.vue.cjs';
+export { default as SkdxSpeedDialPortal } from './SpeedDialPortal.vue.cjs';
+export { default as SkdxSpeedDialOverlay } from './SpeedDialOverlay.vue.cjs';
+export { default as SkdxSpeedDialContent } from './SpeedDialContent.vue.cjs';
+export { default as SkdxSpeedDialItem } from './SpeedDialItem.vue.cjs';
+export { default as SkdxSpeedDialItemLabel } from './SpeedDialItemLabel.vue.cjs';
+export type { SpeedDialDirection } from './context.cjs';

package/dist/speed-dial/primitives.d.ts

@@ -0,0 +1,33 @@
+/**
+ * Advanced primitives for `SkdxSpeedDial` — the parts the recipe composes.
+ * Use when you need a different structure.
+ *
+ * @example
+ * ```vue
+ * <script setup lang="ts">
+ * import { SkdxSpeedDialContent, SkdxSpeedDialItem, SkdxSpeedDialItemLabel, SkdxSpeedDialOverlay, SkdxSpeedDialPortal, SkdxSpeedDialRoot, SkdxSpeedDialTrigger } from '@skdx/vue/primitives/speed-dial';
+ * </script>
+ *
+ * <template>
+ *   <SkdxSpeedDialRoot>
+ *     <SkdxSpeedDialTrigger aria-label="Actions">+</SkdxSpeedDialTrigger>
+ *     <SkdxSpeedDialPortal>
+ *       <SkdxSpeedDialOverlay />
+ *       <SkdxSpeedDialContent>
+ *         <SkdxSpeedDialItem @select="share">
+ *           <SkdxSpeedDialItemLabel>Share</SkdxSpeedDialItemLabel>
+ *         </SkdxSpeedDialItem>
+ *       </SkdxSpeedDialContent>
+ *     </SkdxSpeedDialPortal>
+ *   </SkdxSpeedDialRoot>
+ * </template>
+ * ```
+ */
+export { default as SkdxSpeedDialRoot } from './SpeedDialRoot.vue.js';
+export { default as SkdxSpeedDialTrigger } from './SpeedDialTrigger.vue.js';
+export { default as SkdxSpeedDialPortal } from './SpeedDialPortal.vue.js';
+export { default as SkdxSpeedDialOverlay } from './SpeedDialOverlay.vue.js';
+export { default as SkdxSpeedDialContent } from './SpeedDialContent.vue.js';
+export { default as SkdxSpeedDialItem } from './SpeedDialItem.vue.js';
+export { default as SkdxSpeedDialItemLabel } from './SpeedDialItemLabel.vue.js';
+export type { SpeedDialDirection } from './context.js';

package/dist/speed-dial/primitives.js

@@ -0,0 +1 @@
+import e from"./SpeedDialContent.vue.js";import a from"./SpeedDialItem.vue.js";import i from"./SpeedDialItemLabel.vue.js";import o from"./SpeedDialOverlay.vue.js";import r from"./SpeedDialPortal.vue.js";import p from"./SpeedDialTrigger.vue.js";import d from"./SpeedDialRoot.vue.js";export{e as SkdxSpeedDialContent,a as SkdxSpeedDialItem,i as SkdxSpeedDialItemLabel,o as SkdxSpeedDialOverlay,r as SkdxSpeedDialPortal,d as SkdxSpeedDialRoot,p as SkdxSpeedDialTrigger};

package/dist/speed-dial/types.d.cts

@@ -0,0 +1,12 @@
+import type { Component } from 'vue';
+/** One entry in a `SkdxSpeedDial`'s `actions`. */
+export interface SpeedDialAction {
+    /** Text rendered as the action label. */
+    label: string;
+    /** Component rendered inside the action as `aria-hidden` decoration. @default undefined */
+    icon?: Component;
+    /** Called when this action is activated. @default undefined */
+    onSelect?: () => void;
+    /** Excludes from navigation and blocks selection but keeps the slot. @default false */
+    disabled?: boolean;
+}

package/dist/speed-dial/types.d.ts

@@ -0,0 +1,12 @@
+import type { Component } from 'vue';
+/** One entry in a `SkdxSpeedDial`'s `actions`. */
+export interface SpeedDialAction {
+    /** Text rendered as the action label. */
+    label: string;
+    /** Component rendered inside the action as `aria-hidden` decoration. @default undefined */
+    icon?: Component;
+    /** Called when this action is activated. @default undefined */
+    onSelect?: () => void;
+    /** Excludes from navigation and blocks selection but keeps the slot. @default false */
+    disabled?: boolean;
+}

package/dist/spinner/Spinner.vue.d.cts

@@ -1,17 +1,10 @@
-/**
- * The Vue implementation of the shared Spinner contract (see
- * `@skdx/shared`'s `spinnerContract`). Renders a `role="status"` live
- * region: behavior and accessibility only, no visual style — style it with
- * `class`/`:class` on `<SkdxSpinner>` (e.g. a CSS `::before` animation), or
- * pass a custom spinner graphic via the default slot.
- */
 type __VLS_Props = {
     /** Accessible label announced to screen readers while the spinner is visible. */
     label?: string;
 };
-declare var __VLS_1: {};
+declare var __VLS_4: {};
 type __VLS_Slots = {} & {
-    default?: (props: typeof __VLS_1) => any;
+    default?: (props: typeof __VLS_4) => any;
 };
 declare const __VLS_component: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
     label: string;

package/dist/spinner/Spinner.vue.d.ts

@@ -1,17 +1,10 @@
-/**
- * The Vue implementation of the shared Spinner contract (see
- * `@skdx/shared`'s `spinnerContract`). Renders a `role="status"` live
- * region: behavior and accessibility only, no visual style — style it with
- * `class`/`:class` on `<SkdxSpinner>` (e.g. a CSS `::before` animation), or
- * pass a custom spinner graphic via the default slot.
- */
 type __VLS_Props = {
     /** Accessible label announced to screen readers while the spinner is visible. */
     label?: string;
 };
-declare var __VLS_1: {};
+declare var __VLS_4: {};
 type __VLS_Slots = {} & {
-    default?: (props: typeof __VLS_1) => any;
+    default?: (props: typeof __VLS_4) => any;
 };
 declare const __VLS_component: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
     label: string;

package/dist/spinner/Spinner.vue_vue_type_script_setup_true_lang.cjs

@@ -1 +1 @@
-let e=require("vue");var r=["aria-label"],l=(0,e.defineComponent)({__name:"Spinner",props:{label:{default:"Loading"}},setup(a){return(t,n)=>((0,e.openBlock)(),(0,e.createElementBlock)("div",{class:"skdx-spinner","data-part":"root","data-skdx-component":"spinner",role:"status","aria-live":"polite","aria-label":a.label},[(0,e.renderSlot)(t.$slots,"default")],8,r))}});exports.default=l;
+const i=require("../utils/VisuallyHidden.vue.cjs");let e=require("vue");var o=["aria-label"],s=(0,e.defineComponent)({inheritAttrs:!1,__name:"Spinner",props:{label:{default:"Loading"}},setup(a){const r=a,l=(0,e.useAttrs)(),n=(0,e.computed)(()=>{const t=l["aria-label"];if(t!=null)return t;if(l["aria-labelledby"]==null)return r.label||void 0});return(t,u)=>((0,e.openBlock)(),(0,e.createElementBlock)("div",(0,e.mergeProps)(t.$attrs,{class:"skdx-spinner","data-part":"root","data-skdx-component":"spinner",role:"status","aria-live":"polite","aria-label":n.value}),[a.label?((0,e.openBlock)(),(0,e.createBlock)(i.default,{key:0,class:"skdx-spinner__label","data-part":"label"},{default:(0,e.withCtx)(()=>[(0,e.createTextVNode)((0,e.toDisplayString)(a.label),1)]),_:1})):(0,e.createCommentVNode)("",!0),(0,e.renderSlot)(t.$slots,"default")],16,o))}});exports.default=s;

package/dist/spinner/Spinner.vue_vue_type_script_setup_true_lang.js

@@ -1 +1 @@
-import{createElementBlock as a,defineComponent as e,openBlock as l,renderSlot as t}from"vue";var o=["aria-label"],r=/* @__PURE__ */e({__name:"Spinner",props:{label:{default:"Loading"}},setup:e=>(r,s)=>(l(),a("div",{class:"skdx-spinner","data-part":"root","data-skdx-component":"spinner",role:"status","aria-live":"polite","aria-label":e.label},[t(r.$slots,"default")],8,o))});export{r as default};
+import a from"../utils/VisuallyHidden.vue.js";import{computed as e,createBlock as l,createCommentVNode as t,createElementBlock as s,createTextVNode as r,defineComponent as o,mergeProps as n,openBlock as i,renderSlot as d,toDisplayString as p,useAttrs as u,withCtx as c}from"vue";var m=["aria-label"],b=/* @__PURE__ */o({inheritAttrs:!1,__name:"Spinner",props:{label:{default:"Loading"}},setup(o){const b=o,f=u(),k=e(()=>{const a=f["aria-label"];return null!=a?a:null==f["aria-labelledby"]&&b.label||void 0});return(e,u)=>(i(),s("div",n(e.$attrs,{class:"skdx-spinner","data-part":"root","data-skdx-component":"spinner",role:"status","aria-live":"polite","aria-label":k.value}),[o.label?(i(),l(a,{key:0,class:"skdx-spinner__label","data-part":"label"},{default:c(()=>[r(p(o.label),1)]),_:1})):t("",!0),d(e.$slots,"default")],16,m))}});export{b as default};

package/dist/split-button/SplitButton.vue.d.cts

@@ -1,16 +1,59 @@
+import type { SplitButtonItem } from './types.cjs';
 /**
- * The Vue implementation of the shared SplitButton contract (see
- * `@skdx/shared`'s `splitButtonContract`). Groups a primary action button
- * with a small trigger that opens a menu of related actions: renders a
- * `<div role="group">`. Deliberately stateless — pair `<SkdxSplitButtonTrigger>`
- * with an actual menu's trigger (e.g. a dropdown menu) for open/close behavior.
+ * Groups a primary action button with a trigger opening a menu of related actions:
+ * renders a `<div role="group">`. Pass `label` and `items` for auto-derived entries
+ * or use the slot for manual composition. Pass `aria-label` or `aria-labelledby` —
+ * `role="group"` is not name-from-content, so an unnamed group announces as a bare "group".
+ *
+ * @example
+ * ```vue
+ * <SkdxSplitButton
+ *   aria-label="Deploy"
+ *   label="Deploy"
+ *   :items="[{ value: 'preview', label: 'Deploy preview' }]"
+ *   @action-click="deploy"
+ *   @select="run"
+ * />
+ * ```
  */
-type __VLS_Props = {};
-declare var __VLS_1: {};
+type __VLS_Props = {
+    /**
+     * The primary action's text, rendered as the derived
+     * `SkdxSplitButtonAction`.
+     * @default undefined — the derived action renders empty.
+     */
+    label?: string;
+    /**
+     * The related actions the disclosure half opens, one derived menu item
+     * each. Ignored once the default slot supplies its own parts.
+     * @default undefined — nothing is derived; compose the two halves in the default slot.
+     */
+    items?: readonly SplitButtonItem[];
+    /**
+     * Accessible name for the derived disclosure half, which is a bare chevron
+     * and so has no text of its own to be named by. Same reasoning as
+     * `SkdxAlert`'s `closeLabel`.
+     * @default 'More options'
+     */
+    menuLabel?: string;
+};
+declare var __VLS_1: {}, __VLS_6: {};
 type __VLS_Slots = {} & {
     default?: (props: typeof __VLS_1) => any;
+} & {
+    action?: (props: typeof __VLS_6) => 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 __VLS_component: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    select: (item: SplitButtonItem) => any;
+    "action-click": (event: MouseEvent) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    onSelect?: ((item: SplitButtonItem) => any) | undefined;
+    "onAction-click"?: ((event: MouseEvent) => any) | undefined;
+}>, {
+    label: string;
+    items: readonly SplitButtonItem[];
+    menuLabel: string;
+}, {}, {}, {}, 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 & {