@skdx/web-components 0.27.0 → 0.29.0

package/dist/floating-panel/FloatingPanel.js

@@ -1,5 +1,5 @@
-var E=Object.defineProperty;var P=Object.getOwnPropertyDescriptor;var i=(n,a,e,o)=>{for(var r=o>1?void 0:o?P(a,e):a,h=n.length-1,l;h>=0;h--)(l=n[h])&&(r=(o?l(a,e,r):l(r))||r);return o&&r&&E(a,e,r),r};import{css as S,html as F,LitElement as I}from"lit";import{property as s,state as z}from"lit/decorators.js";import{closestThroughPortal as O}from"../internal/closest.js";import{customElement as x}from"../internal/define.js";import{nextId as y}from"../internal/ids.js";import{optOutBoolean as v}from"../internal/positioning.js";import{announce as M}from"../utils/live-announcer.js";var w='a[href], button:not([disabled]), input:not([disabled]), select:not([disabled]), textarea:not([disabled]), [tabindex]:not([tabindex="-1"])';function T(n){(n.matches(w)?n:n.shadowRoot?.querySelector(w)??n).focus({preventScroll:!0})}function A(n,{position:a,size:e}){return n==="move"?`Panel moved to ${a.x}, ${a.y}`:`Panel resized to ${e.width} by ${e.height}`}var m=Object.freeze({x:0,y:0}),b=Object.freeze({width:320,height:240}),B=Object.freeze({width:160,height:120}),G=Object.freeze({width:Number.POSITIVE_INFINITY,height:Number.POSITIVE_INFINITY});function f(n,a,e){return Math.min(Math.max(n,a),e)}function c(n,a,e,o){return f(n,a,Math.max(a,Math.min(e,o)))}function H(n){return O(n,"skdx-floating-panel")}var t=class extends I{constructor(){super(...arguments);this.open=!1;this.defaultOpen=!1;this.position=m;this.defaultPosition=m;this.size=b;this.defaultSize=b;this.minSize=B;this.maxSize=G;this.boundary=null;this.stage="default";this.defaultStage="default";this.draggable=!0;this.resizable=!0;this.step=10;this.disabled=!1;this.contentId=y("skdx-floating-panel-content");this.titleId=y("skdx-floating-panel-title");this.triggerEl=null;this.contentEl=null;this.dragging=!1;this.resizing=!1;this.hasUpdatedOnce=!1}connectedCallback(){super.connectedCallback(),this.defaultOpen&&!this.hasAttribute("open")&&(this.open=!0),this.position===m&&(this.position=this.defaultPosition),this.size===b&&(this.size=this.defaultSize),this.hasAttribute("stage")||(this.stage=this.defaultStage)}updated(e){let o=!this.hasUpdatedOnce;this.hasUpdatedOnce=!0,e.has("open")&&!o&&(this.dispatchEvent(new CustomEvent("open-change",{detail:this.open,bubbles:!0,composed:!0})),this.open||this.restoreFocus()),e.size>0&&this.dispatchEvent(new CustomEvent("skdx-floating-panel-internal-update"))}restoreFocus(){let e=document.activeElement;(!e||e===document.body||this.contentEl?.contains(e))&&this.triggerEl&&T(this.triggerEl)}setOpen(e){this.open!==e&&(this.open=e)}setStage(e){this.disabled||this.stage===e||(this.stage=e,this.dispatchEvent(new CustomEvent("stage-change",{detail:e,bubbles:!0,composed:!0})))}getBounds(){if(this.boundary){let e=this.boundary.getBoundingClientRect();return{width:e.width,height:e.height}}return{width:window.innerWidth,height:window.innerHeight}}setPosition(e){this.position=e,this.dispatchEvent(new CustomEvent("position-change",{detail:e,bubbles:!0,composed:!0}))}setSize(e){this.size=e,this.dispatchEvent(new CustomEvent("size-change",{detail:e,bubbles:!0,composed:!0}))}moveBy(e,o){if(this.disabled||!this.draggable)return;let r=this.getBounds(),h={x:f(this.position.x+e,0,Math.max(0,r.width-this.size.width)),y:f(this.position.y+o,0,Math.max(0,r.height-this.size.height))};(h.x!==this.position.x||h.y!==this.position.y)&&this.setPosition(h)}resizeBy(e,o,r){if(this.disabled||!this.resizable)return;let h=this.getBounds(),{x:l,y:g}=this.position,{width:u,height:d}=this.size;if(e.includes("e")&&(u=c(this.size.width+o,this.minSize.width,this.maxSize.width,h.width-l)),e.includes("w")){let p=l+u;u=c(this.size.width-o,this.minSize.width,this.maxSize.width,p),l=p-u}if(e.includes("s")&&(d=c(this.size.height+r,this.minSize.height,this.maxSize.height,h.height-g)),e.includes("n")){let p=g+d;d=c(this.size.height-r,this.minSize.height,this.maxSize.height,p),g=p-d}(u!==this.size.width||d!==this.size.height)&&this.setSize({width:u,height:d}),(l!==this.position.x||g!==this.position.y)&&this.setPosition({x:l,y:g})}announceRelease(e){let o={position:{x:Math.round(this.position.x),y:Math.round(this.position.y)},size:{width:Math.round(this.size.width),height:Math.round(this.size.height)}};M((this.getGestureAnnouncement??A)(e,o))}render(){return F`<slot></slot>`}};t.styles=S`
+var P=Object.defineProperty;var F=Object.getOwnPropertyDescriptor;var i=(a,r,t,s)=>{for(var n=s>1?void 0:s?F(r,t):r,h=a.length-1,l;h>=0;h--)(l=a[h])&&(n=(s?l(r,t,n):l(n))||n);return s&&n&&P(r,t,n),n};import{css as M,html as S,LitElement as A}from"lit";import{property as o,state as v}from"lit/decorators.js";import{hasGeneratedContent as I}from"../internal/authored.js";import{closestThroughPortal as L}from"../internal/closest.js";import{customElement as x}from"../internal/define.js";import{nextId as E}from"../internal/ids.js";import{notifyOpenChangeComplete as T}from"../internal/open-change-complete.js";import{optOutBoolean as b}from"../internal/positioning.js";import{announce as B}from"../utils/live-announcer.js";import{fillFloatingPanelAnatomy as C,FLOATING_PANEL_ANATOMY_GENERATED as R,refreshFloatingPanelAnatomy as N}from"./FloatingPanelAnatomy.js";import"./FloatingPanelTrigger.js";import{emit as d}from"../internal/events.js";import{FLOATING_PANEL_FAMILY as w}from"./family.js";var O='a[href], button:not([disabled]), input:not([disabled]), select:not([disabled]), textarea:not([disabled]), [tabindex]:not([tabindex="-1"])';function _(a){(a.matches(O)?a:a.shadowRoot?.querySelector(O)??a).focus({preventScroll:!0})}function G(a,{position:r,size:t}){return a==="move"?`Panel moved to ${r.x}, ${r.y}`:`Panel resized to ${t.width} by ${t.height}`}var z=Object.freeze({x:0,y:0}),y=Object.freeze({width:320,height:240}),$=Object.freeze({width:160,height:120}),j=Object.freeze({width:Number.POSITIVE_INFINITY,height:Number.POSITIVE_INFINITY});function g(a,r,t){return Math.min(Math.max(a,r),t)}function f(a,r,t,s){return g(a,r,Math.max(r,Math.min(t,s)))}function et(a){return L(a,w.selector)}var e=class extends A{constructor(){super(...arguments);this.open=!1;this.defaultOpen=!1;this.position=z;this.defaultPosition=z;this.size=y;this.defaultSize=y;this.minSize=$;this.maxSize=j;this.boundary=null;this.stage="default";this.defaultStage="default";this.draggable=!0;this.resizable=!0;this.step=10;this.disabled=!1;this.title="";this.stages=[];this.dismissible=!0;this.contentId=E("skdx-floating-panel-content");this.titleId=E("skdx-floating-panel-title");this.triggerEl=null;this.contentEl=null;this.titleEl=null;this.dragging=!1;this.resizing=!1;this.hasUpdatedOnce=!1;this.boundsObserver=null;this.windowResizeListener=null;this.bounds=null;this.fillAnatomy=()=>{let t=`${!!this.title}|${this.stages.length}|${this.dismissible}|${this.resizable}`;t!==this._anatomyFilledFor||!I(this,R)?(this._anatomyFilledFor=t,C(this)):N(this)}}connectedCallback(){super.connectedCallback(),this.defaultOpen&&!this.hasAttribute("open")&&(this.open=!0),this.position===z&&(this.position=this.defaultPosition),this.size===y&&(this.size=this.defaultSize),this.hasAttribute("stage")||(this.stage=this.defaultStage),this.watchBounds();let t=this.querySelector("skdx-floating-panel-content")?.id;t&&(this.contentId=t),queueMicrotask(this.fillAnatomy)}watchBounds(){let t=()=>this.applyBounds(this.getBounds());if(t(),this.boundary&&typeof ResizeObserver<"u"){this.boundsObserver=new ResizeObserver(t),this.boundsObserver.observe(this.boundary);return}this.windowResizeListener=t,window.addEventListener("resize",t)}unwatchBounds(){this.boundsObserver?.disconnect(),this.boundsObserver=null,this.windowResizeListener&&window.removeEventListener("resize",this.windowResizeListener),this.windowResizeListener=null}applyBounds(t){this.bounds=t;let s=Math.min(this.size.width,Math.max(this.minSize.width,t.width)),n=Math.min(this.size.height,Math.max(this.minSize.height,t.height));(s!==this.size.width||n!==this.size.height)&&this.setSize({width:s,height:n});let h=g(this.position.x,0,Math.max(0,t.width-s)),l=g(this.position.y,0,Math.max(0,t.height-n));(h!==this.position.x||l!==this.position.y)&&this.setPosition({x:h,y:l}),w.notify(this)}updated(t){this.fillAnatomy();let s=!this.hasUpdatedOnce;this.hasUpdatedOnce=!0,t.has("open")&&!s&&(d(this,"open-change",this.open),this.open||this.restoreFocus(),this.teardownOpenChangeComplete?.(),this.teardownOpenChangeComplete=T(()=>this.contentEl,this.open,n=>d(this,"open-change-complete",n))),t.has("boundary")&&!s&&(this.unwatchBounds(),this.watchBounds()),t.size>0&&w.notify(this)}disconnectedCallback(){this.teardownOpenChangeComplete?.(),this.unwatchBounds(),super.disconnectedCallback()}restoreFocus(){let t=document.activeElement;(!t||t===document.body||this.contentEl?.contains(t))&&this.triggerEl&&_(this.triggerEl)}setOpen(t){this.open!==t&&(this.open=t)}setStage(t){this.disabled||this.stage===t||(this.stage=t,d(this,"stage-change",t))}getBounds(){if(this.boundary){let t=this.boundary.getBoundingClientRect();return{width:t.width,height:t.height}}return{width:window.innerWidth,height:window.innerHeight}}setPosition(t){this.position=t,d(this,"position-change",t)}setSize(t){this.size=t,d(this,"size-change",t)}moveBy(t,s){if(this.disabled||!this.draggable)return;let n=this.getBounds(),h={x:g(this.position.x+t,0,Math.max(0,n.width-this.size.width)),y:g(this.position.y+s,0,Math.max(0,n.height-this.size.height))};(h.x!==this.position.x||h.y!==this.position.y)&&this.setPosition(h)}resizeBy(t,s,n){if(this.disabled||!this.resizable)return;let h=this.getBounds(),{x:l,y:p}=this.position,{width:u,height:m}=this.size;if(t.includes("e")&&(u=f(this.size.width+s,this.minSize.width,this.maxSize.width,h.width-l)),t.includes("w")){let c=l+u;u=f(this.size.width-s,this.minSize.width,this.maxSize.width,c),l=c-u}if(t.includes("s")&&(m=f(this.size.height+n,this.minSize.height,this.maxSize.height,h.height-p)),t.includes("n")){let c=p+m;m=f(this.size.height-n,this.minSize.height,this.maxSize.height,c),p=c-m}(u!==this.size.width||m!==this.size.height)&&this.setSize({width:u,height:m}),(l!==this.position.x||p!==this.position.y)&&this.setPosition({x:l,y:p})}announceRelease(t){t==="resize"&&d(this,"size-commit",this.size),d(this,"position-commit",this.position);let s={position:{x:Math.round(this.position.x),y:Math.round(this.position.y)},size:{width:Math.round(this.size.width),height:Math.round(this.size.height)}};B((this.getGestureAnnouncement??G)(t,s))}render(){return S`<slot @slotchange=${this.fillAnatomy}></slot>`}};e.styles=M`
     :host {
       display: contents;
     }
