@skdx/vue 0.28.0 → 0.30.0

package/dist/floating-panel/FloatingPanelCloseTrigger.vue.d.cts

@@ -1,9 +1,4 @@
-/**
- * Button that closes the panel and returns focus to the trigger. Usually
- * lives in the header next to the stage triggers, but works anywhere inside
- * `SkdxFloatingPanelContent`. Unaffected by the root's `disabled`. Must be
- * used inside `SkdxFloatingPanel`.
- */
+/** Button that closes the panel and returns focus to the trigger, unaffected by the root's `disabled`. */
 type __VLS_Props = {};
 declare var __VLS_1: {};
 type __VLS_Slots = {} & {

package/dist/floating-panel/FloatingPanelCloseTrigger.vue.d.ts

@@ -1,9 +1,4 @@
-/**
- * Button that closes the panel and returns focus to the trigger. Usually
- * lives in the header next to the stage triggers, but works anywhere inside
- * `SkdxFloatingPanelContent`. Unaffected by the root's `disabled`. Must be
- * used inside `SkdxFloatingPanel`.
- */
+/** Button that closes the panel and returns focus to the trigger, unaffected by the root's `disabled`. */
 type __VLS_Props = {};
 declare var __VLS_1: {};
 type __VLS_Slots = {} & {

package/dist/floating-panel/FloatingPanelCloseTrigger.vue_vue_type_script_setup_true_lang.cjs

@@ -1 +1 @@
-const l=require("./context.cjs");let e=require("vue");var o=(0,e.defineComponent)({__name:"FloatingPanelCloseTrigger",setup(a){const t=(0,e.inject)(l.FLOATING_PANEL_CONTEXT);if(!t)throw new Error("SkdxFloatingPanelCloseTrigger must be used within SkdxFloatingPanel.");return(r,n)=>((0,e.openBlock)(),(0,e.createElementBlock)("button",{class:"skdx-floating-panel__close-trigger","data-part":"close-trigger",type:"button",onClick:n[0]||(n[0]=i=>(0,e.unref)(t).setOpen(!1))},[(0,e.renderSlot)(r.$slots,"default")]))}});exports.default=o;
+const l=require("../utils/injectRequired.cjs"),o=require("./context.cjs");let e=require("vue");var i=(0,e.defineComponent)({__name:"FloatingPanelCloseTrigger",setup(u){const r=l.injectRequired(o.FLOATING_PANEL_CONTEXT,"SkdxFloatingPanelCloseTrigger must be used within SkdxFloatingPanel.");return(n,t)=>((0,e.openBlock)(),(0,e.createElementBlock)("button",{class:"skdx-floating-panel__close-trigger","data-part":"close-trigger",type:"button",onClick:t[0]||(t[0]=a=>(0,e.unref)(r).setOpen(!1))},[(0,e.renderSlot)(n.$slots,"default")]))}});exports.default=i;

package/dist/floating-panel/FloatingPanelCloseTrigger.vue_vue_type_script_setup_true_lang.js

@@ -1 +1 @@
-import{FLOATING_PANEL_CONTEXT as e}from"./context.js";import{createElementBlock as t,defineComponent as o,inject as n,openBlock as a,renderSlot as r,unref as s}from"vue";var l=/* @__PURE__ */o({__name:"FloatingPanelCloseTrigger",setup(o){const l=n(e);if(!l)throw new Error("SkdxFloatingPanelCloseTrigger must be used within SkdxFloatingPanel.");return(e,o)=>(a(),t("button",{class:"skdx-floating-panel__close-trigger","data-part":"close-trigger",type:"button",onClick:o[0]||(o[0]=e=>s(l).setOpen(!1))},[r(e.$slots,"default")]))}});export{l as default};
+import{injectRequired as e}from"../utils/injectRequired.js";import{FLOATING_PANEL_CONTEXT as t}from"./context.js";import{createElementBlock as o,defineComponent as n,openBlock as a,renderSlot as r,unref as s}from"vue";var l=/* @__PURE__ */n({__name:"FloatingPanelCloseTrigger",setup(n){const l=e(t,"SkdxFloatingPanelCloseTrigger must be used within SkdxFloatingPanel.");return(e,t)=>(a(),o("button",{class:"skdx-floating-panel__close-trigger","data-part":"close-trigger",type:"button",onClick:t[0]||(t[0]=e=>s(l).setOpen(!1))},[r(e.$slots,"default")]))}});export{l as default};

package/dist/floating-panel/FloatingPanelContent.vue.d.cts

@@ -1,26 +1,6 @@
 import { type FocusOutsideEvent, type InteractOutsideEvent } from '../utils/useDismiss.cjs';
 /**
- * The movable surface: `role="dialog"` with **`aria-modal="false"`**, named by
- * `SkdxFloatingPanelTitle` through `aria-labelledby` — emitted only once that
- * part has registered itself. It traps nothing, locks nothing, and covers
- * nothing — the page behind it keeps working.
- *
- * Closes on Escape or pointer-down outside itself and its trigger, each
- * reported to `escape-key-down`/`pointer-down-outside` and, for outside
- * interactions, to `interact-outside` first with the same event — so one
- * `preventDefault()` vetoes the dismissal either way. Focus moving outside is
- * reported to `focus-outside` but never closes the panel, since a non-modal
- * window that vanished when you tabbed back to the page would be unusable.
- *
- * Publishes its geometry as `--skdx-floating-panel-x` / `-y` / `-width` /
- * `-height` so a consumer can position it entirely from CSS. Exposes
- * `data-state`, `data-stage`, `data-dragging`, `data-resizing`, and
- * `data-disabled`. At `stage="maximized"` the published width and height
- * become `100%` rather than a measured pixel value. At `stage="minimized"`
- * the height becomes `auto`, collapsing the panel to whatever its header needs.
- *
- * Mounts only while open unless `forceMount` is set. Must be used inside
- * `SkdxFloatingPanel`.
+ * The movable, non-modal surface — `role="dialog"` with `aria-modal="false"` — that closes on Escape or an outside pointer-down.
  */
 type __VLS_Props = {
     /**
@@ -40,10 +20,10 @@ declare const __VLS_component: import("vue").DefineComponent<__VLS_Props, {}, {}
     "pointer-down-outside": (event: PointerEvent) => any;
     "interact-outside": (event: InteractOutsideEvent) => any;
 }, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
-    "onFocus-outside"?: ((event: FocusOutsideEvent) => any) | undefined;
-    "onEscape-key-down"?: ((event: KeyboardEvent) => any) | undefined;
-    "onPointer-down-outside"?: ((event: PointerEvent) => any) | undefined;
-    "onInteract-outside"?: ((event: InteractOutsideEvent) => any) | undefined;
+    "onFocus-outside"?: (event: FocusOutsideEvent) => any;
+    "onEscape-key-down"?: (event: KeyboardEvent) => any;
+    "onPointer-down-outside"?: (event: PointerEvent) => any;
+    "onInteract-outside"?: (event: InteractOutsideEvent) => any;
 }>, {
     forceMount: boolean;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;

package/dist/floating-panel/FloatingPanelContent.vue.d.ts

@@ -1,26 +1,6 @@
 import { type FocusOutsideEvent, type InteractOutsideEvent } from '../utils/useDismiss.js';
 /**
- * The movable surface: `role="dialog"` with **`aria-modal="false"`**, named by
- * `SkdxFloatingPanelTitle` through `aria-labelledby` — emitted only once that
- * part has registered itself. It traps nothing, locks nothing, and covers
- * nothing — the page behind it keeps working.
- *
- * Closes on Escape or pointer-down outside itself and its trigger, each
- * reported to `escape-key-down`/`pointer-down-outside` and, for outside
- * interactions, to `interact-outside` first with the same event — so one
- * `preventDefault()` vetoes the dismissal either way. Focus moving outside is
- * reported to `focus-outside` but never closes the panel, since a non-modal
- * window that vanished when you tabbed back to the page would be unusable.
- *
- * Publishes its geometry as `--skdx-floating-panel-x` / `-y` / `-width` /
- * `-height` so a consumer can position it entirely from CSS. Exposes
- * `data-state`, `data-stage`, `data-dragging`, `data-resizing`, and
- * `data-disabled`. At `stage="maximized"` the published width and height
- * become `100%` rather than a measured pixel value. At `stage="minimized"`
- * the height becomes `auto`, collapsing the panel to whatever its header needs.
- *
- * Mounts only while open unless `forceMount` is set. Must be used inside
- * `SkdxFloatingPanel`.
+ * The movable, non-modal surface — `role="dialog"` with `aria-modal="false"` — that closes on Escape or an outside pointer-down.
  */
 type __VLS_Props = {
     /**
@@ -40,10 +20,10 @@ declare const __VLS_component: import("vue").DefineComponent<__VLS_Props, {}, {}
     "pointer-down-outside": (event: PointerEvent) => any;
     "interact-outside": (event: InteractOutsideEvent) => any;
 }, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
-    "onFocus-outside"?: ((event: FocusOutsideEvent) => any) | undefined;
-    "onEscape-key-down"?: ((event: KeyboardEvent) => any) | undefined;
-    "onPointer-down-outside"?: ((event: PointerEvent) => any) | undefined;
-    "onInteract-outside"?: ((event: InteractOutsideEvent) => any) | undefined;
+    "onFocus-outside"?: (event: FocusOutsideEvent) => any;
+    "onEscape-key-down"?: (event: KeyboardEvent) => any;
+    "onPointer-down-outside"?: (event: PointerEvent) => any;
+    "onInteract-outside"?: (event: InteractOutsideEvent) => any;
 }>, {
     forceMount: boolean;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;

package/dist/floating-panel/FloatingPanelContent.vue_vue_type_script_setup_true_lang.cjs

@@ -1 +1 @@
-const p=require("../utils/composeRefs.cjs"),g=require("../utils/useDismiss.cjs"),x=require("./context.cjs");let e=require("vue");var m=["id","aria-labelledby","data-state","data-stage","data-dragging","data-resizing","data-disabled"],v=(0,e.defineComponent)({__name:"FloatingPanelContent",props:{forceMount:{type:Boolean,default:!1}},emits:["escape-key-down","pointer-down-outside","focus-outside","interact-outside"],setup(s,{emit:d}){const a=d,t=(0,e.inject)(x.FLOATING_PANEL_CONTEXT);if(!t)throw new Error("SkdxFloatingPanelContent must be used within SkdxFloatingPanel.");const o=(0,e.ref)(null),l=p.composeRefs(o,t.contentRef);g.useDismiss({enabled:t.open,onEscapeKeyDown:n=>{a("escape-key-down",n),n.defaultPrevented||t.setOpen(!1)},onPointerDownOutside:n=>{a("pointer-down-outside",n),n.defaultPrevented||t.setOpen(!1)},onFocusOutside:n=>a("focus-outside",n),onInteractOutside:n=>a("interact-outside",n)},[o,t.triggerRef]);const r=(0,e.computed)(()=>{const n=t.stage.value;if(n==="maximized")return{"--skdx-floating-panel-x":"0px","--skdx-floating-panel-y":"0px","--skdx-floating-panel-width":"100%","--skdx-floating-panel-height":"100%"};const{x:i,y:u}=t.position.value,{width:f,height:c}=t.size.value;return{"--skdx-floating-panel-x":`${i}px`,"--skdx-floating-panel-y":`${u}px`,"--skdx-floating-panel-width":`${f}px`,"--skdx-floating-panel-height":n==="minimized"?"auto":`${c}px`}});return(n,i)=>s.forceMount||(0,e.unref)(t).open.value?((0,e.openBlock)(),(0,e.createElementBlock)("div",{key:0,class:"skdx-floating-panel__content","data-part":"content",id:(0,e.unref)(t).contentId,ref:(0,e.unref)(l),role:"dialog","aria-modal":"false","aria-labelledby":(0,e.unref)(t).hasTitle.value?(0,e.unref)(t).titleId:void 0,"data-state":(0,e.unref)(t).open.value?"open":"closed","data-stage":(0,e.unref)(t).stage.value,"data-dragging":(0,e.unref)(t).dragging.value?"":void 0,"data-resizing":(0,e.unref)(t).resizing.value?"":void 0,"data-disabled":(0,e.unref)(t).disabled.value?"":void 0,style:(0,e.normalizeStyle)(r.value)},[(0,e.renderSlot)(n.$slots,"default")],12,m)):(0,e.createCommentVNode)("",!0)}});exports.default=v;
+const _=require("../utils/injectRequired.cjs"),x=require("../utils/composeRefs.cjs"),v=require("../utils/useDismiss.cjs"),m=require("./context.cjs");let n=require("vue");var k=["id","aria-labelledby","data-state","data-stage","data-dragging","data-resizing","data-disabled"],h=".skdx-floating-panel__content, .skdx-floating-panel__trigger",y=(0,n.defineComponent)({__name:"FloatingPanelContent",props:{forceMount:{type:Boolean,default:!1}},emits:["escape-key-down","pointer-down-outside","focus-outside","interact-outside"],setup(s,{emit:l}){const o=l,t=_.injectRequired(m.FLOATING_PANEL_CONTEXT,"SkdxFloatingPanelContent must be used within SkdxFloatingPanel."),i=(0,n.ref)(null),r=x.composeRefs(i,t.contentRef),d=e=>!!(i.value?.contains(e)||t.triggerRef.value?.contains(e)),u=e=>{const a=e?.closest?.(h);return!!a&&!d(a)};v.useDismiss({enabled:t.open,onEscapeKeyDown:e=>{u(e.target)||(o("escape-key-down",e),e.defaultPrevented||t.setOpen(!1))},onPointerDownOutside:e=>{o("pointer-down-outside",e),e.defaultPrevented||t.setOpen(!1)},onFocusOutside:e=>o("focus-outside",e),onInteractOutside:e=>o("interact-outside",e)},[i,t.triggerRef]);const c=(0,n.computed)(()=>{const e=t.stage.value;if(e==="maximized")return{"--skdx-floating-panel-x":"0px","--skdx-floating-panel-y":"0px","--skdx-floating-panel-width":"100%","--skdx-floating-panel-height":"100%"};const{x:a,y:f}=t.position.value,{width:g,height:p}=t.size.value;return{"--skdx-floating-panel-x":`${a}px`,"--skdx-floating-panel-y":`${f}px`,"--skdx-floating-panel-width":`${g}px`,"--skdx-floating-panel-height":e==="minimized"?"auto":`${p}px`}});return(e,a)=>s.forceMount||(0,n.unref)(t).open.value?((0,n.openBlock)(),(0,n.createElementBlock)("div",{key:0,id:(0,n.unref)(t).contentId,ref:(0,n.unref)(r),class:"skdx-floating-panel__content","data-part":"content",role:"dialog","aria-modal":"false","aria-labelledby":(0,n.unref)(t).hasTitle.value?(0,n.unref)(t).titleId:void 0,"data-state":(0,n.unref)(t).open.value?"open":"closed","data-stage":(0,n.unref)(t).stage.value,"data-dragging":(0,n.unref)(t).dragging.value?"":void 0,"data-resizing":(0,n.unref)(t).resizing.value?"":void 0,"data-disabled":(0,n.unref)(t).disabled.value?"":void 0,style:(0,n.normalizeStyle)(c.value)},[(0,n.renderSlot)(e.$slots,"default")],12,k)):(0,n.createCommentVNode)("",!0)}});exports.default=y;

package/dist/floating-panel/FloatingPanelContent.vue_vue_type_script_setup_true_lang.js

@@ -1 +1 @@
-import{composeRefs as e}from"../utils/composeRefs.js";import{useDismiss as t}from"../utils/useDismiss.js";import{FLOATING_PANEL_CONTEXT as a}from"./context.js";import{computed as n,createCommentVNode as o,createElementBlock as s,defineComponent as i,inject as d,normalizeStyle as l,openBlock as r,ref as u,renderSlot as p,unref as g}from"vue";var f=["id","aria-labelledby","data-state","data-stage","data-dragging","data-resizing","data-disabled"],c=/* @__PURE__ */i({__name:"FloatingPanelContent",props:{forceMount:{type:Boolean,default:!1}},emits:["escape-key-down","pointer-down-outside","focus-outside","interact-outside"],setup(i,{emit:c}){const m=c,x=d(a);if(!x)throw new Error("SkdxFloatingPanelContent must be used within SkdxFloatingPanel.");const v=u(null),k=e(v,x.contentRef);t({enabled:x.open,onEscapeKeyDown:e=>{m("escape-key-down",e),e.defaultPrevented||x.setOpen(!1)},onPointerDownOutside:e=>{m("pointer-down-outside",e),e.defaultPrevented||x.setOpen(!1)},onFocusOutside:e=>m("focus-outside",e),onInteractOutside:e=>m("interact-outside",e)},[v,x.triggerRef]);const h=n(()=>{const e=x.stage.value;if("maximized"===e)return{"--skdx-floating-panel-x":"0px","--skdx-floating-panel-y":"0px","--skdx-floating-panel-width":"100%","--skdx-floating-panel-height":"100%"};const{x:t,y:a}=x.position.value,{width:n,height:o}=x.size.value;return{"--skdx-floating-panel-x":`${t}px`,"--skdx-floating-panel-y":`${a}px`,"--skdx-floating-panel-width":`${n}px`,"--skdx-floating-panel-height":"minimized"===e?"auto":`${o}px`}});return(e,t)=>i.forceMount||g(x).open.value?(r(),s("div",{key:0,class:"skdx-floating-panel__content","data-part":"content",id:g(x).contentId,ref:g(k),role:"dialog","aria-modal":"false","aria-labelledby":g(x).hasTitle.value?g(x).titleId:void 0,"data-state":g(x).open.value?"open":"closed","data-stage":g(x).stage.value,"data-dragging":g(x).dragging.value?"":void 0,"data-resizing":g(x).resizing.value?"":void 0,"data-disabled":g(x).disabled.value?"":void 0,style:l(h.value)},[p(e.$slots,"default")],12,f)):o("",!0)}});export{c as default};
+import{injectRequired as e}from"../utils/injectRequired.js";import{composeRefs as t}from"../utils/composeRefs.js";import{useDismiss as a}from"../utils/useDismiss.js";import{FLOATING_PANEL_CONTEXT as n}from"./context.js";import{computed as o,createCommentVNode as s,createElementBlock as i,defineComponent as d,normalizeStyle as l,openBlock as r,ref as u,renderSlot as p,unref as g}from"vue";var c=["id","aria-labelledby","data-state","data-stage","data-dragging","data-resizing","data-disabled"],f=/* @__PURE__ */d({__name:"FloatingPanelContent",props:{forceMount:{type:Boolean,default:!1}},emits:["escape-key-down","pointer-down-outside","focus-outside","interact-outside"],setup(d,{emit:f}){const m=f,x=e(n,"SkdxFloatingPanelContent must be used within SkdxFloatingPanel."),v=u(null),k=t(v,x.contentRef);a({enabled:x.open,onEscapeKeyDown:e=>{(e=>{const t=e?.closest?.(".skdx-floating-panel__content, .skdx-floating-panel__trigger");return!!t&&!(e=>!(!v.value?.contains(e)&&!x.triggerRef.value?.contains(e)))(t)})(e.target)||(m("escape-key-down",e),e.defaultPrevented||x.setOpen(!1))},onPointerDownOutside:e=>{m("pointer-down-outside",e),e.defaultPrevented||x.setOpen(!1)},onFocusOutside:e=>m("focus-outside",e),onInteractOutside:e=>m("interact-outside",e)},[v,x.triggerRef]);const y=o(()=>{const e=x.stage.value;if("maximized"===e)return{"--skdx-floating-panel-x":"0px","--skdx-floating-panel-y":"0px","--skdx-floating-panel-width":"100%","--skdx-floating-panel-height":"100%"};const{x:t,y:a}=x.position.value,{width:n,height:o}=x.size.value;return{"--skdx-floating-panel-x":`${t}px`,"--skdx-floating-panel-y":`${a}px`,"--skdx-floating-panel-width":`${n}px`,"--skdx-floating-panel-height":"minimized"===e?"auto":`${o}px`}});return(e,t)=>d.forceMount||g(x).open.value?(r(),i("div",{key:0,id:g(x).contentId,ref:g(k),class:"skdx-floating-panel__content","data-part":"content",role:"dialog","aria-modal":"false","aria-labelledby":g(x).hasTitle.value?g(x).titleId:void 0,"data-state":g(x).open.value?"open":"closed","data-stage":g(x).stage.value,"data-dragging":g(x).dragging.value?"":void 0,"data-resizing":g(x).resizing.value?"":void 0,"data-disabled":g(x).disabled.value?"":void 0,style:l(y.value)},[p(e.$slots,"default")],12,c)):s("",!0)}});export{f as default};

package/dist/floating-panel/FloatingPanelHeader.vue.d.cts

@@ -1,13 +1,4 @@
-/**
- * The panel's drag handle — the bar you grab to move the window and natural
- * home for `SkdxFloatingPanelTitle` and the close/stage buttons. **Keyboard-
- * operable**: while focused, arrow keys move the panel by the root's `step`
- * and Shift+arrow by ten times that, clamped to the boundary. The final
- * position is announced politely once, on release. Under `dir="rtl"` the
- * horizontal arrows mirror. Give it an `aria-label` — a focusable bar with no
- * name tells a screen-reader user nothing about what the arrow keys will do.
- * Must be used inside `SkdxFloatingPanel`.
- */
+/** The panel's drag handle, keyboard-operable via arrow keys and the natural home for its title and buttons. */
 type __VLS_Props = {};
 declare var __VLS_1: {};
 type __VLS_Slots = {} & {

package/dist/floating-panel/FloatingPanelHeader.vue.d.ts

@@ -1,13 +1,4 @@
-/**
- * The panel's drag handle — the bar you grab to move the window and natural
- * home for `SkdxFloatingPanelTitle` and the close/stage buttons. **Keyboard-
- * operable**: while focused, arrow keys move the panel by the root's `step`
- * and Shift+arrow by ten times that, clamped to the boundary. The final
- * position is announced politely once, on release. Under `dir="rtl"` the
- * horizontal arrows mirror. Give it an `aria-label` — a focusable bar with no
- * name tells a screen-reader user nothing about what the arrow keys will do.
- * Must be used inside `SkdxFloatingPanel`.
- */
+/** The panel's drag handle, keyboard-operable via arrow keys and the natural home for its title and buttons. */
 type __VLS_Props = {};
 declare var __VLS_1: {};
 type __VLS_Slots = {} & {

package/dist/floating-panel/FloatingPanelHeader.vue_vue_type_script_setup_true_lang.cjs

@@ -1 +1 @@
-const c=require("../utils/direction.cjs"),p=require("./context.cjs");let n=require("vue");var _=["data-dragging","data-disabled","aria-disabled","aria-keyshortcuts","tabindex"],w=10,h=(0,n.defineComponent)({__name:"FloatingPanelHeader",setup(x){const r=(0,n.inject)(p.FLOATING_PANEL_CONTEXT);if(!r)throw new Error("SkdxFloatingPanelHeader must be used within SkdxFloatingPanel.");const s=c.useDirection(),t=(0,n.ref)(null),l=(0,n.ref)(!1),o=(0,n.computed)(()=>r.draggable.value&&!r.disabled.value);function g(e){o.value&&(e.currentTarget.setPointerCapture?.(e.pointerId),t.value={x:e.clientX,y:e.clientY},r.setDragging(!0))}function f(e){const a=t.value;!o.value||!a||(r.moveBy(e.clientX-a.x,e.clientY-a.y),t.value={x:e.clientX,y:e.clientY})}function u(e){t.value&&(e.currentTarget.releasePointerCapture?.(e.pointerId),t.value=null,r.setDragging(!1),r.announceRelease("move"))}function v(e){if(!o.value)return;const a=r.step.value*(e.shiftKey?w:1),i=c.directionalKey(e.key,e.currentTarget,s()),d=i==="ArrowLeft"?{dx:-a,dy:0}:i==="ArrowRight"?{dx:a,dy:0}:i==="ArrowUp"?{dx:0,dy:-a}:i==="ArrowDown"?{dx:0,dy:a}:null;d&&(e.preventDefault(),l.value=!0,r.moveBy(d.dx,d.dy))}function y(){l.value&&(l.value=!1,r.announceRelease("move"))}return(e,a)=>((0,n.openBlock)(),(0,n.createElementBlock)("div",{class:"skdx-floating-panel__header","data-part":"header","data-dragging":(0,n.unref)(r).dragging.value?"":void 0,"data-disabled":(0,n.unref)(r).disabled.value?"":void 0,"aria-disabled":(0,n.unref)(r).disabled.value||void 0,"aria-keyshortcuts":(0,n.unref)(r).draggable.value?"ArrowUp ArrowDown ArrowLeft ArrowRight":void 0,tabindex:(0,n.unref)(r).draggable.value?0:void 0,style:(0,n.normalizeStyle)({touchAction:"none",cursor:o.value?"move":void 0}),onPointerdown:g,onPointermove:f,onPointerup:u,onPointercancel:u,onKeydown:v,onKeyup:y},[(0,n.renderSlot)(e.$slots,"default")],44,_))}});exports.default=h;
+const _=require("../utils/injectRequired.cjs"),d=require("../utils/direction.cjs"),y=require("./context.cjs");let n=require("vue");var w=["data-dragging","data-disabled","aria-disabled","aria-keyshortcuts","tabindex"],h=10,x=(0,n.defineComponent)({__name:"FloatingPanelHeader",setup(P){const r=_.injectRequired(y.FLOATING_PANEL_CONTEXT,"SkdxFloatingPanelHeader must be used within SkdxFloatingPanel."),c=d.useDirection(),t=(0,n.ref)(null),i=(0,n.ref)(!1),o=(0,n.computed)(()=>r.draggable.value&&!r.disabled.value);function s(e){o.value&&(e.currentTarget.setPointerCapture?.(e.pointerId),t.value={x:e.clientX,y:e.clientY},r.setDragging(!0))}function g(e){const a=t.value;!o.value||!a||(r.moveBy(e.clientX-a.x,e.clientY-a.y),t.value={x:e.clientX,y:e.clientY})}function l(e){t.value&&(e.currentTarget.releasePointerCapture?.(e.pointerId),t.value=null,r.setDragging(!1),r.announceRelease("move"))}function f(e,a){switch(e){case"ArrowLeft":return{dx:-a,dy:0};case"ArrowRight":return{dx:a,dy:0};case"ArrowUp":return{dx:0,dy:-a};case"ArrowDown":return{dx:0,dy:a};default:return null}}function v(e){if(!o.value)return;const a=r.step.value*(e.shiftKey?h:1),u=f(d.directionalKey(e.key,e.currentTarget,c()),a);u&&(e.preventDefault(),i.value=!0,r.moveBy(u.dx,u.dy))}function p(){i.value&&(i.value=!1,r.announceRelease("move"))}return(e,a)=>((0,n.openBlock)(),(0,n.createElementBlock)("div",{class:"skdx-floating-panel__header","data-part":"header",role:"group","data-dragging":(0,n.unref)(r).dragging.value?"":void 0,"data-disabled":(0,n.unref)(r).disabled.value?"":void 0,"aria-disabled":(0,n.unref)(r).disabled.value||void 0,"aria-keyshortcuts":(0,n.unref)(r).draggable.value?"ArrowUp ArrowDown ArrowLeft ArrowRight":void 0,tabindex:(0,n.unref)(r).draggable.value?0:void 0,style:(0,n.normalizeStyle)({touchAction:"none",cursor:o.value?"move":void 0}),onPointerdown:s,onPointermove:g,onPointerup:l,onPointercancel:l,onKeydown:v,onKeyup:p},[(0,n.renderSlot)(e.$slots,"default")],44,w))}});exports.default=x;

package/dist/floating-panel/FloatingPanelHeader.vue_vue_type_script_setup_true_lang.js

@@ -1 +1 @@
-import{directionalKey as e,useDirection as a}from"../utils/direction.js";import{FLOATING_PANEL_CONTEXT as n}from"./context.js";import{computed as t,createElementBlock as r,defineComponent as o,inject as i,normalizeStyle as l,openBlock as d,ref as u,renderSlot as s,unref as c}from"vue";var v=["data-dragging","data-disabled","aria-disabled","aria-keyshortcuts","tabindex"],g=/* @__PURE__ */o({__name:"FloatingPanelHeader",setup(o){const g=i(n);if(!g)throw new Error("SkdxFloatingPanelHeader must be used within SkdxFloatingPanel.");const f=a(),p=u(null),y=u(!1),m=t(()=>g.draggable.value&&!g.disabled.value);function w(e){m.value&&(e.currentTarget.setPointerCapture?.(e.pointerId),p.value={x:e.clientX,y:e.clientY},g.setDragging(!0))}function x(e){const a=p.value;!m.value||!a||(g.moveBy(e.clientX-a.x,e.clientY-a.y),p.value={x:e.clientX,y:e.clientY})}function b(e){p.value&&(e.currentTarget.releasePointerCapture?.(e.pointerId),p.value=null,g.setDragging(!1),g.announceRelease("move"))}function A(a){if(!m.value)return;const n=g.step.value*(a.shiftKey?10:1),t=e(a.key,a.currentTarget,f()),r="ArrowLeft"===t?{dx:-n,dy:0}:"ArrowRight"===t?{dx:n,dy:0}:"ArrowUp"===t?{dx:0,dy:-n}:"ArrowDown"===t?{dx:0,dy:n}:null;r&&(a.preventDefault(),y.value=!0,g.moveBy(r.dx,r.dy))}function h(){y.value&&(y.value=!1,g.announceRelease("move"))}return(e,a)=>(d(),r("div",{class:"skdx-floating-panel__header","data-part":"header","data-dragging":c(g).dragging.value?"":void 0,"data-disabled":c(g).disabled.value?"":void 0,"aria-disabled":c(g).disabled.value||void 0,"aria-keyshortcuts":c(g).draggable.value?"ArrowUp ArrowDown ArrowLeft ArrowRight":void 0,tabindex:c(g).draggable.value?0:void 0,style:l({touchAction:"none",cursor:m.value?"move":void 0}),onPointerdown:w,onPointermove:x,onPointerup:b,onPointercancel:b,onKeydown:A,onKeyup:h},[s(e.$slots,"default")],44,v))}});export{g as default};
+import{injectRequired as e}from"../utils/injectRequired.js";import{directionalKey as a,useDirection as t}from"../utils/direction.js";import{FLOATING_PANEL_CONTEXT as r}from"./context.js";import{computed as n,createElementBlock as o,defineComponent as i,normalizeStyle as l,openBlock as d,ref as u,renderSlot as s,unref as c}from"vue";var v=["data-dragging","data-disabled","aria-disabled","aria-keyshortcuts","tabindex"],g=/* @__PURE__ */i({__name:"FloatingPanelHeader",setup(i){const g=e(r,"SkdxFloatingPanelHeader must be used within SkdxFloatingPanel."),f=t(),p=u(null),m=u(!1),y=n(()=>g.draggable.value&&!g.disabled.value);function x(e){y.value&&(e.currentTarget.setPointerCapture?.(e.pointerId),p.value={x:e.clientX,y:e.clientY},g.setDragging(!0))}function w(e){const a=p.value;!y.value||!a||(g.moveBy(e.clientX-a.x,e.clientY-a.y),p.value={x:e.clientX,y:e.clientY})}function b(e){p.value&&(e.currentTarget.releasePointerCapture?.(e.pointerId),p.value=null,g.setDragging(!1),g.announceRelease("move"))}function A(e){if(!y.value)return;const t=g.step.value*(e.shiftKey?10:1),r=function(e,a){switch(e){case"ArrowLeft":return{dx:-a,dy:0};case"ArrowRight":return{dx:a,dy:0};case"ArrowUp":return{dx:0,dy:-a};case"ArrowDown":return{dx:0,dy:a};default:return null}}(a(e.key,e.currentTarget,f()),t);r&&(e.preventDefault(),m.value=!0,g.moveBy(r.dx,r.dy))}function h(){m.value&&(m.value=!1,g.announceRelease("move"))}return(e,a)=>(d(),o("div",{class:"skdx-floating-panel__header","data-part":"header",role:"group","data-dragging":c(g).dragging.value?"":void 0,"data-disabled":c(g).disabled.value?"":void 0,"aria-disabled":c(g).disabled.value||void 0,"aria-keyshortcuts":c(g).draggable.value?"ArrowUp ArrowDown ArrowLeft ArrowRight":void 0,tabindex:c(g).draggable.value?0:void 0,style:l({touchAction:"none",cursor:y.value?"move":void 0}),onPointerdown:x,onPointermove:w,onPointerup:b,onPointercancel:b,onKeydown:A,onKeyup:h},[s(e.$slots,"default")],44,v))}});export{g as default};

package/dist/floating-panel/FloatingPanelPortal.vue.d.cts

@@ -1,10 +1,5 @@
 import type { PortalContainer } from '../utils/portal.cjs';
-/**
- * Teleports `SkdxFloatingPanelContent` to `document.body` (or a custom
- * `container`) so the panel is not clipped by whatever `overflow` ancestor its
- * trigger lives in. Mounts only while open unless `forceMount` is set. Must
- * be used inside `SkdxFloatingPanel`.
- */
+/** Teleports `SkdxFloatingPanelContent` to `document.body` (or a custom `container`), avoiding ancestor clipping. */
 type __VLS_Props = {
     /**
      * DOM node (or CSS selector) the panel is moved into.

package/dist/floating-panel/FloatingPanelPortal.vue.d.ts

@@ -1,10 +1,5 @@
 import type { PortalContainer } from '../utils/portal.js';
-/**
- * Teleports `SkdxFloatingPanelContent` to `document.body` (or a custom
- * `container`) so the panel is not clipped by whatever `overflow` ancestor its
- * trigger lives in. Mounts only while open unless `forceMount` is set. Must
- * be used inside `SkdxFloatingPanel`.
- */
+/** Teleports `SkdxFloatingPanelContent` to `document.body` (or a custom `container`), avoiding ancestor clipping. */
 type __VLS_Props = {
     /**
      * DOM node (or CSS selector) the panel is moved into.

package/dist/floating-panel/FloatingPanelPortal.vue_vue_type_script_setup_true_lang.cjs

@@ -1 +1 @@
-const o=require("../utils/Portal.vue.cjs"),a=require("./context.cjs");let e=require("vue");var l=(0,e.defineComponent)({__name:"FloatingPanelPortal",props:{container:{default:null},forceMount:{type:Boolean,default:!1}},setup(t){const n=(0,e.inject)(a.FLOATING_PANEL_CONTEXT);if(!n)throw new Error("SkdxFloatingPanelPortal must be used within SkdxFloatingPanel.");return(r,u)=>t.forceMount||(0,e.unref)(n).open.value?((0,e.openBlock)(),(0,e.createBlock)(o.default,{key:0,container:t.container},{default:(0,e.withCtx)(()=>[(0,e.renderSlot)(r.$slots,"default")]),_:3},8,["container"])):(0,e.createCommentVNode)("",!0)}});exports.default=l;
+const o=require("../utils/injectRequired.cjs"),a=require("../utils/Portal.vue.cjs"),u=require("./context.cjs");let e=require("vue");var l=(0,e.defineComponent)({__name:"FloatingPanelPortal",props:{container:{default:null},forceMount:{type:Boolean,default:!1}},setup(t){const n=o.injectRequired(u.FLOATING_PANEL_CONTEXT,"SkdxFloatingPanelPortal must be used within SkdxFloatingPanel.");return(r,i)=>t.forceMount||(0,e.unref)(n).open.value?((0,e.openBlock)(),(0,e.createBlock)(a.default,{key:0,container:t.container},{default:(0,e.withCtx)(()=>[(0,e.renderSlot)(r.$slots,"default")]),_:3},8,["container"])):(0,e.createCommentVNode)("",!0)}});exports.default=l;

package/dist/floating-panel/FloatingPanelPortal.vue_vue_type_script_setup_true_lang.js

@@ -1 +1 @@
-import e from"../utils/Portal.vue.js";import{FLOATING_PANEL_CONTEXT as t}from"./context.js";import{createBlock as o,createCommentVNode as a,defineComponent as n,inject as r,openBlock as l,renderSlot as s,unref as i,withCtx as u}from"vue";var c=/* @__PURE__ */n({__name:"FloatingPanelPortal",props:{container:{default:null},forceMount:{type:Boolean,default:!1}},setup(n){const c=r(t);if(!c)throw new Error("SkdxFloatingPanelPortal must be used within SkdxFloatingPanel.");return(t,r)=>n.forceMount||i(c).open.value?(l(),o(e,{key:0,container:n.container},{default:u(()=>[s(t.$slots,"default")]),_:3},8,["container"])):a("",!0)}});export{c as default};
+import{injectRequired as e}from"../utils/injectRequired.js";import t from"../utils/Portal.vue.js";import{FLOATING_PANEL_CONTEXT as o}from"./context.js";import{createBlock as a,createCommentVNode as n,defineComponent as r,openBlock as l,renderSlot as s,unref as i,withCtx as u}from"vue";var c=/* @__PURE__ */r({__name:"FloatingPanelPortal",props:{container:{default:null},forceMount:{type:Boolean,default:!1}},setup(r){const c=e(o,"SkdxFloatingPanelPortal must be used within SkdxFloatingPanel.");return(e,o)=>r.forceMount||i(c).open.value?(l(),a(t,{key:0,container:r.container},{default:u(()=>[s(e.$slots,"default")]),_:3},8,["container"])):n("",!0)}});export{c as default};

package/dist/floating-panel/FloatingPanelResizeTrigger.vue.d.cts

@@ -1,19 +1,5 @@
 import { type FloatingPanelResizeDirection } from './context.cjs';
-/**
- * One resize grip, for the edge or corner named by `direction`. Render as many
- * as you want — eight for a full window, one `"se"` corner for the common case.
- * Renders `role="separator"` with `aria-valuenow`/`-min`/`-max` describing the
- * controlled dimension (width for `e`/`w` and corners, height for `n`/`s`),
- * plus `aria-orientation`, `data-direction`, `data-resizing`, and `data-disabled`.
- *
- * **Keyboard-operable**: arrow keys resize along this grip's direction by the
- * root's `step` (or ×10 with Shift). Dragging a `w`/`n` grip moves the
- * panel's origin so the opposite edge stays put. Every result is clamped to
- * `minSize`/`maxSize`/the boundary and announced once on release. Mirrors
- * under `dir="rtl"`. Give it an `aria-label` — a grip announced only as
- * "separator" isn't operable by anyone who can't see where it sits. Must be
- * used inside `SkdxFloatingPanel`.
- */
+/** One keyboard-operable resize grip, for the edge or corner named by `direction`, rendered as `role="separator"`. */
 type __VLS_Props = {
     /**
      * Which edge or corner this grip pulls; corners move two edges at once. No default — a grip must say what it resizes.

package/dist/floating-panel/FloatingPanelResizeTrigger.vue.d.ts

@@ -1,19 +1,5 @@
 import { type FloatingPanelResizeDirection } from './context.js';
-/**
- * One resize grip, for the edge or corner named by `direction`. Render as many
- * as you want — eight for a full window, one `"se"` corner for the common case.
- * Renders `role="separator"` with `aria-valuenow`/`-min`/`-max` describing the
- * controlled dimension (width for `e`/`w` and corners, height for `n`/`s`),
- * plus `aria-orientation`, `data-direction`, `data-resizing`, and `data-disabled`.
- *
- * **Keyboard-operable**: arrow keys resize along this grip's direction by the
- * root's `step` (or ×10 with Shift). Dragging a `w`/`n` grip moves the
- * panel's origin so the opposite edge stays put. Every result is clamped to
- * `minSize`/`maxSize`/the boundary and announced once on release. Mirrors
- * under `dir="rtl"`. Give it an `aria-label` — a grip announced only as
- * "separator" isn't operable by anyone who can't see where it sits. Must be
- * used inside `SkdxFloatingPanel`.
- */
+/** One keyboard-operable resize grip, for the edge or corner named by `direction`, rendered as `role="separator"`. */
 type __VLS_Props = {
     /**
      * Which edge or corner this grip pulls; corners move two edges at once. No default — a grip must say what it resizes.

package/dist/floating-panel/FloatingPanelResizeTrigger.vue_vue_type_script_setup_true_lang.cjs

@@ -1 +1 @@
-const h=require("../utils/direction.cjs"),b=require("./context.cjs");let r=require("vue");var P=["aria-orientation","aria-valuenow","aria-valuemin","aria-valuemax","aria-disabled","data-direction","data-resizing","data-disabled","aria-keyshortcuts","tabindex"],T=10,R=(0,r.defineComponent)({__name:"FloatingPanelResizeTrigger",props:{direction:{}},setup(p){const a=p,e=(0,r.inject)(b.FLOATING_PANEL_CONTEXT);if(!e)throw new Error("SkdxFloatingPanelResizeTrigger must be used within SkdxFloatingPanel.");const f=h.useDirection(),o=(0,r.ref)(null),d=(0,r.ref)(!1),u=(0,r.computed)(()=>e.resizable.value&&!e.disabled.value),l=(0,r.computed)(()=>a.direction.includes("e")||a.direction.includes("w")),m=(0,r.computed)(()=>l.value?e.size.value.width:e.size.value.height),c=(0,r.computed)(()=>l.value?e.minSize.value.width:e.minSize.value.height),v=(0,r.computed)(()=>{const i=l.value?e.maxSize.value.width:e.maxSize.value.height,n=e.bounds.value,t=n?l.value?n.width-e.position.value.x:n.height-e.position.value.y:Number.POSITIVE_INFINITY;return Math.max(c.value,Math.min(i,t))}),z=(0,r.computed)(()=>a.direction==="e"||a.direction==="w"?"vertical":a.direction==="n"||a.direction==="s"?"horizontal":void 0);function w(i){u.value&&(i.currentTarget.setPointerCapture?.(i.pointerId),o.value={x:i.clientX,y:i.clientY},e.setResizing(!0))}function y(i){const n=o.value;!u.value||!n||(e.resizeBy(a.direction,i.clientX-n.x,i.clientY-n.y),o.value={x:i.clientX,y:i.clientY})}function g(i){o.value&&(i.currentTarget.releasePointerCapture?.(i.pointerId),o.value=null,e.setResizing(!1),e.announceRelease("resize"))}function x(i){if(!u.value)return;const n=e.step.value*(i.shiftKey?T:1),t=h.directionalKey(i.key,i.currentTarget,f()),s=t==="ArrowLeft"?{dx:-n,dy:0}:t==="ArrowRight"?{dx:n,dy:0}:t==="ArrowUp"?{dx:0,dy:-n}:t==="ArrowDown"?{dx:0,dy:n}:null;s&&(i.preventDefault(),d.value=!0,e.resizeBy(a.direction,s.dx,s.dy))}function _(){d.value&&(d.value=!1,e.announceRelease("resize"))}return(i,n)=>((0,r.openBlock)(),(0,r.createElementBlock)("div",{class:"skdx-floating-panel__resize-trigger","data-part":"resize-trigger",role:"separator","aria-orientation":z.value,"aria-valuenow":Math.round(m.value),"aria-valuemin":Math.round(c.value),"aria-valuemax":Number.isFinite(v.value)?Math.round(v.value):void 0,"aria-disabled":(0,r.unref)(e).disabled.value||void 0,"data-direction":a.direction,"data-resizing":(0,r.unref)(e).resizing.value?"":void 0,"data-disabled":(0,r.unref)(e).disabled.value?"":void 0,"aria-keyshortcuts":(0,r.unref)(e).resizable.value?"ArrowUp ArrowDown ArrowLeft ArrowRight":void 0,tabindex:(0,r.unref)(e).resizable.value?0:void 0,style:(0,r.normalizeStyle)({touchAction:"none",cursor:u.value?`${a.direction}-resize`:void 0}),onPointerdown:w,onPointermove:y,onPointerup:g,onPointercancel:g,onKeydown:x,onKeyup:_},[(0,r.renderSlot)(i.$slots,"default")],44,P))}});exports.default=R;
+const b=require("../utils/injectRequired.cjs"),f=require("../utils/direction.cjs"),P=require("./context.cjs");let r=require("vue");var R=["aria-orientation","aria-valuenow","aria-valuemin","aria-valuemax","aria-disabled","data-direction","data-resizing","data-disabled","aria-keyshortcuts","tabindex"],T=10,A=(0,r.defineComponent)({__name:"FloatingPanelResizeTrigger",props:{direction:{}},setup(g){const t=g,e=b.injectRequired(P.FLOATING_PANEL_CONTEXT,"SkdxFloatingPanelResizeTrigger must be used within SkdxFloatingPanel."),h=f.useDirection(),o=(0,r.ref)(null),d=(0,r.ref)(!1),u=(0,r.computed)(()=>e.resizable.value&&!e.disabled.value),l=(0,r.computed)(()=>t.direction.includes("e")||t.direction.includes("w")),p=(0,r.computed)(()=>l.value?e.size.value.width:e.size.value.height),s=(0,r.computed)(()=>l.value?e.minSize.value.width:e.minSize.value.height),c=(0,r.computed)(()=>{const i=l.value?e.maxSize.value.width:e.maxSize.value.height,n=e.bounds.value;let a=Number.POSITIVE_INFINITY;return n&&(a=l.value?n.width-e.position.value.x:n.height-e.position.value.y),Math.max(s.value,Math.min(i,a))}),m=(0,r.computed)(()=>{if(t.direction==="e"||t.direction==="w")return"vertical";if(t.direction==="n"||t.direction==="s")return"horizontal"});function z(i){u.value&&(i.currentTarget.setPointerCapture?.(i.pointerId),o.value={x:i.clientX,y:i.clientY},e.setResizing(!0))}function w(i){const n=o.value;!u.value||!n||(e.resizeBy(t.direction,i.clientX-n.x,i.clientY-n.y),o.value={x:i.clientX,y:i.clientY})}function v(i){o.value&&(i.currentTarget.releasePointerCapture?.(i.pointerId),o.value=null,e.setResizing(!1),e.announceRelease("resize"))}function y(i,n){switch(i){case"ArrowLeft":return{dx:-n,dy:0};case"ArrowRight":return{dx:n,dy:0};case"ArrowUp":return{dx:0,dy:-n};case"ArrowDown":return{dx:0,dy:n};default:return null}}function x(i){if(!u.value)return;const n=e.step.value*(i.shiftKey?T:1),a=y(f.directionalKey(i.key,i.currentTarget,h()),n);a&&(i.preventDefault(),d.value=!0,e.resizeBy(t.direction,a.dx,a.dy))}function _(){d.value&&(d.value=!1,e.announceRelease("resize"))}return(i,n)=>((0,r.openBlock)(),(0,r.createElementBlock)("div",{class:"skdx-floating-panel__resize-trigger","data-part":"resize-trigger",role:"separator","aria-orientation":m.value,"aria-valuenow":Math.round(p.value),"aria-valuemin":Math.round(s.value),"aria-valuemax":Number.isFinite(c.value)?Math.round(c.value):void 0,"aria-disabled":(0,r.unref)(e).disabled.value||void 0,"data-direction":t.direction,"data-resizing":(0,r.unref)(e).resizing.value?"":void 0,"data-disabled":(0,r.unref)(e).disabled.value?"":void 0,"aria-keyshortcuts":(0,r.unref)(e).resizable.value?"ArrowUp ArrowDown ArrowLeft ArrowRight":void 0,tabindex:(0,r.unref)(e).resizable.value?0:void 0,style:(0,r.normalizeStyle)({touchAction:"none",cursor:u.value?`${t.direction}-resize`:void 0}),onPointerdown:z,onPointermove:w,onPointerup:v,onPointercancel:v,onKeydown:x,onKeyup:_},[(0,r.renderSlot)(i.$slots,"default")],44,R))}});exports.default=A;

package/dist/floating-panel/FloatingPanelResizeTrigger.vue_vue_type_script_setup_true_lang.js

@@ -1 +1 @@
-import{directionalKey as e,useDirection as i}from"../utils/direction.js";import{FLOATING_PANEL_CONTEXT as a}from"./context.js";import{computed as t,createElementBlock as r,defineComponent as n,inject as o,normalizeStyle as l,openBlock as u,ref as d,renderSlot as s,unref as v}from"vue";var c=["aria-orientation","aria-valuenow","aria-valuemin","aria-valuemax","aria-disabled","data-direction","data-resizing","data-disabled","aria-keyshortcuts","tabindex"],g=/* @__PURE__ */n({__name:"FloatingPanelResizeTrigger",props:{direction:{}},setup(n){const g=n,h=o(a);if(!h)throw new Error("SkdxFloatingPanelResizeTrigger must be used within SkdxFloatingPanel.");const m=i(),p=d(null),z=d(!1),w=t(()=>h.resizable.value&&!h.disabled.value),x=t(()=>g.direction.includes("e")||g.direction.includes("w")),f=t(()=>x.value?h.size.value.width:h.size.value.height),y=t(()=>x.value?h.minSize.value.width:h.minSize.value.height),b=t(()=>{const e=x.value?h.maxSize.value.width:h.maxSize.value.height,i=h.bounds.value,a=i?x.value?i.width-h.position.value.x:i.height-h.position.value.y:Number.POSITIVE_INFINITY;return Math.max(y.value,Math.min(e,a))}),A=t(()=>"e"===g.direction||"w"===g.direction?"vertical":"n"===g.direction||"s"===g.direction?"horizontal":void 0);function P(e){w.value&&(e.currentTarget.setPointerCapture?.(e.pointerId),p.value={x:e.clientX,y:e.clientY},h.setResizing(!0))}function T(e){const i=p.value;!w.value||!i||(h.resizeBy(g.direction,e.clientX-i.x,e.clientY-i.y),p.value={x:e.clientX,y:e.clientY})}function S(e){p.value&&(e.currentTarget.releasePointerCapture?.(e.pointerId),p.value=null,h.setResizing(!1),h.announceRelease("resize"))}function k(i){if(!w.value)return;const a=h.step.value*(i.shiftKey?10:1),t=e(i.key,i.currentTarget,m()),r="ArrowLeft"===t?{dx:-a,dy:0}:"ArrowRight"===t?{dx:a,dy:0}:"ArrowUp"===t?{dx:0,dy:-a}:"ArrowDown"===t?{dx:0,dy:a}:null;r&&(i.preventDefault(),z.value=!0,h.resizeBy(g.direction,r.dx,r.dy))}function I(){z.value&&(z.value=!1,h.announceRelease("resize"))}return(e,i)=>(u(),r("div",{class:"skdx-floating-panel__resize-trigger","data-part":"resize-trigger",role:"separator","aria-orientation":A.value,"aria-valuenow":Math.round(f.value),"aria-valuemin":Math.round(y.value),"aria-valuemax":Number.isFinite(b.value)?Math.round(b.value):void 0,"aria-disabled":v(h).disabled.value||void 0,"data-direction":g.direction,"data-resizing":v(h).resizing.value?"":void 0,"data-disabled":v(h).disabled.value?"":void 0,"aria-keyshortcuts":v(h).resizable.value?"ArrowUp ArrowDown ArrowLeft ArrowRight":void 0,tabindex:v(h).resizable.value?0:void 0,style:l({touchAction:"none",cursor:w.value?`${g.direction}-resize`:void 0}),onPointerdown:P,onPointermove:T,onPointerup:S,onPointercancel:S,onKeydown:k,onKeyup:I},[s(e.$slots,"default")],44,c))}});export{g as default};
+import{injectRequired as e}from"../utils/injectRequired.js";import{directionalKey as i,useDirection as a}from"../utils/direction.js";import{FLOATING_PANEL_CONTEXT as t}from"./context.js";import{computed as r,createElementBlock as n,defineComponent as o,normalizeStyle as l,openBlock as u,ref as s,renderSlot as d,unref as c}from"vue";var v=["aria-orientation","aria-valuenow","aria-valuemin","aria-valuemax","aria-disabled","data-direction","data-resizing","data-disabled","aria-keyshortcuts","tabindex"],m=/* @__PURE__ */o({__name:"FloatingPanelResizeTrigger",props:{direction:{}},setup(o){const m=o,g=e(t,"SkdxFloatingPanelResizeTrigger must be used within SkdxFloatingPanel."),h=a(),p=s(null),z=s(!1),f=r(()=>g.resizable.value&&!g.disabled.value),w=r(()=>m.direction.includes("e")||m.direction.includes("w")),x=r(()=>w.value?g.size.value.width:g.size.value.height),y=r(()=>w.value?g.minSize.value.width:g.minSize.value.height),b=r(()=>{const e=w.value?g.maxSize.value.width:g.maxSize.value.height,i=g.bounds.value;let a=Number.POSITIVE_INFINITY;return i&&(a=w.value?i.width-g.position.value.x:i.height-g.position.value.y),Math.max(y.value,Math.min(e,a))}),A=r(()=>"e"===m.direction||"w"===m.direction?"vertical":"n"===m.direction||"s"===m.direction?"horizontal":void 0);function P(e){f.value&&(e.currentTarget.setPointerCapture?.(e.pointerId),p.value={x:e.clientX,y:e.clientY},g.setResizing(!0))}function R(e){const i=p.value;!f.value||!i||(g.resizeBy(m.direction,e.clientX-i.x,e.clientY-i.y),p.value={x:e.clientX,y:e.clientY})}function T(e){p.value&&(e.currentTarget.releasePointerCapture?.(e.pointerId),p.value=null,g.setResizing(!1),g.announceRelease("resize"))}function S(e){if(!f.value)return;const a=g.step.value*(e.shiftKey?10:1),t=function(e,i){switch(e){case"ArrowLeft":return{dx:-i,dy:0};case"ArrowRight":return{dx:i,dy:0};case"ArrowUp":return{dx:0,dy:-i};case"ArrowDown":return{dx:0,dy:i};default:return null}}(i(e.key,e.currentTarget,h()),a);t&&(e.preventDefault(),z.value=!0,g.resizeBy(m.direction,t.dx,t.dy))}function k(){z.value&&(z.value=!1,g.announceRelease("resize"))}return(e,i)=>(u(),n("div",{class:"skdx-floating-panel__resize-trigger","data-part":"resize-trigger",role:"separator","aria-orientation":A.value,"aria-valuenow":Math.round(x.value),"aria-valuemin":Math.round(y.value),"aria-valuemax":Number.isFinite(b.value)?Math.round(b.value):void 0,"aria-disabled":c(g).disabled.value||void 0,"data-direction":m.direction,"data-resizing":c(g).resizing.value?"":void 0,"data-disabled":c(g).disabled.value?"":void 0,"aria-keyshortcuts":c(g).resizable.value?"ArrowUp ArrowDown ArrowLeft ArrowRight":void 0,tabindex:c(g).resizable.value?0:void 0,style:l({touchAction:"none",cursor:f.value?`${m.direction}-resize`:void 0}),onPointerdown:P,onPointermove:R,onPointerup:T,onPointercancel:T,onKeydown:S,onKeyup:k},[d(e.$slots,"default")],44,v))}});export{m as default};

package/dist/floating-panel/FloatingPanelRoot.vue.d.cts

@@ -1,20 +1,6 @@
 import { type FloatingPanelGeometry, type FloatingPanelGesture, type FloatingPanelPosition, type FloatingPanelSize, type FloatingPanelStage } from './context.cjs';
 /**
- * FloatingPanel's state/context primitive: root of a draggable, resizable,
- * **non-modal** floating panel — the movable window pattern. Owns open state,
- * position, size and stage, and hands them down to children via context.
- * Renders no DOM element itself.
- *
- * Non-modal is the point: there is no backdrop, no focus trap, and no scroll
- * lock, so the page behind stays fully usable while it's open. Focus still
- * returns to the trigger on close, but only when it would otherwise be
- * stranded.
- *
- * All four of `open`, `position`, `size` and `stage` work controlled or
- * uncontrolled, independently. Geometry is reported on two channels:
- * `@position-change`/`@size-change` fire per frame, for painting;
- * `@position-commit`/`@size-commit` fire once, when the gesture settles, for
- * persisting.
+ * Root of a draggable, resizable, non-modal floating panel, owning open state, position, size and stage via context.
  *
  * @example
  * ```vue
@@ -38,96 +24,82 @@ type __VLS_Props = {
      * Whether the panel is open, for controlled usage via `v-model:open`.
      * @default undefined — uncontrolled, the panel tracks its own open state internally.
      */
-    open?: boolean;
+    open?: boolean | undefined;
     /**
      * Whether the panel is initially open, for uncontrolled usage.
      * @default false — the panel is closed until the trigger is pressed.
      */
-    defaultOpen?: boolean;
+    defaultOpen?: boolean | undefined;
     /**
-     * The panel's top-left corner in CSS pixels, measured from the boundary's
-     * top-left, for controlled usage via `v-model:position`. Pair it with
-     * `@position-change` or the panel will refuse to move.
+     * The panel's top-left corner in CSS pixels, for controlled usage via `v-model:position`.
      * @default undefined — uncontrolled, the panel tracks its own position internally.
      */
-    position?: FloatingPanelPosition;
+    position?: FloatingPanelPosition | undefined;
     /**
      * Where the panel starts, for uncontrolled usage.
      * @default { x: 0, y: 0 } — the top-left corner of the boundary.
      */
-    defaultPosition?: FloatingPanelPosition;
+    defaultPosition?: FloatingPanelPosition | undefined;
     /**
      * The panel's box in CSS pixels, for controlled usage via `v-model:size`.
-     * Pair it with `@size-change` or the panel will refuse to resize.
      * @default undefined — uncontrolled, the panel tracks its own size internally.
      */
-    size?: FloatingPanelSize;
+    size?: FloatingPanelSize | undefined;
     /**
      * The panel's starting box, for uncontrolled usage.
      * @default { width: 320, height: 240 }
      */
-    defaultSize?: FloatingPanelSize;
+    defaultSize?: FloatingPanelSize | undefined;
     /**
-     * Smallest box the panel can be resized to. Every resize is clamped to it,
-     * so a consumer never has to defend against a zero-height panel.
+     * Smallest box the panel can be resized to; every resize is clamped to it.
      * @default { width: 160, height: 120 }
      */
-    minSize?: FloatingPanelSize;
+    minSize?: FloatingPanelSize | undefined;
     /**
      * Largest box the panel can be resized to.
      * @default { width: Infinity, height: Infinity } — only the boundary limits growth.
      */
-    maxSize?: FloatingPanelSize;
+    maxSize?: FloatingPanelSize | undefined;
     /**
-     * Element the panel may not be dragged or resized out of. Position is
-     * measured from this element's top-left corner, so it must be the panel's
-     * containing block for the published geometry to line up.
+     * Element the panel may not be dragged or resized out of.
      * @default null — the viewport constrains the panel instead.
      */
-    boundary?: HTMLElement | null;
+    boundary?: Element | null | undefined;
     /**
      * The panel's window state, for controlled usage via `v-model:stage`.
      * @default undefined — uncontrolled, the panel tracks its own stage internally.
      */
-    stage?: FloatingPanelStage;
+    stage?: FloatingPanelStage | undefined;
     /**
      * The panel's starting window state, for uncontrolled usage.
      * @default 'default' — the panel uses its own position and size.
      */
-    defaultStage?: FloatingPanelStage;
+    defaultStage?: FloatingPanelStage | undefined;
     /**
-     * Whether the header can move the panel. `false` leaves the header
-     * focusable only if you make it so, and drops its `move` cursor.
+     * Whether the header can move the panel.
      * @default true — the header is a drag handle and a keyboard mover.
      */
-    draggable?: boolean;
+    draggable?: boolean | undefined;
     /**
-     * Whether resize triggers do anything. `false` makes every
-     * `SkdxFloatingPanelResizeTrigger` inert and non-focusable, so a fixed-size
-     * panel can still render its grips for visual symmetry.
+     * Whether resize triggers do anything; `false` makes every grip inert and non-focusable.
      * @default true — every grip resizes and takes a tab stop.
      */
-    resizable?: boolean;
+    resizable?: boolean | undefined;
     /**
-     * How far one arrow key moves or resizes the panel, in pixels.
-     * Shift+arrow uses ten times this.
+     * How far one arrow key moves or resizes the panel, in pixels; Shift+arrow uses ten times this.
      * @default 10 — one arrow key is a 10px nudge, one Shift+arrow a 100px jump.
      */
-    step?: number;
+    step?: number | undefined;
     /**
-     * Freezes the panel's geometry: drag, resize and stage changes are all
-     * refused and their triggers leave the tab order. Opening and closing still
-     * work — a disabled panel is inert, not unreachable.
+     * Freezes the panel's geometry: drag, resize and stage changes are all refused, but opening/closing still work.
      * @default false — the panel is fully interactive.
      */
-    disabled?: boolean;
+    disabled?: boolean | undefined;
     /**
-     * Words the polite live-region message announced once per drag or resize, on
-     * release. The numbers are already rounded to whole CSS pixels. Return `''`
-     * to announce nothing.
+     * Words the polite live-region message announced once per drag or resize, on release.
      * @default undefined — the built-in English wording ("Panel moved to 40, 25").
      */
-    getGestureAnnouncement?: (gesture: FloatingPanelGesture, detail: FloatingPanelGeometry) => string;
+    getGestureAnnouncement?: ((gesture: FloatingPanelGesture, detail: FloatingPanelGeometry) => string) | undefined;
 };
 declare var __VLS_1: {};
 type __VLS_Slots = {} & {
@@ -146,34 +118,30 @@ declare const __VLS_component: import("vue").DefineComponent<__VLS_Props, {}, {}
     "update:stage": (stage: FloatingPanelStage) => any;
     "stage-change": (stage: FloatingPanelStage) => 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:position"?: ((position: FloatingPanelPosition) => any) | undefined;
-    "onPosition-change"?: ((position: FloatingPanelPosition) => any) | undefined;
-    "onPosition-commit"?: ((position: FloatingPanelPosition) => any) | undefined;
-    "onUpdate:size"?: ((size: FloatingPanelSize) => any) | undefined;
-    "onSize-change"?: ((size: FloatingPanelSize) => any) | undefined;
-    "onSize-commit"?: ((size: FloatingPanelSize) => any) | undefined;
-    "onUpdate:stage"?: ((stage: FloatingPanelStage) => any) | undefined;
-    "onStage-change"?: ((stage: FloatingPanelStage) => any) | undefined;
+    "onUpdate:open"?: (open: boolean) => any;
+    "onOpen-change"?: (open: boolean) => any;
+    "onOpen-change-complete"?: (open: boolean) => any;
+    "onUpdate:position"?: (position: FloatingPanelPosition) => any;
+    "onPosition-change"?: (position: FloatingPanelPosition) => any;
+    "onPosition-commit"?: (position: FloatingPanelPosition) => any;
+    "onUpdate:size"?: (size: FloatingPanelSize) => any;
+    "onSize-change"?: (size: FloatingPanelSize) => any;
+    "onSize-commit"?: (size: FloatingPanelSize) => any;
+    "onUpdate:stage"?: (stage: FloatingPanelStage) => any;
+    "onStage-change"?: (stage: FloatingPanelStage) => any;
 }>, {
-    position: FloatingPanelPosition;
-    disabled: boolean;
-    open: boolean;
-    defaultOpen: boolean;
-    size: FloatingPanelSize;
-    step: number;
-    draggable: boolean;
-    boundary: HTMLElement | null;
-    resizable: boolean;
-    defaultSize: FloatingPanelSize;
-    minSize: FloatingPanelSize;
-    maxSize: FloatingPanelSize;
-    stage: FloatingPanelStage;
-    defaultPosition: FloatingPanelPosition;
-    defaultStage: FloatingPanelStage;
-    getGestureAnnouncement: (gesture: FloatingPanelGesture, detail: FloatingPanelGeometry) => string;
+    disabled: boolean | undefined;
+    open: boolean | undefined;
+    defaultOpen: boolean | undefined;
+    step: number | undefined;
+    draggable: boolean | undefined;
+    boundary: Element | null | undefined;
+    resizable: boolean | undefined;
+    defaultSize: FloatingPanelSize | undefined;
+    minSize: FloatingPanelSize | undefined;
+    maxSize: FloatingPanelSize | undefined;
+    defaultPosition: FloatingPanelPosition | undefined;
+    defaultStage: FloatingPanelStage | undefined;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
 export default _default;