@skdx/web-components 0.30.0 → 0.32.0

package/dist/tour/TourContent.js

@@ -1,5 +1,5 @@
-var m=Object.defineProperty;var y=Object.getOwnPropertyDescriptor;var d=(s,o,t,e)=>{for(var i=e>1?void 0:e?y(o,t):o,n=s.length-1,a;n>=0;n--)(a=s[n])&&(i=(e?a(o,t,i):a(i))||i);return e&&i&&m(o,t,i),i};import{css as v,html as b,LitElement as g}from"lit";import{property as l}from"lit/decorators.js";import{customElement as E}from"../internal/define.js";import{resolveDirection as A}from"../internal/direction.js";import{dispatchAutoFocus as h,dispatchEscapeKeyDown as L,dispatchOutside as p,focusOnOpen as O,focusOutsideTarget as w}from"../internal/dismiss.js";import{handleEscapeKeyDown as F,pushDismissLayer as D}from"../internal/dismissal.js";import{setOutsideInert as P}from"../internal/outsideInert.js";import{optOutBoolean as T,positionFloating as S}from"../internal/positioning.js";import{hiddenHostStyles as k}from"../internal/styles.js";import{TABBABLE_SELECTOR as u}from"../internal/tabbable.js";import{findTourRoot as K,TOUR_INTERNAL_UPDATE as f}from"./tour-internal.js";function N(s){return Array.from(s.querySelectorAll("*")).filter(o=>o.matches(u)||!!o.shadowRoot?.querySelector(u))}function c(s){(s.matches(u)?s:s.shadowRoot?.querySelector(u)??s).focus({preventScroll:!0})}function R(s){if(!(s instanceof HTMLElement))return!1;if(s.isContentEditable||s.getAttribute("role")==="textbox")return!0;let o=s.localName;return o==="input"||o==="textarea"||o==="select"}var _=["position","left","top","transform"],r=class extends g{constructor(){super(...arguments);this.side="bottom";this.align="center";this.sideOffset=8;this.alignOffset=0;this.avoidCollisions=!0;this.collisionPadding=8;this.root=null;this.onRootUpdate=()=>this.sync();this.positionedTarget=null;this.positionedStep=-1;this.wasOpen=!1;this.previouslyFocused=null;this.focusedStep=-1;this.handleKeyDown=t=>{this.root?.open&&(this._handleArrowNavigation(t)||this._handleTabCycle(t))};this.handleDocumentKeyDown=t=>{this.root?.open&&F(t,this.layer,e=>{L(this,e)&&this.root?.closeOnEscape&&this.root.skip()})};this.layer={insideElements:()=>[this]};this.handleOutsidePointerDown=t=>{let e=this.root;if(!e?.open)return;let i=t.target;!i||this.contains(i)||p(this,"pointer-down-outside",t)&&e.closeOnInteractOutside&&e.skip()};this.handleOutsideFocus=t=>{if(!this.root?.open)return;let e=w(t);!e||this.contains(e)||p(this,"focus-outside",t)}}connectedCallback(){if(super.connectedCallback(),this.root=K(this),!this.root)throw new Error("<skdx-tour-content> must be used inside <skdx-tour>.");this.root.addEventListener(f,this.onRootUpdate),this.addEventListener("keydown",this.handleKeyDown),document.addEventListener("keydown",this.handleDocumentKeyDown),document.addEventListener("pointerdown",this.handleOutsidePointerDown),document.addEventListener("focusin",this.handleOutsideFocus),this.sync()}disconnectedCallback(){this.root?.removeEventListener(f,this.onRootUpdate),this.removeEventListener("keydown",this.handleKeyDown),document.removeEventListener("keydown",this.handleDocumentKeyDown),document.removeEventListener("pointerdown",this.handleOutsidePointerDown),document.removeEventListener("focusin",this.handleOutsideFocus),this.focusFrame!==void 0&&cancelAnimationFrame(this.focusFrame),this.releaseLayer?.(),this.releaseLayer=void 0,this.deactivatePosition(),this.focusedStep=-1,super.disconnectedCallback()}_syncAria(t,e){this.id?t.contentId=this.id:this.id=t.contentId,this.setAttribute("role","dialog"),e?this.setAttribute("aria-modal","true"):this.removeAttribute("aria-modal"),P(this,e);for(let[i,n,a]of[["skdx-tour-title","aria-labelledby",t.titleId],["skdx-tour-description","aria-describedby",t.descriptionId]])this.querySelector(i)?this.setAttribute(n,a):this.removeAttribute(n);this.hasAttribute("tabindex")||(this.tabIndex=-1)}_syncDataAttrs(t,e){this.setAttribute("data-state",e?"open":"closed"),this.setAttribute("data-step",String(t.step));let i=t.activeStep?.type;i?this.setAttribute("data-type",i):this.removeAttribute("data-type"),t.keyboardNavigation?this.setAttribute("data-keyboard-navigation",""):this.removeAttribute("data-keyboard-navigation"),t.activeStep?.backdrop!==!1?this.setAttribute("data-backdrop",""):this.removeAttribute("data-backdrop")}_syncLayer(t){t?this.releaseLayer??(this.releaseLayer=D(this.layer)):(this.releaseLayer?.(),this.releaseLayer=void 0)}sync(){let t=this.root;if(!t)return;let e=t.open,i=e&&t.preventInteraction;this._syncAria(t,i),this._syncDataAttrs(t,e),this.hidden=!e,this._syncLayer(e),e&&t.anchored&&t.target?this.activatePosition(t.target):this.centre(),this.syncFocus(e)}activatePosition(t){let e=this.root;e&&(this.positionedTarget===t&&this.positionedStep===e.step||(this.deactivatePosition(),this.positionedTarget=t,this.positionedStep=e.step,this.removeAttribute("data-centered"),this.setAttribute("data-side",e.activeStep?.placement??this.side??"bottom"),this.setAttribute("data-align",e.activeStep?.align??this.align??"center"),this.cleanupPosition=S(t,this,{side:e.activeStep?.placement??this.side,align:e.activeStep?.align??this.align,sideOffset:this.sideOffset,alignOffset:this.alignOffset,avoidCollisions:this.avoidCollisions,collisionPadding:this.collisionPadding,collisionBoundary:this.collisionBoundary,component:"tour",arrow:()=>this.querySelector("skdx-tour-arrow")})))}centre(){this.deactivatePosition(),this.setAttribute("data-centered",""),this.removeAttribute("data-side"),this.removeAttribute("data-align");for(let t of _)this.style.removeProperty(t)}deactivatePosition(){this.cleanupPosition?.(),this.cleanupPosition=void 0,this.positionedTarget=null,this.positionedStep=-1}syncFocus(t){t&&!this.wasOpen&&(this.previouslyFocused=document.activeElement),!t&&this.wasOpen&&(this.focusFrame!==void 0&&cancelAnimationFrame(this.focusFrame),this.focusFrame=void 0,this.focusedStep=-1,h(this,"close-auto-focus")&&this.previouslyFocused&&this.previouslyFocused!==document.body&&document.contains(this.previouslyFocused)&&c(this.previouslyFocused),this.previouslyFocused=null),this.wasOpen=t;let e=this.root?.step??-1;!t||this.focusedStep===e||(this.focusedStep=e,this.focusFrame=requestAnimationFrame(()=>O(()=>{this.focusFrame=void 0,h(this,"open-auto-focus")&&this.focus({preventScroll:!0})})))}_handleArrowNavigation(t){let e=this.root;if(!e?.keyboardNavigation||t.defaultPrevented||t.altKey||t.ctrlKey||t.metaKey||R(t.target))return!1;let i=A(this)==="rtl";return t.key==="ArrowRight"?(i?e.prev():e.next(),t.preventDefault(),!0):t.key==="ArrowLeft"?(i?e.next():e.prev(),t.preventDefault(),!0):!1}_handleTabCycle(t){if(t.key!=="Tab")return;let e=N(this);if(e.length===0){t.preventDefault();return}let i=e[0],n=e[e.length-1],a=document.activeElement;t.shiftKey&&(a===i||a===this)?(t.preventDefault(),c(n)):!t.shiftKey&&a===n&&(t.preventDefault(),c(i))}render(){return b`<slot></slot>`}};r.styles=[v`
+var y=Object.defineProperty;var v=Object.getOwnPropertyDescriptor;var d=(s,o,t,e)=>{for(var i=e>1?void 0:e?v(o,t):o,n=s.length-1,a;n>=0;n--)(a=s[n])&&(i=(e?a(o,t,i):a(i))||i);return e&&i&&y(o,t,i),i};import{css as b,html as g,LitElement as E}from"lit";import{property as l}from"lit/decorators.js";import{customElement as A}from"../internal/define.js";import{resolveDirection as L}from"../internal/direction.js";import{dispatchAutoFocus as h,dispatchEscapeKeyDown as O,dispatchOutside as p,focusOnOpen as w,focusOutsideTarget as F}from"../internal/dismiss.js";import{handleEscapeKeyDown as D,nestedLayerContains as f,pushDismissLayer as P}from"../internal/dismissal.js";import{setOutsideInert as T}from"../internal/outsideInert.js";import{optOutBoolean as S,positionFloating as k}from"../internal/positioning.js";import{hiddenHostStyles as K}from"../internal/styles.js";import{TABBABLE_SELECTOR as u}from"../internal/tabbable.js";import{findTourRoot as N,TOUR_INTERNAL_UPDATE as m}from"./tour-internal.js";function R(s){return Array.from(s.querySelectorAll("*")).filter(o=>o.matches(u)||!!o.shadowRoot?.querySelector(u))}function c(s){(s.matches(u)?s:s.shadowRoot?.querySelector(u)??s).focus({preventScroll:!0})}function _(s){if(!(s instanceof HTMLElement))return!1;if(s.isContentEditable||s.getAttribute("role")==="textbox")return!0;let o=s.localName;return o==="input"||o==="textarea"||o==="select"}var x=["position","left","top","transform"],r=class extends E{constructor(){super(...arguments);this.side="bottom";this.align="center";this.sideOffset=8;this.alignOffset=0;this.avoidCollisions=!0;this.collisionPadding=8;this.root=null;this.onRootUpdate=()=>this.sync();this.positionedTarget=null;this.positionedStep=-1;this.wasOpen=!1;this.previouslyFocused=null;this.focusedStep=-1;this.handleKeyDown=t=>{this.root?.open&&(this._handleArrowNavigation(t)||this._handleTabCycle(t))};this.handleDocumentKeyDown=t=>{this.root?.open&&D(t,this.layer,e=>{O(this,e)&&this.root?.closeOnEscape&&this.root.skip()})};this.layer={insideElements:()=>[this]};this.handleOutsidePointerDown=t=>{let e=this.root;if(!e?.open)return;let i=t.target;!i||this.contains(i)||f(this.layer,i)||p(this,"pointer-down-outside",t)&&e.closeOnInteractOutside&&e.skip()};this.handleOutsideFocus=t=>{if(!this.root?.open)return;let e=F(t);!e||this.contains(e)||f(this.layer,e)||p(this,"focus-outside",t)}}connectedCallback(){if(super.connectedCallback(),this.root=N(this),!this.root)throw new Error("<skdx-tour-content> must be used inside <skdx-tour>.");this.root.addEventListener(m,this.onRootUpdate),this.addEventListener("keydown",this.handleKeyDown),document.addEventListener("keydown",this.handleDocumentKeyDown),document.addEventListener("pointerdown",this.handleOutsidePointerDown),document.addEventListener("focusin",this.handleOutsideFocus),this.sync()}disconnectedCallback(){this.root?.removeEventListener(m,this.onRootUpdate),this.removeEventListener("keydown",this.handleKeyDown),document.removeEventListener("keydown",this.handleDocumentKeyDown),document.removeEventListener("pointerdown",this.handleOutsidePointerDown),document.removeEventListener("focusin",this.handleOutsideFocus),this.focusFrame!==void 0&&cancelAnimationFrame(this.focusFrame),this.releaseLayer?.(),this.releaseLayer=void 0,this.deactivatePosition(),this.focusedStep=-1,super.disconnectedCallback()}_syncAria(t,e){this.id?t.contentId=this.id:this.id=t.contentId,this.setAttribute("role","dialog"),e?this.setAttribute("aria-modal","true"):this.removeAttribute("aria-modal"),T(this,e);for(let[i,n,a]of[["skdx-tour-title","aria-labelledby",t.titleId],["skdx-tour-description","aria-describedby",t.descriptionId]])this.querySelector(i)?this.setAttribute(n,a):this.removeAttribute(n);this.hasAttribute("tabindex")||(this.tabIndex=-1)}_syncDataAttrs(t,e){this.setAttribute("data-state",e?"open":"closed"),this.setAttribute("data-step",String(t.step));let i=t.activeStep?.type;i?this.setAttribute("data-type",i):this.removeAttribute("data-type"),t.keyboardNavigation?this.setAttribute("data-keyboard-navigation",""):this.removeAttribute("data-keyboard-navigation"),t.activeStep?.backdrop!==!1?this.setAttribute("data-backdrop",""):this.removeAttribute("data-backdrop")}_syncLayer(t){t?this.releaseLayer??(this.releaseLayer=P(this.layer)):(this.releaseLayer?.(),this.releaseLayer=void 0)}sync(){let t=this.root;if(!t)return;let e=t.open,i=e&&t.preventInteraction;this._syncAria(t,i),this._syncDataAttrs(t,e),this.hidden=!e,this._syncLayer(e),e&&t.anchored&&t.target?this.activatePosition(t.target):this.centre(),this.syncFocus(e)}activatePosition(t){let e=this.root;e&&(this.positionedTarget===t&&this.positionedStep===e.step||(this.deactivatePosition(),this.positionedTarget=t,this.positionedStep=e.step,this.removeAttribute("data-centered"),this.setAttribute("data-side",e.activeStep?.placement??this.side??"bottom"),this.setAttribute("data-align",e.activeStep?.align??this.align??"center"),this.cleanupPosition=k(t,this,{side:e.activeStep?.placement??this.side,align:e.activeStep?.align??this.align,sideOffset:this.sideOffset,alignOffset:this.alignOffset,avoidCollisions:this.avoidCollisions,collisionPadding:this.collisionPadding,collisionBoundary:this.collisionBoundary,component:"tour",arrow:()=>this.querySelector("skdx-tour-arrow")})))}centre(){this.deactivatePosition(),this.setAttribute("data-centered",""),this.removeAttribute("data-side"),this.removeAttribute("data-align");for(let t of x)this.style.removeProperty(t)}deactivatePosition(){this.cleanupPosition?.(),this.cleanupPosition=void 0,this.positionedTarget=null,this.positionedStep=-1}syncFocus(t){t&&!this.wasOpen&&(this.previouslyFocused=document.activeElement),!t&&this.wasOpen&&(this.focusFrame!==void 0&&cancelAnimationFrame(this.focusFrame),this.focusFrame=void 0,this.focusedStep=-1,h(this,"close-auto-focus")&&this.previouslyFocused&&this.previouslyFocused!==document.body&&document.contains(this.previouslyFocused)&&c(this.previouslyFocused),this.previouslyFocused=null),this.wasOpen=t;let e=this.root?.step??-1;!t||this.focusedStep===e||(this.focusedStep=e,this.focusFrame=requestAnimationFrame(()=>w(()=>{this.focusFrame=void 0,h(this,"open-auto-focus")&&this.focus({preventScroll:!0})})))}_handleArrowNavigation(t){let e=this.root;if(!e?.keyboardNavigation||t.defaultPrevented||t.altKey||t.ctrlKey||t.metaKey||_(t.target))return!1;let i=L(this)==="rtl";return t.key==="ArrowRight"?(i?e.prev():e.next(),t.preventDefault(),!0):t.key==="ArrowLeft"?(i?e.next():e.prev(),t.preventDefault(),!0):!1}_handleTabCycle(t){if(t.key!=="Tab")return;let e=R(this);if(e.length===0){t.preventDefault();return}let i=e[0],n=e[e.length-1],a=document.activeElement;t.shiftKey&&(a===i||a===this)?(t.preventDefault(),c(n)):!t.shiftKey&&a===n&&(t.preventDefault(),c(i))}render(){return g`<slot></slot>`}};r.styles=[b`
       :host {
         display: block;
       }
-    `,k],d([l({type:String})],r.prototype,"side",2),d([l({type:String})],r.prototype,"align",2),d([l({type:Number,attribute:"side-offset"})],r.prototype,"sideOffset",2),d([l({type:Number,attribute:"align-offset"})],r.prototype,"alignOffset",2),d([l({converter:T,attribute:"avoid-collisions"})],r.prototype,"avoidCollisions",2),d([l({type:Number,attribute:"collision-padding"})],r.prototype,"collisionPadding",2),d([l({attribute:!1})],r.prototype,"collisionBoundary",2),r=d([E("skdx-tour-content","tour","content")],r);export{r as SkdxTourContent};
+    `,K],d([l({type:String})],r.prototype,"side",2),d([l({type:String})],r.prototype,"align",2),d([l({type:Number,attribute:"side-offset"})],r.prototype,"sideOffset",2),d([l({type:Number,attribute:"align-offset"})],r.prototype,"alignOffset",2),d([l({converter:S,attribute:"avoid-collisions"})],r.prototype,"avoidCollisions",2),d([l({type:Number,attribute:"collision-padding"})],r.prototype,"collisionPadding",2),d([l({attribute:!1})],r.prototype,"collisionBoundary",2),r=d([A("skdx-tour-content","tour","content")],r);export{r as SkdxTourContent};