-  `,i([s({type:Boolean,reflect:!0})],t.prototype,"open",2),i([s({type:Boolean,attribute:"default-open"})],t.prototype,"defaultOpen",2),i([s({attribute:!1})],t.prototype,"position",2),i([s({type:Object,attribute:"default-position"})],t.prototype,"defaultPosition",2),i([s({attribute:!1})],t.prototype,"size",2),i([s({type:Object,attribute:"default-size"})],t.prototype,"defaultSize",2),i([s({type:Object,attribute:"min-size"})],t.prototype,"minSize",2),i([s({type:Object,attribute:"max-size"})],t.prototype,"maxSize",2),i([s({attribute:!1})],t.prototype,"boundary",2),i([s({type:String,reflect:!0})],t.prototype,"stage",2),i([s({type:String,attribute:"default-stage"})],t.prototype,"defaultStage",2),i([s({converter:v})],t.prototype,"draggable",2),i([s({converter:v})],t.prototype,"resizable",2),i([s({type:Number})],t.prototype,"step",2),i([s({type:Boolean,reflect:!0})],t.prototype,"disabled",2),i([s({attribute:!1})],t.prototype,"getGestureAnnouncement",2),i([z()],t.prototype,"dragging",2),i([z()],t.prototype,"resizing",2),t=i([x("skdx-floating-panel")],t);export{t as SkdxFloatingPanel,H as findFloatingPanel,A as gestureAnnouncement};
+  `,i([o({type:Boolean,reflect:!0})],e.prototype,"open",2),i([o({type:Boolean,attribute:"default-open"})],e.prototype,"defaultOpen",2),i([o({attribute:!1})],e.prototype,"position",2),i([o({type:Object,attribute:"default-position"})],e.prototype,"defaultPosition",2),i([o({attribute:!1})],e.prototype,"size",2),i([o({type:Object,attribute:"default-size"})],e.prototype,"defaultSize",2),i([o({type:Object,attribute:"min-size"})],e.prototype,"minSize",2),i([o({type:Object,attribute:"max-size"})],e.prototype,"maxSize",2),i([o({attribute:!1})],e.prototype,"boundary",2),i([o({type:String,reflect:!0})],e.prototype,"stage",2),i([o({type:String,attribute:"default-stage"})],e.prototype,"defaultStage",2),i([o({converter:b})],e.prototype,"draggable",2),i([o({converter:b})],e.prototype,"resizable",2),i([o({type:Number})],e.prototype,"step",2),i([o({type:Boolean,reflect:!0})],e.prototype,"disabled",2),i([o({attribute:!1})],e.prototype,"getGestureAnnouncement",2),i([o({type:String})],e.prototype,"title",2),i([o({attribute:!1})],e.prototype,"stages",2),i([o({converter:b})],e.prototype,"dismissible",2),i([v()],e.prototype,"dragging",2),i([v()],e.prototype,"resizing",2),e=i([x("skdx-floating-panel")],e);export{e as SkdxFloatingPanel,et as findFloatingPanel,G as gestureAnnouncement};

package/dist/floating-panel/FloatingPanelAnatomy.cjs

@@ -0,0 +1 @@
+"use strict";var p=Object.defineProperty;var x=Object.getOwnPropertyDescriptor;var A=Object.getOwnPropertyNames;var b=Object.prototype.hasOwnProperty;var k=(t,e)=>{for(var l in e)p(t,l,{get:e[l],enumerable:!0})},h=(t,e,l,o)=>{if(e&&typeof e=="object"||typeof e=="function")for(let a of A(e))!b.call(t,a)&&a!==l&&p(t,a,{get:()=>e[a],enumerable:!(o=x(e,a))||o.enumerable});return t};var E=t=>h(p({},"__esModule",{value:!0}),t);var C={};k(C,{FLOATING_PANEL_ANATOMY_GENERATED:()=>s,fillFloatingPanelAnatomy:()=>y,hasAuthoredFloatingPanelParts:()=>m,refreshFloatingPanelAnatomy:()=>N});module.exports=E(C);var g=require("../internal/derive.cjs"),u=require("../internal/host-attributes.cjs"),T=require("./FloatingPanelPortal.cjs"),v=require("./FloatingPanelContent.cjs"),w=require("./FloatingPanelHeader.cjs"),G=require("./FloatingPanelTitle.cjs"),_=require("./FloatingPanelStageTrigger.cjs"),q=require("./FloatingPanelCloseTrigger.cjs"),z=require("./FloatingPanelResizeTrigger.cjs"),M=require("../utils/visually-hidden.cjs"),s="data-skdx-floating-panel-generated",P=["skdx-floating-panel-trigger","skdx-floating-panel-portal","skdx-floating-panel-content","skdx-floating-panel-header","skdx-floating-panel-title","skdx-floating-panel-close-trigger","skdx-floating-panel-resize-trigger","skdx-floating-panel-stage-trigger"],d="http://www.w3.org/2000/svg";function S(){let t=document.createElementNS(d,"svg");t.setAttribute("viewBox","0 0 16 16"),t.setAttribute("width","1em"),t.setAttribute("height","1em"),t.setAttribute("fill","none"),t.setAttribute("aria-hidden","true"),t.setAttribute("focusable","false");let e=document.createElementNS(d,"path");return e.setAttribute("d","M4 4l8 8M12 4l-8 8"),e.setAttribute("stroke","currentColor"),e.setAttribute("stroke-width","1.5"),e.setAttribute("stroke-linecap","round"),t.append(e),t}function f(t){return t.querySelector(`:scope > skdx-floating-panel-portal[${s}]`)?.portalHost.querySelector("skdx-floating-panel-content")??null}function m(t){return P.some(e=>(0,g.hasAuthoredPart)(t,e,s))}function y(t){if(m(t))return;let e=f(t),o=Array.from(e?e.childNodes:t.childNodes).filter(n=>!(n.nodeType===Node.ELEMENT_NODE&&n.hasAttribute(s))),a=document.createElement("skdx-floating-panel-portal");a.setAttribute(s,"");let r=document.createElement("skdx-floating-panel-content");(0,u.forwardHostAttributes)(t,r);let i=document.createElement("skdx-floating-panel-header");if(i.setAttribute(s,""),i.setAttribute("aria-label","Drag to move panel"),t.title){let n=document.createElement("skdx-floating-panel-title");n.textContent=t.title,i.append(n)}for(let n of t.stages){let c=document.createElement("skdx-floating-panel-stage-trigger");c.setAttribute("stage",n.stage),c.textContent=n.label,i.append(c)}if(t.dismissible){let n=document.createElement("skdx-floating-panel-close-trigger"),c=document.createElement("skdx-visually-hidden");c.textContent="Close",n.append(c,S()),i.append(n)}if(r.append(i,...o),t.resizable){let n=document.createElement("skdx-floating-panel-resize-trigger");n.setAttribute(s,""),n.setAttribute("direction","se"),n.setAttribute("aria-label","Resize panel"),r.append(n)}a.append(r),t.replaceChildren(a)}function N(t){let l=f(t)?.querySelector(`:scope > skdx-floating-panel-header[${s}]`);if(!l)return;let o=l.querySelector(":scope > skdx-floating-panel-title");o&&t.title&&o.textContent!==t.title&&(o.textContent=t.title);let a=l.querySelectorAll(":scope > skdx-floating-panel-stage-trigger");t.stages.forEach((r,i)=>{let n=a[i];n&&(n.setAttribute("stage",r.stage),n.textContent!==r.label&&(n.textContent=r.label))})}0&&(module.exports={FLOATING_PANEL_ANATOMY_GENERATED,fillFloatingPanelAnatomy,hasAuthoredFloatingPanelParts,refreshFloatingPanelAnatomy});

package/dist/floating-panel/FloatingPanelAnatomy.d.cts

@@ -0,0 +1,23 @@
+import type { SkdxFloatingPanel } from './FloatingPanel.cjs';
+import './FloatingPanelPortal.cjs';
+import './FloatingPanelContent.cjs';
+import './FloatingPanelHeader.cjs';
+import './FloatingPanelTitle.cjs';
+import './FloatingPanelStageTrigger.cjs';
+import './FloatingPanelCloseTrigger.cjs';
+import './FloatingPanelResizeTrigger.cjs';
+import '../utils/visually-hidden.cjs';
+/** @internal Marks an element this module generated — on the Portal, and on the Header and grip inside Content. */
+export declare const FLOATING_PANEL_ANATOMY_GENERATED = "data-skdx-floating-panel-generated";
+/** @internal Whether the consumer hand-composed any of this family's own parts as a direct child. */
+export declare function hasAuthoredFloatingPanelParts(root: Element): boolean;
+/**
+ * Builds a portalled Content with Header/Title/stage-triggers/close/resize-grip, gated on their respective props.
+ * @internal
+ */
+export declare function fillFloatingPanelAnatomy(root: SkdxFloatingPanel): void;
+/**
+ * Updates Title text and stage-trigger labels in place, without a structural rebuild.
+ * @internal
+ */
+export declare function refreshFloatingPanelAnatomy(root: SkdxFloatingPanel): void;

