@aquera/nile-elements 1.7.5 → 1.7.6

package/README.md

@@ -79,6 +79,9 @@ To run a local development server that serves the basic demo located in `demo/in
 
 In this section, you can find the updates for each release of `nile-elements`. It's a good practice to maintain detailed release notes to help users and developers understand what changes have been made from one version to another and how these changes might affect their projects.
 
+#### Version 1.7.6 (May 19, 2026)
+- Nile Detail: Improvement in the Selection Variant (UIF-1231)
+
 #### Version 1.7.5 (May 18, 2026)
 - Nile OTP Input: Fixed Value Color for NxtGen (UIF-1228)
 

package/dist/index.js

@@ -17544,7 +17544,7 @@ nile-rich-text-editor[disabled] .editor a {
               </span>
             `:B}
       </button>
-    `}};e([ue({type:String,reflect:!0})],GS.prototype,"color",void 0),e([ue({type:Boolean,reflect:!0})],GS.prototype,"active",void 0),GS=e([ge("nile-color-swatch")],GS);"undefined"!=typeof window&&(window.nileElementsVersion='"1.7.5"',window.nileVersion="__NILE_VERSION__",window.process=window.process||{env:{NODE_ENV:"production"}});const FS=r`
+    `}};e([ue({type:String,reflect:!0})],GS.prototype,"color",void 0),e([ue({type:Boolean,reflect:!0})],GS.prototype,"active",void 0),GS=e([ge("nile-color-swatch")],GS);"undefined"!=typeof window&&(window.nileElementsVersion='"1.7.6"',window.nileVersion="__NILE_VERSION__",window.process=window.process||{env:{NODE_ENV:"production"}});const FS=r`
  :host {
   
   top: 0;
@@ -19194,6 +19194,11 @@ a {
     padding: var(--nile-spacing-xl, var(--ng-spacing-xl));
   }
 
+  .detail__content:not(:has(*)) {
+    display: none;
+    padding: 0;
+  }
+
   /* ── Selection variant ──────────────────────────────────────────────────── */
 
   .detail__selection-label {
@@ -19238,6 +19243,23 @@ a {
     min-width: 0;
   }
 
+  .detail__selection-search-slot {
+    display: flex;
+    flex: 1;
+    min-width: 0;
+  }
+
+  .detail__selection-search-slot::slotted(*) {
+    flex: 1;
+    min-width: 0;
+  }
+
+  .detail__selected-toggle {
+    display: inline-flex;
+    align-items: center;
+    gap: 6px;
+  }
+
   .detail__selection-actions {
     display: flex;
     align-items: center;
@@ -19251,7 +19273,7 @@ a {
     gap: 8px 24px;
     overflow-x: auto;
     overflow-y: hidden;
-    padding-bottom: 8px;
+    padding: 4px 4px 8px;
     scroll-snap-type: x proximity;
   }
 
@@ -19298,7 +19320,8 @@ a {
     min-width: 0;
     display: block;
     max-width: 100%;
-    overflow: hidden;
+    overflow: visible;
+    padding-left: 4px;
   }
 
   .detail__selection-checkbox {
@@ -19423,7 +19446,7 @@ a {
     background: rgba(0, 0, 0, 0.2);
     border-radius: 4px;
   }
-`;async function ck(e){if(!e.open&&!e.disabled)return e.open=!0,Ht(e,"nile-after-show")}async function uk(e){if(e.open&&!e.disabled)return e.open=!1,Ht(e,"nile-after-hide")}Pt("detail.show",{keyframes:[{height:"0",opacity:"0"},{height:"auto",opacity:"1"}],options:{duration:300,easing:"ease"}}),Pt("detail.hide",{keyframes:[{height:"auto",opacity:"1"},{height:"0",opacity:"0"}],options:{duration:300,easing:"ease"}});const Dk="undefined"!=typeof window;let dk=class extends Fe{constructor(){super(...arguments),this.open=!1,this.heading="",this.description="",this.expandIconPlacement="right",this.disabled=!1,this.variant="default",this.items=[],this.selected=[],this.allowHtmlLabel=!1,this.disableLocalSearch=!1,this.pageSize=200,this.placeholderLabel="Loading…",this.searchPlaceholder="Search...",this.itemsLabel="attributes",this.restoreLabel="Restore",this.clearLabel="Clear",this.gridRows=6,this.gridColumns=3,this.minColumnWidth="220px",this.laneHeight=32,this.orientation="horizontal",this.maxHeight="320px",this.matrixColumns=20,this.virtualize=!1,this.virtualizeThreshold=60,this.overscan=4,this._detailOpen=!1,this._searchTerm="",this._selectedSet=new Set,this._restoreDefaults=null,this._gridResizeObserver=null,this._virtCtrl=null,this._rowVirtCtrl=null,this._colVirtCtrl=null,this._pageCache=new Map,this._pendingPages=new Set}get _isInfiniteMode(){return"selection"===this.variant&&"function"==typeof this.fetchPage&&"number"==typeof this.totalCount&&"both"!==this.orientation}_effectiveTotalCount(){return this._isInfiniteMode?this.totalCount??0:this._filteredItems.length}_getItemAt(e){if(!this._isInfiniteMode)return this._filteredItems[e];const t=Math.max(1,this.pageSize),i=Math.floor(e/t),M=this._pageCache.get(i);return M?M[e-i*t]:void 0}_scheduleFetchForRange(e,t){if(!this._isInfiniteMode||!this.fetchPage)return;const i=Math.max(1,this.pageSize),M=this.totalCount??0;if(M<=0)return;const n=Math.floor(e/i),o=Math.floor(Math.min(t,M-1)/i);for(let e=n;e<=o;e++)this._pageCache.has(e)||this._pendingPages.has(e)||this._loadPage(e)}async _loadPage(e){if(!this.fetchPage)return;const t=Math.max(1,this.pageSize),i=e*t,M=this.totalCount??0,n=Math.min(t,Math.max(0,M-i));if(!(n<=0)){this._pendingPages.add(e);try{const t=await this.fetchPage(i,n);this._pageCache.set(e,Array.isArray(t)?t:[]),this.dispatchEvent(new CustomEvent("nile-page-load",{detail:{pageIndex:e,offset:i,limit:n,rows:this._pageCache.get(e)},bubbles:!0,composed:!0}))}catch(t){this.dispatchEvent(new CustomEvent("nile-page-error",{detail:{pageIndex:e,offset:i,limit:n,error:t},bubbles:!0,composed:!0}))}finally{this._pendingPages.delete(e),this.requestUpdate()}}}resetPages(){this._pageCache=new Map,this._pendingPages=new Set,this.requestUpdate()}get _isVirtualized(){return!!Dk&&(!!this._isInfiniteMode||"selection"===this.variant&&(this.virtualize||this.items.length>this.virtualizeThreshold))}get _columnWidthPx(){const e=parseInt(this.minColumnWidth,10);return Number.isFinite(e)&&e>0?e:220}firstUpdated(){this._detailOpen=this.open,this.body.hidden=!this.open,this.body.style.height=this.open?"auto":"0",this._syncSelectedFromProperty(),null===this._restoreDefaults&&(this._restoreDefaults=[...this._selectedSet]),this._setupGridResizeObserver()}disconnectedCallback(){super.disconnectedCallback(),this._gridResizeObserver?.disconnect(),this._gridResizeObserver=null}updated(e){"selection"===this.variant&&(this._setupGridResizeObserver(),this._syncVirtualizer(),this._scheduleTooltipOverflowCheck())}_syncVirtualizer(){if(!Dk)return;if(!this._isVirtualized)return this._virtCtrl=null,this._rowVirtCtrl=null,void(this._colVirtCtrl=null);const e=this.shadowRoot?.querySelector(".detail__selection-grid");if(!e)return;if("both"===this.orientation)return this._virtCtrl=null,void this._syncBothVirtualizers();this._rowVirtCtrl=null,this._colVirtCtrl=null;const t=this._effectiveTotalCount(),i="vertical"===this.orientation,M=Math.max(1,i?this.gridColumns:this.gridRows),n=i?this.laneHeight:this._columnWidthPx;if(!this._virtCtrl)return void(this._virtCtrl=new no(this,{count:t,getScrollElement:()=>this.shadowRoot?.querySelector(".detail__selection-grid"),estimateSize:()=>n,horizontal:!i,lanes:M,overscan:this.overscan}));const o=this._virtCtrl.getVirtualizer(),r=o.options,s=!!r.horizontal!=!i;(r.count!==t||r.lanes!==M||r.overscan!==this.overscan||s)&&(o.setOptions({...r,count:t,lanes:M,overscan:this.overscan,horizontal:!i,estimateSize:()=>n}),o.measure())}_syncBothVirtualizers(){const e=this._filteredItems.length,t=Math.max(1,this.matrixColumns),i=Math.max(1,Math.ceil(e/t)),M=this._columnWidthPx,n=this.laneHeight,o=()=>this.shadowRoot?.querySelector(".detail__selection-grid");if(this._rowVirtCtrl){const e=this._rowVirtCtrl.getVirtualizer(),t=e.options;t.count===i&&t.overscan===this.overscan||(e.setOptions({...t,count:i,overscan:this.overscan,estimateSize:()=>n}),e.measure())}else this._rowVirtCtrl=new no(this,{count:i,getScrollElement:o,estimateSize:()=>n,horizontal:!1,overscan:this.overscan});if(this._colVirtCtrl){const e=this._colVirtCtrl.getVirtualizer(),i=e.options;i.count===t&&i.overscan===this.overscan||(e.setOptions({...i,count:t,overscan:this.overscan,estimateSize:()=>M}),e.measure())}else this._colVirtCtrl=new no(this,{count:t,getScrollElement:o,estimateSize:()=>M,horizontal:!0,overscan:this.overscan})}_setupGridResizeObserver(){if("selection"!==this.variant)return;if("undefined"==typeof ResizeObserver)return;const e=this.shadowRoot?.querySelector(".detail__selection-grid");e&&(this._gridResizeObserver||(this._gridResizeObserver=new ResizeObserver((()=>this._scheduleTooltipOverflowCheck())),this._gridResizeObserver.observe(e)))}_scheduleTooltipOverflowCheck(){"undefined"!=typeof requestAnimationFrame&&requestAnimationFrame((()=>this._updateTooltipOverflowStates()))}async _updateTooltipOverflowStates(){const e=this.shadowRoot?.querySelectorAll(".detail__selection-tooltip");if(e)for(const t of e){const e=t.querySelector("nile-checkbox");if(!e)continue;e.updateComplete&&await e.updateComplete;const i=e.shadowRoot?.querySelector('[part="label"]');!!i&&i.scrollWidth>i.clientWidth+1?t.removeAttribute("disabled"):t.setAttribute("disabled","")}}_onSelectedPropertyChange(){this._syncSelectedFromProperty()}_onConfigChange(){this._applyConfig()}_applyConfig(){const e=this.config;if(e){if(void 0!==e.variant&&(this.variant=e.variant),void 0!==e.heading&&(this.heading=e.heading),void 0!==e.description&&(this.description=e.description),void 0!==e.itemsLabel&&(this.itemsLabel=e.itemsLabel),void 0!==e.open&&(this.open=e.open),void 0!==e.disabled&&(this.disabled=e.disabled),void 0!==e.items&&(this.items=e.items),void 0!==e.selected&&(this.selected=e.selected),void 0!==e.renderItemConfig&&(this.renderItemConfig=e.renderItemConfig),void 0!==e.allowHtmlLabel&&(this.allowHtmlLabel=e.allowHtmlLabel),e.layout){const t=e.layout;void 0!==t.orientation&&(this.orientation=t.orientation),void 0!==t.gridRows&&(this.gridRows=t.gridRows),void 0!==t.gridColumns&&(this.gridColumns=t.gridColumns),void 0!==t.matrixColumns&&(this.matrixColumns=t.matrixColumns),void 0!==t.minColumnWidth&&(this.minColumnWidth=t.minColumnWidth),void 0!==t.laneHeight&&(this.laneHeight=t.laneHeight),void 0!==t.maxHeight&&(this.maxHeight=t.maxHeight),void 0!==t.expandIconPlacement&&(this.expandIconPlacement=t.expandIconPlacement)}e.search&&(void 0!==e.search.placeholder&&(this.searchPlaceholder=e.search.placeholder),void 0!==e.search.disableLocal&&(this.disableLocalSearch=e.search.disableLocal)),e.virtualization&&(void 0!==e.virtualization.enabled&&(this.virtualize=e.virtualization.enabled),void 0!==e.virtualization.threshold&&(this.virtualizeThreshold=e.virtualization.threshold),void 0!==e.virtualization.overscan&&(this.overscan=e.virtualization.overscan)),e.pagination&&(void 0!==e.pagination.totalCount&&(this.totalCount=e.pagination.totalCount),void 0!==e.pagination.pageSize&&(this.pageSize=e.pagination.pageSize),void 0!==e.pagination.fetchPage&&(this.fetchPage=e.pagination.fetchPage),void 0!==e.pagination.placeholderLabel&&(this.placeholderLabel=e.pagination.placeholderLabel)),e.labels&&(void 0!==e.labels.restore&&(this.restoreLabel=e.labels.restore),void 0!==e.labels.clear&&(this.clearLabel=e.labels.clear))}}_syncSelectedFromProperty(){this._selectedSet=new Set(this.selected||[])}_getItemValue(e){const t=this.renderItemConfig;return t?.getValue?String(t.getValue(e)):"string"==typeof e?e:String(e.value??"")}_getItemLabel(e){const t=this.renderItemConfig;return t?.getDisplayText?t.getDisplayText(e):"string"==typeof e?e:e.label??this._getItemValue(e)}_getItemSearchText(e){const t=this.renderItemConfig;return t?.getSearchText?t.getSearchText(e):this._getItemLabel(e)}_getItemDescription(e){const t=this.renderItemConfig;return t?.getDescription?t.getDescription(e)??"":"string"==typeof e?"":e.description??""}_getItemPrefix(e){const t=this.renderItemConfig;return t?.getPrefix?t.getPrefix(e)??"":"string"==typeof e?"":e.prefix??""}_getItemSuffix(e){const t=this.renderItemConfig;return t?.getSuffix?t.getSuffix(e)??"":"string"==typeof e?"":e.suffix??""}_getItemDisabled(e){const t=this.renderItemConfig;return t?.getDisabled?!!t.getDisabled(e):"string"!=typeof e&&!!e.disabled}_getItemClassName(e){const t=this.renderItemConfig;return t?.getClassName?t.getClassName(e)??"":"string"==typeof e?"":e.className??""}get _filteredItems(){if(this.disableLocalSearch)return this.items;const e=this._searchTerm.trim().toLowerCase();return e?this.items.filter((t=>this._getItemSearchText(t).toLowerCase().includes(e))):this.items}_selectableValues(){return(this._isInfiniteMode?Array.from(this._pageCache.values()).flat():this.items).filter((e=>!this._getItemDisabled(e))).map((e=>this._getItemValue(e)))}get _allChecked(){const e=this._selectableValues();return 0!==e.length&&e.every((e=>this._selectedSet.has(e)))}get _indeterminate(){const e=this._selectableValues(),t=e.filter((e=>this._selectedSet.has(e))).length;return t>0&&t<e.length}get _countLabel(){const e=this._isInfiniteMode?this.totalCount??0:this.items.length;return`${this._selectedSet.size} of ${e} ${this.itemsLabel} selected`}_emitSelectionChange(){this.selected=[...this._selectedSet],this.dispatchEvent(new CustomEvent("nile-change",{detail:{selected:[...this._selectedSet]},bubbles:!0,composed:!0}))}_onItemChange(e,t,i){if(t)return void i.preventDefault();const M=i.target,n=new Set(this._selectedSet);M.checked?n.add(e):n.delete(e),this._selectedSet=n,this._emitSelectionChange()}_onSelectAllChange(e){const t=e.target,i=this._selectableValues(),M=new Set(this._selectedSet);t.checked?i.forEach((e=>M.add(e))):i.forEach((e=>M.delete(e))),this._selectedSet=M,this._emitSelectionChange()}_emitSearch(e){this.dispatchEvent(new CustomEvent("nile-search",{detail:{value:e},bubbles:!0,composed:!0}))}_onSearchInput(e){const t=e.target.value??"";this._searchTerm=t,this.disableLocalSearch&&this._emitSearch(t)}_onSearchClear(){this._searchTerm="",this.disableLocalSearch&&this._emitSearch("")}_onRestore(e){e.preventDefault();const t=this._restoreDefaults??this._selectableValues();this._selectedSet=new Set(t),this._emitSelectionChange()}_onClear(e){e.preventDefault(),this._selectedSet=new Set,this._emitSelectionChange()}_stopHeaderToggle(e){e.stopPropagation()}_handleSummaryClick(e){e.preventDefault(),function(e){e.disabled||(e.open?uk(e):ck(e))}(this)}_handleSummaryKeyDown(e){!function(e,t){e.preventDefault(),"Enter"!==e.key&&" "!==e.key||(t.open?uk(t):ck(t)),"ArrowUp"!==e.key&&"ArrowLeft"!==e.key||uk(t),"ArrowDown"!==e.key&&"ArrowRight"!==e.key||ck(t)}(e,this)}async handleOpenChange(){this.open?(this._detailOpen=!0,await async function(e){if(e.emit("nile-show",{cancelable:!0}).defaultPrevented)return void(e.open=!1);await Ct(e.body),e.body.hidden=!1;const{keyframes:t,options:i}=Wt(e,"detail.show",{dir:"ltr"});await vt(e.body,Ut(t,e.body.scrollHeight),i),e.body.style.height="auto",e.emit("nile-after-show")}(this)):(await async function(e){if(e.emit("nile-hide",{cancelable:!0}).defaultPrevented)return void(e.open=!0);await Ct(e.body);const{keyframes:t,options:i}=Wt(e,"detail.hide",{dir:"ltr"});await vt(e.body,Ut(t,e.body.scrollHeight),i),e.body.hidden=!0,e.body.style.height="auto",e.emit("nile-after-hide")}(this),this._detailOpen=!1)}async show(){return ck(this)}async hide(){return uk(this)}get _summaryLabel(){return[this.heading,this.description].filter(Boolean).join(", ")}_renderSelectionLabel(){return _`
+`;async function ck(e){if(!e.open&&!e.disabled)return e.open=!0,Ht(e,"nile-after-show")}async function uk(e){if(e.open&&!e.disabled)return e.open=!1,Ht(e,"nile-after-hide")}Pt("detail.show",{keyframes:[{height:"0",opacity:"0"},{height:"auto",opacity:"1"}],options:{duration:300,easing:"ease"}}),Pt("detail.hide",{keyframes:[{height:"auto",opacity:"1"},{height:"0",opacity:"0"}],options:{duration:300,easing:"ease"}});const Dk="undefined"!=typeof window;let dk=class extends Fe{constructor(){super(...arguments),this.open=!1,this.heading="",this.description="",this.expandIconPlacement="right",this.disabled=!1,this.variant="default",this.items=[],this.selected=[],this.allowHtmlLabel=!1,this.disableLocalSearch=!1,this.pageSize=200,this.placeholderLabel="Loading…",this.searchPlaceholder="Search...",this.itemsLabel="attributes",this.restoreLabel="Restore",this.clearLabel="Clear",this.gridRows=6,this.gridColumns=3,this.minColumnWidth="220px",this.laneHeight=32,this.orientation="horizontal",this.maxHeight="320px",this.matrixColumns=20,this.virtualize=!1,this.virtualizeThreshold=60,this.overscan=4,this._detailOpen=!1,this._searchTerm="",this._selectedSet=new Set,this._showSelectedOnly=!1,this.showSelectedToggle=!1,this.selectedOnlyLabel="Selected",this.showAllLabel="Show all",this._restoreDefaults=null,this._gridResizeObserver=null,this._virtCtrl=null,this._rowVirtCtrl=null,this._colVirtCtrl=null,this._pageCache=new Map,this._pendingPages=new Set}get _isInfiniteMode(){return"selection"===this.variant&&"function"==typeof this.fetchPage&&"number"==typeof this.totalCount&&"both"!==this.orientation}_effectiveTotalCount(){return this._isInfiniteMode?this.totalCount??0:this._filteredItems.length}_getItemAt(e){if(!this._isInfiniteMode)return this._filteredItems[e];const t=Math.max(1,this.pageSize),i=Math.floor(e/t),M=this._pageCache.get(i);return M?M[e-i*t]:void 0}_scheduleFetchForRange(e,t){if(!this._isInfiniteMode||!this.fetchPage)return;const i=Math.max(1,this.pageSize),M=this.totalCount??0;if(M<=0)return;const n=Math.floor(e/i),o=Math.floor(Math.min(t,M-1)/i);for(let e=n;e<=o;e++)this._pageCache.has(e)||this._pendingPages.has(e)||this._loadPage(e)}async _loadPage(e){if(!this.fetchPage)return;const t=Math.max(1,this.pageSize),i=e*t,M=this.totalCount??0,n=Math.min(t,Math.max(0,M-i));if(!(n<=0)){this._pendingPages.add(e);try{const t=await this.fetchPage(i,n);this._pageCache.set(e,Array.isArray(t)?t:[]),this.dispatchEvent(new CustomEvent("nile-page-load",{detail:{pageIndex:e,offset:i,limit:n,rows:this._pageCache.get(e)},bubbles:!0,composed:!0}))}catch(t){this.dispatchEvent(new CustomEvent("nile-page-error",{detail:{pageIndex:e,offset:i,limit:n,error:t},bubbles:!0,composed:!0}))}finally{this._pendingPages.delete(e),this.requestUpdate()}}}resetPages(){this._pageCache=new Map,this._pendingPages=new Set,this.requestUpdate()}get _isVirtualized(){return!!Dk&&(!!this._isInfiniteMode||"selection"===this.variant&&(this.virtualize||this.items.length>this.virtualizeThreshold))}get _columnWidthPx(){const e=parseInt(this.minColumnWidth,10);return Number.isFinite(e)&&e>0?e:220}firstUpdated(){this._detailOpen=this.open,this.body.hidden=!this.open,this.body.style.height=this.open?"auto":"0",this._syncSelectedFromProperty(),null===this._restoreDefaults&&(this._restoreDefaults=[...this._selectedSet]),this._setupGridResizeObserver()}disconnectedCallback(){super.disconnectedCallback(),this._gridResizeObserver?.disconnect(),this._gridResizeObserver=null}updated(e){"selection"===this.variant&&(this._setupGridResizeObserver(),this._syncVirtualizer(),this._scheduleTooltipOverflowCheck())}_syncVirtualizer(){if(!Dk)return;if(!this._isVirtualized)return this._virtCtrl=null,this._rowVirtCtrl=null,void(this._colVirtCtrl=null);const e=this.shadowRoot?.querySelector(".detail__selection-grid");if(!e)return;if("both"===this.orientation)return this._virtCtrl=null,void this._syncBothVirtualizers();this._rowVirtCtrl=null,this._colVirtCtrl=null;const t=this._effectiveTotalCount(),i="vertical"===this.orientation,M=Math.max(1,i?this.gridColumns:this.gridRows),n=i?this.laneHeight:this._columnWidthPx;if(!this._virtCtrl)return void(this._virtCtrl=new no(this,{count:t,getScrollElement:()=>this.shadowRoot?.querySelector(".detail__selection-grid"),estimateSize:()=>n,horizontal:!i,lanes:M,overscan:this.overscan}));const o=this._virtCtrl.getVirtualizer(),r=o.options,s=!!r.horizontal!=!i;(r.count!==t||r.lanes!==M||r.overscan!==this.overscan||s)&&(o.setOptions({...r,count:t,lanes:M,overscan:this.overscan,horizontal:!i,estimateSize:()=>n}),o.measure())}_syncBothVirtualizers(){const e=this._filteredItems.length,t=Math.max(1,this.matrixColumns),i=Math.max(1,Math.ceil(e/t)),M=this._columnWidthPx,n=this.laneHeight,o=()=>this.shadowRoot?.querySelector(".detail__selection-grid");if(this._rowVirtCtrl){const e=this._rowVirtCtrl.getVirtualizer(),t=e.options;t.count===i&&t.overscan===this.overscan||(e.setOptions({...t,count:i,overscan:this.overscan,estimateSize:()=>n}),e.measure())}else this._rowVirtCtrl=new no(this,{count:i,getScrollElement:o,estimateSize:()=>n,horizontal:!1,overscan:this.overscan});if(this._colVirtCtrl){const e=this._colVirtCtrl.getVirtualizer(),i=e.options;i.count===t&&i.overscan===this.overscan||(e.setOptions({...i,count:t,overscan:this.overscan,estimateSize:()=>M}),e.measure())}else this._colVirtCtrl=new no(this,{count:t,getScrollElement:o,estimateSize:()=>M,horizontal:!0,overscan:this.overscan})}_setupGridResizeObserver(){if("selection"!==this.variant)return;if("undefined"==typeof ResizeObserver)return;const e=this.shadowRoot?.querySelector(".detail__selection-grid");e&&(this._gridResizeObserver||(this._gridResizeObserver=new ResizeObserver((()=>this._scheduleTooltipOverflowCheck())),this._gridResizeObserver.observe(e)))}_scheduleTooltipOverflowCheck(){"undefined"!=typeof requestAnimationFrame&&requestAnimationFrame((()=>this._updateTooltipOverflowStates()))}async _updateTooltipOverflowStates(){const e=this.shadowRoot?.querySelectorAll(".detail__selection-tooltip");if(e)for(const t of e){const e=t.querySelector("nile-checkbox");if(!e)continue;e.updateComplete&&await e.updateComplete;const i=e.shadowRoot?.querySelector('[part="label"]');!!i&&i.scrollWidth>i.clientWidth+1?t.removeAttribute("disabled"):t.setAttribute("disabled","")}}_onSelectedPropertyChange(){this._syncSelectedFromProperty()}_onConfigChange(){this._applyConfig()}_applyConfig(){const e=this.config;if(e){if(void 0!==e.variant&&(this.variant=e.variant),void 0!==e.heading&&(this.heading=e.heading),void 0!==e.description&&(this.description=e.description),void 0!==e.itemsLabel&&(this.itemsLabel=e.itemsLabel),void 0!==e.open&&(this.open=e.open),void 0!==e.disabled&&(this.disabled=e.disabled),void 0!==e.items&&(this.items=e.items),void 0!==e.selected&&(this.selected=e.selected),void 0!==e.renderItemConfig&&(this.renderItemConfig=e.renderItemConfig),void 0!==e.allowHtmlLabel&&(this.allowHtmlLabel=e.allowHtmlLabel),e.layout){const t=e.layout;void 0!==t.orientation&&(this.orientation=t.orientation),void 0!==t.gridRows&&(this.gridRows=t.gridRows),void 0!==t.gridColumns&&(this.gridColumns=t.gridColumns),void 0!==t.matrixColumns&&(this.matrixColumns=t.matrixColumns),void 0!==t.minColumnWidth&&(this.minColumnWidth=t.minColumnWidth),void 0!==t.laneHeight&&(this.laneHeight=t.laneHeight),void 0!==t.maxHeight&&(this.maxHeight=t.maxHeight),void 0!==t.expandIconPlacement&&(this.expandIconPlacement=t.expandIconPlacement)}e.search&&(void 0!==e.search.placeholder&&(this.searchPlaceholder=e.search.placeholder),void 0!==e.search.disableLocal&&(this.disableLocalSearch=e.search.disableLocal)),e.virtualization&&(void 0!==e.virtualization.enabled&&(this.virtualize=e.virtualization.enabled),void 0!==e.virtualization.threshold&&(this.virtualizeThreshold=e.virtualization.threshold),void 0!==e.virtualization.overscan&&(this.overscan=e.virtualization.overscan)),e.pagination&&(void 0!==e.pagination.totalCount&&(this.totalCount=e.pagination.totalCount),void 0!==e.pagination.pageSize&&(this.pageSize=e.pagination.pageSize),void 0!==e.pagination.fetchPage&&(this.fetchPage=e.pagination.fetchPage),void 0!==e.pagination.placeholderLabel&&(this.placeholderLabel=e.pagination.placeholderLabel)),e.labels&&(void 0!==e.labels.restore&&(this.restoreLabel=e.labels.restore),void 0!==e.labels.clear&&(this.clearLabel=e.labels.clear),void 0!==e.labels.selectedOnly&&(this.selectedOnlyLabel=e.labels.selectedOnly),void 0!==e.labels.showAll&&(this.showAllLabel=e.labels.showAll)),void 0!==e.showSelectedToggle&&(this.showSelectedToggle=e.showSelectedToggle)}}_syncSelectedFromProperty(){this._selectedSet=new Set(this.selected||[])}_getItemValue(e){const t=this.renderItemConfig;return t?.getValue?String(t.getValue(e)):"string"==typeof e?e:String(e.value??"")}_getItemLabel(e){const t=this.renderItemConfig;return t?.getDisplayText?t.getDisplayText(e):"string"==typeof e?e:e.label??this._getItemValue(e)}_getItemSearchText(e){const t=this.renderItemConfig;return t?.getSearchText?t.getSearchText(e):this._getItemLabel(e)}_getItemDescription(e){const t=this.renderItemConfig;return t?.getDescription?t.getDescription(e)??"":"string"==typeof e?"":e.description??""}_getItemPrefix(e){const t=this.renderItemConfig;return t?.getPrefix?t.getPrefix(e)??"":"string"==typeof e?"":e.prefix??""}_getItemSuffix(e){const t=this.renderItemConfig;return t?.getSuffix?t.getSuffix(e)??"":"string"==typeof e?"":e.suffix??""}_getItemDisabled(e){const t=this.renderItemConfig;return t?.getDisabled?!!t.getDisabled(e):"string"!=typeof e&&!!e.disabled}_getItemClassName(e){const t=this.renderItemConfig;return t?.getClassName?t.getClassName(e)??"":"string"==typeof e?"":e.className??""}get _filteredItems(){let e=this.items;if(this._showSelectedOnly&&(e=e.filter((e=>this._selectedSet.has(this._getItemValue(e))))),this.disableLocalSearch)return e;const t=this._searchTerm.trim().toLowerCase();return t?e.filter((e=>this._getItemSearchText(e).toLowerCase().includes(t))):e}_onToggleSelectedOnly(e){e.preventDefault();const t=!this._showSelectedOnly;t&&0===this._selectedSet.size||(this._showSelectedOnly=t)}_selectableValues(){return(this._isInfiniteMode?Array.from(this._pageCache.values()).flat():this.items).filter((e=>!this._getItemDisabled(e))).map((e=>this._getItemValue(e)))}get _allChecked(){const e=this._selectableValues();return 0!==e.length&&e.every((e=>this._selectedSet.has(e)))}get _indeterminate(){const e=this._selectableValues(),t=e.filter((e=>this._selectedSet.has(e))).length;return t>0&&t<e.length}get _countLabel(){const e=this._isInfiniteMode?this.totalCount??0:this.items.length;return`${this._selectedSet.size} of ${e} ${this.itemsLabel} selected`}_emitSelectionChange(){this.selected=[...this._selectedSet],this.dispatchEvent(new CustomEvent("nile-change",{detail:{selected:[...this._selectedSet]},bubbles:!0,composed:!0}))}_onItemChange(e,t,i){if(t)return void i.preventDefault();const M=i.target,n=new Set(this._selectedSet);M.checked?n.add(e):n.delete(e),this._selectedSet=n,this._emitSelectionChange()}_onSelectAllChange(e){const t=e.target,i=this._selectableValues(),M=new Set(this._selectedSet);t.checked?i.forEach((e=>M.add(e))):i.forEach((e=>M.delete(e))),this._selectedSet=M,this._emitSelectionChange()}_emitSearch(e){this.dispatchEvent(new CustomEvent("nile-search",{detail:{value:e},bubbles:!0,composed:!0}))}_onSearchInput(e){const t=e.target.value??"";this._searchTerm=t,this.disableLocalSearch&&this._emitSearch(t)}_onSearchClear(){this._searchTerm="",this.disableLocalSearch&&this._emitSearch("")}_onRestore(e){e.preventDefault();const t=this._restoreDefaults??this._selectableValues();this._selectedSet=new Set(t),this._emitSelectionChange()}_onClear(e){e.preventDefault(),this._selectedSet=new Set,this._showSelectedOnly=!1,this._emitSelectionChange()}_stopHeaderToggle(e){e.stopPropagation()}_handleSummaryClick(e){e.preventDefault(),function(e){e.disabled||(e.open?uk(e):ck(e))}(this)}_handleSummaryKeyDown(e){!function(e,t){e.preventDefault(),"Enter"!==e.key&&" "!==e.key||(t.open?uk(t):ck(t)),"ArrowUp"!==e.key&&"ArrowLeft"!==e.key||uk(t),"ArrowDown"!==e.key&&"ArrowRight"!==e.key||ck(t)}(e,this)}async handleOpenChange(){this.open?(this._detailOpen=!0,await async function(e){if(e.emit("nile-show",{cancelable:!0}).defaultPrevented)return void(e.open=!1);await Ct(e.body),e.body.hidden=!1;const{keyframes:t,options:i}=Wt(e,"detail.show",{dir:"ltr"});await vt(e.body,Ut(t,e.body.scrollHeight),i),e.body.style.height="auto",e.emit("nile-after-show")}(this)):(await async function(e){if(e.emit("nile-hide",{cancelable:!0}).defaultPrevented)return void(e.open=!0);await Ct(e.body);const{keyframes:t,options:i}=Wt(e,"detail.hide",{dir:"ltr"});await vt(e.body,Ut(t,e.body.scrollHeight),i),e.body.hidden=!0,e.body.style.height="auto",e.emit("nile-after-hide")}(this),this._detailOpen=!1)}async show(){return ck(this)}async hide(){return uk(this)}get _summaryLabel(){return[this.heading,this.description].filter(Boolean).join(", ")}_renderSelectionLabel(){return _`
       <div part="selection-label" class="detail__selection-label">
         <nile-checkbox
           part="select-all"
@@ -19441,21 +19464,36 @@ a {
       </div>
     `}_renderSelectionBody(){const e=this._isVirtualized,t="vertical"===this.orientation,i="both"===this.orientation,M=this.laneHeight,n=this._columnWidthPx;let o="";if(e)if(i)o=`max-height: ${this.maxHeight}; height: ${this.maxHeight};`;else if(t)o=`max-height: ${this.maxHeight}; height: ${this.maxHeight};`;else{o=`height: ${Math.max(1,this.gridRows)*M}px;`}else if(t){o=`grid-template-columns: repeat(${Math.max(1,this.gridColumns)}, minmax(0, 1fr)); grid-auto-flow: row; max-height: ${this.maxHeight}; overflow-y: auto; overflow-x: hidden;`}else{o=`grid-template-rows: repeat(${Math.max(1,this.gridRows)}, auto); grid-auto-columns: minmax(${this.minColumnWidth}, 1fr);`}return _`
       <div part="selection-toolbar" class="detail__selection-toolbar">
-        <nile-input
-          part="search"
-          class="detail__selection-search"
-          placeholder=${this.searchPlaceholder}
-          clearable
-          .value=${this._searchTerm}
-          @nile-input=${this._onSearchInput}
-          @nile-clear=${this._onSearchClear}
-        >
-          <nile-icon slot="prefix" name="search" library="system"></nile-icon>
-        </nile-input>
-        <div part="selection-actions" class="detail__selection-actions">
+      <slot name="tooblar-actions-prefix"></slot>
+        <slot name="toolbar-search" class="detail__selection-search-slot">
+          <nile-input
+            part="search"
+            class="detail__selection-search"
+            placeholder=${this.searchPlaceholder}
+            clearable
+            .value=${this._searchTerm}
+            @nile-input=${this._onSearchInput}
+            @nile-clear=${this._onSearchClear}
+          >
+            <nile-icon slot="prefix" name="search" library="system"></nile-icon>
+          </nile-input>
+        </slot>
+        <slot name="toolbar-actions" class="detail__selection-actions">
+          ${this.showSelectedToggle?_`
+                <nile-link
+                  href="#"
+                  variant="subtle"
+                  class="detail__selected-toggle"
+                  @click=${this._onToggleSelectedOnly}
+                >
+                  <nile-icon slot="prefix" name="filter" library="system"></nile-icon>
+                  ${this._showSelectedOnly?this.showAllLabel:this.selectedOnlyLabel}
+                </nile-link>
+              `:B}
           <nile-link href="#" variant="subtle" @click=${this._onRestore}>${this.restoreLabel}</nile-link>
           <nile-link href="#" variant="subtle" @click=${this._onClear}>${this.clearLabel}</nile-link>
-        </div>
+        </slot>
+        <slot name="tooblar-actions-suffix"></slot>
       </div>
       <div
         part="selection-grid"
@@ -19549,7 +19587,7 @@ a {
           <slot id="content" class="detail__content"></slot>
         </div>
       </details>
-    `}};dk.styles=Nk,e([je("details")],dk.prototype,"detail",void 0),e([je("summary")],dk.prototype,"header",void 0),e([je(".detail__body")],dk.prototype,"body",void 0),e([ue({attribute:!0,type:Boolean,reflect:!0})],dk.prototype,"open",void 0),e([ue({attribute:!0,type:String,reflect:!0})],dk.prototype,"heading",void 0),e([ue({attribute:!0,type:String,reflect:!0})],dk.prototype,"description",void 0),e([ue({attribute:!0,reflect:!0})],dk.prototype,"expandIconPlacement",void 0),e([ue({attribute:!0,type:Boolean,reflect:!0})],dk.prototype,"disabled",void 0),e([ue({attribute:!0,type:String,reflect:!0})],dk.prototype,"variant",void 0),e([ue({attribute:!1,type:Array})],dk.prototype,"items",void 0),e([ue({attribute:!1,type:Array})],dk.prototype,"selected",void 0),e([ue({attribute:!1})],dk.prototype,"renderItemConfig",void 0),e([ue({attribute:"allow-html-label",type:Boolean})],dk.prototype,"allowHtmlLabel",void 0),e([ue({attribute:"disable-local-search",type:Boolean})],dk.prototype,"disableLocalSearch",void 0),e([ue({attribute:"total-count",type:Number})],dk.prototype,"totalCount",void 0),e([ue({attribute:"page-size",type:Number})],dk.prototype,"pageSize",void 0),e([ue({attribute:!1})],dk.prototype,"fetchPage",void 0),e([ue({attribute:"placeholder-label",type:String})],dk.prototype,"placeholderLabel",void 0),e([ue({attribute:!1})],dk.prototype,"config",void 0),e([ue({attribute:"search-placeholder",type:String})],dk.prototype,"searchPlaceholder",void 0),e([ue({attribute:"items-label",type:String})],dk.prototype,"itemsLabel",void 0),e([ue({attribute:"restore-label",type:String})],dk.prototype,"restoreLabel",void 0),e([ue({attribute:"clear-label",type:String})],dk.prototype,"clearLabel",void 0),e([ue({attribute:"grid-rows",type:Number})],dk.prototype,"gridRows",void 0),e([ue({attribute:"grid-columns",type:Number})],dk.prototype,"gridColumns",void 0),e([ue({attribute:"min-column-width",type:String})],dk.prototype,"minColumnWidth",void 0),e([ue({attribute:"lane-height",type:Number})],dk.prototype,"laneHeight",void 0),e([ue({attribute:!0,type:String,reflect:!0})],dk.prototype,"orientation",void 0),e([ue({attribute:"max-height",type:String})],dk.prototype,"maxHeight",void 0),e([ue({attribute:"matrix-columns",type:Number})],dk.prototype,"matrixColumns",void 0),e([ue({attribute:!0,type:Boolean})],dk.prototype,"virtualize",void 0),e([ue({attribute:"virtualize-threshold",type:Number})],dk.prototype,"virtualizeThreshold",void 0),e([ue({attribute:"overscan",type:Number})],dk.prototype,"overscan",void 0),e([De()],dk.prototype,"_detailOpen",void 0),e([De()],dk.prototype,"_searchTerm",void 0),e([De()],dk.prototype,"_selectedSet",void 0),e([We("selected",{waitUntilFirstUpdate:!1})],dk.prototype,"_onSelectedPropertyChange",null),e([We("config",{waitUntilFirstUpdate:!1})],dk.prototype,"_onConfigChange",null),e([We("open",{waitUntilFirstUpdate:!0})],dk.prototype,"handleOpenChange",null),dk=e([ge("nile-detail")],dk);const jk=r`
+    `}};dk.styles=Nk,e([je("details")],dk.prototype,"detail",void 0),e([je("summary")],dk.prototype,"header",void 0),e([je(".detail__body")],dk.prototype,"body",void 0),e([ue({attribute:!0,type:Boolean,reflect:!0})],dk.prototype,"open",void 0),e([ue({attribute:!0,type:String,reflect:!0})],dk.prototype,"heading",void 0),e([ue({attribute:!0,type:String,reflect:!0})],dk.prototype,"description",void 0),e([ue({attribute:!0,reflect:!0})],dk.prototype,"expandIconPlacement",void 0),e([ue({attribute:!0,type:Boolean,reflect:!0})],dk.prototype,"disabled",void 0),e([ue({attribute:!0,type:String,reflect:!0})],dk.prototype,"variant",void 0),e([ue({attribute:!1,type:Array})],dk.prototype,"items",void 0),e([ue({attribute:!1,type:Array})],dk.prototype,"selected",void 0),e([ue({attribute:!1})],dk.prototype,"renderItemConfig",void 0),e([ue({attribute:"allow-html-label",type:Boolean})],dk.prototype,"allowHtmlLabel",void 0),e([ue({attribute:"disable-local-search",type:Boolean})],dk.prototype,"disableLocalSearch",void 0),e([ue({attribute:"total-count",type:Number})],dk.prototype,"totalCount",void 0),e([ue({attribute:"page-size",type:Number})],dk.prototype,"pageSize",void 0),e([ue({attribute:!1})],dk.prototype,"fetchPage",void 0),e([ue({attribute:"placeholder-label",type:String})],dk.prototype,"placeholderLabel",void 0),e([ue({attribute:!1})],dk.prototype,"config",void 0),e([ue({attribute:"search-placeholder",type:String})],dk.prototype,"searchPlaceholder",void 0),e([ue({attribute:"items-label",type:String})],dk.prototype,"itemsLabel",void 0),e([ue({attribute:"restore-label",type:String})],dk.prototype,"restoreLabel",void 0),e([ue({attribute:"clear-label",type:String})],dk.prototype,"clearLabel",void 0),e([ue({attribute:"grid-rows",type:Number})],dk.prototype,"gridRows",void 0),e([ue({attribute:"grid-columns",type:Number})],dk.prototype,"gridColumns",void 0),e([ue({attribute:"min-column-width",type:String})],dk.prototype,"minColumnWidth",void 0),e([ue({attribute:"lane-height",type:Number})],dk.prototype,"laneHeight",void 0),e([ue({attribute:!0,type:String,reflect:!0})],dk.prototype,"orientation",void 0),e([ue({attribute:"max-height",type:String})],dk.prototype,"maxHeight",void 0),e([ue({attribute:"matrix-columns",type:Number})],dk.prototype,"matrixColumns",void 0),e([ue({attribute:!0,type:Boolean})],dk.prototype,"virtualize",void 0),e([ue({attribute:"virtualize-threshold",type:Number})],dk.prototype,"virtualizeThreshold",void 0),e([ue({attribute:"overscan",type:Number})],dk.prototype,"overscan",void 0),e([De()],dk.prototype,"_detailOpen",void 0),e([De()],dk.prototype,"_searchTerm",void 0),e([De()],dk.prototype,"_selectedSet",void 0),e([De()],dk.prototype,"_showSelectedOnly",void 0),e([ue({attribute:"show-selected-toggle",type:Boolean,reflect:!0})],dk.prototype,"showSelectedToggle",void 0),e([ue({attribute:"selected-only-label",type:String})],dk.prototype,"selectedOnlyLabel",void 0),e([ue({attribute:"show-all-label",type:String})],dk.prototype,"showAllLabel",void 0),e([We("selected",{waitUntilFirstUpdate:!1})],dk.prototype,"_onSelectedPropertyChange",null),e([We("config",{waitUntilFirstUpdate:!1})],dk.prototype,"_onConfigChange",null),e([We("open",{waitUntilFirstUpdate:!0})],dk.prototype,"handleOpenChange",null),dk=e([ge("nile-detail")],dk);const jk=r`
   :host {
     display: inline-block;
     -webkit-font-smoothing: var(--nile-webkit-font-smoothing, var(--ng-webkit-font-smoothing));