@ixfx/components 0.15.1 → 0.15.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/bundle/index.d.ts CHANGED
@@ -8075,6 +8075,11 @@ declare class PanelElement extends LitElement {
8075
8075
  hideTitlebar: boolean;
8076
8076
  /** Keep the toolbar visible even when the panel is collapsed. */
8077
8077
  keepToolbar: boolean;
8078
+ /**
8079
+ * Keep the titlebar pinned to the edge of the nearest scrolling ancestor while this panel
8080
+ * is in view (top for horizontal titlebars, left for vertical). Normally set by `ixfx-panel-group`.
8081
+ */
8082
+ stickyHeader: boolean;
8078
8083
  private _onTitlebarToggle;
8079
8084
  private _onCloseClick;
8080
8085
  protected render(): import("lit").TemplateResult<1>;
@@ -10497,6 +10502,11 @@ declare class PanelGroupElement extends LitElement {
10497
10502
  collapsible: boolean;
10498
10503
  accordion: boolean;
10499
10504
  allowReorder: boolean;
10505
+ /**
10506
+ * Pin each panel's titlebar to the top (or left, for vertical titlebars) of the scroll area
10507
+ * while its content is in view. On by default; set `sticky-headers="false"` to disable.
10508
+ */
10509
+ stickyHeaders: boolean;
10500
10510
  /** Explicit gap between panels. When unset, `--group-gap` (falling back to `--space-l`) controls the gap. */
10501
10511
  gap?: string;
10502
10512
  private _panels;
package/bundle/index.js CHANGED
@@ -1703,7 +1703,6 @@ const Me={216:`O`,223:`s`,248:`o`,273:`d`,295:`h`,305:`i`,320:`l`,322:`l`,359:`t
1703
1703
 
1704
1704
  .title-text {
1705
1705
  flex: 1;
1706
- padding-left: 1ch;
1707
1706
  font-family: var(--font-family);
1708
1707
  font-size: var(--text-m);
1709
1708
  font-weight: var(--font-weight-bold, 600);
@@ -1721,7 +1720,6 @@ const Me={216:`O`,223:`s`,248:`o`,273:`d`,295:`h`,305:`i`,320:`l`,322:`l`,359:`t
1721
1720
 
1722
1721
  :host([orientation="vertical"]) .title-text {
1723
1722
  writing-mode: vertical-rl;
1724
- padding-left: 0;
1725
1723
  padding-bottom: 1ch;
1726
1724
  text-orientation: mixed;
1727
1725
  transform: rotate(180deg);
@@ -7931,7 +7929,7 @@ ixfx-form-options[orientation="vertical"] ixfx-form-part > label {
7931
7929
  </div>
7932
7930
  ${h?this.#Ee(m,b,c):``}
7933
7931
  </div>
7934
- `}#Ne;#Pe;#Fe(e){this.#v||this.tickled.handlePointerEnter(e)}#Ie(){!this.disableScrollHoverTickle||this.#v||(this.#v=!0,this.toggleAttribute(`data-scroll-hover-suppress`,!0))}#Le(){this.#v&&(this.#v=!1,this.toggleAttribute(`data-scroll-hover-suppress`,!1))}#Re;#ze;#Be(){this.#i!==0&&(cancelAnimationFrame(this.#i),this.#i=0)}#Ve(){this.#a!==0&&(clearTimeout(this.#a),this.#a=0)}#He(){!this.snapToItem||this.orientation!==`row`&&this.orientation!==`column`||(this.#Ve(),this.#a=window.setTimeout(()=>{this.#a=0,this.#Ue()},120))}#Ue(){let e=this.#e.value;if(!e)return;let n=this.#de(),r=n.horizontal,i=r?e.scrollLeft:e.scrollTop,a=r?this._viewportWidth:this._viewportHeight,o=Math.max(0,n.totalExtent-a),s=Math.min(o,Math.max(0,n.snapTarget(i)));Math.abs(s-i)<.5||e.scrollTo(r?{left:s,behavior:`smooth`}:{top:s,behavior:`smooth`})}#We(e,n){this.#A.isDragging||this.#C||this.#E.isDragging||this.#T!==0||(this.selection.handleClick(n,e),this.#_e(`list-item-click`,n))}#Ge(e){let n=this.interactionMode;if(n!==`manual`&&(this.selectionMode!==`none`||n===`checked`||n===`sticky`)&&!(this.#A.isDragging||this.#C||this.#E.isDragging||this.#T!==0)){for(let n of e.composedPath())if(n instanceof Element&&(n.classList.contains(`cell`)||n.classList.contains(`group-header`)))return;this.selection.clear()}}#Ke(){this.#T&&clearTimeout(this.#T),this.#T=window.setTimeout(()=>{this.#T=0},0)}#qe(){this.#C=!1,this.#w=void 0,this.toggleAttribute(`data-native-dragging`,!1),this.removeAttribute(`aria-label`)}#Je(e){this.interactionMode!==`manual`&&this.selection.replace(e),this.#_e(`list-activate`,e)}};T([d({type:String,attribute:`selection-mode`})],K.prototype,`selectionMode`,void 0),T([d({type:String,attribute:`interaction-mode`})],K.prototype,`interactionMode`,void 0),T([d({type:Boolean,attribute:`disable-hover-tickle`,reflect:!0})],K.prototype,`disableHoverTickle`,void 0),T([d({type:Boolean,attribute:`disable-scroll-hover-tickle`,reflect:!0})],K.prototype,`disableScrollHoverTickle`,void 0),T([d({type:Number,attribute:`item-size`})],K.prototype,`itemSize`,void 0),T([d({type:Number})],K.prototype,`gap`,void 0),T([d({type:String,reflect:!0})],K.prototype,`orientation`,void 0),T([d({type:String,attribute:`caption-style`,reflect:!0})],K.prototype,`captionStyle`,void 0),T([d({type:String,attribute:`caption-align`,reflect:!0})],K.prototype,`captionAlign`,void 0),T([d({type:String,attribute:`caption-position`,reflect:!0})],K.prototype,`captionPosition`,void 0),T([d({type:String,attribute:`caption-backdrop`,reflect:!0})],K.prototype,`captionBackdrop`,void 0),T([d({type:Number,attribute:`caption-height`})],K.prototype,`captionHeight`,void 0),T([d({type:String,attribute:`item-wrap`})],K.prototype,`itemWrap`,void 0),T([d({attribute:!1})],K.prototype,`filterPredicate`,void 0),T([d({attribute:!1})],K.prototype,`itemFilterPredicate`,void 0),T([d({type:Boolean,attribute:`items-draggable`,reflect:!0})],K.prototype,`itemsDraggable`,void 0),T([d({type:Boolean,attribute:`marquee-from-cell-blank`,reflect:!0})],K.prototype,`marqueeFromCellBlank`,void 0),T([d({attribute:!1})],K.prototype,`dragPreviewRenderer`,void 0),T([d({attribute:!1})],K.prototype,`dragPreviewSource`,void 0),T([d({type:String,attribute:`search-modes`,reflect:!0})],K.prototype,`searchModes`,void 0),T([d({type:Boolean,attribute:`snap-to-item`,reflect:!0})],K.prototype,`snapToItem`,void 0),T([d({attribute:!1})],K.prototype,`items`,void 0),T([d({attribute:!1})],K.prototype,`itemAdapter`,void 0),T([d({attribute:`group-by`})],K.prototype,`groupBy`,void 0),T([d({attribute:!1})],K.prototype,`groupLabel`,void 0),T([d({type:Boolean,attribute:`cross-group-selection`,reflect:!0})],K.prototype,`crossGroupSelection`,void 0),T([d({type:Number,attribute:`group-header-height`})],K.prototype,`groupHeaderHeight`,void 0),T([d({type:Number,attribute:`group-header-width`})],K.prototype,`groupHeaderWidth`,void 0),T([m()],K.prototype,`_collapsedGroups`,void 0),T([m()],K.prototype,`_scrollTop`,void 0),T([m()],K.prototype,`_scrollLeft`,void 0),T([m()],K.prototype,`_viewportHeight`,void 0),T([m()],K.prototype,`_viewportWidth`,void 0),K=T([w(`ixfx-grid-list`)],K);let Eb=class extends n{constructor(...e){super(...e),this.collapsed=!1,this.orientation=`horizontal`,this.closable=!1,this.collapsible=!0,this.title=``,this.iconName=``,this.toggleInteraction=`implicit`,this.variant=`titlebar`,this.hideTitlebar=!1,this.keepToolbar=!1}_onTitlebarToggle(e){e.stopPropagation(),this.collapsed=e.detail.collapsed,this.dispatchEvent(new CustomEvent(`toggle`,{detail:{collapsed:this.collapsed},bubbles:!0,composed:!0}))}_onCloseClick(e){e.stopPropagation(),this.dispatchEvent(new CustomEvent(`close`,{bubbles:!0,composed:!0})),this.remove()}render(){let e=this.keepToolbar||!this.collapsed;return i`
7932
+ `}#Ne;#Pe;#Fe(e){this.#v||this.tickled.handlePointerEnter(e)}#Ie(){!this.disableScrollHoverTickle||this.#v||(this.#v=!0,this.toggleAttribute(`data-scroll-hover-suppress`,!0))}#Le(){this.#v&&(this.#v=!1,this.toggleAttribute(`data-scroll-hover-suppress`,!1))}#Re;#ze;#Be(){this.#i!==0&&(cancelAnimationFrame(this.#i),this.#i=0)}#Ve(){this.#a!==0&&(clearTimeout(this.#a),this.#a=0)}#He(){!this.snapToItem||this.orientation!==`row`&&this.orientation!==`column`||(this.#Ve(),this.#a=window.setTimeout(()=>{this.#a=0,this.#Ue()},120))}#Ue(){let e=this.#e.value;if(!e)return;let n=this.#de(),r=n.horizontal,i=r?e.scrollLeft:e.scrollTop,a=r?this._viewportWidth:this._viewportHeight,o=Math.max(0,n.totalExtent-a),s=Math.min(o,Math.max(0,n.snapTarget(i)));Math.abs(s-i)<.5||e.scrollTo(r?{left:s,behavior:`smooth`}:{top:s,behavior:`smooth`})}#We(e,n){this.#A.isDragging||this.#C||this.#E.isDragging||this.#T!==0||(this.selection.handleClick(n,e),this.#_e(`list-item-click`,n))}#Ge(e){let n=this.interactionMode;if(n!==`manual`&&(this.selectionMode!==`none`||n===`checked`||n===`sticky`)&&!(this.#A.isDragging||this.#C||this.#E.isDragging||this.#T!==0)){for(let n of e.composedPath())if(n instanceof Element&&(n.classList.contains(`cell`)||n.classList.contains(`group-header`)))return;this.selection.clear()}}#Ke(){this.#T&&clearTimeout(this.#T),this.#T=window.setTimeout(()=>{this.#T=0},0)}#qe(){this.#C=!1,this.#w=void 0,this.toggleAttribute(`data-native-dragging`,!1),this.removeAttribute(`aria-label`)}#Je(e){this.interactionMode!==`manual`&&this.selection.replace(e),this.#_e(`list-activate`,e)}};T([d({type:String,attribute:`selection-mode`})],K.prototype,`selectionMode`,void 0),T([d({type:String,attribute:`interaction-mode`})],K.prototype,`interactionMode`,void 0),T([d({type:Boolean,attribute:`disable-hover-tickle`,reflect:!0})],K.prototype,`disableHoverTickle`,void 0),T([d({type:Boolean,attribute:`disable-scroll-hover-tickle`,reflect:!0})],K.prototype,`disableScrollHoverTickle`,void 0),T([d({type:Number,attribute:`item-size`})],K.prototype,`itemSize`,void 0),T([d({type:Number})],K.prototype,`gap`,void 0),T([d({type:String,reflect:!0})],K.prototype,`orientation`,void 0),T([d({type:String,attribute:`caption-style`,reflect:!0})],K.prototype,`captionStyle`,void 0),T([d({type:String,attribute:`caption-align`,reflect:!0})],K.prototype,`captionAlign`,void 0),T([d({type:String,attribute:`caption-position`,reflect:!0})],K.prototype,`captionPosition`,void 0),T([d({type:String,attribute:`caption-backdrop`,reflect:!0})],K.prototype,`captionBackdrop`,void 0),T([d({type:Number,attribute:`caption-height`})],K.prototype,`captionHeight`,void 0),T([d({type:String,attribute:`item-wrap`})],K.prototype,`itemWrap`,void 0),T([d({attribute:!1})],K.prototype,`filterPredicate`,void 0),T([d({attribute:!1})],K.prototype,`itemFilterPredicate`,void 0),T([d({type:Boolean,attribute:`items-draggable`,reflect:!0})],K.prototype,`itemsDraggable`,void 0),T([d({type:Boolean,attribute:`marquee-from-cell-blank`,reflect:!0})],K.prototype,`marqueeFromCellBlank`,void 0),T([d({attribute:!1})],K.prototype,`dragPreviewRenderer`,void 0),T([d({attribute:!1})],K.prototype,`dragPreviewSource`,void 0),T([d({type:String,attribute:`search-modes`,reflect:!0})],K.prototype,`searchModes`,void 0),T([d({type:Boolean,attribute:`snap-to-item`,reflect:!0})],K.prototype,`snapToItem`,void 0),T([d({attribute:!1})],K.prototype,`items`,void 0),T([d({attribute:!1})],K.prototype,`itemAdapter`,void 0),T([d({attribute:`group-by`})],K.prototype,`groupBy`,void 0),T([d({attribute:!1})],K.prototype,`groupLabel`,void 0),T([d({type:Boolean,attribute:`cross-group-selection`,reflect:!0})],K.prototype,`crossGroupSelection`,void 0),T([d({type:Number,attribute:`group-header-height`})],K.prototype,`groupHeaderHeight`,void 0),T([d({type:Number,attribute:`group-header-width`})],K.prototype,`groupHeaderWidth`,void 0),T([m()],K.prototype,`_collapsedGroups`,void 0),T([m()],K.prototype,`_scrollTop`,void 0),T([m()],K.prototype,`_scrollLeft`,void 0),T([m()],K.prototype,`_viewportHeight`,void 0),T([m()],K.prototype,`_viewportWidth`,void 0),K=T([w(`ixfx-grid-list`)],K);let Eb=class extends n{constructor(...e){super(...e),this.collapsed=!1,this.orientation=`horizontal`,this.closable=!1,this.collapsible=!0,this.title=``,this.iconName=``,this.toggleInteraction=`implicit`,this.variant=`titlebar`,this.hideTitlebar=!1,this.keepToolbar=!1,this.stickyHeader=!1}_onTitlebarToggle(e){e.stopPropagation(),this.collapsed=e.detail.collapsed,this.dispatchEvent(new CustomEvent(`toggle`,{detail:{collapsed:this.collapsed},bubbles:!0,composed:!0}))}_onCloseClick(e){e.stopPropagation(),this.dispatchEvent(new CustomEvent(`close`,{bubbles:!0,composed:!0})),this.remove()}render(){let e=this.keepToolbar||!this.collapsed;return i`
7935
7933
  ${this.hideTitlebar?a:i`
7936
7934
  <ixfx-titlebar
7937
7935
  .title=${this.title}
@@ -7976,6 +7974,23 @@ ixfx-form-options[orientation="vertical"] ixfx-form-part > label {
7976
7974
  flex-shrink: 0;
7977
7975
  }
7978
7976
 
7977
+ /* \`overflow: clip\` (unlike \`hidden\`) does not create a scroll container, so the
7978
+ titlebar can stick to the outer scroll area. Sticking is bounded by the panel itself. */
7979
+ :host([sticky-header]) {
7980
+ overflow: clip;
7981
+ }
7982
+
7983
+ :host([sticky-header]) ixfx-titlebar {
7984
+ position: sticky;
7985
+ top: 0;
7986
+ z-index: 2;
7987
+ }
7988
+
7989
+ :host([sticky-header][orientation="vertical"]) ixfx-titlebar {
7990
+ top: auto;
7991
+ left: 0;
7992
+ }
7993
+
7979
7994
  .content-wrapper {
7980
7995
  interpolate-size: allow-keywords;
7981
7996
  overflow: hidden;
@@ -7999,7 +8014,8 @@ ixfx-form-options[orientation="vertical"] ixfx-form-part > label {
7999
8014
  }
8000
8015
 
8001
8016
  .content-inner {
8002
- box-shadow: var(--deboss-3);
8017
+ box-shadow: var(--panel-content-shadow, var(--deboss-3));
8018
+ border: var(--panel-content-border, none);
8003
8019
  min-height: 0;
8004
8020
  min-width: 0;
8005
8021
  overflow: hidden;
@@ -8066,7 +8082,7 @@ ixfx-form-options[orientation="vertical"] ixfx-form-part > label {
8066
8082
  height: 100%;
8067
8083
  transform: none;
8068
8084
  }
8069
- `]}};T([d({type:Boolean,reflect:!0})],Eb.prototype,`collapsed`,void 0),T([d({type:String,attribute:`orientation`,reflect:!0})],Eb.prototype,`orientation`,void 0),T([d({type:Boolean})],Eb.prototype,`closable`,void 0),T([d({type:Boolean,reflect:!0})],Eb.prototype,`collapsible`,void 0),T([d({type:String})],Eb.prototype,`title`,void 0),T([d({type:String,attribute:`icon-name`})],Eb.prototype,`iconName`,void 0),T([d({type:String,attribute:`toggle-interaction`})],Eb.prototype,`toggleInteraction`,void 0),T([d({type:String,attribute:`variant`,reflect:!0})],Eb.prototype,`variant`,void 0),T([d({type:Boolean,attribute:`hide-titlebar`})],Eb.prototype,`hideTitlebar`,void 0),T([d({type:Boolean,attribute:`keep-toolbar`})],Eb.prototype,`keepToolbar`,void 0),Eb=T([w(`ixfx-panel`)],Eb);const Db=`__ungrouped__`;let Ob=class extends n{constructor(...e){super(...e),this.grouped=!1,this.crossGroupSelection=!1,this.#n=new Map,this.#i=!1,this.#a=new je(this),this.#d=e=>{if(this.#i)return;let n=e.target,r;for(let[e,i]of this.#n)if(i===n){r=e;break}if(r!==void 0){if(this.grouped&&!this.crossGroupSelection){this.#i=!0;for(let[e,n]of this.#n)e!==r&&n.clearSelection();this.#i=!1}this.dispatchEvent(new CustomEvent(`grouped-select`,{detail:{selected:this.selectedItems,groupKey:r===Db?void 0:r},bubbles:!0,composed:!0}))}}}#e;#t;#n;#r;#i;#a;get groupBy(){return this.#e}set groupBy(e){this.#e=e,this.requestUpdate()}get factory(){return this.#t}set factory(e){e!==this.#t&&(this.#s(),this.#t=e,this.requestUpdate())}get provider(){return this.#a.provider}set provider(e){this.#a.provider=e,e&&this.#a.request(void 0)}get selectedItems(){let e=new Set;for(let n of this.#n.values())for(let r of n.selectedItems)e.add(r);return e}dispatch(e,n){for(let r of this.#n.values())r.dispatch(e,n)}createRenderRoot(){return this}connectedCallback(){super.connectedCallback(),this.addEventListener(`select`,this.#d)}disconnectedCallback(){super.disconnectedCallback(),this.removeEventListener(`select`,this.#d)}updated(e){super.updated(e),e.has(`grouped`)&&this.#s(),this.#c()}render(){return this.#t?this.grouped?this.#e?(this.#r=this.#o(),i`${_(this.#r.keys(),e=>e,e=>i`<ixfx-panel data-group-key=${e} .title=${e}></ixfx-panel>`)}`):a:i`<div class="ungrouped-host"></div>`:a}#o(){let e=new Map;if(!this.#e)return e;for(let n of this.#a.items){let r=this.#e(n),i=e.get(r);i||(i=[],e.set(r,i)),i.push(n)}return e}#s(){for(let e of this.#n.values())e.remove();this.#n.clear()}#c(){if(this.#t){if(!this.grouped){this.#l();return}this.#e&&this.#u()}}#l(){let e=this.querySelector(`.ungrouped-host`);if(!e)return;let n=this.#n.get(Db);n||(n=this.#t(void 0),e.appendChild(n),this.#n.set(Db,n)),n.setItems(this.#a.items)}#u(){let e=this.#r??this.#o();for(let n of[...this.#n.keys()])e.has(n)||(this.#n.get(n)?.remove(),this.#n.delete(n));for(let[n,r]of e){let e=[...this.children].find(e=>e instanceof HTMLElement&&e.dataset.groupKey===n);if(!e)continue;let i=this.#n.get(n);i||(i=this.#t(n),e.appendChild(i),this.#n.set(n,i)),i.setItems(r)}}#d};T([d({type:Boolean,reflect:!0})],Ob.prototype,`grouped`,void 0),T([d({type:Boolean,attribute:`cross-group-selection`,reflect:!0})],Ob.prototype,`crossGroupSelection`,void 0),Ob=T([w(`ixfx-grouped-item-lister`)],Ob);const kb=`application/x-ixfx-tree`,Ab=new Map,jb=new Map;let Mb,Nb=0;function Pb(){return`tree-drag-${++Nb}-${Date.now()}`}function Fb(e,n,r,i){Ab.set(e,{sourceId:e,nodes:r,keys:i}),jb.set(e,new WeakRef(n)),Mb=e}function Ib(e){Ab.delete(e),jb.delete(e),Mb===e&&(Mb=void 0)}function Lb(){if(Mb===void 0)return;let e=Ab.get(Mb);if(e)return{sourceId:Mb,keys:e.keys,nodes:e.nodes,element:jb.get(Mb)?.deref()}}const Rb={direction:0,depth:0};function zb(e){return Math.min(e/2,Math.max(24,Math.min(64,e*.2)))}function Bb(e,n){if(n<=0)return Rb;let r=zb(n);return e<r?{direction:-1,depth:Math.min(1,(r-e)/r)}:e>n-r?{direction:1,depth:Math.min(1,(e-(n-r))/r)}:Rb}function Vb(e,n){let r=Math.min(1,Math.max(0,n)/2500);return(120+3080*r*r)*(.35+.65*Math.min(1,Math.max(0,e)))}function Hb(e,n,r){return Math.max(n,Math.min(r,e))}var Ub=class{#e;#t;#n=!1;#r;#i=`internal`;#a=[];#o=[];#s;#c;#l=0;#u=0;#d=0;#f=0;#p=0;#m=0;#h=0;#g;#_=!1;#v;constructor(e,n){this.#e=e,this.#t=n,e.addController(this)}get isDragging(){return this.#n}get isRejected(){return this.#n&&this.#r===void 0}get dropState(){return this.#r}hostConnected(){this.#y()}hostUpdated(){this.#y()}#y(){let e=this.#t.getScrollContainer();!e||e===this.#v||(this.#b(),this.#v=e,e.addEventListener(`dragenter`,this.#x),e.addEventListener(`dragover`,this.#S),e.addEventListener(`dragleave`,this.#w),e.addEventListener(`drop`,this.#T))}#b(){let e=this.#v;e&&(e.removeEventListener(`dragenter`,this.#x),e.removeEventListener(`dragover`,this.#S),e.removeEventListener(`dragleave`,this.#w),e.removeEventListener(`drop`,this.#T),this.#v=void 0)}hostDisconnected(){this.#b(),this.#A(),this.#N(),this.#n=!1,this.#r=void 0}#x=e=>{this.#t.getDndMode()===`none`||!e.dataTransfer||this.#t.resolveDrag(e.dataTransfer,`hover`)!==void 0&&(e.preventDefault(),this.#n||(this.#n=!0,this.#t.onActiveChange(!0)))};#S=e=>{if(this.#t.getDndMode()===`none`||!e.dataTransfer)return;this.#u=e.clientX,this.#d=e.clientY,this.#g=e;let n=this.#t.resolveDrag(e.dataTransfer,`hover`);if(!n){this.#C(e);return}this.#n||(this.#n=!0,this.#t.onActiveChange(!0)),this.#i=n.source,this.#a=n.keys,this.#o=n.nodes;let r=this.#t.getVisibleRows();this.#k(this.#D(r,e.clientY)),this.#j();let i=this.#O(e,r,n.source);if(!i){this.#C(e,!1);return}let a={source:n.source,dragged:n.nodes.length>0?n.nodes:void 0,draggedKeys:n.keys,target:i,dataTransfer:e.dataTransfer};if(!this.#t.vet(a)){this.#C(e,!1);return}e.preventDefault(),e.dataTransfer.dropEffect=n.source===`internal`?`move`:`copy`,this.#P(i)};#C(e,n=!0){e.dataTransfer&&(e.dataTransfer.dropEffect=`none`),this.#P(void 0),n&&this.#A()}#w=e=>{let n=this.#t.getScrollContainer(),r=e.relatedTarget;n&&r&&n.contains(r)||this.#E()};#T=e=>{if(!e.dataTransfer){this.#E();return}e.preventDefault(),this.#N(),this.#A();let n=e=>{this.#r=void 0,this.#n=!1,this.#t.onDropStateChange(void 0),this.#t.onActiveChange(!1),this.#t.onDragEnd(e)};if(this.#t.getDndMode()===`none`){n(!1);return}let r=this.#t.resolveDrag(e.dataTransfer,`drop`);if(!r){n(!1);return}this.#a=r.keys,this.#o=r.nodes;let i=this.#O(e,this.#t.getVisibleRows(),r.source);if(!i){n(!1);return}let a={source:r.source,dragged:r.nodes.length>0?r.nodes:void 0,draggedKeys:r.keys,target:i,dataTransfer:e.dataTransfer};if(!this.#t.vet(a)){n(!1);return}let o={...a,external:r.source===`external`?r.nodes:void 0};n(this.#t.commitDrop(o))};#E(){this.#A(),this.#N(),this.#r!==void 0&&(this.#r=void 0,this.#t.onDropStateChange(void 0)),this.#n&&(this.#n=!1,this.#t.onActiveChange(!1))}#D(e,n){if(e.length!==0)return n<e[0].rect.top?e[0]:n>e[e.length-1].rect.bottom?e[e.length-1]:e.find(e=>n>=e.rect.top&&n<=e.rect.bottom)??e[e.length-1]}#O(e,n,r){if(n.length===0)return;let i=this.#D(n,e.clientY);if(!i)return;let a=Hb((e.clientY-i.rect.top)/i.rect.height,0,1),o=a<.25?`before`:a>.75?`after`:`inside`,s=i.node.item.isLeaf===!0;o===`inside`&&s&&(o=`after`);let c=!1;o===`after`&&!s&&this.#t.isExpanded(i.key)&&(o=`inside`,c=!0);let l,u,d,f;if(o===`inside`)l=i.key,u=i.key,d=i.depth+1,f=c?0:i.node.children?.length??0;else{let r=this.#t.getIndentPx()||1,a=n[0].rect.left,s=Hb(Math.round((e.clientX-a)/r),0,i.depth),c={node:i.node,depth:i.depth,parentKey:this.#t.getRowInfo(i.key)?.parentKey};u=i.key;for(let e=i.depth-s;e>0&&c.parentKey!==void 0;e--){let e=this.#t.getRowInfo(c.parentKey);if(!e)break;u=c.parentKey,c=e}d=c.depth,l=c.parentKey;let p=this.#t.getChildren(l).findIndex(e=>e.item.key===u);f=(p<0?0:p)+ +(o===`after`)}if(r===`internal`){for(let e of this.#a)if(e===l||e===u||l!==void 0&&this.#t.isSelfOrDescendant(e,l)||o!==`inside`&&this.#t.isSelfOrDescendant(e,u))return;if(this.#a.length>0&&!this.#t.isReorderAllowed()&&!this.#a.some(e=>this.#t.getParentKey(e)!==l))return}return{parentKey:l,index:f,referenceKey:u,position:o,depth:d}}#k(e){if(!e||e.node.item.isLeaf===!0||this.#t.isExpanded(e.key)){this.#A();return}if(e.key===this.#c)return;this.#A();let n=this.#c=e.key;this.#s=setTimeout(()=>{this.#s=void 0,this.#c===n&&(this.#c=void 0,this.#t.expandKey(n))},Math.max(0,this.#t.getExpandHoverMs()))}#A(){this.#s!==void 0&&(clearTimeout(this.#s),this.#s=void 0),this.#c=void 0}#j(){this.#l===0&&(this.#l=requestAnimationFrame(this.#M))}#M=e=>{if(this.#l=0,!this.#n)return;let n=this.#t.getScrollContainer();if(!n||this.#_&&this.#g&&(this.#_=!1,this.#S(this.#g),!this.#n))return;let r=n.getBoundingClientRect(),i=this.#u>=r.left&&this.#u<=r.right?Bb(this.#d-r.top,r.height):{direction:0,depth:0};if(i.direction!==this.#f&&(this.#f=i.direction,this.#p=e,this.#m=e,this.#h=0),i.direction===0)return;let a=Math.min(50,Math.max(0,e-this.#m));this.#m=e;let o=Vb(i.depth,e-this.#p),s=i.direction*o*a/1e3+this.#h,c=Math.trunc(s);if(this.#h=s-c,c!==0){let e=n.scrollTop;n.scrollTop=e+c,n.scrollTop!==e&&(this.#_=!0)}this.#j()};#N(){this.#l!==0&&(cancelAnimationFrame(this.#l),this.#l=0),this.#f=0,this.#h=0,this.#_=!1,this.#g=void 0}#P(e){let n=e===void 0?this.#r===void 0:e.referenceKey===this.#r?.referenceKey&&e.position===this.#r?.position&&e.depth===this.#r?.depth&&e.index===this.#r?.index;this.#r=e,(!n||this.#n)&&this.#t.onDropStateChange(e)}};function Wb(e,n){let r=[],i=new Map,a=[],o=(e,r,i)=>{if(!e||e.length===0)return;let o=e.filter(e=>n.isShown(e,r));for(let e=o.length-1;e>=0;e--)a.push({node:o[e],depth:r,parentKey:i,posInSet:e+1,setSize:o.length})};for(o(e.children,0,void 0);a.length>0;){let{node:e,depth:s,parentKey:c,posInSet:l,setSize:u}=a.pop();i.set(e.item.key,r.length),r.push({node:e,depth:s,parentKey:c,posInSet:l,setSize:u}),e.children&&e.children.length>0&&n.isExpanded(e,s)&&o(e.children,s+1,e.item.key)}return{rows:r,indexByKey:i}}function Gb(e){let n=new Map,r=new Set,i=new Set([e.item.key]),a=new Set,o=[];if(e.children)for(let r of e.children)n.set(r.item.key,e.item.key),o.push({node:r,depth:0,parentKey:e.item.key});for(;o.length>0;){let{node:e,depth:s,parentKey:c}=o.pop();if(i.has(e.item.key)&&a.add(e.item.key),i.add(e.item.key),n.set(e.item.key,c),e.item.icon&&r.add(s),e.children)for(let n=e.children.length-1;n>=0;n--){let r=e.children[n];o.push({node:r,depth:s+1,parentKey:e.item.key})}}if(a.size>0){let e=[...a].slice(0,5).map(e=>`"${e}"`).join(`, `);console.warn(`[ixfx-tree] ${a.size} duplicate item key(s) in tree (e.g. ${e}). Keys must be unique across the whole tree; duplicates break checkbox state, expansion and selection.`)}return{parentByKey:n,depthsWithIcons:r}}function Kb(e,n){let r=new Set;if(!e.children)return r;let i=[],a=(e,r)=>{i.push({node:e,depth:r,next:0,matched:n(e,r)})};for(let n of e.children)for(a(n,0);i.length>0;){let e=i[i.length-1],n=e.node.children;if(n&&e.next<n.length){a(n[e.next++],e.depth+1);continue}i.pop(),e.matched&&(r.add(e.node.item.key),i.length>0&&(i[i.length-1].matched=!0))}return r}function qb(e,n,r){if(r.size===0)return[...e];let i=new Set;for(let n of e)i.add(n.node.item.key);let a=Symbol(`end`),o=new Map,s=a;for(let e=n.length-1;e>=0;e--){let a=n[e];if(i.has(a)){s=a;continue}let c=r.get(a);if(!c)continue;let l=o.get(s);l?l.push(c):o.set(s,[c])}let c=[];for(let n of e){let e=o.get(n.node.item.key);if(e)for(let n=e.length-1;n>=0;n--)c.push(e[n]);c.push(n)}let l=o.get(a);if(l)for(let e=l.length-1;e>=0;e--)c.push(l[e]);return c}function Jb(e,n){let r=new Map;if(!e.children)return r;let i=[];for(let a of e.children)for(i.push({node:a,next:0,checked:0,unchecked:0,counted:0});i.length>0;){let e=i[i.length-1],{node:a}=e,o=a.children,s=a.item.isLeaf||!o?.length;if(!s&&e.next<o.length){i.push({node:o[e.next++],next:0,checked:0,unchecked:0,counted:0});continue}i.pop();let c;c=s?n.has(a)?`checked`:`unchecked`:e.counted===0?`unchecked`:e.checked===e.counted?`checked`:e.unchecked===e.counted?`unchecked`:`indeterminate`,r.set(a.item.key,c);let l=s&&a.item.selectable===!1;if(i.length>0&&!l){let e=i[i.length-1];e.counted++,c===`checked`?e.checked++:c===`unchecked`&&e.unchecked++}}return r}function Yb(e,n){if(e.has(n))return e;let r=new Set(e);return r.add(n),r}function Xb(e,n){if(!e.has(n))return e;let r=new Set(e);return r.delete(n),r}function Zb(e,n){let r;for(let i of e)n(i)&&(r??=new Set(e),r.delete(i));return r??e}function Qb(e){return Math.max(1,e.rowHeight+e.gap)}function $b(e,n){return e.listOffset+n*Qb(e)+e.gap}function ex(e,n){return $b(e,n)+e.rowHeight}function tx(e,n,r=5){let{count:i}=e;if(i<=0)return{start:0,end:0};let a=Qb(e),o=Math.max(0,n-e.listOffset),s=Math.floor(o/a),c=Math.ceil((o+e.viewportHeight)/a),l=Math.min(i,Math.max(0,s-r));return{start:l,end:Math.min(i,Math.max(l,c+r))}}function nx(e,n,r,i=0){if(n<0||n>=e.count)return r;let a=$b(e,n),o=a+e.rowHeight;return a<r+i?n===0?0:Math.max(0,a-i):o>r+e.viewportHeight?Math.max(0,o-e.viewportHeight):r}function rx(e,n,r,i=0){if(n<0||n>=e.count)return r;let a=$b(e,n),o=a+e.rowHeight;if(a>=r+i&&o<=r+e.viewportHeight)return r;let s=a+e.rowHeight/2-(e.viewportHeight+i)/2;return Math.max(0,s)}function ix(e){return Math.max(1,Math.floor(e.viewportHeight/Qb(e))-1)}function ax(e){return{count:e.count,topOf:n=>$b(e,n),bottomOf:n=>ex(e,n)}}function ox(e,n){let r=0,i=e.count;for(;r<i;){let a=r+i>>>1;e.bottomOf(a)>n?i=a:r=a+1}return r}function sx(e,n,r,i=0){if(e.count===0)return;let a=Math.min(ox(e,n),e.count-1),o=a,s=e.count;for(;o<s;){let n=o+s>>>1;e.topOf(n)>=r?s=n:o=n+1}let c=Math.max(a,o-1);return{first:Math.max(0,a-i),last:Math.min(e.count-1,c+i)}}const cx={rows:[],indexByKey:new Map};let q=class extends n{constructor(...e){super(...e),this.exclusivity=`none`,this.selectionFilter=`all`,this.interactionMode=`standard`,this._selectedNodes=new Set,this.disableKeyboardNavigation=!1,this.registry=void 0,this.itemDnd=`none`,this.dndExpandHoverMs=500,this.reorderable=!0,this.stickyHeaders=!0,this.virtualize=`auto`,this.virtualizeThreshold=200,this.applyInternalDrop=!0,this._expandedKeys=new Set,this.#i=0,this._selectionVersion=0,this._scrollTop=0,this.#l={rowHeight:30,gap:1,listOffset:0},this.#u=0,this.#d=0,this.#m=0,this.#h=0,this.#g=!1,this.#S=()=>{this.#d===0&&(this.#d=requestAnimationFrame(()=>{this.#d=0,this.#C()}))},this.tickled=new ae(this,{getItems:()=>this.#s().rows.map(({node:e})=>({id:e.item.key,enabled:!0})),hoverDisabled:()=>this.#J?.isDragging===!0||this.#Y?.isDragging===!0,onStateChange:()=>{this.setAttribute(`data-input-mode`,this.tickled.inputMode)}}),this._focusedDepth=0,this.search=new Vt(this,{adapter:Wt(this,{labelSelector:`.tree-label`,highlightKey:`incr-search-highlight`})}),this.#I={indent:20},this.#L=[],this.#R=[],this.#z=new Map,this.#B=new Map,this.#V=new Set,this.#H=new Map,this.#U=new Map,this.#W=!1,this.#G=``,this.#X=new Set,this.#Z=!1,this.#$=()=>{this.#Q=void 0},this.#te=()=>{this.#de===0&&(this.#de=requestAnimationFrame(()=>{this.#de=0,this.#re()}))},this._stickyKeys=[],this.#le=new Map,this.#ue=!0,this.#de=0,this.#pe=!1,this.#Ie=`user`,this.#Le=!1,this.#$e=0,this.#dt=e=>{if(this.search.isOpen)return;let n=this.#s().rows;if(n.length===0)return;if((e.ctrlKey||e.metaKey)&&e.key===`a`){e.preventDefault(),this.selectAll();return}[`ArrowDown`,`ArrowUp`,`ArrowLeft`,`ArrowRight`,`Home`,`End`,`PageUp`,`PageDown`,`Enter`,` `].includes(e.key)&&this.tickled.setInputMode(`keyboard`);let r=this.#ot();switch(e.key){case`ArrowDown`:e.preventDefault(),this.#ut(n,r,Math.min(r+1,n.length-1),e.shiftKey);break;case`ArrowUp`:e.preventDefault(),this.#ut(n,r,Math.max(r-1,0),e.shiftKey);break;case`Home`:e.preventDefault(),this.#ut(n,r,0,e.shiftKey);break;case`End`:e.preventDefault(),this.#ut(n,r,n.length-1,e.shiftKey);break;case`PageDown`:{e.preventDefault();let i=this.#lt();this.#ut(n,r,Math.min(r+i,n.length-1),e.shiftKey);break}case`PageUp`:{e.preventDefault();let i=this.#lt();this.#ut(n,r,Math.max(r-i,0),e.shiftKey);break}case`ArrowRight`:{e.preventDefault();let i=n[r];i&&i.node.item.isLeaf!==!0&&(this._expandedKeys.has(i.node.item.key)?r+1<n.length&&this.#st(r+1):this.#Ke(i.node,i.depth)),this.requestUpdate();break}case`ArrowLeft`:{e.preventDefault();let i=n[r];if(i&&this._expandedKeys.has(i.node.item.key))this.#e(Xb(this._expandedKeys,i.node.item.key)),this.dispatchEvent(new CustomEvent(`collapse`,{detail:{node:i.node,depth:i.depth},bubbles:!0,composed:!0}));else if(i.depth>0){let e=i.depth-1;for(let i=r-1;i>=0;i--)if(n[i].depth===e){this.#st(i);break}}this.requestUpdate();break}case`Enter`:{e.preventDefault();let i=n[r];i&&(this.interactionMode!==`manual`&&this.interactionMode!==`checked`&&this.select(i.node),this.dispatchEvent(new CustomEvent(`activate`,{detail:{node:i.node,depth:i.depth},bubbles:!0,composed:!0})),this.requestUpdate());break}case` `:{e.preventDefault();let i=n[r];if(!i)break;this.interactionMode===`checked`?this._handleCheckboxClick(new MouseEvent(`click`),i.node,i.depth):(this.interactionMode===`standard`||this.interactionMode===`vscode`||this.interactionMode===`manual`)&&this.#Ge(i.node,i.depth);break}case`Escape`:e.preventDefault(),this.#tt()}},this.#ft=e=>{let n=e.target.closest(`ul.tree-list li`);if(!n)return;let r=n.dataset.key;if(!r)return;let i=this.#s(),a=i.indexByKey.get(r),o=a===void 0?void 0:i.rows[a];if(!o)return;let s={node:o.node,depth:o.depth};this.dispatchEvent(new CustomEvent(`item-dblclick`,{detail:s,bubbles:!0,composed:!0})),this.dispatchEvent(new CustomEvent(`activate`,{detail:s,bubbles:!0,composed:!0}))}}get selectedNodes(){return this._selectedNodes}#e(e){e!==this._expandedKeys&&(this._expandedKeys=e,this.#t=void 0,this.#ue=!0)}#t;#n;#r;#i;#a;#o;invalidateStructure(){this.#i++,this.#t=void 0,this.requestUpdate()}#s(){if(!this.root)return cx;if(this.#t&&this.#n===this.root&&this.#r===this.filterPredicate)return this.#t;let e=this.#D();return this.#t=Wb(this.root,{isExpanded:(e,n)=>this._isExpanded(e,n),isShown:e?n=>e.matches.has(n.item.key):()=>!0}),this.#n=this.root,this.#r=this.filterPredicate,this.#t}#c(){let e=this.root;if(!e)return{parentByKey:new Map,depthsWithIcons:new Set};let n=this.#a;if(n&&n.root===e&&n.version===this.#i)return n.index;let r=Gb(e);return this.#a={root:e,version:this.#i,index:r},r}#l;#u;#d;#f;#p;#m;#h;#g;#_(){return this.virtualize===`off`?!1:this.virtualize===`on`||this.#s().rows.length>this.virtualizeThreshold}#v(e){return{count:e,rowHeight:this.#l.rowHeight,gap:this.#l.gap,listOffset:this.#l.listOffset,viewportHeight:this.#u>0?this.#u:600}}#y(){let e=this.renderRoot.querySelector(`ul.tree-list`),n=e?.querySelector(`li.item:not(.leaving)`),r=n?.getBoundingClientRect().height??0,i=r>0?r:this.#Se(),a=n?Number.parseFloat(getComputedStyle(n).marginTop):NaN,o=Number.isNaN(a)?Number.parseFloat(getComputedStyle(this).getPropertyValue(`--tree-item-gap`)):a,s=Number.isNaN(o)?1:o,c=this.#l.listOffset;if(e){let n=Number.parseFloat(getComputedStyle(e).paddingTop);c=e.offsetTop+(Number.isNaN(n)?0:n)}let l=this.#be()?.clientHeight??0,u=l>0&&l!==this.#u;l>0&&(this.#u=l);let d=this.#l,f=d.rowHeight!==i||d.gap!==s||d.listOffset!==c;return this.#l={rowHeight:i,gap:s,listOffset:c},f||u}#b(e){return tx(this.#v(e),this._scrollTop)}#x(){let e=this.#be()?.scrollTop;e!==void 0&&e!==this._scrollTop&&(this._scrollTop=e)}#S;#C(){let e=this.#be();if(!e||!this.root||!this.#_())return;let n=e.scrollTop;if(n===this._scrollTop)return;let r=tx(this.#v(this.#s().rows.length),n);(r.start!==this.#m||r.end!==this.#h)&&(this._scrollTop=n)}#w(){let e=this.#be();e!==this.#f&&(this.#f?.removeEventListener(`scroll`,this.#S),this.#p?.disconnect(),this.#p=void 0,this.#f=e,e&&(e.addEventListener(`scroll`,this.#S,{passive:!0}),typeof ResizeObserver<`u`&&(this.#p=new ResizeObserver(e=>{let n=e.at(-1)?.contentRect.height??0;n>0&&n!==this.#u&&this.#_()&&this.requestUpdate()}),this.#p.observe(e))))}#T(){this.#f?.removeEventListener(`scroll`,this.#S),this.#f=void 0,this.#p?.disconnect(),this.#p=void 0,this.#d!==0&&(cancelAnimationFrame(this.#d),this.#d=0)}#E(e,n=`edge`){let r=this.#be();if(!r)return;let i=this.#v(this.#s().rows.length),a=this.renderRoot.querySelector(`.sticky-headers`)?.getBoundingClientRect().height??0,o=(n===`center-if-hidden`?rx:nx)(i,e,r.scrollTop,a);(o!==r.scrollTop||o!==this._scrollTop)&&(r.scrollTop=o,this._scrollTop=o)}#D(){let e=this.filterPredicate,n=this.root;if(!e||!n)return;let r=this.#o;if(r&&r.predicate===e&&r.root===n&&r.version===this.#i)return r;let i=Kb(n,e),{parentByKey:a}=this.#c(),o=new Set;for(let e of i){let n=a.get(e);n!==void 0&&o.add(n)}let s={predicate:e,root:n,version:this.#i,matches:i,autoExpanded:o};return this.#o=s,s}get _structureVersion(){return this.#i}get _depthsWithIcons(){return this.#c().depthsWithIcons}#O;#k(){let e=this.searchModes?.trim();if(e===void 0)return[...zt];let n=new Set(e.split(/\s+/));return zt.filter(e=>n.has(e))}#A(){this.#F&&(this.search.setModes(this.#k()),this.#O?.(),this.#O=Rt(this.#F,this.search))}#j;#M;#N;#P;#F;#I;#L;#R;#z;#B;#V;#H;#U;#W;#G;#K;#q;#J;#Y;#X;#Z;#Q;#$;#ee(){let e=this.#be();this.stickyHeaders&&e?(!this.#pe||this.#fe!==e)&&(this.#fe?.removeEventListener(`scroll`,this.#te),e.addEventListener(`scroll`,this.#te,{passive:!0}),this.#fe=e,this.#pe=!0):this.#pe&&=(this.#fe?.removeEventListener(`scroll`,this.#te),this.#fe=void 0,!1)}#te;#ne(e){return{count:e.length,topOf:n=>e[n].offsetTop,bottomOf:n=>e[n].offsetTop+e[n].offsetHeight}}#re(){this.#ue=!1;let e=new Map,n=()=>this.#ie([],e);if(!this.stickyHeaders||!this.root)return n();let r=this.#be(),i=this.renderRoot.querySelector(`ul.tree-list`);if(!r||!i)return n();let a=this.#s(),o=this.#_(),s=i.children,c=this.#R;if(a.rows.length===0||!o&&(s.length===0||s.length!==c.length))return n();let l=o?ax(this.#v(a.rows.length)):this.#ne(s),u=r.scrollTop,d=u+(this.renderRoot.querySelector(`.sticky-headers`)?.getBoundingClientRect().height??0),f=ox(l,u);if(!o)for(;f<s.length&&s[f].classList.contains(`leaving`);)f++;if(f>=l.count)return n();let p=o?f:a.indexByKey.get(c[f]);if(p===void 0)return n();let m=[],h=a.rows[p].parentKey;for(;h!==void 0;){let e=a.indexByKey.get(h);if(e===void 0)break;m.unshift(a.rows[e]),h=a.rows[e].parentKey}let g=new Map,_=[];for(let e of m){let n=e.node.item.key,r=o?a.indexByKey.get(n):this.#z.get(n);r===void 0||l.bottomOf(r)>d||(_.push(n),g.set(n,{node:e.node,depth:e.depth}))}this.#ie(_,g)}#ie(e,n){let r=this._stickyKeys;r.length===e.length&&r.every((n,r)=>n===e[r])||(this.#le=n,this._stickyKeys=e)}#ae(){return!this.stickyHeaders||this._stickyKeys.length===0?a:i`
8085
+ `]}};T([d({type:Boolean,reflect:!0})],Eb.prototype,`collapsed`,void 0),T([d({type:String,attribute:`orientation`,reflect:!0})],Eb.prototype,`orientation`,void 0),T([d({type:Boolean})],Eb.prototype,`closable`,void 0),T([d({type:Boolean,reflect:!0})],Eb.prototype,`collapsible`,void 0),T([d({type:String})],Eb.prototype,`title`,void 0),T([d({type:String,attribute:`icon-name`})],Eb.prototype,`iconName`,void 0),T([d({type:String,attribute:`toggle-interaction`})],Eb.prototype,`toggleInteraction`,void 0),T([d({type:String,attribute:`variant`,reflect:!0})],Eb.prototype,`variant`,void 0),T([d({type:Boolean,attribute:`hide-titlebar`})],Eb.prototype,`hideTitlebar`,void 0),T([d({type:Boolean,attribute:`keep-toolbar`})],Eb.prototype,`keepToolbar`,void 0),T([d({type:Boolean,attribute:`sticky-header`,reflect:!0})],Eb.prototype,`stickyHeader`,void 0),Eb=T([w(`ixfx-panel`)],Eb);const Db=`__ungrouped__`;let Ob=class extends n{constructor(...e){super(...e),this.grouped=!1,this.crossGroupSelection=!1,this.#n=new Map,this.#i=!1,this.#a=new je(this),this.#d=e=>{if(this.#i)return;let n=e.target,r;for(let[e,i]of this.#n)if(i===n){r=e;break}if(r!==void 0){if(this.grouped&&!this.crossGroupSelection){this.#i=!0;for(let[e,n]of this.#n)e!==r&&n.clearSelection();this.#i=!1}this.dispatchEvent(new CustomEvent(`grouped-select`,{detail:{selected:this.selectedItems,groupKey:r===Db?void 0:r},bubbles:!0,composed:!0}))}}}#e;#t;#n;#r;#i;#a;get groupBy(){return this.#e}set groupBy(e){this.#e=e,this.requestUpdate()}get factory(){return this.#t}set factory(e){e!==this.#t&&(this.#s(),this.#t=e,this.requestUpdate())}get provider(){return this.#a.provider}set provider(e){this.#a.provider=e,e&&this.#a.request(void 0)}get selectedItems(){let e=new Set;for(let n of this.#n.values())for(let r of n.selectedItems)e.add(r);return e}dispatch(e,n){for(let r of this.#n.values())r.dispatch(e,n)}createRenderRoot(){return this}connectedCallback(){super.connectedCallback(),this.addEventListener(`select`,this.#d)}disconnectedCallback(){super.disconnectedCallback(),this.removeEventListener(`select`,this.#d)}updated(e){super.updated(e),e.has(`grouped`)&&this.#s(),this.#c()}render(){return this.#t?this.grouped?this.#e?(this.#r=this.#o(),i`${_(this.#r.keys(),e=>e,e=>i`<ixfx-panel data-group-key=${e} .title=${e}></ixfx-panel>`)}`):a:i`<div class="ungrouped-host"></div>`:a}#o(){let e=new Map;if(!this.#e)return e;for(let n of this.#a.items){let r=this.#e(n),i=e.get(r);i||(i=[],e.set(r,i)),i.push(n)}return e}#s(){for(let e of this.#n.values())e.remove();this.#n.clear()}#c(){if(this.#t){if(!this.grouped){this.#l();return}this.#e&&this.#u()}}#l(){let e=this.querySelector(`.ungrouped-host`);if(!e)return;let n=this.#n.get(Db);n||(n=this.#t(void 0),e.appendChild(n),this.#n.set(Db,n)),n.setItems(this.#a.items)}#u(){let e=this.#r??this.#o();for(let n of[...this.#n.keys()])e.has(n)||(this.#n.get(n)?.remove(),this.#n.delete(n));for(let[n,r]of e){let e=[...this.children].find(e=>e instanceof HTMLElement&&e.dataset.groupKey===n);if(!e)continue;let i=this.#n.get(n);i||(i=this.#t(n),e.appendChild(i),this.#n.set(n,i)),i.setItems(r)}}#d};T([d({type:Boolean,reflect:!0})],Ob.prototype,`grouped`,void 0),T([d({type:Boolean,attribute:`cross-group-selection`,reflect:!0})],Ob.prototype,`crossGroupSelection`,void 0),Ob=T([w(`ixfx-grouped-item-lister`)],Ob);const kb=`application/x-ixfx-tree`,Ab=new Map,jb=new Map;let Mb,Nb=0;function Pb(){return`tree-drag-${++Nb}-${Date.now()}`}function Fb(e,n,r,i){Ab.set(e,{sourceId:e,nodes:r,keys:i}),jb.set(e,new WeakRef(n)),Mb=e}function Ib(e){Ab.delete(e),jb.delete(e),Mb===e&&(Mb=void 0)}function Lb(){if(Mb===void 0)return;let e=Ab.get(Mb);if(e)return{sourceId:Mb,keys:e.keys,nodes:e.nodes,element:jb.get(Mb)?.deref()}}const Rb={direction:0,depth:0};function zb(e){return Math.min(e/2,Math.max(24,Math.min(64,e*.2)))}function Bb(e,n){if(n<=0)return Rb;let r=zb(n);return e<r?{direction:-1,depth:Math.min(1,(r-e)/r)}:e>n-r?{direction:1,depth:Math.min(1,(e-(n-r))/r)}:Rb}function Vb(e,n){let r=Math.min(1,Math.max(0,n)/2500);return(120+3080*r*r)*(.35+.65*Math.min(1,Math.max(0,e)))}function Hb(e,n,r){return Math.max(n,Math.min(r,e))}var Ub=class{#e;#t;#n=!1;#r;#i=`internal`;#a=[];#o=[];#s;#c;#l=0;#u=0;#d=0;#f=0;#p=0;#m=0;#h=0;#g;#_=!1;#v;constructor(e,n){this.#e=e,this.#t=n,e.addController(this)}get isDragging(){return this.#n}get isRejected(){return this.#n&&this.#r===void 0}get dropState(){return this.#r}hostConnected(){this.#y()}hostUpdated(){this.#y()}#y(){let e=this.#t.getScrollContainer();!e||e===this.#v||(this.#b(),this.#v=e,e.addEventListener(`dragenter`,this.#x),e.addEventListener(`dragover`,this.#S),e.addEventListener(`dragleave`,this.#w),e.addEventListener(`drop`,this.#T))}#b(){let e=this.#v;e&&(e.removeEventListener(`dragenter`,this.#x),e.removeEventListener(`dragover`,this.#S),e.removeEventListener(`dragleave`,this.#w),e.removeEventListener(`drop`,this.#T),this.#v=void 0)}hostDisconnected(){this.#b(),this.#A(),this.#N(),this.#n=!1,this.#r=void 0}#x=e=>{this.#t.getDndMode()===`none`||!e.dataTransfer||this.#t.resolveDrag(e.dataTransfer,`hover`)!==void 0&&(e.preventDefault(),this.#n||(this.#n=!0,this.#t.onActiveChange(!0)))};#S=e=>{if(this.#t.getDndMode()===`none`||!e.dataTransfer)return;this.#u=e.clientX,this.#d=e.clientY,this.#g=e;let n=this.#t.resolveDrag(e.dataTransfer,`hover`);if(!n){this.#C(e);return}this.#n||(this.#n=!0,this.#t.onActiveChange(!0)),this.#i=n.source,this.#a=n.keys,this.#o=n.nodes;let r=this.#t.getVisibleRows();this.#k(this.#D(r,e.clientY)),this.#j();let i=this.#O(e,r,n.source);if(!i){this.#C(e,!1);return}let a={source:n.source,dragged:n.nodes.length>0?n.nodes:void 0,draggedKeys:n.keys,target:i,dataTransfer:e.dataTransfer};if(!this.#t.vet(a)){this.#C(e,!1);return}e.preventDefault(),e.dataTransfer.dropEffect=n.source===`internal`?`move`:`copy`,this.#P(i)};#C(e,n=!0){e.dataTransfer&&(e.dataTransfer.dropEffect=`none`),this.#P(void 0),n&&this.#A()}#w=e=>{let n=this.#t.getScrollContainer(),r=e.relatedTarget;n&&r&&n.contains(r)||this.#E()};#T=e=>{if(!e.dataTransfer){this.#E();return}e.preventDefault(),this.#N(),this.#A();let n=e=>{this.#r=void 0,this.#n=!1,this.#t.onDropStateChange(void 0),this.#t.onActiveChange(!1),this.#t.onDragEnd(e)};if(this.#t.getDndMode()===`none`){n(!1);return}let r=this.#t.resolveDrag(e.dataTransfer,`drop`);if(!r){n(!1);return}this.#a=r.keys,this.#o=r.nodes;let i=this.#O(e,this.#t.getVisibleRows(),r.source);if(!i){n(!1);return}let a={source:r.source,dragged:r.nodes.length>0?r.nodes:void 0,draggedKeys:r.keys,target:i,dataTransfer:e.dataTransfer};if(!this.#t.vet(a)){n(!1);return}let o={...a,external:r.source===`external`?r.nodes:void 0};n(this.#t.commitDrop(o))};#E(){this.#A(),this.#N(),this.#r!==void 0&&(this.#r=void 0,this.#t.onDropStateChange(void 0)),this.#n&&(this.#n=!1,this.#t.onActiveChange(!1))}#D(e,n){if(e.length!==0)return n<e[0].rect.top?e[0]:n>e[e.length-1].rect.bottom?e[e.length-1]:e.find(e=>n>=e.rect.top&&n<=e.rect.bottom)??e[e.length-1]}#O(e,n,r){if(n.length===0)return;let i=this.#D(n,e.clientY);if(!i)return;let a=Hb((e.clientY-i.rect.top)/i.rect.height,0,1),o=a<.25?`before`:a>.75?`after`:`inside`,s=i.node.item.isLeaf===!0;o===`inside`&&s&&(o=`after`);let c=!1;o===`after`&&!s&&this.#t.isExpanded(i.key)&&(o=`inside`,c=!0);let l,u,d,f;if(o===`inside`)l=i.key,u=i.key,d=i.depth+1,f=c?0:i.node.children?.length??0;else{let r=this.#t.getIndentPx()||1,a=n[0].rect.left,s=Hb(Math.round((e.clientX-a)/r),0,i.depth),c={node:i.node,depth:i.depth,parentKey:this.#t.getRowInfo(i.key)?.parentKey};u=i.key;for(let e=i.depth-s;e>0&&c.parentKey!==void 0;e--){let e=this.#t.getRowInfo(c.parentKey);if(!e)break;u=c.parentKey,c=e}d=c.depth,l=c.parentKey;let p=this.#t.getChildren(l).findIndex(e=>e.item.key===u);f=(p<0?0:p)+ +(o===`after`)}if(r===`internal`){for(let e of this.#a)if(e===l||e===u||l!==void 0&&this.#t.isSelfOrDescendant(e,l)||o!==`inside`&&this.#t.isSelfOrDescendant(e,u))return;if(this.#a.length>0&&!this.#t.isReorderAllowed()&&!this.#a.some(e=>this.#t.getParentKey(e)!==l))return}return{parentKey:l,index:f,referenceKey:u,position:o,depth:d}}#k(e){if(!e||e.node.item.isLeaf===!0||this.#t.isExpanded(e.key)){this.#A();return}if(e.key===this.#c)return;this.#A();let n=this.#c=e.key;this.#s=setTimeout(()=>{this.#s=void 0,this.#c===n&&(this.#c=void 0,this.#t.expandKey(n))},Math.max(0,this.#t.getExpandHoverMs()))}#A(){this.#s!==void 0&&(clearTimeout(this.#s),this.#s=void 0),this.#c=void 0}#j(){this.#l===0&&(this.#l=requestAnimationFrame(this.#M))}#M=e=>{if(this.#l=0,!this.#n)return;let n=this.#t.getScrollContainer();if(!n||this.#_&&this.#g&&(this.#_=!1,this.#S(this.#g),!this.#n))return;let r=n.getBoundingClientRect(),i=this.#u>=r.left&&this.#u<=r.right?Bb(this.#d-r.top,r.height):{direction:0,depth:0};if(i.direction!==this.#f&&(this.#f=i.direction,this.#p=e,this.#m=e,this.#h=0),i.direction===0)return;let a=Math.min(50,Math.max(0,e-this.#m));this.#m=e;let o=Vb(i.depth,e-this.#p),s=i.direction*o*a/1e3+this.#h,c=Math.trunc(s);if(this.#h=s-c,c!==0){let e=n.scrollTop;n.scrollTop=e+c,n.scrollTop!==e&&(this.#_=!0)}this.#j()};#N(){this.#l!==0&&(cancelAnimationFrame(this.#l),this.#l=0),this.#f=0,this.#h=0,this.#_=!1,this.#g=void 0}#P(e){let n=e===void 0?this.#r===void 0:e.referenceKey===this.#r?.referenceKey&&e.position===this.#r?.position&&e.depth===this.#r?.depth&&e.index===this.#r?.index;this.#r=e,(!n||this.#n)&&this.#t.onDropStateChange(e)}};function Wb(e,n){let r=[],i=new Map,a=[],o=(e,r,i)=>{if(!e||e.length===0)return;let o=e.filter(e=>n.isShown(e,r));for(let e=o.length-1;e>=0;e--)a.push({node:o[e],depth:r,parentKey:i,posInSet:e+1,setSize:o.length})};for(o(e.children,0,void 0);a.length>0;){let{node:e,depth:s,parentKey:c,posInSet:l,setSize:u}=a.pop();i.set(e.item.key,r.length),r.push({node:e,depth:s,parentKey:c,posInSet:l,setSize:u}),e.children&&e.children.length>0&&n.isExpanded(e,s)&&o(e.children,s+1,e.item.key)}return{rows:r,indexByKey:i}}function Gb(e){let n=new Map,r=new Set,i=new Set([e.item.key]),a=new Set,o=[];if(e.children)for(let r of e.children)n.set(r.item.key,e.item.key),o.push({node:r,depth:0,parentKey:e.item.key});for(;o.length>0;){let{node:e,depth:s,parentKey:c}=o.pop();if(i.has(e.item.key)&&a.add(e.item.key),i.add(e.item.key),n.set(e.item.key,c),e.item.icon&&r.add(s),e.children)for(let n=e.children.length-1;n>=0;n--){let r=e.children[n];o.push({node:r,depth:s+1,parentKey:e.item.key})}}if(a.size>0){let e=[...a].slice(0,5).map(e=>`"${e}"`).join(`, `);console.warn(`[ixfx-tree] ${a.size} duplicate item key(s) in tree (e.g. ${e}). Keys must be unique across the whole tree; duplicates break checkbox state, expansion and selection.`)}return{parentByKey:n,depthsWithIcons:r}}function Kb(e,n){let r=new Set;if(!e.children)return r;let i=[],a=(e,r)=>{i.push({node:e,depth:r,next:0,matched:n(e,r)})};for(let n of e.children)for(a(n,0);i.length>0;){let e=i[i.length-1],n=e.node.children;if(n&&e.next<n.length){a(n[e.next++],e.depth+1);continue}i.pop(),e.matched&&(r.add(e.node.item.key),i.length>0&&(i[i.length-1].matched=!0))}return r}function qb(e,n,r){if(r.size===0)return[...e];let i=new Set;for(let n of e)i.add(n.node.item.key);let a=Symbol(`end`),o=new Map,s=a;for(let e=n.length-1;e>=0;e--){let a=n[e];if(i.has(a)){s=a;continue}let c=r.get(a);if(!c)continue;let l=o.get(s);l?l.push(c):o.set(s,[c])}let c=[];for(let n of e){let e=o.get(n.node.item.key);if(e)for(let n=e.length-1;n>=0;n--)c.push(e[n]);c.push(n)}let l=o.get(a);if(l)for(let e=l.length-1;e>=0;e--)c.push(l[e]);return c}function Jb(e,n){let r=new Map;if(!e.children)return r;let i=[];for(let a of e.children)for(i.push({node:a,next:0,checked:0,unchecked:0,counted:0});i.length>0;){let e=i[i.length-1],{node:a}=e,o=a.children,s=a.item.isLeaf||!o?.length;if(!s&&e.next<o.length){i.push({node:o[e.next++],next:0,checked:0,unchecked:0,counted:0});continue}i.pop();let c;c=s?n.has(a)?`checked`:`unchecked`:e.counted===0?`unchecked`:e.checked===e.counted?`checked`:e.unchecked===e.counted?`unchecked`:`indeterminate`,r.set(a.item.key,c);let l=s&&a.item.selectable===!1;if(i.length>0&&!l){let e=i[i.length-1];e.counted++,c===`checked`?e.checked++:c===`unchecked`&&e.unchecked++}}return r}function Yb(e,n){if(e.has(n))return e;let r=new Set(e);return r.add(n),r}function Xb(e,n){if(!e.has(n))return e;let r=new Set(e);return r.delete(n),r}function Zb(e,n){let r;for(let i of e)n(i)&&(r??=new Set(e),r.delete(i));return r??e}function Qb(e){return Math.max(1,e.rowHeight+e.gap)}function $b(e,n){return e.listOffset+n*Qb(e)+e.gap}function ex(e,n){return $b(e,n)+e.rowHeight}function tx(e,n,r=5){let{count:i}=e;if(i<=0)return{start:0,end:0};let a=Qb(e),o=Math.max(0,n-e.listOffset),s=Math.floor(o/a),c=Math.ceil((o+e.viewportHeight)/a),l=Math.min(i,Math.max(0,s-r));return{start:l,end:Math.min(i,Math.max(l,c+r))}}function nx(e,n,r,i=0){if(n<0||n>=e.count)return r;let a=$b(e,n),o=a+e.rowHeight;return a<r+i?n===0?0:Math.max(0,a-i):o>r+e.viewportHeight?Math.max(0,o-e.viewportHeight):r}function rx(e,n,r,i=0){if(n<0||n>=e.count)return r;let a=$b(e,n),o=a+e.rowHeight;if(a>=r+i&&o<=r+e.viewportHeight)return r;let s=a+e.rowHeight/2-(e.viewportHeight+i)/2;return Math.max(0,s)}function ix(e){return Math.max(1,Math.floor(e.viewportHeight/Qb(e))-1)}function ax(e){return{count:e.count,topOf:n=>$b(e,n),bottomOf:n=>ex(e,n)}}function ox(e,n){let r=0,i=e.count;for(;r<i;){let a=r+i>>>1;e.bottomOf(a)>n?i=a:r=a+1}return r}function sx(e,n,r,i=0){if(e.count===0)return;let a=Math.min(ox(e,n),e.count-1),o=a,s=e.count;for(;o<s;){let n=o+s>>>1;e.topOf(n)>=r?s=n:o=n+1}let c=Math.max(a,o-1);return{first:Math.max(0,a-i),last:Math.min(e.count-1,c+i)}}const cx={rows:[],indexByKey:new Map};let q=class extends n{constructor(...e){super(...e),this.exclusivity=`none`,this.selectionFilter=`all`,this.interactionMode=`standard`,this._selectedNodes=new Set,this.disableKeyboardNavigation=!1,this.registry=void 0,this.itemDnd=`none`,this.dndExpandHoverMs=500,this.reorderable=!0,this.stickyHeaders=!0,this.virtualize=`auto`,this.virtualizeThreshold=200,this.applyInternalDrop=!0,this._expandedKeys=new Set,this.#i=0,this._selectionVersion=0,this._scrollTop=0,this.#l={rowHeight:30,gap:1,listOffset:0},this.#u=0,this.#d=0,this.#m=0,this.#h=0,this.#g=!1,this.#S=()=>{this.#d===0&&(this.#d=requestAnimationFrame(()=>{this.#d=0,this.#C()}))},this.tickled=new ae(this,{getItems:()=>this.#s().rows.map(({node:e})=>({id:e.item.key,enabled:!0})),hoverDisabled:()=>this.#J?.isDragging===!0||this.#Y?.isDragging===!0,onStateChange:()=>{this.setAttribute(`data-input-mode`,this.tickled.inputMode)}}),this._focusedDepth=0,this.search=new Vt(this,{adapter:Wt(this,{labelSelector:`.tree-label`,highlightKey:`incr-search-highlight`})}),this.#I={indent:20},this.#L=[],this.#R=[],this.#z=new Map,this.#B=new Map,this.#V=new Set,this.#H=new Map,this.#U=new Map,this.#W=!1,this.#G=``,this.#X=new Set,this.#Z=!1,this.#$=()=>{this.#Q=void 0},this.#te=()=>{this.#de===0&&(this.#de=requestAnimationFrame(()=>{this.#de=0,this.#re()}))},this._stickyKeys=[],this.#le=new Map,this.#ue=!0,this.#de=0,this.#pe=!1,this.#Ie=`user`,this.#Le=!1,this.#$e=0,this.#dt=e=>{if(this.search.isOpen)return;let n=this.#s().rows;if(n.length===0)return;if((e.ctrlKey||e.metaKey)&&e.key===`a`){e.preventDefault(),this.selectAll();return}[`ArrowDown`,`ArrowUp`,`ArrowLeft`,`ArrowRight`,`Home`,`End`,`PageUp`,`PageDown`,`Enter`,` `].includes(e.key)&&this.tickled.setInputMode(`keyboard`);let r=this.#ot();switch(e.key){case`ArrowDown`:e.preventDefault(),this.#ut(n,r,Math.min(r+1,n.length-1),e.shiftKey);break;case`ArrowUp`:e.preventDefault(),this.#ut(n,r,Math.max(r-1,0),e.shiftKey);break;case`Home`:e.preventDefault(),this.#ut(n,r,0,e.shiftKey);break;case`End`:e.preventDefault(),this.#ut(n,r,n.length-1,e.shiftKey);break;case`PageDown`:{e.preventDefault();let i=this.#lt();this.#ut(n,r,Math.min(r+i,n.length-1),e.shiftKey);break}case`PageUp`:{e.preventDefault();let i=this.#lt();this.#ut(n,r,Math.max(r-i,0),e.shiftKey);break}case`ArrowRight`:{e.preventDefault();let i=n[r];i&&i.node.item.isLeaf!==!0&&(this._expandedKeys.has(i.node.item.key)?r+1<n.length&&this.#st(r+1):this.#Ke(i.node,i.depth)),this.requestUpdate();break}case`ArrowLeft`:{e.preventDefault();let i=n[r];if(i&&this._expandedKeys.has(i.node.item.key))this.#e(Xb(this._expandedKeys,i.node.item.key)),this.dispatchEvent(new CustomEvent(`collapse`,{detail:{node:i.node,depth:i.depth},bubbles:!0,composed:!0}));else if(i.depth>0){let e=i.depth-1;for(let i=r-1;i>=0;i--)if(n[i].depth===e){this.#st(i);break}}this.requestUpdate();break}case`Enter`:{e.preventDefault();let i=n[r];i&&(this.interactionMode!==`manual`&&this.interactionMode!==`checked`&&this.select(i.node),this.dispatchEvent(new CustomEvent(`activate`,{detail:{node:i.node,depth:i.depth},bubbles:!0,composed:!0})),this.requestUpdate());break}case` `:{e.preventDefault();let i=n[r];if(!i)break;this.interactionMode===`checked`?this._handleCheckboxClick(new MouseEvent(`click`),i.node,i.depth):(this.interactionMode===`standard`||this.interactionMode===`vscode`||this.interactionMode===`manual`)&&this.#Ge(i.node,i.depth);break}case`Escape`:e.preventDefault(),this.#tt()}},this.#ft=e=>{let n=e.target.closest(`ul.tree-list li`);if(!n)return;let r=n.dataset.key;if(!r)return;let i=this.#s(),a=i.indexByKey.get(r),o=a===void 0?void 0:i.rows[a];if(!o)return;let s={node:o.node,depth:o.depth};this.dispatchEvent(new CustomEvent(`item-dblclick`,{detail:s,bubbles:!0,composed:!0})),this.dispatchEvent(new CustomEvent(`activate`,{detail:s,bubbles:!0,composed:!0}))}}get selectedNodes(){return this._selectedNodes}#e(e){e!==this._expandedKeys&&(this._expandedKeys=e,this.#t=void 0,this.#ue=!0)}#t;#n;#r;#i;#a;#o;invalidateStructure(){this.#i++,this.#t=void 0,this.requestUpdate()}#s(){if(!this.root)return cx;if(this.#t&&this.#n===this.root&&this.#r===this.filterPredicate)return this.#t;let e=this.#D();return this.#t=Wb(this.root,{isExpanded:(e,n)=>this._isExpanded(e,n),isShown:e?n=>e.matches.has(n.item.key):()=>!0}),this.#n=this.root,this.#r=this.filterPredicate,this.#t}#c(){let e=this.root;if(!e)return{parentByKey:new Map,depthsWithIcons:new Set};let n=this.#a;if(n&&n.root===e&&n.version===this.#i)return n.index;let r=Gb(e);return this.#a={root:e,version:this.#i,index:r},r}#l;#u;#d;#f;#p;#m;#h;#g;#_(){return this.virtualize===`off`?!1:this.virtualize===`on`||this.#s().rows.length>this.virtualizeThreshold}#v(e){return{count:e,rowHeight:this.#l.rowHeight,gap:this.#l.gap,listOffset:this.#l.listOffset,viewportHeight:this.#u>0?this.#u:600}}#y(){let e=this.renderRoot.querySelector(`ul.tree-list`),n=e?.querySelector(`li.item:not(.leaving)`),r=n?.getBoundingClientRect().height??0,i=r>0?r:this.#Se(),a=n?Number.parseFloat(getComputedStyle(n).marginTop):NaN,o=Number.isNaN(a)?Number.parseFloat(getComputedStyle(this).getPropertyValue(`--tree-item-gap`)):a,s=Number.isNaN(o)?1:o,c=this.#l.listOffset;if(e){let n=Number.parseFloat(getComputedStyle(e).paddingTop);c=e.offsetTop+(Number.isNaN(n)?0:n)}let l=this.#be()?.clientHeight??0,u=l>0&&l!==this.#u;l>0&&(this.#u=l);let d=this.#l,f=d.rowHeight!==i||d.gap!==s||d.listOffset!==c;return this.#l={rowHeight:i,gap:s,listOffset:c},f||u}#b(e){return tx(this.#v(e),this._scrollTop)}#x(){let e=this.#be()?.scrollTop;e!==void 0&&e!==this._scrollTop&&(this._scrollTop=e)}#S;#C(){let e=this.#be();if(!e||!this.root||!this.#_())return;let n=e.scrollTop;if(n===this._scrollTop)return;let r=tx(this.#v(this.#s().rows.length),n);(r.start!==this.#m||r.end!==this.#h)&&(this._scrollTop=n)}#w(){let e=this.#be();e!==this.#f&&(this.#f?.removeEventListener(`scroll`,this.#S),this.#p?.disconnect(),this.#p=void 0,this.#f=e,e&&(e.addEventListener(`scroll`,this.#S,{passive:!0}),typeof ResizeObserver<`u`&&(this.#p=new ResizeObserver(e=>{let n=e.at(-1)?.contentRect.height??0;n>0&&n!==this.#u&&this.#_()&&this.requestUpdate()}),this.#p.observe(e))))}#T(){this.#f?.removeEventListener(`scroll`,this.#S),this.#f=void 0,this.#p?.disconnect(),this.#p=void 0,this.#d!==0&&(cancelAnimationFrame(this.#d),this.#d=0)}#E(e,n=`edge`){let r=this.#be();if(!r)return;let i=this.#v(this.#s().rows.length),a=this.renderRoot.querySelector(`.sticky-headers`)?.getBoundingClientRect().height??0,o=(n===`center-if-hidden`?rx:nx)(i,e,r.scrollTop,a);(o!==r.scrollTop||o!==this._scrollTop)&&(r.scrollTop=o,this._scrollTop=o)}#D(){let e=this.filterPredicate,n=this.root;if(!e||!n)return;let r=this.#o;if(r&&r.predicate===e&&r.root===n&&r.version===this.#i)return r;let i=Kb(n,e),{parentByKey:a}=this.#c(),o=new Set;for(let e of i){let n=a.get(e);n!==void 0&&o.add(n)}let s={predicate:e,root:n,version:this.#i,matches:i,autoExpanded:o};return this.#o=s,s}get _structureVersion(){return this.#i}get _depthsWithIcons(){return this.#c().depthsWithIcons}#O;#k(){let e=this.searchModes?.trim();if(e===void 0)return[...zt];let n=new Set(e.split(/\s+/));return zt.filter(e=>n.has(e))}#A(){this.#F&&(this.search.setModes(this.#k()),this.#O?.(),this.#O=Rt(this.#F,this.search))}#j;#M;#N;#P;#F;#I;#L;#R;#z;#B;#V;#H;#U;#W;#G;#K;#q;#J;#Y;#X;#Z;#Q;#$;#ee(){let e=this.#be();this.stickyHeaders&&e?(!this.#pe||this.#fe!==e)&&(this.#fe?.removeEventListener(`scroll`,this.#te),e.addEventListener(`scroll`,this.#te,{passive:!0}),this.#fe=e,this.#pe=!0):this.#pe&&=(this.#fe?.removeEventListener(`scroll`,this.#te),this.#fe=void 0,!1)}#te;#ne(e){return{count:e.length,topOf:n=>e[n].offsetTop,bottomOf:n=>e[n].offsetTop+e[n].offsetHeight}}#re(){this.#ue=!1;let e=new Map,n=()=>this.#ie([],e);if(!this.stickyHeaders||!this.root)return n();let r=this.#be(),i=this.renderRoot.querySelector(`ul.tree-list`);if(!r||!i)return n();let a=this.#s(),o=this.#_(),s=i.children,c=this.#R;if(a.rows.length===0||!o&&(s.length===0||s.length!==c.length))return n();let l=o?ax(this.#v(a.rows.length)):this.#ne(s),u=r.scrollTop,d=u+(this.renderRoot.querySelector(`.sticky-headers`)?.getBoundingClientRect().height??0),f=ox(l,u);if(!o)for(;f<s.length&&s[f].classList.contains(`leaving`);)f++;if(f>=l.count)return n();let p=o?f:a.indexByKey.get(c[f]);if(p===void 0)return n();let m=[],h=a.rows[p].parentKey;for(;h!==void 0;){let e=a.indexByKey.get(h);if(e===void 0)break;m.unshift(a.rows[e]),h=a.rows[e].parentKey}let g=new Map,_=[];for(let e of m){let n=e.node.item.key,r=o?a.indexByKey.get(n):this.#z.get(n);r===void 0||l.bottomOf(r)>d||(_.push(n),g.set(n,{node:e.node,depth:e.depth}))}this.#ie(_,g)}#ie(e,n){let r=this._stickyKeys;r.length===e.length&&r.every((n,r)=>n===e[r])||(this.#le=n,this._stickyKeys=e)}#ae(){return!this.stickyHeaders||this._stickyKeys.length===0?a:i`
8070
8086
  <div class="sticky-anchor">
8071
8087
  <div class="sticky-headers" part="sticky-headers">
8072
8088
  ${this._stickyKeys.map(e=>{let n=this.#le.get(e);return n?this.#oe(n.node,n.depth):a})}
@@ -10620,7 +10636,7 @@ ixfx-form-options[orientation="vertical"] ixfx-form-part > label {
10620
10636
  height: 1.25em;
10621
10637
  flex-shrink: 0;
10622
10638
  }
10623
- `,document.head.appendChild(e)}let iT=class extends n{constructor(...e){super(...e),this.orientation=`horizontal`,this.variant=`titlebar`,this.toggleInteraction=`implicit`,this.collapsible=!0,this.accordion=!1,this.allowReorder=!1,this._dragState=null,this._suppressNextClick=!1,this._onClickCapture=e=>{this._suppressNextClick&&(this._suppressNextClick=!1,e.preventDefault(),e.stopPropagation())},this._onKeyDown=e=>{let n=this._dragState;if(e.key!==`Escape`||!n?.active)return;e.preventDefault();let r=n.pointerId;this._abortDrag(),this._endDrag(r)},this._onPointerDown=e=>{if(!this.allowReorder||e.button!==0)return;let n=this._findDragTarget(e);if(!n?.parentNode)return;let r=Array.prototype.indexOf.call(n.parentNode.children,n);r<0||(this._dragState={pointerId:e.pointerId,source:n,fromIndex:r,startX:e.clientX,startY:e.clientY,active:!1,ghost:null,gapIndex:void 0},window.addEventListener(`pointermove`,this._onPointerMove),window.addEventListener(`pointerup`,this._onPointerUp),window.addEventListener(`pointercancel`,this._onPointerCancel))},this._onPointerMove=e=>{let n=this._dragState;if(!n||e.pointerId!==n.pointerId)return;let r=Math.hypot(e.clientX-n.startX,e.clientY-n.startY);if(!n.active){if(r<5)return;this._beginDrag(e)}n.ghost?.move(e.clientX,e.clientY);let i=this._computeGapIndex(e.clientX,e.clientY);i!==n.gapIndex&&(n.gapIndex=i,this.requestUpdate())},this._onPointerUp=e=>{let n=this._dragState;if(!(!n||e.pointerId!==n.pointerId)){if(n.active){let r=this._computeGapIndex(e.clientX,e.clientY);this._commitDrag(n.source,n.fromIndex,r)}this._endDrag(e.pointerId)}},this._onPointerCancel=e=>{let n=this._dragState;!n||e.pointerId!==n.pointerId||(this._abortDrag(),this._endDrag(e.pointerId))}}_onPanelToggle(e){let n=e.target;if(!n.collapsed&&this.accordion)for(let e of this._panels)e!==n&&(e.collapsed=!0)}connectedCallback(){super.connectedCallback(),this.addEventListener(`click`,this._onClickCapture,!0)}disconnectedCallback(){this.removeEventListener(`click`,this._onClickCapture,!0),this._dragState&&(this._abortDrag(),this._endDrag(this._dragState.pointerId)),super.disconnectedCallback()}firstUpdated(){this.gap!==void 0&&this.style.setProperty(`--group-gap`,this.gap),this.updateComplete.then(()=>{this._propagateAll()})}updated(e){super.updated(e),e.has(`gap`)&&(this.gap===void 0?this.style.removeProperty(`--group-gap`):this.style.setProperty(`--group-gap`,this.gap)),(e.has(`variant`)||e.has(`toggleInteraction`)||e.has(`orientation`)||e.has(`collapsible`))&&this.updateComplete.then(()=>{this._propagateAll()})}_propagateAll(){let e=this.orientation===`horizontal`?`vertical`:`horizontal`;for(let n of this._panels)n.setAttribute(`variant`,this.variant),n.setAttribute(`toggle-interaction`,this.toggleInteraction),n.setAttribute(`orientation`,e),this.collapsible?n.setAttribute(`collapsible`,``):n.removeAttribute(`collapsible`)}_onSlotChange(){this.updateComplete.then(()=>{this._propagateAll()})}_findDragTarget(e){if(!this.allowReorder)return null;let n=e.composedPath(),r=null,i=!1;for(let e of n){if(!(e instanceof HTMLElement))continue;let n=e.tagName;if(n===`BUTTON`||n===`A`||n===`INPUT`||n===`SELECT`||n===`TEXTAREA`||e.classList.contains(`toolbar`)||e.classList.contains(`close-btn`)||e.classList.contains(`caret-btn`)||e.hasAttribute?.(`slot`)&&e.getAttribute(`slot`)===`toolbar`)return null;n===`IXFX-TITLEBAR`&&(i=!0),!r&&n===`IXFX-PANEL`&&(r=e)}return!r||!i?null:r}_beginDrag(e){let n=this._dragState;if(!(!n||n.active)){try{this.setPointerCapture(e.pointerId)}catch{}n.active=!0,this.setAttribute(`dragging`,``),n.source.setAttribute(`drag-source`,``),n.ghost=this._createGhost(n.source),n.ghost?.move(e.clientX,e.clientY)}}_abortDrag(){let e=this._dragState;e&&(e.source.removeAttribute(`drag-source`),e.gapIndex!==void 0&&(e.gapIndex=void 0,this.requestUpdate()))}_endDrag(e){let n=this._dragState;if(n){n.ghost?.destroy(),n.ghost=null,this.removeAttribute(`dragging`),this._dragState=null,window.removeEventListener(`pointermove`,this._onPointerMove),window.removeEventListener(`pointerup`,this._onPointerUp),window.removeEventListener(`pointercancel`,this._onPointerCancel);try{this.releasePointerCapture(e)}catch{}this.requestUpdate()}}_commitDrag(e,n,r){e.removeAttribute(`drag-source`);let i=(this._panels??[]).filter(n=>n!==e),a=r===void 0?i.length:Math.max(0,Math.min(r,i.length)),o=e.parentNode;if(!o)return;let s=i[a]??null;o.insertBefore(e,s);let c=Array.prototype.indexOf.call(o.children,e);c!==n&&(this._suppressNextClick=!0,this.dispatchEvent(new CustomEvent(`reorder`,{bubbles:!0,composed:!0,detail:{fromIndex:n,toIndex:c,panel:e}})))}_createGhost(e){let n=document.createElement(`span`);if(n.style.display=`inline-flex`,n.style.alignItems=`center`,n.style.padding=`0 var(--space-s, 8px)`,n.style.minWidth=`0`,e.iconName){let r=document.createElement(`ixfx-icon`);r.name=e.iconName,n.appendChild(r)}let r=document.createElement(`span`);r.textContent=(e.title||(e.textContent??``).trim()).slice(0,60),r.style.paddingLeft=`1ch`,r.style.overflow=`hidden`,r.style.textOverflow=`ellipsis`,r.style.whiteSpace=`nowrap`,n.appendChild(r);try{return rT(),Wg({anchor:e,content:n,className:`ixfx-panel-group-ghost`})}catch{return null}}_computeGapIndex(e,n){let r=this._dragState;if(!r)return;let i=(this._panels??[]).filter(e=>e!==r.source);if(i.length===0)return 0;let a=this.orientation===`horizontal`,o=a?e:n;return tT(i.map(e=>{let n=e.getBoundingClientRect();return[a?n.left:n.top,a?n.right:n.bottom]}),o)}_computeCaretStyle(){let e=this._dragState;if(!e?.active||e.gapIndex===void 0)return;let n=(this._panels??[]).filter(n=>n!==e.source);if(n.length===0)return;let r=this.getBoundingClientRect();if(!r)return;let i=Math.max(0,Math.min(e.gapIndex,n.length)),a=i<n.length?n[i].getBoundingClientRect():n[n.length-1].getBoundingClientRect();return this.orientation===`horizontal`?`transform: translate(${(i<n.length?a.left:a.right)-r.left-1}px, 0); width: 2px; height: ${r.height}px;`:`transform: translate(0, ${(i<n.length?a.top:a.bottom)-r.top-1}px); width: ${r.width}px; height: 2px;`}render(){let e=this._computeCaretStyle();return i`
10639
+ `,document.head.appendChild(e)}let iT=class extends n{constructor(...e){super(...e),this.orientation=`horizontal`,this.variant=`titlebar`,this.toggleInteraction=`implicit`,this.collapsible=!0,this.accordion=!1,this.allowReorder=!1,this.stickyHeaders=!0,this._dragState=null,this._suppressNextClick=!1,this._onClickCapture=e=>{this._suppressNextClick&&(this._suppressNextClick=!1,e.preventDefault(),e.stopPropagation())},this._onKeyDown=e=>{let n=this._dragState;if(e.key!==`Escape`||!n?.active)return;e.preventDefault();let r=n.pointerId;this._abortDrag(),this._endDrag(r)},this._onPointerDown=e=>{if(!this.allowReorder||e.button!==0)return;let n=this._findDragTarget(e);if(!n?.parentNode)return;let r=Array.prototype.indexOf.call(n.parentNode.children,n);r<0||(this._dragState={pointerId:e.pointerId,source:n,fromIndex:r,startX:e.clientX,startY:e.clientY,active:!1,ghost:null,gapIndex:void 0},window.addEventListener(`pointermove`,this._onPointerMove),window.addEventListener(`pointerup`,this._onPointerUp),window.addEventListener(`pointercancel`,this._onPointerCancel))},this._onPointerMove=e=>{let n=this._dragState;if(!n||e.pointerId!==n.pointerId)return;let r=Math.hypot(e.clientX-n.startX,e.clientY-n.startY);if(!n.active){if(r<5)return;this._beginDrag(e)}n.ghost?.move(e.clientX,e.clientY);let i=this._computeGapIndex(e.clientX,e.clientY);i!==n.gapIndex&&(n.gapIndex=i,this.requestUpdate())},this._onPointerUp=e=>{let n=this._dragState;if(!(!n||e.pointerId!==n.pointerId)){if(n.active){let r=this._computeGapIndex(e.clientX,e.clientY);this._commitDrag(n.source,n.fromIndex,r)}this._endDrag(e.pointerId)}},this._onPointerCancel=e=>{let n=this._dragState;!n||e.pointerId!==n.pointerId||(this._abortDrag(),this._endDrag(e.pointerId))}}_onPanelToggle(e){let n=e.target;if(!n.collapsed&&this.accordion)for(let e of this._panels)e!==n&&(e.collapsed=!0)}connectedCallback(){super.connectedCallback(),this.addEventListener(`click`,this._onClickCapture,!0)}disconnectedCallback(){this.removeEventListener(`click`,this._onClickCapture,!0),this._dragState&&(this._abortDrag(),this._endDrag(this._dragState.pointerId)),super.disconnectedCallback()}firstUpdated(){this.gap!==void 0&&this.style.setProperty(`--group-gap`,this.gap),this.updateComplete.then(()=>{this._propagateAll()})}updated(e){super.updated(e),e.has(`gap`)&&(this.gap===void 0?this.style.removeProperty(`--group-gap`):this.style.setProperty(`--group-gap`,this.gap)),(e.has(`variant`)||e.has(`toggleInteraction`)||e.has(`orientation`)||e.has(`collapsible`)||e.has(`stickyHeaders`))&&this.updateComplete.then(()=>{this._propagateAll()})}_propagateAll(){let e=this.orientation===`horizontal`?`vertical`:`horizontal`;for(let n of this._panels)n.setAttribute(`variant`,this.variant),n.setAttribute(`toggle-interaction`,this.toggleInteraction),n.setAttribute(`orientation`,e),n.toggleAttribute(`sticky-header`,this.stickyHeaders),this.collapsible?n.setAttribute(`collapsible`,``):n.removeAttribute(`collapsible`)}_onSlotChange(){this.updateComplete.then(()=>{this._propagateAll()})}_findDragTarget(e){if(!this.allowReorder)return null;let n=e.composedPath(),r=null,i=!1;for(let e of n){if(!(e instanceof HTMLElement))continue;let n=e.tagName;if(n===`BUTTON`||n===`A`||n===`INPUT`||n===`SELECT`||n===`TEXTAREA`||e.classList.contains(`toolbar`)||e.classList.contains(`close-btn`)||e.classList.contains(`caret-btn`)||e.hasAttribute?.(`slot`)&&e.getAttribute(`slot`)===`toolbar`)return null;n===`IXFX-TITLEBAR`&&(i=!0),!r&&n===`IXFX-PANEL`&&(r=e)}return!r||!i?null:r}_beginDrag(e){let n=this._dragState;if(!(!n||n.active)){try{this.setPointerCapture(e.pointerId)}catch{}n.active=!0,this.setAttribute(`dragging`,``),n.source.setAttribute(`drag-source`,``),n.ghost=this._createGhost(n.source),n.ghost?.move(e.clientX,e.clientY)}}_abortDrag(){let e=this._dragState;e&&(e.source.removeAttribute(`drag-source`),e.gapIndex!==void 0&&(e.gapIndex=void 0,this.requestUpdate()))}_endDrag(e){let n=this._dragState;if(n){n.ghost?.destroy(),n.ghost=null,this.removeAttribute(`dragging`),this._dragState=null,window.removeEventListener(`pointermove`,this._onPointerMove),window.removeEventListener(`pointerup`,this._onPointerUp),window.removeEventListener(`pointercancel`,this._onPointerCancel);try{this.releasePointerCapture(e)}catch{}this.requestUpdate()}}_commitDrag(e,n,r){e.removeAttribute(`drag-source`);let i=(this._panels??[]).filter(n=>n!==e),a=r===void 0?i.length:Math.max(0,Math.min(r,i.length)),o=e.parentNode;if(!o)return;let s=i[a]??null;o.insertBefore(e,s);let c=Array.prototype.indexOf.call(o.children,e);c!==n&&(this._suppressNextClick=!0,this.dispatchEvent(new CustomEvent(`reorder`,{bubbles:!0,composed:!0,detail:{fromIndex:n,toIndex:c,panel:e}})))}_createGhost(e){let n=document.createElement(`span`);if(n.style.display=`inline-flex`,n.style.alignItems=`center`,n.style.padding=`0 var(--space-s, 8px)`,n.style.minWidth=`0`,e.iconName){let r=document.createElement(`ixfx-icon`);r.name=e.iconName,n.appendChild(r)}let r=document.createElement(`span`);r.textContent=(e.title||(e.textContent??``).trim()).slice(0,60),r.style.paddingLeft=`1ch`,r.style.overflow=`hidden`,r.style.textOverflow=`ellipsis`,r.style.whiteSpace=`nowrap`,n.appendChild(r);try{return rT(),Wg({anchor:e,content:n,className:`ixfx-panel-group-ghost`})}catch{return null}}_computeGapIndex(e,n){let r=this._dragState;if(!r)return;let i=(this._panels??[]).filter(e=>e!==r.source);if(i.length===0)return 0;let a=this.orientation===`horizontal`,o=a?e:n;return tT(i.map(e=>{let n=e.getBoundingClientRect();return[a?n.left:n.top,a?n.right:n.bottom]}),o)}_computeCaretStyle(){let e=this._dragState;if(!e?.active||e.gapIndex===void 0)return;let n=(this._panels??[]).filter(n=>n!==e.source);if(n.length===0)return;let r=this.getBoundingClientRect();if(!r)return;let i=Math.max(0,Math.min(e.gapIndex,n.length)),a=i<n.length?n[i].getBoundingClientRect():n[n.length-1].getBoundingClientRect();return this.orientation===`horizontal`?`transform: translate(${(i<n.length?a.left:a.right)-r.left-1}px, 0); width: 2px; height: ${r.height}px;`:`transform: translate(0, ${(i<n.length?a.top:a.bottom)-r.top-1}px); width: ${r.width}px; height: 2px;`}render(){let e=this._computeCaretStyle();return i`
10624
10640
  <slot
10625
10641
  @toggle=${this._onPanelToggle}
10626
10642
  @slotchange=${this._onSlotChange}
@@ -10684,7 +10700,7 @@ ixfx-form-options[orientation="vertical"] ixfx-form-part > label {
10684
10700
  pointer-events: none;
10685
10701
  z-index: 1;
10686
10702
  }
10687
- `}};T([d({type:String,reflect:!0})],iT.prototype,`orientation`,void 0),T([d({type:String})],iT.prototype,`variant`,void 0),T([d({type:String,attribute:`toggle-interaction`})],iT.prototype,`toggleInteraction`,void 0),T([d({type:Boolean})],iT.prototype,`collapsible`,void 0),T([d({type:Boolean,attribute:`accordion`,reflect:!0})],iT.prototype,`accordion`,void 0),T([d({type:Boolean,attribute:`allow-reorder`,reflect:!0})],iT.prototype,`allowReorder`,void 0),T([d()],iT.prototype,`gap`,void 0),T([p({slot:``})],iT.prototype,`_panels`,void 0),iT=T([w(`ixfx-panel-group`)],iT);var aT=Object.defineProperty,oT=(e,n)=>{let r={};for(var i in e)aT(r,i,{get:e[i],enumerable:!0});return n||aT(r,Symbol.toStringTag,{value:`Module`}),r};const sT=Math.pow,cT=1/Math.sqrt(2*Math.PI),lT=(e=.4)=>n=>{let r=cT/e,i=-2.5,a=(n-.5)/e;a*=a,i*=a;let o=r*sT(Math.E,i);return o>1?1:o<0?0:o};var uT=oT({arch:()=>yT,backIn:()=>RT,backInOut:()=>VT,backOut:()=>zT,bell:()=>GT,bounceIn:()=>WT,bounceInOut:()=>qT,bounceOut:()=>gT,circIn:()=>IT,circInOut:()=>BT,circOut:()=>LT,cubicIn:()=>OT,cubicOut:()=>kT,elasticIn:()=>HT,elasticInOut:()=>KT,elasticOut:()=>UT,expoIn:()=>MT,expoInOut:()=>FT,expoOut:()=>NT,quadIn:()=>wT,quadInOut:()=>DT,quadOut:()=>TT,quartIn:()=>AT,quartOut:()=>jT,quintIn:()=>_T,quintInOut:()=>PT,quintOut:()=>vT,sineIn:()=>ST,sineInOut:()=>ET,sineOut:()=>CT,smootherstep:()=>xT,smoothstep:()=>bT});const dT=Math.sqrt,fT=Math.pow,pT=Math.cos,mT=Math.PI,hT=Math.sin,gT=e=>{let n=7.5625,r=2.75;return e<1/r?n*e*e:e<2/r?n*(e-=1.5/r)*e+.75:e<2.5/r?n*(e-=2.25/r)*e+.9375:n*(e-=2.625/r)*e+.984375},_T=e=>e*e*e*e*e,vT=e=>1-fT(1-e,5),yT=e=>e*(1-e)*4,bT=e=>e*e*(3-2*e),xT=e=>(e*(e*6-15)+10)*e*e*e,ST=e=>1-pT(e*mT/2),CT=e=>hT(e*mT/2),wT=e=>e*e,TT=e=>1-(1-e)*(1-e),ET=e=>-(pT(mT*e)-1)/2,DT=e=>e<.5?2*e*e:1-fT(-2*e+2,2)/2,OT=e=>e*e*e,kT=e=>1-fT(1-e,3),AT=e=>e*e*e*e,jT=e=>1-fT(1-e,4),MT=e=>e===0?0:fT(2,10*e-10),NT=e=>e===1?1:1-fT(2,-10*e),PT=e=>e<.5?16*e*e*e*e*e:1-fT(-2*e+2,5)/2,FT=e=>e===0?0:e===1?1:e<.5?fT(2,20*e-10)/2:(2-fT(2,-20*e+10))/2,IT=e=>1-dT(1-fT(e,2)),LT=e=>dT(1-fT(e-1,2)),RT=e=>2.70158*e*e*e-1.70158*e*e,zT=e=>1+2.70158*fT(e-1,3)+1.70158*fT(e-1,2),BT=e=>e<.5?(1-dT(1-fT(2*e,2)))/2:(dT(1-fT(-2*e+2,2))+1)/2,VT=e=>{let n=2.5949095;return e<.5?fT(2*e,2)*(7.189819*e-n)/2:(fT(2*e-2,2)*(3.5949095*(e*2-2)+n)+2)/2},HT=e=>{let n=2*mT/3;return e===0?0:e===1?1:-fT(2,10*e-10)*hT((e*10-10.75)*n)},UT=e=>{let n=2*mT/3;return e===0?0:e===1?1:fT(2,-10*e)*hT((e*10-.75)*n)+1},WT=e=>1-gT(1-e),GT=lT(),KT=e=>{let n=2*mT/4.5;return e===0?0:e===1?1:e<.5?-(fT(2,20*e-10)*hT((20*e-11.125)*n))/2:fT(2,-20*e+10)*hT((20*e-11.125)*n)/2+1},qT=e=>e<.5?(1-gT(1-2*e))/2:(1+gT(2*e-1))/2,JT=(e=0,n=0)=>{let r={x:di(e,-1,1,0,1),y:di(e,-1,1,1,0)},i=Rd.interpolate(Math.abs(e),Rd.Empty,r);e!==0&&n>0&&(i=e>0?Rd.interpolate(n,i,{x:0,y:r.x*2}):Rd.interpolate(n,i,{x:r.y*2,y:0}));let a=Ga.cubic(Rd.Empty,Rd.Unit,i,r),o=Ga.interpolator(a);return e=>o(e)},YT=(e,n)=>{D(zr(e,`fn`));let r;return()=>(r===void 0&&(r=Au(n,{clampValue:!0})),e(r()))},XT=(e,n)=>{D(zr(e,`fn`));let r=Fu(),i=Fo(n);if(i===void 0)throw Error(`Param 'duration' not provided`);let a=Pu(i,{timer:r,clampValue:!0});return Lu(e,a)},ZT=(e,n)=>{D(zr(e,`fn`));let r;return()=>(r===void 0&&(r=ju(n,{clampValue:!0})),e(r()))},QT=(e,n)=>{D(zr(e,`fn`));let r=Iu(),i=Pu(n,{timer:r,clampValue:!0});return Lu(e,i)};var $T=oT({Named:()=>uT,create:()=>eE,get:()=>sE,getEasingNames:()=>lE,line:()=>JT,tickEasing:()=>iE,ticks:()=>rE,time:()=>nE,timeEasing:()=>tE});const eE=e=>{let n=aE(e.name??`quintIn`)??e.fn;if(n===void 0)throw Error(`Either 'name' or 'fn' must be set`);if(`duration`in e)return nE(n,e.duration);if(`ticks`in e)return rE(n,e.ticks);throw Error(`Expected 'duration' or 'ticks' in options`)},tE=(e,n)=>XT(aE(e),n),nE=(e,n)=>YT(aE(e),n),rE=(e,n)=>ZT(aE(e),n),iE=(e,n)=>QT(aE(e),n),aE=e=>{let n=typeof e==`function`?e:sE(e);if(n===void 0)throw Error(typeof e==`string`?`Easing function not found: '${e}'`:`Easing function not found`);return n};let oE;const sE=function(e){D(Br(e,`non-empty`,`easingName`));let n=cE().get(e.toLowerCase());if(n===void 0)throw Error(`Easing not found: '${e}'`);return n};function cE(){if(oE===void 0){oE=new Map;for(let[e,n]of Object.entries(uT))oE.set(e.toLowerCase(),n);return oE}return oE}function*lE(){yield*cE().keys()}const uE=[`green`,`yellow`,`red`],dE=new Map;function fE(e){let n=e.join(`\0`);return dE.has(n)||dE.set(n,ag.scale(e,{stepsBetween:99})),dE.get(n)}function pE(e,n){let r=getComputedStyle(e),i=r.getPropertyValue(n).trim(),a=/var\((--[\w-]+)(?:,(.*))?\)/g;for(let e=0;e<5&&i.includes(`var(`);e++)i=i.replace(a,(e,n,i)=>r.getPropertyValue(n).trim()||(i?i.trim():``));return i}function mE(e){return pE(e,`--plot-color`)||`oklch(60% 0.15 140)`}function hE(e){if(!e.trim())return uE;let n=e.split(`,`).map(e=>e.trim()).filter(Boolean);return n.length>=2?n:uE}function gE(e){try{let n=ag.HslSpace.fromCss(e,{scalar:!0});return{h:n.h,s:n.s,l:n.l}}catch{return{h:.39,s:.5,l:.55}}}function _E(e,n){let r=Math.max(0,Math.min(1,e));if(n.easingName)try{return Math.max(0,Math.min(1,$T.get(n.easingName)(r)))}catch{}return n.valueMap?Math.max(0,Math.min(1,n.valueMap(r))):r}function vE(e,n,r){let i=_E(e,r);switch(r.mode){case`fixed`:return{fill:n,opacity:1};case`opacity`:return{fill:n,opacity:Math.max(.04,i)};case`hue`:{let e=gE(n);return{fill:`hsl(${Math.round(i*360)}deg ${Math.round(e.s*100)}% ${Math.round(e.l*100)}%)`,opacity:1}}case`saturation`:{let e=gE(n);return{fill:`hsl(${Math.round(e.h*360)}deg ${Math.round(i*100)}% ${Math.round(e.l*100)}%)`,opacity:1}}case`lightness`:{let e=gE(n);return{fill:`hsl(${Math.round(e.h*360)}deg ${Math.round(e.s*100)}% ${Math.round(i*100)}%)`,opacity:1}}case`scale`:{let e=fE(r.palette.length>=2?r.palette:uE);return{fill:e[Math.min(e.length-1,Math.floor(i*e.length))],opacity:1}}default:return{fill:n,opacity:1}}}function yE(e,n,r){if(r===`opacity`)return{...e,opacity:e.opacity*Math.max(.08,n**.6)};if(r===`desaturation`){let r=gE(e.fill),i=r.s*n;return{fill:`hsl(${Math.round(r.h*360)}deg ${Math.round(i*100)}% ${Math.round(r.l*100)}%)`,opacity:e.opacity}}return e}var bE=class{#e;#t;#n;#r;constructor(e={}){this.values=[],this.#e=hi(),this.#t={min:0,max:0},this.#n=null,this.#r={capacityLimit:100,persistentScaling:!0,fixedRange:null,...e},this.#r.fixedRange!==null&&(this.#n=this.#r.fixedRange)}setRange(e,n){this.#n={min:e,max:n}}unsetRange(){this.#n=null,this.#i()}get isAutoRange(){return this.#n===null}add(e){if(typeof e==`number`)this.values.push(e),this.isAutoRange&&(this.#t=this.#e.seen(e));else if(this.values.push(...e),this.isAutoRange)for(let n of e)this.#t=this.#e.seen(n);this.values.length>this.#r.capacityLimit&&(this.values=this.values.slice(this.values.length-this.#r.capacityLimit),!this.#r.persistentScaling&&this.isAutoRange&&this.#i())}#i(){this.#r.persistentScaling||(this.#e=hi());for(let e=0;e<this.values.length;e++)this.#t=this.#e.seen(this.values[e])}set(e){e.length>this.#r.capacityLimit&&(e=e.slice(e.length-this.#r.capacityLimit)),this.values=e,this.#i()}get range(){return this.#n?this.#n:this.#t}clear(){let e=this.values.length===0;return this.values=[],this.#r.persistentScaling||this.#i(),!e}};function xE(e){if(typeof e==`number`)return!0;if(typeof e!=`string`)return!1;let n=e.trim();return n!==``&&!Number.isNaN(Number(n))}var SE;let CE=!1;function wE(){if(CE)return;CE=!0;let e=document.createElement(`style`);e.textContent=`
10703
+ `}};T([d({type:String,reflect:!0})],iT.prototype,`orientation`,void 0),T([d({type:String})],iT.prototype,`variant`,void 0),T([d({type:String,attribute:`toggle-interaction`})],iT.prototype,`toggleInteraction`,void 0),T([d({type:Boolean})],iT.prototype,`collapsible`,void 0),T([d({type:Boolean,attribute:`accordion`,reflect:!0})],iT.prototype,`accordion`,void 0),T([d({type:Boolean,attribute:`allow-reorder`,reflect:!0})],iT.prototype,`allowReorder`,void 0),T([d({attribute:`sticky-headers`,reflect:!0,converter:{fromAttribute:e=>e!==`false`,toAttribute:e=>e?`true`:`false`}})],iT.prototype,`stickyHeaders`,void 0),T([d()],iT.prototype,`gap`,void 0),T([p({slot:``})],iT.prototype,`_panels`,void 0),iT=T([w(`ixfx-panel-group`)],iT);var aT=Object.defineProperty,oT=(e,n)=>{let r={};for(var i in e)aT(r,i,{get:e[i],enumerable:!0});return n||aT(r,Symbol.toStringTag,{value:`Module`}),r};const sT=Math.pow,cT=1/Math.sqrt(2*Math.PI),lT=(e=.4)=>n=>{let r=cT/e,i=-2.5,a=(n-.5)/e;a*=a,i*=a;let o=r*sT(Math.E,i);return o>1?1:o<0?0:o};var uT=oT({arch:()=>yT,backIn:()=>RT,backInOut:()=>VT,backOut:()=>zT,bell:()=>GT,bounceIn:()=>WT,bounceInOut:()=>qT,bounceOut:()=>gT,circIn:()=>IT,circInOut:()=>BT,circOut:()=>LT,cubicIn:()=>OT,cubicOut:()=>kT,elasticIn:()=>HT,elasticInOut:()=>KT,elasticOut:()=>UT,expoIn:()=>MT,expoInOut:()=>FT,expoOut:()=>NT,quadIn:()=>wT,quadInOut:()=>DT,quadOut:()=>TT,quartIn:()=>AT,quartOut:()=>jT,quintIn:()=>_T,quintInOut:()=>PT,quintOut:()=>vT,sineIn:()=>ST,sineInOut:()=>ET,sineOut:()=>CT,smootherstep:()=>xT,smoothstep:()=>bT});const dT=Math.sqrt,fT=Math.pow,pT=Math.cos,mT=Math.PI,hT=Math.sin,gT=e=>{let n=7.5625,r=2.75;return e<1/r?n*e*e:e<2/r?n*(e-=1.5/r)*e+.75:e<2.5/r?n*(e-=2.25/r)*e+.9375:n*(e-=2.625/r)*e+.984375},_T=e=>e*e*e*e*e,vT=e=>1-fT(1-e,5),yT=e=>e*(1-e)*4,bT=e=>e*e*(3-2*e),xT=e=>(e*(e*6-15)+10)*e*e*e,ST=e=>1-pT(e*mT/2),CT=e=>hT(e*mT/2),wT=e=>e*e,TT=e=>1-(1-e)*(1-e),ET=e=>-(pT(mT*e)-1)/2,DT=e=>e<.5?2*e*e:1-fT(-2*e+2,2)/2,OT=e=>e*e*e,kT=e=>1-fT(1-e,3),AT=e=>e*e*e*e,jT=e=>1-fT(1-e,4),MT=e=>e===0?0:fT(2,10*e-10),NT=e=>e===1?1:1-fT(2,-10*e),PT=e=>e<.5?16*e*e*e*e*e:1-fT(-2*e+2,5)/2,FT=e=>e===0?0:e===1?1:e<.5?fT(2,20*e-10)/2:(2-fT(2,-20*e+10))/2,IT=e=>1-dT(1-fT(e,2)),LT=e=>dT(1-fT(e-1,2)),RT=e=>2.70158*e*e*e-1.70158*e*e,zT=e=>1+2.70158*fT(e-1,3)+1.70158*fT(e-1,2),BT=e=>e<.5?(1-dT(1-fT(2*e,2)))/2:(dT(1-fT(-2*e+2,2))+1)/2,VT=e=>{let n=2.5949095;return e<.5?fT(2*e,2)*(7.189819*e-n)/2:(fT(2*e-2,2)*(3.5949095*(e*2-2)+n)+2)/2},HT=e=>{let n=2*mT/3;return e===0?0:e===1?1:-fT(2,10*e-10)*hT((e*10-10.75)*n)},UT=e=>{let n=2*mT/3;return e===0?0:e===1?1:fT(2,-10*e)*hT((e*10-.75)*n)+1},WT=e=>1-gT(1-e),GT=lT(),KT=e=>{let n=2*mT/4.5;return e===0?0:e===1?1:e<.5?-(fT(2,20*e-10)*hT((20*e-11.125)*n))/2:fT(2,-20*e+10)*hT((20*e-11.125)*n)/2+1},qT=e=>e<.5?(1-gT(1-2*e))/2:(1+gT(2*e-1))/2,JT=(e=0,n=0)=>{let r={x:di(e,-1,1,0,1),y:di(e,-1,1,1,0)},i=Rd.interpolate(Math.abs(e),Rd.Empty,r);e!==0&&n>0&&(i=e>0?Rd.interpolate(n,i,{x:0,y:r.x*2}):Rd.interpolate(n,i,{x:r.y*2,y:0}));let a=Ga.cubic(Rd.Empty,Rd.Unit,i,r),o=Ga.interpolator(a);return e=>o(e)},YT=(e,n)=>{D(zr(e,`fn`));let r;return()=>(r===void 0&&(r=Au(n,{clampValue:!0})),e(r()))},XT=(e,n)=>{D(zr(e,`fn`));let r=Fu(),i=Fo(n);if(i===void 0)throw Error(`Param 'duration' not provided`);let a=Pu(i,{timer:r,clampValue:!0});return Lu(e,a)},ZT=(e,n)=>{D(zr(e,`fn`));let r;return()=>(r===void 0&&(r=ju(n,{clampValue:!0})),e(r()))},QT=(e,n)=>{D(zr(e,`fn`));let r=Iu(),i=Pu(n,{timer:r,clampValue:!0});return Lu(e,i)};var $T=oT({Named:()=>uT,create:()=>eE,get:()=>sE,getEasingNames:()=>lE,line:()=>JT,tickEasing:()=>iE,ticks:()=>rE,time:()=>nE,timeEasing:()=>tE});const eE=e=>{let n=aE(e.name??`quintIn`)??e.fn;if(n===void 0)throw Error(`Either 'name' or 'fn' must be set`);if(`duration`in e)return nE(n,e.duration);if(`ticks`in e)return rE(n,e.ticks);throw Error(`Expected 'duration' or 'ticks' in options`)},tE=(e,n)=>XT(aE(e),n),nE=(e,n)=>YT(aE(e),n),rE=(e,n)=>ZT(aE(e),n),iE=(e,n)=>QT(aE(e),n),aE=e=>{let n=typeof e==`function`?e:sE(e);if(n===void 0)throw Error(typeof e==`string`?`Easing function not found: '${e}'`:`Easing function not found`);return n};let oE;const sE=function(e){D(Br(e,`non-empty`,`easingName`));let n=cE().get(e.toLowerCase());if(n===void 0)throw Error(`Easing not found: '${e}'`);return n};function cE(){if(oE===void 0){oE=new Map;for(let[e,n]of Object.entries(uT))oE.set(e.toLowerCase(),n);return oE}return oE}function*lE(){yield*cE().keys()}const uE=[`green`,`yellow`,`red`],dE=new Map;function fE(e){let n=e.join(`\0`);return dE.has(n)||dE.set(n,ag.scale(e,{stepsBetween:99})),dE.get(n)}function pE(e,n){let r=getComputedStyle(e),i=r.getPropertyValue(n).trim(),a=/var\((--[\w-]+)(?:,(.*))?\)/g;for(let e=0;e<5&&i.includes(`var(`);e++)i=i.replace(a,(e,n,i)=>r.getPropertyValue(n).trim()||(i?i.trim():``));return i}function mE(e){return pE(e,`--plot-color`)||`oklch(60% 0.15 140)`}function hE(e){if(!e.trim())return uE;let n=e.split(`,`).map(e=>e.trim()).filter(Boolean);return n.length>=2?n:uE}function gE(e){try{let n=ag.HslSpace.fromCss(e,{scalar:!0});return{h:n.h,s:n.s,l:n.l}}catch{return{h:.39,s:.5,l:.55}}}function _E(e,n){let r=Math.max(0,Math.min(1,e));if(n.easingName)try{return Math.max(0,Math.min(1,$T.get(n.easingName)(r)))}catch{}return n.valueMap?Math.max(0,Math.min(1,n.valueMap(r))):r}function vE(e,n,r){let i=_E(e,r);switch(r.mode){case`fixed`:return{fill:n,opacity:1};case`opacity`:return{fill:n,opacity:Math.max(.04,i)};case`hue`:{let e=gE(n);return{fill:`hsl(${Math.round(i*360)}deg ${Math.round(e.s*100)}% ${Math.round(e.l*100)}%)`,opacity:1}}case`saturation`:{let e=gE(n);return{fill:`hsl(${Math.round(e.h*360)}deg ${Math.round(i*100)}% ${Math.round(e.l*100)}%)`,opacity:1}}case`lightness`:{let e=gE(n);return{fill:`hsl(${Math.round(e.h*360)}deg ${Math.round(e.s*100)}% ${Math.round(i*100)}%)`,opacity:1}}case`scale`:{let e=fE(r.palette.length>=2?r.palette:uE);return{fill:e[Math.min(e.length-1,Math.floor(i*e.length))],opacity:1}}default:return{fill:n,opacity:1}}}function yE(e,n,r){if(r===`opacity`)return{...e,opacity:e.opacity*Math.max(.08,n**.6)};if(r===`desaturation`){let r=gE(e.fill),i=r.s*n;return{fill:`hsl(${Math.round(r.h*360)}deg ${Math.round(i*100)}% ${Math.round(r.l*100)}%)`,opacity:e.opacity}}return e}var bE=class{#e;#t;#n;#r;constructor(e={}){this.values=[],this.#e=hi(),this.#t={min:0,max:0},this.#n=null,this.#r={capacityLimit:100,persistentScaling:!0,fixedRange:null,...e},this.#r.fixedRange!==null&&(this.#n=this.#r.fixedRange)}setRange(e,n){this.#n={min:e,max:n}}unsetRange(){this.#n=null,this.#i()}get isAutoRange(){return this.#n===null}add(e){if(typeof e==`number`)this.values.push(e),this.isAutoRange&&(this.#t=this.#e.seen(e));else if(this.values.push(...e),this.isAutoRange)for(let n of e)this.#t=this.#e.seen(n);this.values.length>this.#r.capacityLimit&&(this.values=this.values.slice(this.values.length-this.#r.capacityLimit),!this.#r.persistentScaling&&this.isAutoRange&&this.#i())}#i(){this.#r.persistentScaling||(this.#e=hi());for(let e=0;e<this.values.length;e++)this.#t=this.#e.seen(this.values[e])}set(e){e.length>this.#r.capacityLimit&&(e=e.slice(e.length-this.#r.capacityLimit)),this.values=e,this.#i()}get range(){return this.#n?this.#n:this.#t}clear(){let e=this.values.length===0;return this.values=[],this.#r.persistentScaling||this.#i(),!e}};function xE(e){if(typeof e==`number`)return!0;if(typeof e!=`string`)return!1;let n=e.trim();return n!==``&&!Number.isNaN(Number(n))}var SE;let CE=!1;function wE(){if(CE)return;CE=!0;let e=document.createElement(`style`);e.textContent=`
10688
10704
  ixfx-tooltip {
10689
10705
  display: inline-block;
10690
10706
  background: var(--surface-5);
package/dist/index.d.ts CHANGED
@@ -2664,6 +2664,11 @@ declare class PanelGroupElement extends LitElement {
2664
2664
  collapsible: boolean;
2665
2665
  accordion: boolean;
2666
2666
  allowReorder: boolean;
2667
+ /**
2668
+ * Pin each panel's titlebar to the top (or left, for vertical titlebars) of the scroll area
2669
+ * while its content is in view. On by default; set `sticky-headers="false"` to disable.
2670
+ */
2671
+ stickyHeaders: boolean;
2667
2672
  /** Explicit gap between panels. When unset, `--group-gap` (falling back to `--space-l`) controls the gap. */
2668
2673
  gap?: string;
2669
2674
  private _panels;
package/dist/index.js CHANGED
@@ -11050,6 +11050,7 @@ let PanelGroupElement = class PanelGroupElement extends LitElement {
11050
11050
  this.collapsible = true;
11051
11051
  this.accordion = false;
11052
11052
  this.allowReorder = false;
11053
+ this.stickyHeaders = true;
11053
11054
  this._dragState = null;
11054
11055
  this._suppressNextClick = false;
11055
11056
  this._onClickCapture = (event) => {
@@ -11147,7 +11148,7 @@ let PanelGroupElement = class PanelGroupElement extends LitElement {
11147
11148
  if (this.gap !== void 0) this.style.setProperty(`--group-gap`, this.gap);
11148
11149
  else this.style.removeProperty(`--group-gap`);
11149
11150
  }
11150
- if (changed.has(`variant`) || changed.has(`toggleInteraction`) || changed.has(`orientation`) || changed.has(`collapsible`)) this.updateComplete.then(() => {
11151
+ if (changed.has(`variant`) || changed.has(`toggleInteraction`) || changed.has(`orientation`) || changed.has(`collapsible`) || changed.has(`stickyHeaders`)) this.updateComplete.then(() => {
11151
11152
  this._propagateAll();
11152
11153
  });
11153
11154
  }
@@ -11157,6 +11158,7 @@ let PanelGroupElement = class PanelGroupElement extends LitElement {
11157
11158
  panel.setAttribute(`variant`, this.variant);
11158
11159
  panel.setAttribute(`toggle-interaction`, this.toggleInteraction);
11159
11160
  panel.setAttribute(`orientation`, invertedOrientation);
11161
+ panel.toggleAttribute(`sticky-header`, this.stickyHeaders);
11160
11162
  if (this.collapsible) panel.setAttribute(`collapsible`, ``);
11161
11163
  else panel.removeAttribute(`collapsible`);
11162
11164
  }
@@ -11395,6 +11397,14 @@ __decorate([property({
11395
11397
  attribute: `allow-reorder`,
11396
11398
  reflect: true
11397
11399
  })], PanelGroupElement.prototype, "allowReorder", void 0);
11400
+ __decorate([property({
11401
+ attribute: `sticky-headers`,
11402
+ reflect: true,
11403
+ converter: {
11404
+ fromAttribute: (value) => value !== `false`,
11405
+ toAttribute: (value) => value ? `true` : `false`
11406
+ }
11407
+ })], PanelGroupElement.prototype, "stickyHeaders", void 0);
11398
11408
  __decorate([property()], PanelGroupElement.prototype, "gap", void 0);
11399
11409
  __decorate([queryAssignedElements({ slot: `` })], PanelGroupElement.prototype, "_panels", void 0);
11400
11410
  PanelGroupElement = __decorate([safeCustomElement(`ixfx-panel-group`)], PanelGroupElement);
package/dist/panel.d.ts CHANGED
@@ -26,6 +26,11 @@ declare class PanelElement extends LitElement {
26
26
  hideTitlebar: boolean;
27
27
  /** Keep the toolbar visible even when the panel is collapsed. */
28
28
  keepToolbar: boolean;
29
+ /**
30
+ * Keep the titlebar pinned to the edge of the nearest scrolling ancestor while this panel
31
+ * is in view (top for horizontal titlebars, left for vertical). Normally set by `ixfx-panel-group`.
32
+ */
33
+ stickyHeader: boolean;
29
34
  private _onTitlebarToggle;
30
35
  private _onCloseClick;
31
36
  protected render(): import("lit").TemplateResult<1>;
package/dist/panel.js CHANGED
@@ -17,6 +17,7 @@ let PanelElement = class PanelElement extends LitElement {
17
17
  this.variant = `titlebar`;
18
18
  this.hideTitlebar = false;
19
19
  this.keepToolbar = false;
20
+ this.stickyHeader = false;
20
21
  }
21
22
  _onTitlebarToggle(event) {
22
23
  event.stopPropagation();
@@ -85,6 +86,23 @@ let PanelElement = class PanelElement extends LitElement {
85
86
  flex-shrink: 0;
86
87
  }
87
88
 
89
+ /* \`overflow: clip\` (unlike \`hidden\`) does not create a scroll container, so the
90
+ titlebar can stick to the outer scroll area. Sticking is bounded by the panel itself. */
91
+ :host([sticky-header]) {
92
+ overflow: clip;
93
+ }
94
+
95
+ :host([sticky-header]) ixfx-titlebar {
96
+ position: sticky;
97
+ top: 0;
98
+ z-index: 2;
99
+ }
100
+
101
+ :host([sticky-header][orientation="vertical"]) ixfx-titlebar {
102
+ top: auto;
103
+ left: 0;
104
+ }
105
+
88
106
  .content-wrapper {
89
107
  interpolate-size: allow-keywords;
90
108
  overflow: hidden;
@@ -108,7 +126,8 @@ let PanelElement = class PanelElement extends LitElement {
108
126
  }
109
127
 
110
128
  .content-inner {
111
- box-shadow: var(--deboss-3);
129
+ box-shadow: var(--panel-content-shadow, var(--deboss-3));
130
+ border: var(--panel-content-border, none);
112
131
  min-height: 0;
113
132
  min-width: 0;
114
133
  overflow: hidden;
@@ -214,6 +233,11 @@ __decorate([property({
214
233
  type: Boolean,
215
234
  attribute: `keep-toolbar`
216
235
  })], PanelElement.prototype, "keepToolbar", void 0);
236
+ __decorate([property({
237
+ type: Boolean,
238
+ attribute: `sticky-header`,
239
+ reflect: true
240
+ })], PanelElement.prototype, "stickyHeader", void 0);
217
241
  PanelElement = __decorate([safeCustomElement(`ixfx-panel`)], PanelElement);
218
242
  //#endregion
219
243
  export { PanelElement };
package/dist/titlebar.js CHANGED
@@ -157,7 +157,6 @@ let TitlebarElement = class TitlebarElement extends LitElement {
157
157
 
158
158
  .title-text {
159
159
  flex: 1;
160
- padding-left: 1ch;
161
160
  font-family: var(--font-family);
162
161
  font-size: var(--text-m);
163
162
  font-weight: var(--font-weight-bold, 600);
@@ -175,7 +174,6 @@ let TitlebarElement = class TitlebarElement extends LitElement {
175
174
 
176
175
  :host([orientation="vertical"]) .title-text {
177
176
  writing-mode: vertical-rl;
178
- padding-left: 0;
179
177
  padding-bottom: 1ch;
180
178
  text-orientation: mixed;
181
179
  transform: rotate(180deg);
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@ixfx/components",
3
- "version": "0.15.1",
4
- "generated": "2026-10-18T18:06:38.222Z",
3
+ "version": "0.15.2",
4
+ "generated": "2026-10-18T18:57:25.674Z",
5
5
  "components": [
6
6
  {
7
7
  "name": "ac-text",
@@ -189,6 +189,8 @@ Use the `collapsed` attribute to start the panel in collapsed state:
189
189
  | `--transition` | `0.15s ease-out` | Animation transition duration |
190
190
  | `--panel-width` | `auto` | Width for vertical panels |
191
191
  | `--panel-height` | `auto` | Height for horizontal panels |
192
+ | `--panel-content-shadow`| `var(--deboss-3)` | `box-shadow` of the content area (the inset 3D effect). `none` removes it |
193
+ | `--panel-content-border`| `none` | `border` of the content area |
192
194
  | `--prominence-idle-opacity` | `0.6` | Opacity of caret when idle |
193
195
  | `--prominence-tickled-opacity` | `1.0` | Opacity of caret on hover |
194
196
 
@@ -215,6 +217,7 @@ A container component that manages multiple panels with flexible open behavior.
215
217
  | `collapsible` | boolean | `true` | Collapse behaviour propagated to child panels |
216
218
  | `gap` | string | (unset) | Explicit gap between panels; sets `--group-gap` when provided |
217
219
  | `orientation` | `'horizontal'` \| `'vertical'` | `'horizontal'` | Layout direction of the group |
220
+ | `sticky-headers` | boolean (`"false"` disables) | `true` | Pin each panel's titlebar to the scroll area edge (top, or left for vertical titlebars) |
218
221
  | `toggle-interaction` | `'implicit'` \| `'explicit'` \| `'disabled'` | `'implicit'` | Toggle behavior applied to all child panels |
219
222
  | `variant` | `'titlebar'` \| `'midline'` \| `'tree'` | `'titlebar'` | Visual style applied to all child panels |
220
223
 
@@ -255,6 +258,12 @@ By default, multiple panels can be open at the same time. Add `accordion` to res
255
258
  </ixfx-panel-group>
256
259
  ```
257
260
 
261
+ ### Sticky headers
262
+
263
+ Panels in a group keep their titlebar pinned to the nearest scrolling ancestor while the panel is in view, so you don't lose track of which panel you're in. The titlebar stops sticking when the panel ends. Horizontal titlebars stick to the top, vertical titlebars to the left. Disable with `sticky-headers="false"`. A standalone `ixfx-panel` can opt in with `sticky-header`.
264
+
265
+ Sticking activates `overflow: clip` on the panel instead of `overflow: hidden`.
266
+
258
267
  ### Reordering
259
268
 
260
269
  Set `allow-reorder` to let users rearrange panels by dragging their titlebars (pointer-only in v1; keyboard reorder is not included):
@@ -294,6 +303,18 @@ ixfx-panel-group {
294
303
 
295
304
  Alternatively set the `gap` property/attribute for the same effect (it mirrors its value into `--group-gap`).
296
305
 
306
+ ### Content area styling
307
+
308
+ Inherited custom properties, so setting them on a group styles all its panels. To remove the inset effect or use your own:
309
+
310
+ ```css
311
+ ixfx-panel-group {
312
+ --panel-content-shadow: none;
313
+ --panel-content-border: 1px solid var(--surface-4);
314
+ }
315
+ ```
316
+
317
+
297
318
  ### Group-propagated properties
298
319
 
299
320
  When you set `variant`, `toggle-interaction` or `collapsible` on the group, those values are automatically applied to all child panels that don't have an explicit value set. This simplifies declaration when all panels in a group share the same styling:
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@ixfx/components",
3
3
  "type": "module",
4
- "version": "0.15.1",
4
+ "version": "0.15.2",
5
5
  "packageManager": "pnpm@10.0.0",
6
6
  "description": "Web components for ixfx — Lit-based UI toolkit",
7
7
  "author": "Clint Heyer",