package/dist/floating-panel/FloatingPanelAnatomy.d.ts

@@ -0,0 +1,23 @@
+import type { SkdxFloatingPanel } from './FloatingPanel.js';
+import './FloatingPanelPortal.js';
+import './FloatingPanelContent.js';
+import './FloatingPanelHeader.js';
+import './FloatingPanelTitle.js';
+import './FloatingPanelStageTrigger.js';
+import './FloatingPanelCloseTrigger.js';
+import './FloatingPanelResizeTrigger.js';
+import '../utils/visually-hidden.js';
+/** @internal Marks an element this module generated — on the Portal, and on the Header and grip inside Content. */
+export declare const FLOATING_PANEL_ANATOMY_GENERATED = "data-skdx-floating-panel-generated";
+/** @internal Whether the consumer hand-composed any of this family's own parts as a direct child. */
+export declare function hasAuthoredFloatingPanelParts(root: Element): boolean;
+/**
+ * Builds a portalled Content with Header/Title/stage-triggers/close/resize-grip, gated on their respective props.
+ * @internal
+ */
+export declare function fillFloatingPanelAnatomy(root: SkdxFloatingPanel): void;
+/**
+ * Updates Title text and stage-trigger labels in place, without a structural rebuild.
+ * @internal
+ */
+export declare function refreshFloatingPanelAnatomy(root: SkdxFloatingPanel): void;

package/dist/floating-panel/FloatingPanelAnatomy.js

@@ -0,0 +1 @@
+import{hasAuthoredPart as g}from"../internal/derive.js";import{forwardHostAttributes as u}from"../internal/host-attributes.js";import"./FloatingPanelPortal.js";import"./FloatingPanelContent.js";import"./FloatingPanelHeader.js";import"./FloatingPanelTitle.js";import"./FloatingPanelStageTrigger.js";import"./FloatingPanelCloseTrigger.js";import"./FloatingPanelResizeTrigger.js";import"../utils/visually-hidden.js";var o="data-skdx-floating-panel-generated",f=["skdx-floating-panel-trigger","skdx-floating-panel-portal","skdx-floating-panel-content","skdx-floating-panel-header","skdx-floating-panel-title","skdx-floating-panel-close-trigger","skdx-floating-panel-resize-trigger","skdx-floating-panel-stage-trigger"],p="http://www.w3.org/2000/svg";function m(){let t=document.createElementNS(p,"svg");t.setAttribute("viewBox","0 0 16 16"),t.setAttribute("width","1em"),t.setAttribute("height","1em"),t.setAttribute("fill","none"),t.setAttribute("aria-hidden","true"),t.setAttribute("focusable","false");let n=document.createElementNS(p,"path");return n.setAttribute("d","M4 4l8 8M12 4l-8 8"),n.setAttribute("stroke","currentColor"),n.setAttribute("stroke-width","1.5"),n.setAttribute("stroke-linecap","round"),t.append(n),t}function d(t){return t.querySelector(`:scope > skdx-floating-panel-portal[${o}]`)?.portalHost.querySelector("skdx-floating-panel-content")??null}function x(t){return f.some(n=>g(t,n,o))}function F(t){if(x(t))return;let n=d(t),i=Array.from(n?n.childNodes:t.childNodes).filter(e=>!(e.nodeType===Node.ELEMENT_NODE&&e.hasAttribute(o))),s=document.createElement("skdx-floating-panel-portal");s.setAttribute(o,"");let a=document.createElement("skdx-floating-panel-content");u(t,a);let l=document.createElement("skdx-floating-panel-header");if(l.setAttribute(o,""),l.setAttribute("aria-label","Drag to move panel"),t.title){let e=document.createElement("skdx-floating-panel-title");e.textContent=t.title,l.append(e)}for(let e of t.stages){let r=document.createElement("skdx-floating-panel-stage-trigger");r.setAttribute("stage",e.stage),r.textContent=e.label,l.append(r)}if(t.dismissible){let e=document.createElement("skdx-floating-panel-close-trigger"),r=document.createElement("skdx-visually-hidden");r.textContent="Close",e.append(r,m()),l.append(e)}if(a.append(l,...i),t.resizable){let e=document.createElement("skdx-floating-panel-resize-trigger");e.setAttribute(o,""),e.setAttribute("direction","se"),e.setAttribute("aria-label","Resize panel"),a.append(e)}s.append(a),t.replaceChildren(s)}function T(t){let c=d(t)?.querySelector(`:scope > skdx-floating-panel-header[${o}]`);if(!c)return;let i=c.querySelector(":scope > skdx-floating-panel-title");i&&t.title&&i.textContent!==t.title&&(i.textContent=t.title);let s=c.querySelectorAll(":scope > skdx-floating-panel-stage-trigger");t.stages.forEach((a,l)=>{let e=s[l];e&&(e.setAttribute("stage",a.stage),e.textContent!==a.label&&(e.textContent=a.label))})}export{o as FLOATING_PANEL_ANATOMY_GENERATED,F as fillFloatingPanelAnatomy,x as hasAuthoredFloatingPanelParts,T as refreshFloatingPanelAnatomy};

package/dist/floating-panel/FloatingPanelCloseTrigger.cjs

