@nanoporetech-digital/components 8.0.0-alpha.2 → 8.0.0-alpha.4

package/dist/nano-components/{nano-data-table-DDBCyBmN.js → nano-data-table-wGnglzmF.js}

@@ -1,4 +1,4 @@
 /*!
  * Custom elements for Nanopore-Digital Web applications
  */
-import{i as t,h as n,F as e,a as o,j as i,e as s,f as a,r,c as l,d as h}from"./index-DXvE-U_j.js";import{h as c,t as d}from"./renderer-BUaAsDso.js";import{c as p}from"./math-BEqsTfVK.js";import{d as b}from"./throttle-C93FMm2Z.js";import{i as _,f as u}from"./scroll-iCYjzh9N.js";import{c as f}from"./index-Dw3NZx59.js";const m="nano-tbl",w=(t,n)=>{const e=globalThis[n];return null!=e&&t instanceof e},y=t=>{if(null!=t){if(w(t,"ArrayBuffer")||w(t,"MessagePort")||w(t,"ImageBitmap")||w(t,"OffscreenCanvas"))return[t];if("object"==typeof t)return t.constructor===Object&&(t=Object.values(t)),Array.isArray(t)?t.flatMap(y):y(t.buffer)}return[]};let v=0,g=0;const x=new Map,k=new Map,$=(n,e,o)=>{const i=new Worker(n,{name:e});return i.addEventListener("message",(({data:n})=>{if(n){const e=n[0],i=n[1],s=n[2];if(e===o){const e=n[3],[o,a,r]=x.get(i);if(x.delete(i),e){const n=e.isError?Object.assign(new Error(e.value.message),e.value):e.value;t(n),a(n)}else r&&r.forEach((t=>k.delete(t))),o(s)}else if(e===o+".cb")try{k.get(i)(...s)}catch(n){t(n)}}})),i},z=(t,n,e)=>(...o)=>new Promise(((i,s)=>{let a=v++,r=0,l=o.length,h=[i,s];for(x.set(a,h);r<l;r++)if("function"==typeof o[r]){const t=g++;k.set(t,o[r]),o[r]=[n+".cb",t],(h[2]=h[2]||[]).push(t)}const c=t=>t.postMessage([n,a,e,o],y(o));t.then?t.then(c):c(t)})),C=import("./table.worker-webIEBZt.js").then((t=>t.worker)),S=z(C,"stencil.table.worker","createWorkerStore"),T=z(C,"stencil.table.worker","syncConfigToWorker"),R=z(C,"stencil.table.worker","syncDataToWorker"),I=z(C,"stencil.table.worker","workerFilter"),D=z(C,"stencil.table.worker","workerSearch"),A=z(C,"stencil.table.worker","workerSort");function B(t){const n=JSON.parse(JSON.stringify(t));return t.forEach((t=>{t?.sortCompareFn&&(n.find((n=>n.prop===t.prop)).sortCompareFn=t.sortCompareFn.toString())})),n}const F=new WeakMap;function P(t,n){const e=j(),o=e.config.state.columns,i=e.data.state.rows,s=o[n],a=s?.prop,r=i[t];return{prop:a,cellModel:r?r[o[n].prop]:"",column:s,rowIndex:t,rowModel:r}}function E(t,n){if(!n)return t;const e={...n,...t};return n.class&&("object"==typeof n.class&&"object"==typeof e.class?e.class={...n.class,...e.class}:"string"==typeof n.class&&"object"==typeof e.class?e.class[n.class]=!0:"string"==typeof e.class&&"string"==typeof n.class&&(e.class+=" "+n.class)),n.style&&(e.style={...n.style,...e.style}),e}function j(){return t=o(i()),F.get(t);var t}function M(t){const o=t?.columnTemplate;return o?o(n,t):n(e,null,t.title)}function N(t,n,e=!1){const o={[`${m}__${t}`]:!0,[`${m}__pin`]:!!n,[`${m}__pin--top`]:"top"===n,[`${m}__pin--bottom`]:"bottom"===n};return e?O(o):o}function O(t){let n="";return Object.entries(t).forEach((([t,e])=>{e&&(n+=t+" ")})),n}const H=({column:t,onColumnSortClick:n,defaults:o})=>{if(t.hidden)return c(e,null);function i(){return!!o.sortable&&!1!==t.sortable||!o.sortable&&!0===t.sortable}let s={};t.columnProperties&&(s=t.columnProperties(t)||s);const a={class:{...N("th",t.pinned),[`${m}__pin--start`]:"start"===t.pinned,[`${m}__pin--end`]:"end"===t.pinned,[`${m}__ordered`]:!!t.order,[`${m}__filtered`]:null!=t.filter}};let r=s?E(a,s):a;if(!M(t))return c(e,null);if(r=Number(r.colSpan)>1?{...r,scope:"colgroup"}:{...r,scope:"col"},i()){const n=t.order?"asc"===t.order?"ascending":"descending":"none";r={...r,"aria-sort":n}}return c("th",{...r,key:t.prop},i()?c("button",{class:{[`${m}__order-btn`]:!0,[`${m}__cell-content`]:!0},onClick:function(e){let o;switch(t.order){case"asc":o="desc";break;case"desc":o=null;break;default:o="asc"}n(o,t.prop,e.target.closest("th"))}},M(t),null!=t.filter&&c("nano-icon",{name:"light/filter"}),!!t.order&&c("nano-icon","desc"===t.order?{name:"solid/arrow-down-long"}:{name:"solid/arrow-up-long"}),c("div",{class:`${m}__status-icons`},c("nano-icon",{name:"light/chevron-down"}))):c("div",{class:`${m}__cell-content`},M(t),null!=t.filter&&c("nano-icon",{name:"light/bars-filter"})))},L=(t,n=!1)=>{const e=j().config.state.columns[t],o={[`${m}__td`]:!0,[`${m}__ordered`]:!!e.order,[`${m}__pin`]:!!e.pinned,[`${m}__pin--start`]:"start"===e.pinned,[`${m}__pin--end`]:"end"===e.pinned};return n?O(o):o},W=({rowIndex:t,colIndex:n,nestedContent:o})=>{const s=()=>o?o():function(t,n){const o=j().config.state.columns,s=o[n]?.cellTemplate,a=P(t,n),r=i();if(a.cellModel&&"date"===o[n].type){const t=new Date(a.cellModel);t instanceof Date&&!isNaN(t)&&(a.cellModel=s?t:`${new Date(a.cellModel).toLocaleDateString()} ${new Date(a.cellModel).toLocaleTimeString()}`)}let l=!1,h=s?s(((...t)=>(l=!0,c(...t))),a):void 0;if(h&&r.customRenderer&&void 0===h.t&&!(h instanceof Element)&&"string"!=typeof h&&!l){const t=document.createElement("template"),n=r.customRenderer(h,t.content);h=n&&n.then?n:t}return h||(null!=a.cellModel?c(e,null,a.cellModel?.toString()):"")}(t,n)||c("span",{class:"placeholder"}," ");let a="td";const r=j().config.state.columns[n];if(r.hidden)return c(e,null);let l=function(t,n,e){const o={...e},i=j().config.state.columns[n]?.cellProperties;if(!i)return o;const s=i(P(t,n));return s?E(o,s):o}(t,n,{class:L(n)});r.rowHeader&&(l=Number(l.rowSpan)>1?{...l,scope:"rowgroup"}:{...l,scope:"row"},a="th");const h=t=>{const n=s();return c("div",{ref:t=>{t&&(n instanceof Element?(t.replaceChildren(),t.append(n.content||n)):n.then&&n.then((n=>t.innerHTML=n)))},...t,class:{[`${m}__cell-content`]:!0,[`${m}__cell-content--wrap`]:!!r.wrap},innerHTML:"string"==typeof n&&n.includes("<")?n:void 0},("string"!=typeof n||!n.includes("<"))&&!n.then&&!(n instanceof Element)&&n)};return c(a,{...l},r.autoTooltip&&!r.wrap?c("nano-resize-observe",{notifyContentFit:"x",onNanoResizeContentFitChange:t=>t.target.firstElementChild.disabled=t.detail.x},c("nano-tooltip",{disabled:!0,placement:"top",onNanoShow:t=>t.target.closest(a).style.zIndex="100",onNanoHide:t=>t.target.closest(a).style.zIndex=""},c(h,null),c("span",{slot:"content"},c(s,null)))):c(h,null))},Y=(t,n,e)=>{const o=c("div",{...t.wrapperProps,class:{[`${m}__cell-content`]:!0,[`${m}__cell-content--wrap`]:t.wrap}},n);return t.header?c("th",{scope:e,...t.cellProps},o):c("td",{...t.cellProps},o)},K=({rowRenderer:t,rowIndex:n,rowModel:e},o,i)=>{const s=({header:t,wrap:n,cellProps:e,wrapperProps:o},i)=>Y({header:t,wrap:n,cellProps:e,wrapperProps:o},i,"row");let a,r={};if(!e){const t=function(t){return{rowModel:j().data.state.rows[t],rowIndex:t}}(n);e=t.rowModel}t?.rowProperties&&(r=t.rowProperties({rowModel:e,rowIndex:n})||r),t?.pinned&&"function"==typeof t.pinned&&(a=t.pinned({rowModel:e,rowIndex:n}));const l=E({class:N("tr",a,!0)},r),h=t?.template,d=t=>i.map(t,((t,n)=>(["td","th"].includes(t.vtag.toString())&&(t.vattrs=E({class:L(n,!0)},t.vattrs)),t)));if(h){let t=h(c,{renderedRow:c("tr",{...l,key:e.__uuid},o),rowModel:e,rowIndex:n},s);return Array.isArray(t)&&(t=i.map(t,((t,n)=>("tr"===t.vtag&&(t.vkey||(t.vkey=`${e.__uuid}_${n}`),t.vattrs=E({class:N("tr",a,!0)},t.vattrs),t.vchildren&&(t.vchildren=d(t.vchildren))),t)))),t}return c("tr",{...l,key:e.__uuid},d(o))},X=({rowRenderer:t},n,e)=>{let o={};t.rowProperties&&(o=t.rowProperties()||{});const i=({header:t,wrap:n,cellProps:e,wrapperProps:o},i)=>Y({header:t,wrap:n,cellProps:e,wrapperProps:o},i,"col"),s=t.pinned||null,a={class:N("tr",s)},r=o?E(a,o):a,l=t?.template;if(l){let t=l(c,{renderedRow:c("tr",{...r},n)},i);return Array.isArray(t)&&(t=e.map(t,(t=>("tr"===t.vtag&&(t.vattrs=E({class:N("tr",s,!0)},t.vattrs),t.vchildren&&(t.vchildren=e.map(t.vchildren,(t=>(["td","th"].includes(t.vtag.toString())&&(t.vattrs=E({class:N(t.vtag.toString(),s,!0)},t.vattrs)),t))))),t)))),t}return c("tr",{...r},n)};function q(t,n){const e=document.getElementById(t)||document.createElement("style");e.id=t,e.innerHTML=n,e.isConnected||document.head.append(e)}class J{cachedColMeta=new WeakMap;tableId;tableEle;scrollElement;startColumns;endColumns;topRows;bottomRows;tableDims;constructor(t,n){this.tableEle=t,this.tableId=this.tableEle.id,this.scrollElement=n,this.startColumns=t.querySelector("thead").getElementsByClassName(`${m}__pin--start`),this.endColumns=t.querySelector("thead").getElementsByClassName(`${m}__pin--end`),this.topRows=t.getElementsByClassName(`${m}__pin--top`),this.bottomRows=t.getElementsByClassName(`${m}__pin--bottom`),this.onResize()}get pinnedStart(){return this._pinnedStart}set pinnedStart(t){this._pinnedStart=t,this.handlePinnedStartChange()}_pinnedStart=[];handlePinnedStartChange(){s((()=>{if(this.pinnedStart.length){this.tableEle.classList.add(`${m}__pinned--start`);const t=this.cachedColMeta.get(this.pinnedStart[this.pinnedStart.length-1]);q(`${this.tableId}-col-start-active-style`,`\n          #${this.tableId} tr > :nth-child(${t.idx+1}) {\n            --pin-start-active: 1;\n          }\n        `)}else this.tableEle.classList.remove(`${m}__pinned--start`),q(`${this.tableId}-col-start-active-style`,"")}))}get pinnedEnd(){return this._pinnedEnd}set pinnedEnd(t){this._pinnedEnd=t,this.handlePinnedEndChange()}_pinnedEnd=[];handlePinnedEndChange(){s((()=>{if(this.pinnedEnd.length){this.tableEle.classList.add(`${m}__pinned--end`);const t=this.cachedColMeta.get(this.pinnedEnd[0]);q(`${this.tableId}-col-end-active-style`,`\n          #${this.tableId} tr > :nth-child(${t.idx+1}) { --pin-end-active: 1; }\n        `)}else this.tableEle.classList.remove(`${m}__pinned--end`),q(`${this.tableId}-col-end-active-style`,"")}))}get cssColDimensionCacheKey(){return this._cssColDimensionCacheKey}set cssColDimensionCacheKey(t){t!==this._cssColDimensionCacheKey&&(this._cssColDimensionCacheKey=t,this.createPinnedColDimensionStyles())}_cssColDimensionCacheKey="";generateCssCacheKey(){let t="";for(const n of this.startColumns){const e=this.cachedColMeta.get(n);t+=`${e.idx}-start-${e.width}`}for(const n of this.endColumns){const e=this.cachedColMeta.get(n);t+=`${e.idx}-start-${e.width}`}this.cssColDimensionCacheKey=t}createPinnedColDimensionStyles(){let t=0,n=0;const e=Array.from(this.startColumns),o=Array.from(this.endColumns).reverse(),i=`\n      ${e.map((n=>{const e=this.cachedColMeta.get(n);return t+=e.width-1||-1,`\n            #${this.tableId} tr > :nth-child(${e.idx+1}) ~ td,\n            #${this.tableId} tr > :nth-child(${e.idx+1}) ~ th {\n              --pin-start: ${t-1}px;\n            }\n          `})).join("")}\n      ${o.map((t=>{const e=this.cachedColMeta.get(t);return n+=e.width-1||-1,`\n            #${this.tableId} tr > td:has(~ :nth-child(${e.idx+1})),\n            #${this.tableId} tr > th:has(~ :nth-child(${e.idx+1})) {\n              --pin-end: ${n-1}px;\n            }\n          `})).join("")}\n    `;q(`${this.tableId}-dimension-style`,i)}getParentOffsets(){const{x:t,y:n}=this.scrollElement.getBoundingClientRect();let e=t,o=n;return this.scrollElement===document.documentElement&&(e=this.scrollElement.offsetLeft,o=this.scrollElement.offsetTop),{offsetX:e,offsetY:o}}assessRows(){if((this.topRows.length||this.bottomRows.length)&&(this.topRows.length&&a((async()=>{let t,n=0;const{offsetY:e}=this.getParentOffsets();for(const o of this.topRows){const{y:i,height:a}=o.getBoundingClientRect(),r=o.parentElement,l=getComputedStyle(o).getPropertyValue("--pin-top"),h=""!==l?parseFloat(l):n;s((()=>{i-e<=h?o.classList.add(`${m}__pinned`,`${m}__pinned--top`):o.classList.remove(`${m}__pinned`,`${m}__pinned--top`),t!==r&&(r.style.setProperty("--pin-top",n-1+"px"),n+=a-1,t=r)}))}})),this.bottomRows.length)){const t=Array.from(this.bottomRows).reverse();a((async()=>{let n,e=0;const{offsetY:o}=this.getParentOffsets();for(const i of t){if(!i.isConnected)continue;const{y:t,height:a}=i.getBoundingClientRect(),r=i.parentElement,l=getComputedStyle(i).getPropertyValue("--pin-bottom"),h=""!==l?parseFloat(l):e;await new Promise((l=>s((()=>{this.tableDims.height+o-(t+a)<=h?i.classList.add(`${m}__pinned`,`${m}__pinned--bottom`):i.classList.remove(`${m}__pinned`,`${m}__pinned--bottom`),n!==r&&(r.style.setProperty("--pin-bottom",e-1+"px"),e+=a-1,n=r),l()}))))}}))}}async assessCols(){if(!this.startColumns.length&&!this.endColumns.length)return;let t,n,e;const o=new Promise((o=>{this.startColumns.length&&a((()=>{const{offsetX:i}=this.getParentOffsets();let s=i;e=Array.from(this.startColumns[0].parentElement.children);for(const o of this.startColumns)t=o.getBoundingClientRect(),this.cachedColMeta.set(o,{width:t.width,idx:e.indexOf(o)}),n=this.pinnedStart.find((t=>t===o)),t.x<s?n||(this.pinnedStart=[...this.pinnedStart,o]):n&&(this.pinnedStart=this.pinnedStart.filter((t=>t!==o))),s+=t.width;this.endColumns.length||o()})),this.endColumns.length&&a((()=>{const i=Array.from(this.endColumns).reverse();e=Array.from(this.endColumns[0].parentElement.children);const{offsetX:s}=this.getParentOffsets();let a=0;for(const o of i)t=o.getBoundingClientRect(),this.cachedColMeta.set(o,{width:t.width,idx:e.indexOf(o)}),n=this.pinnedEnd.find((t=>t===o)),this.tableDims.width+s-t.right<=a?n||(this.pinnedEnd=[o,...this.pinnedEnd]):n&&(this.pinnedEnd=this.pinnedEnd.filter((t=>t!==o))),a+=t.width;o()}))}));await o,this.generateCssCacheKey()}cacheX=0;cacheY=0;onScroll(t){this.cacheX!==t.x&&(this.cacheX=t.x,this.assessCols()),this.cacheY!==t.y&&(this.cacheY=t.y,this.assessRows())}onResize(){this.tableDims={width:this.scrollElement.clientWidth,height:this.scrollElement.clientHeight},this.assessCols(),this.assessRows()}}let U=0;const Z=class{constructor(t){r(this,t),this.nanoTblReady=l(this,"nanoTblReady",7),this.nanoTblBlockRendered=l(this,"nanoTblBlockRendered",7),this.nanoTblBeforeSort=l(this,"nanoTblBeforeSort",7),this.nanoTblAfterSort=l(this,"nanoTblAfterSort",7),this.nanoTblBeforeFilter=l(this,"nanoTblBeforeFilter",7),this.nanoTblAfterFilter=l(this,"nanoTblAfterFilter",7),this.nanoTblBeforeSearch=l(this,"nanoTblBeforeSearch",7),this.nanoTblAfterSearch=l(this,"nanoTblAfterSearch",7),this.nanoTblBeforeEdit=l(this,"nanoTblBeforeEdit",7),this.debounceSetLoading=b(this.debounceSetLoading.bind(this),50)}customRenderer;scrollable=!1;caption;showCaption=!1;loading=void 0;get _loading(){return void 0!==this.loading?this.loading:this.internalLoading}set _loading(t){void 0===this.loading&&this.debounceSetLoading(t)}debounceSetLoading(t){this.internalLoading=t}internalLoading=!0;placeholderSize=10;rows;handleRowsChange(){this.rows?(this._loading=!0,Promise.resolve(this.rows).then((async t=>{await function(t,n){const e=F.get(t);if(!e)return;const o=e.config.state.columns,i=o.filter((t=>"date"===t.type)).reduce(((t,n)=>[...t,n.prop]),[]),s=o.filter((t=>!t.type));return n=n.map(((t,n)=>(s.length&&0===n&&(e.config.state.columns=o.map((n=>{var e;return s.includes(n)&&t[n.prop]&&!n.type&&(n.type=(e=t[n.prop])instanceof Date?"date":["number","string","boolean"].includes(typeof e)?typeof e:"unknown","date"===n.type&&i.push(n.prop)),n}))),i.forEach((n=>{const e=new Date(t[n]);e&&Number(e)&&(t[n]=Number(e))})),t.__index=n,t.__uuid=p(o.map((n=>t[n.prop])).join()),t))),e.data.state.rows=n,e.general.state.workerId?R(e.general.state.workerId,n):void 0}(this.host,t),this.customFilterApplied?this.customFilterApplied=!1:this.currentFilters="",this.currentSort="",await this.columnInit(),this.isReady||requestAnimationFrame((()=>this.setInitialBlockDimension())),this._loading=!1,this.tablePinnedService&&this.tablePinnedService.assessRows()}))):this._loading=!0}columns=[];async handleColsChange(){await function(t,n){const e=F.get(t);if(e)return e.config.state.columns=n,e.general.state.workerId?T(e.general.state.workerId,B(n)):void 0}(this.host,this.columns),this.isReady&&this.columnInit()}headRender={pinned:"top"};rowRender;footRender={pinned:"bottom"};showFooter=!1;perBlock=50;get blocksLength(){return this.blocks.length}searchTerm;customFilterFn;customSortFn;defaultSort=!0;handleSearchTermChange(){this.searchStart()}showPaginateSpinner=!1;virtualTotalItems=0;virtualTotalItemsChangeHandler(){this.setBlocks()}get appliedFilters(){return this.filters}nanoTblReady;nanoTblBlockRendered;nanoTblBeforeSort;nanoTblAfterSort;nanoTblBeforeFilter;nanoTblAfterFilter;nanoTblBeforeSearch;nanoTblAfterSearch;nanoTblBeforeEdit;async resetSorting(){const t=this.columns.find((t=>!!t.order));if(t)return this.sortStart(null,t.prop)}async addSort(t,n){const e=this.columns.find((n=>n.prop===t));if(!e)throw new Error("Cannot find column with "+t);return this.sortStart(n,e.prop)}async resetFilters(){return this.filters=[],this.filterStart()}async addFilters(t,n=!0){return n||(this.filters=[]),this.filterStart(t,n)}async removeFilters(t){return this.filters=this.filters.filter((n=>!t.includes(n.prop))),this.filterStart()}async updateRow(t,n){this.rows.splice(n,1,t),this.handleRowsChange()}get host(){return o(this)}renderId="tbl-"+U++;store;filters=[];currentFilters="[]";currentSort="";tableEle;topAnchorEle;activeWatcherIo;tablePinnedService;customFilterApplied=!1;blocks=[];activeBlocks=[0,1];measureHeight=0;blockElements;blockHeights=[];set measureEle(t){if(!t)return;const n=t.getBoundingClientRect().height;this.measureHeight=Math.abs(this.measureHeight-n)<5?this.measureHeight:n,this.unitHeight=t.querySelector("tr")?.getBoundingClientRect().height||this.unitHeight}unitHeight=0;get scrollParent(){return this._scrollParent}set scrollParent(t){t!==this._scrollParent&&(this._scrollParent&&(this._scrollParent===document.documentElement?document:this._scrollParent).removeEventListener("scroll",this.scrollHandler),(t===document.documentElement?document:t).addEventListener("scroll",this.scrollHandler),this._scrollParent=t)}_scrollParent;get primaryBlockIndex(){return this._primaryBlockIndex}set primaryBlockIndex(t){this._primaryBlockIndex!==t&&(this._primaryBlockIndex=t,this.nanoTblBlockRendered.emit({block:t,totalBlocks:this.blockElements.length}))}_primaryBlockIndex;get isReady(){return this._isReady}set isReady(t){t!==this._isReady&&(this._isReady=t,this.isReady&&requestAnimationFrame((()=>this.handleReady())))}_isReady=!1;handleReady(){const t=window.location.hash;if(t.length>1)try{const n=document.querySelector(t);n&&n.scrollIntoView()}catch(t){}this.nanoTblReady.emit()}sortStart=async(t,n,e)=>{if(this.currentSort!==t+":"+n&&(this._loading=!0,!this.nanoTblBeforeSort.emit({column:n,order:t}).defaultPrevented)){if(this.currentSort=t+":"+n,this.scrollToTop(e),this.customSortFn)try{if(!0===await this.customSortFn(n,t))return this.sortComplete(t,n),void(this._loading=!1)}catch(t){return console.warn("custom sort failed",t),this.currentSort="",void(this._loading=!1)}try{await async function(t,n,e){const o=F.get(t);if(o&&o.general.state.workerId)try{o.data.state.rows=await A(o.general.state.workerId,n,e)}catch(t){console.warn(t)}}(this.host,n,t),this.sortComplete(t,n)}catch(t){console.warn("sort failed",t),this.currentSort=""}finally{this.blocks.length&&(this._loading=!1)}}};sortComplete(t,n){this.columns=this.columns.map((e=>e.prop===n?{...e,order:t}:{...e,order:null})),this.nanoTblAfterSort.emit({column:n,order:t})}async searchStart(){if(this._loading=!0,!this.nanoTblBeforeSearch.emit({term:this.searchTerm}).defaultPrevented){this.scrollToTop();try{await async function(t,n){const e=F.get(t);if(e&&e.general.state.workerId)try{e.data.state.rows=await D(e.general.state.workerId,n)}catch(t){console.warn(t)}}(this.host,this.searchTerm),this.nanoTblAfterSearch.emit({term:this.searchTerm})}catch(t){console.warn("search failed",t)}finally{this._loading=!1}}}async filterStart(t,n=!0){if(t&&(this.filters=n?[...this.filters.filter((n=>!t.find((t=>t.prop===n.prop)))),...t]:t),this.currentFilters!==JSON.stringify(this.filters)&&(this._loading=!0,!this.nanoTblBeforeFilter.emit({filters:this.filters}).defaultPrevented)){if(this.currentFilters=JSON.stringify(this.filters),this.scrollToTop(),this.customFilterFn)try{if(!0===await this.customFilterFn(this.filters))return this.customFilterApplied=!0,await this.filterComplete(),void(this._loading=!1)}catch(t){return console.warn("custom filter failed",t),this.currentFilters="",void(this._loading=!1)}try{await this.filterComplete()}catch(t){console.warn("filter failed",t)}finally{this._loading=!1}}}async filterComplete(){this.columns=this.columns.map((t=>{const n=this.filters.find((n=>n.prop===t.prop));return n&&("boolean"!=typeof n.filter&&n.filter.length||"boolean"==typeof n.filter)?t.filter=n.filter:(null!=t.filter||t.filter&&"boolean"!=typeof t.filter&&!t.filter.length)&&(t.filter=void 0),t})),await async function(t,n){const e=F.get(t);if(e&&e.general.state.workerId)try{e.data.state.rows=await I(e.general.state.workerId,n)}catch(t){console.warn(t)}}(this.host,this.filters),this.nanoTblAfterFilter.emit({filters:this.filters})}scrollToTop(t){if(!this.scrollParent)return;const n=this.scrollParent.style?.scrollBehavior,e=this.scrollParent.scrollLeft;this.scrollParent.style.scrollBehavior="auto",this.topAnchorEle&&!_(this.topAnchorEle,.1)&&this.host.scrollIntoView(),t&&!_(t,1)&&setTimeout((()=>t.scrollIntoView({block:"start"})),500),e&&(this.scrollParent.scrollLeft=e),n&&(this.scrollParent.style.scrollBehavior=n),this.scrollHandler()}setMeasureElement(){return new Promise((t=>{a((()=>{this.measureEle=this.blockElements.find((t=>!t?.classList?.contains(`${m}__inactive`))),t()}))}))}setInitialBlockDimension(){if(!this.blockElements?.length)return;const t=async()=>(await this.setMeasureElement(),!!this.unitHeight);new Promise((n=>{t().then((async e=>{if(e)n();else{const e=new IntersectionObserver((async()=>{await t()&&(n(),e.disconnect())}),{root:this.scrollParent});e.observe(this.tableEle)}}))})).then((()=>{requestAnimationFrame((()=>this.isReady=!0))}))}async columnInit(){this.filters=this.columns.filter((t=>null!=t.filter)).map((t=>{const{filter:n,prop:e}=t;return{prop:e,filter:n}})),this.searchTerm&&await this.searchStart(),this.filters.length&&await this.filterStart();const t=this.columns.find((t=>!!t.order));t&&await this.sortStart(t.order,t.prop),this.tablePinnedService&&this.tablePinnedService.assessCols()}setBlocks(){const t=this.store.data.state.rows;if(!t.length)return void(this.blocks=[]);let n=1;const e=this.virtualTotalItems>t.length?this.virtualTotalItems:t.length;let o=[];const i=[];for(;n<=e;n++)o.push(this.store.data.state.rows[n-1]||{__uuid:""}),n%this.perBlock==0&&(i.push({rows:o,__uuid:p(o.map((t=>t.__uuid)).join())}),o=[]);o.length&&i.push({rows:o,__uuid:p(o.map((t=>t.__uuid)).join())}),this.blocks=i}getBlockHeight(t){if(this.blockHeights.length){const n=this.blockHeights.find((n=>n.blockIndex===t));if(n&&n.height)return n.height}const n=this.blocks[t].rows.length;return n===this.perBlock&&this.measureHeight?this.measureHeight:this.unitHeight?this.unitHeight*n:100}setBlockHeight(){this.activeBlocks.forEach((t=>{const n=this.blockElements[t];n&&a((()=>{if(n.classList.contains(`${m}__inactive`))return;const e=n.getBoundingClientRect().height,o=this.blockHeights.findIndex((n=>n.blockIndex===t));o>-1?this.blockHeights[o]={height:e,blockIndex:t}:this.blockHeights.push({height:e,blockIndex:t})}))}))}scrollHandler=()=>{let t=0;this.store?.general.state.isActive&&this.rows&&(void 0===this.primaryBlockIndex&&(this.primaryBlockIndex=0),a((()=>{t=void 0!==this.scrollParent.scrollTop?this.scrollParent.scrollTop:window.scrollY,t+=this.host.offsetTop,this.tablePinnedService&&this.tablePinnedService.onScroll({x:void 0!==this.scrollParent.scrollLeft?this.scrollParent.scrollLeft:window.scrollX,y:t});let n=this.host.offsetTop,e=0;const o=this.blocks.length;for(;e<o&&t>=n;){if(n+=this.getBlockHeight(e),t<n){const t=[e,e+1];t.toString()!==this.activeBlocks.toString()&&(this.activeBlocks=t),this.primaryBlockIndex=e}e++}})))};processSlots(){this.caption||this.host.querySelector('[slot="caption"]')||console.error("For accessibility you must set a `caption` prop or use the `caption` slot")}setupActiveWatcher(){this.host&&this.scrollParent&&this.store&&(this.activeWatcherIo&&(this.activeWatcherIo.disconnect(),this.activeWatcherIo=void 0),(this.activeWatcherIo=new IntersectionObserver((([t])=>{this.store.general.state.isActive=!!t.isIntersecting}),{root:this.scrollParent,threshold:0})).observe(this.scrollable?this.tableEle:this.host))}async componentWillLoad(){this.store=await async function(t,n,e,o){const i={data:f({rows:[]}),config:f({columns:n}),general:f({workerId:null,scrollParent:e,host:t,isReady:o})},s=await S(i.data.state.rows,B(i.config.state.columns));return i.general.state.workerId=s,F.set(t,i),i.data.use({reset:()=>{i.general.state.workerId&&R(i.general.state.workerId,null)},dispose:()=>{i.general.state.workerId&&R(i.general.state.workerId,null)}}),i.config.use({reset:()=>{i.general.state.workerId&&T(i.general.state.workerId,null)},dispose:()=>{i.general.state.workerId&&T(i.general.state.workerId,null)}}),i}(this.host,this.columns,this.scrollParent,this.isReady),this.handleRowsChange(),this.store.general.onChange("isActive",(()=>{this.scrollHandler()})),this.store.data.onChange("rows",(()=>this.setBlocks())),this.processSlots(),this.setBlocks(),this.scrollable||(this.scrollParent=u(this.host),this.setupActiveWatcher())}connectedCallback(){this.scrollable||(this.scrollParent=u(this.host),this.setupActiveWatcher())}componentDidLoad(){this.setInitialBlockDimension(),this.scrollable&&(this.scrollParent=this.host.querySelector(d("nano-masked-overflow")).shadowRoot.querySelector(".onav__scroller"),this.setupActiveWatcher()),this.tablePinnedService||(this.tablePinnedService=new J(this.tableEle,this.scrollParent))}componentShouldUpdate(t,n,e){if(["rows","columns"].includes(e))return!1}componentWillRender(){}componentDidRender(){this.setMeasureElement().then((()=>this.setBlockHeight()))}disconnectedCallback(){this.activeWatcherIo&&(this.activeWatcherIo.disconnect(),this.activeWatcherIo=void 0,(this.scrollParent===document.documentElement?document:this.scrollParent).removeEventListener("scroll",this.scrollHandler))}render(){return this.blockElements=[],c(h,{class:"nano-data-table"},c("div",{class:`${m}__top-anchor`,ref:t=>this.topAnchorEle=t}," "),c("nano-resize-observe",{onNanoResize:()=>{this.tablePinnedService&&this.tablePinnedService.onResize()}}),(t=>this.scrollable?c("nano-masked-overflow",{hideScrollbars:!1,scrollControls:!1,label:this.caption},t):c("div",null,t))(c("div",{class:`${m}__wrap`},c("nano-progress-bar",{indeterminate:!0,class:{[`${m}__progress-bar`]:!0,[`${m}__progress-bar--show`]:this._loading}}),c("table",{"aria-rowcount":this.store.data.state.rows.length,"aria-colcount":this.store.config.state.columns.length,class:`${m}`,ref:t=>this.tableEle=t,id:"nano-data-table-"+this.renderId},c("caption",{class:{[`${m}__caption`]:!0,[`${m}__caption--hide`]:!this.showCaption}},c("slot",{name:"caption"},this.caption)),c("thead",null,c(X,{rowRenderer:this.headRender},this.store.config.state.columns.map((t=>[c(H,{column:t,headRenderer:this.headRender,onColumnSortClick:this.sortStart,defaults:{sortable:this.defaultSort}})])))),this._loading&&!this.blocks.length&&c("tbody",{class:`${m}__active ${m}__loading`},[...Array(this.placeholderSize).keys()].map((t=>c("tr",null,this.store.config.state.columns.map(((n,e)=>c(W,{rowIndex:t,colIndex:e,nestedContent:()=>c("nano-skeleton",null)}))))))),c("tr",{hidden:!!this._loading||!!this.blocks.length},c("th",{class:`${m}__th`,colSpan:this.store.config.state.columns.length},c("div",{class:"nano-tbl__cell-content nano-tbl__cell-content--no-result"},c("slot",{name:"no-results"},"No results found")))),this.blocks.map(((t,n)=>c("tbody",{key:t.__uuid,id:`tbody-${this.renderId}-${n}`,ref:t=>{this.blockElements.push(t)},class:{[`${m}__inactive`]:!this.activeBlocks.includes(n),[`${m}__active`]:this.activeBlocks.includes(n)}},this.activeBlocks.includes(n)?t.rows.map(((t,e)=>{const o=n>0?n*this.perBlock+e:e;return c(K,{rowRenderer:this.rowRender,rowModel:t,rowIndex:o},this.store.config.state.columns.map(((t,n)=>c(W,{rowIndex:o,colIndex:n}))))})):c("tr",{class:`${m}__tr--placeholder`},c("td",{colSpan:this.store.config.state.columns.length,style:{height:this.getBlockHeight(n)+"px"}}))))),this.showFooter&&c("tfoot",null,c(X,{rowRenderer:this.footRender},this.store.config.state.columns.map((t=>[c(H,{column:t,headRenderer:this.footRender,onColumnSortClick:this.sortStart,defaults:{sortable:this.defaultSort}})]))))),!!this.blocks.length&&this.showPaginateSpinner&&c("nano-spinner",{type:"circle",class:{[`${m}__spinner`]:!0,[`${m}__spinner--show`]:this._loading}}))))}static get watchers(){return{rows:["handleRowsChange"],columns:["handleColsChange"],searchTerm:["handleSearchTermChange"],virtualTotalItems:["virtualTotalItemsChangeHandler"]}}};Z.style=':host,\n*,\n*::before,\n*::after {\n  box-sizing: border-box;\n}\n[hidden] {\n  display: none !important;\n}\n@media (prefers-reduced-motion: reduce) {\n    :host,\n    *,\n    *::before,\n    *::after {\n      animation-duration: 0.01ms !important;\n      animation-iteration-count: 1 !important;\n      transition-duration: 0.01ms !important;\n      scroll-behavior: auto !important;\n    }\n  }:host,\n*,\n*::before,\n*::after {\n  box-sizing: border-box;\n}\n[hidden] {\n  display: none !important;\n}\n@media (prefers-reduced-motion: reduce) {\n    :host,\n    *,\n    *::before,\n    *::after {\n      animation-duration: 0.01ms !important;\n      animation-iteration-count: 1 !important;\n      transition-duration: 0.01ms !important;\n      scroll-behavior: auto !important;\n    }\n  }.nano-data-table {\n  /**\n   * @prop --table-padding. The padding of the table cells. Defaults to `var(--table-compact-padding)`\n   * @prop --table-border-color. The border color of the table cells. Defaults to `var(--nano-color-neutral-200)`\n   * @prop --table-border-color-header. The border color of the table header and footer cells. Defaults to `var(--nano-color-primary-1000)`\n   * @prop --table-background. The background color of the table cells. Defaults to `var(--nano-color-base-0)`\n   * @prop --table-max-col-width. The maximum width of the table columns. Defaults to `clamp(200px, 500px, 50vw)`\n   * @prop --table-ordered-bg. The background color of the ordered table rows. Defaults to `var(--nano-color-neutral-100)`\n   * @prop --table-wrapper-max-height: maximum height of the table when table is scrollable. Defaults to 80vh;\n   * @prop --table-wrapper-max-width: maximum width of the table when table is scrollable. Defaults to 100%;\n   */\n  --table-padding: var(--nano-spacing-sm) calc(var(--nano-spacing-md) - (var(--nano-spacing-md) / 3));\n  --table-border-color: var(--nano-color-neutral-200);\n  --table-border-color-header: var(--nano-color-primary-1000);\n  --table-background: var(--nano-color-base-0);\n  --table-max-col-width: clamp(200px, 500px, 50vw);\n  --table-ordered-bg: var(--nano-color-neutral-100);\n  --table-wrapper-max-height: 80vh;\n  --table-wrapper-max-width: 100%;\n  display: block;\n  inline-size: 100%;\n  color: var(--nano-color-neutral-1400);\n  container-type: inline-size;\n  --isLtR: 1;\n}\n.nano-data-table:dir(rtl) {\n  --isLtR: -1;\n}\n.nano-data-table .nano-sortable__dragged {\n  background: var(--nano-color-base-0);\n  opacity: 0.9;\n  box-shadow: var(--nano-shadow-l0);\n  z-index: 10 !important;\n}\n\n.nano-tbl__wrap {\n  display: table;\n  min-inline-size: 100%;\n}\n.nano-data-table:not([scrollable=false]) .nano-tbl__wrap {\n  max-inline-size: var(--table-wrapper-max-width);\n  max-block-size: var(--table-wrapper-max-height);\n  position: relative;\n  display: block;\n}\n.nano-data-table:not([scrollable=false]) .nano-tbl__wrap table {\n  margin-block-end: var(--nano-spacing-l);\n}\n\n.nano-data-table:not([scrollable=false]):has(.nano-tbl__pin--start, .nano-tbl__pin--end) .nano-masked-overflow {\n  --fade-size: 0;\n}\n\n.nano-tbl {\n  text-align: start;\n  inline-size: 100%;\n  border-spacing: 0 0;\n  border-collapse: separate;\n  border-inline-end: 1px solid transparent;\n  border-block-start: 1px solid transparent;\n  position: relative;\n  z-index: 1;\n}\n.nano-tbl__top-anchor {\n  clip-path: inset(50%);\n  block-size: 1px;\n  overflow: hidden;\n  position: absolute;\n  white-space: nowrap;\n  inline-size: 1px;\n  position: relative;\n}\n.nano-tbl__ordered {\n  background-color: var(--table-ordered-bg);\n  --table-border-color: var(--nano-color-neutral-300);\n}\n.nano-tbl__order-btn {\n  padding: 0;\n  border: none;\n  outline: none;\n  font: inherit;\n  background: none;\n  appearance: none;\n  color: inherit;\n  display: flex;\n  gap: var(--nano-spacing-sm);\n  align-items: center;\n  inline-size: 100%;\n}\n.nano-tbl__order-btn:focus-visible {\n  outline: var(--nano-focus-ring);\n  outline-offset: var(--nano-focus-ring-offset);\n}\n.nano-tbl__status-icons {\n  margin-inline: auto 10px;\n  display: flex;\n  gap: 10px;\n}\n.nano-tbl__progress-bar {\n  font-size: 0.2rem;\n  position: sticky;\n  inset-block-start: 0;\n  inset-inline: 0;\n  z-index: 10;\n  transition: scale 0.25s;\n  transform: scale(0);\n  inline-size: 100%;\n  block-size: 0;\n}\n.nano-tbl__progress-bar--show {\n  transform: scale(1);\n  block-size: auto;\n}\n.nano-tbl__caption--hide {\n  clip-path: inset(50%);\n  block-size: 1px;\n  overflow: hidden;\n  position: absolute;\n  white-space: nowrap;\n  inline-size: 1px;\n}\n.nano-tbl__td, .nano-tbl__th {\n  max-inline-size: var(--table-max-col-width);\n}\nthead .nano-tbl__td .nano-sortable__keyboard-handle, thead .nano-tbl__th .nano-sortable__keyboard-handle {\n  position: absolute;\n  inset-inline-end: 5px;\n  inset-block-start: 50%;\n  transform: translateY(-50%);\n  background: white;\n  z-index: 10;\n}\n.nano-tbl__td.nano-tbl__ordered, .nano-tbl__th.nano-tbl__ordered {\n  background-color: var(--table-ordered-bg) !important;\n  --table-border-color: var(--nano-color-neutral-300);\n}\n.nano-tbl__cell-content {\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n.nano-tbl__cell-content--no-result {\n  padding-block: var(--nano-spacing-md);\n}\n.nano-tbl__cell-content--wrap {\n  white-space: normal;\n  overflow: visible;\n}\n.nano-tbl tbody {\n  opacity: 1;\n  transition: 0.1s ease opacity;\n}\n.nano-tbl tbody.nano-tbl__loading {\n  z-index: -1;\n  position: relative;\n}\n.nano-tbl tbody.nano-tbl__inactive {\n  opacity: 0;\n}\n.nano-tbl tbody .nano-tbl__tr:has(~ .nano-tbl__tr--placeholder) {\n  display: none;\n}\n.nano-tbl tbody .nano-tbl__tr--placeholder ~ .nano-tbl__tr {\n  display: none;\n}\n.nano-tbl th[scope=row] {\n  margin: 0;\n}\n.nano-tbl__tr {\n  --base-z: 0;\n}\n.nano-tbl__pin {\n  z-index: var(--z, var(--base-z, 0));\n}\n.nano-tbl__pin .nano-tbl__th, .nano-tbl__pin .nano-tbl__td {\n  z-index: var(--z, var(--base-z, 0));\n}\n.nano-tbl__pin--start {\n  position: sticky;\n  inset-inline-start: var(--pin-start, -1px);\n}\n.nano-tbl__pin--start::after {\n  content: "";\n  position: absolute;\n  inset: 0;\n  box-shadow: calc(4px * var(--isLtR)) 0 4px -3px rgb(var(--nano-color-base-rgb-1000)/25%);\n  opacity: var(--pin-start-active, 0);\n  z-index: -1;\n}\n.nano-tbl__pinned--start .nano-tbl__pin--start {\n  --z: calc(var(--base-z) + 3) !important;\n}\n.nano-tbl__pin--end {\n  position: sticky;\n  inset-inline-end: var(--pin-end, -1px);\n  max-inline-size: min(50vw, 200px);\n}\n@container (width <= 500px) {\n  .nano-tbl__pin--start ~ .nano-tbl__pin--end {\n    --z: 0 !important;\n    inset-inline-end: auto !important;\n  }\n  .nano-tbl__pin--start ~ .nano-tbl__pin--end::after {\n    display: none !important;\n  }\n}\n@media (width <= 500px) {\n  .nano-tbl__pin--start ~ .nano-tbl__pin--end {\n    --z: 0 !important;\n    inset-inline-end: auto !important;\n  }\n  .nano-tbl__pin--start ~ .nano-tbl__pin--end::after {\n    display: none !important;\n  }\n}\n.nano-tbl__pin--end::after {\n  display: block;\n  content: "";\n  position: absolute;\n  inset: 0;\n  box-shadow: calc(-4px * var(--isLtR)) 0 4px -3px rgb(var(--nano-color-base-rgb-1000)/25%);\n  opacity: var(--pin-end-active, 0);\n  z-index: -1;\n}\n.nano-tbl__pinned--end .nano-tbl__pin--end {\n  --z: calc(var(--base-z) + 2);\n}\n.nano-tbl__pin--top .nano-tbl__th, .nano-tbl__pin--top .nano-tbl__td {\n  position: sticky;\n  inset-block-start: var(--pin-top, -1px);\n}\n.nano-tbl__pin--top .nano-tbl__pin--end, .nano-tbl__pin--top .nano-tbl__pin--start {\n  --z: calc(var(--base-z) + 1);\n}\n.nano-tbl__pin--top.nano-tbl__pinned--top {\n  --base-z: 4;\n}\ntbody .nano-tbl__pin--top.nano-tbl__pinned--top .nano-tbl__th, tbody .nano-tbl__pin--top.nano-tbl__pinned--top .nano-tbl__td {\n  border-block-end: 1px solid var(--table-border-color-header);\n}\n.nano-tbl__pin--bottom .nano-tbl__th, .nano-tbl__pin--bottom .nano-tbl__td {\n  position: sticky;\n  inset-block-end: var(--pin-bottom, -1px);\n}\n.nano-tbl__pin--bottom .nano-tbl__pin--end, .nano-tbl__pin--bottom .nano-tbl__pin--start {\n  --z: calc(var(--base-z) + 1);\n}\n.nano-tbl__pin--bottom.nano-tbl__pinned--bottom {\n  --base-z: 5;\n}\n.nano-tbl__pin--bottom.nano-tbl__pinned--bottom:has(.nano-tbl__pin--bottom.nano-tbl__pinned--bottom) .nano-tbl__pin {\n  --base-z: 6;\n}\ntbody .nano-tbl__pin--bottom.nano-tbl__pinned--bottom .nano-tbl__th, tbody .nano-tbl__pin--bottom.nano-tbl__pinned--bottom .nano-tbl__td {\n  border-block-start: 1px solid var(--table-border-color-header);\n}\n.nano-tbl thead tr:last-of-type td,\n.nano-tbl thead tr:last-of-type th {\n  border-block-end: 2px solid var(--table-border-color-header);\n}\n.nano-tbl tfoot tr:first-of-type td,\n.nano-tbl tfoot tr:first-of-type th {\n  border-block-start: none;\n}\n.nano-tbl tfoot tr:last-of-type td,\n.nano-tbl tfoot tr:last-of-type th {\n  border-block-end: 2px solid var(--table-border-color-header);\n  border-block-start: 2px solid var(--table-border-color-header);\n}\n.nano-tbl .unlimited-width {\n  max-inline-size: none;\n}\n.nano-tbl__spinner {\n  font-size: 1.5rem;\n  transition: scale 0.25s;\n  scale: 0;\n  padding: 0.5rem;\n  position: absolute;\n  inset-block-end: 0;\n  inset-inline-start: calc(50% - 0.75rem);\n  z-index: 0;\n}\n.nano-tbl__spinner--show {\n  scale: 1;\n  position: sticky;\n}\n.nano-tbl .nano-skeleton {\n  line-height: var(--nano-line-height-normal);\n}';export{Z as N,$ as c}
+import{i as t,h as n,F as e,a as o,j as i,e as s,f as a,r,c as l,d as h}from"./index-DXvE-U_j.js";import{h as c,t as d}from"./renderer-BUaAsDso.js";import{c as p}from"./math-BEqsTfVK.js";import{d as b}from"./throttle-C93FMm2Z.js";import{i as _,f as u}from"./scroll-iCYjzh9N.js";import{c as f}from"./index-Dw3NZx59.js";const m="nano-tbl",w=(t,n)=>{const e=globalThis[n];return null!=e&&t instanceof e},y=t=>{if(null!=t){if(w(t,"ArrayBuffer")||w(t,"MessagePort")||w(t,"ImageBitmap")||w(t,"OffscreenCanvas"))return[t];if("object"==typeof t)return t.constructor===Object&&(t=Object.values(t)),Array.isArray(t)?t.flatMap(y):y(t.buffer)}return[]};let v=0,g=0;const x=new Map,k=new Map,$=(n,e,o)=>{const i=new Worker(n,{name:e});return i.addEventListener("message",(({data:n})=>{if(n){const e=n[0],i=n[1],s=n[2];if(e===o){const e=n[3],[o,a,r]=x.get(i);if(x.delete(i),e){const n=e.isError?Object.assign(new Error(e.value.message),e.value):e.value;t(n),a(n)}else r&&r.forEach((t=>k.delete(t))),o(s)}else if(e===o+".cb")try{k.get(i)(...s)}catch(n){t(n)}}})),i},z=(t,n,e)=>(...o)=>new Promise(((i,s)=>{let a=v++,r=0,l=o.length,h=[i,s];for(x.set(a,h);r<l;r++)if("function"==typeof o[r]){const t=g++;k.set(t,o[r]),o[r]=[n+".cb",t],(h[2]=h[2]||[]).push(t)}const c=t=>t.postMessage([n,a,e,o],y(o));t.then?t.then(c):c(t)})),C=import("./table.worker-DQJ9Zgy3.js").then((t=>t.worker)),S=z(C,"stencil.table.worker","createWorkerStore"),T=z(C,"stencil.table.worker","syncConfigToWorker"),R=z(C,"stencil.table.worker","syncDataToWorker"),I=z(C,"stencil.table.worker","workerFilter"),D=z(C,"stencil.table.worker","workerSearch"),A=z(C,"stencil.table.worker","workerSort");function F(t){const n=JSON.parse(JSON.stringify(t));return t.forEach((t=>{t?.sortCompareFn&&(n.find((n=>n.prop===t.prop)).sortCompareFn=t.sortCompareFn.toString())})),n}const P=new WeakMap;function B(t,n){const e=j(),o=e.config.state.columns,i=e.data.state.rows,s=o[n],a=s?.prop,r=i[t];return{prop:a,cellModel:r?r[o[n].prop]:"",column:s,rowIndex:t,rowModel:r}}function E(t,n){if(!n)return t;const e={...n,...t};return n.class&&("object"==typeof n.class&&"object"==typeof e.class?e.class={...n.class,...e.class}:"string"==typeof n.class&&"object"==typeof e.class?e.class[n.class]=!0:"string"==typeof e.class&&"string"==typeof n.class&&(e.class+=" "+n.class)),n.style&&(e.style={...n.style,...e.style}),e}function j(){return t=o(i()),P.get(t);var t}function M(t){const o=t?.columnTemplate;return o?o(n,t):n(e,null,t.title)}function N(t,n,e=!1){const o={[`${m}__${t}`]:!0,[`${m}__pin`]:!!n,[`${m}__pin--top`]:"top"===n,[`${m}__pin--bottom`]:"bottom"===n};return e?O(o):o}function O(t){let n="";return Object.entries(t).forEach((([t,e])=>{e&&(n+=t+" ")})),n}const H=({column:t,onColumnSortClick:n,defaults:o})=>{if(t.hidden)return c(e,null);function i(){return!!o.sortable&&!1!==t.sortable||!o.sortable&&!0===t.sortable}let s={};t.columnProperties&&(s=t.columnProperties(t)||s);const a={class:{...N("th",t.pinned),[`${m}__pin--start`]:"start"===t.pinned,[`${m}__pin--end`]:"end"===t.pinned,[`${m}__ordered`]:!!t.order,[`${m}__filtered`]:null!=t.filter}};let r=s?E(a,s):a;if(!M(t))return c(e,null);if(r=Number(r.colSpan)>1?{...r,scope:"colgroup"}:{...r,scope:"col"},i()){const n=t.order?"asc"===t.order?"ascending":"descending":"none";r={...r,"aria-sort":n}}return c("th",{...r,key:t.prop},i()?c("button",{class:{[`${m}__order-btn`]:!0,[`${m}__cell-content`]:!0},onClick:function(e){let o;switch(t.order){case"asc":o="desc";break;case"desc":o=null;break;default:o="asc"}n(o,t.prop,e.target.closest("th"))}},M(t),null!=t.filter&&c("nano-icon",{name:"light/filter"}),!!t.order&&c("nano-icon","desc"===t.order?{name:"solid/arrow-down-long"}:{name:"solid/arrow-up-long"}),c("div",{class:`${m}__status-icons`},c("nano-icon",{name:"light/chevron-down"}))):c("div",{class:`${m}__cell-content`},M(t),null!=t.filter&&c("nano-icon",{name:"light/bars-filter"})))},L=(t,n=!1)=>{const e=j().config.state.columns[t],o={[`${m}__td`]:!0,[`${m}__ordered`]:!!e.order,[`${m}__pin`]:!!e.pinned,[`${m}__pin--start`]:"start"===e.pinned,[`${m}__pin--end`]:"end"===e.pinned};return n?O(o):o},W=({rowIndex:t,colIndex:n,nestedContent:o})=>{const s=()=>o?o():function(t,n){const o=j().config.state.columns,s=o[n]?.cellTemplate,a=B(t,n),r=i();if(a.cellModel&&"date"===o[n].type){const t=new Date(a.cellModel);t instanceof Date&&!isNaN(t)&&(a.cellModel=s?t:`${new Date(a.cellModel).toLocaleDateString()} ${new Date(a.cellModel).toLocaleTimeString()}`)}let l=!1,h=s?s(((...t)=>(l=!0,c(...t))),a):void 0;if(h&&r.customRenderer&&void 0===h.t&&!(h instanceof Element)&&"string"!=typeof h&&!l){const t=document.createElement("template"),n=r.customRenderer(h,t.content);h=n&&n.then?n:t}return h||(null!=a.cellModel?c(e,null,a.cellModel?.toString()):"")}(t,n)||c("span",{class:"placeholder"}," ");let a="td";const r=j().config.state.columns[n];if(r.hidden)return c(e,null);let l=function(t,n,e){const o={...e},i=j().config.state.columns[n]?.cellProperties;if(!i)return o;const s=i(B(t,n));return s?E(o,s):o}(t,n,{class:L(n)});r.rowHeader&&(l=Number(l.rowSpan)>1?{...l,scope:"rowgroup"}:{...l,scope:"row"},a="th");const h=t=>{const n=s();return c("div",{ref:t=>{t&&(n instanceof Element?(t.replaceChildren(),t.append(n.content||n)):n.then&&n.then((n=>t.innerHTML=n)))},...t,class:{[`${m}__cell-content`]:!0,[`${m}__cell-content--wrap`]:!!r.wrap},innerHTML:"string"==typeof n&&n.includes("<")?n:void 0},("string"!=typeof n||!n.includes("<"))&&!n.then&&!(n instanceof Element)&&n)};return c(a,{...l},r.autoTooltip&&!r.wrap?c("nano-resize-observe",{notifyContentFit:"x",onNanoResizeContentFitChange:t=>t.target.firstElementChild.disabled=t.detail.x},c("nano-tooltip",{disabled:!0,placement:"top",onNanoShow:t=>t.target.closest(a).style.zIndex="100",onNanoHide:t=>t.target.closest(a).style.zIndex=""},c(h,null),c("span",{slot:"content"},c(s,null)))):c(h,null))},Y=(t,n,e)=>{const o=c("div",{...t.wrapperProps,class:{[`${m}__cell-content`]:!0,[`${m}__cell-content--wrap`]:t.wrap}},n);return t.header?c("th",{scope:e,...t.cellProps},o):c("td",{...t.cellProps},o)},J=({rowRenderer:t,rowIndex:n,rowModel:e},o,i)=>{const s=({header:t,wrap:n,cellProps:e,wrapperProps:o},i)=>Y({header:t,wrap:n,cellProps:e,wrapperProps:o},i,"row");let a,r={};if(!e){const t=function(t){return{rowModel:j().data.state.rows[t],rowIndex:t}}(n);e=t.rowModel}t?.rowProperties&&(r=t.rowProperties({rowModel:e,rowIndex:n})||r),t?.pinned&&"function"==typeof t.pinned&&(a=t.pinned({rowModel:e,rowIndex:n}));const l=E({class:N("tr",a,!0)},r),h=t?.template,d=t=>i.map(t,((t,n)=>(["td","th"].includes(t.vtag.toString())&&(t.vattrs=E({class:L(n,!0)},t.vattrs)),t)));if(h){let t=h(c,{renderedRow:c("tr",{...l,key:e.__uuid},o),rowModel:e,rowIndex:n},s);return Array.isArray(t)&&(t=i.map(t,((t,n)=>("tr"===t.vtag&&(t.vkey||(t.vkey=`${e.__uuid}_${n}`),t.vattrs=E({class:N("tr",a,!0)},t.vattrs),t.vchildren&&(t.vchildren=d(t.vchildren))),t)))),t}return c("tr",{...l,key:e.__uuid},d(o))},K=({rowRenderer:t},n,e)=>{let o={};t.rowProperties&&(o=t.rowProperties()||{});const i=({header:t,wrap:n,cellProps:e,wrapperProps:o},i)=>Y({header:t,wrap:n,cellProps:e,wrapperProps:o},i,"col"),s=t.pinned||null,a={class:N("tr",s)},r=o?E(a,o):a,l=t?.template;if(l){let t=l(c,{renderedRow:c("tr",{...r},n)},i);return Array.isArray(t)&&(t=e.map(t,(t=>("tr"===t.vtag&&(t.vattrs=E({class:N("tr",s,!0)},t.vattrs),t.vchildren&&(t.vchildren=e.map(t.vchildren,(t=>(["td","th"].includes(t.vtag.toString())&&(t.vattrs=E({class:N(t.vtag.toString(),s,!0)},t.vattrs)),t))))),t)))),t}return c("tr",{...r},n)};function X(t,n){const e=document.getElementById(t)||document.createElement("style");e.id=t,e.innerHTML=n,e.isConnected||document.head.append(e)}class q{cachedColMeta=new WeakMap;tableId;tableEle;scrollElement;startColumns;endColumns;topRows;bottomRows;tableDims;constructor(t,n){this.tableEle=t,this.tableId=this.tableEle.id,this.scrollElement=n,this.startColumns=t.querySelector("thead").getElementsByClassName(`${m}__pin--start`),this.endColumns=t.querySelector("thead").getElementsByClassName(`${m}__pin--end`),this.topRows=t.getElementsByClassName(`${m}__pin--top`),this.bottomRows=t.getElementsByClassName(`${m}__pin--bottom`),this.onResize()}get pinnedStart(){return this._pinnedStart}set pinnedStart(t){this._pinnedStart=t,this.handlePinnedStartChange()}_pinnedStart=[];handlePinnedStartChange(){s((()=>{if(this.pinnedStart.length){this.tableEle.classList.add(`${m}__pinned--start`);const t=this.cachedColMeta.get(this.pinnedStart[this.pinnedStart.length-1]);X(`${this.tableId}-col-start-active-style`,`\n          #${this.tableId} tr > :nth-child(${t.idx+1}) {\n            --pin-start-active: 1;\n          }\n        `)}else this.tableEle.classList.remove(`${m}__pinned--start`),X(`${this.tableId}-col-start-active-style`,"")}))}get pinnedEnd(){return this._pinnedEnd}set pinnedEnd(t){this._pinnedEnd=t,this.handlePinnedEndChange()}_pinnedEnd=[];handlePinnedEndChange(){s((()=>{if(this.pinnedEnd.length){this.tableEle.classList.add(`${m}__pinned--end`);const t=this.cachedColMeta.get(this.pinnedEnd[0]);X(`${this.tableId}-col-end-active-style`,`\n          #${this.tableId} tr > :nth-child(${t.idx+1}) { --pin-end-active: 1; }\n        `)}else this.tableEle.classList.remove(`${m}__pinned--end`),X(`${this.tableId}-col-end-active-style`,"")}))}get cssColDimensionCacheKey(){return this._cssColDimensionCacheKey}set cssColDimensionCacheKey(t){t!==this._cssColDimensionCacheKey&&(this._cssColDimensionCacheKey=t,this.createPinnedColDimensionStyles())}_cssColDimensionCacheKey="";generateCssCacheKey(){let t="";for(const n of this.startColumns){const e=this.cachedColMeta.get(n);t+=`${e.idx}-start-${e.width}`}for(const n of this.endColumns){const e=this.cachedColMeta.get(n);t+=`${e.idx}-start-${e.width}`}this.cssColDimensionCacheKey=t}createPinnedColDimensionStyles(){let t=0,n=0;const e=Array.from(this.startColumns),o=Array.from(this.endColumns).reverse(),i=`\n      ${e.map((n=>{const e=this.cachedColMeta.get(n);return t+=e.width-1||-1,`\n            #${this.tableId} tr > :nth-child(${e.idx+1}) ~ td,\n            #${this.tableId} tr > :nth-child(${e.idx+1}) ~ th {\n              --pin-start: ${t-1}px;\n            }\n          `})).join("")}\n      ${o.map((t=>{const e=this.cachedColMeta.get(t);return n+=e.width-1||-1,`\n            #${this.tableId} tr > td:has(~ :nth-child(${e.idx+1})),\n            #${this.tableId} tr > th:has(~ :nth-child(${e.idx+1})) {\n              --pin-end: ${n-1}px;\n            }\n          `})).join("")}\n    `;X(`${this.tableId}-dimension-style`,i)}getParentOffsets(){const{x:t,y:n}=this.scrollElement.getBoundingClientRect();let e=t,o=n;return this.scrollElement===document.documentElement&&(e=this.scrollElement.offsetLeft,o=this.scrollElement.offsetTop),{offsetX:e,offsetY:o}}assessRows(){if((this.topRows.length||this.bottomRows.length)&&(this.topRows.length&&a((async()=>{let t,n=0;const{offsetY:e}=this.getParentOffsets();for(const o of this.topRows){const{y:i,height:a}=o.getBoundingClientRect(),r=o.parentElement,l=getComputedStyle(o).getPropertyValue("--pin-top"),h=""!==l?parseFloat(l):n;s((()=>{i-e<=h?o.classList.add(`${m}__pinned`,`${m}__pinned--top`):o.classList.remove(`${m}__pinned`,`${m}__pinned--top`),t!==r&&(r.style.setProperty("--pin-top",n-1+"px"),n+=a-1,t=r)}))}})),this.bottomRows.length)){const t=Array.from(this.bottomRows).reverse();a((async()=>{let n,e=0;const{offsetY:o}=this.getParentOffsets();for(const i of t){if(!i.isConnected)continue;const{y:t,height:a}=i.getBoundingClientRect(),r=i.parentElement,l=getComputedStyle(i).getPropertyValue("--pin-bottom"),h=""!==l?parseFloat(l):e;await new Promise((l=>s((()=>{this.tableDims.height+o-(t+a)<=h?i.classList.add(`${m}__pinned`,`${m}__pinned--bottom`):i.classList.remove(`${m}__pinned`,`${m}__pinned--bottom`),n!==r&&(r.style.setProperty("--pin-bottom",e-1+"px"),e+=a-1,n=r),l()}))))}}))}}async assessCols(){if(!this.startColumns.length&&!this.endColumns.length)return;let t,n,e;const o=new Promise((o=>{this.startColumns.length&&a((()=>{const{offsetX:i}=this.getParentOffsets();let s=i;e=Array.from(this.startColumns[0].parentElement.children);for(const o of this.startColumns)t=o.getBoundingClientRect(),this.cachedColMeta.set(o,{width:t.width,idx:e.indexOf(o)}),n=this.pinnedStart.find((t=>t===o)),t.x<s?n||(this.pinnedStart=[...this.pinnedStart,o]):n&&(this.pinnedStart=this.pinnedStart.filter((t=>t!==o))),s+=t.width;this.endColumns.length||o()})),this.endColumns.length&&a((()=>{const i=Array.from(this.endColumns).reverse();e=Array.from(this.endColumns[0].parentElement.children);const{offsetX:s}=this.getParentOffsets();let a=0;for(const o of i)t=o.getBoundingClientRect(),this.cachedColMeta.set(o,{width:t.width,idx:e.indexOf(o)}),n=this.pinnedEnd.find((t=>t===o)),this.tableDims.width+s-t.right<=a?n||(this.pinnedEnd=[o,...this.pinnedEnd]):n&&(this.pinnedEnd=this.pinnedEnd.filter((t=>t!==o))),a+=t.width;o()}))}));await o,this.generateCssCacheKey()}cacheX=0;cacheY=0;onScroll(t){this.cacheX!==t.x&&(this.cacheX=t.x,this.assessCols()),this.cacheY!==t.y&&(this.cacheY=t.y,this.assessRows())}onResize(){this.tableDims={width:this.scrollElement.clientWidth,height:this.scrollElement.clientHeight},this.assessCols(),this.assessRows()}}let U=0;const Z=class{constructor(t){r(this,t),this.nanoTblReady=l(this,"nanoTblReady",7),this.nanoTblBlockRendered=l(this,"nanoTblBlockRendered",7),this.nanoTblBeforeSort=l(this,"nanoTblBeforeSort",7),this.nanoTblAfterSort=l(this,"nanoTblAfterSort",7),this.nanoTblBeforeFilter=l(this,"nanoTblBeforeFilter",7),this.nanoTblAfterFilter=l(this,"nanoTblAfterFilter",7),this.nanoTblBeforeSearch=l(this,"nanoTblBeforeSearch",7),this.nanoTblAfterSearch=l(this,"nanoTblAfterSearch",7),this.nanoTblBeforeEdit=l(this,"nanoTblBeforeEdit",7),this.debounceSetLoading=b(this.debounceSetLoading.bind(this),50)}customRenderer;scrollable=!1;caption;showCaption=!1;loading=void 0;get _loading(){return void 0!==this.loading?this.loading:this.internalLoading}set _loading(t){void 0===this.loading&&this.debounceSetLoading(t)}debounceSetLoading(t){this.internalLoading=t}internalLoading=!0;placeholderSize=10;rows;handleRowsChange(){this.rows?(this._loading=!0,Promise.resolve(this.rows).then((async t=>{await function(t,n){const e=P.get(t);if(!e)return;const o=e.config.state.columns,i=o.filter((t=>"date"===t.type)).reduce(((t,n)=>[...t,n.prop]),[]),s=o.filter((t=>!t.type));return n=n.map(((t,n)=>(s.length&&0===n&&(e.config.state.columns=o.map((n=>{var e;return s.includes(n)&&t[n.prop]&&!n.type&&(n.type=(e=t[n.prop])instanceof Date?"date":["number","string","boolean"].includes(typeof e)?typeof e:"unknown","date"===n.type&&i.push(n.prop)),n}))),i.forEach((n=>{const e=new Date(t[n]);e&&Number(e)&&(t[n]=Number(e))})),t.__index=n,t.__uuid=p(o.map((n=>t[n.prop])).join()),t))),e.data.state.rows=n,e.general.state.workerId?R(e.general.state.workerId,n):void 0}(this.host,t),this.customFilterApplied?this.customFilterApplied=!1:this.currentFilters="",this.currentSort="",await this.columnInit(),this.isReady||requestAnimationFrame((()=>this.setInitialBlockDimension())),this._loading=!1,this.tablePinnedService&&this.tablePinnedService.assessRows()}))):this._loading=!0}columns=[];async handleColsChange(){await function(t,n){const e=P.get(t);if(e)return e.config.state.columns=n,e.general.state.workerId?T(e.general.state.workerId,F(n)):void 0}(this.host,this.columns),this.isReady&&this.columnInit()}headRender={pinned:"top"};rowRender;footRender={pinned:"bottom"};showFooter=!1;perBlock=50;get blocksLength(){return this.blocks.length}searchTerm;customFilterFn;customSortFn;defaultSort=!0;handleSearchTermChange(){this.searchStart()}showPaginateSpinner=!1;virtualTotalItems=0;virtualTotalItemsChangeHandler(){this.setBlocks()}get appliedFilters(){return this.filters}nanoTblReady;nanoTblBlockRendered;nanoTblBeforeSort;nanoTblAfterSort;nanoTblBeforeFilter;nanoTblAfterFilter;nanoTblBeforeSearch;nanoTblAfterSearch;nanoTblBeforeEdit;async resetSorting(){const t=this.columns.find((t=>!!t.order));if(t)return this.sortStart(null,t.prop)}async addSort(t,n){const e=this.columns.find((n=>n.prop===t));if(!e)throw new Error("Cannot find column with "+t);return this.sortStart(n,e.prop)}async resetFilters(){return this.filters=[],this.filterStart()}async addFilters(t,n=!0){return n||(this.filters=[]),this.filterStart(t,n)}async removeFilters(t){return this.filters=this.filters.filter((n=>!t.includes(n.prop))),this.filterStart()}async updateRow(t,n){this.rows.splice(n,1,t),this.handleRowsChange()}get host(){return o(this)}renderId="tbl-"+U++;store;filters=[];currentFilters="[]";currentSort="";tableEle;topAnchorEle;activeWatcherIo;tablePinnedService;customFilterApplied=!1;blocks=[];activeBlocks=[0,1];measureHeight=0;blockElements;blockHeights=[];set measureEle(t){if(!t)return;const n=t.getBoundingClientRect().height;this.measureHeight=Math.abs(this.measureHeight-n)<5?this.measureHeight:n,this.unitHeight=t.querySelector("tr")?.getBoundingClientRect().height||this.unitHeight}unitHeight=0;get scrollParent(){return this._scrollParent}set scrollParent(t){t!==this._scrollParent&&(this._scrollParent&&(this._scrollParent===document.documentElement?document:this._scrollParent).removeEventListener("scroll",this.scrollHandler),(t===document.documentElement?document:t).addEventListener("scroll",this.scrollHandler),this._scrollParent=t)}_scrollParent;get primaryBlockIndex(){return this._primaryBlockIndex}set primaryBlockIndex(t){this._primaryBlockIndex!==t&&(this._primaryBlockIndex=t,this.nanoTblBlockRendered.emit({block:t,totalBlocks:this.blockElements.length}))}_primaryBlockIndex;get isReady(){return this._isReady}set isReady(t){t!==this._isReady&&(this._isReady=t,this.isReady&&requestAnimationFrame((()=>this.handleReady())))}_isReady=!1;handleReady(){const t=window.location.hash;if(t.length>1)try{const n=document.querySelector(t);n&&n.scrollIntoView()}catch(t){}this.nanoTblReady.emit()}sortStart=async(t,n,e)=>{if(this.currentSort!==t+":"+n&&(this._loading=!0,!this.nanoTblBeforeSort.emit({column:n,order:t}).defaultPrevented)){if(this.currentSort=t+":"+n,this.scrollToTop(e),this.customSortFn)try{if(!0===await this.customSortFn(n,t))return this.sortComplete(t,n),void(this._loading=!1)}catch(t){return console.warn("custom sort failed",t),this.currentSort="",void(this._loading=!1)}try{await async function(t,n,e){const o=P.get(t);if(o&&o.general.state.workerId)try{o.data.state.rows=await A(o.general.state.workerId,n,e)}catch(t){console.warn(t)}}(this.host,n,t),this.sortComplete(t,n)}catch(t){console.warn("sort failed",t),this.currentSort=""}finally{this.blocks.length&&(this._loading=!1)}}};sortComplete(t,n){this.columns=this.columns.map((e=>e.prop===n?{...e,order:t}:{...e,order:null})),this.nanoTblAfterSort.emit({column:n,order:t})}async searchStart(){if(this._loading=!0,!this.nanoTblBeforeSearch.emit({term:this.searchTerm}).defaultPrevented){this.scrollToTop();try{await async function(t,n){const e=P.get(t);if(e&&e.general.state.workerId)try{e.data.state.rows=await D(e.general.state.workerId,n)}catch(t){console.warn(t)}}(this.host,this.searchTerm),this.nanoTblAfterSearch.emit({term:this.searchTerm})}catch(t){console.warn("search failed",t)}finally{this._loading=!1}}}async filterStart(t,n=!0){if(t&&(this.filters=n?[...this.filters.filter((n=>!t.find((t=>t.prop===n.prop)))),...t]:t),this.currentFilters!==JSON.stringify(this.filters)&&(this._loading=!0,!this.nanoTblBeforeFilter.emit({filters:this.filters}).defaultPrevented)){if(this.currentFilters=JSON.stringify(this.filters),this.scrollToTop(),this.customFilterFn)try{if(!0===await this.customFilterFn(this.filters))return this.customFilterApplied=!0,await this.filterComplete(),void(this._loading=!1)}catch(t){return console.warn("custom filter failed",t),this.currentFilters="",void(this._loading=!1)}try{await this.filterComplete()}catch(t){console.warn("filter failed",t)}finally{this._loading=!1}}}async filterComplete(){this.columns=this.columns.map((t=>{const n=this.filters.find((n=>n.prop===t.prop));return n&&("boolean"!=typeof n.filter&&n.filter.length||"boolean"==typeof n.filter)?t.filter=n.filter:(null!=t.filter||t.filter&&"boolean"!=typeof t.filter&&!t.filter.length)&&(t.filter=void 0),t})),await async function(t,n){const e=P.get(t);if(e&&e.general.state.workerId)try{e.data.state.rows=await I(e.general.state.workerId,n)}catch(t){console.warn(t)}}(this.host,this.filters),this.nanoTblAfterFilter.emit({filters:this.filters})}scrollToTop(t){if(!this.scrollParent)return;const n=this.scrollParent.style?.scrollBehavior,e=this.scrollParent.scrollLeft;this.scrollParent.style.scrollBehavior="auto",this.topAnchorEle&&!_(this.topAnchorEle,.1)&&this.host.scrollIntoView(),t&&!_(t,1)&&setTimeout((()=>t.scrollIntoView({block:"start"})),500),e&&(this.scrollParent.scrollLeft=e),n&&(this.scrollParent.style.scrollBehavior=n),this.scrollHandler()}setMeasureElement(){return new Promise((t=>{a((()=>{this.measureEle=this.blockElements.find((t=>!t?.classList?.contains(`${m}__inactive`))),t()}))}))}setInitialBlockDimension(){if(!this.blockElements?.length)return;const t=async()=>(await this.setMeasureElement(),!!this.unitHeight);new Promise((n=>{t().then((async e=>{if(e)n();else{const e=new IntersectionObserver((async()=>{await t()&&(n(),e.disconnect())}),{root:this.scrollParent});e.observe(this.tableEle)}}))})).then((()=>{requestAnimationFrame((()=>this.isReady=!0))}))}async columnInit(){this.filters=this.columns.filter((t=>null!=t.filter)).map((t=>{const{filter:n,prop:e}=t;return{prop:e,filter:n}})),this.searchTerm&&await this.searchStart(),this.filters.length&&await this.filterStart();const t=this.columns.find((t=>!!t.order));t&&await this.sortStart(t.order,t.prop),this.tablePinnedService&&this.tablePinnedService.assessCols()}setBlocks(){const t=this.store.data.state.rows;if(!t.length)return void(this.blocks=[]);let n=1;const e=this.virtualTotalItems>t.length?this.virtualTotalItems:t.length;let o=[];const i=[];for(;n<=e;n++)o.push(this.store.data.state.rows[n-1]||{__uuid:""}),n%this.perBlock==0&&(i.push({rows:o,__uuid:p(o.map((t=>t.__uuid)).join())}),o=[]);o.length&&i.push({rows:o,__uuid:p(o.map((t=>t.__uuid)).join())}),this.blocks=i}getBlockHeight(t){if(this.blockHeights.length){const n=this.blockHeights.find((n=>n.blockIndex===t));if(n&&n.height)return n.height}const n=this.blocks[t].rows.length;return n===this.perBlock&&this.measureHeight?this.measureHeight:this.unitHeight?this.unitHeight*n:100}setBlockHeight(){this.activeBlocks.forEach((t=>{const n=this.blockElements[t];n&&a((()=>{if(n.classList.contains(`${m}__inactive`))return;const e=n.getBoundingClientRect().height,o=this.blockHeights.findIndex((n=>n.blockIndex===t));o>-1?this.blockHeights[o]={height:e,blockIndex:t}:this.blockHeights.push({height:e,blockIndex:t})}))}))}scrollHandler=()=>{let t=0;this.store?.general.state.isActive&&this.rows&&(void 0===this.primaryBlockIndex&&(this.primaryBlockIndex=0),a((()=>{t=void 0!==this.scrollParent.scrollTop?this.scrollParent.scrollTop:window.scrollY,t+=this.host.offsetTop,this.tablePinnedService&&this.tablePinnedService.onScroll({x:void 0!==this.scrollParent.scrollLeft?this.scrollParent.scrollLeft:window.scrollX,y:t});let n=this.host.offsetTop,e=0;const o=this.blocks.length;for(;e<o&&t>=n;){if(n+=this.getBlockHeight(e),t<n){const t=[e,e+1];t.toString()!==this.activeBlocks.toString()&&(this.activeBlocks=t),this.primaryBlockIndex=e}e++}})))};processSlots(){this.caption||this.host.querySelector('[slot="caption"]')||console.error("For accessibility you must set a `caption` prop or use the `caption` slot")}setupActiveWatcher(){this.host&&this.scrollParent&&this.store&&(this.activeWatcherIo&&(this.activeWatcherIo.disconnect(),this.activeWatcherIo=void 0),(this.activeWatcherIo=new IntersectionObserver((([t])=>{this.store.general.state.isActive=!!t.isIntersecting}),{root:this.scrollParent,threshold:0})).observe(this.scrollable?this.tableEle:this.host))}async componentWillLoad(){this.store=await async function(t,n,e,o){const i={data:f({rows:[]}),config:f({columns:n}),general:f({workerId:null,scrollParent:e,host:t,isReady:o})},s=await S(i.data.state.rows,F(i.config.state.columns));return i.general.state.workerId=s,P.set(t,i),i.data.use({reset:()=>{i.general.state.workerId&&R(i.general.state.workerId,null)},dispose:()=>{i.general.state.workerId&&R(i.general.state.workerId,null)}}),i.config.use({reset:()=>{i.general.state.workerId&&T(i.general.state.workerId,null)},dispose:()=>{i.general.state.workerId&&T(i.general.state.workerId,null)}}),i}(this.host,this.columns,this.scrollParent,this.isReady),this.handleRowsChange(),this.store.general.onChange("isActive",(()=>{this.scrollHandler()})),this.store.data.onChange("rows",(()=>this.setBlocks())),this.processSlots(),this.setBlocks(),this.scrollable||(this.scrollParent=u(this.host),this.setupActiveWatcher())}connectedCallback(){this.scrollable||(this.scrollParent=u(this.host),this.setupActiveWatcher())}componentDidLoad(){this.setInitialBlockDimension(),this.scrollable&&(this.scrollParent=this.host.querySelector(d("nano-masked-overflow")).shadowRoot.querySelector(".onav__scroller"),this.setupActiveWatcher()),this.tablePinnedService||(this.tablePinnedService=new q(this.tableEle,this.scrollParent))}componentShouldUpdate(t,n,e){if(["rows","columns"].includes(e))return!1}componentWillRender(){}componentDidRender(){this.setMeasureElement().then((()=>this.setBlockHeight()))}disconnectedCallback(){this.activeWatcherIo&&(this.activeWatcherIo.disconnect(),this.activeWatcherIo=void 0,(this.scrollParent===document.documentElement?document:this.scrollParent).removeEventListener("scroll",this.scrollHandler))}render(){return this.blockElements=[],c(h,{class:"nano-data-table"},c("div",{class:`${m}__top-anchor`,ref:t=>this.topAnchorEle=t}," "),c("nano-resize-observe",{onNanoResize:()=>{this.tablePinnedService&&this.tablePinnedService.onResize()}}),(t=>this.scrollable?c("nano-masked-overflow",{hideScrollbars:!1,scrollControls:!1,label:this.caption},t):c("div",null,t))(c("div",{class:`${m}__wrap`},c("nano-progress-bar",{class:{[`${m}__progress-bar`]:!0,[`${m}__progress-bar--show`]:this._loading}},c("progress",null)),c("table",{"aria-rowcount":this.store.data.state.rows.length,"aria-colcount":this.store.config.state.columns.length,class:`${m}`,ref:t=>this.tableEle=t,id:"nano-data-table-"+this.renderId,"aria-busy":this._loading||void 0},c("caption",{class:{[`${m}__caption`]:!0,[`${m}__caption--hide`]:!this.showCaption}},c("slot",{name:"caption"},this.caption)),c("thead",null,c(K,{rowRenderer:this.headRender},this.store.config.state.columns.map((t=>[c(H,{column:t,headRenderer:this.headRender,onColumnSortClick:this.sortStart,defaults:{sortable:this.defaultSort}})])))),this._loading&&!this.blocks.length&&c("tbody",{class:`${m}__active ${m}__loading`},[...Array(this.placeholderSize).keys()].map((t=>c("tr",null,this.store.config.state.columns.map(((n,e)=>c(W,{rowIndex:t,colIndex:e,nestedContent:()=>c("span",{class:"n-loader-skeleton"},c("span",null,"Content loading"))}))))))),c("tr",{hidden:!!this._loading||!!this.blocks.length},c("th",{class:`${m}__th`,colSpan:this.store.config.state.columns.length},c("div",{class:"nano-tbl__cell-content nano-tbl__cell-content--no-result"},c("slot",{name:"no-results"},"No results found")))),this.blocks.map(((t,n)=>c("tbody",{key:t.__uuid,id:`tbody-${this.renderId}-${n}`,ref:t=>{this.blockElements.push(t)},class:{[`${m}__inactive`]:!this.activeBlocks.includes(n),[`${m}__active`]:this.activeBlocks.includes(n)}},this.activeBlocks.includes(n)?t.rows.map(((t,e)=>{const o=n>0?n*this.perBlock+e:e;return c(J,{rowRenderer:this.rowRender,rowModel:t,rowIndex:o},this.store.config.state.columns.map(((t,n)=>c(W,{rowIndex:o,colIndex:n}))))})):c("tr",{class:`${m}__tr--placeholder`},c("td",{colSpan:this.store.config.state.columns.length,style:{height:this.getBlockHeight(n)+"px"}}))))),this.showFooter&&c("tfoot",null,c(K,{rowRenderer:this.footRender},this.store.config.state.columns.map((t=>[c(H,{column:t,headRenderer:this.footRender,onColumnSortClick:this.sortStart,defaults:{sortable:this.defaultSort}})]))))),!!this.blocks.length&&this.showPaginateSpinner&&c("nano-spinner",{type:"circle",class:{[`${m}__spinner`]:!0,[`${m}__spinner--show`]:this._loading}}))))}static get watchers(){return{rows:["handleRowsChange"],columns:["handleColsChange"],searchTerm:["handleSearchTermChange"],virtualTotalItems:["virtualTotalItemsChangeHandler"]}}};Z.style=':host,\n*,\n*::before,\n*::after {\n  box-sizing: border-box;\n}\n[hidden] {\n  display: none !important;\n}\n@media (prefers-reduced-motion: reduce) {\n    :host,\n    *,\n    *::before,\n    *::after {\n      animation-duration: 0.01ms !important;\n      animation-iteration-count: 1 !important;\n      transition-duration: 0.01ms !important;\n      scroll-behavior: auto !important;\n    }\n  }:host,\n*,\n*::before,\n*::after {\n  box-sizing: border-box;\n}\n[hidden] {\n  display: none !important;\n}\n@media (prefers-reduced-motion: reduce) {\n    :host,\n    *,\n    *::before,\n    *::after {\n      animation-duration: 0.01ms !important;\n      animation-iteration-count: 1 !important;\n      transition-duration: 0.01ms !important;\n      scroll-behavior: auto !important;\n    }\n  }.nano-data-table {\n  /**\n   * @prop --table-padding. The padding of the table cells. Defaults to `var(--table-compact-padding)`\n   * @prop --table-border-color. The border color of the table cells. Defaults to `var(--nano-color-neutral-200)`\n   * @prop --table-border-color-header. The border color of the table header and footer cells. Defaults to `var(--nano-color-primary-1000)`\n   * @prop --table-background. The background color of the table cells. Defaults to `var(--nano-color-base-0)`\n   * @prop --table-max-col-width. The maximum width of the table columns. Defaults to `clamp(200px, 500px, 50vw)`\n   * @prop --table-ordered-bg. The background color of the ordered table rows. Defaults to `var(--nano-color-neutral-100)`\n   * @prop --table-wrapper-max-height: maximum height of the table when table is scrollable. Defaults to 80vh;\n   * @prop --table-wrapper-max-width: maximum width of the table when table is scrollable. Defaults to 100%;\n   */\n  --table-padding: var(--nano-spacing-sm) calc(var(--nano-spacing-md) - (var(--nano-spacing-md) / 3));\n  --table-border-color: var(--nano-color-neutral-200);\n  --table-border-color-header: var(--nano-color-primary-1000);\n  --table-background: var(--nano-color-base-0);\n  --table-max-col-width: clamp(200px, 500px, 50vw);\n  --table-ordered-bg: var(--nano-color-neutral-100);\n  --table-wrapper-max-height: 80vh;\n  --table-wrapper-max-width: 100%;\n  display: block;\n  inline-size: 100%;\n  color: var(--nano-color-neutral-1400);\n  container-type: inline-size;\n  --isLtR: 1;\n}\n.nano-data-table:dir(rtl) {\n  --isLtR: -1;\n}\n.nano-data-table .nano-sortable__dragged {\n  background: var(--nano-color-base-0);\n  opacity: 0.9;\n  box-shadow: var(--nano-shadow-l0);\n  z-index: 10 !important;\n}\n\n.nano-tbl__wrap {\n  display: table;\n  min-inline-size: 100%;\n}\n.nano-data-table:not([scrollable=false]) .nano-tbl__wrap {\n  max-inline-size: var(--table-wrapper-max-width);\n  max-block-size: var(--table-wrapper-max-height);\n  position: relative;\n  display: block;\n}\n.nano-data-table:not([scrollable=false]) .nano-tbl__wrap table {\n  margin-block-end: var(--nano-spacing-l);\n}\n\n.nano-data-table:not([scrollable=false]):has(.nano-tbl__pin--start, .nano-tbl__pin--end) .nano-masked-overflow {\n  --fade-size: 0;\n}\n\n.nano-tbl {\n  text-align: start;\n  inline-size: 100%;\n  border-spacing: 0 0;\n  border-collapse: separate;\n  border-inline-end: 1px solid transparent;\n  border-block-start: 1px solid transparent;\n  position: relative;\n  z-index: 1;\n}\n.nano-tbl__top-anchor {\n  clip-path: inset(50%);\n  block-size: 1px;\n  overflow: hidden;\n  position: absolute;\n  white-space: nowrap;\n  inline-size: 1px;\n  position: relative;\n}\n.nano-tbl__ordered {\n  background-color: var(--table-ordered-bg);\n  --table-border-color: var(--nano-color-neutral-300);\n}\n.nano-tbl__order-btn {\n  padding: 0;\n  border: none;\n  outline: none;\n  font: inherit;\n  background: none;\n  appearance: none;\n  color: inherit;\n  display: flex;\n  gap: var(--nano-spacing-sm);\n  align-items: center;\n  inline-size: 100%;\n}\n.nano-tbl__order-btn:focus-visible {\n  outline: var(--nano-focus-ring);\n  outline-offset: var(--nano-focus-ring-offset);\n}\n.nano-tbl__status-icons {\n  margin-inline: auto 10px;\n  display: flex;\n  gap: 10px;\n}\n.nano-tbl__progress-bar {\n  --height: 0.2125rem;\n  position: sticky;\n  inset-block-start: 0;\n  inset-inline: 0;\n  z-index: 10;\n  transition: transform 0.25s;\n  transform: scale(0);\n  inline-size: 100%;\n}\n.nano-tbl__progress-bar--show {\n  transform: scale(1);\n}\n.nano-tbl__caption--hide {\n  clip-path: inset(50%);\n  block-size: 1px;\n  overflow: hidden;\n  position: absolute;\n  white-space: nowrap;\n  inline-size: 1px;\n}\n.nano-tbl__td, .nano-tbl__th {\n  max-inline-size: var(--table-max-col-width);\n}\nthead .nano-tbl__td .nano-sortable__keyboard-handle, thead .nano-tbl__th .nano-sortable__keyboard-handle {\n  position: absolute;\n  inset-inline-end: 5px;\n  inset-block-start: 50%;\n  transform: translateY(-50%);\n  background: white;\n  z-index: 10;\n}\n.nano-tbl__td.nano-tbl__ordered, .nano-tbl__th.nano-tbl__ordered {\n  background-color: var(--table-ordered-bg) !important;\n  --table-border-color: var(--nano-color-neutral-300);\n}\n.nano-tbl__cell-content {\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n.nano-tbl__cell-content--no-result {\n  padding-block: var(--nano-spacing-md);\n}\n.nano-tbl__cell-content--wrap {\n  white-space: normal;\n  overflow: visible;\n}\n.nano-tbl tbody {\n  opacity: 1;\n  transition: 0.1s ease opacity;\n}\n.nano-tbl tbody.nano-tbl__loading {\n  z-index: -1;\n  position: relative;\n}\n.nano-tbl tbody.nano-tbl__inactive {\n  opacity: 0;\n}\n.nano-tbl tbody .nano-tbl__tr:has(~ .nano-tbl__tr--placeholder) {\n  display: none;\n}\n.nano-tbl tbody .nano-tbl__tr--placeholder ~ .nano-tbl__tr {\n  display: none;\n}\n.nano-tbl th[scope=row] {\n  margin: 0;\n}\n.nano-tbl__tr {\n  --base-z: 0;\n}\n.nano-tbl__pin {\n  z-index: var(--z, var(--base-z, 0));\n}\n.nano-tbl__pin .nano-tbl__th, .nano-tbl__pin .nano-tbl__td {\n  z-index: var(--z, var(--base-z, 0));\n}\n.nano-tbl__pin--start {\n  position: sticky;\n  inset-inline-start: var(--pin-start, -1px);\n}\n.nano-tbl__pin--start::after {\n  content: "";\n  position: absolute;\n  inset: 0;\n  box-shadow: calc(4px * var(--isLtR)) 0 4px -3px rgb(var(--nano-color-base-rgb-1000)/25%);\n  opacity: var(--pin-start-active, 0);\n  z-index: -1;\n}\n.nano-tbl__pinned--start .nano-tbl__pin--start {\n  --z: calc(var(--base-z) + 3) !important;\n}\n.nano-tbl__pin--end {\n  position: sticky;\n  inset-inline-end: var(--pin-end, -1px);\n  max-inline-size: min(50vw, 200px);\n}\n@container (width <= 500px) {\n  .nano-tbl__pin--start ~ .nano-tbl__pin--end {\n    --z: 0 !important;\n    inset-inline-end: auto !important;\n  }\n  .nano-tbl__pin--start ~ .nano-tbl__pin--end::after {\n    display: none !important;\n  }\n}\n@media (width <= 500px) {\n  .nano-tbl__pin--start ~ .nano-tbl__pin--end {\n    --z: 0 !important;\n    inset-inline-end: auto !important;\n  }\n  .nano-tbl__pin--start ~ .nano-tbl__pin--end::after {\n    display: none !important;\n  }\n}\n.nano-tbl__pin--end::after {\n  display: block;\n  content: "";\n  position: absolute;\n  inset: 0;\n  box-shadow: calc(-4px * var(--isLtR)) 0 4px -3px rgb(var(--nano-color-base-rgb-1000)/25%);\n  opacity: var(--pin-end-active, 0);\n  z-index: -1;\n}\n.nano-tbl__pinned--end .nano-tbl__pin--end {\n  --z: calc(var(--base-z) + 2);\n}\n.nano-tbl__pin--top .nano-tbl__th, .nano-tbl__pin--top .nano-tbl__td {\n  position: sticky;\n  inset-block-start: var(--pin-top, -1px);\n}\n.nano-tbl__pin--top .nano-tbl__pin--end, .nano-tbl__pin--top .nano-tbl__pin--start {\n  --z: calc(var(--base-z) + 1);\n}\n.nano-tbl__pin--top.nano-tbl__pinned--top {\n  --base-z: 4;\n}\ntbody .nano-tbl__pin--top.nano-tbl__pinned--top .nano-tbl__th, tbody .nano-tbl__pin--top.nano-tbl__pinned--top .nano-tbl__td {\n  border-block-end: 1px solid var(--table-border-color-header);\n}\n.nano-tbl__pin--bottom .nano-tbl__th, .nano-tbl__pin--bottom .nano-tbl__td {\n  position: sticky;\n  inset-block-end: var(--pin-bottom, -1px);\n}\n.nano-tbl__pin--bottom .nano-tbl__pin--end, .nano-tbl__pin--bottom .nano-tbl__pin--start {\n  --z: calc(var(--base-z) + 1);\n}\n.nano-tbl__pin--bottom.nano-tbl__pinned--bottom {\n  --base-z: 5;\n}\n.nano-tbl__pin--bottom.nano-tbl__pinned--bottom:has(.nano-tbl__pin--bottom.nano-tbl__pinned--bottom) .nano-tbl__pin {\n  --base-z: 6;\n}\ntbody .nano-tbl__pin--bottom.nano-tbl__pinned--bottom .nano-tbl__th, tbody .nano-tbl__pin--bottom.nano-tbl__pinned--bottom .nano-tbl__td {\n  border-block-start: 1px solid var(--table-border-color-header);\n}\n.nano-tbl thead tr:last-of-type td,\n.nano-tbl thead tr:last-of-type th {\n  border-block-end: 2px solid var(--table-border-color-header);\n}\n.nano-tbl tfoot tr:first-of-type td,\n.nano-tbl tfoot tr:first-of-type th {\n  border-block-start: none;\n}\n.nano-tbl tfoot tr:last-of-type td,\n.nano-tbl tfoot tr:last-of-type th {\n  border-block-end: 2px solid var(--table-border-color-header);\n  border-block-start: 2px solid var(--table-border-color-header);\n}\n.nano-tbl .unlimited-width {\n  max-inline-size: none;\n}\n.nano-tbl__spinner {\n  font-size: 1.5rem;\n  transition: scale 0.25s;\n  scale: 0;\n  padding: 0.5rem;\n  position: absolute;\n  inset-block-end: 0;\n  inset-inline-start: calc(50% - 0.75rem);\n  z-index: 0;\n}\n.nano-tbl__spinner--show {\n  scale: 1;\n  position: sticky;\n}';export{Z as N,$ as c}

package/dist/nano-components/nano-data-table.entry.js

@@ -1,4 +1,4 @@
 /*!
  * Custom elements for Nanopore-Digital Web applications
  */
-export{N as nano_data_table}from"./nano-data-table-DDBCyBmN.js";import"./index-DXvE-U_j.js";import"./renderer-BUaAsDso.js";import"./math-BEqsTfVK.js";import"./throttle-C93FMm2Z.js";import"./scroll-iCYjzh9N.js";import"./dom-Cb7FUtXp.js";import"./index-Dw3NZx59.js";
+export{N as nano_data_table}from"./nano-data-table-wGnglzmF.js";import"./index-DXvE-U_j.js";import"./renderer-BUaAsDso.js";import"./math-BEqsTfVK.js";import"./throttle-C93FMm2Z.js";import"./scroll-iCYjzh9N.js";import"./dom-Cb7FUtXp.js";import"./index-Dw3NZx59.js";

package/dist/nano-components/nano-datalist_3.entry.js

@@ -1,4 +1,4 @@
 /*!
  * Custom elements for Nanopore-Digital Web applications
  */
-import{a as t,r as i,c as e,e as o,d as n}from"./index-DXvE-U_j.js";import{t as s,h as a}from"./renderer-BUaAsDso.js";import{g as r}from"./active-element-C1pBwzyj.js";import{d as h}from"./throttle-C93FMm2Z.js";import{g as d}from"./dom-Cb7FUtXp.js";let l=0;const c=class{isNanoInput=!1;typeToSelect="";typeToSelectTimeout;nanoDropdown;listBox;mo;listId="nano-datalist-"+l++;isFiltered=!1;shouldFocus=!1;get allOptEles(){return this._allOptEles}set allOptEles(t){this._allOptEles=t,this.connectedInput?.value||t.forEach((t=>{t.selected&&!this.selected.includes(t.value)&&this.changeInputValue(t)}))}_allOptEles=[];get host(){return t(this)}actvOptEles=[];connectedInput;inputLabel;hasNoResult;shouldOpen;canOpen=!0;optionIds=[];constructor(t){i(this,t),this.nanoSelect=e(this,"nanoSelect",7),this.nanoDeselect=e(this,"nanoDeselect",7),this.nanoOptionsUpdated=e(this,"nanoOptionsUpdated",7),this.inputChange=h(this.inputChange.bind(this),50)}selected=[];get dropDownConfig(){return this._dropDownConfig}set dropDownConfig(t){this._dropDownConfig={...this._dropDownConfig,...t}}_dropDownConfig={skidding:-1};options=[];input;type="input";get activeOptions(){return this.allOptEles}open=!1;openWatcher(){o((()=>{if(this.open){const{height:t,top:i}=this.nanoDropdown.tetherTo.getBoundingClientRect();this.nanoDropdown.style.setProperty("--max-height",window.innerHeight-(t+i+40)+"px")}this.nanoDropdown.open=this.open,this.connectedInput&&this.connectedInput.setAttribute("aria-expanded",this.open.toString())}))}disableFilter=!1;disabled=!1;async watchInputChange(){let t;(t=this.host.closest(s("nano-input")))?(this.isNanoInput=!0,this.connectedInput=await t.getInputElement()):this.input&&"string"==typeof this.input&&(t=document.querySelector(this.input))?(this.isNanoInput=!1,this.connectedInput=t):"object"==typeof this.input&&(this.connectedInput=this.input)}handleOptionsChange(){if(this.host)if(d(this.host,":not(nano-nav-item):not(nano-option):not([role])",!0).forEach((t=>t.setAttribute("role","none"))),this.options&&this.options.length||this.mo){if(this.options?.length){this.mo&&(this.mo.disconnect(),this.mo=void 0);const t=this.host.querySelectorAll(s("nano-option"));o((()=>{t?.length&&t.forEach((t=>t.remove())),this.allOptEles=this.options.flatMap(((t,i)=>{if(t.value||t.label){const e=Object.assign(document.createElement(s("nano-option")),{label:t.label,value:t.value,ariaPosinset:i,ariaSetsize:this.options.length,selected:t.selected,id:this.listId+"-option-"+i,textContent:t.label?t.label:t.value,slot:"internal-opts"});return this.host.append(e),e}})),this.connectedInput?.value.length&&"select"!==this.type?this.inputChange():this.actvOptEles=[...this.allOptEles]}))}}else(this.mo=new MutationObserver((()=>this.processSlottedContent()))).observe(this.host,{childList:!0,subtree:!0}),this.processSlottedContent()}watchTypeChange(){if(!this.connectedInput)return;let t={closeOnSelect:!1},i="both",e=!1;switch(this.type){case"input":t={closeOnSelect:!0};break;case"select":i="list",e=!0,t={closeOnSelect:!0}}this.isNanoInput||(t.tetherTo=this.connectedInput),this.dropDownConfig={...this.dropDownConfig,...t},this.connectedInput.setAttribute("aria-autocomplete",i),this.connectedInput.readOnly=e}manageInputEvents(t,i){if(i){const t=i.closest(s("nano-input"));t&&t.removeEventListener("nanoChange",this.inputChange),this.removeEventListeners(i),this.inputLabel=null,o((()=>{i.removeAttribute("role"),i.removeAttribute("aria-expanded"),i.removeAttribute("aria-controls"),i.removeAttribute("aria-owns"),i.removeAttribute("aria-haspopup"),i.removeAttribute("aria-autocomplete"),i.removeAttribute("autocomplete")}))}if(t){const i=t.closest(s("nano-input"));i&&i.addEventListener("nanoChange",this.inputChange),t.addEventListener("change",this.inputChange),t.addEventListener("click",this.inputClick),t.addEventListener("keydown",this.inputKeydown),t.addEventListener("input",this.inputChange),this.listId=this.host.id||this.listId,this.inputLabel=t?.labels?.item(0)||function(t){let i;return t.id&&(i=document.querySelector(`label[for='${t.id}']`)),i||(i=t.closest("label")),i}(t),o((()=>{this.host.id=this.listId,t.setAttribute("role","combobox"),t.setAttribute("aria-expanded","false"),t.setAttribute("aria-controls",this.listId),t.setAttribute("aria-owns",this.listId),t.setAttribute("aria-haspopup","listbox"),t.setAttribute("autocomplete","off")}))}}watchActvOptChange(){let t=0;const i=this.connectedInput?.value||"",e=[];o((()=>{this.allOptEles.forEach(((o,n)=>{this.actvOptEles.includes(o)?(t++,o.setAttribute("aria-posinset",t+""),o.setAttribute("aria-setsize",this.actvOptEles.length+""),o.hidden=!1,this.isSelected(o,i)):(o.removeAttribute("aria-posinset"),o.removeAttribute("aria-setsize"),o.hidden=!0,o.selected=!1),o.id=this.listId+"-option-"+n,e.push(o.id)})),this.optionIds=e}))}manageCanOpen(){this.canOpen=!(!this.actvOptEles.length&&!this.hasNoResult)}manageDropdownDisplay(){this.shouldOpen&&this.canOpen&&!this.disabled&&(this.open=!0),this.shouldOpen&&this.canOpen||(this.open=!1),this.openWatcher()}fireActiveOptsEvent(){this.nanoOptionsUpdated.emit(this.actvOptEles)}nanoSelect;nanoDeselect;nanoOptionsUpdated;isSelected(t,i){t.selected=!(i!==t.value&&!this.selected.includes(t.value))}get dropwdownOpen(){return!(!this.nanoDropdown||!this.open)}get exactMatch(){return this.allOptEles.find((t=>this.connectedInput.value===t.value))}changeInputValue(t){let i;if(this.selected.includes(t.value)?(this.selected=this.selected.filter((i=>i!==t.value)),i=this.nanoDeselect.emit(t)):(this.selected=[...this.selected],i=this.nanoSelect.emit(t)),!i.defaultPrevented){this.connectedInput&&(this.connectedInput.value=t.value);const i=new window.Event("change");this.connectedInput?.dispatchEvent(i)}}optSelected=t=>{t.stopPropagation(),this.changeInputValue(t.detail),requestAnimationFrame((()=>this.inputChange())),"selectMulti"!==this.type&&(this.shouldOpen=!1)};setOptStartsWith(){const t=t=>t.toLowerCase().substring(0,this.typeToSelect.length)===this.typeToSelect,i=this.allOptEles.find((i=>i.value.trim().length>0&&!i.disabled&&(t(i.textContent)||t(i.value)||t(i.label)||t(i.filterMeta))));i&&this.changeInputValue(i)}removeEventListeners(t){const i=t.closest(s("nano-input"));i&&i.removeEventListener("nanoChange",this.inputChange),t.removeEventListener("change",this.inputChange),t.removeEventListener("click",this.inputClick),t.removeEventListener("keydown",this.inputKeydown),t.removeEventListener("input",this.inputChange)}processSlottedContent(){requestAnimationFrame((()=>{this.allOptEles=Array.from(this.host.querySelectorAll(s("nano-option"))),this.hasNoResult=!!this.host.querySelector('[slot="no-result"]'),this.connectedInput?.value.length&&"select"!==this.type?this.inputChange():this.actvOptEles=this.allOptEles}))}handleShow=async()=>{this.shouldFocus?(this.shouldFocus=!1,this.listBox.setFocus()):"select"===this.type&&this.listBox.showActiveElement()};handleHide=()=>{this.open=!1,r().closest(this.host.tagName.toLowerCase())&&this.connectedInput.select()};inputChange(){if(this.disableFilter)return void(this.actvOptEles=this.allOptEles);const t=this.connectedInput.value,i=t.trim().toLowerCase();let e=!1;const o=[],n=t=>t.toLowerCase().indexOf(i)>-1;this.allOptEles.forEach((i=>{t!==i.value&&t!==i.label||"selectMulti"===this.type?this.isSelected(i,t):(i.selected=!0,e=!0)})),this.allOptEles.forEach((t=>{(!i.length||e||t.value.trim().length>0&&!t.disabled&&(n(t.textContent)||n(t.value)||n(t.label)||n(t.filterMeta)))&&o.push(t)})),this.isFiltered=i.length&&!e,this.actvOptEles=o}inputClick=()=>{this.open||(this.shouldOpen=!0,this.manageDropdownDisplay())};inputKeydown=t=>{["Shift","ArrowRight","ArrowLeft","Escape","Tab"].includes(t.key)?"Tab"===t.key&&(this.shouldOpen=!1):"select"!==this.type||["ArrowDown","ArrowUp","Enter"].includes(t.key)||" "===t.key&&!this.typeToSelectTimeout?this.open&&["ArrowDown","ArrowUp"].includes(t.key)?this.listBox.setFocus():(this.shouldOpen=!0,this.manageDropdownDisplay(),["ArrowDown","ArrowUp"," ","Enter"].includes(t.key)&&(t.preventDefault(),this.shouldFocus=!0)):(" "===t.key||/^[a-zA0-9]+$/i.test(t.key))&&(clearTimeout(this.typeToSelectTimeout),this.typeToSelectTimeout=window.setTimeout((()=>{this.typeToSelect="",this.typeToSelectTimeout=0}),750),this.typeToSelect+=t.key,this.setOptStartsWith())};optionKeyDown=t=>{["Shift","ArrowUp","ArrowDown","Escape","Enter","Tab","Space","PageUp","PageDown","Home","End"," "].includes(t.key)?"Escape"===t.key&&this.connectedInput.focus():"select"===this.type||this.exactMatch&&!["Delete","Backspace"].includes(t.key)||this.connectedInput.focus()};connectedCallback(){this.watchInputChange()}componentDidLoad(){this.handleOptionsChange(),this.openWatcher()}componentDidRender(){setTimeout((()=>{this.connectedInput||console.warn("no `nano-input` found. `nano-datalist` should be nested within an `nano-input` or linked via `input` prop",this.host)}),500)}disconnectedCallback(){this.mo&&(this.mo.disconnect(),this.mo=void 0),this.connectedInput&&(this.connectedInput=void 0)}render(){return a(n,{key:"c869f626deae72020846edf761d0d8f1b59c34e7",class:"nano-datalist",role:this.actvOptEles.length?"listbox":void 0,"aria-owns":this.optionIds.length?this.optionIds.join(" "):void 0,"aria-label":this.optionIds.length?"Select options from the list below":void 0},a("nano-dropdown",{key:"8fa52dc246705c9af636b1c96ee37df8b6bd746d",part:"dropdown",exportparts:"trigger:dropdown__trigger, panel:dropdown__panel",...this.dropDownConfig,ref:t=>this.nanoDropdown=t,dialogTitle:"Select options from the list below",class:{dlist__dropdown:!0,"dlist--isfiltered":this.isFiltered},onNanoAfterShow:this.handleShow,onNanoAfterHide:this.handleHide,role:"group"},a("nano-menu",{key:"998896a220e3cf3f010bda3354bb530ac0cc9296",part:"main-menu",ref:t=>this.listBox=t,hidden:!this.actvOptEles.length,type:"listbox",label:this.inputLabel?this.inputLabel.textContent:void 0,class:{dlist__menu:!0,"dlist__menu--open":this.dropwdownOpen},tabIndex:-1,onNanoSelect:this.optSelected,onKeyDown:this.optionKeyDown},a("slot",{key:"8f585edd48ec29a847818d1e9af8baf0bc4b4ddf",name:"list-top"}),a("slot",{key:"3bdd8c0a51d63b6fcf3a25d630212db4ba7d8a9b"}),a("slot",{key:"a7b997daebd6a1e25f1a4a97e4354b966ceeebd6",name:"internal-opts"}),a("slot",{key:"41ebc4da7244b1e4fb532a2fbb0356ea51eb865a",name:"list-bottom"})),a("nano-menu",{key:"d5d360f4e8d3c78780477572d385daaa4bb12c15",part:"no-result-menu",type:"listbox",label:"No results found",hidden:!!this.actvOptEles.length,class:{dlist__menu:!0,"dlist__menu--open":this.dropwdownOpen}},a("slot",{key:"3cc55519054da79e57dc70ecc936c0e67e7e3949",name:"no-result"})),!!this.actvOptEles&&a("div",{key:"0662bfdc4056f2111647550d9aba6a331653d2f3",class:"dlist__status"},this.actvOptEles.length," result",this.actvOptEles.length>1?"s":""," available.")))}static get watchers(){return{open:["openWatcher"],input:["watchInputChange"],options:["handleOptionsChange"],type:["watchTypeChange"],connectedInput:["watchTypeChange","manageInputEvents"],selected:["watchActvOptChange"],actvOptEles:["watchActvOptChange","manageCanOpen","fireActiveOptsEvent"],hasNoResult:["manageCanOpen"],shouldOpen:["manageDropdownDisplay"],canOpen:["manageDropdownDisplay"]}}};c.style=":host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host{--padding-top:8px;--padding-bottom:8px;--padding-start:var(--nano-spacing-l);--padding-end:var(--nano-spacing-l);--font-size:var(--nano-font-size-2xs);--color:var(--nano-color-neutral-1000);color:var(--color)}.dlist--isfiltered ::slotted(*:not(.nano-option,[slot=no-result],[slot=list-top],[slot=list-bottom])){display:none !important}.dlist__dropdown{--min-width:100%;--overflow:auto;display:inline}.dlist__status{clip-path:inset(50%);block-size:1px;overflow:hidden;position:absolute;white-space:nowrap;inline-size:1px}.dlist__menu{--padding-top:inherit;--padding-bottom:inherit;--padding-start:inherit;--padding-end:inherit;--font-size:inherit;--padding:var(--nano-spacing-sm) var(--nano-spacing-l)}";let p=0;const b=class{optId="nano-option-"+p++;get host(){return t(this)}constructor(t){i(this,t),this.nanoSelect=e(this,"nanoSelect",7),this.handleClick=h(this.handleClick.bind(this),5)}value="";valueChanged(){this.value&&this.value.length||this.label||(this.value=this.labelContent)}label="";labelChanged(){this.label&&this.label.length||(this.label=this.labelContent.length?this.labelContent:this.value)}selected=!1;disabled=!1;filterMeta="";href;nanoSelect;handleKeyDown(t){" "!==t.key&&"Enter"!==t.key||this.href||(t.preventDefault(),this.nanoSelect.emit(this.host))}handleClick(){this.disabled||this.href||this.nanoSelect.emit(this.host)}get labelContent(){return d(this.host,"*:not([slot])",!1).map((t=>t.textContent)).join(" ").trim()}componentWillLoad(){this.valueChanged(),this.labelChanged()}render(){return a(n,{key:"ab20615d63e2e61ae1d685d4e56074e9192aad02",role:"option","aria-selected":this.selected?"true":"false","aria-disabled":this.disabled?"true":"false",class:"nano-option"},a(this.href?"a":"div",{key:"b301227561b6201851a03b6b1511fc789d58f872",href:this.href||void 0,onMouseDown:this.handleClick,id:this.optId,class:{option:!0,"option--selected":this.selected,"option--disabled":this.disabled,"option--novalue":!this.value}},a("div",{key:"ed2d11478560dd2e73f7b1373a6742a3f14368a8",part:"check-icon",class:"option__check"},a("slot",{key:"23a98f11788b6427ea1187bd4f0ddce6fb945ad1",name:"check-icon"},a("nano-icon",{key:"ae544942a830172078186d6b060d06423cdce4f6",name:"light/check","aria-hidden":"true"}))),a("div",{key:"8cc27b2315e7746e5a239cc5f28f656963736e56",part:"start",class:"option__start"},a("slot",{key:"774af5f7b50587f609dcefa3ba5c41340d9a6acf",name:"start"})),a("div",{key:"3c4524e66aac70d5e74b42271ff57ab10f747cf6",part:"label",class:"option__label"},a("slot",{key:"dc4fa00135857715d9867f747a14a19b01b892d1"},this.label||this.value)),a("div",{key:"3f59b784aec9d62f4c1aaf731781ff21b53e114b",part:"end",class:"option__end"},a("slot",{key:"138aa8b09d4195210528e87ff763c8c4d9a668b7",name:"end"}))))}static get watchers(){return{value:["valueChanged"],label:["labelChanged"]}}};b.style=":host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host{--bg:none;--bg-selected:none;--bg-focus:var(--nano-color-blue-cerulean-1000);--bg-disabled:none;--color:var(--nano-color-base-1000);--color-selected:var(--nano-color-base-1000);--color-focus:var(--nano-color-base-0);--color-disabled:var(--nano-color-neutral-300);--opt-icon-size:1em;--padding-start:var(--nano-spacing-sm);--padding-end:var(--nano-spacing-md);--padding-bottom:6px;--padding-top:6px;display:block;color:var(--color);overflow:hidden;font-size:var(--nano-font-size-xs)}:host(:focus){outline:none}.option{color:inherit;text-decoration:none;position:relative;-webkit-user-select:none;user-select:none;cursor:pointer;display:flex;align-items:stretch;inline-size:100%;background:var(--bg);padding-inline:var(--padding-start) var(--padding-end);padding-block:var(--padding-top) var(--padding-bottom)}:host(:focus) .option:not(.option--disabled),:host .option.option--selected{outline:none;background:var(--bg-selected);color:var(--color-selected)}:host(:focus) .option:not(.option--disabled){background:var(--bg-focus);color:var(--color-focus)}.option.option--disabled{outline:none;color:var(--color-disabled);cursor:not-allowed;background:var(--bg-disabled)}.option.option--novalue{font-style:italic;opacity:0.7}.option__label{flex:1 1 auto;display:flex;align-items:center}.option__start{flex:0 0 auto;display:flex;align-items:center}.option__start ::slotted(.nano-icon){font-size:var(--opt-icon-size)}.option__start ::slotted(:last-child){margin-inline-end:var(--padding-end)}.option__end{flex:0 0 auto;display:flex;align-items:center}.option__end ::slotted(.nano-icon){font-size:var(--opt-icon-size)}.option__end ::slotted(:first-child){margin-inline-start:var(--padding-start)}.option__check{visibility:hidden;display:flex;margin-inline-end:var(--padding-start);align-items:center;font-size:var(--nano-font-size-2xs);inline-size:var(--nano-font-size-2xs)}.option--selected:not(.option--novalue) .option__check{visibility:visible}";const u=class{constructor(t){i(this,t),this.nanoClose=e(this,"nanoClose",7)}closable=!1;size="regular";get el(){return t(this)}nanoClose;onKeyDown=t=>{switch(t.key){case"Enter":case" ":t.preventDefault(),this.close()}};handleClick=()=>{this.close()};close(){this.nanoClose.emit()}containsAnchor=()=>!!this.el.querySelector("a");render(){return this.closable&&!this.containsAnchor()&&[a("slot",{key:"0d6e99e16dc034266f43677f5dbb47b7a390d562"}),a("nano-icon-button",{key:"08586a086598c37e6d4af76df6ff19ca1723b3d8",label:"Close","icon-name":"light/xmark-large",onKeyDown:this.onKeyDown,onClick:this.handleClick})]}};u.style=":host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}";export{c as nano_datalist,b as nano_option,u as nano_tag}
+import{a as t,r as i,c as e,e as o,d as n}from"./index-DXvE-U_j.js";import{t as s,h as a}from"./renderer-BUaAsDso.js";import{g as r}from"./active-element-C1pBwzyj.js";import{d as h}from"./throttle-C93FMm2Z.js";import{g as d}from"./dom-Cb7FUtXp.js";let l=0;const c=class{isNanoInput=!1;typeToSelect="";typeToSelectTimeout;nanoDropdown;listBox;mo;listId="nano-datalist-"+l++;isFiltered=!1;shouldFocus=!1;get allOptEles(){return this._allOptEles}set allOptEles(t){this._allOptEles=t,this.connectedInput?.value||t.forEach((t=>{t.selected&&!this.selected.includes(t.value)&&this.changeInputValue(t)}))}_allOptEles=[];get host(){return t(this)}actvOptEles=[];connectedInput;inputLabel;hasNoResult;shouldOpen;canOpen=!0;optionIds=[];constructor(t){i(this,t),this.nanoSelect=e(this,"nanoSelect",7),this.nanoDeselect=e(this,"nanoDeselect",7),this.nanoOptionsUpdated=e(this,"nanoOptionsUpdated",7),this.inputChange=h(this.inputChange.bind(this),50)}selected=[];get dropDownConfig(){return this._dropDownConfig}set dropDownConfig(t){this._dropDownConfig={...this._dropDownConfig,...t}}_dropDownConfig={skidding:-1};options=[];input;type="input";get activeOptions(){return this.allOptEles}open=!1;openWatcher(){o((()=>{if(this.open){const{height:t,top:i}=this.nanoDropdown.tetherTo.getBoundingClientRect();this.nanoDropdown.style.setProperty("--max-height",`max(${window.innerHeight-(t+i+40)}px, 48vw)`)}this.nanoDropdown.open=this.open,this.connectedInput&&this.connectedInput.setAttribute("aria-expanded",this.open.toString())}))}disableFilter=!1;disabled=!1;async watchInputChange(){let t;(t=this.host.closest(s("nano-input")))?(this.isNanoInput=!0,this.connectedInput=await t.getInputElement()):this.input&&"string"==typeof this.input&&(t=document.querySelector(this.input))?(this.isNanoInput=!1,this.connectedInput=t):"object"==typeof this.input&&(this.connectedInput=this.input)}handleOptionsChange(){if(this.host)if(d(this.host,":not(nano-nav-item):not(nano-option):not([role])",!0).forEach((t=>t.setAttribute("role","none"))),this.options&&this.options.length||this.mo){if(this.options?.length){this.mo&&(this.mo.disconnect(),this.mo=void 0);const t=this.host.querySelectorAll(s("nano-option"));o((()=>{t?.length&&t.forEach((t=>t.remove())),this.allOptEles=this.options.flatMap(((t,i)=>{if(t.value||t.label){const e=Object.assign(document.createElement(s("nano-option")),{label:t.label,value:t.value,ariaPosinset:i,ariaSetsize:this.options.length,selected:t.selected,id:this.listId+"-option-"+i,textContent:t.label?t.label:t.value,slot:"internal-opts"});return this.host.append(e),e}})),this.connectedInput?.value.length&&"select"!==this.type?this.inputChange():this.actvOptEles=[...this.allOptEles]}))}}else(this.mo=new MutationObserver((()=>this.processSlottedContent()))).observe(this.host,{childList:!0,subtree:!0}),this.processSlottedContent()}watchTypeChange(){if(!this.connectedInput)return;let t={closeOnSelect:!1},i="both",e=!1;switch(this.type){case"input":t={closeOnSelect:!0};break;case"select":i="list",e=!0,t={closeOnSelect:!0}}this.isNanoInput||(t.tetherTo=this.connectedInput),this.dropDownConfig={...this.dropDownConfig,...t},this.connectedInput.setAttribute("aria-autocomplete",i),this.connectedInput.readOnly=e}manageInputEvents(t,i){if(i){const t=i.closest(s("nano-input"));t&&t.removeEventListener("nanoChange",this.inputChange),this.removeEventListeners(i),this.inputLabel=null,o((()=>{i.removeAttribute("role"),i.removeAttribute("aria-expanded"),i.removeAttribute("aria-controls"),i.removeAttribute("aria-owns"),i.removeAttribute("aria-haspopup"),i.removeAttribute("aria-autocomplete"),i.removeAttribute("autocomplete")}))}if(t){const i=t.closest(s("nano-input"));i&&i.addEventListener("nanoChange",this.inputChange),t.addEventListener("change",this.inputChange),t.addEventListener("click",this.inputClick),t.addEventListener("keydown",this.inputKeydown),t.addEventListener("input",this.inputChange),this.listId=this.host.id||this.listId,this.inputLabel=t?.labels?.item(0)||function(t){let i;return t.id&&(i=document.querySelector(`label[for='${t.id}']`)),i||(i=t.closest("label")),i}(t),o((()=>{this.host.id=this.listId,t.setAttribute("role","combobox"),t.setAttribute("aria-expanded","false"),t.setAttribute("aria-controls",this.listId),t.setAttribute("aria-owns",this.listId),t.setAttribute("aria-haspopup","listbox"),t.setAttribute("autocomplete","off")}))}}watchActvOptChange(){let t=0;const i=this.connectedInput?.value||"",e=[];o((()=>{this.allOptEles.forEach(((o,n)=>{this.actvOptEles.includes(o)?(t++,o.setAttribute("aria-posinset",t+""),o.setAttribute("aria-setsize",this.actvOptEles.length+""),o.hidden=!1,this.isSelected(o,i)):(o.removeAttribute("aria-posinset"),o.removeAttribute("aria-setsize"),o.hidden=!0,o.selected=!1),o.id=this.listId+"-option-"+n,e.push(o.id)})),this.optionIds=e}))}manageCanOpen(){this.canOpen=!(!this.actvOptEles.length&&!this.hasNoResult)}manageDropdownDisplay(){this.shouldOpen&&this.canOpen&&!this.disabled&&(this.open=!0),this.shouldOpen&&this.canOpen||(this.open=!1),this.openWatcher()}fireActiveOptsEvent(){this.nanoOptionsUpdated.emit(this.actvOptEles)}nanoSelect;nanoDeselect;nanoOptionsUpdated;isSelected(t,i){t.selected=!(i!==t.value&&!this.selected.includes(t.value))}get dropwdownOpen(){return!(!this.nanoDropdown||!this.open)}get exactMatch(){return this.allOptEles.find((t=>this.connectedInput.value===t.value))}changeInputValue(t){let i;if(this.selected.includes(t.value)?(this.selected=this.selected.filter((i=>i!==t.value)),i=this.nanoDeselect.emit(t)):(this.selected=[...this.selected],i=this.nanoSelect.emit(t)),!i.defaultPrevented){this.connectedInput&&(this.connectedInput.value=t.value);const i=new window.Event("change");this.connectedInput?.dispatchEvent(i)}}optSelected=t=>{t.stopPropagation(),this.changeInputValue(t.detail),requestAnimationFrame((()=>this.inputChange())),"selectMulti"!==this.type&&(this.shouldOpen=!1)};setOptStartsWith(){const t=t=>t.toLowerCase().substring(0,this.typeToSelect.length)===this.typeToSelect,i=this.allOptEles.find((i=>i.value.trim().length>0&&!i.disabled&&(t(i.textContent)||t(i.value)||t(i.label)||t(i.filterMeta))));i&&this.changeInputValue(i)}removeEventListeners(t){const i=t.closest(s("nano-input"));i&&i.removeEventListener("nanoChange",this.inputChange),t.removeEventListener("change",this.inputChange),t.removeEventListener("click",this.inputClick),t.removeEventListener("keydown",this.inputKeydown),t.removeEventListener("input",this.inputChange)}processSlottedContent(){requestAnimationFrame((()=>{this.allOptEles=Array.from(this.host.querySelectorAll(s("nano-option"))),this.hasNoResult=!!this.host.querySelector('[slot="no-result"]'),this.connectedInput?.value.length&&"select"!==this.type?this.inputChange():this.actvOptEles=this.allOptEles}))}handleShow=async()=>{this.shouldFocus?(this.shouldFocus=!1,this.listBox.setFocus()):"select"===this.type&&this.listBox.showActiveElement()};handleHide=()=>{this.open=!1,r().closest(this.host.tagName.toLowerCase())&&this.connectedInput.select()};inputChange(){if(this.disableFilter)return void(this.actvOptEles=this.allOptEles);const t=this.connectedInput.value,i=t.trim().toLowerCase();let e=!1;const o=[],n=t=>t.toLowerCase().indexOf(i)>-1;this.allOptEles.forEach((i=>{t!==i.value&&t!==i.label||"selectMulti"===this.type?this.isSelected(i,t):(i.selected=!0,e=!0)})),this.allOptEles.forEach((t=>{(!i.length||e||t.value.trim().length>0&&!t.disabled&&(n(t.textContent)||n(t.value)||n(t.label)||n(t.filterMeta)))&&o.push(t)})),this.isFiltered=i.length&&!e,this.actvOptEles=o}inputClick=()=>{this.open||(this.shouldOpen=!0,this.manageDropdownDisplay())};inputKeydown=t=>{["Shift","ArrowRight","ArrowLeft","Escape","Tab"].includes(t.key)?"Tab"===t.key&&(this.shouldOpen=!1):"select"!==this.type||["ArrowDown","ArrowUp","Enter"].includes(t.key)||" "===t.key&&!this.typeToSelectTimeout?this.open&&["ArrowDown","ArrowUp"].includes(t.key)?this.listBox.setFocus():(this.shouldOpen=!0,this.manageDropdownDisplay(),["ArrowDown","ArrowUp"," ","Enter"].includes(t.key)&&(t.preventDefault(),this.shouldFocus=!0)):(" "===t.key||/^[a-zA0-9]+$/i.test(t.key))&&(clearTimeout(this.typeToSelectTimeout),this.typeToSelectTimeout=window.setTimeout((()=>{this.typeToSelect="",this.typeToSelectTimeout=0}),750),this.typeToSelect+=t.key,this.setOptStartsWith())};optionKeyDown=t=>{["Shift","ArrowUp","ArrowDown","Escape","Enter","Tab","Space","PageUp","PageDown","Home","End"," "].includes(t.key)?"Escape"===t.key&&this.connectedInput.focus():"select"===this.type||this.exactMatch&&!["Delete","Backspace"].includes(t.key)||this.connectedInput.focus()};connectedCallback(){this.watchInputChange()}componentDidLoad(){this.handleOptionsChange(),this.openWatcher()}componentDidRender(){setTimeout((()=>{this.connectedInput||console.warn("no `nano-input` found. `nano-datalist` should be nested within an `nano-input` or linked via `input` prop",this.host)}),500)}disconnectedCallback(){this.mo&&(this.mo.disconnect(),this.mo=void 0),this.connectedInput&&(this.connectedInput=void 0)}render(){return a(n,{key:"b9c67e5dfc3c26c4eac219d9bdc9081aa79d7122",class:"nano-datalist",role:this.actvOptEles.length?"listbox":void 0,"aria-owns":this.optionIds.length?this.optionIds.join(" "):void 0,"aria-label":this.optionIds.length?"Select options from the list below":void 0},a("nano-dropdown",{key:"29a0de977f7be1a39c5c869a5ab366bb64711d9e",part:"dropdown",exportparts:"trigger:dropdown__trigger, panel:dropdown__panel",...this.dropDownConfig,ref:t=>this.nanoDropdown=t,dialogTitle:"Select options from the list below",class:{dlist__dropdown:!0,"dlist--isfiltered":this.isFiltered},onNanoAfterShow:this.handleShow,onNanoAfterHide:this.handleHide,role:"group"},a("nano-menu",{key:"86769c73825853c557ed7a1dfb0f86898ce6504f",part:"main-menu",ref:t=>this.listBox=t,hidden:!this.actvOptEles.length,type:"listbox",label:this.inputLabel?this.inputLabel.textContent:void 0,class:{dlist__menu:!0,"dlist__menu--open":this.dropwdownOpen},tabIndex:-1,onNanoSelect:this.optSelected,onKeyDown:this.optionKeyDown},a("slot",{key:"f5ea0623591a368f38ce3c1e41ef431c4a9f5960",name:"list-top"}),a("slot",{key:"98804885ffb99528138867d2747af3acef3f64f7"}),a("slot",{key:"1341dc10f96570c04613153cf939aaf7dc21f0d3",name:"internal-opts"}),a("slot",{key:"84d86a667a69cd571f7b96dc29d1ddd58c3d482c",name:"list-bottom"})),a("nano-menu",{key:"9b09caa70bd106eb9e64c714072c0b88275f34c6",part:"no-result-menu",type:"listbox",label:"No results found",hidden:!!this.actvOptEles.length,class:{dlist__menu:!0,"dlist__menu--open":this.dropwdownOpen}},a("slot",{key:"58187330291198ff00571570e2b6b6bfdc79c905",name:"no-result"})),!!this.actvOptEles&&a("div",{key:"72ea39405f558d10de86a14704ed48e869f01426",class:"dlist__status"},this.actvOptEles.length," result",this.actvOptEles.length>1?"s":""," available.")))}static get watchers(){return{open:["openWatcher"],input:["watchInputChange"],options:["handleOptionsChange"],type:["watchTypeChange"],connectedInput:["watchTypeChange","manageInputEvents"],selected:["watchActvOptChange"],actvOptEles:["watchActvOptChange","manageCanOpen","fireActiveOptsEvent"],hasNoResult:["manageCanOpen"],shouldOpen:["manageDropdownDisplay"],canOpen:["manageDropdownDisplay"]}}};c.style=":host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host{--padding-top:8px;--padding-bottom:8px;--padding-start:var(--nano-spacing-l);--padding-end:var(--nano-spacing-l);--font-size:var(--nano-font-size-2xs);--color:var(--nano-color-neutral-1000);color:var(--color)}.dlist--isfiltered ::slotted(*:not(.nano-option,[slot=no-result],[slot=list-top],[slot=list-bottom])){display:none !important}.dlist__dropdown{--min-width:100%;--overflow:auto;display:inline}.dlist__status{clip-path:inset(50%);block-size:1px;overflow:hidden;position:absolute;white-space:nowrap;inline-size:1px}.dlist__menu{--padding-top:inherit;--padding-bottom:inherit;--padding-start:inherit;--padding-end:inherit;--font-size:inherit;--padding:var(--nano-spacing-sm) var(--nano-spacing-l)}";let p=0;const u=class{optId="nano-option-"+p++;get host(){return t(this)}constructor(t){i(this,t),this.nanoSelect=e(this,"nanoSelect",7),this.handleClick=h(this.handleClick.bind(this),5)}value="";valueChanged(){this.value&&this.value.length||this.label||(this.value=this.labelContent)}label="";labelChanged(){this.label&&this.label.length||(this.label=this.labelContent.length?this.labelContent:this.value)}selected=!1;disabled=!1;filterMeta="";href;nanoSelect;handleKeyDown(t){" "!==t.key&&"Enter"!==t.key||this.href||(t.preventDefault(),this.nanoSelect.emit(this.host))}handleClick(){this.disabled||this.href||this.nanoSelect.emit(this.host)}get labelContent(){return d(this.host,"*:not([slot])",!1).map((t=>t.textContent)).join(" ").trim()}componentWillLoad(){this.valueChanged(),this.labelChanged()}render(){return a(n,{key:"ab20615d63e2e61ae1d685d4e56074e9192aad02",role:"option","aria-selected":this.selected?"true":"false","aria-disabled":this.disabled?"true":"false",class:"nano-option"},a(this.href?"a":"div",{key:"b301227561b6201851a03b6b1511fc789d58f872",href:this.href||void 0,onMouseDown:this.handleClick,id:this.optId,class:{option:!0,"option--selected":this.selected,"option--disabled":this.disabled,"option--novalue":!this.value}},a("div",{key:"ed2d11478560dd2e73f7b1373a6742a3f14368a8",part:"check-icon",class:"option__check"},a("slot",{key:"23a98f11788b6427ea1187bd4f0ddce6fb945ad1",name:"check-icon"},a("nano-icon",{key:"ae544942a830172078186d6b060d06423cdce4f6",name:"light/check","aria-hidden":"true"}))),a("div",{key:"8cc27b2315e7746e5a239cc5f28f656963736e56",part:"start",class:"option__start"},a("slot",{key:"774af5f7b50587f609dcefa3ba5c41340d9a6acf",name:"start"})),a("div",{key:"3c4524e66aac70d5e74b42271ff57ab10f747cf6",part:"label",class:"option__label"},a("slot",{key:"dc4fa00135857715d9867f747a14a19b01b892d1"},this.label||this.value)),a("div",{key:"3f59b784aec9d62f4c1aaf731781ff21b53e114b",part:"end",class:"option__end"},a("slot",{key:"138aa8b09d4195210528e87ff763c8c4d9a668b7",name:"end"}))))}static get watchers(){return{value:["valueChanged"],label:["labelChanged"]}}};u.style=":host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host{--bg:none;--bg-selected:none;--bg-focus:var(--nano-color-blue-cerulean-1000);--bg-disabled:none;--color:var(--nano-color-base-1000);--color-selected:var(--nano-color-base-1000);--color-focus:var(--nano-color-base-0);--color-disabled:var(--nano-color-neutral-300);--opt-icon-size:1em;--padding-start:var(--nano-spacing-sm);--padding-end:var(--nano-spacing-md);--padding-bottom:6px;--padding-top:6px;display:block;color:var(--color);overflow:hidden;font-size:var(--nano-font-size-xs)}:host(:focus){outline:none}.option{color:inherit;text-decoration:none;position:relative;-webkit-user-select:none;user-select:none;cursor:pointer;display:flex;align-items:stretch;inline-size:100%;background:var(--bg);padding-inline:var(--padding-start) var(--padding-end);padding-block:var(--padding-top) var(--padding-bottom)}:host(:focus) .option:not(.option--disabled),:host .option.option--selected{outline:none;background:var(--bg-selected);color:var(--color-selected)}:host(:focus) .option:not(.option--disabled){background:var(--bg-focus);color:var(--color-focus)}.option.option--disabled{outline:none;color:var(--color-disabled);cursor:not-allowed;background:var(--bg-disabled)}.option.option--novalue{font-style:italic;opacity:0.7}.option__label{flex:1 1 auto;display:flex;align-items:center}.option__start{flex:0 0 auto;display:flex;align-items:center}.option__start ::slotted(.nano-icon){font-size:var(--opt-icon-size)}.option__start ::slotted(:last-child){margin-inline-end:var(--padding-end)}.option__end{flex:0 0 auto;display:flex;align-items:center}.option__end ::slotted(.nano-icon){font-size:var(--opt-icon-size)}.option__end ::slotted(:first-child){margin-inline-start:var(--padding-start)}.option__check{visibility:hidden;display:flex;margin-inline-end:var(--padding-start);align-items:center;font-size:var(--nano-font-size-2xs);inline-size:var(--nano-font-size-2xs)}.option--selected:not(.option--novalue) .option__check{visibility:visible}";const b=class{constructor(t){i(this,t),this.nanoClose=e(this,"nanoClose",7)}closable=!1;size="regular";get el(){return t(this)}nanoClose;onKeyDown=t=>{switch(t.key){case"Enter":case" ":t.preventDefault(),this.close()}};handleClick=()=>{this.close()};close(){this.nanoClose.emit()}containsAnchor=()=>!!this.el.querySelector("a");render(){return this.closable&&!this.containsAnchor()&&[a("slot",{key:"2ef94e5651a0428b93d9d3619ad0440bf70587e2"}),a("nano-icon-button",{key:"0ad6bfbe3fd9ab8a796bbe915c6d522986236f1d",label:"Close","icon-name":"light/xmark-large",onKeyDown:this.onKeyDown,onClick:this.handleClick})]}};b.style=":host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}";export{c as nano_datalist,u as nano_option,b as nano_tag}

package/dist/nano-components/nano-file-upload.entry.js

@@ -1,4 +1,4 @@
 /*!
  * Custom elements for Nanopore-Digital Web applications
  */
-import{r as o,c as i,a,d as n}from"./index-DXvE-U_j.js";import{h as l}from"./renderer-BUaAsDso.js";let e=0,t=()=>new DataTransfer;try{t()}catch{try{t=()=>new ClipboardEvent("").clipboardData,t()}catch{t=null}}const s=class{constructor(a){o(this,a),this.nanoChange=i(this,"nanoChange",7),this.nanoFocus=i(this,"nanoFocus",7),this.nanoBlur=i(this,"nanoBlur",7),this.nanoValidate=i(this,"nanoValidate",7)}inputEl;publicInputEl;mo;fileInputId="nano-file-upload-"+e++;canChangeFileList=!!t;removeFiles=[];hasHelperSlot;hasLabelSlot;errorMessage="";isDragging=!1;fileList=[];fileListChange(){this.canChangeFileList&&(this.publicInputEl.value="",this.inputEl.files=this.arrToFileList(this.fileList.map((o=>o.file))),setTimeout((()=>{this.nanoChange.emit({value:this.value,files:this.files})}),20))}hasFocus;get host(){return a(this)}name;accept;capture;maxFileSize=1;maxFiles=1;label;placeholder="Choose a file...";hideLabel=!1;required=!1;disabled=!1;clearInput=!1;showInlineError=!0;validateOn="submit";form;shouldValidate(){this.inputEl&&(this.validate(),requestAnimationFrame((()=>{"dirty"===this.validateOn&&this.showInlineValidation()})))}_invalid=!1;get invalid(){return this._invalid}get validityMessage(){return this.inputEl?this.inputEl.validationMessage:""}get files(){return this.inputEl?Array.from(this.inputEl.files).map((o=>(o.objectURL=URL.createObjectURL(o),o))):[]}set files(o){this.addNewFiles(this.arrToFileList(o))}get value(){return this.inputEl?this.inputEl.value:""}set value(o){""===o&&this.inputEl&&(this.fileList=[],this.inputEl.value="")}nanoChange;nanoFocus;nanoBlur;nanoValidate;async reportValidity(o){return o&&(this.validate(),this.showInlineValidation()),{isValid:!this.invalid,errorMessage:this.inputEl.validationMessage}}async setFocus(){this.inputEl&&this.inputEl.focus()}getInputElement(){return Promise.resolve(this.inputEl)}async showError(o){this.inputEl&&(this.inputEl.setCustomValidity(o),this.validate(),this.showInlineValidation())}globalClickHandler(o){this.hasFocus&&o.composedPath().every((o=>o!==this.host))&&this.onBlur()}globalKeydownHandler(o){this.hasFocus&&"Tab"===o.key&&o.target!==this.inputEl&&this.onBlur()}onReset(o){(this.form?document.querySelector("#"+this.form):this.host.closest("form"))&&o.target===this.host.closest("form")&&(this.value="")}onClearClick=()=>{this.value=""};onBlur=()=>{this.hasFocus=!1,this.validate(),"dirty"===this.validateOn&&this.showInlineValidation(),this.nanoBlur.emit()};onFocus=()=>{this.hasFocus=!0,this.nanoFocus.emit()};arrToFileList(o){const i=t();for(let a=0,n=o.length;a<n;a++)i.items.add(o[a]);return i.files}checkFileSize(o){return o/1e6<=this.maxFileSize}checkFileType(o){return!this.accept||this.accept.match(o)&&this.accept.match(o).length>0}validate=()=>{let o;this.errorMessage="",this.inputEl.setCustomValidity(""),this.inputEl.validity.valid?(this.fileList.forEach((i=>{o=null,this.checkFileSize(i.file.size)?this.checkFileType(i.file.type)||(o=`File type is not allowed (${this.accept})`):o="Maximum file size exceeded. Max file size is "+this.maxFileSize+"Mb",i.validationMessage=o,i.valid=!o})),this.fileList.length>this.maxFiles&&(o=`Maxinum number of files exceeded (${this.maxFiles})`)):o=this.inputEl.validationMessage,o&&this.inputEl.setCustomValidity(o)};showInlineValidation(o){"submitThenDirty"===this.validateOn&&(this.validateOn="dirty"),this._invalid=!1,this.errorMessage="",this.inputEl.validity.valid||(this.errorMessage=this.inputEl.validationMessage,this._invalid=!0),this.nanoValidate.emit({isValid:!this._invalid,errorMessage:this.inputEl.validationMessage,originalEvent:o})}slotChangeObserver(){this.mo&&this.mo.disconnect(),(this.mo=new MutationObserver((()=>this.processSlottedContent()))).observe(this.host,{childList:!0,subtree:!0})}processSlottedContent(){this.hasLabelSlot=!!this.host.querySelectorAll('[slot="label"]'),this.hasHelperSlot=!!this.host.querySelector('[slot="helper"]')}addNewFiles(o){const i=Array.from(o).map((o=>({file:o,location:URL.createObjectURL(o),valid:!0,validationMessage:null})));if(this.canChangeFileList&&this.maxFiles>1){const o=i.filter((o=>!this.fileList.find((i=>i.file.name===o.file.name))));this.fileList=[...this.fileList,...o]}else this.fileList=i}onInvalid=o=>{this.showInlineError&&o.preventDefault(),this.validate(),this.showInlineValidation(o)};onFileChoose=o=>{const i=o.target.files;i&&i.length&&this.addNewFiles(o.target.files)};onFileRemoveFileClick=(o,i)=>{this.canChangeFileList&&(this.removeFiles.push(i),o.target.closest(".file-upload__list-item--active").classList.remove("file-upload__list-item--active"))};onFileRemoveAnim=()=>{if(this.canChangeFileList&&this.removeFiles.length){this.fileList=this.fileList.filter((o=>!this.removeFiles.find((i=>i===o))));try{this.removeFiles.forEach((o=>o.location?URL.revokeObjectURL(o.location):""))}catch(o){console.error(o)}this.removeFiles=[]}};onInputChange=()=>{this.nanoChange.emit({value:this.value,files:this.files})};onDragStop=o=>{o.preventDefault(),o.stopPropagation(),this.isDragging=!1};onDragStart=o=>{o.preventDefault(),o.stopPropagation(),this.isDragging=!0};onDrop=o=>{this.onDragStop(o),o.dataTransfer.files&&o.dataTransfer.files.length&&this.addNewFiles(o.dataTransfer.files)};disconnectedCallback(){this.mo&&this.mo.disconnect()}componentDidLoad(){this.slotChangeObserver()}componentWillLoad(){this.processSlottedContent()}FileUploadInput=(o,i)=>{const a=this.fileInputId+"-lbl",n=this.showInlineError||this.hasHelperSlot?this.fileInputId+"-more":"";return[l("div",{class:"file-upload__"+o+"-wrap"},l("label",{class:"file-upload__"+o,htmlFor:this.fileInputId,id:a,onDrop:o=>{this.onDrop(o),this.onDragStop(o)},onDragEnd:this.onDragStop,onDragLeave:this.onDragStop,onDragEnter:this.onDragStart,onDragOver:this.onDragStart},(!!this.label||this.hasLabelSlot&&"drop"!==o)&&l("div",{class:"file-upload__label "+(this.hideLabel?"visually-hide":"")},this.label&&this.label.length?this.label:"",!this.label&&this.hasLabelSlot&&"drop"!==o&&l("slot",{name:"label"})),"drop"===o&&l("div",{class:"file-upload__drop-area"},l("div",null,this.hasLabelSlot&&l("slot",{name:"label"})),l("div",null,"Drag and drop or ",l("span",null,"browse"))),"btn"===o&&l("div",{class:"file-upload__button button--keyline button--icon-start "+(this.hasFocus?"button--focus":"")},l("div",{class:"file-upload__btn-content"},l("nano-icon",{name:"regular/cloud-arrow-up"}),l("span",null,this.fileList.length?this.fileList[0].file.name:this.placeholder),!!this.value&&this.clearInput&&!this.disabled&&l("button",{type:"button",class:"icon file-upload__clear-btn",tabindex:"-1",onClick:this.onClearClick},l("nano-icon",{name:"light/xmark"})))),l("input",{"aria-labelledby":a+" "+n+" "+i,type:"file",id:this.fileInputId,accept:this.accept,class:"file-upload__input",multiple:this.maxFiles>1,disabled:this.disabled,name:this.canChangeFileList?void 0:this.name,form:this.form,ref:o=>{this.canChangeFileList?this.publicInputEl=o:this.inputEl=o},onChange:this.onFileChoose,onFocus:this.onFocus,onReset:this.onInputChange})),l("input",{name:this.canChangeFileList?this.name:void 0,form:this.form,ref:o=>{this.canChangeFileList&&(this.inputEl=o)},type:"file",id:this.fileInputId+"-hidden",tabIndex:-1,multiple:!0,class:"file-upload__input",disabled:this.disabled,required:this.required,accept:this.accept,onInvalid:this.onInvalid,onChange:this.onInputChange})),this.showInlineError||this.hasHelperSlot?l("div",{class:"file-upload__more",id:n},this.showInlineError&&this.errorMessage.length?l("div",{class:"file-upload__error"},this.errorMessage):"",l("div",{class:"file-upload__help"},l("slot",{name:"helper"}))):""]};button=()=>this.FileUploadInput("btn");dropArea=()=>{const o=this.fileInputId+"-list";return[this.FileUploadInput("drop",o),l("output",{class:"file-upload__list-wrap",id:o},!!this.fileList&&this.fileList.length>0&&l("ul",{class:"file-upload__list list"},this.fileList.map((o=>l("li",{key:o.file.name,class:"file-upload__list-item file-upload__list-item--active list-item",onAnimationEnd:()=>this.onFileRemoveAnim()},l("span",{class:"list-title"},o.file.name),!o.valid&&l("nano-tooltip",{content:o.validationMessage,placement:"left"},l("nano-icon-button",{class:"list-button list-error",iconName:"light/triangle-exclamation",label:"File error"})),this.canChangeFileList&&l("nano-icon-button",{class:"list-button list-button--view",type:"button",iconName:"light/eye",label:"View file",target:"_blank",href:o.location}),this.canChangeFileList&&l("nano-icon-button",{onClick:i=>this.onFileRemoveFileClick(i,o),class:"list-button list-button--remove",iconName:"light/xmark",label:"Remove file"}))))))]};render(){return l(n,{key:"2bd95bf5d3c725d84679a373eac2f87b491ae2bd",class:"nano-file-upload"},l("div",{key:"026b77c3165ea04d5ed9a2f8536fd5089ed3ee8e",class:{"file-upload":!0,"file-upload--dragging":this.isDragging,"file-upload--focus":this.hasFocus,"file-upload--invalid":this._invalid}},l(this.maxFiles>1?this.dropArea:this.button,null)))}static get watchers(){return{fileList:["fileListChange","shouldValidate"],maxFiles:["shouldValidate"],maxFileSize:["shouldValidate"],capture:["shouldValidate"],accept:["shouldValidate"],required:["shouldValidate"],disabled:["shouldValidate"]}}};s.style='.sc-nano-file-upload-h,*.sc-nano-file-upload,*.sc-nano-file-upload::before,*.sc-nano-file-upload::after{box-sizing:border-box}[hidden].sc-nano-file-upload{display:none !important}@media (prefers-reduced-motion: reduce){.sc-nano-file-upload-h,*.sc-nano-file-upload,*.sc-nano-file-upload::before,*.sc-nano-file-upload::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}.sc-nano-file-upload-h,*.sc-nano-file-upload,*.sc-nano-file-upload::before,*.sc-nano-file-upload::after{box-sizing:border-box}[hidden].sc-nano-file-upload{display:none !important}@media (prefers-reduced-motion: reduce){.sc-nano-file-upload-h,*.sc-nano-file-upload,*.sc-nano-file-upload::before,*.sc-nano-file-upload::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}.sc-nano-file-upload-h{min-block-size:1rem;display:block;--invalid-msg-color:var(--nano-color-danger, #ef4135);--invalid-msg-font-size:var(--nano-input-help-font-size, 0.75em);--help-msg-color:var(--nano-input-help-color, #616d6e);--label-color:var(--nano-input-label-color, "currentcolor");--label-font-size:var(--nano-input-label-color, 1em);--label-padding:var(--nano-input-padding-bottom, var(--nano-input-padding, 6px));--label-color--invalid:var(--nano-input-label-color-invalid, "currentcolor");--drop-bg:#f2f7f9;--drop-text:#756f6a;--drop-height:3.5em;--drop-border-tint:var(--nano-color-primary-rgb, 0 116 149);--drop-border-width:2px;--drop-border-radius:5px;--drop-bg--invalid:var(--nano-input-background-color, white);--drop-border--invalid:var(--nano-color-danger-rgb, 239 65 53);--btn-bg:var(--nano-color-primary, #007495);--btn-text:var(--nano-color-primary-contrast, #fff);--btn-icon-size:var(--nano-btn-icon-size, 1.4em);--btn-padding-top:var(--nano-btn-padding-top, 0.5em);--btn-padding-bottom:var(--nano-btn-padding-bottom, 0.5em);--btn-padding-start:var(--nano-btn-padding-start, 1rem);--btn-padding-end:var(--nano-btn-padding-end, 1rem)}[disabled].sc-nano-file-upload-h:not([disabled=false]){opacity:0.7}[disabled].sc-nano-file-upload-h:not([disabled=false]) *.sc-nano-file-upload{pointer-events:none !important}.file-upload__label.sc-nano-file-upload{font-size:var(--label-font-size);padding:0 0 var(--label-padding);margin:0;line-height:1}[invalid].sc-nano-file-upload-h:not([invalid=false]) .file-upload__label.sc-nano-file-upload{color:var(--label-color--invalid)}.file-upload__input.sc-nano-file-upload{clip-path:inset(50%);block-size:1px;overflow:hidden;position:absolute;white-space:nowrap;inline-size:1px}.file-upload__error.sc-nano-file-upload,.file-upload__help.sc-nano-file-upload,.file-upload__more.sc-nano-file-upload,.file-upload__label.sc-nano-file-upload{display:block;inline-size:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.file-upload__more.sc-nano-file-upload{block-size:1em;margin-block:calc(var(--label-padding) / 2) var(--label-padding);margin-inline:3px 0;position:relative}.file-upload__error.sc-nano-file-upload,.file-upload__help.sc-nano-file-upload{inset-block-start:0;inset-inline-start:0;position:absolute;font-size:var(--invalid-msg-font-size);line-height:1.2;transition:0.3s ease-out opacity}.file-upload--invalid.sc-nano-file-upload .file-upload__error.sc-nano-file-upload,.file-upload--invalid.sc-nano-file-upload .file-upload__help.sc-nano-file-upload{opacity:1}.file-upload__error.sc-nano-file-upload{color:var(--invalid-msg-color);opacity:0}.file-upload--invalid.sc-nano-file-upload .file-upload__error.sc-nano-file-upload{opacity:1}.file-upload__help.sc-nano-file-upload{font-style:italic;opacity:1;color:var(--help-msg-color)}.file-upload--invalid.sc-nano-file-upload .file-upload__help.sc-nano-file-upload{opacity:0}.file-upload__drop.sc-nano-file-upload{position:relative;inline-size:100%;display:inline-block}.file-upload__drop-area.sc-nano-file-upload{flex-direction:column;background-color:var(--drop-bg);color:var(--drop-text);min-block-size:var(--drop-height);display:flex;align-items:center;justify-content:center;font-size:0.9em;position:relative;transition:background-color 0.15s ease-in-out;padding:0.5rem}[disabled].sc-nano-file-upload-h:not([disabled=false]) .file-upload__drop-area.sc-nano-file-upload{opacity:0.7}.file-upload--invalid.sc-nano-file-upload .file-upload__drop-area.sc-nano-file-upload{background-color:var(--drop-bg--invalid)}.file-upload--dragging.sc-nano-file-upload .file-upload__drop-area.sc-nano-file-upload{background-color:#fff}.file-upload__drop-area.sc-nano-file-upload::after{content:"";position:absolute;border-radius:var(--drop-border-radius);border-width:var(--drop-border-width);border-color:rgb(var(--drop-border-tint)/50%);border-style:dashed;inset:0;transition:top 0.1s ease-in-out, bottom 0.1s ease-in-out, left 0.1s ease-in-out, right 0.1s ease-in-out}.file-upload--invalid.sc-nano-file-upload .file-upload__drop-area.sc-nano-file-upload::after{border-color:rgb(var(--drop-border--invalid)/100%)}.file-upload--dragging.sc-nano-file-upload .file-upload__drop-area.sc-nano-file-upload::after{inset:5px}.file-upload__drop-area.sc-nano-file-upload span.sc-nano-file-upload{color:rgb(var(--drop-border-tint)/100%);text-decoration:underline;border-radius:2px;z-index:1;cursor:pointer;position:relative}.file-upload--focus.sc-nano-file-upload .file-upload__drop-area.sc-nano-file-upload span.sc-nano-file-upload{box-shadow:var(--nano-control-focus-shadow, 0 0 0 0.1875rem  var(--nano-control-focus-color, rgba(144, 198, 231, 0.8)))}.file-upload__list.sc-nano-file-upload{list-style:none;margin:0;padding:0}.file-upload__list-wrap.sc-nano-file-upload{position:relative;inset-block-start:-4px}.file-upload__list-item.sc-nano-file-upload{inline-size:100%;margin:0 0 2px;display:flex;align-items:center;transform:translateZ(0);animation:hideListItem 0.3s ease-in-out forwards}@keyframes hideListItem{0%{opacity:1;transform:translateY(0);transform:translateZ(0)}100%{opacity:0;transform:translateY(10px);transform:translateZ(0)}}.file-upload__list-item--active.sc-nano-file-upload{animation:showListItem 0.3s ease-in-out forwards}@keyframes showListItem{0%{opacity:0;transform:translateY(10px);transform:translateZ(0)}100%{opacity:1;transform:translateY(0);transform:translateZ(0)}}.file-upload__list.sc-nano-file-upload .list-title.sc-nano-file-upload{background:var(--nano-color-blue--faded);border-radius:5px;padding:5px;margin-inline-end:2px;display:block;inline-size:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-size:0.9em;color:var(--help-msg-color)}.file-upload__list.sc-nano-file-upload .list-button.sc-nano-file-upload{background:var(--nano-color-blue--faded);border-radius:5px;margin:2px}.file-upload__list.sc-nano-file-upload .list-error.sc-nano-file-upload{--color:rgb(var(--drop-border--invalid) / 100%)}.file-upload__button.sc-nano-file-upload{padding:0;border:none;background-color:transparent;font:inherit;-webkit-box-align:center;text-decoration:none;color:inherit;transition:background-color 100ms ease-in-out, box-shadow 100ms ease-in-out, border-color 100ms ease-in-out, color 100ms ease-in-out;padding-inline:var(--nano-btn-padding-start, 1rem) var(--nano-btn-padding-end, 1rem);padding-block:var(--nano-btn-padding-top, 0.5rem) var(--nano-btn-padding-bottom, 0.5rem);box-shadow:var(--nano-layer-shadow-medium, 0 2px 4px rgba(0, 0, 0, 0.2));display:inline-block;border-radius:var(--nano-btn-border-radius, 5px);line-height:var(--nano-btn-line-height, 1.5em);font-weight:400;cursor:pointer;background:rgba(0, 0, 0, 0.02);background-color:var(--btn-bg);color:var(--btn-text);--nano-btn-icon-size:var(--btn-icon-size);--nano-btn-line-height:var(--btn-icon-size);--nano-btn-padding-top:var(--btn-padding-top);--nano-btn-padding-bottom:var(--btn-padding-bottom);--nano-btn-padding-start:var(--btn-padding-start);--nano-btn-padding-end:var(--btn-padding-end);max-inline-size:100%;font-size:0.9em}.file-upload__button.sc-nano-file-upload::-moz-focus-inner{border:0;padding:0}.file-upload__button.sc-nano-file-upload:hover,.file-upload__button.sc-nano-file-upload:focus{text-decoration:none;color:inherit}@media print{.file-upload__button.sc-nano-file-upload{display:none}}.file-upload__button.sc-nano-file-upload:focus,.file-upload__button.button--focus.sc-nano-file-upload{outline:none;box-shadow:var(--nano-control-focus-shadow, 0 0 0 0.1875rem  var(--nano-control-focus-color, rgba(144, 198, 231, 0.8)))}.file-upload__button.sc-nano-file-upload nano-icon.sc-nano-file-upload,.file-upload__button.sc-nano-file-upload nano-spinner.sc-nano-file-upload{--base-color-rgb:255 255 255;margin-inline:0.5em 0;font-size:var(--nano-btn-icon-size, 1em);vertical-align:middle;margin-block-start:-0.188em;display:inline-block}.file-upload__button.button--icon-start.sc-nano-file-upload nano-icon.sc-nano-file-upload,.file-upload__button.button--icon-start.sc-nano-file-upload nano-spinner.sc-nano-file-upload{margin-inline:0 0.5em}.file-upload__button.sc-nano-file-upload:hover:not(.button--disabled){box-shadow:var(--nano-layer-shadow-large, 0 2px 8px rgba(0, 0, 0, 0.2))}.file-upload__button.sc-nano-file-upload:active:not(.button--disabled,.sc-nano-file-upload:disabled){box-shadow:none}.file-upload__button--disabled.sc-nano-file-upload,.file-upload__button.sc-nano-file-upload:disabled{opacity:0.6}.file-upload__button--disabled.sc-nano-file-upload:hover,.file-upload__button.sc-nano-file-upload:disabled:hover{cursor:default}.file-upload__button.sc-nano-file-upload:hover:not(.button--disabled,.sc-nano-file-upload:disabled),.file-upload__button.button--active.sc-nano-file-upload{background-color:var(--nano-color-primary-shade, #00637f);color:var(--btn-text)}.file-upload__button.sc-nano-file-upload:hover:not(.button--disabled,.sc-nano-file-upload:disabled).button--keyline,.file-upload__button.button--active.button--keyline.sc-nano-file-upload{background-color:var(--btn-bg);color:var(--btn-text)}.file-upload__button.sc-nano-file-upload:focus{color:var(--btn-text)}.file-upload__button.button--keyline.sc-nano-file-upload{background:transparent;border-style:var(--nano-btn-border-style, solid);border-width:var(--nano-btn-border-width, 2px);border-radius:var(--nano-btn-border-radius, 5px);padding-block:calc(var(--nano-btn-padding-top, 0.5rem) - var(--nano-btn-border-width, 2px)) calc(var(--nano-btn-padding-bottom, 0.5rem) - var(--nano-btn-border-width, 2px));color:var(--btn-bg);border-color:var(--btn-bg)}.file-upload__button.button--keyline.sc-nano-file-upload:hover:not(.button--disabled,.sc-nano-file-upload:disabled),.file-upload__button.button--keyline.sc-nano-file-upload:not(:focus,.button--focus).sc-nano-file-upload,.file-upload__button.button--keyline.button--active.sc-nano-file-upload{box-shadow:none}[disabled].sc-nano-file-upload-h:not([disabled=false]) .file-upload__button.sc-nano-file-upload{opacity:0.4}.file-upload--dragging.sc-nano-file-upload .file-upload__button.sc-nano-file-upload{--nano-btn-border-style:dashed}.file-upload__button.sc-nano-file-upload .file-upload__clear-btn.sc-nano-file-upload{margin:0;font-size:inherit;padding:0;border:0;outline:none;background-color:transparent;display:flex;align-items:stretch;inline-size:auto;color:var(--clear-btn-color)}.is-invalid.sc-nano-file-upload-h .file-upload__button.sc-nano-file-upload .file-upload__clear-btn.sc-nano-file-upload{color:var(--clear-btn-color--invalid)}.file-upload__button.sc-nano-file-upload .file-upload__clear-btn.sc-nano-file-upload .nano-icon.sc-nano-file-upload{margin-inline:0.4rem 0;margin-block:0}.file-upload__button.sc-nano-file-upload .file-upload__btn-content.sc-nano-file-upload{display:flex;align-items:center}.file-upload__button.sc-nano-file-upload .file-upload__btn-content.sc-nano-file-upload span.sc-nano-file-upload{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-inline-size:0}';export{s as nano_file_upload}
+import{r as i,c as o,a,d as l}from"./index-DXvE-U_j.js";import{h as e}from"./renderer-BUaAsDso.js";let n=0,t=()=>new DataTransfer;try{t()}catch{try{t=()=>new ClipboardEvent("").clipboardData,t()}catch{t=null}}const s=class{constructor(a){i(this,a),this.nanoChange=o(this,"nanoChange",7),this.nanoFocus=o(this,"nanoFocus",7),this.nanoBlur=o(this,"nanoBlur",7),this.nanoValidate=o(this,"nanoValidate",7)}inputEl;publicInputEl;mo;fileInputId="nano-file-upload-"+n++;canChangeFileList=!!t;removeFiles=[];hasHelperSlot;hasLabelSlot;errorMessage="";isDragging=!1;fileList=[];fileListChange(){this.canChangeFileList&&(this.publicInputEl.value="",this.inputEl.files=this.arrToFileList(this.fileList.map((i=>i.file))),setTimeout((()=>{this.nanoChange.emit({value:this.value,files:this.files})}),20))}hasFocus;get host(){return a(this)}name;accept;capture;maxFileSize=1;maxFiles=1;_label="";get label(){return this.required&&!this._label.endsWith("*")?this._label+" *":this._label}set label(i){this._label=i}placeholder="Choose a file";hideLabel=!1;required=!1;disabled=!1;clearable=!1;showInlineError=!0;validateOn="submitThenDirty";form;shouldValidate(){this.inputEl&&(this.validate(),requestAnimationFrame((()=>{"dirty"===this.validateOn&&this.showInlineValidation()})))}_invalid=null;get invalid(){return this._invalid}get validityMessage(){return this.inputEl?this.inputEl.validationMessage:""}get files(){return this.inputEl?Array.from(this.inputEl.files).map((i=>(i.objectURL=URL.createObjectURL(i),i))):[]}set files(i){this.addNewFiles(this.arrToFileList(i))}get value(){return this.inputEl?this.inputEl.value:""}set value(i){""===i&&this.inputEl&&(this.fileList=[],this.inputEl.value="")}nanoChange;nanoFocus;nanoBlur;nanoValidate;async reportValidity(i){return i&&(this.validate(),this.showInlineValidation()),{isValid:!this.invalid,errorMessage:this.inputEl.validationMessage}}async setFocus(){this.inputEl&&this.inputEl.focus()}getInputElement(){return Promise.resolve(this.inputEl)}async showError(i){this.inputEl&&(this.inputEl.setCustomValidity(i),this.showInlineValidation())}globalClickHandler(i){this.hasFocus&&i.composedPath().every((i=>i!==this.host))&&this.onBlur()}globalKeydownHandler(i){this.hasFocus&&"Tab"===i.key&&i.target!==this.inputEl&&this.onBlur()}onReset(i){(this.form?document.querySelector("#"+this.form):this.host.closest("form"))&&i.target===this.host.closest("form")&&(this.value="")}onClearClick=()=>{this.value=""};onBlur=()=>{this.hasFocus=!1,this.validate(),"dirty"===this.validateOn&&this.showInlineValidation(),this.nanoBlur.emit()};onFocus=()=>{this.hasFocus=!0,this.nanoFocus.emit()};arrToFileList(i){const o=t();for(let a=0,l=i.length;a<l;a++)o.items.add(i[a]);return o.files}checkFileSize(i){return i/1e6<=this.maxFileSize}checkFileType(i){return!this.accept||!!i&&this.accept.match(i)&&this.accept.match(i).length>0}validate=()=>{let i;this.errorMessage="",this.inputEl.setCustomValidity(""),this.inputEl.validity.valid?this.fileList.length>this.maxFiles?i=`Maximum number of files exceeded (${this.maxFiles})`:this.fileList.forEach((o=>{let a=null;this.checkFileSize(o.file.size)?this.checkFileType(o.file.type)||(a=`File type is not allowed (${this.accept})`):a="Maximum file size exceeded. Max file size is "+this.maxFileSize+"Mb",o.validationMessage=a,o.valid=!a,a&&(i=a)})):i=this.inputEl.validationMessage,i?this.inputEl.setCustomValidity(i):(this.inputEl.setCustomValidity(""),this.errorMessage="")};showInlineValidation(i){"submitThenDirty"===this.validateOn&&(this.validateOn="dirty"),this._invalid=!1,this.errorMessage="",this.inputEl.validity.valid||(this.errorMessage=this.inputEl.validationMessage,this._invalid=!0),this.nanoValidate.emit({isValid:!this._invalid,errorMessage:this.inputEl.validationMessage,originalEvent:i})}slotChangeObserver(){this.mo&&this.mo.disconnect(),(this.mo=new MutationObserver((()=>this.processSlottedContent()))).observe(this.host,{childList:!0,subtree:!0})}processSlottedContent(){this.hasLabelSlot=!!this.host.querySelectorAll('[slot="label"]'),this.hasHelperSlot=!!this.host.querySelector('[slot="helper"]')}addNewFiles(i){const o=Array.from(i).map((i=>({file:i,location:URL.createObjectURL(i),valid:!0,validationMessage:null})));if(this.canChangeFileList&&this.maxFiles>1){const i=o.filter((i=>!this.fileList.find((o=>o.file.name===i.file.name))));this.fileList=[...this.fileList,...i]}else this.fileList=o}onInvalid=i=>{this.showInlineError&&i.preventDefault(),this.validate(),this.showInlineValidation(i)};onFileChoose=i=>{const o=i.target.files;o&&o.length&&this.addNewFiles(i.target.files)};onFileRemoveFileClick=(i,o)=>{this.canChangeFileList&&(this.removeFiles.push(o),i.target.closest(".file-upload__list-item--active").classList.remove("file-upload__list-item--active"))};onFileRemoveAnim=()=>{if(this.canChangeFileList&&this.removeFiles.length){this.fileList=this.fileList.filter((i=>!this.removeFiles.find((o=>o===i))));try{this.removeFiles.forEach((i=>i.location?URL.revokeObjectURL(i.location):""))}catch(i){console.error(i)}this.removeFiles=[]}};onInputChange=()=>{this.nanoChange.emit({value:this.value,files:this.files})};onDragStop=i=>{i.preventDefault(),i.stopPropagation(),this.isDragging=!1};onDragStart=i=>{i.preventDefault(),i.stopPropagation(),this.isDragging=!0};onDrop=i=>{this.onDragStop(i),i.dataTransfer.files&&i.dataTransfer.files.length&&this.addNewFiles(i.dataTransfer.files)};disconnectedCallback(){this.mo&&this.mo.disconnect()}componentDidLoad(){this.slotChangeObserver()}componentWillLoad(){this.processSlottedContent()}FileUploadInput=(i,o)=>{const a=this.fileInputId+"-lbl",l=this.showInlineError||this.hasHelperSlot?this.fileInputId+"-more":"";return[e("div",{class:"file-upload__"+i+"-wrap"},e("label",{class:"file-upload__"+i,htmlFor:this.fileInputId,id:a,onDrop:i=>{this.onDrop(i),this.onDragStop(i)},onDragEnd:this.onDragStop,onDragLeave:this.onDragStop,onDragEnter:this.onDragStart,onDragOver:this.onDragStart},(!!this.label||this.hasLabelSlot&&"drop"!==i)&&e("div",{class:"file-upload__label "+(this.hideLabel?"visually-hide":"")},this.label&&this.label.length?this.label:"",!this.label&&this.hasLabelSlot&&"drop"!==i&&e("slot",{name:"label"})),"drop"===i&&e("div",{class:"file-upload__drop-area"},e("div",null,this.hasLabelSlot&&e("slot",{name:"label"})),e("div",null,"Drag and drop or ",e("span",null,"browse"))),"btn"===i&&e("div",{class:"file-upload__button button--keyline button--icon-start "+(this.hasFocus?"button--focus":"")},e("nano-cta",{secondary:!0,class:"file-upload__btn-content"},e("div",{class:"button",disabled:this.disabled},this.fileList.length?this.fileList[0].file.name:this.placeholder)),!!this.value&&this.clearable&&!this.disabled&&e("button",{type:"button",class:"icon file-upload__clear-btn",tabindex:"0","aria-label":"Clear selected file",onClick:this.onClearClick},e("nano-icon",{name:"light/xmark"})),!this.disabled&&this.showInlineError&&e("nano-icon",this._invalid?{name:"solid/circle-xmark",class:"file-upload__icon file-upload__icon-error"}:{name:"solid/circle-check",class:"file-upload__icon file-upload__icon-success"})),e("input",{"aria-labelledby":a+" "+l+" "+o,type:"file",id:this.fileInputId,accept:this.accept,class:"file-upload__input",multiple:this.maxFiles>1,disabled:this.disabled,name:this.canChangeFileList?void 0:this.name,form:this.form,ref:i=>{this.canChangeFileList?this.publicInputEl=i:this.inputEl=i},onChange:this.onFileChoose,onFocus:this.onFocus,onReset:this.onInputChange})),e("input",{name:this.canChangeFileList?this.name:void 0,form:this.form,ref:i=>{this.canChangeFileList&&(this.inputEl=i)},type:"file",id:this.fileInputId+"-hidden",tabIndex:-1,multiple:!0,class:"file-upload__input",disabled:this.disabled,required:this.required,accept:this.accept,onInvalid:this.onInvalid,onChange:this.onInputChange})),this.showInlineError||this.hasHelperSlot?e("div",{class:"file-upload__more",id:l},this.showInlineError&&this.errorMessage.length?e("div",{class:"file-upload__error"},this.errorMessage):"",e("div",{class:"file-upload__help"},e("slot",{name:"helper"}))):""]};button=()=>this.FileUploadInput("btn");dropArea=()=>{const i=this.fileInputId+"-list";return[this.FileUploadInput("drop",i),e("output",{class:"file-upload__list-wrap",id:i},!!this.fileList&&this.fileList.length>0&&e("ul",{class:"file-upload__list list"},this.fileList.map((i=>e("li",{key:i.file.name,class:"file-upload__list-item file-upload__list-item--active list-item",onAnimationEnd:()=>this.onFileRemoveAnim()},e("span",{class:"list-title"},i.file.name),!i.valid&&e("nano-tooltip",{content:i.validationMessage,placement:"left"},e("nano-icon-button",{class:"list-button list-error",iconName:"light/triangle-exclamation",label:"File error"})),this.canChangeFileList&&e("nano-icon-button",{class:"list-button list-button--view",type:"button",iconName:"light/eye",label:"View file",target:"_blank",href:i.location}),this.canChangeFileList&&e("nano-icon-button",{onClick:o=>this.onFileRemoveFileClick(o,i),class:"list-button list-button--remove",iconName:"light/xmark",label:"Remove file"}))))))]};render(){return e(l,{key:"4f495870314e3f688517b34be6749cf2b77810ea",class:"nano-file-upload"},e("div",{key:"9baa63fe75b200913f82abb4304d73e22fbb4be4",class:{"file-upload":!0,"file-upload--dragging":this.isDragging,"file-upload--focus":this.hasFocus,"file-upload--invalid":!0===this._invalid,"file-upload--valid":!1===this._invalid}},e(this.maxFiles>1?this.dropArea:this.button,null)))}static get watchers(){return{fileList:["fileListChange","shouldValidate"],maxFiles:["shouldValidate"],maxFileSize:["shouldValidate"],capture:["shouldValidate"],accept:["shouldValidate"],required:["shouldValidate"],disabled:["shouldValidate"]}}};s.style=".sc-nano-file-upload-h,*.sc-nano-file-upload,*.sc-nano-file-upload::before,*.sc-nano-file-upload::after{box-sizing:border-box}[hidden].sc-nano-file-upload{display:none !important}@media (prefers-reduced-motion: reduce){.sc-nano-file-upload-h,*.sc-nano-file-upload,*.sc-nano-file-upload::before,*.sc-nano-file-upload::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}.sc-nano-file-upload-h,*.sc-nano-file-upload,*.sc-nano-file-upload::before,*.sc-nano-file-upload::after{box-sizing:border-box}[hidden].sc-nano-file-upload{display:none !important}@media (prefers-reduced-motion: reduce){.sc-nano-file-upload-h,*.sc-nano-file-upload,*.sc-nano-file-upload::before,*.sc-nano-file-upload::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}.sc-nano-file-upload-h{min-block-size:1rem;display:block;--color-error:var(--nano-color-danger-1100);--color-error-light:var(--nano-color-danger-100);--color-text:var(--nano-color-neutral-1400);--color-drop-browse:var(--nano-color-primary-1200);--color-drop-border:var(--nano-color-primary-1200);--color-drop-bg:var(--nano-color-primary-75);--drop-height:3.5em;--color-btn-bg:var(--nano-color-base-0);--color-btn-border:var(--nano-color-primary-1000);--color-btn-text:var(--nano-color-primary-1000)}[disabled].sc-nano-file-upload-h:not([disabled=false]){cursor:not-allowed}[disabled].sc-nano-file-upload-h:not([disabled=false]) *.sc-nano-file-upload{pointer-events:none !important}.file-upload--invalid.sc-nano-file-upload{--color-drop-bg:var(--color-error-light)}.file-upload--dragging.sc-nano-file-upload{--color-drop-bg:var(--nano-color-success-50)}.file-upload__label.sc-nano-file-upload{font-size:var(--nano-font-size-xs);margin:0;line-height:var(--nano-line-height-normal);letter-spacing:var(--nano-letter-spacing-loose)}[disabled].sc-nano-file-upload-h:not([disabled=false]) .file-upload__label.sc-nano-file-upload{color:var(--nano-color-neutral-1200)}.file-upload__input.sc-nano-file-upload{clip-path:inset(50%);block-size:1px;overflow:hidden;position:absolute;white-space:nowrap;inline-size:1px}.file-upload__error.sc-nano-file-upload,.file-upload__help.sc-nano-file-upload,.file-upload__more.sc-nano-file-upload,.file-upload__label.sc-nano-file-upload{display:block;inline-size:100%;white-space:nowrap;text-overflow:ellipsis}.file-upload__more.sc-nano-file-upload{margin-block:var(--nano-spacing-sm) 0;position:relative}.file-upload__more.sc-nano-file-upload:has(.file-upload__error) .file-upload__help.sc-nano-file-upload{display:none !important}.file-upload__error.sc-nano-file-upload,.file-upload__help.sc-nano-file-upload{inset-block-start:0;inset-inline-start:0;font-style:italic;font-size:var(--nano-font-size-2xs);line-height:var(--nano-line-height-normal);letter-spacing:var(--nano-letter-spacing-loose)}.file-upload--invalid.sc-nano-file-upload .file-upload__error.sc-nano-file-upload,.file-upload--invalid.sc-nano-file-upload .file-upload__help.sc-nano-file-upload{opacity:1}.file-upload__error.sc-nano-file-upload{color:var(--color-error);opacity:0;display:none;transition:all var(--nano-transition-fast) ease;transition-behavior:allow-discrete}.file-upload--invalid.sc-nano-file-upload .file-upload__error.sc-nano-file-upload{opacity:1;display:block}.file-upload__help.sc-nano-file-upload{opacity:1;color:var(--color-text);display:block}.file-upload--invalid.sc-nano-file-upload .file-upload__help.sc-nano-file-upload{opacity:0;display:none}[disabled].sc-nano-file-upload-h:not([disabled=false]) .file-upload__help.sc-nano-file-upload{color:var(--nano-color-neutral-1200);opacity:0.8}.file-upload__drop.sc-nano-file-upload{position:relative;inline-size:100%;display:inline-block}.file-upload__drop-area.sc-nano-file-upload{flex-direction:column;background-color:var(--color-drop-bg);color:var(--color-text);min-block-size:var(--drop-height);padding:var(--nano-spacing-md);display:flex;align-items:center;justify-content:center;position:relative;transition:background-color var(--nano-transition-x-fast) ease-in-out;font-size:var(--nano-font-size-sm);line-height:var(--nano-line-height-normal);letter-spacing:var(--nano-letter-spacing-loose)}[disabled].sc-nano-file-upload-h:not([disabled=false]) .file-upload__drop-area.sc-nano-file-upload{color:var(--nano-color-neutral-1200);background-color:var(--nano-color-neutral-300);border-color:var(--nano-color-neutral-1200)}.file-upload__drop-area.sc-nano-file-upload::after{content:\"\";position:absolute;border-width:1px;background-color:var(--color-drop-border);-webkit-mask-image:url(\"data:image/svg+xml,%3csvg width='100%25' height='100%25' xmlns='http://www.w3.org/2000/svg'%3e%3crect width='100%25' height='100%25' fill='none' stroke='white' stroke-width='2' stroke-dasharray='6%2c 8' stroke-dashoffset='0'/%3e%3c/svg%3e\");mask-image:url(\"data:image/svg+xml,%3csvg width='100%25' height='100%25' xmlns='http://www.w3.org/2000/svg'%3e%3crect width='100%25' height='100%25' fill='none' stroke='white' stroke-width='2' stroke-dasharray='6%2c 8' stroke-dashoffset='0'/%3e%3c/svg%3e\");-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center;inset:0;transition:top var(--nano-transition-x-fast) ease-in-out, bottom var(--nano-transition-x-fast) ease-in-out, left var(--nano-transition-x-fast) ease-in-out, right var(--nano-transition-x-fast) ease-in-out}.file-upload--invalid.sc-nano-file-upload .file-upload__drop-area.sc-nano-file-upload::after{background-color:var(--color-error)}.file-upload--dragging.sc-nano-file-upload .file-upload__drop-area.sc-nano-file-upload::after{background-color:var(--nano-color-success-1100);inset:5px}.file-upload__drop-area.sc-nano-file-upload span.sc-nano-file-upload{color:var(--color-drop-browse);text-decoration:underline;z-index:1;cursor:pointer;position:relative}[disabled].sc-nano-file-upload-h:not([disabled=false]) .file-upload__drop-area.sc-nano-file-upload span.sc-nano-file-upload{color:var(--nano-color-neutral-1200);opacity:0.8}.file-upload--focus.sc-nano-file-upload .file-upload__drop-area.sc-nano-file-upload span.sc-nano-file-upload{outline:var(--nano-focus-ring);outline-offset:var(--nano-focus-ring-offset)}.file-upload__list.sc-nano-file-upload{list-style:none;margin:var(--nano-spacing-xs) 0 0;padding:0}.file-upload__list-wrap.sc-nano-file-upload{position:relative;inset-block-start:-4px}.file-upload__list-item.sc-nano-file-upload{inline-size:100%;margin:0 0 2px;display:flex;align-items:center;animation:hideListItem var(--nano-transition-fast) ease-in-out forwards}@keyframes hideListItem{0%{opacity:1}100%{opacity:0}}.file-upload__list-item--active.sc-nano-file-upload{animation:showListItem var(--nano-transition-fast) ease-in-out forwards}@keyframes showListItem{0%{opacity:0}100%{opacity:1}}.file-upload__list.sc-nano-file-upload .list-title.sc-nano-file-upload{background:var(--color-drop-bg);padding:var(--nano-spacing-xs);margin-inline-end:2px;display:block;inline-size:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-size:var(--nano-font-size-2xs);color:var(--color-text)}.file-upload__list.sc-nano-file-upload .list-button.sc-nano-file-upload{--padding:0.406rem;background:var(--color-drop-bg);margin:2px}.file-upload__list.sc-nano-file-upload .list-error.sc-nano-file-upload{--color:var(--color-error)}.file-upload__drop-area.sc-nano-file-upload,.file-upload__button.sc-nano-file-upload{margin-block:var(--nano-spacing-sm) 0}.file-upload__button.sc-nano-file-upload{max-inline-size:100%;display:flex}.is-invalid.sc-nano-file-upload-h .file-upload__button.sc-nano-file-upload{color:var(--color-error)}.file-upload--dragging.sc-nano-file-upload .file-upload__button.sc-nano-file-upload{--nano-btn-border-style:dashed}.file-upload__clear-btn.sc-nano-file-upload{margin:0;font-size:inherit;padding:0;border:0;outline:none;display:flex;align-items:center;inline-size:auto;color:var(--color-btn-text);background:var(--color-btn-bg)}.is-invalid.sc-nano-file-upload-h .file-upload__clear-btn.sc-nano-file-upload{color:var(--color-error)}.file-upload__clear-btn.sc-nano-file-upload:focus-visible>nano-icon.sc-nano-file-upload{outline:var(--nano-focus-ring);outline-offset:var(--nano-focus-ring-offset)}.file-upload__clear-btn.sc-nano-file-upload .nano-icon.sc-nano-file-upload{margin:0.1rem 0 0 var(--nano-spacing-sm)}.file-upload--focus.sc-nano-file-upload .file-upload__btn-content.sc-nano-file-upload{outline:var(--nano-focus-ring);outline-offset:var(--nano-focus-ring-offset)}.file-upload__btn-content.sc-nano-file-upload div.sc-nano-file-upload{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-inline-size:0;display:block}.file-upload--focus.sc-nano-file-upload .file-upload__btn-content.sc-nano-file-upload div.sc-nano-file-upload{outline:var(--nano-focus-ring);outline-offset:var(--nano-focus-ring-offset)}.file-upload__icon.sc-nano-file-upload{align-self:center;margin-inline-start:var(--nano-spacing-sm);size:var(--nano-icon-size-small)}.file-upload__icon-error.sc-nano-file-upload{color:var(--color-error);opacity:0}.file-upload--invalid.sc-nano-file-upload .file-upload__icon-error.sc-nano-file-upload{opacity:1}.file-upload__icon-success.sc-nano-file-upload{color:var(--nano-color-success-1100);opacity:0}.file-upload--valid.sc-nano-file-upload .file-upload__icon-success.sc-nano-file-upload{opacity:1}";export{s as nano_file_upload}

package/dist/nano-components/nano-footer.entry.js

@@ -1,4 +1,4 @@
 /*!
  * Custom elements for Nanopore-Digital Web applications
  */
-import{r as n,a as e,h as a}from"./index-DXvE-U_j.js";import{a as o}from"./style-BrRDhFfF.js";const t=class{constructor(e){n(this,e)}get host(){return e(this)}componentWillLoad(){o(this.host.shadowRoot)}render(){return a("footer",{key:"6c5f9e943485a21b7c19a1c1173816151450a7a7",class:"footer"},a("div",{key:"4f412bbb7737f5f8225729e2109b688ccc800989",class:"upper"},a("div",{key:"dd53490055399eafe7599aca856dd0ca79ba21fb",class:"top"},a("div",{key:"c8103cf1bcd74ce025924fc975849573051368d0",class:"top-start"},a("slot",{key:"924b1f7d97a15e4afa0126f7c03fe525f97f92ba",name:"top-start_heading"}),a("slot",{key:"3feb30f6395b9acbdd670cd656321ea751a4e81a",name:"top-start_content"})),a("div",{key:"5dd035af59487992c2da47b7b61012da97cfeec4",class:"top-center"},a("slot",{key:"aecc20ee6792c8912cd330724af3a75cfcd487af",name:"top-center_heading"}),a("slot",{key:"f30e4dae00d45df2afb7a419daf875843ad61a50",name:"top-center_content"})),a("div",{key:"824feef5a5f50b461904096752bdb4aeefd84d99",class:"top-end"},a("slot",{key:"7f06ff962236e057b640460097881646e2d8b1b2",name:"top-end_heading"}),a("slot",{key:"5e2412c74e444c570f5ea46b756d2e3369f12215",name:"top-end_content"})))),a("div",{key:"77cb498fde6fb578e3c5a249ca6c3db5c88206d1",class:"lower nano-theme-dark"},a("div",{key:"7f2e8024df8f7470443d0048eefd8978d203f727",class:"middle"},a("div",{key:"18c334b18c07c0ee2416cb646c5f5287c091bdb3",class:"middle-start"},a("img",{key:"be83911db58e7a75566a2d495b843427a7d1fa0a",src:"/nano-assets/img/ont-logo-light.svg",alt:"Oxford Nanopore Technologies logo. Featuring a stylised representation of a nanopore,\n          (a tiny protein channel embedded in a membrane) through which DNA or RNA molecules are passed in for sequencing.",height:"46"})),a("div",{key:"a7b84187146146325db5cb990d53650ebfaf5741",class:"middle-center"},a("a",{key:"d2edfbc2e1034a9378be6291bf290af6d0e36119",href:"https://x.com/nanopore",target:"_blank"},a("nano-icon",{key:"8e8cb317194b2dd9277599c38b525128d94d69c0",name:"brands/x-twitter",size:"large",ariaLabel:"X (formerly Twitter)"})),a("a",{key:"07091f28412bf31e853c5c51d6448631a7e47b33",href:"https://bsky.app/profile/nanoporetech.com",target:"_blank"},a("nano-icon",{key:"8e5f4e5b2d13ce77df193d4a38743d6225f667d6",name:"brands/bluesky",size:"large",ariaLabel:"Bluesky"})),a("a",{key:"2561aa967f77b1ac0618c02fe1e78c270d8f82f7",href:"https://www.youtube.com/channel/UC5yMlYjHSgFfZ37LYq-dzig",target:"_blank"},a("nano-icon",{key:"27ac4933b66ff7027c3f45bc001d0e311055cf0a",name:"brands/youtube",size:"large",ariaLabel:"YouTube"})),a("a",{key:"2b46f3651b32439997c4f1020d89901bcf6679a8",href:"https://www.facebook.com/Oxford-Nanopore-Technologies-251034380246/",target:"_blank"},a("nano-icon",{key:"0f25dc9636ece933dbc00911d0e0c36735203666",name:"brands/facebook",size:"large",ariaLabel:"Facebook"})),a("a",{key:"541bef691993ace5b8c270e82d08984baace7964",href:"https://www.linkedin.com/company/oxford-nanopore-technologies",target:"_blank"},a("nano-icon",{key:"bb4a4104c3a39375d1f50c7c8aca1561a66d9c28",name:"brands/linkedin",size:"large",ariaLabel:"LinkedIn"})),a("a",{key:"4817a0798d5ab0586a20c40a14de73280ce749e3",href:"https://www.instagram.com/oxfordnanopore",target:"_blank"},a("nano-icon",{key:"dea3b9c4bc6100f73a3769999779ab4e6f343193",name:"brands/instagram",size:"large",ariaLabel:"Instagram"}))),a("div",{key:"151bbc03ca7c9fbdb14cf355dd4ff61c6fba1e36",class:"middle-end"},a("slot",{key:"241922e25dbe52e5a6e5b9b661c037f3faa004f5",name:"middle-end"}))),a("div",{key:"08489f7cb75832e26fe862987d19bbdc03b8ff23",class:"bottom"},a("div",{key:"1e2cfb25bbb0f6a60399b344f83a091677d848d7",class:"bottom-start"},a("slot",{key:"ce19389f907a75fb43a533a7ca200670b136ad86",name:"bottom-start"},a("p",{key:"5d6d5135e67276a81f290e91d7753b9b2b4964ce"},"© 2008 - 2025 Oxford Nanopore Technologies plc. All rights reserved. Registered Office: Gosling Building, Edmund Halley Road, Oxford Science Park, OX4 4DQ, UK | Registered No. 05386273 | VAT No 336942382. Oxford Nanopore Technologies, the Wheel icon, EPI2ME, Flongle, GridION, Metrichor, MinION, MinIT, MinKNOW, Plongle, PromethION, SmidgION, Ubik and VolTRAX are registered trademarks of Oxford Nanopore Technologies plc in various countries. Oxford Nanopore Technologies products are not intended for use for health assessment or to diagnose, treat, mitigate, cure, or prevent any disease or condition."))),a("div",{key:"db091f94e130553a106a71071988b2c591a943ab",class:"bottom-end"},a("slot",{key:"6b6642608e571e9d1690de419727476b27e1514f",name:"bottom-end"})))))}};t.style=":host,\n*,\n*::before,\n*::after {\n  box-sizing: border-box;\n}\n[hidden] {\n  display: none !important;\n}\n@media (prefers-reduced-motion: reduce) {\n    :host,\n    *,\n    *::before,\n    *::after {\n      animation-duration: 0.01ms !important;\n      animation-iteration-count: 1 !important;\n      transition-duration: 0.01ms !important;\n      scroll-behavior: auto !important;\n    }\n  }:host,\n*,\n*::before,\n*::after {\n  box-sizing: border-box;\n}\n[hidden] {\n  display: none !important;\n}\n@media (prefers-reduced-motion: reduce) {\n    :host,\n    *,\n    *::before,\n    *::after {\n      animation-duration: 0.01ms !important;\n      animation-iteration-count: 1 !important;\n      transition-duration: 0.01ms !important;\n      scroll-behavior: auto !important;\n    }\n  }:host {\n  --col-gap: var(--nano-spacing-l1-default);\n  --icon-gap-md: var(--nano-spacing-md);\n  --icon-gap-sm: var(--nano-spacing-sm);\n  --vertical-padding: var(--nano-spacing-l1-default);\n  --horizontal-padding: 0;\n  --header-margin: 0 0 var(--nano-spacing-l1-default) 0;\n  display: block;\n}\n:host .footer {\n  container-type: inline-size;\n  container-name: footer-container;\n  display: flex;\n  flex-direction: column;\n}\n@container footer-container (max-width: 768px) {\n  :host .top,\n  :host .middle,\n  :host .bottom {\n    --horizontal-padding: var(--nano-spacing-md);\n    --col-gap: var(--nano-spacing-l);\n    --vertical-padding: var(--nano-spacing-md);\n  }\n  :host .top-start,\n  :host .top-center,\n  :host .top-end {\n    --header-margin: 0 0 var(--nano-spacing-md) 0;\n  }\n}\n@container footer-container (max-width: 1023px) {\n  :host .top,\n  :host .middle,\n  :host .bottom {\n    --horizontal-padding: var(--nano-spacing-l);\n  }\n}\n@container footer-container (max-width: 1346px) {\n  :host .top,\n  :host .middle,\n  :host .bottom {\n    --horizontal-padding: var(--nano-spacing-l1-default);\n  }\n}\n:host .upper {\n  background-color: var(--nano-color-base-rgb-1000);\n  border-block-start: 1px solid var(--nano-color-neutral-200);\n}\n:host .lower {\n  background-color: var(--nano-color-base-0);\n  color: var(--nano-color-base-1000);\n}\n:host .top,\n:host .middle,\n:host .bottom {\n  display: grid;\n  gap: var(--col-gap);\n  margin: 0 auto;\n  max-inline-size: 1266px;\n}\n:host .top,\n:host .middle {\n  grid-template-columns: repeat(3, 1fr);\n  padding: var(--vertical-padding) var(--horizontal-padding);\n}\n:host .bottom {\n  grid-template-columns: repeat(2, 1fr);\n  padding-inline: var(--horizontal-padding);\n  padding-block-end: var(--vertical-padding);\n}\n:host .middle-center a {\n  color: inherit;\n}\n:host .middle-center a:hover {\n  color: var(--nano-color-primary-1000);\n}\n:host .middle-center a:focus-visible {\n  outline: var(--nano-focus-ring);\n  outline-offset: var(--nano-focus-ring-offset);\n}\n:host .top-start,\n:host .top-center,\n:host .top-end {\n  flex-direction: column;\n}\n:host .middle-start,\n:host .middle-center,\n:host .middle-end {\n  align-items: center;\n}\n:host .middle-start {\n  display: flex;\n  justify-content: flex-start;\n}\n:host .middle-center {\n  display: flex;\n  justify-content: center;\n  gap: var(--icon-gap-md);\n  flex-wrap: nowrap;\n}\n:host .middle-end {\n  display: grid;\n  grid-template-columns: repeat(3, minmax(0, 20rem));\n  gap: var(--icon-gap-sm);\n  justify-content: end;\n}\n:host [slot=middle-end] {\n  inline-size: 100%;\n}\n:host .bottom-start p,\n:host .bottom-start ::slotted(p), .bottom-start :host::slotted(p) {\n  font-weight: var(--nano-font-weight-normal) !important;\n  font-size: var(--nano-font-size-xs) !important;\n  line-height: var(--nano-line-height-normal) !important;\n  letter-spacing: var(--nano-letter-spacing-loose) !important;\n  margin-block: 0 !important;\n}\n:host .bottom-end {\n  display: flex;\n  justify-content: flex-end;\n}\n:host .bottom-end ::slotted(*), .bottom-end :host::slotted(*) {\n  --input-font-size: var(--nano-font-size-2xs) !important;\n  max-inline-size: 9rem !important;\n}\n@container footer-container (max-width: 912px) {\n  :host .top,\n  :host .middle,\n  :host .bottom {\n    grid-template-columns: 1fr;\n  }\n  :host .middle-center {\n    flex-wrap: wrap;\n  }\n  :host .middle-end {\n    grid-template-columns: minmax(0, 6.6rem);\n  }\n  :host .bottom {\n    display: flex;\n    flex-direction: column-reverse;\n    align-items: center;\n  }\n  :host .middle-start,\n  :host .middle-center,\n  :host .middle-end {\n    justify-content: center;\n  }\n}";export{t as nano_footer}
+import{r as n,a as e,h as a,l as o}from"./index-DXvE-U_j.js";import{a as t}from"./style-xLaX004n.js";const d=class{constructor(e){n(this,e)}get host(){return e(this)}componentWillLoad(){t(this.host.shadowRoot)}render(){return a("footer",{key:"7df3395d83480c2efaffd3a745dcb8486492ec8d",class:"footer"},a("div",{key:"2277f9b209312a0be9c503590f9871c3da7ab7c5",class:"upper"},a("div",{key:"43ca2ad3f23948f23d787c3179f6012021fe0786",class:"top"},a("div",{key:"05ee9cb69076053c9accbae4d188232d344e7bf0",class:"top-start"},a("slot",{key:"a34bf50a87e10191e65d0be67f88c16abcf48304",name:"top-start_heading"}),a("slot",{key:"db386e86277ae22fa9b5e7723c78ec48b4ff5444",name:"top-start_content"})),a("div",{key:"061fd17bfdb8ad8af11dce8cd3abac07d7c58290",class:"top-center"},a("slot",{key:"885c3acef88311528147a249ca29003ec64b10c0",name:"top-center_heading"}),a("slot",{key:"8d4f513adfd5f24880ca76a214d2d2051d3b9ad7",name:"top-center_content"})),a("div",{key:"f6138faa2e07af7e9e46a20e1510708f58ddba27",class:"top-end"},a("slot",{key:"aa7570bfa51e27ec2745b2563db6736c1b7def19",name:"top-end_heading"}),a("slot",{key:"9dd64f4ad61d9a0d5dd1b305e9089c5190e89738",name:"top-end_content"})))),a("div",{key:"bbf554d8a85ee66cf0a38f82a8de608615510722",class:"lower nano-theme-dark"},a("div",{key:"4a46e9541cc2fa7b45cfa3fd3a8628e5aed47eae",class:"middle"},a("div",{key:"ef13e5c2a35f64533bba7522fa34c964c4ee8acc",class:"middle-start"},a("img",{key:"2bf403ca600f0588be99898b4e0a42ee5f64f736",src:o("../nano-assets/ont-logo-light.svg"),alt:"Oxford Nanopore Technologies logo. Featuring a stylised representation of a nanopore,\n          (a tiny protein channel embedded in a membrane) through which DNA or RNA molecules are passed in for sequencing.",height:"46"})),a("div",{key:"c3796b77148a0ba37fba2a7d1f3583233294de22",class:"middle-center"},a("a",{key:"abd8ff0fcbb1b3e7365090310c67ae0c29a8073f",href:"https://x.com/nanopore",target:"_blank"},a("nano-icon",{key:"78ec0f32afa4da8f87fce46f36c2958a61cadaef",name:"brands/x-twitter",size:"large",ariaLabel:"X (formerly Twitter)"})),a("a",{key:"28315142cc17313a65d9039601b26bbe2400d715",href:"https://bsky.app/profile/nanoporetech.com",target:"_blank"},a("nano-icon",{key:"155bedeeea937afe7740c867f9780ad26dd6eadf",name:"brands/bluesky",size:"large",ariaLabel:"Bluesky"})),a("a",{key:"4047f00cd32d045bd46660aaa9eb17536a5555f4",href:"https://www.youtube.com/channel/UC5yMlYjHSgFfZ37LYq-dzig",target:"_blank"},a("nano-icon",{key:"63e9bb9f849a10b70b1a5cd32c1f9545587f8902",name:"brands/youtube",size:"large",ariaLabel:"YouTube"})),a("a",{key:"fd2f4d639c13c99523a9f026457414aa805171bc",href:"https://www.facebook.com/Oxford-Nanopore-Technologies-251034380246/",target:"_blank"},a("nano-icon",{key:"71a31a51945079e3419ce150a7908db2125a6523",name:"brands/facebook",size:"large",ariaLabel:"Facebook"})),a("a",{key:"426b6c582345b1e32bbd0e6ca206a75cd56ed434",href:"https://www.linkedin.com/company/oxford-nanopore-technologies",target:"_blank"},a("nano-icon",{key:"ec8256f6a70d0bb68beacab2a8c8adc381d26661",name:"brands/linkedin",size:"large",ariaLabel:"LinkedIn"})),a("a",{key:"ddf5456cb764238fb5d932b2b44cf5466e82ad2f",href:"https://www.instagram.com/oxfordnanopore",target:"_blank"},a("nano-icon",{key:"293464c660b8734f0bae8eb612c8377e763b8053",name:"brands/instagram",size:"large",ariaLabel:"Instagram"}))),a("div",{key:"6b7ed0e2ad110329ce9c5e4e085278d4e7dd4568",class:"middle-end"},a("slot",{key:"15c3d94e8f35ee98fafdc6f062d9639b0ac54b63",name:"middle-end"}))),a("div",{key:"a72b24bd18b825b160608a1b20e221b37c070bc4",class:"bottom"},a("div",{key:"a63f935bacfc660dc1c45e0dcb43514272837fdd",class:"bottom-start"},a("slot",{key:"1fb95aa9e6da5ae676470cf532c47ecbe5ae0015",name:"bottom-start"},a("p",{key:"d78582a9baa27c818155577a7a49ccbc6b0fe141"},"© 2008 - 2025 Oxford Nanopore Technologies plc. All rights reserved. Registered Office: Gosling Building, Edmund Halley Road, Oxford Science Park, OX4 4DQ, UK | Registered No. 05386273 | VAT No 336942382. Oxford Nanopore Technologies, the Wheel icon, EPI2ME, Flongle, GridION, Metrichor, MinION, MinIT, MinKNOW, Plongle, PromethION, SmidgION, Ubik and VolTRAX are registered trademarks of Oxford Nanopore Technologies plc in various countries. Oxford Nanopore Technologies products are not intended for use for health assessment or to diagnose, treat, mitigate, cure, or prevent any disease or condition."))),a("div",{key:"08a48aaf322de5c4292e24803e8ca6da40e1e3c5",class:"bottom-end"},a("slot",{key:"81873c5375cc33b1f1b533354b960a66eadaf94b",name:"bottom-end"})))))}};d.style=":host,\n*,\n*::before,\n*::after {\n  box-sizing: border-box;\n}\n[hidden] {\n  display: none !important;\n}\n@media (prefers-reduced-motion: reduce) {\n    :host,\n    *,\n    *::before,\n    *::after {\n      animation-duration: 0.01ms !important;\n      animation-iteration-count: 1 !important;\n      transition-duration: 0.01ms !important;\n      scroll-behavior: auto !important;\n    }\n  }:host,\n*,\n*::before,\n*::after {\n  box-sizing: border-box;\n}\n[hidden] {\n  display: none !important;\n}\n@media (prefers-reduced-motion: reduce) {\n    :host,\n    *,\n    *::before,\n    *::after {\n      animation-duration: 0.01ms !important;\n      animation-iteration-count: 1 !important;\n      transition-duration: 0.01ms !important;\n      scroll-behavior: auto !important;\n    }\n  }:host {\n  --col-gap: var(--nano-spacing-l1-default);\n  --icon-gap-md: var(--nano-spacing-md);\n  --icon-gap-sm: var(--nano-spacing-sm);\n  --vertical-padding: var(--nano-spacing-l1-default);\n  --horizontal-padding: 0;\n  --header-margin: 0 0 var(--nano-spacing-l1-default) 0;\n  display: block;\n}\n:host .footer {\n  container-type: inline-size;\n  container-name: footer-container;\n  display: flex;\n  flex-direction: column;\n}\n@container footer-container (max-width: 768px) {\n  :host .top,\n  :host .middle,\n  :host .bottom {\n    --horizontal-padding: var(--nano-spacing-md);\n    --col-gap: var(--nano-spacing-l);\n    --vertical-padding: var(--nano-spacing-md);\n  }\n  :host .top-start,\n  :host .top-center,\n  :host .top-end {\n    --header-margin: 0 0 var(--nano-spacing-md) 0;\n  }\n}\n@container footer-container (max-width: 1023px) {\n  :host .top,\n  :host .middle,\n  :host .bottom {\n    --horizontal-padding: var(--nano-spacing-l);\n  }\n}\n@container footer-container (max-width: 1346px) {\n  :host .top,\n  :host .middle,\n  :host .bottom {\n    --horizontal-padding: var(--nano-spacing-l1-default);\n  }\n}\n:host .upper {\n  border-block-start: 1px solid var(--nano-color-neutral-200);\n}\n:host .lower {\n  background-color: var(--nano-color-basic-black);\n  color: var(--nano-color-basic-white);\n}\n:host .top,\n:host .middle,\n:host .bottom {\n  display: grid;\n  gap: var(--col-gap);\n  margin: 0 auto;\n  max-inline-size: 1266px;\n}\n:host .top,\n:host .middle {\n  grid-template-columns: repeat(3, 1fr);\n  padding: var(--vertical-padding) var(--horizontal-padding);\n}\n:host .bottom {\n  grid-template-columns: repeat(2, 1fr);\n  padding-inline: var(--horizontal-padding);\n  padding-block-end: var(--vertical-padding);\n}\n:host .middle-center a {\n  color: inherit;\n}\n:host .middle-center a:hover {\n  color: var(--nano-color-primary-1000);\n}\n:host .middle-center a:focus-visible {\n  outline: var(--nano-focus-ring);\n  outline-offset: var(--nano-focus-ring-offset);\n}\n:host .top-start,\n:host .top-center,\n:host .top-end {\n  flex-direction: column;\n}\n:host .middle-start,\n:host .middle-center,\n:host .middle-end {\n  align-items: center;\n}\n:host .middle-start {\n  display: flex;\n  justify-content: flex-start;\n}\n:host .middle-center {\n  display: flex;\n  justify-content: center;\n  gap: var(--icon-gap-md);\n  flex-wrap: nowrap;\n}\n:host .middle-end {\n  display: grid;\n  grid-template-columns: repeat(3, minmax(0, 20rem));\n  gap: var(--icon-gap-sm);\n  justify-content: end;\n}\n:host [slot=middle-end] {\n  inline-size: 100%;\n}\n:host .bottom-start p,\n:host .bottom-start ::slotted(p), .bottom-start :host::slotted(p) {\n  font-weight: var(--nano-font-weight-normal) !important;\n  font-size: var(--nano-font-size-xs) !important;\n  line-height: var(--nano-line-height-normal) !important;\n  letter-spacing: var(--nano-letter-spacing-loose) !important;\n  margin-block: 0 !important;\n}\n:host .bottom-end {\n  display: flex;\n  justify-content: flex-end;\n}\n:host .bottom-end ::slotted(*), .bottom-end :host::slotted(*) {\n  --input-font-size: var(--nano-font-size-2xs) !important;\n  max-inline-size: 9rem !important;\n}\n@container footer-container (max-width: 912px) {\n  :host .top,\n  :host .middle,\n  :host .bottom {\n    grid-template-columns: 1fr;\n  }\n  :host .middle-center {\n    flex-wrap: wrap;\n  }\n  :host .middle-end {\n    grid-template-columns: minmax(0, 6.6rem);\n  }\n  :host .bottom {\n    display: flex;\n    flex-direction: column-reverse;\n    align-items: center;\n  }\n  :host .middle-start,\n  :host .middle-center,\n  :host .middle-end {\n    justify-content: center;\n  }\n}";export{d as nano_footer}