@skdx/web-components 0.30.0 → 0.31.0

package/dist/date-picker/DatePickerContent.js

@@ -1,5 +1,5 @@
-var p=Object.defineProperty;var f=Object.getOwnPropertyDescriptor;var o=(a,n,t,i)=>{for(var s=i>1?void 0:i?f(n,t):n,l=a.length-1,d;l>=0;l--)(d=a[l])&&(s=(i?d(n,t,s):d(s))||s);return i&&s&&p(n,t,s),s};import{css as m,html as v,LitElement as y}from"lit";import{property as r}from"lit/decorators.js";import{anchorOf as g,toISODateString as O}from"../calendar/Calendar.js";import{closestThroughPortal as b}from"../internal/closest.js";import{customElement as L}from"../internal/define.js";import{dispatchAutoFocus as u,dispatchEscapeKeyDown as E,dispatchOutside as c,focusOnOpen as F,focusOutsideTarget as w}from"../internal/dismiss.js";import{handleEscapeKeyDown as A,pushDismissLayer as I}from"../internal/dismissal.js";import{optOutBoolean as P,positionFloating as H}from"../internal/positioning.js";import{hiddenHostStyles as D}from"../internal/styles.js";import{focusDatePickerContent as T,focusDelegate as B}from"./auto-focus.js";import{DATE_PICKER_FAMILY as h}from"./family.js";var e=class extends y{constructor(){super(...arguments);this.side="bottom";this.align="center";this.sideOffset=4;this.alignOffset=0;this.avoidCollisions=!0;this.collisionPadding=8;this.root=null;this.onRootUpdate=()=>this.syncHostState();this.authoredLabel=!1;this.wasOpen=!1;this.dismissedOutside=!1;this.focusFrame=0;this.layer={insideElements:()=>[this,this.root?.triggerHost]};this.handleKeyDown=t=>{this.root?.open&&A(t,this.layer,()=>{E(this,t)&&this.root?.setOpen(!1)})};this.handleOutsidePointerDown=t=>{!this.root?.open||this.isInside(t.target)||c(this,"pointer-down-outside",t)&&(this.dismissedOutside=!0,this.root.setOpen(!1))};this.handleOutsideFocus=t=>{if(!this.root?.open)return;let i=w(t);i===null||this.isInside(i)||c(this,"focus-outside",t)&&(this.dismissedOutside=!0,this.root.setOpen(!1))}}get anchorISO(){let t=g(this.root?.value??null);return t?O(t):null}connectedCallback(){super.connectedCallback(),this.root=b(this,h.selector),this.root&&(this.root.contentEl=this),this.authoredLabel=this.hasAttribute("aria-label")||this.hasAttribute("aria-labelledby"),this.setAttribute("role","dialog"),this.root?.addEventListener(h.event,this.onRootUpdate),document.addEventListener("keydown",this.handleKeyDown),document.addEventListener("pointerdown",this.handleOutsidePointerDown),document.addEventListener("focusin",this.handleOutsideFocus),this.root&&(this.id?this.root.contentId=this.id:this.id=this.root.contentId),this.syncHostState()}disconnectedCallback(){this.root?.removeEventListener(h.event,this.onRootUpdate),this.root?.contentEl===this&&(this.root.contentEl=null),document.removeEventListener("keydown",this.handleKeyDown),document.removeEventListener("pointerdown",this.handleOutsidePointerDown),document.removeEventListener("focusin",this.handleOutsideFocus),this.releaseLayer?.(),this.releaseLayer=void 0,this.cleanupPosition?.(),cancelAnimationFrame(this.focusFrame),super.disconnectedCallback()}syncHostState(){let t=this.root?.open??!1;this.setAttribute("data-state",t?"open":"closed");for(let[i,s]of[["data-invalid",this.root?.invalid??!1],["data-readonly",this.root?.readOnly??!1]])s?this.setAttribute(i,""):this.removeAttribute(i);(!t||!this.hasAttribute("data-side"))&&(this.setAttribute("data-side",this.side??"bottom"),this.setAttribute("data-align",this.align??"start")),this.syncLabelledBy(),this.applyOpenState(t)}syncLabelledBy(){let t=this.root?.triggerHost?.id||this.root?.triggerId;!this.authoredLabel&&t&&this.setAttribute("aria-labelledby",t)}applyOpenState(t){this.hidden=!t,t?this.releaseLayer??(this.releaseLayer=I(this.layer)):(this.releaseLayer?.(),this.releaseLayer=void 0),t?this.activate():this.deactivate(),t!==this.wasOpen&&(this.wasOpen=t,t?this.autoFocusIn():this.autoFocusOut())}autoFocusIn(){this.dismissedOutside=!1,this.focusFrame=requestAnimationFrame(()=>{this.root?.open&&(this.contains(document.activeElement)||u(this,"open-auto-focus")&&F(()=>T(this,this.anchorISO)))})}autoFocusOut(){if(cancelAnimationFrame(this.focusFrame),this.dismissedOutside||!u(this,"close-auto-focus"))return;let t=this.root?.triggerHost;t&&B(t).focus({preventScroll:!0})}activate(){this.cleanupPosition||!this.root?.triggerHost||(this.cleanupPosition=H(this.root.triggerHost,this,{side:this.side,align:this.align,sideOffset:this.sideOffset,alignOffset:this.alignOffset,avoidCollisions:this.avoidCollisions,collisionPadding:this.collisionPadding,collisionBoundary:this.collisionBoundary}))}deactivate(){this.cleanupPosition?.(),this.cleanupPosition=void 0}isInside(t){return t?this.contains(t)||this.root?.contains(t)===!0:!1}render(){return v`<slot></slot>`}};e.styles=[D,m`
+var p=Object.defineProperty;var f=Object.getOwnPropertyDescriptor;var o=(a,n,t,i)=>{for(var s=i>1?void 0:i?f(n,t):n,l=a.length-1,d;l>=0;l--)(d=a[l])&&(s=(i?d(n,t,s):d(s))||s);return i&&s&&p(n,t,s),s};import{css as m,html as v,LitElement as y}from"lit";import{property as r}from"lit/decorators.js";import{anchorOf as g,toISODateString as O}from"../calendar/Calendar.js";import{closestThroughPortal as b}from"../internal/closest.js";import{customElement as L}from"../internal/define.js";import{dispatchAutoFocus as u,dispatchEscapeKeyDown as E,dispatchOutside as c,focusOnOpen as F,focusOutsideTarget as w}from"../internal/dismiss.js";import{handleEscapeKeyDown as A,nestedLayerContains as I,pushDismissLayer as P}from"../internal/dismissal.js";import{optOutBoolean as H,positionFloating as D}from"../internal/positioning.js";import{hiddenHostStyles as T}from"../internal/styles.js";import{focusDatePickerContent as B,focusDelegate as K}from"./auto-focus.js";import{DATE_PICKER_FAMILY as h}from"./family.js";var e=class extends y{constructor(){super(...arguments);this.side="bottom";this.align="center";this.sideOffset=4;this.alignOffset=0;this.avoidCollisions=!0;this.collisionPadding=8;this.root=null;this.onRootUpdate=()=>this.syncHostState();this.authoredLabel=!1;this.wasOpen=!1;this.dismissedOutside=!1;this.focusFrame=0;this.layer={insideElements:()=>[this,this.root?.triggerHost]};this.handleKeyDown=t=>{this.root?.open&&A(t,this.layer,()=>{E(this,t)&&this.root?.setOpen(!1)})};this.handleOutsidePointerDown=t=>{!this.root?.open||this.isInside(t.target)||c(this,"pointer-down-outside",t)&&(this.dismissedOutside=!0,this.root.setOpen(!1))};this.handleOutsideFocus=t=>{if(!this.root?.open)return;let i=w(t);i===null||this.isInside(i)||c(this,"focus-outside",t)&&(this.dismissedOutside=!0,this.root.setOpen(!1))}}get anchorISO(){let t=g(this.root?.value??null);return t?O(t):null}connectedCallback(){super.connectedCallback(),this.root=b(this,h.selector),this.root&&(this.root.contentEl=this),this.authoredLabel=this.hasAttribute("aria-label")||this.hasAttribute("aria-labelledby"),this.setAttribute("role","dialog"),this.root?.addEventListener(h.event,this.onRootUpdate),document.addEventListener("keydown",this.handleKeyDown),document.addEventListener("pointerdown",this.handleOutsidePointerDown),document.addEventListener("focusin",this.handleOutsideFocus),this.root&&(this.id?this.root.contentId=this.id:this.id=this.root.contentId),this.syncHostState()}disconnectedCallback(){this.root?.removeEventListener(h.event,this.onRootUpdate),this.root?.contentEl===this&&(this.root.contentEl=null),document.removeEventListener("keydown",this.handleKeyDown),document.removeEventListener("pointerdown",this.handleOutsidePointerDown),document.removeEventListener("focusin",this.handleOutsideFocus),this.releaseLayer?.(),this.releaseLayer=void 0,this.cleanupPosition?.(),cancelAnimationFrame(this.focusFrame),super.disconnectedCallback()}syncHostState(){let t=this.root?.open??!1;this.setAttribute("data-state",t?"open":"closed");for(let[i,s]of[["data-invalid",this.root?.invalid??!1],["data-readonly",this.root?.readOnly??!1]])s?this.setAttribute(i,""):this.removeAttribute(i);(!t||!this.hasAttribute("data-side"))&&(this.setAttribute("data-side",this.side??"bottom"),this.setAttribute("data-align",this.align??"start")),this.syncLabelledBy(),this.applyOpenState(t)}syncLabelledBy(){let t=this.root?.triggerHost?.id||this.root?.triggerId;!this.authoredLabel&&t&&this.setAttribute("aria-labelledby",t)}applyOpenState(t){this.hidden=!t,t?this.releaseLayer??(this.releaseLayer=P(this.layer)):(this.releaseLayer?.(),this.releaseLayer=void 0),t?this.activate():this.deactivate(),t!==this.wasOpen&&(this.wasOpen=t,t?this.autoFocusIn():this.autoFocusOut())}autoFocusIn(){this.dismissedOutside=!1,this.focusFrame=requestAnimationFrame(()=>{this.root?.open&&(this.contains(document.activeElement)||u(this,"open-auto-focus")&&F(()=>B(this,this.anchorISO)))})}autoFocusOut(){if(cancelAnimationFrame(this.focusFrame),this.dismissedOutside||!u(this,"close-auto-focus"))return;let t=this.root?.triggerHost;t&&K(t).focus({preventScroll:!0})}activate(){this.cleanupPosition||!this.root?.triggerHost||(this.cleanupPosition=D(this.root.triggerHost,this,{side:this.side,align:this.align,sideOffset:this.sideOffset,alignOffset:this.alignOffset,avoidCollisions:this.avoidCollisions,collisionPadding:this.collisionPadding,collisionBoundary:this.collisionBoundary}))}deactivate(){this.cleanupPosition?.(),this.cleanupPosition=void 0}isInside(t){return t?I(this.layer,t)?!0:this.contains(t)||this.root?.contains(t)===!0:!1}render(){return v`<slot></slot>`}};e.styles=[T,m`
       :host {
         display: block;
       }
-    `],o([r({type:String})],e.prototype,"side",2),o([r({type:String})],e.prototype,"align",2),o([r({type:Number,attribute:"side-offset"})],e.prototype,"sideOffset",2),o([r({type:Number,attribute:"align-offset"})],e.prototype,"alignOffset",2),o([r({converter:P,attribute:"avoid-collisions"})],e.prototype,"avoidCollisions",2),o([r({type:Number,attribute:"collision-padding"})],e.prototype,"collisionPadding",2),o([r({attribute:!1})],e.prototype,"collisionBoundary",2),e=o([L("skdx-date-picker-content","date-picker","content")],e);export{e as SkdxDatePickerContent};
+    `],o([r({type:String})],e.prototype,"side",2),o([r({type:String})],e.prototype,"align",2),o([r({type:Number,attribute:"side-offset"})],e.prototype,"sideOffset",2),o([r({type:Number,attribute:"align-offset"})],e.prototype,"alignOffset",2),o([r({converter:H,attribute:"avoid-collisions"})],e.prototype,"avoidCollisions",2),o([r({type:Number,attribute:"collision-padding"})],e.prototype,"collisionPadding",2),o([r({attribute:!1})],e.prototype,"collisionBoundary",2),e=o([L("skdx-date-picker-content","date-picker","content")],e);export{e as SkdxDatePickerContent};

package/dist/date-picker/DatePickerTrigger.cjs