package/dist/tour/TourNextTrigger.cjs

@@ -5,7 +5,7 @@
         ?data-last=${this.isLast}
         @click=${this.handleClick}
       >
-        <slot></slot>
+        <slot>${this.isLast?"Done":"Next"}</slot>
       </button>
     `}};i.shadowRootOptions=n.delegatesFocusShadowRootOptions,i.styles=[n.resetNativeControl,a.css`
       :host {

package/dist/tour/TourNextTrigger.js

@@ -5,7 +5,7 @@ var c=Object.defineProperty;var p=Object.getOwnPropertyDescriptor;var l=(i,s,t,r
         ?data-last=${this.isLast}
         @click=${this.handleClick}
       >
-        <slot></slot>
+        <slot>${this.isLast?"Done":"Next"}</slot>
       </button>
     `}};o.shadowRootOptions=k,o.styles=[y,h`
       :host {

package/dist/tree/Tree.cjs

@@ -1,4 +1,4 @@
-"use strict";var g=Object.defineProperty;var b=Object.getOwnPropertyDescriptor;var C=Object.getOwnPropertyNames;var T=Object.prototype.hasOwnProperty;var L=(o,l)=>{for(var e in l)g(o,e,{get:l[e],enumerable:!0})},N=(o,l,e,t)=>{if(l&&typeof l=="object"||typeof l=="function")for(let i of C(l))!T.call(o,i)&&i!==e&&g(o,i,{get:()=>l[i],enumerable:!(t=b(l,i))||t.enumerable});return o};var K=o=>N(g({},"__esModule",{value:!0}),o),d=(o,l,e,t)=>{for(var i=t>1?void 0:t?b(l,e):l,n=o.length-1,r;n>=0;n--)(r=o[n])&&(i=(t?r(l,e,i):r(i))||i);return t&&i&&g(l,e,i),i};var D={};L(D,{SkdxTree:()=>s,defaultGetLoadedLabel:()=>M,treeNodeLabel:()=>E});module.exports=K(D);var c=require("lit"),a=require("lit/decorators.js"),S=require("lit/directives/repeat.js"),_=require("../internal/define.cjs"),A=require("../internal/direction.cjs"),x=require("../internal/glyphs.cjs"),I=require("../internal/positioning.cjs"),v=require("../internal/typeahead.cjs"),k=require("../utils/live-announcer.cjs"),O=require("./TreeGroup.cjs"),q=require("./TreeItem.cjs"),R=require("./TreeItemIndicator.cjs"),p=require("../internal/events.cjs"),w=require("./family.cjs");var H='[role="treeitem"]:not([data-disabled])',y='[role="treeitem"]';function f(o){return o.getAttribute("data-skdx-tree-node-id")??""}function E(o){let l=o.getAttribute("data-text-value");if(l!==null)return l;let e="";for(let t of Array.from(o.childNodes)){if(t.nodeType!==1&&t.nodeType!==3)continue;let i=t.nodeType===1?t:null;i&&(i.getAttribute("role")==="group"||i.getAttribute("aria-hidden")==="true")||(e+=t.textContent??"")}return e}function M(o){return`${o} loaded`}var s=class extends c.LitElement{constructor(){super(...arguments);this.selectionMode="single";this.defaultExpandedIds=[];this.defaultSelectedIds=[];this.selectionPropagation="none";this.getLoadedLabel=M;this.disabledBehavior="all";this.expandOnClick=!0;this._uncontrolledExpanded=new Set;this._uncontrolledSelected=new Set;this._uncontrolledChecked=new Set;this._activeNodeId=null;this._loadingIds=new Set;this._initialized=!1;this._requested=new Set;this._nodeParents=new Map;this._typeahead=new v.Typeahead;this._collectionAdopted=!1;this._rememberedChildren=new Map;this._anchorNodeId=null;this.handleFocusIn=e=>{let i=e.target.closest?.('[role="treeitem"]');if(i&&(this.disabledBehavior==="selection"||!i.hasAttribute("data-disabled"))){let n=i.getAttribute("data-skdx-tree-node-id");n&&this.setActiveNodeId(n)}};this.handleKeyDown=e=>{let t=e.target;if(!t.matches?.('[role="treeitem"]'))return;let i=Array.from(this.querySelectorAll(this.itemSelector)),n=i.indexOf(t),r=this.selectionMode==="multiple",h=(0,A.directionalKey)(e.key,this),u={event:e,target:t,items:i,index:n,key:h,multiple:r};this._handleMultiSelectShiftArrow(u)||this._handleMultiSelectShiftSpace(u)||this._handleMultiSelectShiftHomeEnd(u)||this._handleSelectAll(u)||this._handleSimpleArrow(u)||this._handleExpandCollapseActivate(u)}}get itemSelector(){return this.disabledBehavior==="selection"?y:H}connectedCallback(){super.connectedCallback(),this._initialized||(this._uncontrolledExpanded=new Set(this.defaultExpandedIds),this._uncontrolledSelected=new Set(this.defaultSelectedIds),this._uncontrolledChecked=new Set(this.defaultCheckedIds),this._initialized=!0),this.setAttribute("role","tree"),this.syncHostAttrs(),this.addEventListener("keydown",this.handleKeyDown),this.addEventListener("focusin",this.handleFocusIn)}disconnectedCallback(){this.removeEventListener("keydown",this.handleKeyDown),this.removeEventListener("focusin",this.handleFocusIn),this._typeahead.clear(),super.disconnectedCallback()}updated(e){(e.has("expandedIds")||e.has("selectedIds")||e.has("checkedIds")||e.has("selectionMode")||e.has("selectionPropagation"))&&(this.syncHostAttrs(),this._broadcast()),this.collection&&this.renderCollection(this.collection),this.syncNodePositions()}renderCollection(e){this._collectionAdopted||(this._collectionAdopted=!0,this.replaceChildren()),(0,c.render)(this.renderNodes(e),this,{host:this})}renderNodes(e){return(0,S.repeat)(e,t=>t.nodeId,t=>{let i=t.children??[],n=t.hasChildren??i.length>0;return c.html`<skdx-tree-item
+"use strict";var g=Object.defineProperty;var b=Object.getOwnPropertyDescriptor;var C=Object.getOwnPropertyNames;var T=Object.prototype.hasOwnProperty;var L=(o,l)=>{for(var e in l)g(o,e,{get:l[e],enumerable:!0})},N=(o,l,e,t)=>{if(l&&typeof l=="object"||typeof l=="function")for(let i of C(l))!T.call(o,i)&&i!==e&&g(o,i,{get:()=>l[i],enumerable:!(t=b(l,i))||t.enumerable});return o};var K=o=>N(g({},"__esModule",{value:!0}),o),d=(o,l,e,t)=>{for(var i=t>1?void 0:t?b(l,e):l,n=o.length-1,r;n>=0;n--)(r=o[n])&&(i=(t?r(l,e,i):r(i))||i);return t&&i&&g(l,e,i),i};var D={};L(D,{SkdxTree:()=>s,defaultGetLoadedLabel:()=>M,treeNodeLabel:()=>E});module.exports=K(D);var c=require("lit"),a=require("lit/decorators.js"),S=require("lit/directives/repeat.js"),_=require("../internal/define.cjs"),A=require("../internal/direction.cjs"),x=require("../internal/glyphs.cjs"),I=require("../internal/positioning.cjs"),v=require("../internal/typeahead.cjs"),k=require("../utils/live-announcer.cjs"),O=require("./TreeGroup.cjs"),q=require("./TreeItem.cjs"),R=require("./TreeItemIndicator.cjs"),p=require("../internal/events.cjs"),w=require("./family.cjs");var H='[role="treeitem"]:not([data-disabled])',y='[role="treeitem"]';function f(o){return o.getAttribute("data-skdx-tree-node-id")??""}function E(o){let l=o.getAttribute("data-text-value");if(l!==null)return l;let e="";for(let t of Array.from(o.childNodes)){if(t.nodeType!==1&&t.nodeType!==3)continue;let i=t.nodeType===1?t:null;i&&(i.getAttribute("role")==="group"||i.getAttribute("aria-hidden")==="true")||(e+=t.textContent??"")}return e}function M(o){return`${o} loaded`}var s=class extends c.LitElement{constructor(){super(...arguments);this.selectionMode="single";this.defaultExpandedIds=[];this.defaultSelectedIds=[];this.selectionPropagation="none";this.getLoadedLabel=M;this.disabledBehavior="all";this.expandOnClick=!0;this._uncontrolledExpanded=new Set;this._uncontrolledSelected=new Set;this._uncontrolledChecked=new Set;this._activeNodeId=null;this._loadingIds=new Set;this._initialized=!1;this._requested=new Set;this._nodeParents=new Map;this._typeahead=new v.Typeahead;this._collectionAdopted=!1;this._rememberedChildren=new Map;this._anchorNodeId=null;this.handleFocusIn=e=>{let i=e.target.closest?.('[role="treeitem"]');if(i&&(this.disabledBehavior==="selection"||!i.hasAttribute("data-disabled"))){let n=i.getAttribute("data-skdx-tree-node-id");n&&this.setActiveNodeId(n)}};this.handleKeyDown=e=>{let t=e.target;if(!t.matches?.('[role="treeitem"]'))return;let i=Array.from(this.querySelectorAll(this.itemSelector)),n=i.indexOf(t),r=this.selectionMode==="multiple",h=(0,A.directionalKey)(e.key,this),u={event:e,target:t,items:i,index:n,key:h,multiple:r};this._handleMultiSelectShiftArrow(u)||this._handleMultiSelectShiftSpace(u)||this._handleMultiSelectShiftHomeEnd(u)||this._handleSelectAll(u)||this._handleSimpleArrow(u)||this._handleExpandCollapseActivate(u)}}get itemSelector(){return this.disabledBehavior==="selection"?y:H}connectedCallback(){super.connectedCallback(),this._initialized||(this._uncontrolledExpanded=new Set(this.defaultExpandedIds),this._uncontrolledSelected=new Set(this.defaultSelectedIds),this._uncontrolledChecked=new Set(this.defaultCheckedIds),this._initialized=!0),this.setAttribute("role","tree"),this.syncHostAttrs(),this.addEventListener("keydown",this.handleKeyDown),this.addEventListener("focusin",this.handleFocusIn)}disconnectedCallback(){this.removeEventListener("keydown",this.handleKeyDown),this.removeEventListener("focusin",this.handleFocusIn),this._typeahead.clear(),super.disconnectedCallback()}willUpdate(e){(e.has("expandedIds")||e.has("selectedIds")||e.has("checkedIds")||e.has("selectionMode")||e.has("selectionPropagation"))&&(this.syncHostAttrs(),this._broadcast()),this.collection&&this.renderCollection(this.collection),this.syncNodePositions()}renderCollection(e){this._collectionAdopted||(this._collectionAdopted=!0,this.replaceChildren()),(0,c.render)(this.renderNodes(e),this,{host:this})}renderNodes(e){return(0,S.repeat)(e,t=>t.nodeId,t=>{let i=t.children??[],n=t.hasChildren??i.length>0;return c.html`<skdx-tree-item
           node-id=${t.nodeId}
           ?disabled=${t.disabled===!0}
           text-value=${t.textValue??c.nothing}

package/dist/tree/Tree.d.cts

@@ -112,7 +112,7 @@ export declare class SkdxTree extends LitElement {
     private readonly _typeahead;
     connectedCallback(): void;
     disconnectedCallback(): void;
-    protected updated(changed: Map<string, unknown>): void;
+    protected willUpdate(changed: Map<string, unknown>): void;
     private _collectionAdopted;
     /** Render to light DOM so closest('skdx-tree') finds all parts. */
     private renderCollection;

package/dist/tree/Tree.d.ts

@@ -112,7 +112,7 @@ export declare class SkdxTree extends LitElement {
     private readonly _typeahead;
     connectedCallback(): void;
     disconnectedCallback(): void;
-    protected updated(changed: Map<string, unknown>): void;
+    protected willUpdate(changed: Map<string, unknown>): void;
     private _collectionAdopted;
     /** Render to light DOM so closest('skdx-tree') finds all parts. */
     private renderCollection;

package/dist/tree/Tree.js

@@ -1,4 +1,4 @@
-var b=Object.defineProperty;var S=Object.getOwnPropertyDescriptor;var d=(h,u,e,t)=>{for(var i=t>1?void 0:t?S(u,e):u,n=h.length-1,r;n>=0;n--)(r=h[n])&&(i=(t?r(u,e,i):r(i))||i);return t&&i&&b(u,e,i),i};import{css as _,html as g,LitElement as A,render as x,nothing as v}from"lit";import{property as l,state as p}from"lit/decorators.js";import{repeat as I}from"lit/directives/repeat.js";import{customElement as k}from"../internal/define.js";import{directionalKey as w}from"../internal/direction.js";import{chevronRightGlyph as E}from"../internal/glyphs.js";import{optOutBoolean as M}from"../internal/positioning.js";import{isTypeaheadKey as C,Typeahead as T}from"../internal/typeahead.js";import{announce as L}from"../utils/live-announcer.js";import"./TreeGroup.js";import"./TreeItem.js";import"./TreeItemIndicator.js";import{emit as f}from"../internal/events.js";import{TREE_FAMILY as N}from"./family.js";var K='[role="treeitem"]:not([data-disabled])',y='[role="treeitem"]';function c(h){return h.getAttribute("data-skdx-tree-node-id")??""}function H(h){let u=h.getAttribute("data-text-value");if(u!==null)return u;let e="";for(let t of Array.from(h.childNodes)){if(t.nodeType!==1&&t.nodeType!==3)continue;let i=t.nodeType===1?t:null;i&&(i.getAttribute("role")==="group"||i.getAttribute("aria-hidden")==="true")||(e+=t.textContent??"")}return e}function D(h){return`${h} loaded`}var s=class extends A{constructor(){super(...arguments);this.selectionMode="single";this.defaultExpandedIds=[];this.defaultSelectedIds=[];this.selectionPropagation="none";this.getLoadedLabel=D;this.disabledBehavior="all";this.expandOnClick=!0;this._uncontrolledExpanded=new Set;this._uncontrolledSelected=new Set;this._uncontrolledChecked=new Set;this._activeNodeId=null;this._loadingIds=new Set;this._initialized=!1;this._requested=new Set;this._nodeParents=new Map;this._typeahead=new T;this._collectionAdopted=!1;this._rememberedChildren=new Map;this._anchorNodeId=null;this.handleFocusIn=e=>{let i=e.target.closest?.('[role="treeitem"]');if(i&&(this.disabledBehavior==="selection"||!i.hasAttribute("data-disabled"))){let n=i.getAttribute("data-skdx-tree-node-id");n&&this.setActiveNodeId(n)}};this.handleKeyDown=e=>{let t=e.target;if(!t.matches?.('[role="treeitem"]'))return;let i=Array.from(this.querySelectorAll(this.itemSelector)),n=i.indexOf(t),r=this.selectionMode==="multiple",a=w(e.key,this),o={event:e,target:t,items:i,index:n,key:a,multiple:r};this._handleMultiSelectShiftArrow(o)||this._handleMultiSelectShiftSpace(o)||this._handleMultiSelectShiftHomeEnd(o)||this._handleSelectAll(o)||this._handleSimpleArrow(o)||this._handleExpandCollapseActivate(o)}}get itemSelector(){return this.disabledBehavior==="selection"?y:K}connectedCallback(){super.connectedCallback(),this._initialized||(this._uncontrolledExpanded=new Set(this.defaultExpandedIds),this._uncontrolledSelected=new Set(this.defaultSelectedIds),this._uncontrolledChecked=new Set(this.defaultCheckedIds),this._initialized=!0),this.setAttribute("role","tree"),this.syncHostAttrs(),this.addEventListener("keydown",this.handleKeyDown),this.addEventListener("focusin",this.handleFocusIn)}disconnectedCallback(){this.removeEventListener("keydown",this.handleKeyDown),this.removeEventListener("focusin",this.handleFocusIn),this._typeahead.clear(),super.disconnectedCallback()}updated(e){(e.has("expandedIds")||e.has("selectedIds")||e.has("checkedIds")||e.has("selectionMode")||e.has("selectionPropagation"))&&(this.syncHostAttrs(),this._broadcast()),this.collection&&this.renderCollection(this.collection),this.syncNodePositions()}renderCollection(e){this._collectionAdopted||(this._collectionAdopted=!0,this.replaceChildren()),x(this.renderNodes(e),this,{host:this})}renderNodes(e){return I(e,t=>t.nodeId,t=>{let i=t.children??[],n=t.hasChildren??i.length>0;return g`<skdx-tree-item
+var b=Object.defineProperty;var S=Object.getOwnPropertyDescriptor;var d=(h,u,e,t)=>{for(var i=t>1?void 0:t?S(u,e):u,n=h.length-1,r;n>=0;n--)(r=h[n])&&(i=(t?r(u,e,i):r(i))||i);return t&&i&&b(u,e,i),i};import{css as _,html as g,LitElement as A,render as x,nothing as v}from"lit";import{property as l,state as p}from"lit/decorators.js";import{repeat as I}from"lit/directives/repeat.js";import{customElement as k}from"../internal/define.js";import{directionalKey as w}from"../internal/direction.js";import{chevronRightGlyph as E}from"../internal/glyphs.js";import{optOutBoolean as M}from"../internal/positioning.js";import{isTypeaheadKey as C,Typeahead as T}from"../internal/typeahead.js";import{announce as L}from"../utils/live-announcer.js";import"./TreeGroup.js";import"./TreeItem.js";import"./TreeItemIndicator.js";import{emit as f}from"../internal/events.js";import{TREE_FAMILY as N}from"./family.js";var K='[role="treeitem"]:not([data-disabled])',y='[role="treeitem"]';function c(h){return h.getAttribute("data-skdx-tree-node-id")??""}function H(h){let u=h.getAttribute("data-text-value");if(u!==null)return u;let e="";for(let t of Array.from(h.childNodes)){if(t.nodeType!==1&&t.nodeType!==3)continue;let i=t.nodeType===1?t:null;i&&(i.getAttribute("role")==="group"||i.getAttribute("aria-hidden")==="true")||(e+=t.textContent??"")}return e}function D(h){return`${h} loaded`}var s=class extends A{constructor(){super(...arguments);this.selectionMode="single";this.defaultExpandedIds=[];this.defaultSelectedIds=[];this.selectionPropagation="none";this.getLoadedLabel=D;this.disabledBehavior="all";this.expandOnClick=!0;this._uncontrolledExpanded=new Set;this._uncontrolledSelected=new Set;this._uncontrolledChecked=new Set;this._activeNodeId=null;this._loadingIds=new Set;this._initialized=!1;this._requested=new Set;this._nodeParents=new Map;this._typeahead=new T;this._collectionAdopted=!1;this._rememberedChildren=new Map;this._anchorNodeId=null;this.handleFocusIn=e=>{let i=e.target.closest?.('[role="treeitem"]');if(i&&(this.disabledBehavior==="selection"||!i.hasAttribute("data-disabled"))){let n=i.getAttribute("data-skdx-tree-node-id");n&&this.setActiveNodeId(n)}};this.handleKeyDown=e=>{let t=e.target;if(!t.matches?.('[role="treeitem"]'))return;let i=Array.from(this.querySelectorAll(this.itemSelector)),n=i.indexOf(t),r=this.selectionMode==="multiple",a=w(e.key,this),o={event:e,target:t,items:i,index:n,key:a,multiple:r};this._handleMultiSelectShiftArrow(o)||this._handleMultiSelectShiftSpace(o)||this._handleMultiSelectShiftHomeEnd(o)||this._handleSelectAll(o)||this._handleSimpleArrow(o)||this._handleExpandCollapseActivate(o)}}get itemSelector(){return this.disabledBehavior==="selection"?y:K}connectedCallback(){super.connectedCallback(),this._initialized||(this._uncontrolledExpanded=new Set(this.defaultExpandedIds),this._uncontrolledSelected=new Set(this.defaultSelectedIds),this._uncontrolledChecked=new Set(this.defaultCheckedIds),this._initialized=!0),this.setAttribute("role","tree"),this.syncHostAttrs(),this.addEventListener("keydown",this.handleKeyDown),this.addEventListener("focusin",this.handleFocusIn)}disconnectedCallback(){this.removeEventListener("keydown",this.handleKeyDown),this.removeEventListener("focusin",this.handleFocusIn),this._typeahead.clear(),super.disconnectedCallback()}willUpdate(e){(e.has("expandedIds")||e.has("selectedIds")||e.has("checkedIds")||e.has("selectionMode")||e.has("selectionPropagation"))&&(this.syncHostAttrs(),this._broadcast()),this.collection&&this.renderCollection(this.collection),this.syncNodePositions()}renderCollection(e){this._collectionAdopted||(this._collectionAdopted=!0,this.replaceChildren()),x(this.renderNodes(e),this,{host:this})}renderNodes(e){return I(e,t=>t.nodeId,t=>{let i=t.children??[],n=t.hasChildren??i.length>0;return g`<skdx-tree-item
           node-id=${t.nodeId}
           ?disabled=${t.disabled===!0}
           text-value=${t.textValue??v}

package/dist/tree-select/TreeSelectContent.cjs

@@ -1,5 +1,5 @@
-"use strict";var c=Object.defineProperty;var m=Object.getOwnPropertyDescriptor;var E=Object.getOwnPropertyNames;var y=Object.prototype.hasOwnProperty;var b=(o,i)=>{for(var t in i)c(o,t,{get:i[t],enumerable:!0})},P=(o,i,t,e)=>{if(i&&typeof i=="object"||typeof i=="function")for(let n of E(i))!y.call(o,n)&&n!==t&&c(o,n,{get:()=>i[n],enumerable:!(e=m(i,n))||e.enumerable});return o};var O=o=>P(c({},"__esModule",{value:!0}),o),r=(o,i,t,e)=>{for(var n=e>1?void 0:e?m(i,t):i,p=o.length-1,f;p>=0;p--)(f=o[p])&&(n=(e?f(i,t,n):f(n))||n);return e&&n&&c(i,t,n),n};var F={};b(F,{SkdxTreeSelectContent:()=>s});module.exports=O(F);var d=require("lit"),a=require("lit/decorators.js"),v=require("../internal/define.cjs"),l=require("../internal/dismiss.cjs"),h=require("../internal/positioning.cjs"),g=require("../internal/styles.cjs"),u=require("./TreeSelect.cjs");function L(o,i){if(!o.contains(i))return;let t=o.getBoundingClientRect(),e=i.getBoundingClientRect();o.scrollTop+=e.top-t.top-(t.height-e.height)/2}var s=class extends d.LitElement{constructor(){super(...arguments);this.side="bottom";this.align="start";this.sideOffset=4;this.alignOffset=0;this.avoidCollisions=!0;this.collisionPadding=8;this.root=null;this.onRootUpdate=()=>this.syncHostState();this.preventFocusSteal=t=>{let e=this.root?.inputEl;e&&(t.target===e||t.target===null)||e&&e.contains(t.target)||t.preventDefault()};this.handleDocumentKeyDown=t=>{t.key!=="Escape"||!this.root?.open||(t.preventDefault(),(0,l.dispatchEscapeKeyDown)(this,t)&&(this.root.setOpen(!1),this.root.triggerEl?.focus()))};this.handlePointerDown=t=>{!this.root?.open||this.isInside(t.target)||(0,l.dispatchOutside)(this,"pointer-down-outside",t)&&this.root.setOpen(!1)};this.handleFocusIn=t=>{if(!this.root?.open)return;let e=(0,l.focusOutsideTarget)(t);e===null||this.isInside(e)||(0,l.dispatchOutside)(this,"focus-outside",t)&&this.root.setOpen(!1)}}connectedCallback(){super.connectedCallback(),this.root=(0,u.findTreeSelectRoot)(this),this.root&&(this.root.contentEl=this),this.root?.addEventListener(u.TREE_SELECT_INTERNAL_UPDATE,this.onRootUpdate),this.addEventListener("mousedown",this.preventFocusSteal),this.syncHostState()}disconnectedCallback(){this.root?.removeEventListener(u.TREE_SELECT_INTERNAL_UPDATE,this.onRootUpdate),this.root?.contentEl===this&&(this.root.contentEl=null),this.removeEventListener("mousedown",this.preventFocusSteal),this.deactivate(),super.disconnectedCallback()}syncHostState(){let t=this.root?.open??!1;this.setAttribute("data-state",t?"open":"closed"),this.setAttribute("data-side",this.side??"bottom"),this.setAttribute("data-align",this.align??"start"),this.setAttribute("data-layout",this.root?.effectiveLayout??"tree"),this.root?.multiple?this.setAttribute("data-multiple",""):this.removeAttribute("data-multiple"),this.hidden=!t,t?this.activate():this.deactivate()}activate(){!this.cleanupPosition&&this.root?.triggerEl&&(this.cleanupPosition=(0,h.positionFloating)(this.root.triggerEl,this,{side:this.side,align:this.align,sideOffset:this.sideOffset,alignOffset:this.alignOffset,avoidCollisions:this.avoidCollisions,collisionPadding:this.collisionPadding,collisionBoundary:this.collisionBoundary,component:"tree-select"})),document.addEventListener("keydown",this.handleDocumentKeyDown,!0),document.addEventListener("pointerdown",this.handlePointerDown,!0),document.addEventListener("focusin",this.handleFocusIn,!0),cancelAnimationFrame(this.focusFrame??0),this.focusFrame=requestAnimationFrame(()=>{(0,l.focusOnOpen)(()=>this.root?.inputEl?.focusInput());let t=this.querySelector('[role="treeitem"][data-highlighted]');t&&L(this,t)})}deactivate(){this.cleanupPosition?.(),this.cleanupPosition=void 0,document.removeEventListener("keydown",this.handleDocumentKeyDown,!0),document.removeEventListener("pointerdown",this.handlePointerDown,!0),document.removeEventListener("focusin",this.handleFocusIn,!0),cancelAnimationFrame(this.focusFrame??0),this.focusFrame=void 0}isInside(t){if(!t)return!1;if(this.contains(t))return!0;let e=this.root?.triggerEl;return e!=null&&e.contains(t)}render(){return d.html`<slot></slot>`}};s.styles=[g.hiddenHostStyles,d.css`
+"use strict";var h=Object.defineProperty;var m=Object.getOwnPropertyDescriptor;var g=Object.getOwnPropertyNames;var E=Object.prototype.hasOwnProperty;var L=(o,i)=>{for(var t in i)h(o,t,{get:i[t],enumerable:!0})},b=(o,i,t,e)=>{if(i&&typeof i=="object"||typeof i=="function")for(let n of g(i))!E.call(o,n)&&n!==t&&h(o,n,{get:()=>i[n],enumerable:!(e=m(i,n))||e.enumerable});return o};var P=o=>b(h({},"__esModule",{value:!0}),o),a=(o,i,t,e)=>{for(var n=e>1?void 0:e?m(i,t):i,p=o.length-1,f;p>=0;p--)(f=o[p])&&(n=(e?f(i,t,n):f(n))||n);return e&&n&&h(i,t,n),n};var D={};L(D,{SkdxTreeSelectContent:()=>s});module.exports=P(D);var d=require("lit"),l=require("lit/decorators.js"),v=require("../internal/define.cjs"),r=require("../internal/dismiss.cjs"),c=require("../internal/positioning.cjs"),y=require("../internal/styles.cjs"),u=require("./TreeSelect.cjs");function O(o,i){if(!o.contains(i))return;let t=o.getBoundingClientRect(),e=i.getBoundingClientRect();o.scrollTop+=e.top-t.top-(t.height-e.height)/2}var s=class extends d.LitElement{constructor(){super(...arguments);this.side="bottom";this.align="start";this.sideOffset=4;this.alignOffset=0;this.avoidCollisions=!0;this.collisionPadding=8;this.root=null;this.layer={insideElements:()=>[this,this.root]};this.onRootUpdate=()=>this.syncHostState();this.preventFocusSteal=t=>{let e=this.root?.inputEl;e&&(t.target===e||t.target===null)||e&&e.contains(t.target)||t.preventDefault()};this.handleDocumentKeyDown=t=>{t.key!=="Escape"||!this.root?.open||(t.preventDefault(),(0,r.dispatchEscapeKeyDown)(this,t)&&(this.root.setOpen(!1),this.root.triggerEl?.focus()))};this.handlePointerDown=t=>{!this.root?.open||this.isInside(t.target)||(0,r.dispatchOutside)(this,"pointer-down-outside",t)&&this.root.setOpen(!1)};this.handleFocusIn=t=>{if(!this.root?.open)return;let e=(0,r.focusOutsideTarget)(t);e===null||this.isInside(e)||(0,r.dispatchOutside)(this,"focus-outside",t)&&this.root.setOpen(!1)}}connectedCallback(){super.connectedCallback(),this.root=(0,u.findTreeSelectRoot)(this),this.root&&(this.root.contentEl=this),this.root?.addEventListener(u.TREE_SELECT_INTERNAL_UPDATE,this.onRootUpdate),this.addEventListener("mousedown",this.preventFocusSteal),this.syncHostState()}disconnectedCallback(){this.root?.removeEventListener(u.TREE_SELECT_INTERNAL_UPDATE,this.onRootUpdate),this.root?.contentEl===this&&(this.root.contentEl=null),this.removeEventListener("mousedown",this.preventFocusSteal),this.releaseLayer?.(),this.releaseLayer=void 0,this.deactivate(),super.disconnectedCallback()}syncHostState(){let t=this.root?.open??!1;this.setAttribute("data-state",t?"open":"closed"),this.setAttribute("data-side",this.side??"bottom"),this.setAttribute("data-align",this.align??"start"),this.setAttribute("data-layout",this.root?.effectiveLayout??"tree"),this.root?.multiple?this.setAttribute("data-multiple",""):this.removeAttribute("data-multiple"),this.hidden=!t,t&&!this.releaseLayer?this.releaseLayer=(0,r.pushDismissLayer)(this.layer):!t&&this.releaseLayer&&(this.releaseLayer(),this.releaseLayer=void 0),t?this.activate():this.deactivate()}activate(){!this.cleanupPosition&&this.root?.triggerEl&&(this.cleanupPosition=(0,c.positionFloating)(this.root.triggerEl,this,{side:this.side,align:this.align,sideOffset:this.sideOffset,alignOffset:this.alignOffset,avoidCollisions:this.avoidCollisions,collisionPadding:this.collisionPadding,collisionBoundary:this.collisionBoundary,component:"tree-select"})),document.addEventListener("keydown",this.handleDocumentKeyDown,!0),document.addEventListener("pointerdown",this.handlePointerDown,!0),document.addEventListener("focusin",this.handleFocusIn,!0),cancelAnimationFrame(this.focusFrame??0),this.focusFrame=requestAnimationFrame(()=>{(0,r.focusOnOpen)(()=>this.root?.inputEl?.focusInput());let t=this.querySelector('[role="treeitem"][data-highlighted]');t&&O(this,t)})}deactivate(){this.cleanupPosition?.(),this.cleanupPosition=void 0,document.removeEventListener("keydown",this.handleDocumentKeyDown,!0),document.removeEventListener("pointerdown",this.handlePointerDown,!0),document.removeEventListener("focusin",this.handleFocusIn,!0),cancelAnimationFrame(this.focusFrame??0),this.focusFrame=void 0}isInside(t){if(!t)return!1;if(this.contains(t)||(0,r.nestedLayerContains)(this.layer,t))return!0;let e=this.root?.triggerEl;return e!=null&&e.contains(t)}render(){return d.html`<slot></slot>`}};s.styles=[y.hiddenHostStyles,d.css`
       :host {
         display: block;
       }
-    `],r([(0,a.property)({type:String})],s.prototype,"side",2),r([(0,a.property)({type:String})],s.prototype,"align",2),r([(0,a.property)({type:Number,attribute:"side-offset"})],s.prototype,"sideOffset",2),r([(0,a.property)({type:Number,attribute:"align-offset"})],s.prototype,"alignOffset",2),r([(0,a.property)({converter:h.optOutBoolean,attribute:"avoid-collisions"})],s.prototype,"avoidCollisions",2),r([(0,a.property)({type:Number,attribute:"collision-padding"})],s.prototype,"collisionPadding",2),r([(0,a.property)({attribute:!1})],s.prototype,"collisionBoundary",2),r([(0,a.property)({type:String,reflect:!0,attribute:"data-size"})],s.prototype,"size",2),s=r([(0,v.customElement)("skdx-tree-select-content","tree-select","content")],s);0&&(module.exports={SkdxTreeSelectContent});
+    `],a([(0,l.property)({type:String})],s.prototype,"side",2),a([(0,l.property)({type:String})],s.prototype,"align",2),a([(0,l.property)({type:Number,attribute:"side-offset"})],s.prototype,"sideOffset",2),a([(0,l.property)({type:Number,attribute:"align-offset"})],s.prototype,"alignOffset",2),a([(0,l.property)({converter:c.optOutBoolean,attribute:"avoid-collisions"})],s.prototype,"avoidCollisions",2),a([(0,l.property)({type:Number,attribute:"collision-padding"})],s.prototype,"collisionPadding",2),a([(0,l.property)({attribute:!1})],s.prototype,"collisionBoundary",2),a([(0,l.property)({type:String,reflect:!0,attribute:"data-size"})],s.prototype,"size",2),s=a([(0,v.customElement)("skdx-tree-select-content","tree-select","content")],s);0&&(module.exports={SkdxTreeSelectContent});

package/dist/tree-select/TreeSelectContent.d.cts

@@ -33,6 +33,9 @@ export declare class SkdxTreeSelectContent extends LitElement {
      */
     size?: 'sm' | 'lg' | (string & {}) | undefined;
     private root;
+    /** What counts as inside this layer: the panel and the whole control, since focus stays on the trigger. */
+    private readonly layer;
+    private releaseLayer?;
     private readonly onRootUpdate;
     private cleanupPosition?;
     private focusFrame?;

package/dist/tree-select/TreeSelectContent.d.ts

@@ -33,6 +33,9 @@ export declare class SkdxTreeSelectContent extends LitElement {
      */
     size?: 'sm' | 'lg' | (string & {}) | undefined;
     private root;
+    /** What counts as inside this layer: the panel and the whole control, since focus stays on the trigger. */
+    private readonly layer;
+    private releaseLayer?;
     private readonly onRootUpdate;
     private cleanupPosition?;
     private focusFrame?;

package/dist/tree-select/TreeSelectContent.js

@@ -1,5 +1,5 @@
-var h=Object.defineProperty;var p=Object.getOwnPropertyDescriptor;var o=(r,s,t,e)=>{for(var a=e>1?void 0:e?p(s,t):s,l=r.length-1,d;l>=0;l--)(d=r[l])&&(a=(e?d(s,t,a):d(a))||a);return e&&a&&h(s,t,a),a};import{css as f,html as m,LitElement as v}from"lit";import{property as n}from"lit/decorators.js";import{customElement as g}from"../internal/define.js";import{dispatchEscapeKeyDown as E,dispatchOutside as u,focusOnOpen as y,focusOutsideTarget as b}from"../internal/dismiss.js";import{optOutBoolean as P,positionFloating as O}from"../internal/positioning.js";import{hiddenHostStyles as L}from"../internal/styles.js";import{findTreeSelectRoot as F,TREE_SELECT_INTERNAL_UPDATE as c}from"./TreeSelect.js";function w(r,s){if(!r.contains(s))return;let t=r.getBoundingClientRect(),e=s.getBoundingClientRect();r.scrollTop+=e.top-t.top-(t.height-e.height)/2}var i=class extends v{constructor(){super(...arguments);this.side="bottom";this.align="start";this.sideOffset=4;this.alignOffset=0;this.avoidCollisions=!0;this.collisionPadding=8;this.root=null;this.onRootUpdate=()=>this.syncHostState();this.preventFocusSteal=t=>{let e=this.root?.inputEl;e&&(t.target===e||t.target===null)||e&&e.contains(t.target)||t.preventDefault()};this.handleDocumentKeyDown=t=>{t.key!=="Escape"||!this.root?.open||(t.preventDefault(),E(this,t)&&(this.root.setOpen(!1),this.root.triggerEl?.focus()))};this.handlePointerDown=t=>{!this.root?.open||this.isInside(t.target)||u(this,"pointer-down-outside",t)&&this.root.setOpen(!1)};this.handleFocusIn=t=>{if(!this.root?.open)return;let e=b(t);e===null||this.isInside(e)||u(this,"focus-outside",t)&&this.root.setOpen(!1)}}connectedCallback(){super.connectedCallback(),this.root=F(this),this.root&&(this.root.contentEl=this),this.root?.addEventListener(c,this.onRootUpdate),this.addEventListener("mousedown",this.preventFocusSteal),this.syncHostState()}disconnectedCallback(){this.root?.removeEventListener(c,this.onRootUpdate),this.root?.contentEl===this&&(this.root.contentEl=null),this.removeEventListener("mousedown",this.preventFocusSteal),this.deactivate(),super.disconnectedCallback()}syncHostState(){let t=this.root?.open??!1;this.setAttribute("data-state",t?"open":"closed"),this.setAttribute("data-side",this.side??"bottom"),this.setAttribute("data-align",this.align??"start"),this.setAttribute("data-layout",this.root?.effectiveLayout??"tree"),this.root?.multiple?this.setAttribute("data-multiple",""):this.removeAttribute("data-multiple"),this.hidden=!t,t?this.activate():this.deactivate()}activate(){!this.cleanupPosition&&this.root?.triggerEl&&(this.cleanupPosition=O(this.root.triggerEl,this,{side:this.side,align:this.align,sideOffset:this.sideOffset,alignOffset:this.alignOffset,avoidCollisions:this.avoidCollisions,collisionPadding:this.collisionPadding,collisionBoundary:this.collisionBoundary,component:"tree-select"})),document.addEventListener("keydown",this.handleDocumentKeyDown,!0),document.addEventListener("pointerdown",this.handlePointerDown,!0),document.addEventListener("focusin",this.handleFocusIn,!0),cancelAnimationFrame(this.focusFrame??0),this.focusFrame=requestAnimationFrame(()=>{y(()=>this.root?.inputEl?.focusInput());let t=this.querySelector('[role="treeitem"][data-highlighted]');t&&w(this,t)})}deactivate(){this.cleanupPosition?.(),this.cleanupPosition=void 0,document.removeEventListener("keydown",this.handleDocumentKeyDown,!0),document.removeEventListener("pointerdown",this.handlePointerDown,!0),document.removeEventListener("focusin",this.handleFocusIn,!0),cancelAnimationFrame(this.focusFrame??0),this.focusFrame=void 0}isInside(t){if(!t)return!1;if(this.contains(t))return!0;let e=this.root?.triggerEl;return e!=null&&e.contains(t)}render(){return m`<slot></slot>`}};i.styles=[L,f`
+var c=Object.defineProperty;var p=Object.getOwnPropertyDescriptor;var o=(r,s,t,e)=>{for(var a=e>1?void 0:e?p(s,t):s,l=r.length-1,d;l>=0;l--)(d=r[l])&&(a=(e?d(s,t,a):d(a))||a);return e&&a&&c(s,t,a),a};import{css as f,html as m,LitElement as v}from"lit";import{property as n}from"lit/decorators.js";import{customElement as y}from"../internal/define.js";import{dispatchEscapeKeyDown as g,dispatchOutside as u,focusOnOpen as E,focusOutsideTarget as L,nestedLayerContains as b,pushDismissLayer as P}from"../internal/dismiss.js";import{optOutBoolean as O,positionFloating as D}from"../internal/positioning.js";import{hiddenHostStyles as F}from"../internal/styles.js";import{findTreeSelectRoot as w,TREE_SELECT_INTERNAL_UPDATE as h}from"./TreeSelect.js";function N(r,s){if(!r.contains(s))return;let t=r.getBoundingClientRect(),e=s.getBoundingClientRect();r.scrollTop+=e.top-t.top-(t.height-e.height)/2}var i=class extends v{constructor(){super(...arguments);this.side="bottom";this.align="start";this.sideOffset=4;this.alignOffset=0;this.avoidCollisions=!0;this.collisionPadding=8;this.root=null;this.layer={insideElements:()=>[this,this.root]};this.onRootUpdate=()=>this.syncHostState();this.preventFocusSteal=t=>{let e=this.root?.inputEl;e&&(t.target===e||t.target===null)||e&&e.contains(t.target)||t.preventDefault()};this.handleDocumentKeyDown=t=>{t.key!=="Escape"||!this.root?.open||(t.preventDefault(),g(this,t)&&(this.root.setOpen(!1),this.root.triggerEl?.focus()))};this.handlePointerDown=t=>{!this.root?.open||this.isInside(t.target)||u(this,"pointer-down-outside",t)&&this.root.setOpen(!1)};this.handleFocusIn=t=>{if(!this.root?.open)return;let e=L(t);e===null||this.isInside(e)||u(this,"focus-outside",t)&&this.root.setOpen(!1)}}connectedCallback(){super.connectedCallback(),this.root=w(this),this.root&&(this.root.contentEl=this),this.root?.addEventListener(h,this.onRootUpdate),this.addEventListener("mousedown",this.preventFocusSteal),this.syncHostState()}disconnectedCallback(){this.root?.removeEventListener(h,this.onRootUpdate),this.root?.contentEl===this&&(this.root.contentEl=null),this.removeEventListener("mousedown",this.preventFocusSteal),this.releaseLayer?.(),this.releaseLayer=void 0,this.deactivate(),super.disconnectedCallback()}syncHostState(){let t=this.root?.open??!1;this.setAttribute("data-state",t?"open":"closed"),this.setAttribute("data-side",this.side??"bottom"),this.setAttribute("data-align",this.align??"start"),this.setAttribute("data-layout",this.root?.effectiveLayout??"tree"),this.root?.multiple?this.setAttribute("data-multiple",""):this.removeAttribute("data-multiple"),this.hidden=!t,t&&!this.releaseLayer?this.releaseLayer=P(this.layer):!t&&this.releaseLayer&&(this.releaseLayer(),this.releaseLayer=void 0),t?this.activate():this.deactivate()}activate(){!this.cleanupPosition&&this.root?.triggerEl&&(this.cleanupPosition=D(this.root.triggerEl,this,{side:this.side,align:this.align,sideOffset:this.sideOffset,alignOffset:this.alignOffset,avoidCollisions:this.avoidCollisions,collisionPadding:this.collisionPadding,collisionBoundary:this.collisionBoundary,component:"tree-select"})),document.addEventListener("keydown",this.handleDocumentKeyDown,!0),document.addEventListener("pointerdown",this.handlePointerDown,!0),document.addEventListener("focusin",this.handleFocusIn,!0),cancelAnimationFrame(this.focusFrame??0),this.focusFrame=requestAnimationFrame(()=>{E(()=>this.root?.inputEl?.focusInput());let t=this.querySelector('[role="treeitem"][data-highlighted]');t&&N(this,t)})}deactivate(){this.cleanupPosition?.(),this.cleanupPosition=void 0,document.removeEventListener("keydown",this.handleDocumentKeyDown,!0),document.removeEventListener("pointerdown",this.handlePointerDown,!0),document.removeEventListener("focusin",this.handleFocusIn,!0),cancelAnimationFrame(this.focusFrame??0),this.focusFrame=void 0}isInside(t){if(!t)return!1;if(this.contains(t)||b(this.layer,t))return!0;let e=this.root?.triggerEl;return e!=null&&e.contains(t)}render(){return m`<slot></slot>`}};i.styles=[F,f`
       :host {
         display: block;
       }
-    `],o([n({type:String})],i.prototype,"side",2),o([n({type:String})],i.prototype,"align",2),o([n({type:Number,attribute:"side-offset"})],i.prototype,"sideOffset",2),o([n({type:Number,attribute:"align-offset"})],i.prototype,"alignOffset",2),o([n({converter:P,attribute:"avoid-collisions"})],i.prototype,"avoidCollisions",2),o([n({type:Number,attribute:"collision-padding"})],i.prototype,"collisionPadding",2),o([n({attribute:!1})],i.prototype,"collisionBoundary",2),o([n({type:String,reflect:!0,attribute:"data-size"})],i.prototype,"size",2),i=o([g("skdx-tree-select-content","tree-select","content")],i);export{i as SkdxTreeSelectContent};
+    `],o([n({type:String})],i.prototype,"side",2),o([n({type:String})],i.prototype,"align",2),o([n({type:Number,attribute:"side-offset"})],i.prototype,"sideOffset",2),o([n({type:Number,attribute:"align-offset"})],i.prototype,"alignOffset",2),o([n({converter:O,attribute:"avoid-collisions"})],i.prototype,"avoidCollisions",2),o([n({type:Number,attribute:"collision-padding"})],i.prototype,"collisionPadding",2),o([n({attribute:!1})],i.prototype,"collisionBoundary",2),o([n({type:String,reflect:!0,attribute:"data-size"})],i.prototype,"size",2),i=o([y("skdx-tree-select-content","tree-select","content")],i);export{i as SkdxTreeSelectContent};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@skdx/web-components",
-  "version": "0.30.0",
+  "version": "0.32.0",
   "description": "Standards-based custom elements for the SkandaDX design system — no React (or any framework) required",
   "license": "MIT",
   "publishConfig": {
@@ -94,6 +94,16 @@
         "default": "./dist/avatar/index.cjs"
       }
     },
+    "./backdrop": {
+      "import": {
+        "types": "./dist/backdrop/index.d.ts",
+        "default": "./dist/backdrop/index.js"
+      },
+      "require": {
+        "types": "./dist/backdrop/index.d.cts",
+        "default": "./dist/backdrop/index.cjs"
+      }
+    },
     "./badge": {
       "import": {
         "types": "./dist/badge/index.d.ts",
@@ -184,6 +194,16 @@
         "default": "./dist/checkbox-group/index.cjs"
       }
     },
+    "./chip": {
+      "import": {
+        "types": "./dist/chip/index.d.ts",
+        "default": "./dist/chip/index.js"
+      },
+      "require": {
+        "types": "./dist/chip/index.d.cts",
+        "default": "./dist/chip/index.cjs"
+      }
+    },
     "./clipboard": {
       "import": {
         "types": "./dist/clipboard/index.d.ts",
@@ -234,6 +254,16 @@
         "default": "./dist/command/index.cjs"
       }
     },
+    "./csv": {
+      "import": {
+        "types": "./dist/internal/csv.d.ts",
+        "default": "./dist/internal/csv.js"
+      },
+      "require": {
+        "types": "./dist/internal/csv.d.cts",
+        "default": "./dist/internal/csv.cjs"
+      }
+    },
     "./date-field": {
       "import": {
         "types": "./dist/date-field/index.d.ts",
@@ -254,6 +284,26 @@
         "default": "./dist/date-picker/index.cjs"
       }
     },
+    "./date-range-picker": {
+      "import": {
+        "types": "./dist/date-range-picker/index.d.ts",
+        "default": "./dist/date-range-picker/index.js"
+      },
+      "require": {
+        "types": "./dist/date-range-picker/index.d.cts",
+        "default": "./dist/date-range-picker/index.cjs"
+      }
+    },
+    "./date-time-picker": {
+      "import": {
+        "types": "./dist/date-time-picker/index.d.ts",
+        "default": "./dist/date-time-picker/index.js"
+      },
+      "require": {
+        "types": "./dist/date-time-picker/index.d.cts",
+        "default": "./dist/date-time-picker/index.cjs"
+      }
+    },
     "./dialog": {
       "import": {
         "types": "./dist/dialog/index.d.ts",
@@ -274,6 +324,36 @@
         "default": "./dist/drawer/index.cjs"
       }
     },
+    "./fab": {
+      "import": {
+        "types": "./dist/fab/index.d.ts",
+        "default": "./dist/fab/index.js"
+      },
+      "require": {
+        "types": "./dist/fab/index.d.cts",
+        "default": "./dist/fab/index.cjs"
+      }
+    },
+    "./gauge": {
+      "import": {
+        "types": "./dist/gauge/index.d.ts",
+        "default": "./dist/gauge/index.js"
+      },
+      "require": {
+        "types": "./dist/gauge/index.d.cts",
+        "default": "./dist/gauge/index.cjs"
+      }
+    },
+    "./grid": {
+      "import": {
+        "types": "./dist/grid/index.d.ts",
+        "default": "./dist/grid/index.js"
+      },
+      "require": {
+        "types": "./dist/grid/index.d.cts",
+        "default": "./dist/grid/index.cjs"
+      }
+    },
     "./menu": {
       "import": {
         "types": "./dist/menu/index.d.ts",
@@ -384,6 +464,16 @@
         "default": "./dist/utils/live-announcer.cjs"
       }
     },
+    "./media-query": {
+      "import": {
+        "types": "./dist/internal/media-query.d.ts",
+        "default": "./dist/internal/media-query.js"
+      },
+      "require": {
+        "types": "./dist/internal/media-query.d.cts",
+        "default": "./dist/internal/media-query.cjs"
+      }
+    },
     "./loading-overlay": {
       "import": {
         "types": "./dist/loading-overlay/index.d.ts",
@@ -445,6 +535,16 @@
         "default": "./dist/pagination/index.cjs"
       }
     },
+    "./paper": {
+      "import": {
+        "types": "./dist/paper/index.d.ts",
+        "default": "./dist/paper/index.js"
+      },
+      "require": {
+        "types": "./dist/paper/index.d.cts",
+        "default": "./dist/paper/index.cjs"
+      }
+    },
     "./password-input": {
       "import": {
         "types": "./dist/password-input/index.d.ts",
@@ -1295,6 +1395,16 @@
         "default": "./dist/split-button/index.cjs"
       }
     },
+    "./stack": {
+      "import": {
+        "types": "./dist/stack/index.d.ts",
+        "default": "./dist/stack/index.js"
+      },
+      "require": {
+        "types": "./dist/stack/index.d.cts",
+        "default": "./dist/stack/index.cjs"
+      }
+    },
     "./stepper": {
       "import": {
         "types": "./dist/stepper/index.d.ts",
@@ -1455,6 +1565,16 @@
         "default": "./dist/toolbar/index.cjs"
       }
     },
+    "./tooltip": {
+      "import": {
+        "types": "./dist/tooltip/index.d.ts",
+        "default": "./dist/tooltip/index.js"
+      },
+      "require": {
+        "types": "./dist/tooltip/index.d.cts",
+        "default": "./dist/tooltip/index.cjs"
+      }
+    },
     "./tour": {
       "import": {
         "types": "./dist/tour/index.d.ts",
@@ -1884,6 +2004,8 @@
     "./dist/dialog/DialogTitle.js",
     "./dist/dialog/DialogTrigger.cjs",
     "./dist/dialog/DialogTrigger.js",
+    "./dist/dialog/Dialogs.cjs",
+    "./dist/dialog/Dialogs.js",
     "./dist/dialog/index.cjs",
     "./dist/dialog/index.js",
     "./dist/dialog/primitives.cjs",
@@ -2466,6 +2588,8 @@
     "./dist/table/TableCaption.js",
     "./dist/table/TableCell.cjs",
     "./dist/table/TableCell.js",
+    "./dist/table/TableColumnHeaderFilterInput.cjs",
+    "./dist/table/TableColumnHeaderFilterInput.js",
     "./dist/table/TableColumnHeaderSortTrigger.cjs",
     "./dist/table/TableColumnHeaderSortTrigger.js",
     "./dist/table/TableColumnResizeTrigger.cjs",
@@ -2739,7 +2863,7 @@
     "tsup": "^8.5.1",
     "typescript": "^6.0.3",
     "vitest": "^4.1.10",
-    "@skdx/shared": "0.30.0"
+    "@skdx/shared": "0.32.0"
   },
   "scripts": {
     "lint": "eslint . --cache --cache-location node_modules/.cache/eslint/",