@@ -1,4 +1,4 @@
-"use strict";var s=Object.defineProperty;var d=Object.getOwnPropertyDescriptor;var u=Object.getOwnPropertyNames;var g=Object.prototype.hasOwnProperty;var k=(o,t)=>{for(var l in t)s(o,l,{get:t[l],enumerable:!0})},v=(o,t,l,r)=>{if(t&&typeof t=="object"||typeof t=="function")for(let e of u(t))!g.call(o,e)&&e!==l&&s(o,e,{get:()=>t[e],enumerable:!(r=d(t,e))||r.enumerable});return o};var x=o=>v(s({},"__esModule",{value:!0}),o),m=(o,t,l,r)=>{for(var e=r>1?void 0:r?d(t,l):t,c=o.length-1,p;c>=0;c--)(p=o[c])&&(e=(r?p(t,l,e):p(e))||e);return r&&e&&s(t,l,e),e};var y={};k(y,{SkdxFloatingPanelCloseTrigger:()=>a});module.exports=x(y);var i=require("lit"),h=require("../internal/aria-label.cjs"),f=require("../internal/define.cjs"),n=require("../internal/styles.cjs"),b=require("./FloatingPanel.cjs");var a=class extends i.LitElement{constructor(){super(...arguments);this.root=null;this.label=null;this.handleClick=()=>this.root?.setOpen(!1)}connectedCallback(){if(super.connectedCallback(),this.label??(this.label=(0,h.takeHostAriaLabel)(this)),this.root??(this.root=(0,b.findFloatingPanel)(this)),!this.root)throw new Error("<skdx-floating-panel-close-trigger> must be used inside <skdx-floating-panel>.")}render(){return i.html`
+"use strict";var n=Object.defineProperty;var d=Object.getOwnPropertyDescriptor;var b=Object.getOwnPropertyNames;var g=Object.prototype.hasOwnProperty;var k=(o,t)=>{for(var l in t)n(o,l,{get:t[l],enumerable:!0})},v=(o,t,l,r)=>{if(t&&typeof t=="object"||typeof t=="function")for(let e of b(t))!g.call(o,e)&&e!==l&&n(o,e,{get:()=>t[e],enumerable:!(r=d(t,e))||r.enumerable});return o};var y=o=>v(n({},"__esModule",{value:!0}),o),m=(o,t,l,r)=>{for(var e=r>1?void 0:r?d(t,l):t,p=o.length-1,c;p>=0;p--)(c=o[p])&&(e=(r?c(t,l,e):c(e))||e);return r&&e&&n(t,l,e),e};var x={};k(x,{SkdxFloatingPanelCloseTrigger:()=>a});module.exports=y(x);var i=require("lit"),h=require("../internal/aria-label.cjs"),u=require("../internal/define.cjs"),s=require("../internal/styles.cjs"),f=require("./FloatingPanel.cjs");var a=class extends i.LitElement{constructor(){super(...arguments);this.root=null;this.label=null;this.handleClick=()=>this.root?.setOpen(!1)}connectedCallback(){if(super.connectedCallback(),this.label??(this.label=(0,h.takeHostAriaLabel)(this)),this.root??(this.root=(0,f.findFloatingPanel)(this)),!this.root)throw new Error("<skdx-floating-panel-close-trigger> must be used inside <skdx-floating-panel>.")}render(){return i.html`
       <button
         part="close-trigger"
         type="button"
@@ -7,8 +7,8 @@
       >
         <slot></slot>
       </button>
-    `}};a.shadowRootOptions=n.delegatesFocusShadowRootOptions,a.styles=[n.resetNativeControl,i.css`
+    `}};a.shadowRootOptions=s.delegatesFocusShadowRootOptions,a.styles=[s.resetNativeControl,i.css`
       :host {
         display: inline-block;
       }
-    `,n.controlBoxOnHost],a=m([(0,f.customElement)("skdx-floating-panel-close-trigger","floating-panel","close-trigger")],a);0&&(module.exports={SkdxFloatingPanelCloseTrigger});
+    `,s.controlBoxOnHost],a=m([(0,u.customElement)("skdx-floating-panel-close-trigger","floating-panel","close-trigger")],a);0&&(module.exports={SkdxFloatingPanelCloseTrigger});

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

@@ -1,17 +1,7 @@
-import { LitElement } from 'lit';
+import { LitElement, type TemplateResult } from 'lit';
 /**
- * `<skdx-floating-panel-close-trigger>` — button that closes the panel,
- * returning focus to `<skdx-floating-panel-trigger>`. Usually lives in the
- * header next to the stage triggers, but works anywhere inside
- * `<skdx-floating-panel-content>`.
- *
- * Unaffected by `disabled`, which freezes the panel's *geometry* rather than
- * sealing it shut — an inert panel you cannot dismiss is a trap.
- *
- * An `aria-label` written on this tag is moved onto the inner `<button>`, where
- * the button role actually lives — left on the host it named nothing (the host
- * has no role at all, which is a prohibited use of `aria-label`).
- *
+ * `<skdx-floating-panel-close-trigger>` — closes the panel and returns focus to the trigger.
+ * Unaffected by `disabled` (which freezes geometry, not closure). `aria-label` moves from host to inner `<button>`.
  * Must be used inside `<skdx-floating-panel>`.
  *
  * @csspart close-trigger - The native `<button>` element inside the shadow root.
@@ -23,7 +13,7 @@ export declare class SkdxFloatingPanelCloseTrigger extends LitElement {
     private label;
     connectedCallback(): void;
     private readonly handleClick;
-    render(): import("lit").TemplateResult<1>;
+    render(): TemplateResult;
 }
 declare global {
     interface HTMLElementTagNameMap {

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

@@ -1,17 +1,7 @@
-import { LitElement } from 'lit';
+import { LitElement, type TemplateResult } from 'lit';
 /**
- * `<skdx-floating-panel-close-trigger>` — button that closes the panel,
- * returning focus to `<skdx-floating-panel-trigger>`. Usually lives in the
- * header next to the stage triggers, but works anywhere inside
- * `<skdx-floating-panel-content>`.
- *
- * Unaffected by `disabled`, which freezes the panel's *geometry* rather than
- * sealing it shut — an inert panel you cannot dismiss is a trap.
- *
- * An `aria-label` written on this tag is moved onto the inner `<button>`, where
- * the button role actually lives — left on the host it named nothing (the host
- * has no role at all, which is a prohibited use of `aria-label`).
- *
+ * `<skdx-floating-panel-close-trigger>` — closes the panel and returns focus to the trigger.
+ * Unaffected by `disabled` (which freezes geometry, not closure). `aria-label` moves from host to inner `<button>`.
  * Must be used inside `<skdx-floating-panel>`.
  *
  * @csspart close-trigger - The native `<button>` element inside the shadow root.
@@ -23,7 +13,7 @@ export declare class SkdxFloatingPanelCloseTrigger extends LitElement {
     private label;
     connectedCallback(): void;
     private readonly handleClick;
-    render(): import("lit").TemplateResult<1>;
+    render(): TemplateResult;
 }
 declare global {
     interface HTMLElementTagNameMap {

package/dist/floating-panel/FloatingPanelCloseTrigger.js

@@ -1,8 +1,8 @@
-var c=Object.defineProperty;var p=Object.getOwnPropertyDescriptor;var s=(i,o,r,l)=>{for(var t=l>1?void 0:l?p(o,r):o,a=i.length-1,n;a>=0;a--)(n=i[a])&&(t=(l?n(o,r,t):n(t))||t);return l&&t&&c(o,r,t),t};import{css as d,html as m,LitElement as h,nothing as f}from"lit";import{takeHostAriaLabel as b}from"../internal/aria-label.js";import{customElement as u}from"../internal/define.js";import{controlBoxOnHost as g,delegatesFocusShadowRootOptions as k,resetNativeControl as v}from"../internal/styles.js";import{findFloatingPanel as x}from"./FloatingPanel.js";var e=class extends h{constructor(){super(...arguments);this.root=null;this.label=null;this.handleClick=()=>this.root?.setOpen(!1)}connectedCallback(){if(super.connectedCallback(),this.label??(this.label=b(this)),this.root??(this.root=x(this)),!this.root)throw new Error("<skdx-floating-panel-close-trigger> must be used inside <skdx-floating-panel>.")}render(){return m`
+var p=Object.defineProperty;var c=Object.getOwnPropertyDescriptor;var n=(i,o,r,l)=>{for(var t=l>1?void 0:l?c(o,r):o,a=i.length-1,s;a>=0;a--)(s=i[a])&&(t=(l?s(o,r,t):s(t))||t);return l&&t&&p(o,r,t),t};import{css as d,html as m,LitElement as h,nothing as u}from"lit";import{takeHostAriaLabel as f}from"../internal/aria-label.js";import{customElement as b}from"../internal/define.js";import{controlBoxOnHost as g,delegatesFocusShadowRootOptions as k,resetNativeControl as v}from"../internal/styles.js";import{findFloatingPanel as y}from"./FloatingPanel.js";var e=class extends h{constructor(){super(...arguments);this.root=null;this.label=null;this.handleClick=()=>this.root?.setOpen(!1)}connectedCallback(){if(super.connectedCallback(),this.label??(this.label=f(this)),this.root??(this.root=y(this)),!this.root)throw new Error("<skdx-floating-panel-close-trigger> must be used inside <skdx-floating-panel>.")}render(){return m`
       <button
         part="close-trigger"
         type="button"
-        aria-label=${this.label??f}
+        aria-label=${this.label??u}
         @click=${this.handleClick}
       >
         <slot></slot>
@@ -11,4 +11,4 @@ var c=Object.defineProperty;var p=Object.getOwnPropertyDescriptor;var s=(i,o,r,l
       :host {
         display: inline-block;
       }
-    `,g],e=s([u("skdx-floating-panel-close-trigger","floating-panel","close-trigger")],e);export{e as SkdxFloatingPanelCloseTrigger};
+    `,g],e=n([b("skdx-floating-panel-close-trigger","floating-panel","close-trigger")],e);export{e as SkdxFloatingPanelCloseTrigger};

package/dist/floating-panel/FloatingPanelContent.cjs

@@ -1,5 +1,5 @@
-"use strict";var d=Object.defineProperty;var c=Object.getOwnPropertyDescriptor;var m=Object.getOwnPropertyNames;var y=Object.prototype.hasOwnProperty;var v=(n,o)=>{for(var t in o)d(n,t,{get:o[t],enumerable:!0})},x=(n,o,t,i)=>{if(o&&typeof o=="object"||typeof o=="function")for(let e of m(o))!y.call(n,e)&&e!==t&&d(n,e,{get:()=>o[e],enumerable:!(i=c(o,e))||i.enumerable});return n};var E=n=>x(d({},"__esModule",{value:!0}),n),p=(n,o,t,i)=>{for(var e=i>1?void 0:i?c(o,t):o,l=n.length-1,h;l>=0;l--)(h=n[l])&&(e=(i?h(o,t,e):h(e))||e);return i&&e&&d(o,t,e),e};var b={};v(b,{SkdxFloatingPanelContent:()=>r});module.exports=E(b);var a=require("lit"),u=require("../internal/define.cjs"),s=require("../internal/dismiss.cjs"),g=require("../internal/styles.cjs"),f=require("./FloatingPanel.cjs");var r=class extends a.LitElement{constructor(){super(...arguments);this.root=null;this.onRootUpdate=()=>this.syncHostState();this.handleDocumentKeyDown=t=>{t.key!=="Escape"||!this.root?.open||(0,s.dispatchEscapeKeyDown)(this,t)&&this.root.setOpen(!1)};this.handleOutsidePointerDown=t=>{let i=this.root;if(!i?.open)return;let e=t.target;e&&(this.contains(e)||i.triggerEl?.contains(e)||(0,s.dispatchOutside)(this,"pointer-down-outside",t)&&i.setOpen(!1))};this.handleOutsideFocus=t=>{let i=this.root;if(!i?.open)return;let e=(0,s.focusOutsideTarget)(t);!e||this.contains(e)||i.triggerEl?.contains(e)||(0,s.dispatchOutside)(this,"focus-outside",t)}}connectedCallback(){if(super.connectedCallback(),this.root??(this.root=(0,f.findFloatingPanel)(this)),!this.root)throw new Error("<skdx-floating-panel-content> must be used inside <skdx-floating-panel>.");this.root.contentEl=this,this.root.addEventListener("skdx-floating-panel-internal-update",this.onRootUpdate),document.addEventListener("keydown",this.handleDocumentKeyDown),document.addEventListener("pointerdown",this.handleOutsidePointerDown,!0),document.addEventListener("focusin",this.handleOutsideFocus,!0),this.syncHostState()}disconnectedCallback(){this.root?.removeEventListener("skdx-floating-panel-internal-update",this.onRootUpdate),this.root?.contentEl===this&&(this.root.contentEl=null),document.removeEventListener("keydown",this.handleDocumentKeyDown),document.removeEventListener("pointerdown",this.handleOutsidePointerDown,!0),document.removeEventListener("focusin",this.handleOutsideFocus,!0),super.disconnectedCallback()}syncHostState(){let t=this.root;if(!t)return;this.id=t.contentId,this.setAttribute("role","dialog"),this.setAttribute("aria-modal","false"),this.setAttribute("aria-labelledby",t.titleId),this.setAttribute("data-state",t.open?"open":"closed"),this.setAttribute("data-stage",t.stage),this.toggleAttribute("data-dragging",t.dragging),this.toggleAttribute("data-resizing",t.resizing),this.toggleAttribute("data-disabled",t.disabled);let i=t.stage==="maximized"?{x:"0px",y:"0px",width:"100%",height:"100%"}:{x:`${t.position.x}px`,y:`${t.position.y}px`,width:`${t.size.width}px`,height:t.stage==="minimized"?"auto":`${t.size.height}px`};this.style.setProperty("--skdx-floating-panel-x",i.x),this.style.setProperty("--skdx-floating-panel-y",i.y),this.style.setProperty("--skdx-floating-panel-width",i.width),this.style.setProperty("--skdx-floating-panel-height",i.height),this.hidden=!t.open}render(){return a.html`<slot></slot>`}};r.styles=[a.css`
+"use strict";var d=Object.defineProperty;var p=Object.getOwnPropertyDescriptor;var E=Object.getOwnPropertyNames;var v=Object.prototype.hasOwnProperty;var x=(n,o)=>{for(var t in o)d(n,t,{get:o[t],enumerable:!0})},b=(n,o,t,e)=>{if(o&&typeof o=="object"||typeof o=="function")for(let i of E(o))!v.call(n,i)&&i!==t&&d(n,i,{get:()=>o[i],enumerable:!(e=p(o,i))||e.enumerable});return n};var w=n=>b(d({},"__esModule",{value:!0}),n),u=(n,o,t,e)=>{for(var i=e>1?void 0:e?p(o,t):o,l=n.length-1,h;l>=0;l--)(h=n[l])&&(i=(e?h(o,t,i):h(i))||i);return e&&i&&d(o,t,i),i};var L={};x(L,{SkdxFloatingPanelContent:()=>r});module.exports=w(L);var a=require("lit"),g=require("../internal/aria-part.cjs"),m=require("../internal/define.cjs"),s=require("../internal/dismiss.cjs"),f=require("../internal/styles.cjs"),c=require("./family.cjs"),y=require("./FloatingPanel.cjs");var k=".skdx-floating-panel__content, .skdx-floating-panel__trigger",r=class extends a.LitElement{constructor(){super(...arguments);this.root=null;this.onRootUpdate=()=>this.syncHostState();this.handleDocumentKeyDown=t=>{if(t.key!=="Escape"||!this.root?.open)return;let e=t.target?.closest?.(k);e&&!this.isInside(e)||(0,s.dispatchEscapeKeyDown)(this,t)&&this.root.setOpen(!1)};this.handleOutsidePointerDown=t=>{let e=this.root;if(!e?.open)return;let i=t.target;!i||this.isInside(i)||(0,s.dispatchOutside)(this,"pointer-down-outside",t)&&e.setOpen(!1)};this.handleOutsideFocus=t=>{let e=this.root;if(!e?.open)return;let i=(0,s.focusOutsideTarget)(t);!i||this.contains(i)||e.triggerEl?.contains(i)||(0,s.dispatchOutside)(this,"focus-outside",t)}}connectedCallback(){if(super.connectedCallback(),this.root??(this.root=(0,y.findFloatingPanel)(this)),!this.root)throw new Error("<skdx-floating-panel-content> must be used inside <skdx-floating-panel>.");this.root.contentEl=this,this.root.addEventListener(c.FLOATING_PANEL_FAMILY.event,this.onRootUpdate),document.addEventListener("keydown",this.handleDocumentKeyDown),document.addEventListener("pointerdown",this.handleOutsidePointerDown,!0),document.addEventListener("focusin",this.handleOutsideFocus,!0),this.syncHostState()}disconnectedCallback(){this.root?.removeEventListener(c.FLOATING_PANEL_FAMILY.event,this.onRootUpdate),this.root?.contentEl===this&&(this.root.contentEl=null),document.removeEventListener("keydown",this.handleDocumentKeyDown),document.removeEventListener("pointerdown",this.handleOutsidePointerDown,!0),document.removeEventListener("focusin",this.handleOutsideFocus,!0),super.disconnectedCallback()}syncHostState(){let t=this.root;if(!t)return;this.id?t.contentId=this.id:this.id=t.contentId,this.setAttribute("role","dialog"),this.setAttribute("aria-modal","false"),(0,g.syncPartIdRef)(this,"aria-labelledby",t.titleEl,"skdx-floating-panel-content","title"),this.setAttribute("data-state",t.open?"open":"closed"),this.setAttribute("data-stage",t.stage),this.toggleAttribute("data-dragging",t.dragging),this.toggleAttribute("data-resizing",t.resizing),this.toggleAttribute("data-disabled",t.disabled);let e=t.stage==="maximized"?{x:"0px",y:"0px",width:"100%",height:"100%"}:{x:`${t.position.x}px`,y:`${t.position.y}px`,width:`${t.size.width}px`,height:t.stage==="minimized"?"auto":`${t.size.height}px`};this.style.setProperty("--skdx-floating-panel-x",e.x),this.style.setProperty("--skdx-floating-panel-y",e.y),this.style.setProperty("--skdx-floating-panel-width",e.width),this.style.setProperty("--skdx-floating-panel-height",e.height),this.hidden=!t.open}isInside(t){return this.contains(t)||!!this.root?.triggerEl?.contains(t)}render(){return a.html`<slot></slot>`}};r.styles=[a.css`
       :host {
         display: block;
       }
-    `,g.hiddenHostStyles],r=p([(0,u.customElement)("skdx-floating-panel-content","floating-panel","content")],r);0&&(module.exports={SkdxFloatingPanelContent});
+    `,f.hiddenHostStyles],r=u([(0,m.customElement)("skdx-floating-panel-content","floating-panel","content")],r);0&&(module.exports={SkdxFloatingPanelContent});

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

@@ -1,40 +1,12 @@
-import { LitElement } from 'lit';
+import { LitElement, type TemplateResult } from 'lit';
 /**
- * `<skdx-floating-panel-content>` — the movable surface: `role="dialog"` with
- * **`aria-modal="false"`**, named by `<skdx-floating-panel-title>` through
- * `aria-labelledby`. It traps nothing, locks nothing, and covers nothing — the
- * page behind it keeps working, which is the whole reason to reach for a panel
- * instead of a dialog.
- *
- * Closes on Escape or on pointer-down outside itself and its trigger, each
- * announced first as `interact-outside` and then as the specific
- * `escape-key-down` / `pointer-down-outside`, so one `preventDefault()` vetoes
- * the dismissal either way. Focus moving outside is announced as
- * `focus-outside` but **never closes the panel**: 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, and 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 — nothing has to observe
- * the boundary for the panel to fill it. At `stage="minimized"` the height
- * becomes `auto`, collapsing the panel to whatever its header needs.
- *
- * `role`, `aria-modal`, `aria-labelledby`, `id` and every `data-*` live on this
- * **host** element rather than inside shadow DOM, because an IDREF can't cross
- * a shadow boundary: the slotted `<skdx-floating-panel-title>` shares this
- * element's light-DOM scope, and the trigger's `aria-controls` has to be able
- * to point here. Hides itself with `hidden` while closed rather than
- * unmounting, so `force-mount` would be a no-op and is not offered.
- *
- * Must be used inside `<skdx-floating-panel>` (directly, or inside its
- * `<skdx-floating-panel-portal>`).
- *
- * @fires escape-key-down - Escape was pressed while open (detail: the KeyboardEvent). Preventable.
- * @fires pointer-down-outside - A pointer-down landed outside this content and the trigger while open (detail: the PointerEvent). Preventable.
- * @fires focus-outside - Focus moved outside this content and the trigger while open (detail: the original focusin). Reported only — a non-modal panel does not close on it.
- * @fires interact-outside - Either kind of outside interaction, fired immediately before the specific event so one handler can veto both. Preventable.
+ * Movable surface; `role="dialog"` with `aria-modal="false"`, named by `<skdx-floating-panel-title>` via `aria-labelledby`.
+ * Non-modal (page behind keeps working). Closes on Escape / pointer-down-outside (both preventable); focus-outside reported only (never closes).
+ * Geometry as `--skdx-floating-panel-*` CSS vars; exposes `data-state` / `data-stage` / `data-dragging` / `data-resizing` / `data-disabled`.
+ * @fires escape-key-down - Fires on Escape while open; preventDefault() keeps the panel open.
+ * @fires pointer-down-outside - Fires on pointer-down outside the panel and trigger; preventDefault() keeps it open.
+ * @fires focus-outside - Reported only; non-modal does not close.
+ * @fires interact-outside - Either kind, fired before specific event; preventable.
  */
 export declare class SkdxFloatingPanelContent extends LitElement {
     static styles: import("lit").CSSResult[];
@@ -43,17 +15,11 @@ export declare class SkdxFloatingPanelContent extends LitElement {
     connectedCallback(): void;
     disconnectedCallback(): void;
     private syncHostState;
-    /** Escape is listened for on the document, so it works wherever focus is — the panel traps none of it. */
     private readonly handleDocumentKeyDown;
+    private isInside;
     private readonly handleOutsidePointerDown;
-    /**
-     * Reported only. Closing a non-modal panel because focus went back to the
-     * page would make it impossible to use the page and the panel together,
-     * which is the entire point of the pattern — so the veto is meaningless here
-     * and the return value is deliberately dropped.
-     */
     private readonly handleOutsideFocus;
-    render(): import("lit").TemplateResult<1>;
+    render(): TemplateResult;
 }
 declare global {
     interface HTMLElementTagNameMap {

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

@@ -1,40 +1,12 @@
-import { LitElement } from 'lit';
+import { LitElement, type TemplateResult } from 'lit';
 /**
- * `<skdx-floating-panel-content>` — the movable surface: `role="dialog"` with
- * **`aria-modal="false"`**, named by `<skdx-floating-panel-title>` through
- * `aria-labelledby`. It traps nothing, locks nothing, and covers nothing — the
- * page behind it keeps working, which is the whole reason to reach for a panel
- * instead of a dialog.
- *
- * Closes on Escape or on pointer-down outside itself and its trigger, each
- * announced first as `interact-outside` and then as the specific
- * `escape-key-down` / `pointer-down-outside`, so one `preventDefault()` vetoes
- * the dismissal either way. Focus moving outside is announced as
- * `focus-outside` but **never closes the panel**: 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, and 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 — nothing has to observe
- * the boundary for the panel to fill it. At `stage="minimized"` the height
- * becomes `auto`, collapsing the panel to whatever its header needs.
- *
- * `role`, `aria-modal`, `aria-labelledby`, `id` and every `data-*` live on this
- * **host** element rather than inside shadow DOM, because an IDREF can't cross
- * a shadow boundary: the slotted `<skdx-floating-panel-title>` shares this
- * element's light-DOM scope, and the trigger's `aria-controls` has to be able
- * to point here. Hides itself with `hidden` while closed rather than
- * unmounting, so `force-mount` would be a no-op and is not offered.
- *
- * Must be used inside `<skdx-floating-panel>` (directly, or inside its
- * `<skdx-floating-panel-portal>`).
- *
- * @fires escape-key-down - Escape was pressed while open (detail: the KeyboardEvent). Preventable.
- * @fires pointer-down-outside - A pointer-down landed outside this content and the trigger while open (detail: the PointerEvent). Preventable.
- * @fires focus-outside - Focus moved outside this content and the trigger while open (detail: the original focusin). Reported only — a non-modal panel does not close on it.
- * @fires interact-outside - Either kind of outside interaction, fired immediately before the specific event so one handler can veto both. Preventable.
+ * Movable surface; `role="dialog"` with `aria-modal="false"`, named by `<skdx-floating-panel-title>` via `aria-labelledby`.
+ * Non-modal (page behind keeps working). Closes on Escape / pointer-down-outside (both preventable); focus-outside reported only (never closes).
+ * Geometry as `--skdx-floating-panel-*` CSS vars; exposes `data-state` / `data-stage` / `data-dragging` / `data-resizing` / `data-disabled`.
+ * @fires escape-key-down - Fires on Escape while open; preventDefault() keeps the panel open.
+ * @fires pointer-down-outside - Fires on pointer-down outside the panel and trigger; preventDefault() keeps it open.
+ * @fires focus-outside - Reported only; non-modal does not close.
+ * @fires interact-outside - Either kind, fired before specific event; preventable.
  */
 export declare class SkdxFloatingPanelContent extends LitElement {
     static styles: import("lit").CSSResult[];
@@ -43,17 +15,11 @@ export declare class SkdxFloatingPanelContent extends LitElement {
     connectedCallback(): void;
     disconnectedCallback(): void;
     private syncHostState;
-    /** Escape is listened for on the document, so it works wherever focus is — the panel traps none of it. */
     private readonly handleDocumentKeyDown;
+    private isInside;
     private readonly handleOutsidePointerDown;
-    /**
-     * Reported only. Closing a non-modal panel because focus went back to the
-     * page would make it impossible to use the page and the panel together,
-     * which is the entire point of the pattern — so the veto is meaningless here
-     * and the return value is deliberately dropped.
-     */
     private readonly handleOutsideFocus;
-    render(): import("lit").TemplateResult<1>;
+    render(): TemplateResult;
 }
 declare global {
     interface HTMLElementTagNameMap {

package/dist/floating-panel/FloatingPanelContent.js

@@ -1,5 +1,5 @@
-var h=Object.defineProperty;var c=Object.getOwnPropertyDescriptor;var d=(s,o,t,e)=>{for(var i=e>1?void 0:e?c(o,t):o,r=s.length-1,a;r>=0;r--)(a=s[r])&&(i=(e?a(o,t,i):a(i))||i);return e&&i&&h(o,t,i),i};import{css as p,html as u,LitElement as g}from"lit";import{customElement as f}from"../internal/define.js";import{dispatchEscapeKeyDown as m,dispatchOutside as l,focusOutsideTarget as y}from"../internal/dismiss.js";import{hiddenHostStyles as v}from"../internal/styles.js";import{findFloatingPanel as x}from"./FloatingPanel.js";var n=class extends g{constructor(){super(...arguments);this.root=null;this.onRootUpdate=()=>this.syncHostState();this.handleDocumentKeyDown=t=>{t.key!=="Escape"||!this.root?.open||m(this,t)&&this.root.setOpen(!1)};this.handleOutsidePointerDown=t=>{let e=this.root;if(!e?.open)return;let i=t.target;i&&(this.contains(i)||e.triggerEl?.contains(i)||l(this,"pointer-down-outside",t)&&e.setOpen(!1))};this.handleOutsideFocus=t=>{let e=this.root;if(!e?.open)return;let i=y(t);!i||this.contains(i)||e.triggerEl?.contains(i)||l(this,"focus-outside",t)}}connectedCallback(){if(super.connectedCallback(),this.root??(this.root=x(this)),!this.root)throw new Error("<skdx-floating-panel-content> must be used inside <skdx-floating-panel>.");this.root.contentEl=this,this.root.addEventListener("skdx-floating-panel-internal-update",this.onRootUpdate),document.addEventListener("keydown",this.handleDocumentKeyDown),document.addEventListener("pointerdown",this.handleOutsidePointerDown,!0),document.addEventListener("focusin",this.handleOutsideFocus,!0),this.syncHostState()}disconnectedCallback(){this.root?.removeEventListener("skdx-floating-panel-internal-update",this.onRootUpdate),this.root?.contentEl===this&&(this.root.contentEl=null),document.removeEventListener("keydown",this.handleDocumentKeyDown),document.removeEventListener("pointerdown",this.handleOutsidePointerDown,!0),document.removeEventListener("focusin",this.handleOutsideFocus,!0),super.disconnectedCallback()}syncHostState(){let t=this.root;if(!t)return;this.id=t.contentId,this.setAttribute("role","dialog"),this.setAttribute("aria-modal","false"),this.setAttribute("aria-labelledby",t.titleId),this.setAttribute("data-state",t.open?"open":"closed"),this.setAttribute("data-stage",t.stage),this.toggleAttribute("data-dragging",t.dragging),this.toggleAttribute("data-resizing",t.resizing),this.toggleAttribute("data-disabled",t.disabled);let e=t.stage==="maximized"?{x:"0px",y:"0px",width:"100%",height:"100%"}:{x:`${t.position.x}px`,y:`${t.position.y}px`,width:`${t.size.width}px`,height:t.stage==="minimized"?"auto":`${t.size.height}px`};this.style.setProperty("--skdx-floating-panel-x",e.x),this.style.setProperty("--skdx-floating-panel-y",e.y),this.style.setProperty("--skdx-floating-panel-width",e.width),this.style.setProperty("--skdx-floating-panel-height",e.height),this.hidden=!t.open}render(){return u`<slot></slot>`}};n.styles=[p`
+var c=Object.defineProperty;var p=Object.getOwnPropertyDescriptor;var d=(s,o,t,e)=>{for(var i=e>1?void 0:e?p(o,t):o,r=s.length-1,a;r>=0;r--)(a=s[r])&&(i=(e?a(o,t,i):a(i))||i);return e&&i&&c(o,t,i),i};import{css as u,html as g,LitElement as m}from"lit";import{syncPartIdRef as f}from"../internal/aria-part.js";import{customElement as y}from"../internal/define.js";import{dispatchEscapeKeyDown as E,dispatchOutside as l,focusOutsideTarget as v}from"../internal/dismiss.js";import{hiddenHostStyles as x}from"../internal/styles.js";import{FLOATING_PANEL_FAMILY as h}from"./family.js";import{findFloatingPanel as b}from"./FloatingPanel.js";var w=".skdx-floating-panel__content, .skdx-floating-panel__trigger",n=class extends m{constructor(){super(...arguments);this.root=null;this.onRootUpdate=()=>this.syncHostState();this.handleDocumentKeyDown=t=>{if(t.key!=="Escape"||!this.root?.open)return;let e=t.target?.closest?.(w);e&&!this.isInside(e)||E(this,t)&&this.root.setOpen(!1)};this.handleOutsidePointerDown=t=>{let e=this.root;if(!e?.open)return;let i=t.target;!i||this.isInside(i)||l(this,"pointer-down-outside",t)&&e.setOpen(!1)};this.handleOutsideFocus=t=>{let e=this.root;if(!e?.open)return;let i=v(t);!i||this.contains(i)||e.triggerEl?.contains(i)||l(this,"focus-outside",t)}}connectedCallback(){if(super.connectedCallback(),this.root??(this.root=b(this)),!this.root)throw new Error("<skdx-floating-panel-content> must be used inside <skdx-floating-panel>.");this.root.contentEl=this,this.root.addEventListener(h.event,this.onRootUpdate),document.addEventListener("keydown",this.handleDocumentKeyDown),document.addEventListener("pointerdown",this.handleOutsidePointerDown,!0),document.addEventListener("focusin",this.handleOutsideFocus,!0),this.syncHostState()}disconnectedCallback(){this.root?.removeEventListener(h.event,this.onRootUpdate),this.root?.contentEl===this&&(this.root.contentEl=null),document.removeEventListener("keydown",this.handleDocumentKeyDown),document.removeEventListener("pointerdown",this.handleOutsidePointerDown,!0),document.removeEventListener("focusin",this.handleOutsideFocus,!0),super.disconnectedCallback()}syncHostState(){let t=this.root;if(!t)return;this.id?t.contentId=this.id:this.id=t.contentId,this.setAttribute("role","dialog"),this.setAttribute("aria-modal","false"),f(this,"aria-labelledby",t.titleEl,"skdx-floating-panel-content","title"),this.setAttribute("data-state",t.open?"open":"closed"),this.setAttribute("data-stage",t.stage),this.toggleAttribute("data-dragging",t.dragging),this.toggleAttribute("data-resizing",t.resizing),this.toggleAttribute("data-disabled",t.disabled);let e=t.stage==="maximized"?{x:"0px",y:"0px",width:"100%",height:"100%"}:{x:`${t.position.x}px`,y:`${t.position.y}px`,width:`${t.size.width}px`,height:t.stage==="minimized"?"auto":`${t.size.height}px`};this.style.setProperty("--skdx-floating-panel-x",e.x),this.style.setProperty("--skdx-floating-panel-y",e.y),this.style.setProperty("--skdx-floating-panel-width",e.width),this.style.setProperty("--skdx-floating-panel-height",e.height),this.hidden=!t.open}isInside(t){return this.contains(t)||!!this.root?.triggerEl?.contains(t)}render(){return g`<slot></slot>`}};n.styles=[u`
       :host {
         display: block;
       }
-    `,v],n=d([f("skdx-floating-panel-content","floating-panel","content")],n);export{n as SkdxFloatingPanelContent};
+    `,x],n=d([y("skdx-floating-panel-content","floating-panel","content")],n);export{n as SkdxFloatingPanelContent};

package/dist/floating-panel/FloatingPanelHeader.cjs

@@ -1,7 +1,7 @@
-"use strict";var s=Object.defineProperty;var h=Object.getOwnPropertyDescriptor;var u=Object.getOwnPropertyNames;var m=Object.prototype.hasOwnProperty;var y=(r,t)=>{for(var e in t)s(r,e,{get:t[e],enumerable:!0})},f=(r,t,e,i)=>{if(t&&typeof t=="object"||typeof t=="function")for(let n of u(t))!m.call(r,n)&&n!==e&&s(r,n,{get:()=>t[n],enumerable:!(i=h(t,n))||i.enumerable});return r};var E=r=>f(s({},"__esModule",{value:!0}),r),g=(r,t,e,i)=>{for(var n=i>1?void 0:i?h(t,e):t,d=r.length-1,l;d>=0;d--)(l=r[d])&&(n=(i?l(t,e,n):l(n))||n);return i&&n&&s(t,e,n),n};var b={};y(b,{SkdxFloatingPanelHeader:()=>o});module.exports=E(b);var a=require("lit"),p=require("../internal/define.cjs"),v=require("./FloatingPanel.cjs"),c=require("./gesture.cjs");var o=class extends a.LitElement{constructor(){super(...arguments);this.root=null;this.onRootUpdate=()=>this.syncHostState();this.dragOrigin=null;this.nudged=!1;this.handlePointerDown=e=>{this.canDrag&&(this.setPointerCapture?.(e.pointerId),this.dragOrigin={x:e.clientX,y:e.clientY},this.root&&(this.root.dragging=!0))};this.handlePointerMove=e=>{let i=this.dragOrigin;!this.canDrag||!i||(this.root?.moveBy(e.clientX-i.x,e.clientY-i.y),this.dragOrigin={x:e.clientX,y:e.clientY})};this.endDrag=e=>{this.dragOrigin&&(this.releasePointerCapture?.(e.pointerId),this.dragOrigin=null,this.root&&(this.root.dragging=!1),this.root?.announceRelease("move"))};this.handleKeyDown=e=>{if(!this.canDrag||!this.root)return;let i=(0,c.arrowDelta)(e,this,this.root.step);i&&(e.preventDefault(),this.nudged=!0,this.root.moveBy(i.dx,i.dy))};this.handleKeyUp=()=>{this.nudged&&(this.nudged=!1,this.root?.announceRelease("move"))}}get canDrag(){return!!this.root&&this.root.draggable&&!this.root.disabled}connectedCallback(){if(super.connectedCallback(),this.root??(this.root=(0,v.findFloatingPanel)(this)),!this.root)throw new Error("<skdx-floating-panel-header> must be used inside <skdx-floating-panel>.");this.root.addEventListener("skdx-floating-panel-internal-update",this.onRootUpdate),this.addEventListener("pointerdown",this.handlePointerDown),this.addEventListener("pointermove",this.handlePointerMove),this.addEventListener("pointerup",this.endDrag),this.addEventListener("pointercancel",this.endDrag),this.addEventListener("keydown",this.handleKeyDown),this.addEventListener("keyup",this.handleKeyUp),this.syncHostState()}disconnectedCallback(){this.root?.removeEventListener("skdx-floating-panel-internal-update",this.onRootUpdate),this.removeEventListener("pointerdown",this.handlePointerDown),this.removeEventListener("pointermove",this.handlePointerMove),this.removeEventListener("pointerup",this.endDrag),this.removeEventListener("pointercancel",this.endDrag),this.removeEventListener("keydown",this.handleKeyDown),this.removeEventListener("keyup",this.handleKeyUp),super.disconnectedCallback()}syncHostState(){let e=this.root;e&&(this.setAttribute("role","group"),this.toggleAttribute("data-dragging",e.dragging),this.toggleAttribute("data-disabled",e.disabled),this.canDrag?this.tabIndex=0:this.removeAttribute("tabindex"),this.style.cursor=this.canDrag?"move":"")}render(){return a.html`<slot></slot>`}};o.styles=a.css`
+"use strict";var a=Object.defineProperty;var g=Object.getOwnPropertyDescriptor;var m=Object.getOwnPropertyNames;var y=Object.prototype.hasOwnProperty;var b=(n,t)=>{for(var e in t)a(n,e,{get:t[e],enumerable:!0})},f=(n,t,e,i)=>{if(t&&typeof t=="object"||typeof t=="function")for(let r of m(t))!y.call(n,r)&&r!==e&&a(n,r,{get:()=>t[r],enumerable:!(i=g(t,r))||i.enumerable});return n};var E=n=>f(a({},"__esModule",{value:!0}),n),p=(n,t,e,i)=>{for(var r=i>1?void 0:i?g(t,e):t,d=n.length-1,l;d>=0;d--)(l=n[d])&&(r=(i?l(t,e,r):l(r))||r);return i&&r&&a(t,e,r),r};var L={};b(L,{SkdxFloatingPanelHeader:()=>o});module.exports=E(L);var s=require("lit"),u=require("../internal/define.cjs"),h=require("./family.cjs"),v=require("./FloatingPanel.cjs"),c=require("./gesture.cjs");var o=class extends s.LitElement{constructor(){super(...arguments);this.root=null;this.onRootUpdate=()=>this.syncHostState();this.dragOrigin=null;this.nudged=!1;this.handlePointerDown=e=>{this.canDrag&&(this.setPointerCapture?.(e.pointerId),this.dragOrigin={x:e.clientX,y:e.clientY},this.root&&(this.root.dragging=!0))};this.handlePointerMove=e=>{let i=this.dragOrigin;!this.canDrag||!i||(this.root?.moveBy(e.clientX-i.x,e.clientY-i.y),this.dragOrigin={x:e.clientX,y:e.clientY})};this.endDrag=e=>{this.dragOrigin&&(this.releasePointerCapture?.(e.pointerId),this.dragOrigin=null,this.root&&(this.root.dragging=!1),this.root?.announceRelease("move"))};this.handleKeyDown=e=>{if(!this.canDrag||!this.root)return;let i=(0,c.arrowDelta)(e,this,this.root.step);i&&(e.preventDefault(),this.nudged=!0,this.root.moveBy(i.dx,i.dy))};this.handleKeyUp=()=>{this.nudged&&(this.nudged=!1,this.root?.announceRelease("move"))}}get canDrag(){return!!this.root&&this.root.draggable&&!this.root.disabled}connectedCallback(){if(super.connectedCallback(),this.root??(this.root=(0,v.findFloatingPanel)(this)),!this.root)throw new Error("<skdx-floating-panel-header> must be used inside <skdx-floating-panel>.");this.root.addEventListener(h.FLOATING_PANEL_FAMILY.event,this.onRootUpdate),this.addEventListener("pointerdown",this.handlePointerDown),this.addEventListener("pointermove",this.handlePointerMove),this.addEventListener("pointerup",this.endDrag),this.addEventListener("pointercancel",this.endDrag),this.addEventListener("keydown",this.handleKeyDown),this.addEventListener("keyup",this.handleKeyUp),this.syncHostState()}disconnectedCallback(){this.root?.removeEventListener(h.FLOATING_PANEL_FAMILY.event,this.onRootUpdate),this.removeEventListener("pointerdown",this.handlePointerDown),this.removeEventListener("pointermove",this.handlePointerMove),this.removeEventListener("pointerup",this.endDrag),this.removeEventListener("pointercancel",this.endDrag),this.removeEventListener("keydown",this.handleKeyDown),this.removeEventListener("keyup",this.handleKeyUp),super.disconnectedCallback()}syncHostState(){let e=this.root;e&&(this.setAttribute("role","group"),this.toggleAttribute("data-dragging",e.dragging),this.toggleAttribute("data-disabled",e.disabled),e.disabled?this.setAttribute("aria-disabled","true"):this.removeAttribute("aria-disabled"),e.draggable?this.setAttribute("aria-keyshortcuts","ArrowUp ArrowDown ArrowLeft ArrowRight"):this.removeAttribute("aria-keyshortcuts"),e.draggable?this.tabIndex=0:this.removeAttribute("tabindex"),this.style.cursor=this.canDrag?"move":"")}render(){return s.html`<slot></slot>`}};o.styles=s.css`
     :host {
       display: block;
       /* A touch drag must not also scroll the page under the panel. */
       touch-action: none;
     }
-  `,o=g([(0,p.customElement)("skdx-floating-panel-header","floating-panel","header")],o);0&&(module.exports={SkdxFloatingPanelHeader});
+  `,o=p([(0,u.customElement)("skdx-floating-panel-header","floating-panel","header")],o);0&&(module.exports={SkdxFloatingPanelHeader});

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

@@ -1,26 +1,10 @@
-import { LitElement } from 'lit';
+import { LitElement, type TemplateResult } from 'lit';
 /**
- * `<skdx-floating-panel-header>` — the panel's drag handle: the bar you grab to
- * move the window, and the natural home for `<skdx-floating-panel-title>` and
- * the close/stage buttons.
- *
- * **Keyboard-operable, not mouse-only.** While focused, the arrow keys move
- * the panel by the root's `step` and Shift+arrow by ten times that, clamped to
- * the boundary exactly as a drag would be. The final position is announced
- * politely once, on release — never per frame. Under `dir="rtl"` the
- * horizontal arrows mirror.
- *
- * It becomes focusable (`tabindex="0"`) whenever dragging is actually
- * available, so give it an `aria-label` — a focusable bar with no name tells a
- * screen-reader user nothing about what the arrow keys will do. The host
- * carries `role="group"` so that name is allowed to land on it: a bare custom
- * element has no role at all, and `aria-label` on a roleless element is a
- * prohibited use that names nothing (axe's `aria-prohibited-attr`). Unlike the
- * close and stage triggers, the label cannot be forwarded into the shadow root
- * here — this host *is* the focus target and the arrow-key handler.
- *
- * Exposes `data-dragging` while a gesture is in flight and `data-disabled`
- * while the root is disabled. Must be used inside `<skdx-floating-panel>`.
+ * Panel drag handle supporting keyboard (`ArrowKey` moves by `step`, Shift+arrow
+ * moves by 10× `step`, clamped to boundary; rtl mirrors). Keyboard movement
+ * announces position once on release. Must have `aria-label` and `role="group"`
+ * to name the arrow keys' function to screen readers.
+ * Exposes `data-dragging` and `data-disabled`. Must be inside `<skdx-floating-panel>`.
  *
  * @example
  * ```html
@@ -34,11 +18,6 @@ export declare class SkdxFloatingPanelHeader extends LitElement {
     static styles: import("lit").CSSResult;
     private root;
     private readonly onRootUpdate;
-    /**
-     * The pointer position the last move was measured from, and the record that
-     * a drag is in progress. This — not `hasPointerCapture` — is the source of
-     * truth, because some environments cannot report capture reliably.
-     */
     private dragOrigin;
     private nudged;
     private get canDrag();
@@ -49,9 +28,8 @@ export declare class SkdxFloatingPanelHeader extends LitElement {
     private readonly handlePointerMove;
     private readonly endDrag;
     private readonly handleKeyDown;
-    /** One announcement per gesture, not per keypress: the user hears where they landed, not every step. */
     private readonly handleKeyUp;
-    render(): import("lit").TemplateResult<1>;
+    render(): TemplateResult;
 }
 declare global {
     interface HTMLElementTagNameMap {

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

@@ -1,26 +1,10 @@
-import { LitElement } from 'lit';
+import { LitElement, type TemplateResult } from 'lit';
 /**
- * `<skdx-floating-panel-header>` — the panel's drag handle: the bar you grab to
- * move the window, and the natural home for `<skdx-floating-panel-title>` and
- * the close/stage buttons.
- *
- * **Keyboard-operable, not mouse-only.** While focused, the arrow keys move
- * the panel by the root's `step` and Shift+arrow by ten times that, clamped to
- * the boundary exactly as a drag would be. The final position is announced
- * politely once, on release — never per frame. Under `dir="rtl"` the
- * horizontal arrows mirror.
- *
- * It becomes focusable (`tabindex="0"`) whenever dragging is actually
- * available, so give it an `aria-label` — a focusable bar with no name tells a
- * screen-reader user nothing about what the arrow keys will do. The host
- * carries `role="group"` so that name is allowed to land on it: a bare custom
- * element has no role at all, and `aria-label` on a roleless element is a
- * prohibited use that names nothing (axe's `aria-prohibited-attr`). Unlike the
- * close and stage triggers, the label cannot be forwarded into the shadow root
- * here — this host *is* the focus target and the arrow-key handler.
- *
- * Exposes `data-dragging` while a gesture is in flight and `data-disabled`
- * while the root is disabled. Must be used inside `<skdx-floating-panel>`.
+ * Panel drag handle supporting keyboard (`ArrowKey` moves by `step`, Shift+arrow
+ * moves by 10× `step`, clamped to boundary; rtl mirrors). Keyboard movement
+ * announces position once on release. Must have `aria-label` and `role="group"`
+ * to name the arrow keys' function to screen readers.
+ * Exposes `data-dragging` and `data-disabled`. Must be inside `<skdx-floating-panel>`.
  *
  * @example
  * ```html
@@ -34,11 +18,6 @@ export declare class SkdxFloatingPanelHeader extends LitElement {
     static styles: import("lit").CSSResult;
     private root;
     private readonly onRootUpdate;
-    /**
-     * The pointer position the last move was measured from, and the record that
-     * a drag is in progress. This — not `hasPointerCapture` — is the source of
-     * truth, because some environments cannot report capture reliably.
-     */
     private dragOrigin;
     private nudged;
     private get canDrag();
@@ -49,9 +28,8 @@ export declare class SkdxFloatingPanelHeader extends LitElement {
     private readonly handlePointerMove;
     private readonly endDrag;
     private readonly handleKeyDown;
-    /** One announcement per gesture, not per keypress: the user hears where they landed, not every step. */
     private readonly handleKeyUp;
-    render(): import("lit").TemplateResult<1>;
+    render(): TemplateResult;
 }
 declare global {
     interface HTMLElementTagNameMap {

package/dist/floating-panel/FloatingPanelHeader.js

@@ -1,7 +1,7 @@
-var l=Object.defineProperty;var h=Object.getOwnPropertyDescriptor;var d=(o,n,e,t)=>{for(var i=t>1?void 0:t?h(n,e):n,a=o.length-1,s;a>=0;a--)(s=o[a])&&(i=(t?s(n,e,i):s(i))||i);return t&&i&&l(n,e,i),i};import{css as g,html as p,LitElement as v}from"lit";import{customElement as c}from"../internal/define.js";import{findFloatingPanel as u}from"./FloatingPanel.js";import{arrowDelta as m}from"./gesture.js";var r=class extends v{constructor(){super(...arguments);this.root=null;this.onRootUpdate=()=>this.syncHostState();this.dragOrigin=null;this.nudged=!1;this.handlePointerDown=e=>{this.canDrag&&(this.setPointerCapture?.(e.pointerId),this.dragOrigin={x:e.clientX,y:e.clientY},this.root&&(this.root.dragging=!0))};this.handlePointerMove=e=>{let t=this.dragOrigin;!this.canDrag||!t||(this.root?.moveBy(e.clientX-t.x,e.clientY-t.y),this.dragOrigin={x:e.clientX,y:e.clientY})};this.endDrag=e=>{this.dragOrigin&&(this.releasePointerCapture?.(e.pointerId),this.dragOrigin=null,this.root&&(this.root.dragging=!1),this.root?.announceRelease("move"))};this.handleKeyDown=e=>{if(!this.canDrag||!this.root)return;let t=m(e,this,this.root.step);t&&(e.preventDefault(),this.nudged=!0,this.root.moveBy(t.dx,t.dy))};this.handleKeyUp=()=>{this.nudged&&(this.nudged=!1,this.root?.announceRelease("move"))}}get canDrag(){return!!this.root&&this.root.draggable&&!this.root.disabled}connectedCallback(){if(super.connectedCallback(),this.root??(this.root=u(this)),!this.root)throw new Error("<skdx-floating-panel-header> must be used inside <skdx-floating-panel>.");this.root.addEventListener("skdx-floating-panel-internal-update",this.onRootUpdate),this.addEventListener("pointerdown",this.handlePointerDown),this.addEventListener("pointermove",this.handlePointerMove),this.addEventListener("pointerup",this.endDrag),this.addEventListener("pointercancel",this.endDrag),this.addEventListener("keydown",this.handleKeyDown),this.addEventListener("keyup",this.handleKeyUp),this.syncHostState()}disconnectedCallback(){this.root?.removeEventListener("skdx-floating-panel-internal-update",this.onRootUpdate),this.removeEventListener("pointerdown",this.handlePointerDown),this.removeEventListener("pointermove",this.handlePointerMove),this.removeEventListener("pointerup",this.endDrag),this.removeEventListener("pointercancel",this.endDrag),this.removeEventListener("keydown",this.handleKeyDown),this.removeEventListener("keyup",this.handleKeyUp),super.disconnectedCallback()}syncHostState(){let e=this.root;e&&(this.setAttribute("role","group"),this.toggleAttribute("data-dragging",e.dragging),this.toggleAttribute("data-disabled",e.disabled),this.canDrag?this.tabIndex=0:this.removeAttribute("tabindex"),this.style.cursor=this.canDrag?"move":"")}render(){return p`<slot></slot>`}};r.styles=g`
+var h=Object.defineProperty;var g=Object.getOwnPropertyDescriptor;var d=(o,r,e,t)=>{for(var i=t>1?void 0:t?g(r,e):r,s=o.length-1,a;s>=0;s--)(a=o[s])&&(i=(t?a(r,e,i):a(i))||i);return t&&i&&h(r,e,i),i};import{css as p,html as u,LitElement as v}from"lit";import{customElement as c}from"../internal/define.js";import{FLOATING_PANEL_FAMILY as l}from"./family.js";import{findFloatingPanel as m}from"./FloatingPanel.js";import{arrowDelta as y}from"./gesture.js";var n=class extends v{constructor(){super(...arguments);this.root=null;this.onRootUpdate=()=>this.syncHostState();this.dragOrigin=null;this.nudged=!1;this.handlePointerDown=e=>{this.canDrag&&(this.setPointerCapture?.(e.pointerId),this.dragOrigin={x:e.clientX,y:e.clientY},this.root&&(this.root.dragging=!0))};this.handlePointerMove=e=>{let t=this.dragOrigin;!this.canDrag||!t||(this.root?.moveBy(e.clientX-t.x,e.clientY-t.y),this.dragOrigin={x:e.clientX,y:e.clientY})};this.endDrag=e=>{this.dragOrigin&&(this.releasePointerCapture?.(e.pointerId),this.dragOrigin=null,this.root&&(this.root.dragging=!1),this.root?.announceRelease("move"))};this.handleKeyDown=e=>{if(!this.canDrag||!this.root)return;let t=y(e,this,this.root.step);t&&(e.preventDefault(),this.nudged=!0,this.root.moveBy(t.dx,t.dy))};this.handleKeyUp=()=>{this.nudged&&(this.nudged=!1,this.root?.announceRelease("move"))}}get canDrag(){return!!this.root&&this.root.draggable&&!this.root.disabled}connectedCallback(){if(super.connectedCallback(),this.root??(this.root=m(this)),!this.root)throw new Error("<skdx-floating-panel-header> must be used inside <skdx-floating-panel>.");this.root.addEventListener(l.event,this.onRootUpdate),this.addEventListener("pointerdown",this.handlePointerDown),this.addEventListener("pointermove",this.handlePointerMove),this.addEventListener("pointerup",this.endDrag),this.addEventListener("pointercancel",this.endDrag),this.addEventListener("keydown",this.handleKeyDown),this.addEventListener("keyup",this.handleKeyUp),this.syncHostState()}disconnectedCallback(){this.root?.removeEventListener(l.event,this.onRootUpdate),this.removeEventListener("pointerdown",this.handlePointerDown),this.removeEventListener("pointermove",this.handlePointerMove),this.removeEventListener("pointerup",this.endDrag),this.removeEventListener("pointercancel",this.endDrag),this.removeEventListener("keydown",this.handleKeyDown),this.removeEventListener("keyup",this.handleKeyUp),super.disconnectedCallback()}syncHostState(){let e=this.root;e&&(this.setAttribute("role","group"),this.toggleAttribute("data-dragging",e.dragging),this.toggleAttribute("data-disabled",e.disabled),e.disabled?this.setAttribute("aria-disabled","true"):this.removeAttribute("aria-disabled"),e.draggable?this.setAttribute("aria-keyshortcuts","ArrowUp ArrowDown ArrowLeft ArrowRight"):this.removeAttribute("aria-keyshortcuts"),e.draggable?this.tabIndex=0:this.removeAttribute("tabindex"),this.style.cursor=this.canDrag?"move":"")}render(){return u`<slot></slot>`}};n.styles=p`
     :host {
       display: block;
       /* A touch drag must not also scroll the page under the panel. */
       touch-action: none;
     }
-  `,r=d([c("skdx-floating-panel-header","floating-panel","header")],r);export{r as SkdxFloatingPanelHeader};
+  `,n=d([c("skdx-floating-panel-header","floating-panel","header")],n);export{n as SkdxFloatingPanelHeader};

package/dist/floating-panel/FloatingPanelPortal.cjs

@@ -1 +1 @@
-"use strict";var n=Object.defineProperty;var p=Object.getOwnPropertyDescriptor;var m=Object.getOwnPropertyNames;var k=Object.prototype.hasOwnProperty;var x=(a,e)=>{for(var l in e)n(a,l,{get:e[l],enumerable:!0})},g=(a,e,l,o)=>{if(e&&typeof e=="object"||typeof e=="function")for(let t of m(e))!k.call(a,t)&&t!==l&&n(a,t,{get:()=>e[t],enumerable:!(o=p(e,t))||o.enumerable});return a};var b=a=>g(n({},"__esModule",{value:!0}),a),d=(a,e,l,o)=>{for(var t=o>1?void 0:o?p(e,l):e,r=a.length-1,i;r>=0;r--)(i=a[r])&&(t=(o?i(e,l,t):i(t))||t);return o&&t&&n(e,l,t),t};var u={};x(u,{SkdxFloatingPanelPortal:()=>s});module.exports=b(u);var c=require("../internal/define.cjs"),f=require("../utils/portal.cjs");var s=class extends f.SkdxPortal{connectedCallback(){if(!this.closest("skdx-floating-panel"))throw new Error("<skdx-floating-panel-portal> must be used inside <skdx-floating-panel>.");this.host.setAttribute("data-skdx-floating-panel-portal",""),super.connectedCallback()}};s=d([(0,c.customElement)("skdx-floating-panel-portal")],s);0&&(module.exports={SkdxFloatingPanelPortal});
+"use strict";var s=Object.defineProperty;var p=Object.getOwnPropertyDescriptor;var k=Object.getOwnPropertyNames;var x=Object.prototype.hasOwnProperty;var b=(o,e)=>{for(var a in e)s(o,a,{get:e[a],enumerable:!0})},g=(o,e,a,r)=>{if(e&&typeof e=="object"||typeof e=="function")for(let t of k(e))!x.call(o,t)&&t!==a&&s(o,t,{get:()=>e[t],enumerable:!(r=p(e,t))||r.enumerable});return o};var u=o=>g(s({},"__esModule",{value:!0}),o),d=(o,e,a,r)=>{for(var t=r>1?void 0:r?p(e,a):e,n=o.length-1,i;n>=0;n--)(i=o[n])&&(t=(r?i(e,a,t):i(t))||t);return r&&t&&s(e,a,t),t};var h={};b(h,{SkdxFloatingPanelPortal:()=>l});module.exports=u(h);var m=require("../internal/define.cjs"),c=require("../utils/portal.cjs"),f=require("./family.cjs");var l=class extends c.SkdxPortal{connectedCallback(){if(!f.FLOATING_PANEL_FAMILY.root(this))throw new Error("<skdx-floating-panel-portal> must be used inside <skdx-floating-panel>.");this.host.setAttribute("data-skdx-floating-panel-portal",""),super.connectedCallback()}};l=d([(0,m.customElement)("skdx-floating-panel-portal")],l);0&&(module.exports={SkdxFloatingPanelPortal});