@@ -1,19 +1,32 @@
-"use strict";var l=Object.defineProperty;var v=Object.getOwnPropertyDescriptor;var f=Object.getOwnPropertyNames;var g=Object.prototype.hasOwnProperty;var y=(o,t)=>{for(var i in t)l(o,i,{get:t[i],enumerable:!0})},k=(o,t,i,a)=>{if(t&&typeof t=="object"||typeof t=="function")for(let e of f(t))!g.call(o,e)&&e!==i&&l(o,e,{get:()=>t[e],enumerable:!(a=v(t,e))||a.enumerable});return o};var C=o=>k(l({},"__esModule",{value:!0}),o),m=(o,t,i,a)=>{for(var e=a>1?void 0:a?v(t,i):t,h=o.length-1,c;h>=0;h--)(c=o[h])&&(e=(a?c(t,i,e):c(e))||e);return a&&e&&l(t,i,e),e};var E={};y(E,{SkdxDatePickerTrigger:()=>r});module.exports=C(E);var s=require("lit"),u=require("lit/decorators.js"),p=require("../internal/define.cjs"),b=require("../internal/part.cjs"),d=require("../internal/styles.cjs"),n=require("./family.cjs");var r=class extends s.LitElement{constructor(){super(...arguments);this.disabled=!1;this.root=null;this.onUpdate=()=>this.requestUpdate();this.handleClick=()=>{this.isDisabled||this.root?.setOpen(!this.root.open)}}get isDisabled(){return this.disabled||(this.root?.disabled??!1)}connectedCallback(){super.connectedCallback(),this.root=n.DATE_PICKER_FAMILY.root(this),this.root?.addEventListener(n.DATE_PICKER_FAMILY.event,this.onUpdate),this.root&&(0,p.whenUpgraded)(this.root,()=>{this.root&&(this.root.triggerHost=this,this.id||(this.id=this.root.triggerId))})}disconnectedCallback(){this.root?.removeEventListener(n.DATE_PICKER_FAMILY.event,this.onUpdate),super.disconnectedCallback()}updated(){(0,b.reflectHostState)(this,{"data-state":this.root?.open??!1?"open":"closed","data-disabled":this.isDisabled?"":null,"data-invalid":this.root?.invalid??!1?"":null})}render(){let i=this.root?.open??!1;return s.html`
+"use strict";var p=Object.defineProperty;var v=Object.getOwnPropertyDescriptor;var y=Object.getOwnPropertyNames;var g=Object.prototype.hasOwnProperty;var L=(o,t)=>{for(var a in t)p(o,a,{get:t[a],enumerable:!0})},w=(o,t,a,r)=>{if(t&&typeof t=="object"||typeof t=="function")for(let e of y(t))!g.call(o,e)&&e!==a&&p(o,e,{get:()=>t[e],enumerable:!(r=v(t,e))||r.enumerable});return o};var C=o=>w(p({},"__esModule",{value:!0}),o),l=(o,t,a,r)=>{for(var e=r>1?void 0:r?v(t,a):t,u=o.length-1,b;u>=0;u--)(b=o[u])&&(e=(r?b(t,a,e):b(e))||e);return r&&e&&p(t,a,e),e};var E={};L(E,{SkdxDatePickerTrigger:()=>i});module.exports=C(E);var s=require("lit"),n=require("lit/decorators.js"),c=require("../internal/define.cjs"),f=require("../internal/field-core.cjs"),m=require("../internal/part.cjs"),d=require("../internal/styles.cjs"),h=require("./family.cjs");var i=class extends s.LitElement{constructor(){super(...arguments);this.disabled=!1;this.ariaLabel=null;this.ariaLabelledBy=null;this.ariaDescribedBy=null;this.ariaInvalid=null;this.root=null;this.onUpdate=()=>this.requestUpdate();this.handleClick=()=>{this.isDisabled||this.root?.setOpen(!this.root.open)}}get isDisabled(){return this.disabled||(this.root?.disabled??!1)}connectedCallback(){super.connectedCallback(),this.setAttribute(f.FIELD_CONTROL_ATTRIBUTE,""),this.root=h.DATE_PICKER_FAMILY.root(this),this.root?.addEventListener(h.DATE_PICKER_FAMILY.event,this.onUpdate),this.root&&(0,c.whenUpgraded)(this.root,()=>{this.root&&(this.root.triggerHost=this,this.id||(this.id=this.root.triggerId))})}disconnectedCallback(){this.root?.removeEventListener(h.DATE_PICKER_FAMILY.event,this.onUpdate),super.disconnectedCallback()}updated(){(0,m.reflectHostState)(this,{"data-state":this.root?.open??!1?"open":"closed","data-disabled":this.isDisabled?"":null,"data-invalid":this.root?.invalid??!1?"":null})}render(){let a=this.root?.open??!1;return s.html`
       <button
         part="trigger"
         type="button"
         ?disabled=${this.isDisabled}
         aria-haspopup="dialog"
-        aria-expanded=${i}
+        aria-expanded=${a}
         aria-controls=${this.root?.contentId??""}
-        aria-invalid=${this.root?.invalid?"true":s.nothing}
-        data-state=${i?"open":"closed"}
+        aria-label=${this.ariaLabel??s.nothing}
+        aria-labelledby=${this.ariaLabelledBy??s.nothing}
+        aria-describedby=${this.ariaDescribedBy??s.nothing}
+        aria-invalid=${this.root?.invalid?"true":this.ariaInvalid??s.nothing}
+        data-state=${a?"open":"closed"}
         @click=${this.handleClick}
       >
         <slot></slot>
       </button>
-    `}};r.shadowRootOptions=d.delegatesFocusShadowRootOptions,r.styles=[d.resetNativeControl,s.css`
+    `}};i.shadowRootOptions=d.delegatesFocusShadowRootOptions,i.styles=[d.resetNativeControl,s.css`
       :host {
         display: inline-block;
       }
-    `,d.controlBoxOnHost],m([(0,u.property)({type:Boolean,reflect:!0})],r.prototype,"disabled",2),r=m([(0,p.customElement)("skdx-date-picker-trigger","date-picker","trigger")],r);0&&(module.exports={SkdxDatePickerTrigger});
+
+      /* Declared locally, not left to the light-DOM :focus-visible rule: this
+         host sits inside <skdx-date-picker>'s own shadow tree, and delegated
+         focus crossing two nested shadow boundaries painted the ring around
+         the inner <button> instead of this host's own border box, leaving a
+         visible gap. A rule scoped to this shadow root paints it directly. */
+      :host(:focus-visible) {
+        outline: var(--skdx-focus-ring-width) solid var(--skdx-color-focus-ring);
+        outline-offset: var(--skdx-focus-ring-offset);
+      }
+    `,d.controlBoxOnHost],l([(0,n.property)({type:Boolean,reflect:!0})],i.prototype,"disabled",2),l([(0,n.property)({type:String,attribute:"aria-label"})],i.prototype,"ariaLabel",2),l([(0,n.property)({type:String,attribute:"aria-labelledby"})],i.prototype,"ariaLabelledBy",2),l([(0,n.property)({type:String,attribute:"aria-describedby"})],i.prototype,"ariaDescribedBy",2),l([(0,n.property)({type:String,attribute:"aria-invalid"})],i.prototype,"ariaInvalid",2),i=l([(0,c.customElement)("skdx-date-picker-trigger","date-picker","trigger")],i);0&&(module.exports={SkdxDatePickerTrigger});

package/dist/date-picker/DatePickerTrigger.d.cts

@@ -11,6 +11,14 @@ export declare class SkdxDatePickerTrigger extends LitElement {
      * @default false — the trigger follows the root's `disabled`.
      */
     disabled: boolean;
+    /** Accessible name for the trigger, mirrored onto the shadow `<button>`. @default undefined */
+    ariaLabel: string | null;
+    /** Id(s) naming the trigger, mirrored onto the shadow `<button>` — a Field writes this onto the host. @default undefined */
+    ariaLabelledBy: string | null;
+    /** Id(s) describing the trigger, mirrored onto the shadow `<button>` — a Field writes this onto the host. @default undefined */
+    ariaDescribedBy: string | null;
+    /** Marks the trigger invalid, mirrored onto the shadow `<button>` — a Field writes this onto the host. @default undefined */
+    ariaInvalid: string | null;
     private root;
     private readonly onUpdate;
     private get isDisabled();

package/dist/date-picker/DatePickerTrigger.d.ts

@@ -11,6 +11,14 @@ export declare class SkdxDatePickerTrigger extends LitElement {
      * @default false — the trigger follows the root's `disabled`.
      */
     disabled: boolean;
+    /** Accessible name for the trigger, mirrored onto the shadow `<button>`. @default undefined */
+    ariaLabel: string | null;
+    /** Id(s) naming the trigger, mirrored onto the shadow `<button>` — a Field writes this onto the host. @default undefined */
+    ariaLabelledBy: string | null;
+    /** Id(s) describing the trigger, mirrored onto the shadow `<button>` — a Field writes this onto the host. @default undefined */
+    ariaDescribedBy: string | null;
+    /** Marks the trigger invalid, mirrored onto the shadow `<button>` — a Field writes this onto the host. @default undefined */
+    ariaInvalid: string | null;
     private root;
     private readonly onUpdate;
     private get isDisabled();

package/dist/date-picker/DatePickerTrigger.js

@@ -1,4 +1,4 @@
-var p=Object.defineProperty;var h=Object.getOwnPropertyDescriptor;var l=(s,i,o,r)=>{for(var t=r>1?void 0:r?h(i,o):i,a=s.length-1,d;a>=0;a--)(d=s[a])&&(t=(r?d(i,o,t):d(t))||t);return r&&t&&p(i,o,t),t};import{css as c,html as m,LitElement as v,nothing as u}from"lit";import{property as b}from"lit/decorators.js";import{customElement as f,whenUpgraded as g}from"../internal/define.js";import{reflectHostState as y}from"../internal/part.js";import{controlBoxOnHost as k,delegatesFocusShadowRootOptions as C,resetNativeControl as E}from"../internal/styles.js";import{DATE_PICKER_FAMILY as n}from"./family.js";var e=class extends v{constructor(){super(...arguments);this.disabled=!1;this.root=null;this.onUpdate=()=>this.requestUpdate();this.handleClick=()=>{this.isDisabled||this.root?.setOpen(!this.root.open)}}get isDisabled(){return this.disabled||(this.root?.disabled??!1)}connectedCallback(){super.connectedCallback(),this.root=n.root(this),this.root?.addEventListener(n.event,this.onUpdate),this.root&&g(this.root,()=>{this.root&&(this.root.triggerHost=this,this.id||(this.id=this.root.triggerId))})}disconnectedCallback(){this.root?.removeEventListener(n.event,this.onUpdate),super.disconnectedCallback()}updated(){y(this,{"data-state":this.root?.open??!1?"open":"closed","data-disabled":this.isDisabled?"":null,"data-invalid":this.root?.invalid??!1?"":null})}render(){let o=this.root?.open??!1;return m`
+var c=Object.defineProperty;var u=Object.getOwnPropertyDescriptor;var i=(n,a,o,r)=>{for(var e=r>1?void 0:r?u(a,o):a,d=n.length-1,p;d>=0;d--)(p=n[d])&&(e=(r?p(a,o,e):p(e))||e);return r&&e&&c(a,o,e),e};import{css as b,html as v,LitElement as f,nothing as l}from"lit";import{property as s}from"lit/decorators.js";import{customElement as m,whenUpgraded as y}from"../internal/define.js";import{FIELD_CONTROL_ATTRIBUTE as g}from"../internal/field-core.js";import{reflectHostState as L}from"../internal/part.js";import{controlBoxOnHost as w,delegatesFocusShadowRootOptions as C,resetNativeControl as E}from"../internal/styles.js";import{DATE_PICKER_FAMILY as h}from"./family.js";var t=class extends f{constructor(){super(...arguments);this.disabled=!1;this.ariaLabel=null;this.ariaLabelledBy=null;this.ariaDescribedBy=null;this.ariaInvalid=null;this.root=null;this.onUpdate=()=>this.requestUpdate();this.handleClick=()=>{this.isDisabled||this.root?.setOpen(!this.root.open)}}get isDisabled(){return this.disabled||(this.root?.disabled??!1)}connectedCallback(){super.connectedCallback(),this.setAttribute(g,""),this.root=h.root(this),this.root?.addEventListener(h.event,this.onUpdate),this.root&&y(this.root,()=>{this.root&&(this.root.triggerHost=this,this.id||(this.id=this.root.triggerId))})}disconnectedCallback(){this.root?.removeEventListener(h.event,this.onUpdate),super.disconnectedCallback()}updated(){L(this,{"data-state":this.root?.open??!1?"open":"closed","data-disabled":this.isDisabled?"":null,"data-invalid":this.root?.invalid??!1?"":null})}render(){let o=this.root?.open??!1;return v`
       <button
         part="trigger"
         type="button"
@@ -6,14 +6,27 @@ var p=Object.defineProperty;var h=Object.getOwnPropertyDescriptor;var l=(s,i,o,r
         aria-haspopup="dialog"
         aria-expanded=${o}
         aria-controls=${this.root?.contentId??""}
-        aria-invalid=${this.root?.invalid?"true":u}
+        aria-label=${this.ariaLabel??l}
+        aria-labelledby=${this.ariaLabelledBy??l}
+        aria-describedby=${this.ariaDescribedBy??l}
+        aria-invalid=${this.root?.invalid?"true":this.ariaInvalid??l}
         data-state=${o?"open":"closed"}
         @click=${this.handleClick}
       >
         <slot></slot>
       </button>
-    `}};e.shadowRootOptions=C,e.styles=[E,c`
+    `}};t.shadowRootOptions=C,t.styles=[E,b`
       :host {
         display: inline-block;
       }
-    `,k],l([b({type:Boolean,reflect:!0})],e.prototype,"disabled",2),e=l([f("skdx-date-picker-trigger","date-picker","trigger")],e);export{e as SkdxDatePickerTrigger};
+
+      /* Declared locally, not left to the light-DOM :focus-visible rule: this
+         host sits inside <skdx-date-picker>'s own shadow tree, and delegated
+         focus crossing two nested shadow boundaries painted the ring around
+         the inner <button> instead of this host's own border box, leaving a
+         visible gap. A rule scoped to this shadow root paints it directly. */
+      :host(:focus-visible) {
+        outline: var(--skdx-focus-ring-width) solid var(--skdx-color-focus-ring);
+        outline-offset: var(--skdx-focus-ring-offset);
+      }
+    `,w],i([s({type:Boolean,reflect:!0})],t.prototype,"disabled",2),i([s({type:String,attribute:"aria-label"})],t.prototype,"ariaLabel",2),i([s({type:String,attribute:"aria-labelledby"})],t.prototype,"ariaLabelledBy",2),i([s({type:String,attribute:"aria-describedby"})],t.prototype,"ariaDescribedBy",2),i([s({type:String,attribute:"aria-invalid"})],t.prototype,"ariaInvalid",2),t=i([m("skdx-date-picker-trigger","date-picker","trigger")],t);export{t as SkdxDatePickerTrigger};

package/dist/date-picker/family.cjs

@@ -1 +1 @@
-"use strict";var o=Object.defineProperty;var d=Object.getOwnPropertyDescriptor;var p=Object.getOwnPropertyNames;var a=Object.prototype.hasOwnProperty;var m=(t,e)=>{for(var i in e)o(t,i,{get:e[i],enumerable:!0})},s=(t,e,i,c)=>{if(e&&typeof e=="object"||typeof e=="function")for(let r of p(e))!a.call(t,r)&&r!==i&&o(t,r,{get:()=>e[r],enumerable:!(c=d(e,r))||c.enumerable});return t};var x=t=>s(o({},"__esModule",{value:!0}),t);var P={};m(P,{DATE_PICKER_FAMILY:()=>D});module.exports=x(P);var k=require("../internal/family.cjs"),D=(0,k.defineFamily)("date-picker",{selector:"skdx-date-picker",init:{bubbles:!0,composed:!0}});0&&(module.exports={DATE_PICKER_FAMILY});
+"use strict";var k=Object.defineProperty;var a=Object.getOwnPropertyDescriptor;var o=Object.getOwnPropertyNames;var p=Object.prototype.hasOwnProperty;var m=(t,e)=>{for(var i in e)k(t,i,{get:e[i],enumerable:!0})},s=(t,e,i,d)=>{if(e&&typeof e=="object"||typeof e=="function")for(let r of o(e))!p.call(t,r)&&r!==i&&k(t,r,{get:()=>e[r],enumerable:!(d=a(e,r))||d.enumerable});return t};var x=t=>s(k({},"__esModule",{value:!0}),t);var D={};m(D,{DATE_PICKER_FAMILY:()=>n});module.exports=x(D);var c=require("../internal/family.cjs"),n=(0,c.defineFamily)("date-picker",{selector:"skdx-date-picker, skdx-date-time-picker, skdx-date-range-picker",init:{bubbles:!0,composed:!0}});0&&(module.exports={DATE_PICKER_FAMILY});

package/dist/date-picker/family.js

@@ -1 +1 @@
-import{defineFamily as e}from"../internal/family.js";var r=e("date-picker",{selector:"skdx-date-picker",init:{bubbles:!0,composed:!0}});export{r as DATE_PICKER_FAMILY};
+import{defineFamily as e}from"../internal/family.js";var r=e("date-picker",{selector:"skdx-date-picker, skdx-date-time-picker, skdx-date-range-picker",init:{bubbles:!0,composed:!0}});export{r as DATE_PICKER_FAMILY};

package/dist/date-range-picker/DateRangePicker.cjs

@@ -0,0 +1 @@
+"use strict";var s=Object.defineProperty;var i=Object.getOwnPropertyDescriptor;var o=Object.getOwnPropertyNames;var k=Object.prototype.hasOwnProperty;var l=(t,e)=>{for(var a in e)s(t,a,{get:e[a],enumerable:!0})},m=(t,e,a,d)=>{if(e&&typeof e=="object"||typeof e=="function")for(let r of o(e))!k.call(t,r)&&r!==a&&s(t,r,{get:()=>e[r],enumerable:!(d=i(e,r))||d.enumerable});return t};var g=t=>m(s({},"__esModule",{value:!0}),t);var p={};l(p,{SkdxDateRangePicker:()=>n});module.exports=g(p);var c=require("../date-picker/DatePicker.cjs"),n=class extends c.SkdxDatePicker{constructor(){super(),this.selectionMode="range"}};customElements.get("skdx-date-range-picker")===void 0&&customElements.define("skdx-date-range-picker",n);0&&(module.exports={SkdxDateRangePicker});

package/dist/date-range-picker/DateRangePicker.d.cts

@@ -0,0 +1,12 @@
+import { SkdxDatePicker } from '../date-picker/DatePicker.cjs';
+/**
+ * DateRangePicker alias of <skdx-date-picker>: the same component with `selectionMode='range'` as defaults. Every attribute, property, event and slot of `<skdx-date-picker>` applies; reach for `<skdx-date-picker>` itself for full control.
+ */
+export declare class SkdxDateRangePicker extends SkdxDatePicker {
+    constructor();
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'skdx-date-range-picker': SkdxDateRangePicker;
+    }
+}

package/dist/date-range-picker/DateRangePicker.d.ts

@@ -0,0 +1,12 @@
+import { SkdxDatePicker } from '../date-picker/DatePicker.js';
+/**
+ * DateRangePicker alias of <skdx-date-picker>: the same component with `selectionMode='range'` as defaults. Every attribute, property, event and slot of `<skdx-date-picker>` applies; reach for `<skdx-date-picker>` itself for full control.
+ */
+export declare class SkdxDateRangePicker extends SkdxDatePicker {
+    constructor();
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'skdx-date-range-picker': SkdxDateRangePicker;
+    }
+}

package/dist/date-range-picker/DateRangePicker.js

@@ -0,0 +1 @@
+import{SkdxDatePicker as t}from"../date-picker/DatePicker.js";var e=class extends t{constructor(){super(),this.selectionMode="range"}};customElements.get("skdx-date-range-picker")===void 0&&customElements.define("skdx-date-range-picker",e);export{e as SkdxDateRangePicker};

package/dist/date-range-picker/index.cjs

@@ -0,0 +1 @@
+"use strict";var o=Object.defineProperty;var c=Object.getOwnPropertyDescriptor;var d=Object.getOwnPropertyNames;var f=Object.prototype.hasOwnProperty;var g=(r,e)=>{for(var k in e)o(r,k,{get:e[k],enumerable:!0})},i=(r,e,k,t)=>{if(e&&typeof e=="object"||typeof e=="function")for(let a of d(e))!f.call(r,a)&&a!==k&&o(r,a,{get:()=>e[a],enumerable:!(t=c(e,a))||t.enumerable});return r};var m=r=>i(o({},"__esModule",{value:!0}),r);var n={};g(n,{SkdxDateRangePicker:()=>x.SkdxDateRangePicker});module.exports=m(n);var x=require("./DateRangePicker.cjs");0&&(module.exports={SkdxDateRangePicker});

package/dist/date-range-picker/index.d.cts

@@ -0,0 +1 @@
+export { SkdxDateRangePicker } from './DateRangePicker.cjs';

package/dist/date-range-picker/index.d.ts

@@ -0,0 +1 @@
+export { SkdxDateRangePicker } from './DateRangePicker.js';

package/dist/date-range-picker/index.js

@@ -0,0 +1 @@
+import{SkdxDateRangePicker as a}from"./DateRangePicker.js";export{a as SkdxDateRangePicker};

package/dist/date-time-picker/DateTimePicker.cjs

@@ -0,0 +1 @@
+"use strict";var s=Object.defineProperty;var c=Object.getOwnPropertyDescriptor;var n=Object.getOwnPropertyNames;var k=Object.prototype.hasOwnProperty;var l=(t,e)=>{for(var r in e)s(t,r,{get:e[r],enumerable:!0})},o=(t,e,r,d)=>{if(e&&typeof e=="object"||typeof e=="function")for(let i of n(e))!k.call(t,i)&&i!==r&&s(t,i,{get:()=>e[i],enumerable:!(d=c(e,i))||d.enumerable});return t};var p=t=>o(s({},"__esModule",{value:!0}),t);var u={};l(u,{SkdxDateTimePicker:()=>a});module.exports=p(u);var m=require("../date-picker/DatePicker.cjs"),a=class extends m.SkdxDatePicker{constructor(){super(),this.granularity="minute"}};customElements.get("skdx-date-time-picker")===void 0&&customElements.define("skdx-date-time-picker",a);0&&(module.exports={SkdxDateTimePicker});

package/dist/date-time-picker/DateTimePicker.d.cts

@@ -0,0 +1,12 @@
+import { SkdxDatePicker } from '../date-picker/DatePicker.cjs';
+/**
+ * DateTimePicker alias of <skdx-date-picker>: the same component with `granularity='minute'` as defaults. Every attribute, property, event and slot of `<skdx-date-picker>` applies; reach for `<skdx-date-picker>` itself for full control.
+ */
+export declare class SkdxDateTimePicker extends SkdxDatePicker {
+    constructor();
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'skdx-date-time-picker': SkdxDateTimePicker;
+    }
+}

package/dist/date-time-picker/DateTimePicker.d.ts

@@ -0,0 +1,12 @@
+import { SkdxDatePicker } from '../date-picker/DatePicker.js';
+/**
+ * DateTimePicker alias of <skdx-date-picker>: the same component with `granularity='minute'` as defaults. Every attribute, property, event and slot of `<skdx-date-picker>` applies; reach for `<skdx-date-picker>` itself for full control.
+ */
+export declare class SkdxDateTimePicker extends SkdxDatePicker {
+    constructor();
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'skdx-date-time-picker': SkdxDateTimePicker;
+    }
+}

package/dist/date-time-picker/DateTimePicker.js

@@ -0,0 +1 @@
+import{SkdxDatePicker as t}from"../date-picker/DatePicker.js";var e=class extends t{constructor(){super(),this.granularity="minute"}};customElements.get("skdx-date-time-picker")===void 0&&customElements.define("skdx-date-time-picker",e);export{e as SkdxDateTimePicker};

package/dist/date-time-picker/index.cjs

@@ -0,0 +1 @@
+"use strict";var m=Object.defineProperty;var x=Object.getOwnPropertyDescriptor;var a=Object.getOwnPropertyNames;var c=Object.prototype.hasOwnProperty;var d=(r,e)=>{for(var k in e)m(r,k,{get:e[k],enumerable:!0})},f=(r,e,k,o)=>{if(e&&typeof e=="object"||typeof e=="function")for(let i of a(e))!c.call(r,i)&&i!==k&&m(r,i,{get:()=>e[i],enumerable:!(o=x(e,i))||o.enumerable});return r};var p=r=>f(m({},"__esModule",{value:!0}),r);var D={};d(D,{SkdxDateTimePicker:()=>t.SkdxDateTimePicker});module.exports=p(D);var t=require("./DateTimePicker.cjs");0&&(module.exports={SkdxDateTimePicker});

package/dist/date-time-picker/index.d.cts

@@ -0,0 +1 @@
+export { SkdxDateTimePicker } from './DateTimePicker.cjs';

package/dist/date-time-picker/index.d.ts

@@ -0,0 +1 @@
+export { SkdxDateTimePicker } from './DateTimePicker.js';

package/dist/date-time-picker/index.js

@@ -0,0 +1 @@
+import{SkdxDateTimePicker as i}from"./DateTimePicker.js";export{i as SkdxDateTimePicker};

package/dist/dialog/DialogContent.cjs

@@ -1 +1 @@
-"use strict";var f=Object.defineProperty;var g=Object.getOwnPropertyDescriptor;var E=Object.getOwnPropertyNames;var k=Object.prototype.hasOwnProperty;var w=(n,o)=>{for(var t in o)f(n,t,{get:o[t],enumerable:!0})},F=(n,o,t,e)=>{if(o&&typeof o=="object"||typeof o=="function")for(let i of E(o))!k.call(n,i)&&i!==t&&f(n,i,{get:()=>o[i],enumerable:!(e=g(o,i))||e.enumerable});return n};var O=n=>F(f({},"__esModule",{value:!0}),n),d=(n,o,t,e)=>{for(var i=e>1?void 0:e?g(o,t):o,r=n.length-1,a;r>=0;r--)(a=n[r])&&(i=(e?a(o,t,i):a(i))||i);return e&&i&&f(o,t,i),i};var L={};w(L,{SkdxDialogContent:()=>l});module.exports=O(L);var m=require("lit"),c=require("lit/decorators.js"),u=require("../internal/aria-part.cjs"),h=require("../internal/body-scroll-lock.cjs"),b=require("../internal/closest.cjs"),y=require("../internal/define.cjs"),s=require("../internal/dismiss.cjs"),p=require("../internal/focus-targets.cjs"),A=require("../internal/light-dom-styles.cjs"),D=require("../internal/part.cjs");function v(n){return n==="any"||n==="outside"}var l=class extends m.LitElement{constructor(){super(...arguments);this.childObserver=new MutationObserver(()=>{this.adoptChildren(),this.syncHostAttributes()});this.dialogAncestor=null;this.locked=!1;this.wasOpen=!1;this.previouslyFocused=null;this.observer=new MutationObserver(()=>this.syncNativeDialog());this.handleCancel=t=>{let e=this.dialogAncestor?.effectiveDismiss??"any",i=e==="any"||e==="escape";(!(0,s.dispatchEscapeKeyDown)(this,t)||!i)&&t.preventDefault()};this.handleClose=()=>this.dialogAncestor?.setOpen(!1);this.handleBackdropPointerDown=t=>{let e=(0,s.backdropPointerDown)(t,this.nativeDialog);e&&(0,s.dispatchOutside)(this,"pointer-down-outside",e)&&this.dialogAncestor?.effectiveModal&&v(this.dialogAncestor.effectiveDismiss)&&this.nativeDialog?.close?.()};this.handleOutsidePointerDown=t=>{if(!this.dialogAncestor?.open)return;let e=t.target;!e||this.contains(e)||e===this.nativeDialog||(0,s.triggerContains)(this.dialogAncestor.triggerEl,e)||(0,s.dispatchOutside)(this,"pointer-down-outside",t)&&this.dialogAncestor.effectiveModal&&v(this.dialogAncestor.effectiveDismiss)&&this.nativeDialog?.close?.()};this.handleOutsideFocus=t=>{if(!this.dialogAncestor?.open)return;let e=(0,s.focusOutsideTarget)(t);!e||this.contains(e)||(0,s.triggerContains)(this.dialogAncestor.triggerEl,e)||(0,s.dispatchOutside)(this,"focus-outside",t)&&this.dialogAncestor.effectiveModal&&v(this.dialogAncestor.effectiveDismiss)&&this.nativeDialog?.close?.()}}createRenderRoot(){let t=document.createElement("dialog");return t.setAttribute("part","content"),(0,D.applyHostPart)(t,"dialog","content"),t.addEventListener("cancel",this.handleCancel),t.addEventListener("close",this.handleClose),t.addEventListener("pointerdown",this.handleBackdropPointerDown),this.append(t),this.adoptChildren(),t}adoptChildren(){let t=this.nativeDialog;if(!t)return;let e=document.activeElement;for(let i of Array.from(this.childNodes))i!==t&&t.append(i);e&&document.activeElement!==e&&t.contains(e)&&e.focus({preventScroll:!0})}connectedCallback(){if(super.connectedCallback(),(0,A.installLightDomStyles)(),this.dialogAncestor=(0,b.closestThroughPortal)(this,"skdx-dialog, skdx-dialog-root"),!this.dialogAncestor)throw new Error("<skdx-dialog-content> must be used inside <skdx-dialog> or <skdx-dialog-root>.");this.observer.observe(this.dialogAncestor,{attributeFilter:["open","modal","dismiss","dismissible"]}),this.childObserver.observe(this,{childList:!0,subtree:!0}),document.addEventListener("focusin",this.handleOutsideFocus),document.addEventListener("pointerdown",this.handleOutsidePointerDown,!0),this.syncHostAttributes()}disconnectedCallback(){this.observer.disconnect(),this.childObserver.disconnect(),document.removeEventListener("focusin",this.handleOutsideFocus),document.removeEventListener("pointerdown",this.handleOutsidePointerDown,!0),this.locked&&((0,h.unlockBodyScroll)(),this.locked=!1),super.disconnectedCallback()}firstUpdated(){this.syncNativeDialog()}updated(t){(t.has("size")||t.has("status"))&&this.syncHostAttributes()}syncHostAttributes(){let t=this.dialogAncestor;if(!t)return;this.id?t.contentId=this.id:this.id=t.contentId;let e=t.open?"open":"closed";this.setAttribute("data-state",e),this.setAttribute("data-dismiss",t.effectiveDismiss);let i=this.nativeDialog;if(i){i.setAttribute("role",t.role),t.effectiveModal?i.setAttribute("aria-modal","true"):i.removeAttribute("aria-modal"),(0,u.forwardAuthoredAria)(this,i),(0,u.syncPartIdRef)(i,"aria-labelledby",this.querySelector("skdx-dialog-title"),"skdx-dialog-content","title"),(0,u.syncPartIdRef)(i,"aria-describedby",this.querySelector("skdx-dialog-description"),"skdx-dialog-content","description"),i.setAttribute("data-state",e),i.setAttribute("data-dismiss",t.effectiveDismiss);for(let r of["data-size","data-status"]){let a=this.getAttribute(r);a==null?i.removeAttribute(r):i.setAttribute(r,a)}}}requestRoleSync(){this.syncHostAttributes()}get nativeDialog(){return this.querySelector("dialog")}syncNativeDialog(){this.syncHostAttributes();let t=this.dialogAncestor,e=this.nativeDialog;if(!t||!e)return;t.open&&!e.open?(0,s.focusOnOpen)(()=>{t.effectiveModal?e.showModal?.():e.show?.()}):!t.open&&e.open&&(0,s.focusOnOpen)(()=>e.close?.());let i=t.open&&t.effectiveModal;i&&!this.locked?(0,h.lockBodyScroll)():!i&&this.locked&&(0,h.unlockBodyScroll)(),this.locked=i,this.syncAutoFocus(t.open)}syncAutoFocus(t){if(t===this.wasOpen)return;if(this.wasOpen=t,t){this.previouslyFocused=document.activeElement,requestAnimationFrame(()=>(0,s.focusOnOpen)(()=>(0,p.applyOpenAutoFocus)(this.nativeDialog??this,this.initialFocus,"Dialog",(0,s.autoFocusRelay)(this),this.previouslyFocused)));return}let e=this.previouslyFocused===document.body?null:this.previouslyFocused,i=!1,r=(0,s.autoFocusRelay)(this);(0,p.returnFocus)(this.finalFocus,"Dialog",e,a=>{r(a),i=a.defaultPrevented}),i&&document.activeElement===e&&e?.blur?.()}};d([(0,c.property)({type:String,attribute:"initial-focus"})],l.prototype,"initialFocus",2),d([(0,c.property)({type:String,attribute:"final-focus"})],l.prototype,"finalFocus",2),d([(0,c.property)({type:String,reflect:!0,attribute:"data-size"})],l.prototype,"size",2),d([(0,c.property)({type:String,reflect:!0,attribute:"data-status"})],l.prototype,"status",2),l=d([(0,y.customElement)("skdx-dialog-content")],l);0&&(module.exports={SkdxDialogContent});
+"use strict";var f=Object.defineProperty;var g=Object.getOwnPropertyDescriptor;var E=Object.getOwnPropertyNames;var k=Object.prototype.hasOwnProperty;var L=(r,o)=>{for(var e in o)f(r,e,{get:o[e],enumerable:!0})},w=(r,o,e,t)=>{if(o&&typeof o=="object"||typeof o=="function")for(let i of E(o))!k.call(r,i)&&i!==e&&f(r,i,{get:()=>o[i],enumerable:!(t=g(o,i))||t.enumerable});return r};var F=r=>w(f({},"__esModule",{value:!0}),r),d=(r,o,e,t)=>{for(var i=t>1?void 0:t?g(o,e):o,n=r.length-1,a;n>=0;n--)(a=r[n])&&(i=(t?a(o,e,i):a(i))||i);return t&&i&&f(o,e,i),i};var O={};L(O,{SkdxDialogContent:()=>l});module.exports=F(O);var m=require("lit"),c=require("lit/decorators.js"),u=require("../internal/aria-part.cjs"),h=require("../internal/body-scroll-lock.cjs"),y=require("../internal/closest.cjs"),b=require("../internal/define.cjs"),s=require("../internal/dismiss.cjs"),p=require("../internal/focus-targets.cjs"),A=require("../internal/light-dom-styles.cjs"),D=require("../internal/part.cjs");function v(r){return r==="any"||r==="outside"}var l=class extends m.LitElement{constructor(){super(...arguments);this.childObserver=new MutationObserver(()=>{this.adoptChildren(),this.syncHostAttributes()});this.dialogAncestor=null;this.locked=!1;this.wasOpen=!1;this.previouslyFocused=null;this.observer=new MutationObserver(()=>this.syncNativeDialog());this.layer={insideElements:()=>[this,this.dialogAncestor?.triggerEl]};this.handleCancel=e=>{let t=this.dialogAncestor?.effectiveDismiss??"any",i=t==="any"||t==="escape";(!(0,s.dispatchEscapeKeyDown)(this,e)||!i)&&e.preventDefault()};this.handleClose=()=>this.dialogAncestor?.setOpen(!1);this.handleBackdropPointerDown=e=>{let t=(0,s.backdropPointerDown)(e,this.nativeDialog);t&&(0,s.dispatchOutside)(this,"pointer-down-outside",t)&&this.dialogAncestor?.effectiveModal&&v(this.dialogAncestor.effectiveDismiss)&&this.nativeDialog?.close?.()};this.handleOutsidePointerDown=e=>{if(!this.dialogAncestor?.open)return;let t=e.target;!t||this.contains(t)||t===this.nativeDialog||(0,s.triggerContains)(this.dialogAncestor.triggerEl,t)||(0,s.nestedLayerContains)(this.layer,t)||(0,s.dispatchOutside)(this,"pointer-down-outside",e)&&this.dialogAncestor.effectiveModal&&v(this.dialogAncestor.effectiveDismiss)&&this.nativeDialog?.close?.()};this.handleOutsideFocus=e=>{if(!this.dialogAncestor?.open)return;let t=(0,s.focusOutsideTarget)(e);!t||this.contains(t)||(0,s.triggerContains)(this.dialogAncestor.triggerEl,t)||(0,s.nestedLayerContains)(this.layer,t)||(0,s.dispatchOutside)(this,"focus-outside",e)&&this.dialogAncestor.effectiveModal&&v(this.dialogAncestor.effectiveDismiss)&&this.nativeDialog?.close?.()}}createRenderRoot(){let e=document.createElement("dialog");return e.setAttribute("part","content"),(0,D.applyHostPart)(e,"dialog","content"),e.addEventListener("cancel",this.handleCancel),e.addEventListener("close",this.handleClose),e.addEventListener("pointerdown",this.handleBackdropPointerDown),this.append(e),this.adoptChildren(),e}adoptChildren(){let e=this.nativeDialog;if(!e)return;let t=document.activeElement;for(let i of Array.from(this.childNodes))i!==e&&e.append(i);t&&document.activeElement!==t&&e.contains(t)&&t.focus({preventScroll:!0})}connectedCallback(){if(super.connectedCallback(),(0,A.installLightDomStyles)(),this.dialogAncestor=(0,y.closestThroughPortal)(this,"skdx-dialog, skdx-dialog-root"),!this.dialogAncestor)throw new Error("<skdx-dialog-content> must be used inside <skdx-dialog> or <skdx-dialog-root>.");this.observer.observe(this.dialogAncestor,{attributeFilter:["open","modal","dismiss","dismissible"]}),this.childObserver.observe(this,{childList:!0,subtree:!0}),document.addEventListener("focusin",this.handleOutsideFocus),document.addEventListener("pointerdown",this.handleOutsidePointerDown,!0),this.syncHostAttributes()}disconnectedCallback(){this.observer.disconnect(),this.childObserver.disconnect(),document.removeEventListener("focusin",this.handleOutsideFocus),document.removeEventListener("pointerdown",this.handleOutsidePointerDown,!0),this.releaseLayer?.(),this.releaseLayer=void 0,this.locked&&((0,h.unlockBodyScroll)(),this.locked=!1),super.disconnectedCallback()}firstUpdated(){this.syncNativeDialog()}updated(e){(e.has("size")||e.has("status"))&&this.syncHostAttributes()}syncHostAttributes(){let e=this.dialogAncestor;if(!e)return;this.id?e.contentId=this.id:this.id=e.contentId;let t=e.open?"open":"closed";this.setAttribute("data-state",t),this.setAttribute("data-dismiss",e.effectiveDismiss);let i=this.nativeDialog;if(i){i.setAttribute("role",e.role),e.effectiveModal?i.setAttribute("aria-modal","true"):i.removeAttribute("aria-modal"),(0,u.forwardAuthoredAria)(this,i),(0,u.syncPartIdRef)(i,"aria-labelledby",this.querySelector("skdx-dialog-title"),"skdx-dialog-content","title"),(0,u.syncPartIdRef)(i,"aria-describedby",this.querySelector("skdx-dialog-description"),"skdx-dialog-content","description"),i.setAttribute("data-state",t),i.setAttribute("data-dismiss",e.effectiveDismiss);for(let n of["data-size","data-status"]){let a=this.getAttribute(n);a==null?i.removeAttribute(n):i.setAttribute(n,a)}}}requestRoleSync(){this.syncHostAttributes()}get nativeDialog(){return this.querySelector("dialog")}syncNativeDialog(){this.syncHostAttributes();let e=this.dialogAncestor,t=this.nativeDialog;if(!e||!t)return;e.open?this.releaseLayer??(this.releaseLayer=(0,s.pushDismissLayer)(this.layer)):(this.releaseLayer?.(),this.releaseLayer=void 0),e.open&&!t.open?(0,s.focusOnOpen)(()=>{e.effectiveModal?t.showModal?.():t.show?.()}):!e.open&&t.open&&(0,s.focusOnOpen)(()=>t.close?.());let i=e.open&&e.effectiveModal;i&&!this.locked?(0,h.lockBodyScroll)():!i&&this.locked&&(0,h.unlockBodyScroll)(),this.locked=i,this.syncAutoFocus(e.open)}syncAutoFocus(e){if(e===this.wasOpen)return;if(this.wasOpen=e,e){this.previouslyFocused=document.activeElement,requestAnimationFrame(()=>(0,s.focusOnOpen)(()=>(0,p.applyOpenAutoFocus)(this.nativeDialog??this,this.initialFocus,"Dialog",(0,s.autoFocusRelay)(this),this.previouslyFocused)));return}let t=this.previouslyFocused===document.body?null:this.previouslyFocused,i=!1,n=(0,s.autoFocusRelay)(this);(0,p.returnFocus)(this.finalFocus,"Dialog",t,a=>{n(a),i=a.defaultPrevented}),i&&document.activeElement===t&&t?.blur?.()}};d([(0,c.property)({type:String,attribute:"initial-focus"})],l.prototype,"initialFocus",2),d([(0,c.property)({type:String,attribute:"final-focus"})],l.prototype,"finalFocus",2),d([(0,c.property)({type:String,reflect:!0,attribute:"data-size"})],l.prototype,"size",2),d([(0,c.property)({type:String,reflect:!0,attribute:"data-status"})],l.prototype,"status",2),l=d([(0,b.customElement)("skdx-dialog-content")],l);0&&(module.exports={SkdxDialogContent});

package/dist/dialog/DialogContent.d.cts

@@ -38,6 +38,8 @@ export declare class SkdxDialogContent extends LitElement {
     private wasOpen;
     private previouslyFocused;
     private readonly observer;
+    private releaseLayer?;
+    private readonly layer;
     connectedCallback(): void;
     disconnectedCallback(): void;
     protected firstUpdated(): void;

package/dist/dialog/DialogContent.d.ts

@@ -38,6 +38,8 @@ export declare class SkdxDialogContent extends LitElement {
     private wasOpen;
     private previouslyFocused;
     private readonly observer;
+    private releaseLayer?;
+    private readonly layer;
     connectedCallback(): void;
     disconnectedCallback(): void;
     protected firstUpdated(): void;

package/dist/dialog/DialogContent.js

@@ -1 +1 @@
-var m=Object.defineProperty;var b=Object.getOwnPropertyDescriptor;var a=(r,l,t,e)=>{for(var i=e>1?void 0:e?b(l,t):l,s=r.length-1,o;s>=0;s--)(o=r[s])&&(i=(e?o(l,t,i):o(i))||i);return e&&i&&m(l,t,i),i};import{LitElement as y}from"lit";import{property as d}from"lit/decorators.js";import{forwardAuthoredAria as A,syncPartIdRef as f}from"../internal/aria-part.js";import{lockBodyScroll as D,unlockBodyScroll as p}from"../internal/body-scroll-lock.js";import{closestThroughPortal as E}from"../internal/closest.js";import{customElement as k}from"../internal/define.js";import{autoFocusRelay as v,backdropPointerDown as w,dispatchEscapeKeyDown as F,dispatchOutside as c,focusOnOpen as u,focusOutsideTarget as O,triggerContains as g}from"../internal/dismiss.js";import{applyOpenAutoFocus as L,returnFocus as M}from"../internal/focus-targets.js";import{installLightDomStyles as H}from"../internal/light-dom-styles.js";import{applyHostPart as x}from"../internal/part.js";function h(r){return r==="any"||r==="outside"}var n=class extends y{constructor(){super(...arguments);this.childObserver=new MutationObserver(()=>{this.adoptChildren(),this.syncHostAttributes()});this.dialogAncestor=null;this.locked=!1;this.wasOpen=!1;this.previouslyFocused=null;this.observer=new MutationObserver(()=>this.syncNativeDialog());this.handleCancel=t=>{let e=this.dialogAncestor?.effectiveDismiss??"any",i=e==="any"||e==="escape";(!F(this,t)||!i)&&t.preventDefault()};this.handleClose=()=>this.dialogAncestor?.setOpen(!1);this.handleBackdropPointerDown=t=>{let e=w(t,this.nativeDialog);e&&c(this,"pointer-down-outside",e)&&this.dialogAncestor?.effectiveModal&&h(this.dialogAncestor.effectiveDismiss)&&this.nativeDialog?.close?.()};this.handleOutsidePointerDown=t=>{if(!this.dialogAncestor?.open)return;let e=t.target;!e||this.contains(e)||e===this.nativeDialog||g(this.dialogAncestor.triggerEl,e)||c(this,"pointer-down-outside",t)&&this.dialogAncestor.effectiveModal&&h(this.dialogAncestor.effectiveDismiss)&&this.nativeDialog?.close?.()};this.handleOutsideFocus=t=>{if(!this.dialogAncestor?.open)return;let e=O(t);!e||this.contains(e)||g(this.dialogAncestor.triggerEl,e)||c(this,"focus-outside",t)&&this.dialogAncestor.effectiveModal&&h(this.dialogAncestor.effectiveDismiss)&&this.nativeDialog?.close?.()}}createRenderRoot(){let t=document.createElement("dialog");return t.setAttribute("part","content"),x(t,"dialog","content"),t.addEventListener("cancel",this.handleCancel),t.addEventListener("close",this.handleClose),t.addEventListener("pointerdown",this.handleBackdropPointerDown),this.append(t),this.adoptChildren(),t}adoptChildren(){let t=this.nativeDialog;if(!t)return;let e=document.activeElement;for(let i of Array.from(this.childNodes))i!==t&&t.append(i);e&&document.activeElement!==e&&t.contains(e)&&e.focus({preventScroll:!0})}connectedCallback(){if(super.connectedCallback(),H(),this.dialogAncestor=E(this,"skdx-dialog, skdx-dialog-root"),!this.dialogAncestor)throw new Error("<skdx-dialog-content> must be used inside <skdx-dialog> or <skdx-dialog-root>.");this.observer.observe(this.dialogAncestor,{attributeFilter:["open","modal","dismiss","dismissible"]}),this.childObserver.observe(this,{childList:!0,subtree:!0}),document.addEventListener("focusin",this.handleOutsideFocus),document.addEventListener("pointerdown",this.handleOutsidePointerDown,!0),this.syncHostAttributes()}disconnectedCallback(){this.observer.disconnect(),this.childObserver.disconnect(),document.removeEventListener("focusin",this.handleOutsideFocus),document.removeEventListener("pointerdown",this.handleOutsidePointerDown,!0),this.locked&&(p(),this.locked=!1),super.disconnectedCallback()}firstUpdated(){this.syncNativeDialog()}updated(t){(t.has("size")||t.has("status"))&&this.syncHostAttributes()}syncHostAttributes(){let t=this.dialogAncestor;if(!t)return;this.id?t.contentId=this.id:this.id=t.contentId;let e=t.open?"open":"closed";this.setAttribute("data-state",e),this.setAttribute("data-dismiss",t.effectiveDismiss);let i=this.nativeDialog;if(i){i.setAttribute("role",t.role),t.effectiveModal?i.setAttribute("aria-modal","true"):i.removeAttribute("aria-modal"),A(this,i),f(i,"aria-labelledby",this.querySelector("skdx-dialog-title"),"skdx-dialog-content","title"),f(i,"aria-describedby",this.querySelector("skdx-dialog-description"),"skdx-dialog-content","description"),i.setAttribute("data-state",e),i.setAttribute("data-dismiss",t.effectiveDismiss);for(let s of["data-size","data-status"]){let o=this.getAttribute(s);o==null?i.removeAttribute(s):i.setAttribute(s,o)}}}requestRoleSync(){this.syncHostAttributes()}get nativeDialog(){return this.querySelector("dialog")}syncNativeDialog(){this.syncHostAttributes();let t=this.dialogAncestor,e=this.nativeDialog;if(!t||!e)return;t.open&&!e.open?u(()=>{t.effectiveModal?e.showModal?.():e.show?.()}):!t.open&&e.open&&u(()=>e.close?.());let i=t.open&&t.effectiveModal;i&&!this.locked?D():!i&&this.locked&&p(),this.locked=i,this.syncAutoFocus(t.open)}syncAutoFocus(t){if(t===this.wasOpen)return;if(this.wasOpen=t,t){this.previouslyFocused=document.activeElement,requestAnimationFrame(()=>u(()=>L(this.nativeDialog??this,this.initialFocus,"Dialog",v(this),this.previouslyFocused)));return}let e=this.previouslyFocused===document.body?null:this.previouslyFocused,i=!1,s=v(this);M(this.finalFocus,"Dialog",e,o=>{s(o),i=o.defaultPrevented}),i&&document.activeElement===e&&e?.blur?.()}};a([d({type:String,attribute:"initial-focus"})],n.prototype,"initialFocus",2),a([d({type:String,attribute:"final-focus"})],n.prototype,"finalFocus",2),a([d({type:String,reflect:!0,attribute:"data-size"})],n.prototype,"size",2),a([d({type:String,reflect:!0,attribute:"data-status"})],n.prototype,"status",2),n=a([k("skdx-dialog-content")],n);export{n as SkdxDialogContent};
+var y=Object.defineProperty;var b=Object.getOwnPropertyDescriptor;var a=(n,l,e,t)=>{for(var i=t>1?void 0:t?b(l,e):l,s=n.length-1,o;s>=0;s--)(o=n[s])&&(i=(t?o(l,e,i):o(i))||i);return t&&i&&y(l,e,i),i};import{LitElement as A}from"lit";import{property as d}from"lit/decorators.js";import{forwardAuthoredAria as D,syncPartIdRef as f}from"../internal/aria-part.js";import{lockBodyScroll as E,unlockBodyScroll as p}from"../internal/body-scroll-lock.js";import{closestThroughPortal as k}from"../internal/closest.js";import{customElement as L}from"../internal/define.js";import{autoFocusRelay as v,backdropPointerDown as w,dispatchEscapeKeyDown as F,dispatchOutside as c,focusOnOpen as u,focusOutsideTarget as O,nestedLayerContains as g,pushDismissLayer as M,triggerContains as m}from"../internal/dismiss.js";import{applyOpenAutoFocus as H,returnFocus as x}from"../internal/focus-targets.js";import{installLightDomStyles as P}from"../internal/light-dom-styles.js";import{applyHostPart as S}from"../internal/part.js";function h(n){return n==="any"||n==="outside"}var r=class extends A{constructor(){super(...arguments);this.childObserver=new MutationObserver(()=>{this.adoptChildren(),this.syncHostAttributes()});this.dialogAncestor=null;this.locked=!1;this.wasOpen=!1;this.previouslyFocused=null;this.observer=new MutationObserver(()=>this.syncNativeDialog());this.layer={insideElements:()=>[this,this.dialogAncestor?.triggerEl]};this.handleCancel=e=>{let t=this.dialogAncestor?.effectiveDismiss??"any",i=t==="any"||t==="escape";(!F(this,e)||!i)&&e.preventDefault()};this.handleClose=()=>this.dialogAncestor?.setOpen(!1);this.handleBackdropPointerDown=e=>{let t=w(e,this.nativeDialog);t&&c(this,"pointer-down-outside",t)&&this.dialogAncestor?.effectiveModal&&h(this.dialogAncestor.effectiveDismiss)&&this.nativeDialog?.close?.()};this.handleOutsidePointerDown=e=>{if(!this.dialogAncestor?.open)return;let t=e.target;!t||this.contains(t)||t===this.nativeDialog||m(this.dialogAncestor.triggerEl,t)||g(this.layer,t)||c(this,"pointer-down-outside",e)&&this.dialogAncestor.effectiveModal&&h(this.dialogAncestor.effectiveDismiss)&&this.nativeDialog?.close?.()};this.handleOutsideFocus=e=>{if(!this.dialogAncestor?.open)return;let t=O(e);!t||this.contains(t)||m(this.dialogAncestor.triggerEl,t)||g(this.layer,t)||c(this,"focus-outside",e)&&this.dialogAncestor.effectiveModal&&h(this.dialogAncestor.effectiveDismiss)&&this.nativeDialog?.close?.()}}createRenderRoot(){let e=document.createElement("dialog");return e.setAttribute("part","content"),S(e,"dialog","content"),e.addEventListener("cancel",this.handleCancel),e.addEventListener("close",this.handleClose),e.addEventListener("pointerdown",this.handleBackdropPointerDown),this.append(e),this.adoptChildren(),e}adoptChildren(){let e=this.nativeDialog;if(!e)return;let t=document.activeElement;for(let i of Array.from(this.childNodes))i!==e&&e.append(i);t&&document.activeElement!==t&&e.contains(t)&&t.focus({preventScroll:!0})}connectedCallback(){if(super.connectedCallback(),P(),this.dialogAncestor=k(this,"skdx-dialog, skdx-dialog-root"),!this.dialogAncestor)throw new Error("<skdx-dialog-content> must be used inside <skdx-dialog> or <skdx-dialog-root>.");this.observer.observe(this.dialogAncestor,{attributeFilter:["open","modal","dismiss","dismissible"]}),this.childObserver.observe(this,{childList:!0,subtree:!0}),document.addEventListener("focusin",this.handleOutsideFocus),document.addEventListener("pointerdown",this.handleOutsidePointerDown,!0),this.syncHostAttributes()}disconnectedCallback(){this.observer.disconnect(),this.childObserver.disconnect(),document.removeEventListener("focusin",this.handleOutsideFocus),document.removeEventListener("pointerdown",this.handleOutsidePointerDown,!0),this.releaseLayer?.(),this.releaseLayer=void 0,this.locked&&(p(),this.locked=!1),super.disconnectedCallback()}firstUpdated(){this.syncNativeDialog()}updated(e){(e.has("size")||e.has("status"))&&this.syncHostAttributes()}syncHostAttributes(){let e=this.dialogAncestor;if(!e)return;this.id?e.contentId=this.id:this.id=e.contentId;let t=e.open?"open":"closed";this.setAttribute("data-state",t),this.setAttribute("data-dismiss",e.effectiveDismiss);let i=this.nativeDialog;if(i){i.setAttribute("role",e.role),e.effectiveModal?i.setAttribute("aria-modal","true"):i.removeAttribute("aria-modal"),D(this,i),f(i,"aria-labelledby",this.querySelector("skdx-dialog-title"),"skdx-dialog-content","title"),f(i,"aria-describedby",this.querySelector("skdx-dialog-description"),"skdx-dialog-content","description"),i.setAttribute("data-state",t),i.setAttribute("data-dismiss",e.effectiveDismiss);for(let s of["data-size","data-status"]){let o=this.getAttribute(s);o==null?i.removeAttribute(s):i.setAttribute(s,o)}}}requestRoleSync(){this.syncHostAttributes()}get nativeDialog(){return this.querySelector("dialog")}syncNativeDialog(){this.syncHostAttributes();let e=this.dialogAncestor,t=this.nativeDialog;if(!e||!t)return;e.open?this.releaseLayer??(this.releaseLayer=M(this.layer)):(this.releaseLayer?.(),this.releaseLayer=void 0),e.open&&!t.open?u(()=>{e.effectiveModal?t.showModal?.():t.show?.()}):!e.open&&t.open&&u(()=>t.close?.());let i=e.open&&e.effectiveModal;i&&!this.locked?E():!i&&this.locked&&p(),this.locked=i,this.syncAutoFocus(e.open)}syncAutoFocus(e){if(e===this.wasOpen)return;if(this.wasOpen=e,e){this.previouslyFocused=document.activeElement,requestAnimationFrame(()=>u(()=>H(this.nativeDialog??this,this.initialFocus,"Dialog",v(this),this.previouslyFocused)));return}let t=this.previouslyFocused===document.body?null:this.previouslyFocused,i=!1,s=v(this);x(this.finalFocus,"Dialog",t,o=>{s(o),i=o.defaultPrevented}),i&&document.activeElement===t&&t?.blur?.()}};a([d({type:String,attribute:"initial-focus"})],r.prototype,"initialFocus",2),a([d({type:String,attribute:"final-focus"})],r.prototype,"finalFocus",2),a([d({type:String,reflect:!0,attribute:"data-size"})],r.prototype,"size",2),a([d({type:String,reflect:!0,attribute:"data-status"})],r.prototype,"status",2),r=a([L("skdx-dialog-content")],r);export{r as SkdxDialogContent};

package/dist/dialog/Dialogs.cjs

@@ -0,0 +1,24 @@
+"use strict";var n=Object.defineProperty;var f=Object.getOwnPropertyDescriptor;var v=Object.getOwnPropertyNames;var $=Object.prototype.hasOwnProperty;var k=(r,s)=>{for(var t in s)n(r,t,{get:s[t],enumerable:!0})},C=(r,s,t,e)=>{if(s&&typeof s=="object"||typeof s=="function")for(let i of v(s))!$.call(r,i)&&i!==t&&n(r,i,{get:()=>s[i],enumerable:!(e=f(s,i))||e.enumerable});return r};var y=r=>C(n({},"__esModule",{value:!0}),r),p=(r,s,t,e)=>{for(var i=e>1?void 0:e?f(s,t):s,c=r.length-1,u;c>=0;c--)(u=r[c])&&(i=(e?u(s,t,i):u(i))||i);return e&&i&&n(s,t,i),i};var x={};k(x,{SkdxDialogs:()=>a});module.exports=y(x);var o=require("lit"),g=require("lit/decorators.js"),d=require("lit/directives/if-defined.js"),b=require("lit/directives/repeat.js"),h=require("../internal/define.cjs"),l=require("../internal/dialogs.cjs"),m=require("../internal/light-dom-styles.cjs"),T=require("../label/Label.cjs"),L=require("../text-field/TextField.cjs"),R=require("./Dialog.cjs");var a=class extends o.LitElement{constructor(){super(...arguments);this.dialogs=(0,l.createDialogs)();this.draft=""}createRenderRoot(){return this}connectedCallback(){super.connectedCallback(),(0,m.installLightDomStyles)(),this.subscribeToStore()}disconnectedCallback(){this.unsubscribe?.(),this.unsubscribe=void 0,super.disconnectedCallback()}willUpdate(t){t.has("dialogs")&&this.isConnected&&this.subscribeToStore()}subscribeToStore(){this.unsubscribe?.(),this.draft=this.dialogs.getCurrent()?.defaultValue??"",this.unsubscribe=this.dialogs.subscribe(()=>{this.draft=this.dialogs.getCurrent()?.defaultValue??"",this.requestUpdate()})}confirm(t){this.dialogs.settle(t.id,(0,l.dialogsConfirmResult)(t,this.draft))}dismiss(t){this.dialogs.settle(t.id,(0,l.dialogsCancelResult)(t))}render(){let t=this.dialogs.getCurrent();return t?o.html`${(0,b.repeat)([t],e=>e.id,e=>o.html`
+        <skdx-dialog
+          default-open
+          role=${e.kind==="confirm"?"alertdialog":"dialog"}
+          title=${e.title}
+          description=${(0,d.ifDefined)(e.description)}
+          data-status=${(0,d.ifDefined)(e.status)}
+          confirm-label=${e.confirmLabel}
+          cancel-label=${(0,d.ifDefined)(e.cancelLabel)}
+          data-kind=${e.kind}
+          @confirm=${()=>this.confirm(e)}
+          @cancel=${()=>this.dismiss(e)}
+          @open-change=${i=>{i.detail||this.dismiss(e)}}
+        >
+          ${e.kind==="prompt"?o.html`<skdx-label style="display: grid; gap: 0.5rem"
+                  >${e.label??"Value"}
+                  <skdx-text-field
+                    .value=${this.draft}
+                    placeholder=${(0,d.ifDefined)(e.placeholder)}
+                    @value-change=${i=>{this.draft=i.detail}}
+                  ></skdx-text-field
+                ></skdx-label>`:o.nothing}
+        </skdx-dialog>
+      `)}`:o.nothing}};p([(0,g.property)({attribute:!1})],a.prototype,"dialogs",2),a=p([(0,h.customElement)("skdx-dialogs")],a);0&&(module.exports={SkdxDialogs});

package/dist/dialog/Dialogs.d.cts

@@ -0,0 +1,43 @@
+import { LitElement, nothing, type TemplateResult } from 'lit';
+import { type DialogsStore } from '../internal/dialogs.cjs';
+import '../label/Label.cjs';
+import '../text-field/TextField.cjs';
+import './Dialog.cjs';
+/**
+ * Renders whatever the store is showing: an alert, a confirm or a prompt at a
+ * time, each an `<skdx-dialog>` recreated per entry so a new question starts
+ * from a clean panel. Mount it once, near the app root, and call `alert`,
+ * `confirm` or `prompt` on its `dialogs` store from anywhere.
+ *
+ * @example
+ * ```html
+ * <skdx-dialogs id="dialogs"></skdx-dialogs>
+ * <script type="module">
+ *   const { dialogs } = document.getElementById('dialogs');
+ *   if (await dialogs.confirm('Delete the project?')) remove();
+ * </script>
+ * ```
+ */
+export declare class SkdxDialogs extends LitElement {
+    /** Renders into light DOM, so the page's own CSS reaches the dialogs this headless element raises. */
+    protected createRenderRoot(): HTMLElement;
+    /**
+     * The queue to render. Defaults to a store of its own, so an element dropped
+     * in with no wiring still works — read it back off the element to ask questions.
+     */
+    dialogs: DialogsStore;
+    private unsubscribe?;
+    private draft;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    protected willUpdate(changed: Map<string, unknown>): void;
+    private subscribeToStore;
+    private confirm;
+    private dismiss;
+    render(): TemplateResult | typeof nothing;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'skdx-dialogs': SkdxDialogs;
+    }
+}

package/dist/dialog/Dialogs.d.ts

@@ -0,0 +1,43 @@
+import { LitElement, nothing, type TemplateResult } from 'lit';
+import { type DialogsStore } from '../internal/dialogs.js';
+import '../label/Label.js';
+import '../text-field/TextField.js';
+import './Dialog.js';
+/**
+ * Renders whatever the store is showing: an alert, a confirm or a prompt at a
+ * time, each an `<skdx-dialog>` recreated per entry so a new question starts
+ * from a clean panel. Mount it once, near the app root, and call `alert`,
+ * `confirm` or `prompt` on its `dialogs` store from anywhere.
+ *
+ * @example
+ * ```html
+ * <skdx-dialogs id="dialogs"></skdx-dialogs>
+ * <script type="module">
+ *   const { dialogs } = document.getElementById('dialogs');
+ *   if (await dialogs.confirm('Delete the project?')) remove();
+ * </script>
+ * ```
+ */
+export declare class SkdxDialogs extends LitElement {
+    /** Renders into light DOM, so the page's own CSS reaches the dialogs this headless element raises. */
+    protected createRenderRoot(): HTMLElement;
+    /**
+     * The queue to render. Defaults to a store of its own, so an element dropped
+     * in with no wiring still works — read it back off the element to ask questions.
+     */
+    dialogs: DialogsStore;
+    private unsubscribe?;
+    private draft;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    protected willUpdate(changed: Map<string, unknown>): void;
+    private subscribeToStore;
+    private confirm;
+    private dismiss;
+    render(): TemplateResult | typeof nothing;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'skdx-dialogs': SkdxDialogs;
+    }
+}

package/dist/dialog/Dialogs.js

@@ -0,0 +1,24 @@
+var p=Object.defineProperty;var f=Object.getOwnPropertyDescriptor;var n=(a,s,t,e)=>{for(var i=e>1?void 0:e?f(s,t):s,l=a.length-1,d;l>=0;l--)(d=a[l])&&(i=(e?d(s,t,i):d(i))||i);return e&&i&&p(s,t,i),i};import{html as c,LitElement as g,nothing as u}from"lit";import{property as b}from"lit/decorators.js";import{ifDefined as o}from"lit/directives/if-defined.js";import{repeat as h}from"lit/directives/repeat.js";import{customElement as m}from"../internal/define.js";import{createDialogs as v,dialogsCancelResult as $,dialogsConfirmResult as k}from"../internal/dialogs.js";import{installLightDomStyles as C}from"../internal/light-dom-styles.js";import"../label/Label.js";import"../text-field/TextField.js";import"./Dialog.js";var r=class extends g{constructor(){super(...arguments);this.dialogs=v();this.draft=""}createRenderRoot(){return this}connectedCallback(){super.connectedCallback(),C(),this.subscribeToStore()}disconnectedCallback(){this.unsubscribe?.(),this.unsubscribe=void 0,super.disconnectedCallback()}willUpdate(t){t.has("dialogs")&&this.isConnected&&this.subscribeToStore()}subscribeToStore(){this.unsubscribe?.(),this.draft=this.dialogs.getCurrent()?.defaultValue??"",this.unsubscribe=this.dialogs.subscribe(()=>{this.draft=this.dialogs.getCurrent()?.defaultValue??"",this.requestUpdate()})}confirm(t){this.dialogs.settle(t.id,k(t,this.draft))}dismiss(t){this.dialogs.settle(t.id,$(t))}render(){let t=this.dialogs.getCurrent();return t?c`${h([t],e=>e.id,e=>c`
+        <skdx-dialog
+          default-open
+          role=${e.kind==="confirm"?"alertdialog":"dialog"}
+          title=${e.title}
+          description=${o(e.description)}
+          data-status=${o(e.status)}
+          confirm-label=${e.confirmLabel}
+          cancel-label=${o(e.cancelLabel)}
+          data-kind=${e.kind}
+          @confirm=${()=>this.confirm(e)}
+          @cancel=${()=>this.dismiss(e)}
+          @open-change=${i=>{i.detail||this.dismiss(e)}}
+        >
+          ${e.kind==="prompt"?c`<skdx-label style="display: grid; gap: 0.5rem"
+                  >${e.label??"Value"}
+                  <skdx-text-field
+                    .value=${this.draft}
+                    placeholder=${o(e.placeholder)}
+                    @value-change=${i=>{this.draft=i.detail}}
+                  ></skdx-text-field
+                ></skdx-label>`:u}
+        </skdx-dialog>
+      `)}`:u}};n([b({attribute:!1})],r.prototype,"dialogs",2),r=n([m("skdx-dialogs")],r);export{r as SkdxDialogs};

package/dist/dialog/index.cjs

@@ -1 +1 @@
-"use strict";var x=Object.defineProperty;var d=Object.getOwnPropertyDescriptor;var g=Object.getOwnPropertyNames;var k=Object.prototype.hasOwnProperty;var p=(i,o)=>{for(var l in o)x(i,l,{get:o[l],enumerable:!0})},s=(i,o,l,D)=>{if(o&&typeof o=="object"||typeof o=="function")for(let e of g(o))!k.call(i,e)&&e!==l&&x(i,e,{get:()=>o[e],enumerable:!(D=d(o,e))||D.enumerable});return i};var t=i=>s(x({},"__esModule",{value:!0}),i);var S={};p(S,{SkdxDialog:()=>a.SkdxDialog});module.exports=t(S);var a=require("./Dialog.cjs");0&&(module.exports={SkdxDialog});
+"use strict";var p=Object.defineProperty;var g=Object.getOwnPropertyDescriptor;var r=Object.getOwnPropertyNames;var y=Object.prototype.hasOwnProperty;var x=(t,o)=>{for(var i in o)p(t,i,{get:o[i],enumerable:!0})},d=(t,o,i,s)=>{if(o&&typeof o=="object"||typeof o=="function")for(let e of r(o))!y.call(t,e)&&e!==i&&p(t,e,{get:()=>o[e],enumerable:!(s=g(o,e))||s.enumerable});return t};var m=t=>d(p({},"__esModule",{value:!0}),t);var S={};x(S,{SkdxDialog:()=>l.SkdxDialog,SkdxDialogs:()=>a.SkdxDialogs,createDialogs:()=>D.createDialogs});module.exports=m(S);var l=require("./Dialog.cjs"),a=require("./Dialogs.cjs"),D=require("../internal/dialogs.cjs");0&&(module.exports={SkdxDialog,SkdxDialogs,createDialogs});

package/dist/dialog/index.d.cts

@@ -1 +1,3 @@
 export { SkdxDialog, type SkdxDialogDismiss, type SkdxDialogRole } from './Dialog.cjs';
+export { SkdxDialogs } from './Dialogs.cjs';
+export { createDialogs, type DialogsStore, type DialogsEntry, type DialogsKind, type DialogsOptions, type DialogsPromptOptions, type DialogsResult, } from '../internal/dialogs.cjs';

package/dist/dialog/index.d.ts

@@ -1 +1,3 @@
 export { SkdxDialog, type SkdxDialogDismiss, type SkdxDialogRole } from './Dialog.js';
+export { SkdxDialogs } from './Dialogs.js';
+export { createDialogs, type DialogsStore, type DialogsEntry, type DialogsKind, type DialogsOptions, type DialogsPromptOptions, type DialogsResult, } from '../internal/dialogs.js';

package/dist/dialog/index.js

@@ -1 +1 @@
-import{SkdxDialog as e}from"./Dialog.js";export{e as SkdxDialog};
+import{SkdxDialog as e}from"./Dialog.js";import{SkdxDialogs as p}from"./Dialogs.js";import{createDialogs as l}from"../internal/dialogs.js";export{e as SkdxDialog,p as SkdxDialogs,l as createDialogs};

package/dist/drawer/DrawerContent.cjs

@@ -1,8 +1,8 @@
-"use strict";var m=Object.defineProperty;var g=Object.getOwnPropertyDescriptor;var L=Object.getOwnPropertyNames;var A=Object.prototype.hasOwnProperty;var O=(s,r)=>{for(var e in r)m(s,e,{get:r[e],enumerable:!0})},R=(s,r,e,t)=>{if(r&&typeof r=="object"||typeof r=="function")for(let i of L(r))!A.call(s,i)&&i!==e&&m(s,i,{get:()=>r[i],enumerable:!(t=g(r,i))||t.enumerable});return s};var S=s=>R(m({},"__esModule",{value:!0}),s),l=(s,r,e,t)=>{for(var i=t>1?void 0:t?g(r,e):r,a=s.length-1,y;a>=0;a--)(y=s[a])&&(i=(t?y(r,e,i):y(i))||i);return t&&i&&m(r,e,i),i};var K={};O(K,{SkdxDrawerContent:()=>n});module.exports=S(K);var d=require("lit"),f=require("lit/decorators.js"),E=require("../internal/aria-part.cjs"),c=require("../internal/body-scroll-lock.cjs"),T=require("../internal/closest.cjs"),k=require("../internal/define.cjs"),p=require("../internal/direction.cjs"),o=require("../internal/dismiss.cjs"),v=require("../internal/dismissal.cjs"),u=require("../internal/focus-targets.cjs"),b=require("../internal/outsideInert.cjs"),h=require("../internal/tabbable.cjs");function F(s){return Array.from(s.querySelectorAll("*")).filter(r=>r.matches(h.TABBABLE_SELECTOR)||!!r.shadowRoot?.querySelector(h.TABBABLE_SELECTOR))}function w(s){(s.matches(h.TABBABLE_SELECTOR)?s:s.shadowRoot?.querySelector(h.TABBABLE_SELECTOR)??s).focus({preventScroll:!0})}function x(s){let r=s.ownerDocument.activeElement;for(;r?.shadowRoot?.activeElement;)r=r.shadowRoot.activeElement;let e=r;for(;e;){if(s.contains(e))return!0;let t=e.getRootNode();e=t instanceof ShadowRoot?t.host:null}return!1}function D(s){return s==="any"||s==="outside"}var n=class extends d.LitElement{constructor(){super(...arguments);this.drawerEl=null;this.locked=!1;this.wasTrapped=!1;this.previouslyFocused=null;this.observer=new MutationObserver(()=>this.sync());this.layer={insideElements:()=>[this,this.drawerEl?.triggerEl]};this.armed=!1;this.handleSlotChange=()=>this.syncHostAttributes();this.handleKeyDown=e=>{if(e.key!=="Tab"||!this.drawerEl?.open||!this.drawerEl.modal)return;let t=F(this);if(t.length===0){e.preventDefault();return}let i=t[0],a=t[t.length-1];e.shiftKey&&(document.activeElement===i||document.activeElement===this)?(e.preventDefault(),a.focus()):!e.shiftKey&&document.activeElement===a&&(e.preventDefault(),i.focus())};this.handleDocumentKeyDown=e=>{this.drawerEl?.open&&(0,v.handleEscapeKeyDown)(e,this.layer,this.handleEscape)};this.handleEscape=e=>{let t=this.drawerEl;if(!t||!(0,o.dispatchEscapeKeyDown)(this,e)||t.effectiveDismiss!=="any"&&t.effectiveDismiss!=="escape")return;let i=!t.modal&&x(this);t.setOpen(!1),i&&(0,o.dispatchAutoFocus)(this,"close-auto-focus")&&!(0,u.applyFinalFocus)(this.finalFocus,"Drawer")&&t.triggerEl&&w(t.triggerEl)};this.handleOutsidePointerDown=e=>{let t=this.drawerEl;if(!this.armed||!t?.open)return;let i=e.target;i&&(this.contains(i)||t.triggerEl?.contains(i)||(0,o.dispatchOutside)(this,"pointer-down-outside",e)&&D(t.effectiveDismiss)&&t.setOpen(!1))};this.handleOutsideFocus=e=>{let t=this.drawerEl;if(!this.armed||!t?.open)return;let i=(0,o.focusOutsideTarget)(e);!i||this.contains(i)||t.triggerEl?.contains(i)||(0,o.dispatchOutside)(this,"focus-outside",e)&&D(t.effectiveDismiss)&&t.setOpen(!1)}}connectedCallback(){if(super.connectedCallback(),this.drawerEl=(0,T.closestThroughPortal)(this,"skdx-drawer, skdx-drawer-root"),!this.drawerEl)throw new Error("<skdx-drawer-content> must be used inside <skdx-drawer> or <skdx-drawer-root>.");this.observer.observe(this.drawerEl,{attributeFilter:["open","modal","placement","dismiss","dismissible"]}),this.addEventListener("keydown",this.handleKeyDown),document.addEventListener("keydown",this.handleDocumentKeyDown),document.addEventListener("pointerdown",this.handleOutsidePointerDown,!0),document.addEventListener("focusin",this.handleOutsideFocus,!0),this.armTimer=setTimeout(()=>{this.armed=!0},0),this.syncHostAttributes()}disconnectedCallback(){this.observer.disconnect(),this.removeEventListener("keydown",this.handleKeyDown),document.removeEventListener("keydown",this.handleDocumentKeyDown),document.removeEventListener("pointerdown",this.handleOutsidePointerDown,!0),document.removeEventListener("focusin",this.handleOutsideFocus,!0),this.armTimer!==void 0&&clearTimeout(this.armTimer),this.armed=!1,this.releaseLayer?.(),this.releaseLayer=void 0,this.focusFrame!==void 0&&cancelAnimationFrame(this.focusFrame),this.locked&&((0,c.unlockBodyScroll)(),this.locked=!1),(0,b.setOutsideInert)(this,!1),super.disconnectedCallback()}firstUpdated(){this.sync()}syncHostAttributes(){let e=this.drawerEl;e&&(this.id?e.contentId=this.id:this.id=e.contentId,this.setAttribute("role","dialog"),e.open&&e.modal?this.setAttribute("aria-modal","true"):this.removeAttribute("aria-modal"),(0,E.syncPartIdRef)(this,"aria-labelledby",this.querySelector("skdx-drawer-title"),"skdx-drawer-content","title"),(0,E.syncPartIdRef)(this,"aria-describedby",this.querySelector("skdx-drawer-description"),"skdx-drawer-content","description"),this.setAttribute("data-state",e.open?"open":"closed"),this.setAttribute("data-placement",e.placement),this.setAttribute("data-side",(0,p.resolvePhysicalSide)(e.placement,(0,p.resolveDirection)(this))),this.setAttribute("data-dismiss",e.effectiveDismiss),this.hidden=!e.open)}sync(){this.syncHostAttributes();let e=this.drawerEl;if(!e)return;e.open?this.releaseLayer??(this.releaseLayer=(0,v.pushDismissLayer)(this.layer)):(this.releaseLayer?.(),this.releaseLayer=void 0);let t=e.open&&e.modal;t&&!this.locked?(0,c.lockBodyScroll)():!t&&this.locked&&(0,c.unlockBodyScroll)(),this.locked=t,(0,b.setOutsideInert)(this,t);let i=e.open&&e.modal;i!==this.wasTrapped&&(this.wasTrapped=i,i?this.activateTrap():this.deactivateTrap())}activateTrap(){this.previouslyFocused=document.activeElement,this.focusFrame=requestAnimationFrame(()=>(0,o.focusOnOpen)(()=>{if(!(0,o.dispatchAutoFocus)(this,"open-auto-focus")||!this.initialFocus&&this.contains(document.activeElement))return;let e=(0,u.resolveFocusSelector)(this,this.initialFocus,"initialFocus","Drawer")??F(this)[0];e||(this.tabIndex=this.tabIndex>=0?this.tabIndex:-1),w(e??this)}))}deactivateTrap(){if(this.focusFrame!==void 0&&cancelAnimationFrame(this.focusFrame),!(0,o.dispatchAutoFocus)(this,"close-auto-focus")){this.previouslyFocused=null;return}if((0,u.applyFinalFocus)(this.finalFocus,"Drawer")){this.previouslyFocused=null;return}this.previouslyFocused&&this.previouslyFocused!==document.body&&document.contains(this.previouslyFocused)&&w(this.previouslyFocused),this.previouslyFocused=null}render(){return d.html`<slot @slotchange=${this.handleSlotChange}></slot>`}};n.styles=d.css`
+"use strict";var f=Object.defineProperty;var g=Object.getOwnPropertyDescriptor;var L=Object.getOwnPropertyNames;var A=Object.prototype.hasOwnProperty;var O=(s,r)=>{for(var e in r)f(s,e,{get:r[e],enumerable:!0})},R=(s,r,e,t)=>{if(r&&typeof r=="object"||typeof r=="function")for(let i of L(r))!A.call(s,i)&&i!==e&&f(s,i,{get:()=>r[i],enumerable:!(t=g(r,i))||t.enumerable});return s};var S=s=>R(f({},"__esModule",{value:!0}),s),c=(s,r,e,t)=>{for(var i=t>1?void 0:t?g(r,e):r,d=s.length-1,v;d>=0;d--)(v=s[d])&&(i=(t?v(r,e,i):v(i))||i);return t&&i&&f(r,e,i),i};var K={};O(K,{SkdxDrawerContent:()=>n});module.exports=S(K);var l=require("lit"),p=require("lit/decorators.js"),E=require("../internal/aria-part.cjs"),u=require("../internal/body-scroll-lock.cjs"),T=require("../internal/closest.cjs"),k=require("../internal/define.cjs"),y=require("../internal/direction.cjs"),o=require("../internal/dismiss.cjs"),a=require("../internal/dismissal.cjs"),h=require("../internal/focus-targets.cjs"),b=require("../internal/outsideInert.cjs"),m=require("../internal/tabbable.cjs");function F(s){return Array.from(s.querySelectorAll("*")).filter(r=>r.matches(m.TABBABLE_SELECTOR)||!!r.shadowRoot?.querySelector(m.TABBABLE_SELECTOR))}function w(s){(s.matches(m.TABBABLE_SELECTOR)?s:s.shadowRoot?.querySelector(m.TABBABLE_SELECTOR)??s).focus({preventScroll:!0})}function x(s){let r=s.ownerDocument.activeElement;for(;r?.shadowRoot?.activeElement;)r=r.shadowRoot.activeElement;let e=r;for(;e;){if(s.contains(e))return!0;let t=e.getRootNode();e=t instanceof ShadowRoot?t.host:null}return!1}function D(s){return s==="any"||s==="outside"}var n=class extends l.LitElement{constructor(){super(...arguments);this.drawerEl=null;this.locked=!1;this.wasTrapped=!1;this.previouslyFocused=null;this.observer=new MutationObserver(()=>this.sync());this.layer={insideElements:()=>[this,this.drawerEl?.triggerEl]};this.armed=!1;this.handleSlotChange=()=>this.syncHostAttributes();this.handleKeyDown=e=>{if(e.key!=="Tab"||!this.drawerEl?.open||!this.drawerEl.modal)return;let t=F(this);if(t.length===0){e.preventDefault();return}let i=t[0],d=t[t.length-1];e.shiftKey&&(document.activeElement===i||document.activeElement===this)?(e.preventDefault(),d.focus()):!e.shiftKey&&document.activeElement===d&&(e.preventDefault(),i.focus())};this.handleDocumentKeyDown=e=>{this.drawerEl?.open&&(0,a.handleEscapeKeyDown)(e,this.layer,this.handleEscape)};this.handleEscape=e=>{let t=this.drawerEl;if(!t||!(0,o.dispatchEscapeKeyDown)(this,e)||t.effectiveDismiss!=="any"&&t.effectiveDismiss!=="escape")return;let i=!t.modal&&x(this);t.setOpen(!1),i&&(0,o.dispatchAutoFocus)(this,"close-auto-focus")&&!(0,h.applyFinalFocus)(this.finalFocus,"Drawer")&&t.triggerEl&&w(t.triggerEl)};this.handleOutsidePointerDown=e=>{let t=this.drawerEl;if(!this.armed||!t?.open)return;let i=e.target;i&&(this.contains(i)||t.triggerEl?.contains(i)||(0,a.nestedLayerContains)(this.layer,i)||(0,o.dispatchOutside)(this,"pointer-down-outside",e)&&D(t.effectiveDismiss)&&t.setOpen(!1))};this.handleOutsideFocus=e=>{let t=this.drawerEl;if(!this.armed||!t?.open)return;let i=(0,o.focusOutsideTarget)(e);!i||this.contains(i)||t.triggerEl?.contains(i)||(0,a.nestedLayerContains)(this.layer,i)||(0,o.dispatchOutside)(this,"focus-outside",e)&&D(t.effectiveDismiss)&&t.setOpen(!1)}}connectedCallback(){if(super.connectedCallback(),this.drawerEl=(0,T.closestThroughPortal)(this,"skdx-drawer, skdx-drawer-root"),!this.drawerEl)throw new Error("<skdx-drawer-content> must be used inside <skdx-drawer> or <skdx-drawer-root>.");this.observer.observe(this.drawerEl,{attributeFilter:["open","modal","placement","dismiss","dismissible"]}),this.addEventListener("keydown",this.handleKeyDown),document.addEventListener("keydown",this.handleDocumentKeyDown),document.addEventListener("pointerdown",this.handleOutsidePointerDown,!0),document.addEventListener("focusin",this.handleOutsideFocus,!0),this.armTimer=setTimeout(()=>{this.armed=!0},0),this.syncHostAttributes()}disconnectedCallback(){this.observer.disconnect(),this.removeEventListener("keydown",this.handleKeyDown),document.removeEventListener("keydown",this.handleDocumentKeyDown),document.removeEventListener("pointerdown",this.handleOutsidePointerDown,!0),document.removeEventListener("focusin",this.handleOutsideFocus,!0),this.armTimer!==void 0&&clearTimeout(this.armTimer),this.armed=!1,this.releaseLayer?.(),this.releaseLayer=void 0,this.focusFrame!==void 0&&cancelAnimationFrame(this.focusFrame),this.locked&&((0,u.unlockBodyScroll)(),this.locked=!1),(0,b.setOutsideInert)(this,!1),super.disconnectedCallback()}firstUpdated(){this.sync()}syncHostAttributes(){let e=this.drawerEl;e&&(this.id?e.contentId=this.id:this.id=e.contentId,this.setAttribute("role","dialog"),e.open&&e.modal?this.setAttribute("aria-modal","true"):this.removeAttribute("aria-modal"),(0,E.syncPartIdRef)(this,"aria-labelledby",this.querySelector("skdx-drawer-title"),"skdx-drawer-content","title"),(0,E.syncPartIdRef)(this,"aria-describedby",this.querySelector("skdx-drawer-description"),"skdx-drawer-content","description"),this.setAttribute("data-state",e.open?"open":"closed"),this.setAttribute("data-placement",e.placement),this.setAttribute("data-side",(0,y.resolvePhysicalSide)(e.placement,(0,y.resolveDirection)(this))),this.setAttribute("data-dismiss",e.effectiveDismiss),this.hidden=!e.open)}sync(){this.syncHostAttributes();let e=this.drawerEl;if(!e)return;e.open?this.releaseLayer??(this.releaseLayer=(0,a.pushDismissLayer)(this.layer)):(this.releaseLayer?.(),this.releaseLayer=void 0);let t=e.open&&e.modal;t&&!this.locked?(0,u.lockBodyScroll)():!t&&this.locked&&(0,u.unlockBodyScroll)(),this.locked=t,(0,b.setOutsideInert)(this,t);let i=e.open&&e.modal;i!==this.wasTrapped&&(this.wasTrapped=i,i?this.activateTrap():this.deactivateTrap())}activateTrap(){this.previouslyFocused=document.activeElement,this.focusFrame=requestAnimationFrame(()=>(0,o.focusOnOpen)(()=>{if(!(0,o.dispatchAutoFocus)(this,"open-auto-focus")||!this.initialFocus&&this.contains(document.activeElement))return;let e=(0,h.resolveFocusSelector)(this,this.initialFocus,"initialFocus","Drawer")??F(this)[0];e||(this.tabIndex=this.tabIndex>=0?this.tabIndex:-1),w(e??this)}))}deactivateTrap(){if(this.focusFrame!==void 0&&cancelAnimationFrame(this.focusFrame),!(0,o.dispatchAutoFocus)(this,"close-auto-focus")){this.previouslyFocused=null;return}if((0,h.applyFinalFocus)(this.finalFocus,"Drawer")){this.previouslyFocused=null;return}this.previouslyFocused&&this.previouslyFocused!==document.body&&document.contains(this.previouslyFocused)&&w(this.previouslyFocused),this.previouslyFocused=null}render(){return l.html`<slot @slotchange=${this.handleSlotChange}></slot>`}};n.styles=l.css`
     :host {
       display: block;
     }
     :host([hidden]) {
       display: none;
     }
-  `,l([(0,f.property)({type:String,attribute:"initial-focus"})],n.prototype,"initialFocus",2),l([(0,f.property)({type:String,attribute:"final-focus"})],n.prototype,"finalFocus",2),l([(0,f.property)({type:String,reflect:!0,attribute:"data-size"})],n.prototype,"size",2),n=l([(0,k.customElement)("skdx-drawer-content","drawer","content")],n);0&&(module.exports={SkdxDrawerContent});
+  `,c([(0,p.property)({type:String,attribute:"initial-focus"})],n.prototype,"initialFocus",2),c([(0,p.property)({type:String,attribute:"final-focus"})],n.prototype,"finalFocus",2),c([(0,p.property)({type:String,reflect:!0,attribute:"data-size"})],n.prototype,"size",2),n=c([(0,k.customElement)("skdx-drawer-content","drawer","content")],n);0&&(module.exports={SkdxDrawerContent});