@nanoporetech-digital/components 3.1.1 → 3.2.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +17 -0
- package/dist/cjs/index-41582c2a.js +4 -4
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/cjs/nano-components.cjs.js +1 -1
- package/dist/cjs/nano-global-nav.cjs.entry.js +16 -13
- package/dist/cjs/nano-global-nav.cjs.entry.js.map +1 -1
- package/dist/cjs/nano-input.cjs.entry.js.map +1 -1
- package/dist/cjs/nano-progress-bar.cjs.entry.js +1 -1
- package/dist/cjs/nano-progress-bar.cjs.entry.js.map +1 -1
- package/dist/cjs/nano-resize-observe_2.cjs.entry.js +1 -1
- package/dist/cjs/nano-resize-observe_2.cjs.entry.js.map +1 -1
- package/dist/cjs/{nano-table-844394ad.js → nano-table-7dbe799c.js} +8 -7
- package/dist/cjs/nano-table-7dbe799c.js.map +1 -0
- package/dist/cjs/nano-table.cjs.entry.js +1 -1
- package/dist/cjs/{table.worker-1bc19978.js → table.worker-fe960deb.js} +2 -2
- package/dist/cjs/table.worker-fe960deb.js.map +1 -0
- package/dist/collection/components/global-nav/global-nav.js +15 -12
- package/dist/collection/components/global-nav/global-nav.js.map +1 -1
- package/dist/collection/components/global-nav/search-widget.js +4 -0
- package/dist/collection/components/global-nav/search-widget.js.map +1 -0
- package/dist/collection/components/global-nav/style/global-nav.css +9 -4
- package/dist/collection/components/input/input.js +2 -2
- package/dist/collection/components/input/input.js.map +1 -1
- package/dist/collection/components/progress-bar/progress-bar.js +1 -1
- package/dist/collection/components/progress-bar/progress-bar.js.map +1 -1
- package/dist/collection/components/resize-observe/resize-observe.js +1 -1
- package/dist/collection/components/resize-observe/resize-observe.js.map +1 -1
- package/dist/collection/components/table/table.css +32 -28
- package/dist/collection/components/table/table.js +5 -4
- package/dist/collection/components/table/table.js.map +1 -1
- package/dist/components/input.js.map +1 -1
- package/dist/components/nano-global-nav.js +16 -13
- package/dist/components/nano-global-nav.js.map +1 -1
- package/dist/components/nano-table.js +16 -9
- package/dist/components/nano-table.js.map +1 -1
- package/dist/components/progress-bar.js +1 -1
- package/dist/components/progress-bar.js.map +1 -1
- package/dist/components/resize-observe.js +1 -1
- package/dist/components/resize-observe.js.map +1 -1
- package/dist/custom-elements/index.js +24 -20
- package/dist/custom-elements/index.js.map +1 -1
- package/dist/esm/index-3c280603.js +4 -4
- package/dist/esm/loader.js +1 -1
- package/dist/esm/nano-components.js +1 -1
- package/dist/esm/nano-global-nav.entry.js +16 -13
- package/dist/esm/nano-global-nav.entry.js.map +1 -1
- package/dist/esm/nano-input.entry.js.map +1 -1
- package/dist/esm/nano-progress-bar.entry.js +1 -1
- package/dist/esm/nano-progress-bar.entry.js.map +1 -1
- package/dist/esm/nano-resize-observe_2.entry.js +1 -1
- package/dist/esm/nano-resize-observe_2.entry.js.map +1 -1
- package/dist/esm/{nano-table-19d19d72.js → nano-table-93d25a68.js} +8 -7
- package/dist/esm/nano-table-93d25a68.js.map +1 -0
- package/dist/esm/nano-table.entry.js +1 -1
- package/dist/esm/{table.worker-c82cecdf.js → table.worker-5d681b97.js} +2 -2
- package/dist/esm/table.worker-5d681b97.js.map +1 -0
- package/dist/nano-components/nano-components.esm.js +1 -1
- package/dist/nano-components/p-28b43ee9.entry.js.map +1 -1
- package/dist/nano-components/{p-b4a045a2.entry.js → p-39124baa.entry.js} +2 -2
- package/dist/nano-components/{p-7ade1695.js.map → p-39124baa.entry.js.map} +0 -0
- package/dist/nano-components/p-42fa11c3.entry.js +5 -0
- package/dist/nano-components/p-42fa11c3.entry.js.map +1 -0
- package/dist/nano-components/p-4c386a43.js +5 -0
- package/dist/nano-components/p-4c386a43.js.map +1 -0
- package/dist/nano-components/{p-7ade1695.js → p-619a1c8e.js} +2 -2
- package/dist/nano-components/{p-b4a045a2.entry.js.map → p-619a1c8e.js.map} +0 -0
- package/dist/nano-components/p-653a25f8.entry.js +5 -0
- package/dist/nano-components/p-653a25f8.entry.js.map +1 -0
- package/dist/nano-components/{p-f95a263c.entry.js → p-66099557.entry.js} +2 -2
- package/dist/nano-components/p-66099557.entry.js.map +1 -0
- package/dist/types/components/global-nav/search-widget.d.ts +0 -0
- package/dist/types/components/input/input.d.ts +2 -2
- package/docs-json.json +9 -3
- package/docs-vscode.json +1 -1
- package/package.json +2 -2
- package/dist/cjs/nano-table-844394ad.js.map +0 -1
- package/dist/cjs/table.worker-1bc19978.js.map +0 -1
- package/dist/esm/nano-table-19d19d72.js.map +0 -1
- package/dist/esm/table.worker-c82cecdf.js.map +0 -1
- package/dist/nano-components/p-1ae8c03e.entry.js +0 -5
- package/dist/nano-components/p-1ae8c03e.entry.js.map +0 -1
- package/dist/nano-components/p-b7901427.entry.js +0 -5
- package/dist/nano-components/p-b7901427.entry.js.map +0 -1
- package/dist/nano-components/p-b83a8320.js +0 -5
- package/dist/nano-components/p-b83a8320.js.map +0 -1
- package/dist/nano-components/p-f95a263c.entry.js.map +0 -1
@@ -0,0 +1,5 @@
|
|
1
|
+
/*!
|
2
|
+
* Web Components for Nanopore digital Web Apps
|
3
|
+
*/
|
4
|
+
import{r as t,c as e,d as i,h as s,a as n,g as o}from"./p-1fe12320.js";import{d as r}from"./p-9746b0a5.js";const a=class{constructor(i){t(this,i);this.nanoResizeStateChange=e(this,"nanoResizeStateChange",7);this.assessChanges=()=>{if(!this.currentWidth&&!this.currentHeight)return;const t={h:new Map,w:new Map};let e=false;Object.keys(this.appliedStates).forEach((i=>{let s;if(i==="h")s=this.currentHeight;else s=this.currentWidth;this.appliedStates[i].forEach(((n,o)=>{if(s>=o&&n.applied===false){n.applied=true;t[i].set(o,n);e=true}else if(s<o&&n.applied===true){n.applied=false;t[i].set(o,n);e=true}}))}));if(e)this.applyChanges(t);else if(!this.classNames.includes("is-ready"))this.classNames=["is-ready"]};this.currentWidth=undefined;this.currentHeight=undefined;this.classNames=[];this.states=undefined}dimensionChanged(){this.assessChanges()}statesChanged(){if(!this.states)return;if(!this.ro)this.attachRO();const t=t=>{const e=t.split(/(\d+)/).filter((t=>t.length));return{bp:parseInt(e[0]),dir:e[1]}};this.appliedStates={h:new Map,w:new Map};this.states.split(",").map((e=>{e=e.trim();if(e.includes(" ")){const[i,...s]=e.split(" ");const{bp:n,dir:o}=t(i);this.appliedStates[o].set(n,{states:s,applied:false})}else{const{bp:i,dir:s}=t(e);this.appliedStates[s].set(i,{applied:false})}}))}applyChanges(t){let e=[...this.classNames];Object.keys(t).forEach((i=>{t[i].forEach((t=>{if(!t.states)return;t.states.map((i=>{if(t.applied)e.push(i);else e=e.filter((t=>t!==i))}))}))}));this.classNames=["is-ready",...e];this.nanoResizeStateChange.emit(this.toSimpleObj(t))}toSimpleObj(t){const e={};Object.keys(t).forEach((i=>{t[i].forEach(((t,s)=>{e[s+i]=t.applied}))}));return e}attachRO(){this.ro=new ResizeObserver((t=>{for(const e of t){this.currentWidth=e.contentRect.width;this.currentHeight=e.contentRect.height}}));this.ro.observe(this.host)}connectedCallback(){this.assessChanges=r(this.assessChanges,50)}componentDidLoad(){if(!this.states)return;if(!this.currentWidth||!this.currentHeight){i((()=>{const{width:t,height:e}=this.host.getBoundingClientRect();this.currentWidth=t;this.currentHeight=e}))}this.statesChanged()}disconnectedCallback(){if(this.ro)this.ro.disconnect()}render(){return s(n,{class:{[this.classNames.join(" ")]:true}},s("slot",null))}get host(){return o(this)}static get watchers(){return{currentHeight:["dimensionChanged"],currentWidth:["dimensionChanged"],states:["statesChanged"]}}};a.style=":host { display: block }";const h=":host{box-sizing:border-box}*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}:host{--base-color-rgb:var(--nano-skeleton-rgb, 228, 230, 232);--color:var(--nano-skeleton-color, rgba(var(--base-color-rgb), 1));--tint:var(--nano-skeleton-tint, rgba(var(--base-color-rgb), 0.5));display:block;position:relative;border-radius:0.25rem;min-block-size:1em;line-height:inherit}.skeleton{display:-webkit-box;display:-ms-flexbox;display:flex;min-inline-size:100%;min-block-size:100%;border-radius:inherit;line-height:inherit}.skeleton__indicator{-webkit-box-flex:1;-ms-flex:1 1 auto;flex:1 1 auto;background:var(--color);border-radius:inherit;line-height:inherit}.skeleton.animate .skeleton__indicator{background:-webkit-gradient(linear, right top, left top, from(var(--tint)), color-stop(var(--color)), color-stop(var(--color)), to(var(--tint)));background:linear-gradient(270deg, var(--tint), var(--color), var(--color), var(--tint));background-size:400% 100%;-webkit-animation:loader 6s ease-in-out infinite;animation:loader 6s ease-in-out infinite}@-webkit-keyframes loader{0%{background-position:200% 0}to{background-position:-200% 0}}@keyframes loader{0%{background-position:200% 0}to{background-position:-200% 0}}";const l=class{constructor(e){t(this,e);this.animated=true}render(){return s("div",{class:{skeleton:true,animate:this.animated}},s("div",{class:"skeleton__indicator"}," "))}};l.style=h;export{a as nano_resize_observe,l as nano_skeleton};
|
5
|
+
//# sourceMappingURL=p-42fa11c3.entry.js.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"sources":["src/components/resize-observe/resize-observe.tsx","src/components/skeleton/skeleton.scss?tag=nano-skeleton&encapsulation=shadow","src/components/skeleton/skeleton.tsx"],"names":["ResizeObserve","this","assessChanges","currentWidth","currentHeight","changedStates","h","Map","w","hasChanged","Object","keys","appliedStates","forEach","dimType","dim","state","bp","applied","set","applyChanges","classNames","includes","[object Object]","states","ro","attachRO","toBpDir","bpDir","bpDirSpl","split","filter","bs","length","parseInt","dir","map","st","trim","key","classes","changes","push","cl","nanoResizeStateChange","emit","toSimpleObj","stateMaps","retObj","ResizeObserver","entries","entry","contentRect","width","height","observe","host","debounce","readTask","getBoundingClientRect","statesChanged","disconnect","Host","class","join","skeletonCss","Skeleton","skeleton","animate","animated"],"mappings":"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","sourcesContent":["import {\n Component,\n h,\n Prop,\n Element,\n Host,\n State,\n Watch,\n ComponentInterface,\n Event,\n EventEmitter,\n readTask,\n} from '@stencil/core';\nimport { debounce } from '../../utils/throttle';\nimport type { ResizeStateChangeEventDetail } from '../../interface';\n\ntype ResizeObserverState = { states?: string[]; applied?: boolean };\ninterface StateMaps {\n h: Map<number, ResizeObserverState>;\n w: Map<number, ResizeObserverState>;\n}\n\n/**\n * A Resize-Observer utility component.\n * Takes a string list of sizes and optional class-names. Adds class-names and fires `nanoResizeStateChange` events when the component reaches those sizes.\n * @slot - Main slot for any content.\n */\n@Component({\n tag: 'nano-resize-observe',\n shadow: true,\n styles: `:host { display: block }`,\n})\nexport class ResizeObserve implements ComponentInterface {\n private ro: ResizeObserver;\n private appliedStates: StateMaps;\n\n @Element() host: HTMLNanoResizeObserveElement;\n @State() currentWidth: number;\n @State() currentHeight: number;\n @State() classNames: string[] = [];\n\n /** string list of sizes and optional class-names. Adds class-names and fires nanoResizeStateChange events. Upon hitting breakpoints.\n * Format: `states=\"800w, 300h class1 class2\"` */\n @Prop() states: string;\n\n /** A resize break point is switched on or off */\n @Event() nanoResizeStateChange!: EventEmitter<ResizeStateChangeEventDetail>;\n\n @Watch('currentHeight')\n @Watch('currentWidth')\n dimensionChanged() {\n this.assessChanges();\n }\n\n @Watch('states')\n statesChanged() {\n if (!this.states) return;\n if (!this.ro) this.attachRO();\n\n const toBpDir = (bpDir: string) => {\n const bpDirSpl = bpDir.split(/(\\d+)/).filter((bs) => bs.length);\n return { bp: parseInt(bpDirSpl[0]), dir: bpDirSpl[1] };\n };\n this.appliedStates = { h: new Map(), w: new Map() };\n\n // parse state string\n this.states.split(',').map((st) => {\n st = st.trim();\n if (st.includes(' ')) {\n const [key, ...classes] = st.split(' ');\n const { bp, dir } = toBpDir(key);\n this.appliedStates[dir as keyof StateMaps].set(bp, {\n states: classes,\n applied: false,\n });\n } else {\n const { bp, dir } = toBpDir(st);\n this.appliedStates[dir as keyof StateMaps].set(bp, { applied: false });\n }\n });\n }\n\n private assessChanges = () => {\n if (!this.currentWidth && !this.currentHeight) return;\n const changedStates: StateMaps = { h: new Map(), w: new Map() };\n let hasChanged = false;\n\n Object.keys(this.appliedStates).forEach((dimType) => {\n let dim: number;\n if (dimType === 'h') dim = this.currentHeight;\n else dim = this.currentWidth;\n\n this.appliedStates[dimType].forEach(\n (state: ResizeObserverState, bp: number) => {\n if (dim >= bp && state.applied === false) {\n state.applied = true;\n changedStates[dimType].set(bp, state);\n hasChanged = true;\n } else if (dim < bp && state.applied === true) {\n state.applied = false;\n changedStates[dimType].set(bp, state);\n hasChanged = true;\n }\n }\n );\n });\n if (hasChanged) this.applyChanges(changedStates);\n else if (!this.classNames.includes('is-ready'))\n this.classNames = ['is-ready'];\n };\n\n private applyChanges(changes: StateMaps) {\n let classNames = [...this.classNames];\n Object.keys(changes).forEach((dimType: keyof StateMaps) => {\n changes[dimType].forEach((state) => {\n if (!state.states) return;\n state.states.map((st) => {\n if (state.applied) classNames.push(st);\n else classNames = classNames.filter((cl) => cl !== st);\n });\n });\n });\n this.classNames = ['is-ready', ...classNames];\n this.nanoResizeStateChange.emit(this.toSimpleObj(changes));\n }\n\n private toSimpleObj(stateMaps: StateMaps) {\n const retObj = {};\n Object.keys(stateMaps).forEach((dimType: keyof StateMaps) => {\n stateMaps[dimType].forEach((state: ResizeObserverState, bp: number) => {\n retObj[bp + dimType] = state.applied;\n });\n });\n return retObj;\n }\n\n private attachRO() {\n this.ro = new ResizeObserver((entries) => {\n for (const entry of entries) {\n this.currentWidth = entry.contentRect.width;\n this.currentHeight = entry.contentRect.height;\n }\n });\n this.ro.observe(this.host);\n }\n\n connectedCallback() {\n this.assessChanges = debounce(this.assessChanges, 50);\n }\n\n componentDidLoad() {\n if (!this.states) return;\n if (!this.currentWidth || !this.currentHeight) {\n readTask(() => {\n const { width, height } = this.host.getBoundingClientRect();\n this.currentWidth = width;\n this.currentHeight = height;\n });\n }\n this.statesChanged();\n }\n\n disconnectedCallback() {\n if (this.ro) this.ro.disconnect();\n }\n\n render() {\n return (\n <Host\n class={{\n [this.classNames.join(' ')]: true,\n }}\n >\n <slot />\n </Host>\n );\n }\n}\n","@import '../../global/style/nano-theme/components';\n\n:host {\n /**\n * @prop --base-color-rgb: default #{$skeleton-color-rgb};\n * @prop --color: default var(--nano-skeleton-color, rgba(var(--base-color-rgb), 1));\n * @prop --tint: default var(--nano-skeleton-tint, rgba(var(--base-color-rgb), .3));\n */\n\n --base-color-rgb: #{$skeleton-color-rgb};\n --color: var(--nano-skeleton-color, rgba(var(--base-color-rgb), 1));\n --tint: var(--nano-skeleton-tint, rgba(var(--base-color-rgb), 0.5));\n\n display: block;\n position: relative;\n border-radius: 0.25rem;\n min-block-size: 1em;\n line-height: inherit;\n}\n\n.skeleton {\n display: flex;\n min-inline-size: 100%;\n min-block-size: 100%;\n border-radius: inherit;\n line-height: inherit;\n}\n\n.skeleton__indicator {\n flex: 1 1 auto;\n background: var(--color);\n border-radius: inherit;\n line-height: inherit;\n}\n\n.skeleton.animate .skeleton__indicator {\n background:\n linear-gradient(\n 270deg,\n var(--tint),\n var(--color),\n var(--color),\n var(--tint)\n );\n background-size: 400% 100%;\n animation: loader 6s ease-in-out infinite;\n}\n\n@keyframes loader {\n 0% {\n background-position: 200% 0;\n }\n\n to {\n background-position: -200% 0;\n }\n}\n","import { Component, Prop, h, ComponentInterface } from '@stencil/core';\n\n/**\n * Skeletons are used to show where content will eventually be drawn.\n * Simple containers for scaffolding layouts that mimic what users will see when content has finished loading.\n * Prevents large areas of empty space during asynchronous operations.\n */\n@Component({\n tag: 'nano-skeleton',\n styleUrl: 'skeleton.scss',\n shadow: true,\n})\nexport class Skeleton implements ComponentInterface {\n /** When `true`, the skeleton will animate. */\n @Prop() animated = true;\n\n render() {\n return (\n <div\n class={{\n skeleton: true,\n animate: this.animated,\n }}\n >\n <div class=\"skeleton__indicator\"> </div>\n </div>\n );\n }\n}\n"]}
|
@@ -0,0 +1,5 @@
|
|
1
|
+
/*!
|
2
|
+
* Web Components for Nanopore digital Web Apps
|
3
|
+
*/
|
4
|
+
import{j as t,h as n,F as e,g as i,e as o,r as s,c as r,d as a,a as l}from"./p-1fe12320.js";import{a as c}from"./p-ee045579.js";import{d}from"./p-9746b0a5.js";import{c as h}from"./p-651b3264.js";const b="nano-tbl";const p=(t,n)=>{const e=globalThis[n];return e!=null&&t instanceof e};const f=t=>{if(t!=null){if(p(t,"ArrayBuffer")||p(t,"MessagePort")||p(t,"ImageBitmap")||p(t,"OffscreenCanvas")){return[t]}if(typeof t==="object"){if(t.constructor===Object){t=Object.values(t)}if(Array.isArray(t)){return t.flatMap(f)}return f(t.buffer)}}return[]};let u=0;let _=0;const m=new Map;const w=new Map;const g=(n,e,i)=>{const o=new Worker(n,{name:e});o.addEventListener("message",(({data:n})=>{if(n){const e=n[0];const o=n[1];const s=n[2];if(e===i){const e=n[3];const[i,r,a]=m.get(o);m.delete(o);if(e){const n=e.isError?Object.assign(new Error(e.value.message),e.value):e.value;t(n);r(n)}else{if(a){a.forEach((t=>w.delete(t)))}i(s)}}else if(e===i+".cb"){try{w.get(o)(...s)}catch(n){t(n)}}}}));return o};const x=(t,n,e)=>(...i)=>new Promise(((o,s)=>{let r=u++;let a=0;let l=i.length;let c=[o,s];m.set(r,c);for(;a<l;a++){if(typeof i[a]==="function"){const t=_++;w.set(t,i[a]);i[a]=[n+".cb",t];(c[2]=c[2]||[]).push(t)}}const d=t=>t.postMessage([n,r,e,i],f(i));if(t.then){t.then(d)}else{d(t)}}));const y=import("./p-619a1c8e.js").then((t=>t.worker));const k=x(y,"stencil.table.worker","createWorkerStore");const v=x(y,"stencil.table.worker","syncConfigToWorker");const $=x(y,"stencil.table.worker","syncDataToWorker");const C=x(y,"stencil.table.worker","workerFilter");const z=x(y,"stencil.table.worker","workerSearch");const S=x(y,"stencil.table.worker","workerSort");function I(t){const n=JSON.parse(JSON.stringify(t));t.forEach((t=>{if(!!t.sortCompareFn){const e=n.find((n=>n.prop===t.prop));e.sortCompareFn=t.sortCompareFn.toString()}}));return n}const R=new WeakMap;async function T(t,n,e){const i={data:h({rows:[]}),config:h({columns:n}),general:h({workerId:null,scrollParent:e,host:t})};const o=await k(i.data.state.rows,I(i.config.state.columns));i.general.state.workerId=o;R.set(t,i);i.data.use({reset:()=>{if(i.general.state.workerId)$(i.general.state.workerId,null)},dispose:()=>{if(i.general.state.workerId)$(i.general.state.workerId,null)}});i.config.use({reset:()=>{if(i.general.state.workerId)v(i.general.state.workerId,null)},dispose:()=>{if(i.general.state.workerId)v(i.general.state.workerId,null)}});return i}function j(t){return R.get(t)}function O(t,n){const e=R.get(t);if(!e)return;n=n.map(((t,n)=>({...t,__index:n,__uuid:c(Object.values(t).join())})));e.data.state.rows=n;if(e.general.state.workerId)return $(e.general.state.workerId,n)}function M(t,n){const e=R.get(t);if(!e)return;if(e.general.state.workerId)v(e.general.state.workerId,I(n));e.config.state.columns=n}async function F(t,n){const e=R.get(t);if(!e||!e.general.state.workerId)return;try{e.data.state.rows=await z(e.general.state.workerId,n)}catch(t){console.log(t)}}async function A(t,n){const e=R.get(t);if(!e||!e.general.state.workerId)return;try{e.data.state.rows=await C(e.general.state.workerId,n)}catch(t){console.log(t)}}async function B(t,n,e){const i=R.get(t);if(!i||!i.general.state.workerId)return;try{i.data.state.rows=await S(i.general.state.workerId,n,e)}catch(t){console.log(t)}}function P(t,n){const e=N();const i=e.config.state.columns;const o=e.data.state.rows;const s=i[n];const r=s?.prop;const a=o[t];const l=a[i[n].prop];return{prop:r,cellModel:l,column:s,rowIndex:t,rowModel:a}}function W(t){const n=N();const e=n.data.state.rows;const i=e[t];return{row:i,rowIndex:t}}function q(t,n){if(!n)return t;const e={...n,...t};if(n.class){if(typeof n.class==="object"&&typeof e.class==="object"){e.class={...n.class,...e.class}}else if(typeof n.class==="string"&&typeof e.class==="object"){e.class[n.class]=true}else if(typeof e.class==="string"){e.class+=" "+n.class}}if(n.style){e.style={...n.style,...e.style}}return e}function N(){return j(i(o()))}function D(t,n,e){const i={...e};const o=N().config.state.columns[n]?.cellProperties;if(!o)return i;const s=P(t,n);const r=o(s);if(!r)return i;return q(i,r)}function J(t,i){const o=N();const s=o.config.state.columns;const r=s[i]?.cellTemplate;const a=P(t,i);return r?r(n,a):n(e,null,a.cellModel)}function L(t){const i=t?.colTemplate;return i?i(n,t):n(e,null,t.title)}function E(t,n,e=false){const i={[`${b}__${t}`]:true,[`${b}__pin`]:!!n,[`${b}__pin--top`]:n==="top",[`${b}__pin--bottom`]:n==="bottom"};if(e){let t="";Object.entries(i).forEach((([n,e])=>{if(e)t+=n+" "}));return t}return i}const H=new WeakMap;const U=new WeakMap;function G(t,n,e){if(H.get(t))return;const i=N();const o=i.general.state.scrollParent;const s=i.general.state.host;const r=new IntersectionObserver((([t])=>{const i={};if(n==="start"){i.start=t.boundingClientRect.x-(s.getBoundingClientRect().x+o.scrollLeft)<0&&!t.isIntersecting}if(n==="end"){i.end=t.boundingClientRect.right>t.boundingClientRect.width&&!t.isIntersecting}e(i)}),{threshold:[1],rootMargin:"1px 0px 1px 0px",root:o===document.scrollingElement?null:o});H.set(t,r);requestAnimationFrame((()=>r.observe(t)))}function K(t,n,e){if(U.get(t))return;const i=N();const o=i.general.state.scrollParent;const s=i.general.state.host;const r=new IntersectionObserver((([t])=>{const i={};if(n==="top"){i.top=t.boundingClientRect.y-(s.getBoundingClientRect().y+o.scrollTop)<0&&!t.isIntersecting}if(n==="bottom")i.bottom=t.boundingClientRect.height>t.intersectionRect.height&&!t.isIntersecting;e(i)}),{threshold:[.99],rootMargin:"0px 100px 0px 100px",root:o===document.scrollingElement?null:o});U.set(t,r);requestAnimationFrame((()=>r.observe(t)))}const Q=({rowRenderer:t,rowIndex:e,row:i},o)=>{let s={};if(!i){const t=W(e);i=t.row}if(t?.rowProperties){s=t.rowProperties({row:i,rowIndex:e})||s}let r;if(t?.pinned&&typeof t.pinned==="function"){r=t.pinned()}const a={class:E("tr",r)};const l=s?q(a,s):a;return n("tr",{...l,key:i.__uuid},o)};const V=({rowRenderer:t,onColumnPinned:e},i,o)=>{let s={};if(t.rowProperties){s=t.rowProperties()||{}}const r=t.pinned||null;const a={class:E("tr",null)};const l=s?q(a,s):a;const c=t?.template;if(c){let t=c(n,{renderedRow:n("tr",{...l},i)});if(Array.isArray(t)){t=o.map(t,(t=>{if(t.vtag==="tr"){t.vattrs=q({class:E("tr",null,true)},t.vattrs);if(!!t.vchildren){t.vchildren=o.map(t.vchildren,(t=>{if(["td","th"].includes(t.vtag.toString())){t.vattrs=q({class:E(t.vtag.toString(),r,true),ref:t=>{K(t,r,e)}},t.vattrs)}return t}))}}return t}))}return t}return n("tr",{...l},i)};const X=({column:t,headRenderer:i,onColumnOrderClick:o,onColumnPinned:s})=>{function r(n){let e;switch(t.order){case"asc":e="desc";break;case"desc":e=null;break;default:e="asc"}o(e,t.prop,n.target.closest("th"))}let a={};if(t.columnProperties){a=t.columnProperties(t)||a}const l={class:{...E("th",i?.pinned),[`${b}__pin--start`]:t.pinned==="start",[`${b}__pin--end`]:t.pinned==="end",[`${b}__ordered`]:!!t.order,[`${b}__filtered`]:!!t.filter}};let c=a?q(l,a):l;const d=L(t);if(!d)return n(e,null);c=Number(c.colspan)>1?{...c,scope:"colgroup"}:{...c,scope:"col"};if(t.sortable!==false){return n("th",{...c,"aria-sort":t.order?t.order==="asc"?"ascending":"descending":"none",ref:n=>{if(["end","start"].includes(t.pinned))G(n,t.pinned,s);if(["top","bottom"].includes(i.pinned))K(n,i.pinned,s)}},n("button",{class:{[`${b}__order-btn`]:true,[`${b}__cell-content`]:true},onClick:r},L(t),!!t.filter&&n("nano-icon",{name:"light/filter"}),!!t.order&&(t.order==="desc"?n("nano-icon",{name:"solid/long-arrow-down"}):n("nano-icon",{name:"solid/long-arrow-up"})),n("div",{class:`${b}__status-icons`},n("nano-icon",{name:"light/chevron-down"}))))}return n("th",{...c,ref:n=>{if(["end","start"].includes(t.pinned))G(n,t.pinned,s);if(["top","bottom"].includes(i.pinned))K(n,i.pinned,s)}},n("div",{class:`${b}__cell-content`},L(t),!!t.filter&&n("nano-icon",{name:"light/bars-filter"})))};const Y=({rowIndex:t,colIndex:i,nestedContent:o})=>{const s=o||J(t,i);if(!s)return n(e,null);const r=N();const a=r.config.state.columns[i];let l="td";let c=D(t,i,{class:{[`${b}__td`]:true,[`${b}__ordered`]:!!a.order,[`${b}__pin`]:!!a.pinned,[`${b}__pin--start`]:a.pinned==="start",[`${b}__pin--end`]:a.pinned==="end"}});if(a.rowHeader){c=Number(c.rowspan)>1?{...c,scope:"rowgroup"}:{...c,scope:"row"};l="th"}return n(l,{...c},n("div",{class:`${b}__cell-content`},s))};const Z=(()=>{let t;let n;let e;let i;const o=60;const s=()=>{t=null;i=0};s();return()=>{n=window.scrollY;if(t!=null)i=n-t;t=n;window.clearTimeout(e);e=window.setTimeout(s,o);return i}})();function tt(t){let n=getComputedStyle(t);const e=n.position==="absolute";const i=/(auto|scroll)/;if(n.position==="fixed")return document.documentElement;for(let o=t;o=o.parentElement;){n=getComputedStyle(o);if(e&&n.position==="static"){continue}if(i.test(n.overflow+n.overflowY+n.overflowX))return o}return document.documentElement}function nt(t,n=100){const e=t.getBoundingClientRect();const i=window.innerHeight||document.documentElement.clientHeight;if(!e.bottom&&!e.top&&!e.left&&!e.right&&!e.height&&!e.width&&!e.x&&!e.y)return false;return!(Math.floor(100-(e.top>=0?0:e.top)/+-e.height*100)<n||Math.floor(100-(e.bottom-i)/e.height*100)<n)}const et=':host{box-sizing:border-box}*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@charset "UTF-8";nano-table{display:block;width:100%;--max-col-width:200px;--color:var(--nano-color-mediumgrey, #68767e);--font-size:0.87rem;--cell-line-height:1.5;--border-color:var(--nano-color-palegrey, #b5aea7);--border-style:1px solid var(--border-color);--border-tint-color:var(--nano-color-blue, #90c6e7);--border-tint-style:2px solid var(--border-tint-color);--cell-bg-rgb:var(--nano-color-white-rgb, 255 255 255);--head-bg-rgb:var(--cell-bg-rgb);--foot-bg-rgb:var(--cell-bg-rgb);--th-row-bg-rgb:var(--cell-bg-rgb);--ordered-bg-rgb:var(--nano-color-offwhite-rgb, 249 249 251);--td-padding:0.5rem 0.625rem 0.4125rem;--th-padding:0.875rem 0.625rem 0.6875rem;--head-th-padding:var(--th-padding);--foot-th-padding:var(--td-padding);--bookend-col-padding:2rem}.nano-tbl{color:var(--color);text-align:start;width:100%;font-size:var(--font-size);border-spacing:0 0;border-collapse:separate;background:rgb(var(--cell-bg-rgb));-webkit-border-end:1px solid transparent;border-inline-end:1px solid transparent}.nano-tbl__wrap{display:table;min-width:100%}.nano-tbl__top-anchor{clip:rect(1px, 1px, 1px, 1px);-webkit-clip-path:inset(50%);clip-path:inset(50%);block-size:1px;inline-size:1px;margin:-1px;overflow:hidden;padding:0;position:absolute}.nano-tbl__ordered{background-color:var(--ordered-bg);-webkit-border-start:var(--border-style);border-inline-start:var(--border-style);-webkit-border-end:var(--border-style);border-inline-end:var(--border-style)}.nano-tbl__order-btn{padding:0;border:none;outline:none;font:inherit;background:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;color:inherit;display:-webkit-box;display:-ms-flexbox;display:flex;gap:10px;-webkit-box-align:center;-ms-flex-align:center;align-items:center;width:100%}.nano-tbl__status-icons{margin-inline:auto 10px;display:-webkit-box;display:-ms-flexbox;display:flex;gap:10px}.nano-tbl__progress-bar{font-size:0.2rem;position:sticky;inset-block-start:0;inset-inline:0;z-index:10;-webkit-transition:scale 0.25s;transition:scale 0.25s;scale:0;width:100%;height:0}.nano-tbl__progress-bar--show{scale:1;height:auto}.nano-tbl__caption--hide{clip:rect(1px, 1px, 1px, 1px);-webkit-clip-path:inset(50%);clip-path:inset(50%);block-size:1px;inline-size:1px;margin:-1px;overflow:hidden;padding:0;position:absolute}.nano-tbl__td,.nano-tbl__th{line-height:var(--cell-line-height);text-align:start;-webkit-border-after:var(--border-style);border-block-end:var(--border-style);max-width:var(--max-col-width);background-color:rgb(var(--cell-bg-rgb))}.md .nano-tbl__td:first-child .nano-tbl__cell-content,.md .nano-tbl__th:first-child .nano-tbl__cell-content{-webkit-padding-start:var(--bookend-col-padding) !important;padding-inline-start:var(--bookend-col-padding) !important}.md .nano-tbl__td:last-child .nano-tbl__cell-content,.md .nano-tbl__th:last-child .nano-tbl__cell-content{-webkit-padding-end:var(--bookend-col-padding) !important;padding-inline-end:var(--bookend-col-padding) !important}thead .nano-tbl__td,thead .nano-tbl__th{font-weight:800;background:rgba(var(--head-bg-rgb), 90%)}thead .nano-tbl__td .nano-tbl__cell-content,thead .nano-tbl__th .nano-tbl__cell-content{padding:var(--head-th-padding)}tfoot .nano-tbl__td,tfoot .nano-tbl__th{font-weight:800;-webkit-border-after:none;border-block-end:none;background:rgba(var(--foot-bg-rgb), 90%)}tfoot .nano-tbl__td .nano-tbl__cell-content,tfoot .nano-tbl__th .nano-tbl__cell-content{padding:var(--foot-th-padding)}.nano-tbl__td.nano-tbl__ordered,.nano-tbl__th.nano-tbl__ordered{background-color:rgba(var(--ordered-bg-rgb), 0.8) !important}.nano-tbl__cell-content{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding:var(--td-padding)}.nano-tbl tbody{will-change:scroll-position;visibility:visible}.nano-tbl tbody.nano-tbl__inactive{visibility:hidden}.nano-tbl th[scope=row]{font-weight:800;margin:0}.sm .nano-tbl th[scope=row]{max-width:65vw !important}.nano-tbl__pin{position:sticky;z-index:1}.nano-tbl__pin--start{inset-inline:-1px auto;-webkit-transition:max-width 0.25s;transition:max-width 0.25s}.nano-tbl__pin--start::after{content:"";position:absolute;inset:0;-webkit-box-shadow:5px 0 4px 0 rgba(0, 0, 0, 0.2);box-shadow:5px 0 4px 0 rgba(0, 0, 0, 0.2);opacity:0;z-index:-1}.nano-tbl__pinned--start .nano-tbl__pin--start{z-index:2;max-width:125px}.sm .nano-tbl__pinned--start .nano-tbl__pin--start{max-width:var(--max-col-width)}.nano-tbl__pinned--start .nano-tbl__pin--start::after{opacity:1}.nano-tbl__pin--end{}.nano-tbl__pin--start+.nano-tbl__pin--end{inset-inline:auto auto}.nano-tbl__pin--start+.nano-tbl__pin--end::after{display:none}.sm .nano-tbl__pin--end{inset-inline:auto -1px !important;max-width:min(50vw, 200px)}.sm .nano-tbl__pin--end::after{display:block !important;content:"";position:absolute;inset:0;-webkit-box-shadow:-5px 0 4px 0 rgba(0, 0, 0, 0.2);box-shadow:-5px 0 4px 0 rgba(0, 0, 0, 0.2);opacity:0;z-index:-1}.sm .nano-tbl__pinned--end .nano-tbl__pin--end{z-index:3}.sm .nano-tbl__pinned--end .nano-tbl__pin--end::after{opacity:1}.nano-tbl__pin--top{inset-block:-1px auto}.nano-tbl__pinned--top .nano-tbl__pin--top{z-index:4}.nano-tbl__pin--bottom{inset-block:auto -1px}.nano-tbl__pinned--bottom .nano-tbl__pin--bottom{z-index:5;-webkit-border-before:var(--border-tint-style);border-block-start:var(--border-tint-style)}.nano-tbl__pinned--top.nano-tbl__pinned--start .nano-tbl__pin--top.nano-tbl__pin--start{z-index:6}.nano-tbl__pinned--top.nano-tbl__pinned--end .nano-tbl__pin--top.nano-tbl__pin--end{z-index:6}.nano-tbl__pinned--bottom.nano-tbl__pinned--start .nano-tbl__pin--bottom.nano-tbl__pin--start{z-index:6}.nano-tbl__pinned--bottom.nano-tbl__pinned--end .nano-tbl__pin--bottom.nano-tbl__pin--end{z-index:6}.nano-tbl thead tr:last-of-type td,.nano-tbl thead tr:last-of-type th,.nano-tbl tfoot tr:last-of-type td,.nano-tbl tfoot tr:last-of-type th{-webkit-border-after:var(--border-tint-style);border-block-end:var(--border-tint-style)}.nano-tbl .unlimited-width{max-width:none}.nano-tbl__spinner{font-size:1.5rem;-webkit-transition:scale 0.25s;transition:scale 0.25s;scale:0;padding:0.5rem;position:absolute;inset-block-end:0;inset-inline-start:calc(50% - 0.75rem);z-index:-1}.nano-tbl__spinner--show{scale:1;position:sticky}.nano-tbl nano-skeleton{line-height:var(--cell-line-height)}';let it=0;const ot=class{constructor(t){s(this,t);this.nanoTblBlockRendered=r(this,"nanoTblBlockRendered",7);this.nanoTblReady=r(this,"nanoTblReady",7);this.nanoTblBeforeSort=r(this,"nanoTblBeforeSort",7);this.nanoTblAfterSort=r(this,"nanoTblAfterSort",7);this.nanoTblBeforeFilter=r(this,"nanoTblBeforeFilter",7);this.nanoTblAfterFilter=r(this,"nanoTblAfterFilter",7);this.nanoTblBeforeSearch=r(this,"nanoTblBeforeSearch",7);this.nanoTblAfterSearch=r(this,"nanoTblAfterSearch",7);this.debounceSetLoading=t=>{this._loading=t};this.renderId="tbl-"+it++;this.filters=[];this.currentFilters="";this.currentSort="";this.blockIos=new WeakMap;this.blockHeights=[];this.unitHeight=0;this.ignoreIO=true;this._isReady=false;this.sortStart=async(t,n,e)=>{if(this.currentSort===t+":"+n)return;this.loading=true;const i=this.nanoTblBeforeSort.emit({column:n,order:t});if(i.defaultPrevented)return;this.currentSort=t+":"+n;this.scrollToTop(e);if(this.customSortFn){try{await this.customSortFn(n,t);this.sortComplete(t,n)}catch(t){console.warn("custom sort failed",t)}return}try{await B(this.host,n,t);this.sortComplete(t,n)}catch(t){console.warn("sort failed",t);this.currentSort=""}finally{this.loading=false}};this.setupBlockIO=(t,n)=>{if(!t||this.blockIos.has(t))return;const e=new IntersectionObserver((([e])=>{if(this.ignoreIO)return;if(e.isIntersecting){a((()=>{if(this.scrollSpeed<100||nt(t,.01)){this.activeBlocks=[n,n+1,Math.max(0,n-1)];this.nanoTblBlockRendered.emit({block:n,totalBlocks:this.blockElements.length});requestAnimationFrame((()=>this.setBlockHeight()))}}))}}),{threshold:[0],root:this.scrollParent===document.scrollingElement?null:this.scrollParent});e.observe(t);this.blockIos.set(t,e)};this.handleColumnPinned=t=>{Object.entries(t).forEach((([t,n])=>{this.tableEle.classList.toggle(`${b}__pinned--${t}`,n)}))};this.type="table";this.caption=undefined;this.showCaption=false;this._loading=true;this.placeholderSize=5;this.rows=undefined;this.columns=[];this.headRender={pinned:"top"};this.rowRender=undefined;this.footRender={pinned:"bottom"};this.showFooter=false;this.perBlock=60;this.searchTerm=undefined;this.customFilterFn=undefined;this.customSortFn=undefined;this.blocks=[];this.activeBlocks=[0,1,2];this.measureHeight=0;this.debounceSetLoading=d(this.debounceSetLoading.bind(this),50)}get loading(){return this._loading}set loading(t){this.debounceSetLoading(t)}handleRowsChange(){if(!this.rows)return;this.loading=true;Promise.resolve(this.rows).then((async t=>{await O(this.host,t);if(!this.isReady){await this.columnInit();this.setInitialBlockDimension()}this.loading=false}))}handleColsChange(){M(this.host,this.columns);if(this.isReady)this.columnInit()}get blocksLength(){return this.blocks.length}handleSearchTermChange(){this.searchStart()}async resetSorting(){const t=this.columns.find((t=>!!t.order));if(!t)return;return this.sortStart(null,t.prop)}async addSort(t,n){const e=this.columns.find((n=>n.prop===t));if(!e)throw"Cannot find column with "+t;return this.sortStart(n,e.prop)}async resetFilters(){this.filters=[];return this.filterStart()}async addFilters(t,n=true){if(!n)this.filters=[];return this.filterStart(t,n)}set measureEle(t){if(!t)return;this.measureHeight=t.getBoundingClientRect().height;this.unitHeight=t.querySelector("tr")?.getBoundingClientRect().height||this.unitHeight}get isReady(){return this._isReady}set isReady(t){if(t===this._isReady)return;this._isReady=t;if(this.isReady)requestAnimationFrame((()=>this.handleReady()))}scrollListener(){const t=Z();this.scrollSpeed=t<0?t*-1:t}handleReady(){const t=window.location.hash;if(t.length>1){const n=document.querySelector(t);if(n){n.scrollIntoView()}}this.nanoTblReady.emit()}sortComplete(t,n){this.columns=this.columns.map((e=>{if(e.prop===n)return{...e,order:t};return{...e,order:null}}));this.nanoTblAfterSort.emit({column:n,order:t})}async searchStart(){this.loading=true;const t=this.nanoTblBeforeSearch.emit({term:this.searchTerm});if(t.defaultPrevented)return;this.scrollToTop();try{await F(this.host,this.searchTerm);this.nanoTblAfterSearch.emit({term:this.searchTerm})}catch(t){console.warn("search failed",t)}finally{this.loading=false}}async filterStart(t,n=true){if(t){if(n){this.filters=[...this.filters.filter((n=>!t.find((t=>t.prop===n.prop)))),...t]}else{this.filters=t}}if(this.currentFilters===JSON.stringify(this.filters))return;this.loading=true;const e=this.nanoTblBeforeFilter.emit({filters:this.filters});if(e.defaultPrevented)return;this.currentFilters=JSON.stringify(this.filters);this.scrollToTop();if(this.customFilterFn){try{await this.customFilterFn(this.filters);this.filterComplete()}catch(t){console.warn("custom filter failed",t);this.currentFilters=""}return}try{await A(this.host,this.filters);this.filterComplete()}catch(t){console.warn("filter failed",t)}finally{this.loading=false}}filterComplete(){this.columns=this.columns.map((t=>{const n=this.filters.find((n=>n.prop===t.prop));if(n)t.filter=n.filter;return t}));this.nanoTblAfterFilter.emit({filters:this.filters})}scrollToTop(t){const n=this.scrollParent.style?.scrollBehavior;const e=this.scrollParent.scrollLeft;this.scrollParent.style.scrollBehavior="auto";if(this.topAnchorEle&&!nt(this.topAnchorEle,.1)){this.host.scrollIntoView()}if(t)t.scrollIntoView({block:"start"});if(e)this.scrollParent.scrollLeft=e;if(n)this.scrollParent.style.scrollBehavior=n}setMeasureElement(){a((()=>{this.measureEle=this.blockElements.find((t=>!t?.classList?.contains(`${b}__inactive`)))}))}setInitialBlockDimension(){if(!this.blockElements.length)return;const t=new Promise((t=>{a((()=>{this.setMeasureElement();if(!this.measureEle&&!this.unitHeight)t();this.blockElements.forEach(((n,e)=>{if(!n||!n.classList?.contains(`${b}__inactive`)){if(e===this.blockElements.length-1)t();return}if(e===this.blockElements.length-1)t()}))}))}));t.then((()=>{requestAnimationFrame((()=>{this.isReady=true}))}))}async columnInit(){this.filters=this.columns.filter((t=>!!t.filter)).map((t=>{const{filter:n,prop:e}=t;return{filter:n,prop:e}}));if(this.searchTerm){await this.searchStart()}if(this.filters.length){await this.filterStart()}const t=this.columns.find((t=>!!t.order));if(!!t){await this.sortStart(t.order,t.prop)}}setBlocks(){this.activeBlocks=[0,1,2];this.ignoreIO=true;let t=1;const n=this.store.data.state.rows.length;let e=[];const i=[];this.blockHeights=[];for(t;t<=n;t++){e.push(this.store.data.state.rows[t-1]);if(t%this.perBlock===0){i.push({rows:e,__uuid:c(e.map((t=>t.__uuid)).join())});e=[]}}if(e.length)i.push({rows:e,__uuid:c(e.map((t=>t.__uuid)).join())});this.blocks=i}getBlockHeight(t){if(this.activeBlocks.includes(t))return undefined;if(this.blockHeights.length){const n=this.blockHeights.find((n=>n.blockIndex===t));if(n)return n.height+"px"}const n=this.blocks[t].rows.length;if(n===this.perBlock&&this.measureHeight){return this.measureHeight+"px"}return this.unitHeight?this.unitHeight*n+"px":undefined}setBlockHeight(){a((()=>{this.activeBlocks.forEach((t=>{const n=this.blockElements[t];if(!n)return;const e=n.getBoundingClientRect().height;const i=this.blockHeights.findIndex((n=>n.blockIndex===t));if(i>0){this.blockHeights[i]={height:e,blockIndex:t}}else this.blockHeights.push({height:e,blockIndex:t})}))}))}processSlots(){if(!this.caption&&!this.host.querySelector('[slot="caption"]')){console.error("For accessibility you must set a `title` prop or use the `caption` slot")}}async componentWillLoad(){this.store=await T(this.host,this.columns,this.scrollParent);await this.handleRowsChange();this.processSlots();this.setBlocks();this.store.data.onChange("rows",(()=>this.setBlocks()))}connectedCallback(){a((()=>this.scrollParent=tt(this.host)))}componentDidLoad(){this.setInitialBlockDimension()}componentShouldUpdate(t,n,e){if(["rows","columns"].includes(e))return false}componentWillRender(){}componentDidRender(){requestAnimationFrame((()=>this.ignoreIO=false));this.setMeasureElement()}render(){this.blockElements=[];return n(l,null,n("div",{class:`${b}__top-anchor`,ref:t=>this.topAnchorEle=t}," "),n("nano-resize-observe",{"aria-labelledby":"table-caption-"+this.renderId,tabindex:this.type==="grid"?"0":undefined,states:"576w sm, 768w md"},n("div",{class:`${b}__wrap`},n("nano-progress-bar",{indeterminate:true,class:{[`${b}__progress-bar`]:true,[`${b}__progress-bar--show`]:this.loading}}),n("table",{role:this.type==="grid"?"grid":undefined,"aria-readonly":this.type==="table"?"true":undefined,"aria-rowcount":this.store.data.state.rows.length,"aria-colcount":this.store.config.state.columns.length,class:`${b}`,ref:t=>this.tableEle=t},n("caption",{class:{[`${b}__caption`]:true,[`${b}__caption--hide`]:!this.showCaption},id:"table-caption-"+this.renderId},n("slot",{name:"caption"},this.caption)),n("thead",null,n(V,{rowRenderer:this.headRender,onColumnPinned:this.handleColumnPinned},this.store.config.state.columns.map((t=>[n(X,{column:t,headRenderer:this.headRender,onColumnOrderClick:this.sortStart,onColumnPinned:this.handleColumnPinned})])))),this.loading&&!this.blocks.length&&[...Array(10).keys()].map((t=>n("tr",null,this.store.config.state.columns.map(((e,i)=>n(Y,{rowIndex:t,colIndex:i,nestedContent:n("nano-skeleton",null)})))))),this.blocks.map(((t,e)=>n("tbody",{key:t.__uuid,id:`tbody-${this.renderId}-${e}`,ref:t=>{this.blockElements.push(t);this.setupBlockIO(t,e)},class:{[`${b}__inactive`]:!this.activeBlocks.includes(e),[`${b}__active`]:this.activeBlocks.includes(e)}},this.activeBlocks.includes(e)?t.rows.map(((t,i)=>{const o=e>0?e*this.perBlock+i:i;return n(Q,{rowRenderer:this.rowRender,row:t},this.store.config.state.columns.map(((t,e)=>n(Y,{rowIndex:o,colIndex:e}))))})):n("td",{colSpan:this.store.config.state.columns.length,style:{height:this.getBlockHeight(e)}})))),this.showFooter&&n("tfoot",null,n(V,{rowRenderer:this.footRender,onColumnPinned:this.handleColumnPinned},this.store.config.state.columns.map((t=>[n(X,{column:t,headRenderer:this.footRender,onColumnPinned:this.handleColumnPinned})]))))),!!this.blocks.length&&n("nano-spinner",{type:"circle",class:{[`${b}__spinner`]:true,[`${b}__spinner--show`]:this.loading}}))))}get host(){return i(this)}static get watchers(){return{rows:["handleRowsChange"],columns:["handleColsChange"],searchTerm:["handleSearchTermChange"]}}};ot.style=et;export{ot as T,g as c};
|
5
|
+
//# sourceMappingURL=p-4c386a43.js.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"sources":["src/components/table/table.constants.ts","@worker-helper","src/components/table/table.store.ts","src/components/table/table.service.tsx","src/components/table/table.children.tsx","src/components/table/table.utils.ts","src/components/table/table.scss?tag=nano-table","src/components/table/table.tsx"],"names":["CSSNAMESPACE","isInstanceOf","value","className","C","globalThis","getTransferables","constructor","Object","values","Array","isArray","flatMap","buffer","pendingIds","callbackIds","pending","Map","callbacks","createWorker","workerPath","workerName","workerMsgId","worker","Worker","name","addEventListener","data","workerMsg","id","err","resolve","reject","get","delete","errObj","assign","Error","message","consoleError","forEach","e","createWorkerProxy","exportedMethod","args","Promise","pendingId","i","argLen","length","mainData","set","callbackId","push","postMessage","w","then","colsToWorker","columns","safeColumns","JSON","parse","stringify","c","sortCompareFn","safeCol","find","sc","prop","toString","stores","WeakMap","async","generateStore","host","scrollParent","store","createStore","rows","config","general","workerId","createWorkerStore","state","use","reset","syncDataToWorker","dispose","syncConfigToWorker","getStore","storeSetData","map","row","__index","__uuid","cyrb53","join","storeSetConfig","storeSearch","term","workerSearch","console","log","storeFilter","filters","workerFilter","storeSort","order","workerSort","colDataModel","rowIndex","colIndex","fetchStores","column","rowModel","cellModel","rowDataModel","mergeProperties","current","extra","props","class","style","getElement","getRenderingRef","mergeCellProperties","defaultProps","extraPropsFunc","cellProperties","cellRender","tpl","cellTemplate","model","h","Fragment","colheadFootRender","col","colTemplate","title","baseClasses","type","vPinned","classes","[object Object]","classString","entries","on","stickyHIOs","stickyVIOs","addHObserver","el","pos","cb","root","observer","IntersectionObserver","positions","start","boundingClientRect","x","getBoundingClientRect","scrollLeft","isIntersecting","end","right","width","threshold","rootMargin","document","scrollingElement","requestAnimationFrame","observe","addVObserver","top","y","scrollTop","bottom","height","intersectionRect","TableRow","rowRenderer","children","extraProps","rowProperties","pinned","baseProps","key","TableHeadFootRow","onColumnPinned","utils","template","toRender","renderedRow","node","vtag","vattrs","vchildren","cNode","includes","ref","th","TableColHead","headRenderer","onColumnOrderClick","handleColumnOrderClick","target","closest","columnProperties","filter","content","Number","colspan","scope","sortable","aria-sort","onClick","TableCell","nestedContent","CellType","rowHeader","rowspan","detectScrollSpeed","lastPos","newPos","timer","delta","delay","clear","window","scrollY","clearTimeout","setTimeout","findScrollParent","element","getComputedStyle","excludeStaticParent","position","overflowRegex","documentElement","parent","parentElement","test","overflow","overflowY","overflowX","isInViewport","percentVisible","r","windowHeight","innerHeight","clientHeight","left","Math","floor","tableCss","Table","hostRef","this","debounceSetLoading","l","_loading","renderId","currentFilters","currentSort","blockIos","blockHeights","unitHeight","ignoreIO","_isReady","sortStart","loading","sortEvent","nanoTblBeforeSort","emit","defaultPrevented","scrollToTop","customSortFn","sortComplete","warn","setupBlockIO","blockIndex","has","blockIo","ioEntry","readTask","scrollSpeed","activeBlocks","max","nanoTblBlockRendered","block","totalBlocks","blockElements","setBlockHeight","handleColumnPinned","applied","tableEle","classList","toggle","debounce","bind","isReady","columnInit","setInitialBlockDimension","blocksLength","blocks","searchStart","filterStart","additive","measureEle","measureHeight","querySelector","ready","handleReady","speed","hash","location","idRow","scrollIntoView","nanoTblReady","nanoTblAfterSort","nanoTblBeforeSearch","searchTerm","nanoTblAfterSearch","f","ff","nanoTblBeforeFilter","customFilterFn","filterComplete","cFilter","nanoTblAfterFilter","scrollBehaviour","scrollBehavior","scrollX","topAnchorEle","b","contains","finishResizing","setMeasureElement","perBlock","undefined","cachedBlockHeight","bh","blockLength","fBhI","findIndex","caption","error","handleRowsChange","processSlots","setBlocks","onChange","_newVal","_oldVal","stateName","Host","a","aria-labelledby","tabindex","states","indeterminate","role","aria-readonly","aria-rowcount","aria-colcount","tbl","showCaption","headRender","colModel","keys","_colModel","tb","rowRender","colSpan","getBlockHeight","showFooter","footRender"],"mappings":"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","sourcesContent":["export const CSSNAMESPACE = 'nano-tbl';\n","\nimport { consoleError } from '@stencil/core/internal';\n\n\nconst isInstanceOf = (value, className) => {\n const C = globalThis[className];\n return C != null && value instanceof C;\n}\nconst getTransferables = (value) => {\n if (value != null) {\n if (\n isInstanceOf(value, \"ArrayBuffer\") ||\n isInstanceOf(value, \"MessagePort\") ||\n isInstanceOf(value, \"ImageBitmap\") ||\n isInstanceOf(value, \"OffscreenCanvas\")\n ) {\n return [value];\n }\n if (typeof value === \"object\") {\n if (value.constructor === Object) {\n value = Object.values(value);\n }\n if (Array.isArray(value)) {\n return value.flatMap(getTransferables);\n }\n return getTransferables(value.buffer);\n }\n }\n return [];\n};\n\nlet pendingIds = 0;\nlet callbackIds = 0;\nconst pending = new Map();\nconst callbacks = new Map();\n\nexport const createWorker = (workerPath, workerName, workerMsgId) => {\n const worker = new Worker(workerPath, {name:workerName});\n\n worker.addEventListener('message', ({data}) => {\n if (data) {\n const workerMsg = data[0];\n const id = data[1];\n const value = data[2];\n\n if (workerMsg === workerMsgId) {\n const err = data[3];\n const [resolve, reject, callbackIds] = pending.get(id);\n pending.delete(id);\n\n if (err) {\n const errObj = (err.isError)\n ? Object.assign(new Error(err.value.message), err.value)\n : err.value;\n\n consoleError(errObj);\n reject(errObj);\n } else {\n if (callbackIds) {\n callbackIds.forEach(id => callbacks.delete(id));\n }\n resolve(value);\n }\n } else if (workerMsg === workerMsgId + '.cb') {\n try {\n callbacks.get(id)(...value);\n } catch (e) {\n consoleError(e);\n }\n }\n }\n });\n\n return worker;\n};\n\nexport const createWorkerProxy = (worker, workerMsgId, exportedMethod) => (\n (...args) => new Promise((resolve, reject) => {\n let pendingId = pendingIds++;\n let i = 0;\n let argLen = args.length;\n let mainData = [resolve, reject];\n pending.set(pendingId, mainData);\n\n for (; i < argLen; i++) {\n if (typeof args[i] === 'function') {\n const callbackId = callbackIds++;\n callbacks.set(callbackId, args[i]);\n args[i] = [workerMsgId + '.cb', callbackId];\n (mainData[2] = mainData[2] || []).push(callbackId);\n }\n }\n const postMessage = (w) => (\n w.postMessage(\n [workerMsgId, pendingId, exportedMethod, args],\n getTransferables(args)\n )\n );\n if (worker.then) {\n worker.then(postMessage);\n } else {\n postMessage(worker);\n }\n })\n);\n","import { createStore, ObservableMap } from '@stencil/store';\nimport { cyrb53 } from '../../utils/math';\nimport {\n createWorkerStore,\n syncConfigToWorker,\n syncDataToWorker,\n workerFilter,\n workerSearch,\n workerSort,\n} from './table.worker';\nimport type { TableTypes } from '../../interface';\n\nexport interface TableStores {\n data: ObservableMap<{ rows: TableTypes.NanoTable['rows'] }>;\n config: ObservableMap<{ columns: TableTypes.NanoTable['columns'] }>;\n general: ObservableMap<{\n workerId: string;\n scrollParent: HTMLElement;\n host: HTMLNanoTableElement;\n }>;\n}\n\nfunction colsToWorker(columns: TableTypes.NanoTable['columns']) {\n const safeColumns: Partial<TableTypes.ColumnConfig>[] = JSON.parse(\n JSON.stringify(columns)\n );\n columns.forEach((c) => {\n if (!!c.sortCompareFn) {\n const safeCol = safeColumns.find((sc) => sc.prop === c.prop);\n safeCol.sortCompareFn = c.sortCompareFn.toString();\n }\n });\n return safeColumns;\n}\n\nconst stores: WeakMap<HTMLElement, TableStores> = new WeakMap();\n\nexport async function generateStore(\n host: HTMLNanoTableElement,\n columns: TableTypes.NanoTable['columns'],\n scrollParent: HTMLElement\n) {\n const store: TableStores = {\n data: createStore({ rows: [] }),\n config: createStore({ columns }),\n general: createStore({ workerId: null, scrollParent, host }),\n };\n\n const id = await createWorkerStore(\n store.data.state.rows,\n colsToWorker(store.config.state.columns)\n );\n store.general.state.workerId = id;\n stores.set(host, store);\n\n // sync data from our store to our worker\n\n store.data.use({\n reset: () => {\n if (store.general.state.workerId)\n syncDataToWorker(store.general.state.workerId, null);\n },\n dispose: () => {\n if (store.general.state.workerId)\n syncDataToWorker(store.general.state.workerId, null);\n },\n });\n store.config.use({\n reset: () => {\n if (store.general.state.workerId)\n syncConfigToWorker(store.general.state.workerId, null);\n },\n dispose: () => {\n if (store.general.state.workerId)\n syncConfigToWorker(store.general.state.workerId, null);\n },\n });\n return store;\n}\n\nexport function getStore(host: HTMLElement) {\n return stores.get(host);\n}\n\nexport function storeSetData(host: HTMLElement, rows: TableTypes.RowData[]) {\n const store = stores.get(host);\n if (!store) return;\n\n // augment data with some internal props\n rows = rows.map((row, i) => ({\n ...row,\n __index: i,\n __uuid: cyrb53(Object.values(row).join()),\n }));\n\n store.data.state.rows = rows;\n\n if (store.general.state.workerId)\n return syncDataToWorker(store.general.state.workerId, rows);\n}\n\nexport function storeSetConfig(\n host: HTMLElement,\n columns: TableTypes.ColumnConfig[]\n) {\n const store = stores.get(host);\n if (!store) return;\n\n if (store.general.state.workerId)\n syncConfigToWorker(store.general.state.workerId, colsToWorker(columns));\n store.config.state.columns = columns;\n}\n\nexport async function storeSearch(host: HTMLElement, term: string) {\n const store = stores.get(host);\n if (!store || !store.general.state.workerId) return;\n\n try {\n store.data.state.rows = await workerSearch(\n store.general.state.workerId,\n term\n );\n } catch (e) {\n console.log(e);\n }\n}\n\nexport async function storeFilter(\n host: HTMLElement,\n filters: TableTypes.Filter[]\n) {\n const store = stores.get(host);\n if (!store || !store.general.state.workerId) return;\n\n try {\n store.data.state.rows = await workerFilter(\n store.general.state.workerId,\n filters\n );\n } catch (e) {\n console.log(e);\n }\n}\n\nexport async function storeSort(\n host: HTMLElement,\n prop: TableTypes.Prop,\n order: TableTypes.Order\n) {\n const store = stores.get(host);\n if (!store || !store.general.state.workerId) return;\n\n try {\n store.data.state.rows = await workerSort(\n store.general.state.workerId,\n prop,\n order\n );\n } catch (e) {\n console.log(e);\n }\n}\n","import { getRenderingRef, getElement, VNode, h, Fragment } from '@stencil/core';\nimport { getStore } from './table.store';\nimport type { TableTypes } from '../../interface';\n\n/**\n * Get a model object for custom cell / property renderers.\n * @param rowIndex - the current row index being rendered\n * @param colIndex - the current column index being rendered\n * @returns a model object which will be passed to custom renderers\n */\nfunction colDataModel(\n rowIndex: number,\n colIndex: number\n): TableTypes.ColumnDataSchemaModel {\n const store = fetchStores();\n const columns = store.config.state.columns;\n const rows = store.data.state.rows;\n\n const column = columns[colIndex];\n const prop: TableTypes.ColumnProp | undefined = column?.prop;\n const rowModel = rows[rowIndex];\n const cellModel = rowModel[columns[colIndex].prop];\n\n return {\n prop,\n cellModel,\n column,\n rowIndex,\n rowModel,\n };\n}\n\n/**\n * Get a model object for custom row renderers.\n * @param rowIndex\n * @returns a model object passed to custom row renderers\n */\nexport function rowDataModel(rowIndex: number): TableTypes.RowDataSchemaModel {\n const store = fetchStores();\n const rows = store.data.state.rows;\n const row = rows[rowIndex];\n\n return {\n row,\n rowIndex,\n };\n}\n\n/**\n * Merges 2 objects of properties together\n * @param current - property object\n * @param extra - additional object property\n * @returns - merged properties that can be applied to a node\n */\nexport function mergeProperties(\n current: TableTypes.EleProps,\n extra: TableTypes.EleProps\n) {\n if (!extra) return current;\n\n // top level merge\n const props: TableTypes.EleProps = { ...extra, ...current };\n\n // deeper merge\n // merge classes maps or strings\n if (extra.class) {\n if (typeof extra.class === 'object' && typeof props.class === 'object') {\n props.class = { ...extra.class, ...props.class };\n } else if (\n typeof extra.class === 'string' &&\n typeof props.class === 'object'\n ) {\n props.class[extra.class] = true;\n } else if (typeof props.class === 'string') {\n props.class += ' ' + extra.class;\n }\n }\n // merge style\n if (extra.style) {\n props.style = { ...extra.style, ...props.style };\n }\n return props;\n}\n\n/**\n * Returns the current nano-table's stores.\n * @returns the current nano-table stores\n */\nexport function fetchStores() {\n return getStore(getElement(getRenderingRef()));\n}\n\n/**\n * Merges any defined cell properties with properties\n * required by `nano-table` functionality\n * @param rowIndex - the current row index being rendered\n * @param colIndex = the current column index being rendered\n * @param defaultProps - default properties required by `nano-table`\n * @returns - the merged properties that will be applied to a node\n */\nexport function mergeCellProperties(\n rowIndex: number,\n colIndex: number,\n defaultProps: TableTypes.EleProps\n): TableTypes.EleProps {\n const props: TableTypes.EleProps = { ...defaultProps };\n const extraPropsFunc =\n fetchStores().config.state.columns[colIndex]?.cellProperties;\n if (!extraPropsFunc) return props;\n\n const data = colDataModel(rowIndex, colIndex);\n const extra = extraPropsFunc(data);\n if (!extra) return props;\n\n return mergeProperties(props, extra);\n}\n\n/**\n * Renders a cell using a custom renderer if set.\n * @param rowIndex - the current row index being rendered\n * @param colIndex - the current column index being rendered\n * @returns - a JSX node\n */\nexport function cellRender(rowIndex: number, colIndex: number): VNode {\n const store = fetchStores();\n const columns = store.config.state.columns;\n const tpl = columns[colIndex]?.cellTemplate;\n const model = colDataModel(rowIndex, colIndex);\n\n return tpl ? (\n tpl(h as unknown as TableTypes.HFunc<VNode>, model)\n ) : (\n <Fragment>{model.cellModel}</Fragment>\n );\n}\n\n/**\n * Renders a table header (within a thead) using a custom template if set.\n * @param col - the current column config object\n * @returns - a JSX node\n */\nexport function colheadFootRender(col: TableTypes.ColumnConfig): VNode {\n const tpl = col?.colTemplate;\n return tpl ? (\n tpl(h as unknown as TableTypes.HFunc<VNode>, col)\n ) : (\n <Fragment>{col.title}</Fragment>\n );\n}\n","import { Fragment, FunctionalComponent, h, VNode } from '@stencil/core';\nimport { CSSNAMESPACE } from './table.constants';\nimport {\n cellRender,\n colheadFootRender,\n fetchStores,\n mergeCellProperties,\n mergeProperties,\n rowDataModel,\n} from './table.service';\nimport type { TableTypes } from '../../interface';\n\ntype ValidRenderTypes = 'tr' | 'th' | 'td';\n\ntype PinnedCb = (positions: { [key in TableTypes.Position]?: boolean }) => void;\n\nfunction baseClasses(\n type: ValidRenderTypes,\n vPinned?: TableTypes.Position,\n toString?: false\n): { [key: string]: boolean };\nfunction baseClasses(\n type: ValidRenderTypes,\n vPinned?: TableTypes.Position,\n toString?: true\n): string;\nfunction baseClasses(\n type: ValidRenderTypes,\n vPinned?: TableTypes.Position,\n toString = false\n): { [key: string]: boolean } | string {\n const classes = {\n [`${CSSNAMESPACE}__${type}`]: true,\n [`${CSSNAMESPACE}__pin`]: !!vPinned,\n [`${CSSNAMESPACE}__pin--top`]: vPinned === 'top',\n [`${CSSNAMESPACE}__pin--bottom`]: vPinned === 'bottom',\n };\n\n if (toString) {\n let classString = '';\n Object.entries(classes).forEach(([className, on]) => {\n if (on) classString += className + ' ';\n });\n return classString;\n }\n return classes;\n}\n\nconst stickyHIOs: WeakMap<HTMLTableCellElement, IntersectionObserver> =\n new WeakMap();\nconst stickyVIOs: WeakMap<HTMLTableCellElement, IntersectionObserver> =\n new WeakMap();\n\nfunction addHObserver(\n el: HTMLTableCellElement,\n pos: TableTypes.Position,\n cb: PinnedCb\n) {\n if (stickyHIOs.get(el)) return;\n\n const store = fetchStores();\n const root = store.general.state.scrollParent;\n const host = store.general.state.host;\n\n const observer = new IntersectionObserver(\n ([e]) => {\n const positions: { [key in TableTypes.Position]?: boolean } = {};\n if (pos === 'start') {\n positions.start =\n e.boundingClientRect.x -\n (host.getBoundingClientRect().x + root.scrollLeft) <\n 0 && !e.isIntersecting;\n }\n if (pos === 'end') {\n // TODO - sort these out for RtL\n positions.end =\n e.boundingClientRect.right > e.boundingClientRect.width &&\n !e.isIntersecting;\n }\n cb(positions);\n },\n {\n threshold: [1],\n rootMargin: '1px 0px 1px 0px',\n root: root === document.scrollingElement ? null : root,\n }\n );\n stickyHIOs.set(el, observer);\n requestAnimationFrame(() => observer.observe(el));\n}\n\nfunction addVObserver(\n el: HTMLTableCellElement,\n pos: TableTypes.Position,\n cb: PinnedCb\n) {\n if (stickyVIOs.get(el)) return;\n\n const store = fetchStores();\n const root = store.general.state.scrollParent;\n const host = store.general.state.host;\n\n const observer = new IntersectionObserver(\n ([e]) => {\n const positions: { [key in TableTypes.Position]?: boolean } = {};\n if (pos === 'top') {\n positions.top =\n e.boundingClientRect.y -\n (host.getBoundingClientRect().y + root.scrollTop) <\n 0 && !e.isIntersecting;\n }\n if (pos === 'bottom')\n positions.bottom =\n e.boundingClientRect.height > e.intersectionRect.height &&\n !e.isIntersecting;\n cb(positions);\n },\n {\n threshold: [0.99],\n rootMargin: '0px 100px 0px 100px',\n root: root === document.scrollingElement ? null : root,\n }\n );\n stickyVIOs.set(el, observer);\n requestAnimationFrame(() => observer.observe(el));\n}\n\ntype TableRowProps = {\n rowRenderer: TableTypes.RowRenderer;\n rowIndex?: number;\n row?: TableTypes.RowData;\n};\n\nexport const TableRow: FunctionalComponent<TableRowProps> = (\n { rowRenderer, rowIndex, row },\n children\n) => {\n let extraProps = {};\n\n if (!row) {\n const model = rowDataModel(rowIndex);\n row = model.row;\n }\n\n if (rowRenderer?.rowProperties) {\n extraProps =\n rowRenderer.rowProperties({ row: row, rowIndex }) || extraProps;\n }\n\n let pinned: TableTypes.Position;\n if (rowRenderer?.pinned && typeof rowRenderer.pinned === 'function') {\n pinned = rowRenderer.pinned();\n }\n\n const baseProps = { class: baseClasses('tr', pinned) };\n const props = extraProps ? mergeProperties(baseProps, extraProps) : baseProps;\n\n return (\n <tr {...props} key={row.__uuid}>\n {children}\n </tr>\n );\n};\n\ntype TableHeadFootProps = {\n rowRenderer: TableTypes.HeadFootRenderer;\n onColumnPinned?: PinnedCb;\n};\n\nexport const TableHeadFootRow: FunctionalComponent<TableHeadFootProps> = (\n { rowRenderer, onColumnPinned },\n children,\n utils\n) => {\n let extraProps = {};\n if (rowRenderer.rowProperties) {\n extraProps = rowRenderer.rowProperties() || {};\n }\n\n const pinned = rowRenderer.pinned || null;\n const baseProps = { class: baseClasses('tr', null) };\n const props = extraProps ? mergeProperties(baseProps, extraProps) : baseProps;\n const tpl = rowRenderer?.template;\n\n if (tpl) {\n let toRender = tpl(h as TableTypes.HFunc<VNode>, {\n renderedRow: <tr {...props}>{children}</tr>,\n });\n\n if (Array.isArray(toRender)) {\n toRender = utils.map(toRender, (node) => {\n if (node.vtag === 'tr') {\n node.vattrs = mergeProperties(\n { class: baseClasses('tr', null, true) },\n node.vattrs\n );\n\n if (!!node.vchildren) {\n node.vchildren = utils.map(node.vchildren, (cNode) => {\n if (['td', 'th'].includes(cNode.vtag.toString())) {\n cNode.vattrs = mergeProperties(\n {\n class: baseClasses(\n cNode.vtag.toString() as ValidRenderTypes,\n pinned,\n true\n ),\n ref: (th) => {\n addVObserver(th, pinned, onColumnPinned);\n },\n },\n cNode.vattrs\n );\n }\n return cNode;\n });\n }\n }\n return node;\n });\n }\n return toRender;\n }\n\n return <tr {...props}>{children}</tr>;\n};\n\ntype TableColHeadProps = {\n column: TableTypes.ColumnConfig;\n headRenderer: TableTypes.HeadFootRenderer;\n onColumnOrderClick?: (\n order: TableTypes.Order,\n column: TableTypes.Prop,\n el: HTMLElement\n ) => void;\n onColumnPinned?: PinnedCb;\n};\n\nexport const TableColHead: FunctionalComponent<TableColHeadProps> = ({\n column,\n headRenderer,\n onColumnOrderClick,\n onColumnPinned,\n}) => {\n function handleColumnOrderClick(e: MouseEvent & { target: HTMLElement }) {\n let order;\n switch (column.order) {\n case 'asc':\n order = 'desc';\n break;\n case 'desc':\n order = null;\n break;\n default:\n order = 'asc';\n }\n onColumnOrderClick(order, column.prop, e.target.closest('th'));\n }\n\n let extraProps = {};\n if (column.columnProperties) {\n extraProps = column.columnProperties(column) || extraProps;\n }\n\n const baseProps = {\n class: {\n ...baseClasses('th', headRenderer?.pinned),\n [`${CSSNAMESPACE}__pin--start`]: column.pinned === 'start',\n [`${CSSNAMESPACE}__pin--end`]: column.pinned === 'end',\n [`${CSSNAMESPACE}__ordered`]: !!column.order,\n [`${CSSNAMESPACE}__filtered`]: !!column.filter,\n },\n };\n let props = extraProps ? mergeProperties(baseProps, extraProps) : baseProps;\n const content = colheadFootRender(column);\n\n if (!content) return <Fragment></Fragment>;\n\n props =\n Number((props as TableTypes.EleProps).colspan) > 1\n ? { ...props, scope: 'colgroup' }\n : { ...props, scope: 'col' };\n\n if (column.sortable !== false) {\n return (\n <th\n {...props}\n aria-sort={\n column.order\n ? column.order === 'asc'\n ? 'ascending'\n : 'descending'\n : 'none'\n }\n ref={(th) => {\n if (['end', 'start'].includes(column.pinned))\n addHObserver(th, column.pinned, onColumnPinned);\n if (['top', 'bottom'].includes(headRenderer.pinned))\n addVObserver(th, headRenderer.pinned, onColumnPinned);\n }}\n >\n <button\n class={{\n [`${CSSNAMESPACE}__order-btn`]: true,\n [`${CSSNAMESPACE}__cell-content`]: true,\n }}\n onClick={handleColumnOrderClick}\n >\n {colheadFootRender(column)}\n {!!column.filter && <nano-icon name=\"light/filter\" />}\n {!!column.order &&\n (column.order === 'desc' ? (\n <nano-icon name=\"solid/long-arrow-down\" />\n ) : (\n <nano-icon name=\"solid/long-arrow-up\" />\n ))}\n <div class={`${CSSNAMESPACE}__status-icons`}>\n <nano-icon name=\"light/chevron-down\" />\n </div>\n </button>\n </th>\n );\n }\n\n return (\n <th\n {...props}\n ref={(th) => {\n if (['end', 'start'].includes(column.pinned))\n addHObserver(th, column.pinned, onColumnPinned);\n if (['top', 'bottom'].includes(headRenderer.pinned))\n addVObserver(th, headRenderer.pinned, onColumnPinned);\n }}\n >\n <div class={`${CSSNAMESPACE}__cell-content`}>\n {colheadFootRender(column)}\n {!!column.filter && <nano-icon name=\"light/bars-filter\" />}\n </div>\n </th>\n );\n};\n\ntype TableCellProps = {\n rowIndex: number;\n colIndex: number;\n nestedContent?: VNode;\n};\n\nexport const TableCell: FunctionalComponent<TableCellProps> = ({\n rowIndex,\n colIndex,\n nestedContent,\n}) => {\n const content = nestedContent || cellRender(rowIndex, colIndex);\n if (!content) return <Fragment></Fragment>;\n\n const store = fetchStores();\n const column = store.config.state.columns[colIndex];\n let CellType = 'td';\n let props = mergeCellProperties(rowIndex, colIndex, {\n class: {\n [`${CSSNAMESPACE}__td`]: true,\n [`${CSSNAMESPACE}__ordered`]: !!column.order,\n [`${CSSNAMESPACE}__pin`]: !!column.pinned,\n [`${CSSNAMESPACE}__pin--start`]: column.pinned === 'start',\n [`${CSSNAMESPACE}__pin--end`]: column.pinned === 'end',\n },\n });\n\n if (column.rowHeader) {\n props =\n Number((props as TableTypes.EleProps).rowspan) > 1\n ? { ...props, scope: 'rowgroup' }\n : { ...props, scope: 'row' };\n CellType = 'th';\n }\n\n return (\n <CellType\n // role=\"gridcell\"\n {...props}\n >\n <div class={`${CSSNAMESPACE}__cell-content`}>{content}</div>\n </CellType>\n );\n};\n","export const detectScrollSpeed = (() => {\n let lastPos: number;\n let newPos: number;\n let timer: number;\n let delta: number;\n const delay = 60; // in \"ms\" (higher means lower fidelity )\n\n const clear = () => {\n lastPos = null;\n delta = 0;\n };\n clear();\n\n return () => {\n newPos = window.scrollY;\n if (lastPos != null) delta = newPos - lastPos;\n lastPos = newPos;\n window.clearTimeout(timer);\n timer = window.setTimeout(clear, delay);\n return delta;\n };\n})();\n\nexport function findScrollParent(element: HTMLElement) {\n let style = getComputedStyle(element);\n const excludeStaticParent = style.position === 'absolute';\n const overflowRegex = /(auto|scroll)/;\n\n if (style.position === 'fixed') return document.documentElement;\n for (let parent = element; (parent = parent.parentElement); ) {\n style = getComputedStyle(parent);\n if (excludeStaticParent && style.position === 'static') {\n continue;\n }\n if (overflowRegex.test(style.overflow + style.overflowY + style.overflowX))\n return parent;\n }\n return document.documentElement;\n}\n\nexport function isInViewport(el: Element, percentVisible = 100) {\n const r = el.getBoundingClientRect();\n const windowHeight =\n window.innerHeight || document.documentElement.clientHeight;\n\n if (\n !r.bottom &&\n !r.top &&\n !r.left &&\n !r.right &&\n !r.height &&\n !r.width &&\n !r.x &&\n !r.y\n )\n return false;\n\n return !(\n Math.floor(100 - ((r.top >= 0 ? 0 : r.top) / +-r.height) * 100) <\n percentVisible ||\n Math.floor(100 - ((r.bottom - windowHeight) / r.height) * 100) <\n percentVisible\n );\n}\n","@use '../../global/style/utilities/globals' as t;\n\nnano-table {\n display: block;\n width: 100%;\n\n // general\n --max-col-width: 200px;\n\n // text\n --color: var(--nano-color-mediumgrey, #68767e);\n --font-size: 0.87rem;\n --cell-line-height: 1.5;\n\n // borders\n --border-color: var(--nano-color-palegrey, #b5aea7);\n --border-style: 1px solid var(--border-color);\n --border-tint-color: var(--nano-color-blue, #90c6e7);\n --border-tint-style: 2px solid var(--border-tint-color);\n\n // backgrounds\n --cell-bg-rgb: var(--nano-color-white-rgb, 255 255 255);\n --head-bg-rgb: var(--cell-bg-rgb);\n --foot-bg-rgb: var(--cell-bg-rgb);\n --th-row-bg-rgb: var(--cell-bg-rgb);\n --ordered-bg-rgb: var(--nano-color-offwhite-rgb, 249 249 251);\n\n // spacing\n --td-padding: 0.5rem 0.625rem 0.4125rem;\n --th-padding: 0.875rem 0.625rem 0.6875rem;\n --head-th-padding: var(--th-padding);\n --foot-th-padding: var(--td-padding);\n --bookend-col-padding: 2rem;\n}\n\n.nano-tbl {\n $base: &;\n\n color: var(--color);\n text-align: start;\n width: 100%;\n font-size: var(--font-size);\n border-spacing: 0 0;\n border-collapse: separate;\n background: rgb(var(--cell-bg-rgb));\n border-inline-end: 1px solid transparent;\n\n &__wrap {\n display: table;\n min-width: 100%;\n }\n\n &__top-anchor {\n @include t.visually-hide;\n }\n\n &__ordered {\n background-color: var(--ordered-bg);\n border-inline-start: var(--border-style);\n border-inline-end: var(--border-style);\n }\n\n &__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: 10px;\n align-items: center;\n width: 100%;\n }\n\n &__status-icons {\n margin-inline: auto 10px;\n display: flex;\n gap: 10px;\n }\n\n &__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 scale: 0;\n width: 100%;\n height: 0;\n\n &--show {\n scale: 1;\n height: auto;\n }\n }\n\n &__caption {\n &--hide {\n @include t.visually-hide;\n }\n }\n\n &__td,\n &__th {\n line-height: var(--cell-line-height);\n text-align: start;\n border-block-end: var(--border-style);\n max-width: var(--max-col-width);\n background-color: rgb(var(--cell-bg-rgb));\n\n .md & {\n &:first-child #{$base}__cell-content {\n padding-inline-start: var(--bookend-col-padding) !important;\n }\n\n &:last-child #{$base}__cell-content {\n padding-inline-end: var(--bookend-col-padding) !important;\n }\n }\n\n thead & {\n font-weight: 800;\n background: rgba(var(--head-bg-rgb), 90%);\n\n #{$base}__cell-content {\n padding: var(--head-th-padding);\n }\n }\n\n tfoot & {\n font-weight: 800;\n border-block-end: none;\n background: rgba(var(--foot-bg-rgb), 90%);\n\n #{$base}__cell-content {\n padding: var(--foot-th-padding);\n }\n }\n\n &.nano-tbl__ordered {\n background-color: rgba(var(--ordered-bg-rgb), 0.8) !important;\n }\n }\n\n &__cell-content {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n padding: var(--td-padding);\n }\n\n tbody {\n will-change: scroll-position;\n visibility: visible;\n\n &.nano-tbl__inactive {\n visibility: hidden;\n }\n }\n\n th[scope='row'] {\n font-weight: 800;\n margin: 0;\n }\n\n .sm & th[scope='row'] {\n max-width: 65vw !important;\n }\n\n &__pin {\n position: sticky;\n z-index: 1;\n\n &--start {\n inset-inline: -1px auto;\n transition: max-width 0.25s;\n\n &::after {\n content: '';\n position: absolute;\n inset: 0;\n box-shadow: 5px 0 4px 0 rgb(0 0 0 / 20%);\n opacity: 0;\n z-index: -1;\n }\n\n #{$base}__pinned--start & {\n z-index: 2;\n max-width: 125px;\n\n .sm & {\n max-width: var(--max-col-width);\n }\n\n &::after {\n opacity: 1;\n }\n }\n }\n\n &--end {\n /*\n I cannot think of a nice way to make stuck-end columns play nice on small screens :(\n Changing the width when stuck (as we do for stuck-start columns) causes the whole positioning to change.\n This fires the IO, thus un-sticks the column, thus causes the IO to fire which sticks the column ∞\n */\n #{$base}__pin--start + & {\n inset-inline: auto auto;\n\n &::after {\n display: none;\n }\n }\n\n .sm & {\n inset-inline: auto -1px !important;\n max-width: min(50vw, 200px);\n\n &::after {\n display: block !important;\n content: '';\n position: absolute;\n inset: 0;\n box-shadow: -5px 0 4px 0 rgb(0 0 0 / 20%);\n opacity: 0;\n z-index: -1;\n }\n }\n\n #{$base}__pinned--end & {\n .sm & {\n z-index: 3;\n\n &::after {\n opacity: 1;\n }\n }\n }\n }\n\n &--top {\n inset-block: -1px auto;\n\n #{$base}__pinned--top & {\n z-index: 4;\n }\n }\n\n &--bottom {\n inset-block: auto -1px;\n\n #{$base}__pinned--bottom & {\n z-index: 5;\n border-block-start: var(--border-tint-style);\n }\n }\n\n &--top#{&}--start {\n #{$base}__pinned--top#{$base}__pinned--start & {\n z-index: 6;\n }\n }\n\n &--top#{&}--end {\n #{$base}__pinned--top#{$base}__pinned--end & {\n z-index: 6;\n }\n }\n\n &--bottom#{&}--start {\n #{$base}__pinned--bottom#{$base}__pinned--start & {\n z-index: 6;\n }\n }\n\n &--bottom#{&}--end {\n #{$base}__pinned--bottom#{$base}__pinned--end & {\n z-index: 6;\n }\n }\n }\n\n thead tr:last-of-type td,\n thead tr:last-of-type th,\n tfoot tr:last-of-type td,\n tfoot tr:last-of-type th {\n border-block-end: var(--border-tint-style);\n }\n\n .unlimited-width {\n max-width: none;\n }\n\n &__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: -1;\n\n &--show {\n scale: 1;\n position: sticky;\n }\n }\n\n nano-skeleton {\n line-height: var(--cell-line-height);\n }\n}\n","import {\n Component,\n Prop,\n h,\n ComponentInterface,\n Element,\n Host,\n Watch,\n State,\n readTask,\n Event,\n EventEmitter,\n Method,\n Build,\n Listen,\n} from '@stencil/core';\nimport { cyrb53 } from '../../utils/math';\nimport { debounce } from '../../utils/throttle';\nimport {\n TableColHead,\n TableRow,\n TableCell,\n TableHeadFootRow,\n} from './table.children';\nimport { CSSNAMESPACE } from './table.constants';\nimport {\n generateStore,\n storeSearch,\n storeSetConfig,\n storeSetData,\n storeSort,\n storeFilter,\n TableStores,\n} from './table.store';\nimport {\n detectScrollSpeed,\n findScrollParent,\n isInViewport,\n} from './table.utils';\nimport type { TableTypes } from '../../interface';\n\nfunction perMark(name: string, end: boolean = false) {\n if (!Build.isDev) return;\n if (end) {\n performance?.mark('end' + name);\n performance?.measure(name, 'start' + name, 'end' + name);\n const entries = performance?.getEntriesByName(name);\n console.log(entries[entries.length ? entries.length - 1 : 0]);\n } else {\n performance?.mark('start' + name);\n }\n}\n\nlet id = 0;\n/**\n * A performant, accessible and semantic (uses real html `<table />`, `<tr />` etc) table and data-grid solution.\n * - Built-in search\n * - Built-in column filter\n * - Built-in column sort\n * - Easily swap in API / async based search / filter & sort\n * - Pin headers, footers, rows, columns\n * - Add custom rendering at every level\n * - Add custom properties at every level\n *\n * @slot caption - The table's caption. You must either use this or the `caption` attribute.\n */\n@Component({\n tag: 'nano-table',\n styleUrl: 'table.scss',\n})\nexport class Table implements ComponentInterface {\n constructor() {\n this.debounceSetLoading = debounce(this.debounceSetLoading.bind(this), 50);\n }\n // Public API\n\n // Props\n\n /** The type of table. Grid type will make cells navigable by keyboard */\n @Prop() type: 'grid' | 'table' = 'table';\n\n /** A descriptive title of the table.\n * You must use this or the `slot=\"caption\"` for accessibility */\n @Prop() caption: string;\n\n /** Show the caption on-screen */\n @Prop() showCaption: boolean = false;\n\n /** Will show a loading state when true.\n * Will be shown automatically if `rows` is a promise waiting to resolve\n * or when performing custom filtering or sorting */\n @Prop()\n get loading() {\n return this._loading;\n }\n set loading(l: boolean) {\n this.debounceSetLoading(l);\n }\n @State() _loading: boolean = true;\n private debounceSetLoading = (l: boolean) => {\n this._loading = l;\n };\n\n /** When loading rows asynchronously, this will render this number of placeholder rows */\n @Prop() placeholderSize = 5;\n\n /** The data to place in the table */\n @Prop() rows:\n | TableTypes.NanoTable['rows']\n | Promise<TableTypes.NanoTable['rows']>;\n\n @Watch('rows')\n handleRowsChange() {\n if (!this.rows) return;\n\n this.loading = true;\n Promise.resolve(this.rows).then(async (rows) => {\n await storeSetData(this.host, rows);\n\n if (!this.isReady) {\n await this.columnInit();\n this.setInitialBlockDimension();\n }\n this.loading = false;\n });\n }\n\n /** The column config used to generate present the rows of data */\n @Prop({ mutable: true }) columns: TableTypes.NanoTable['columns'] = [];\n\n @Watch('columns')\n handleColsChange() {\n storeSetConfig(this.host, this.columns);\n if (this.isReady) this.columnInit();\n }\n\n /** Used for custom thead row rendering */\n @Prop() headRender: TableTypes.HeadFootRenderer = { pinned: 'top' };\n\n /** Used for custom row rendering */\n @Prop() rowRender: TableTypes.RowRenderer;\n\n /** Used for custom tfoot row rendering */\n @Prop() footRender: TableTypes.HeadFootRenderer = { pinned: 'bottom' };\n\n /** Whether to show a `<tfoot>` component */\n @Prop() showFooter = false;\n\n /** To improve performance, data is split into blocks\n * which are shown / hidden and rendered as they become visible.\n * Use this to control the number of hits within a block -\n * A block should fill a scrolling viewport.\n * The less perBlock the better for performance */\n @Prop() perBlock = 60;\n\n /** The number of total blocks currently rendered in the table. @readonly */\n @Prop()\n get blocksLength() {\n return this.blocks.length;\n }\n\n /** Term to search for in the data */\n @Prop() searchTerm: string;\n\n /** A custom filtering function. Should return a promise.\n * On successful completion the column UI will be updated.\n * A good use-case would be performing the filter on a server / via fetch.\n * Then on success, updating the table's data via the `rows` property */\n @Prop() customFilterFn?: (filters: TableTypes.Filter[]) => Promise<void>;\n\n /** A custom sorting function. Should return a promise.\n * On successful completion the column UI will be updated.\n * A good use-case would be performing the sort on a server / via fetch.\n * Then on success, updating the table's data via the `rows` property */\n @Prop() customSortFn?: (\n property: TableTypes.Prop,\n order: TableTypes.Order\n ) => Promise<void>;\n\n @Watch('searchTerm')\n handleSearchTermChange() {\n this.searchStart();\n }\n\n /** Fired whenever a block is activated by scrolling into view / becoming visible\n * This could be leveraged for infinite scrolling / to fetch more data.\n */\n @Event() nanoTblBlockRendered: EventEmitter<{\n block: number;\n totalBlocks: number;\n }>;\n\n /** Fired when the table has done it's first complete render */\n @Event() nanoTblReady: EventEmitter;\n\n /** Fired before a column is sorted.\n * `event.preventDefault()` to stop sorting. */\n @Event() nanoTblBeforeSort: EventEmitter<{\n column: TableTypes.Prop;\n order: TableTypes.Order;\n }>;\n\n /** Fired after a column is sorted */\n @Event() nanoTblAfterSort: EventEmitter<{\n column: TableTypes.Prop;\n order: TableTypes.Order;\n }>;\n\n /** Fired before a column is filtered.\n * `event.preventDefault()` to stop filtering. */\n @Event() nanoTblBeforeFilter: EventEmitter<{ filters: TableTypes.Filter[] }>;\n\n /** Fired after a column is sorted */\n @Event() nanoTblAfterFilter: EventEmitter<{ filters: TableTypes.Filter[] }>;\n\n /** Fired before a general search.\n * `event.preventDefault()` to stop searching. */\n @Event() nanoTblBeforeSearch: EventEmitter<{ term: string }>;\n\n /** Fired after a general / cross column search */\n @Event() nanoTblAfterSearch: EventEmitter<{ term: string }>;\n\n /** Remove any column sorts currently applied\n * @returns a promise which resolves when complete */\n @Method()\n async resetSorting() {\n const col = this.columns.find((c) => !!c.order);\n if (!col) return;\n return this.sortStart(null, col.prop);\n }\n\n /** Apply a sort on a column\n * @returns a promise which resolves when complete */\n @Method()\n async addSort(column: TableTypes.Prop, order: TableTypes.Order) {\n const col = this.columns.find((c) => c.prop === column);\n if (!col) throw 'Cannot find column with ' + column;\n return this.sortStart(order, col.prop);\n }\n\n /** Remove any column filters currently applied\n * @returns a promise which resolves when complete */\n @Method()\n async resetFilters() {\n this.filters = [];\n return this.filterStart();\n }\n\n /** Apply a filter on a column\n * @param filters - the filters to apply\n * @param additive - if true, will add the filters to any currently applied\n * @returns a promise which resolves when complete\n */\n @Method()\n async addFilters(filters: TableTypes.Filter[], additive: boolean = true) {\n if (!additive) this.filters = [];\n return this.filterStart(filters, additive);\n }\n\n // Private Logic\n\n // State\n\n @Element() host: HTMLNanoTableElement;\n private renderId = 'tbl-' + id++;\n private store: TableStores;\n private filters: TableTypes.Filter[] = [];\n private currentFilters = '';\n private currentSort = '';\n private tableEle: HTMLTableElement;\n private topAnchorEle: HTMLElement;\n\n // Blocks\n\n /** `tr` elements split into units - defined by `perPage`\n These are show / hidden for perf */\n @State() blocks: TableTypes.TBody[] = [];\n @State() activeBlocks: number[] = [0, 1, 2];\n @State() measureHeight = 0;\n\n private blockElements: HTMLTableSectionElement[];\n private blockIos: WeakMap<HTMLTableSectionElement, IntersectionObserver> =\n new WeakMap();\n private blockHeights: { blockIndex: number; height: number }[] = [];\n // uses the first 'tr' of an active block as our yard stick\n private set measureEle(el: HTMLTableSectionElement) {\n if (!el) return;\n this.measureHeight = el.getBoundingClientRect().height;\n this.unitHeight =\n el.querySelector('tr')?.getBoundingClientRect().height || this.unitHeight;\n }\n private unitHeight = 0;\n\n // Scroll / IO used for hiding / showing blocks\n\n private ignoreIO = true;\n private scrollParent: HTMLElement;\n private scrollSpeed: number;\n\n // Misc.\n\n private get isReady() {\n return this._isReady;\n }\n private set isReady(ready: boolean) {\n if (ready === this._isReady) return;\n this._isReady = ready;\n if (this.isReady) requestAnimationFrame(() => this.handleReady());\n }\n private _isReady = false;\n\n // Listeners\n\n @Listen('scroll', { target: 'window' })\n scrollListener() {\n // see explanation in `setupBlockIO`\n const speed = detectScrollSpeed();\n this.scrollSpeed = speed < 0 ? speed * -1 : speed;\n }\n\n // Logic\n\n private handleReady() {\n const hash = window.location.hash;\n if (hash.length > 1) {\n const idRow = document.querySelector(hash);\n if (idRow) {\n idRow.scrollIntoView();\n }\n }\n this.nanoTblReady.emit();\n }\n\n /**\n * Start a sort - can be cancelled by `preventDefault`\n * @param order - column order\n * @param column - column config object\n * @returns A promise\n */\n private sortStart = async (\n order: TableTypes.Order,\n column: TableTypes.Prop,\n element?: HTMLElement\n ) => {\n // did order change?\n if (this.currentSort === order + ':' + column) return;\n\n this.loading = true;\n const sortEvent = this.nanoTblBeforeSort.emit({ column: column, order });\n if (sortEvent.defaultPrevented) return;\n perMark('sort');\n this.currentSort = order + ':' + column;\n\n // doesn't make sense to leave user in place for a sort\n this.scrollToTop(element);\n\n if (this.customSortFn) {\n try {\n await this.customSortFn(column, order);\n this.sortComplete(order, column);\n } catch (e) {\n console.warn('custom sort failed', e);\n }\n return;\n }\n\n try {\n await storeSort(this.host, column, order);\n this.sortComplete(order, column);\n } catch (e) {\n console.warn('sort failed', e);\n this.currentSort = '';\n } finally {\n this.loading = false;\n }\n };\n\n /**\n * Complete a sort. Reflects the order to ui.\n * @param order - column order\n * @param column - column config object\n */\n private sortComplete(order: TableTypes.Order, column: TableTypes.Prop) {\n this.columns = this.columns.map((c) => {\n if (c.prop === column) return { ...c, order };\n return { ...c, order: null };\n });\n this.nanoTblAfterSort.emit({ column: column, order });\n perMark('sort', true);\n }\n\n private async searchStart() {\n this.loading = true;\n const sortEvent = this.nanoTblBeforeSearch.emit({ term: this.searchTerm });\n if (sortEvent.defaultPrevented) return;\n perMark('search');\n\n // doesn't make sense to leave user in place for a search\n this.scrollToTop();\n\n try {\n await storeSearch(this.host, this.searchTerm);\n this.nanoTblAfterSearch.emit({ term: this.searchTerm });\n perMark('search', true);\n } catch (e) {\n console.warn('search failed', e);\n } finally {\n this.loading = false;\n }\n }\n\n private async filterStart(\n filters?: TableTypes.Filter[],\n additive: boolean = true\n ) {\n if (filters) {\n if (additive) {\n this.filters = [\n ...this.filters.filter(\n (f) => !filters.find((ff) => ff.prop === f.prop)\n ),\n ...filters,\n ];\n } else {\n this.filters = filters;\n }\n }\n\n if (this.currentFilters === JSON.stringify(this.filters)) return;\n\n this.loading = true;\n const sortEvent = this.nanoTblBeforeFilter.emit({ filters: this.filters });\n if (sortEvent.defaultPrevented) return;\n perMark('filter');\n this.currentFilters = JSON.stringify(this.filters);\n\n // doesn't make sense to leave user in place for a search\n this.scrollToTop();\n\n if (this.customFilterFn) {\n try {\n await this.customFilterFn(this.filters);\n this.filterComplete();\n } catch (e) {\n console.warn('custom filter failed', e);\n this.currentFilters = '';\n }\n return;\n }\n\n try {\n await storeFilter(this.host, this.filters);\n this.filterComplete();\n perMark('search', true);\n } catch (e) {\n console.warn('filter failed', e);\n } finally {\n this.loading = false;\n }\n }\n\n private filterComplete() {\n this.columns = this.columns.map((c) => {\n const cFilter = this.filters.find((f) => f.prop === c.prop);\n if (cFilter) c.filter = cFilter.filter;\n return c;\n });\n this.nanoTblAfterFilter.emit({ filters: this.filters });\n perMark('filter', true);\n }\n\n /** Scrolls to the top immediately - used whilst sorting / filtering */\n private scrollToTop(element?: HTMLElement) {\n const scrollBehaviour = this.scrollParent.style?.scrollBehavior;\n const scrollX = this.scrollParent.scrollLeft;\n this.scrollParent.style.scrollBehavior = 'auto';\n\n if (this.topAnchorEle && !isInViewport(this.topAnchorEle, 0.1)) {\n this.host.scrollIntoView();\n }\n if (element) element.scrollIntoView({ block: 'start' });\n\n if (scrollX) this.scrollParent.scrollLeft = scrollX;\n\n if (scrollBehaviour)\n this.scrollParent.style.scrollBehavior = scrollBehaviour;\n }\n\n private setMeasureElement() {\n readTask(() => {\n this.measureEle = this.blockElements.find(\n (b) => !b?.classList?.contains(`${CSSNAMESPACE}__inactive`)\n );\n });\n }\n\n /**\n * Sets the initial height on tbody elements that are not active\n * These elements have no natural height - on account of all their rows being hidden\n * So we just estimate for now\n */\n private setInitialBlockDimension() {\n if (!this.blockElements.length) return;\n perMark('blockDims');\n\n const finishResizing: Promise<void> = new Promise((resolve) => {\n readTask(() => {\n this.setMeasureElement();\n\n // find the first active block\n if (!this.measureEle && !this.unitHeight) resolve();\n\n this.blockElements.forEach((el, i) => {\n if (!el || !el.classList?.contains(`${CSSNAMESPACE}__inactive`)) {\n if (i === this.blockElements.length - 1) resolve();\n return;\n }\n if (i === this.blockElements.length - 1) resolve();\n });\n });\n });\n\n // we're all finished.\n finishResizing.then(() => {\n perMark('blockDims', true);\n perMark('init', true);\n\n requestAnimationFrame(() => {\n this.isReady = true;\n });\n });\n }\n\n /** Apply initial columns settings */\n private async columnInit() {\n this.filters = this.columns\n .filter((c) => !!c.filter)\n .map((c) => {\n const { filter, prop } = c;\n return { filter, prop };\n });\n\n if (this.searchTerm) {\n await this.searchStart();\n }\n\n if (this.filters.length) {\n await this.filterStart();\n }\n // apply sort\n const col = this.columns.find((c) => !!c.order);\n if (!!col) {\n await this.sortStart(col.order, col.prop);\n }\n }\n\n /** Split up all incoming rows into 'blocks' split amongst tbody elements.\n * These can then be hidden / shown to improve performance.\n */\n private setBlocks() {\n perMark('setBlocks');\n this.activeBlocks = [0, 1, 2];\n this.ignoreIO = true;\n let i = 1;\n const l = this.store.data.state.rows.length;\n let rows: TableTypes.RowData[] = [];\n const blocks: TableTypes.TBody[] = [];\n this.blockHeights = [];\n\n // old skool loop for perf\n for (i; i <= l; i++) {\n rows.push(this.store.data.state.rows[i - 1]);\n\n if (i % this.perBlock === 0) {\n blocks.push({ rows, __uuid: cyrb53(rows.map((b) => b.__uuid).join()) });\n rows = [];\n }\n }\n if (rows.length)\n blocks.push({ rows, __uuid: cyrb53(rows.map((b) => b.__uuid).join()) });\n this.blocks = blocks;\n perMark('setBlocks', true);\n }\n\n /**\n * Returns a block render height.\n * If it's currently active - let auto do it's thing\n * If we've rendered it before - return that\n * If all else fails, let's guess it\n * @param blockIndex\n * @returns a height string (incl px)\n */\n private getBlockHeight(blockIndex: number): string {\n if (this.activeBlocks.includes(blockIndex)) return undefined;\n\n if (this.blockHeights.length) {\n const cachedBlockHeight = this.blockHeights.find(\n (bh) => bh.blockIndex === blockIndex\n );\n if (cachedBlockHeight) return cachedBlockHeight.height + 'px';\n }\n const blockLength = this.blocks[blockIndex].rows.length;\n if (blockLength === this.perBlock && this.measureHeight) {\n return this.measureHeight + 'px';\n }\n return this.unitHeight ? this.unitHeight * blockLength + 'px' : undefined;\n }\n\n /** cache the height for all active blocks for later renders */\n private setBlockHeight() {\n readTask(() => {\n this.activeBlocks.forEach((blockIndex) => {\n const el = this.blockElements[blockIndex];\n if (!el) return;\n\n const height = el.getBoundingClientRect().height;\n // cache height to our block heights array\n // for subsequent renders\n const fBhI = this.blockHeights.findIndex(\n (bh) => bh.blockIndex === blockIndex\n );\n if (fBhI > 0) {\n this.blockHeights[fBhI] = { height, blockIndex };\n } else this.blockHeights.push({ height, blockIndex });\n });\n });\n }\n\n /**\n * Attaches an intersection observer to each rendered tbody element\n * shows / hides intersecting blocks' and sets heights for when they're hidden\n * @param el - the tbody element to observe\n * @param blockIndex - the rendering tbody we're attaching the IO to\n */\n private setupBlockIO = (el: HTMLTableSectionElement, blockIndex: number) => {\n if (!el || this.blockIos.has(el)) return;\n\n const blockIo = new IntersectionObserver(\n ([ioEntry]) => {\n if (this.ignoreIO) return;\n\n if (ioEntry.isIntersecting) {\n // This is a bit gross\n // The Intersection Observer (IO) fires in an incorrect order when the scrolling is very fast\n // i.e. we go past blocks 3, 2, 1 and land on 0, but 3 can fire as 'intersecting' after 0.\n // To fix that, we check - for realsies - if the block IS visible.\n // BUT that test is not as sensitive to a block being visible via the IO,\n // so doesn't always fire if scrolling slowly\n // *sigh*\n readTask(() => {\n if (this.scrollSpeed < 100 || isInViewport(el, 0.01)) {\n this.activeBlocks = [\n blockIndex,\n blockIndex + 1,\n Math.max(0, blockIndex - 1),\n ];\n this.nanoTblBlockRendered.emit({\n block: blockIndex,\n totalBlocks: this.blockElements.length,\n });\n requestAnimationFrame(() => this.setBlockHeight());\n }\n });\n }\n },\n {\n threshold: [0],\n root:\n this.scrollParent === document.scrollingElement\n ? null\n : this.scrollParent,\n }\n );\n\n blockIo.observe(el);\n this.blockIos.set(el, blockIo);\n };\n\n /** Process slotted content */\n private processSlots() {\n // see if we have slot content\n if (!this.caption && !this.host.querySelector('[slot=\"caption\"]')) {\n console.error(\n 'For accessibility you must set a `title` prop or use the `caption` slot'\n );\n }\n }\n\n private handleColumnPinned = (positions: {\n [key in TableTypes.Position]: boolean;\n }) => {\n Object.entries(positions).forEach(([key, applied]) => {\n this.tableEle.classList.toggle(\n `${CSSNAMESPACE}__pinned--${key}`,\n applied\n );\n });\n };\n\n // Component lifecycle\n\n async componentWillLoad() {\n perMark('init');\n this.store = await generateStore(\n this.host,\n this.columns,\n this.scrollParent\n );\n await this.handleRowsChange();\n this.processSlots();\n this.setBlocks();\n this.store.data.onChange('rows', () => this.setBlocks());\n }\n\n connectedCallback(): void {\n readTask(() => (this.scrollParent = findScrollParent(this.host)));\n }\n\n componentDidLoad(): void {\n this.setInitialBlockDimension();\n }\n\n componentShouldUpdate(_newVal, _oldVal, stateName: keyof Table) {\n // stop double rendering - we use the store for rendering internally\n // the public facing props are kept in-sync with the store\n // but we don't want it to cause renders\n if (['rows', 'columns'].includes(stateName)) return false;\n }\n\n componentWillRender(): void | Promise<void> {\n perMark('render');\n }\n\n componentDidRender(): void {\n requestAnimationFrame(() => (this.ignoreIO = false));\n this.setMeasureElement();\n perMark('render', true);\n }\n\n render() {\n this.blockElements = [];\n\n return (\n <Host>\n <div\n class={`${CSSNAMESPACE}__top-anchor`}\n ref={(a) => (this.topAnchorEle = a)}\n >\n \n </div>\n <nano-resize-observe\n aria-labelledby={'table-caption-' + this.renderId}\n tabindex={this.type === 'grid' ? '0' : undefined}\n states=\"576w sm, 768w md\"\n >\n <div class={`${CSSNAMESPACE}__wrap`}>\n <nano-progress-bar\n indeterminate\n class={{\n [`${CSSNAMESPACE}__progress-bar`]: true,\n [`${CSSNAMESPACE}__progress-bar--show`]: this.loading,\n }}\n />\n <table\n role={this.type === 'grid' ? 'grid' : undefined}\n aria-readonly={this.type === 'table' ? 'true' : undefined}\n aria-rowcount={this.store.data.state.rows.length}\n aria-colcount={this.store.config.state.columns.length}\n class={`${CSSNAMESPACE}`}\n ref={(tbl) => (this.tableEle = tbl)}\n >\n <caption\n class={{\n [`${CSSNAMESPACE}__caption`]: true,\n [`${CSSNAMESPACE}__caption--hide`]: !this.showCaption,\n }}\n id={'table-caption-' + this.renderId}\n >\n <slot name=\"caption\">{this.caption}</slot>\n </caption>\n\n {/* Header */}\n <thead>\n <TableHeadFootRow\n rowRenderer={this.headRender}\n onColumnPinned={this.handleColumnPinned}\n >\n {this.store.config.state.columns.map((colModel) => [\n <TableColHead\n column={colModel}\n headRenderer={this.headRender}\n onColumnOrderClick={this.sortStart}\n onColumnPinned={this.handleColumnPinned}\n />,\n ])}\n </TableHeadFootRow>\n </thead>\n\n {this.loading &&\n !this.blocks.length &&\n [...Array(10).keys()].map((rowIndex) => (\n <tr>\n {this.store.config.state.columns.map(\n (_colModel, colIndex) => (\n <TableCell\n rowIndex={rowIndex}\n colIndex={colIndex}\n nestedContent={<nano-skeleton />}\n />\n )\n )}\n </tr>\n ))}\n\n {/* Body */}\n {this.blocks.map((block, blockIndex) => (\n <tbody\n key={block.__uuid}\n id={`tbody-${this.renderId}-${blockIndex}`}\n ref={(tb) => {\n this.blockElements.push(tb);\n this.setupBlockIO(tb, blockIndex);\n }}\n class={{\n [`${CSSNAMESPACE}__inactive`]:\n !this.activeBlocks.includes(blockIndex),\n [`${CSSNAMESPACE}__active`]:\n this.activeBlocks.includes(blockIndex),\n }}\n >\n {this.activeBlocks.includes(blockIndex) ? (\n block.rows.map((row, i) => {\n const rowIndex =\n blockIndex > 0 ? blockIndex * this.perBlock + i : i;\n return (\n <TableRow rowRenderer={this.rowRender} row={row}>\n {this.store.config.state.columns.map(\n (_colModel, colIndex) => (\n <TableCell\n rowIndex={rowIndex}\n colIndex={colIndex}\n />\n )\n )}\n </TableRow>\n );\n })\n ) : (\n <td\n colSpan={this.store.config.state.columns.length}\n style={{\n height: this.getBlockHeight(blockIndex),\n }}\n />\n )}\n </tbody>\n ))}\n\n {/* Footer */}\n {this.showFooter && (\n <tfoot>\n <TableHeadFootRow\n rowRenderer={this.footRender}\n onColumnPinned={this.handleColumnPinned}\n >\n {this.store.config.state.columns.map((colModel) => [\n <TableColHead\n column={colModel}\n headRenderer={this.footRender}\n onColumnPinned={this.handleColumnPinned}\n />,\n ])}\n </TableHeadFootRow>\n </tfoot>\n )}\n </table>\n\n {!!this.blocks.length && (\n <nano-spinner\n type=\"circle\"\n class={{\n [`${CSSNAMESPACE}__spinner`]: true,\n [`${CSSNAMESPACE}__spinner--show`]: this.loading,\n }}\n />\n )}\n </div>\n </nano-resize-observe>\n </Host>\n );\n }\n}\n"]}
|
@@ -1,5 +1,5 @@
|
|
1
1
|
/*!
|
2
2
|
* Web Components for Nanopore digital Web Apps
|
3
3
|
*/
|
4
|
-
import{c as t}from"./p-
|
5
|
-
//# sourceMappingURL=p-
|
4
|
+
import{c as t}from"./p-4c386a43.js";import"./p-1fe12320.js";import"./p-ee045579.js";import"./p-9746b0a5.js";import"./p-651b3264.js";const o="table.worker";const p="stencil.table.worker";const s=new URL("p-1fd13775.js",import.meta.url).href;const r=new Blob(['importScripts("'+s+'")'],{type:"text/javascript"});const e=URL.createObjectURL(r);const c=t(e,o,p);URL.revokeObjectURL(e);export{c as worker,p as workerMsgId,o as workerName,s as workerPath};
|
5
|
+
//# sourceMappingURL=p-619a1c8e.js.map
|
File without changes
|
@@ -0,0 +1,5 @@
|
|
1
|
+
/*!
|
2
|
+
* Web Components for Nanopore digital Web Apps
|
3
|
+
*/
|
4
|
+
import{r as t,c as i,d as e,w as s,h as n,i as a,a as o,g as r}from"./p-1fe12320.js";import{a as l}from"./p-a0b93616.js";import{c as h}from"./p-845ae77e.js";import{C as c}from"./p-e3860f00.js";import{d}from"./p-9746b0a5.js";import{d as p}from"./p-167b9165.js";import"./p-69a3e911.js";async function b(t,{body:i,...e}={}){const s={Accept:"application/json, text/plain, */*","Access-Control-Allow-Origin":"*","Content-Type":"application/json",Cache:"no-cache"};const n={method:i?"POST":"GET",credentials:"include",keepalive:true,mode:"cors",...e,headers:{...s,...e.headers}};if(i){n.body=JSON.stringify(i)}let a=setTimeout((()=>{}),0);if(window.AbortController){const t=new AbortController;const{timeout:i=500}=e;a=setTimeout((()=>t.abort()),i);n.signal=t.signal}const o=await fetch(t,n);clearTimeout(a);if(o.ok){return await o.json()}else{const t=await o.text();return new Error(t)}}const u=':host{box-sizing:border-box}*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}.global-nav{font-family:inherit;font-size:inherit;font-stretch:inherit;font-style:inherit;font-weight:inherit;letter-spacing:inherit;text-decoration:inherit;text-overflow:inherit;text-transform:inherit;text-align:inherit;white-space:inherit;color:inherit;z-index:var(--nano-layer-index-menubar, 10)}.global-nav button{background:none;color:inherit;border:none}.global-nav .icon-btn{position:relative;background:none;color:inherit;border:none;-ms-flex-item-align:normal;-ms-grid-row-align:normal;align-self:normal;padding:9px 7px;cursor:pointer;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.global-nav .icon-btn nano-icon{width:18px;height:18px}.global-nav ::slotted(nano-nav-item[slot=icon]){--padding-top:9px;--padding-bottom:9px;--padding-start:7px;--padding-end:7px;--display:flex;font-size:18px}.global-nav a{color:inherit;text-decoration:none;white-space:nowrap}.global-nav .nav-links_title{margin:8px 0 3px}.global-nav .nav-links ul{margin:0;padding:0}.global-nav .nav-links li{list-style:none}.global-nav .login-btn{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.global-nav .menu-btn{padding:9px var(--bar-item-spacing) 9px var(--bar-item-spacing)}.site-content{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-transition:min-height 0.2s ease;transition:min-height 0.2s ease;min-height:calc(100% - 61px);position:relative;z-index:auto;-webkit-box-align:stretch;-ms-flex-align:stretch;align-items:stretch}.mask{opacity:0;background:rgba(0, 0, 0, 0.3);position:fixed;inset-inline:0;inset-block-start:0;height:100vh;z-index:-1;-webkit-transition:opacity 0.2s ease, visibility 0.01s ease 0.2s, z-index 0.01s ease 0.2s, -webkit-transform 0.2s ease;transition:opacity 0.2s ease, visibility 0.01s ease 0.2s, z-index 0.01s ease 0.2s, -webkit-transform 0.2s ease;transition:transform 0.2s ease, opacity 0.2s ease, visibility 0.01s ease 0.2s, z-index 0.01s ease 0.2s;transition:transform 0.2s ease, opacity 0.2s ease, visibility 0.01s ease 0.2s, z-index 0.01s ease 0.2s, -webkit-transform 0.2s ease;visibility:hidden}.mask.open{opacity:1;-webkit-transition:z-index 0.01s ease, visibility 0.01s ease, opacity 0.2s ease 0.01s, -webkit-transform 0.2s ease 0.01s;transition:z-index 0.01s ease, visibility 0.01s ease, opacity 0.2s ease 0.01s, -webkit-transform 0.2s ease 0.01s;transition:z-index 0.01s ease, visibility 0.01s ease, transform 0.2s ease 0.01s, opacity 0.2s ease 0.01s;transition:z-index 0.01s ease, visibility 0.01s ease, transform 0.2s ease 0.01s, opacity 0.2s ease 0.01s, -webkit-transform 0.2s ease 0.01s;z-index:3;visibility:visible}.bars{color:var(--bar-text-color);z-index:var(--nano-layer-index-menubar, 10);position:relative;max-width:100%;min-width:100%;-webkit-box-shadow:none;box-shadow:none;-webkit-transition:0.2s ease box-shadow;transition:0.2s ease box-shadow}[stuck] .bars{-webkit-box-shadow:0 1px 25px 0 rgba(0, 0, 0, 0.15);box-shadow:0 1px 25px 0 rgba(0, 0, 0, 0.15)}.bars::before{content:"";width:100%;height:100%;z-index:-1;background:var(--bar-background);position:absolute}.main-bar{width:100%;padding-inline:0 var(--bar-item-spacing);padding-block:var(--bar-vertical-padding);display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;overflow-x:hidden}.main-bar:focus{outline:none}:host(.ready) .main-bar{overflow-x:visible}.main-bar>*,.main-bar ::slotted(*){-webkit-transition:opacity 0.2s ease;transition:opacity 0.2s ease}:host(:not(.ready)) .main-bar>*,:host(:not(.ready)) .main-bar ::slotted(*){opacity:0 !important}:host(.ready) .main-bar>*,:host(.ready) .main-bar ::slotted(*){opacity:1}:host(.resizing) .main-bar>*,:host(.resizing) .main-bar ::slotted(*){opacity:0 !important}.main-bar>*{-webkit-box-flex:0;-ms-flex:0 0 auto;flex:0 0 auto}.main-bar>* ::slotted(nano-nav-item[slot=icon]){-webkit-margin-start:11px;margin-inline-start:11px}.main-bar>* ::slotted(nano-nav-item),.main-bar>* nano-nav-item{--color-hover:var(--bar-color-focus);--secondary-bg-color:var(--bar-dropdown-bg);--secondary-color:var(--bar-dropdown-text);--bg-color-open:var(--bar-background);text-decoration:none !important}.main-bar .icon-btn{-webkit-margin-before:0;margin-block-start:0;-webkit-margin-after:0;margin-block-end:0;-webkit-margin-start:6px;margin-inline-start:6px}:host(.threshold-2) .main-bar .icon-btn{-webkit-margin-before:0;margin-block-start:0;-webkit-margin-after:0;margin-block-end:0;-webkit-margin-start:11px;margin-inline-start:11px}.main-bar .menu-btn.icon-btn{margin:0 !important;-webkit-border-end:1.5px solid var(--bar-color-shade);border-inline-end:1.5px solid var(--bar-color-shade)}.main-bar .logo{height:36px;width:200px;min-width:200px}:host(:not(.threshold-1)) .main-bar .logo{height:30px}.main-bar .logo-link{-webkit-margin-end:0;margin-inline-end:0;-webkit-margin-start:0;margin-inline-start:0;padding-inline:var(--bar-item-spacing);display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;border:none}.main-bar .nav-links{-webkit-box-flex:0;-ms-flex:0 0 auto;flex:0 0 auto;display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-pack:distribute;justify-content:space-around}.main-bar .nav-links ul{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-pack:distribute;justify-content:space-around}.main-bar .nav-links ::slotted(nano-nav-item),.main-bar .nav-links nano-nav-item{--padding-top:7px;--padding-bottom:7px;--padding-end:2px;--padding-start:2px;--margin:0 var(--bar-item-spacing)}.main-bar .nav-links--main{-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;letter-spacing:0.5px;font-weight:600;font-stretch:expanded;text-transform:uppercase;font-size:1.065em;-webkit-margin-end:auto;margin-inline-end:auto}.main-bar .nav-links--main ::slotted(nano-nav-item){--color:var(--bar-text-color);--padding-end:3px;--padding-start:0}.main-bar .nav-links--sub{--color:var(--color, #e2e2e2);-webkit-margin-start:6px;margin-inline-start:6px;-webkit-box-pack:end;-ms-flex-pack:end;justify-content:flex-end}.main-bar .login-btn{display:inline-block;border-radius:4px;background-color:var(--login-button-bg);color:var(--login-button-text);padding:3px 10px;position:relative;inset-inline-start:auto;inset-block-end:auto;margin-inline:11px 0}.main-bar .measure-ele{min-width:1px;display:block;margin:0;padding:0}.sticker-trigger{background:var(--bar-background);width:100%;z-index:calc(var(--nano-layer-index-menubar, 10) + 1);height:1px}.sticker-trigger~.sticker-trigger{display:none}.gn-menu{position:fixed;inset-block-start:0;inset-inline-start:0;z-index:-1;display:none;-webkit-transition:z-index 0.01s ease 0.2s;transition:z-index 0.01s ease 0.2s;height:100vh;width:100vw;overflow-y:auto;padding-block:4px}:host(.threshold-4) .gn-menu{position:absolute;width:calc(100vw - 20px)}.gn-menu.menu-full-screen{width:100vw !important}.gn-menu_wrap{max-width:92vw;width:335px;background:var(--menu-background);color:var(--menu-text-color);padding:var(--bar-vertical-padding) 0 0;-webkit-box-shadow:0 0 36px 0 rgba(0, 0, 0, 0.8);box-shadow:0 0 36px 0 rgba(0, 0, 0, 0.8);position:relative;pointer-events:all;-webkit-margin-after:36px;margin-block-end:36px;opacity:0;outline:none;-webkit-transition:opacity 0.2s ease, -webkit-transform 0.2s ease;transition:opacity 0.2s ease, -webkit-transform 0.2s ease;transition:transform 0.2s ease, opacity 0.2s ease;transition:transform 0.2s ease, opacity 0.2s ease, -webkit-transform 0.2s ease}.gn-menu_wrap.has-promotion{padding:var(--menu-padding) 0 0}.gn-menu.open{z-index:var(--nano-layer-index-dropdown, 300);-webkit-transition:z-index 0.01s ease;transition:z-index 0.01s ease}.gn-menu.open .gn-menu_wrap{opacity:1;-webkit-transform:translate3d(0, 0, 0) !important;transform:translate3d(0, 0, 0) !important;-webkit-transition:opacity 0.2s ease 0.01s, -webkit-transform 0.2s ease 0.01s;transition:opacity 0.2s ease 0.01s, -webkit-transform 0.2s ease 0.01s;transition:transform 0.2s ease 0.01s, opacity 0.2s ease 0.01s;transition:transform 0.2s ease 0.01s, opacity 0.2s ease 0.01s, -webkit-transform 0.2s ease 0.01s}.gn-menu_actions{-webkit-padding-end:calc(var(--menu-padding) / 2);padding-inline-end:calc(var(--menu-padding) / 2);display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between}.gn-menu_actions-counter{background:#d0021b;color:var(--menu-text-color);position:absolute;inset-block-end:4px;inset-inline:auto 0;font-size:9px;height:14px;line-height:14px;width:auto;min-width:14px;border-radius:50%;-webkit-box-sizing:border-box;box-sizing:border-box;text-align:center;text-indent:0}.gn-menu .content-wrap{position:relative;overflow:hidden;-webkit-transition:0.2s ease min-height;transition:0.2s ease min-height;min-height:190px}.gn-menu .content--sub{padding:var(--menu-padding) 0 var(--menu-padding) 7px}.gn-menu .menu-btn{-webkit-margin-end:auto;margin-inline-end:auto}.gn-menu .nav-links{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap}.gn-menu .nav-links ::slotted(nano-nav-item),.gn-menu .nav-links nano-nav-item{--icon-size:14px;--display:inline-block;--secondary-bg-color:#001a21;--padding-top:10px;--padding-bottom:10px;--padding-end:calc(var(--menu-padding) * 2);--padding-start:calc(var(--menu-padding) + 3px);--color:var(--menu-text-color);--color-hover:var(--menu-title-text);--bg-color-hover:transparent;--bg-color-focus:#002530;--focus-outline:none;width:100%}.gn-menu .nav-links .user-nav{--bg-color:var(--menu-user-panel-bg);--padding-top:9px;--padding-bottom:9px;font-weight:bold;margin:5px 0 0}.gn-menu .nav-links .user-nav ::slotted(nano-nav-item),.gn-menu .nav-links .user-nav nano-nav-item{font-weight:500;--bg-color:transparent}.gn-menu .nav-links .user-nav .content{padding:0;background-color:var(--menu-user-panel-bg)}.gn-menu .nav-links .user-nav .content--sub{padding-inline:var(--menu-padding)}.gn-menu .nav-links .user-nav .back-btn{-webkit-padding-start:var(--menu-padding);padding-inline-start:var(--menu-padding)}.gn-menu .nav-links_title{margin:0 var(--menu-padding) 4px;-webkit-border-after:1px solid var(--menu-hint-color);border-block-end:1px solid var(--menu-hint-color);-webkit-padding-after:8px;padding-block-end:8px;text-transform:uppercase;color:var(--menu-title-text);letter-spacing:1px;font-weight:700}.gn-menu .nav-links-wrap{margin:18px 0}.gn-menu .nav-links-wrap:last-child{-webkit-margin-after:0;margin-block-end:0}.gn-menu .nav-links .back-btn{-webkit-border-before:1px solid var(--menu-hint-color);border-block-start:1px solid var(--menu-hint-color);-webkit-border-after:1px solid var(--menu-hint-color);border-block-end:1px solid var(--menu-hint-color);display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;padding:10px 11px 10px 0;width:100%;font-size:12px;text-transform:uppercase;color:var(--menu-title-text);letter-spacing:1px;font-weight:700}.gn-menu .nav-links .back-btn nano-icon{-webkit-margin-end:10px;margin-inline-end:10px;font-size:12px;color:var(--menu-icon-color)}.gn-menu .nav-links--sub{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap}.gn-menu .nav-links--sub ::slotted(nano-nav-item),.gn-menu .nav-links--sub nano-nav-item{--border-bottom:none;--padding-end:var(--menu-padding);--padding-start:var(--menu-padding);--padding-top:8px;--padding-bottom:8px;margin:0;width:50%;line-height:1.8}.gn-menu .nav-links .content{padding:8px var(--menu-padding)}.gn-menu .login-btn{padding-inline:7px var(--menu-padding);padding-block:var(--menu-padding)}.gn-menu .login-btn nano-icon{-webkit-margin-start:10px;margin-inline-start:10px}.gn-menu .logout-btn{-webkit-box-pack:end;-ms-flex-pack:end;justify-content:flex-end}.gn-menu .logout-btn a{padding:0 5px}.search-btn::before{content:"";background-color:#0c5a71;height:9px;inset-inline:0 5px;inset-block-end:-20px;position:absolute;-webkit-transform:translateZ(0) scaleX(0);transform:translateZ(0) scaleX(0);-webkit-transform-origin:0;transform-origin:0;-webkit-transition:0.2s ease transform;transition:0.2s ease transform}.search-btn--open::before{-webkit-transform:translateZ(0) scaleX(1);transform:translateZ(0) scaleX(1);opacity:0.7}.search-bar{height:0;overflow:hidden;-webkit-transition:0.2s ease height;transition:0.2s ease height;padding:0 var(--bar-item-spacing);outline:none;max-width:45em;-webkit-margin-start:auto;margin-inline-start:auto;}.search-bar .search-widget{margin:0;overflow:inherit;max-width:none;max-height:none;min-width:auto;-webkit-padding-end:0;padding-inline-end:0}.search-bar .search-widget .search-icon--search{display:none}.search-bar .search-widget .search-input{--input-border-width:2px 0 0 0 !important}.search-bar .search-inputs{padding:0 0;margin:0 0}.search-bar .search-autocomplete{inset-block-start:100%;width:100%}.search-widget{-webkit-padding-end:var(--bar-item-spacing);padding-inline-end:var(--bar-item-spacing);-webkit-margin-start:var(--bar-item-spacing);margin-inline-start:var(--bar-item-spacing);-webkit-margin-end:auto;margin-inline-end:auto;position:relative;-webkit-box-flex:1;-ms-flex:1 1 auto;flex:1 1 auto;max-width:500px;min-width:350px;max-height:36px;inset-block-start:-1px}.search-inputs{display:-webkit-box;display:-ms-flexbox;display:flex;margin:0}.search-inputs input[type=submit]{display:none}.search-autocomplete{position:absolute;inset-block-start:calc(100% + 15px);width:calc(100% - var(--bar-item-spacing));inset-inline-start:0;background:white;border:2px solid var(--bar-color-tint);border-radius:0 0 5px 5px;color:#4a4a4a;-webkit-padding-before:calc(var(--bar-vertical-padding) / 2);padding-block-start:calc(var(--bar-vertical-padding) / 2);-webkit-padding-end:0;padding-inline-end:0;-webkit-padding-after:1px;padding-block-end:1px;-webkit-padding-start:0;padding-inline-start:0;z-index:1}.search-autocomplete-hit{padding-block:calc(var(--bar-vertical-padding) / 4);padding-inline:var(--bar-item-spacing);width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:block;text-align:start;line-height:1.5;cursor:pointer}.search-autocomplete-hit-scope{color:#a7b0b3;font-weight:600}.search-autocomplete-hit:hover,.search-autocomplete-hit:focus{background-color:#e4e6e8}.search-autocomplete-hit .search__highlight,.search-autocomplete-hit em{font-weight:bold;font-style:normal}.search-autocomplete-hit--no-result:hover,.search-autocomplete-hit--no-result:focus{background:none !important}.search-autocomplete-foot{margin:7px 0 0}.search-autocomplete-submit{background:none;border:none;-ms-flex-item-align:normal;-ms-grid-row-align:normal;align-self:normal;padding:9px var(--bar-item-spacing) !important;cursor:pointer;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;color:#007495;-webkit-box-pack:end;-ms-flex-pack:end;justify-content:flex-end;width:100%;text-decoration:underline;-webkit-border-before:1px solid #e8eaea;border-block-start:1px solid #e8eaea}.search-autocomplete-submit:hover,.search-autocomplete-submit:focus{background-color:#e4e6e8}nano-select.search-input{--input-border-width:0 0 2px 0;--input-text-color:var(--bar-text-color);--nano-input-border-color:rgb(103, 138, 154);--padding-end:var(--bar-item-spacing);--nano-input-border-color--focus:black;font-stretch:expanded;font-size:1.2em;-webkit-box-flex:0;-ms-flex:0 1 auto;flex:0 1 auto;width:auto;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;position:relative;inset-inline-start:1px;text-transform:uppercase}nano-select.search-input::after{content:"";inset-inline-end:0;inset-block:6px 6px;width:2px;background:#678a9a;position:absolute;z-index:1}:host(:not(.ready)) nano-select.search-input{overflow:hidden;max-height:1em}nano-select.search-input .down-arrow{font-size:0.65em}nano-input.search-input{--clear-btn-color:var(--bar-text-color);--nano-input-border-color:rgb(103, 138, 154);--input-border-width:0 0 2px 0;--placeholder-color:var(--bar-text-color);--input-text-color:var(--bar-text-color);--padding-start:21px;--nano-input-border-color--focus:black;font-size:1.2em;width:206px;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-flex:1;-ms-flex:1;flex:1}:host([dir=rtl]) nano-input.search-input{--input-border-radius:5px 0 0 5px}:host(:not(.ready)) nano-input.search-input{overflow:hidden;max-height:1em}nano-input.search-input .search-icon{background:none;padding:0 8px;display:none;font-size:0.9em}nano-input.search-input .search-icon--show{display:-webkit-box;display:-ms-flexbox;display:flex}nano-input.search-input .search-icon--loader{-webkit-animation:spin 1s linear infinite;animation:spin 1s linear infinite}@-webkit-keyframes spin{100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@keyframes spin{100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}nano-input.search-input .search-icon nano-icon{height:1.4em}.user-profile{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;-webkit-box-align:center;-ms-flex-align:center;align-items:center;padding:2em;background-color:var(--menu-user-profile-bg)}.user-profile .left{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.user-profile .avatar-container{position:relative}.user-profile .avatar-container img.avatar{border-radius:50px}.user-profile .avatar-container img.logo-small{position:absolute;height:30px;width:30px;inset-block-end:0;inset-inline-end:0;background-color:#27586e;border-radius:10px;padding:5px}.user-profile .user-details{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;margin:0 1.25em;color:white}.user-profile .user-details .name{font-size:1.25em}.user-profile .user-details .bio{margin:0.5em 0}.user-profile .user-details .kudos span{background-color:#81c7eb;color:#415958;padding:0.25em;border-radius:0.5em;font-weight:bold}.user-profile .chevron-right{font-size:1.5em;color:white}.user-links{position:relative}.user-links .icon-btn{-webkit-padding-end:0;padding-inline-end:0;font-weight:500}.user-links .icon-btn nano-icon{-webkit-margin-start:5px;margin-inline-start:5px;width:16px;height:16px;-webkit-transform-origin:center;transform-origin:center;-webkit-transition:color 0.2s ease, -webkit-transform 0.2s ease;transition:color 0.2s ease, -webkit-transform 0.2s ease;transition:transform 0.2s ease, color 0.2s ease;transition:transform 0.2s ease, color 0.2s ease, -webkit-transform 0.2s ease}.user-links .icon-btn.open nano-icon{-webkit-transform:rotate(180deg);transform:rotate(180deg);color:#007495}.user-links-panel{display:none;position:absolute;border-radius:4px 0 4px 4px;-webkit-box-shadow:0 1px 5px 0 rgba(0, 0, 0, 0.4);box-shadow:0 1px 5px 0 rgba(0, 0, 0, 0.4);background-color:#568c9d;opacity:0;-webkit-transform:translate3d(0, 30px, 0);transform:translate3d(0, 30px, 0);-webkit-transition:opacity 0.2s ease, -webkit-transform 0.2s ease;transition:opacity 0.2s ease, -webkit-transform 0.2s ease;transition:transform 0.2s ease, opacity 0.2s ease;transition:transform 0.2s ease, opacity 0.2s ease, -webkit-transform 0.2s ease;inset-inline-end:0;min-width:318px;z-index:2}.user-links-panel:focus{outline:none}.user-links-panel.show{opacity:1;-webkit-transform:translate3d(0, calc(var(--padding) + 1px), 0);transform:translate3d(0, calc(var(--padding) + 1px), 0)}.user-links-panel-content{padding:0 18px;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;color:white}.user-links-panel-content a{padding:11px 0;-webkit-border-after:#669dac 1px solid;border-block-end:#669dac 1px solid}.user-links-panel-content a:hover,.user-links-panel-content a:focus{color:#455556}.user-links-panel-content a:last-child{-webkit-border-after:none;border-block-end:none}.user-links-panel-foot{background-color:#aac5cd;border-radius:0 0 4px 4px;padding:var(--padding);color:#455556;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;font-weight:500;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between}.user-links-panel-foot a:hover{text-decoration:underline}.user-links-panel .user-profile{background-color:var(--bar-user-panel-bg)}:host{--bar-vertical-padding:21px;--bar-item-spacing:13px;--bar-background:white;--bar-text-color:#196c82;--bar-color-shade:rgb(19, 89, 111);--bar-color-tint:rgb(19, 89, 111);--bar-color-focus:#001a21;--bar-user-panel-bg:#016d86;--bar-dropdown-bg:#196c82;--bar-dropdown-text:white;--menu-background:#001a21;--menu-text-color:white;--menu-user-profile-bg:#001a21;--menu-user-panel-bg:#193037;--menu-padding:12px;--menu-hint-color:#33484d;--menu-title-text:#90c6e7;--menu-icon-color:white;--login-button-bg:#17bb75;--login-button-text:white;--padding:12px;--padding-top:var(--padding);--padding-end:var(--padding);--padding-bottom:var(--padding);--padding-start:var(--padding);display:block;position:relative;line-height:1.5;height:100%;font-size:0.9375em;font-size:clamp(0.77rem, 1vw, 0.9rem)}:host input,:host select,:host button{font-family:inherit;-webkit-appearance:none;-moz-appearance:none;appearance:none;font-size:inherit}';const m={about:0,main:1,login:2,search:3,icon:4};const g=class{constructor(e){t(this,e);this.nanoIsReady=i(this,"nanoIsReady",7);this.nanoSearchResult=i(this,"nanoSearchResult",7);this.nanoSearchError=i(this,"nanoSearchError",7);this.nanoSearchReset=i(this,"nanoSearchReset",7);this.currSize=0;this.thresholdsGoingUp=false;this.THRESHOLDLIMIT=Object.keys(m).length;this.autocompleteEles=[];this.currAIndex=-1;this.isLoggedIn=false;this.myAccData=null;this.aboutNavItms=[];this.siteNavItms=[];this.loggedInNavItms=[];this.setResizingState=(t=false)=>{if(typeof this.debounceSetResizingState==="undefined"){this.debounceSetResizingState=d(this.setResizingState,600)}if(t){this.isResizing=true;this.debounceSetResizingState()}else{this.isResizing=false;this.thresholdsGoingUp=false}};this.onMenuBtnKeyDown=t=>{switch(t.key){case"Enter":case" ":this.modalOpen?this.menuClose(t,true):this.menuOpen();break}};this.onMenuBtnClick=t=>{this.menuClose(t,true)};this.menuOpen=t=>{if(t)t.preventDefault();this.menuDiv.style.display="block";this.modalOpen=true;this.modalIsOpen=true;this.menuWrapDiv.addEventListener("focusout",this.menuClose);this.menuWrapDiv.focus({preventScroll:true});if(this.threshold<2||this.menuWrapDiv.scrollHeight>window.innerHeight){document.body.style.overflow="hidden";this.menuFullScreen=true}else document.body.style.overflowX="hidden"};this.onMenuHidden=()=>{this.menuDiv.removeEventListener("transitionend",this.onMenuHidden);this.menuWrapDiv.removeEventListener("focusout",this.menuClose);document.body.style.overflow="";this.menuDiv.style.display="none";this.modalIsOpen=false;this.menuFullScreen=false;setTimeout((()=>{if(document.activeElement===document.body&&this.menuBtn)this.mainBarDiv.focus({preventScroll:true})}),50)};this.menuClose=(t,i=false)=>{if(!i){const i=t;if(i&&i.relatedTarget&&h("#global-nav-menu",i.relatedTarget))return;if(i&&i.relatedTarget&&i.relatedTarget.closest("#global-nav-menu"))return;if(i&&i.relatedTarget&&i.relatedTarget.closest('[slot="promotion"]'))return;if(this.secondaryMenuOpen)return}this.modalOpen=false;this.menuDiv.addEventListener("transitionend",this.onMenuHidden)};this.subMenuClose=t=>{t.preventDefault();t.target.closest("nano-nav-item").open=false};this.onUserBtnClick=t=>{t.preventDefault();this.userMenuOpen=!this.userMenuOpen};this.onUserBtnKeyDown=t=>{switch(t.key){case"Enter":case" ":this.userMenuOpen=!this.userMenuOpen;break}};this.onUserMenuBlur=t=>{if(!t.relatedTarget){this.userMenuOpen=false;return}if(!!t.relatedTarget.closest(".user-links-panel"))return false;this.userMenuOpen=false};this.onSearchBtnClick=t=>{t.preventDefault();if(!this.searchBarShown)this.searchbarShow();else this.searchbarHide()};this.onSearchBtnKeyDown=t=>{switch(t.key){case"Enter":case" ":this.searchBarShown?this.searchbarHide():this.searchbarShow();break}};this.onSearchBarShown=()=>{this.searchBarEl.removeEventListener("transitionend",this.onSearchBarShown);if(this.searchInput)this.searchInput.setFocus();this.searchBarEl.style.overflow="visible"};this.searchbarHide=t=>{if(t&&t.relatedTarget&&t.relatedTarget.closest("#global-nav-search-bar"))return;this.showAutocomplete=false;if(this.searchValInternal.length&&t)return;this.searchBarEl.addEventListener("transitionend",this.onSearchBarHidden);this.searchBarEl.style.overflow="hidden";this.searchBarEl.style.height="0px"};this.onSearchBarHidden=()=>{this.searchBarEl.removeEventListener("transitionend",this.onSearchBarHidden);this.searchBarEl.style.display="none";this.searchBarShown=false};this.onSearchInput=t=>{this.searchValInternal=this.searchInput.value;if(!this.isSearchValSet()){this.searchLoading=false;return}if(t.detail.type==="input"){this.showAutocomplete=false;this.searchLoading=true}};this.onSearchChange=async t=>{this.searchValInternal=this.searchValue=t?t.detail.value:this.searchValInternal;this.showAutocomplete=false;this.autocompleteResults=null;if(!this.isSearchValSet()){if(!this.searchValInternal.length){this.nanoSearchReset.emit()}this.searchLoading=false;return}if(!this.currentIndex)this.currentSelectedIndex();try{this.autocompleteResults=this.processSearchResults(await this.currentIndex.alogliaIndex.search(this.searchValInternal,{attributesToSnippet:["body:5","title:8"],hitsPerPage:5,filters:"created > "+Math.floor((Date.now()-631152e5)/1e3)}))}catch(t){console.error(t)}this.scopeSearch=null;this.scopeSearch=await this.onSearchSubmit(null,false);this.searchLoading=false;this.showAutocompleteResults()};this.onSearchSubmit=async(t,i=true)=>{if(t)t.preventDefault();if(!this.isSearchValSet())return;this.searchLoading=true;this.algoliaSearchResults=null;if(!this.currentIndex)this.currentSelectedIndex();const e=this.internalSearchIndeces.map((t=>({indexName:t.index,query:this.searchValInternal,facets:t.filters,hitsPerPage:10,filters:"created > "+Math.floor((Date.now()-631152e5)/1e3)})));try{this.algoliaSearchResults=this.processSearchResults(await this.algoliaClient.multipleQueries(e))}catch(t){this.nanoSearchError.emit(t)}this.searchLoading=false;if(!this.algoliaSearchResults)return;this.algoliaSearchResults.results.map(((t,i)=>{t.indexName=this.internalSearchIndeces[i].name;t.selected=this.currentIndex.name===this.internalSearchIndeces[i].name;t.domain=this.currentIndex.domain||null;t.domains=this.myAccData.domains||null;t.allGroup=!!this.internalSearchIndeces[i].allGroup;t.filters=this.internalSearchIndeces[i].filters}));if(i){this.nanoSearchResult.emit({results:this.algoliaSearchResults.results,client:{apiKey:this.searchApiKey,appId:this.searchAppId}});this.showAutocomplete=false}return this.algoliaSearchResults};this.onSearchIndexChange=async t=>{const i=t;let e=t;if(!this.currentIndex)this.currentSelectedIndex();if(i.detail&&i.detail.value.length)e=i.detail.value;if(!e||!e.length)return;if(this.currentIndex.index===e)return;const s=this.internalSearchIndeces.find((t=>t.index===e));if(!s||!s.alogliaIndex)return;this.searchIndex=s.index;if(this.isSearchValSet())await this.onSearchChange()};this.switchIndexSubmit=async t=>{if(this.isSearchValSet()){await this.onSearchIndexChange(t);this.onSearchSubmit()}else this.onSearchIndexChange(t)};this.onAutocompleteBlur=t=>{if(!this.showAutocomplete||!this.autocompleteResults)return;if(t&&t.target&&t.target.closest(".search-widget"))return;this.showAutocomplete=false};this.showAutocompleteResults=()=>{if(!this.autocompleteResults||!this.autocompleteResults.hits)return;this.showAutocomplete=true};this.onAutocompleteInteract=t=>{if(!this.showAutocomplete||!this.autocompleteResults)return;let i=this.currAIndex;switch(t.key){case"Tab":setTimeout((()=>{if(!this.el.shadowRoot.activeElement||!this.el.shadowRoot.activeElement.closest(".search-widget")){this.showAutocomplete=false;return}else{const t=this.autocompleteEles.find(((t,i)=>{if(t===this.el.shadowRoot.activeElement){this.currAIndex=i;return true}}));if(t)this.setActiveElement(t);else this.currAIndex=-1}}));break;case"ArrowDown":case"ArrowUp":if(t.key==="ArrowDown")i++;else if(t.key==="ArrowUp")i--;const e=this.autocompleteEles[i];if(e||i<0||i>this.autocompleteEles.length-1)t.preventDefault();if(e){this.setActiveElement(e);this.currAIndex=i}else if(i<0){this.searchInput.setFocus();this.currAIndex=-1}break;case"Enter":case" ":if(this.autocompleteEles[this.currAIndex]){this.autocompleteEles[this.currAIndex].click()}break}};this.userProfileUrl="";this.hasLoggedinSlot=false;this.hasSiteSlot=false;this.hasPromotionSlot=false;this.aboutSlotLen=0;this.iconSlotLen=0;this.mainSlotLen=0;this.overflowSlotLen=0;this.searchSlotLen=0;this.internalSearchIndeces=[];this.thresholdReady=false;this.remoteDataReady=false;this.ready=false;this.isResizing=false;this.intersectRatio=undefined;this.threshold=this.THRESHOLDLIMIT;this.modalOpen=false;this.modalIsOpen=false;this.searchBarShown=false;this.scrollingUp=true;this.searchLoading=false;this.showAutocomplete=false;this.secondaryMenuOpen=false;this.userMenuOpen=false;this.menuFullScreen=false;this.searchValInternal="";this.env="prod";this.ssoDataUrl=undefined;this.ssoRedirect=encodeURIComponent(window.location.href);this.getMyAccountData=true;this.activeMyAccountSections=null;this.showSearch=true;this.showLogo=true;this.logoUrl=location.protocol+"//"+location.host;this.searchIndeces=[];this.myAccountUser=null;this.searchAppId=undefined;this.searchApiKey=undefined;this.searchValue="";this.searchIndex="all_prod_en";this.cartCount=0;this.msgCount=0;this.cartUrl=null;this.msgUrl=null}async submitSearch(){this.onSearchSubmit();this.showAutocomplete=false;return}async getMyAccData(){switch(this.env){case"prod":this.userProfileUrl="https://community.nanoporetech.com/profile/me";case"local":case"dev":case"test":default:this.userProfileUrl="https://community-test.nanoporetech.com/profile/me";break}if(!this.getMyAccountData||this.myAccData){this.remoteDataReady=true;return}let t=this.ssoDataUrl;if(!t){switch(this.env){case"dev":t="https://myaccount-dev.nanoporetech.com/";break;case"test":t="https://myaccount-test.nanoporetech.com/";break;default:t="https://myaccount.nanoporetech.com/";break}}const i={timeout:5e3};try{if(this.env==="local"){this.myAccData=await import("./p-2155fc2c.js")}else{this.myAccData=await b(t+"nav_bar_data.json",i)}if(this.myAccData.user.id){this.isLoggedIn=true;this.myAccountUser=this.myAccData.user}this.processMyAccLinks();this.processMyAccData();setTimeout((()=>this.remoteDataReady=true),300)}catch(t){console.error(t);this.remoteDataReady=true}}currentSelectedIndex(){if(!this.internalSearchIndeces.length){return}const t=this.internalSearchIndeces.find((t=>t.index===this.searchIndex));if(!t){this.currentIndex=this.internalSearchIndeces[0];console.error("index not found");return}this.currentIndex=t;return t}changeInternalSearchVal(){if(this.searchValInternal!==this.searchValue)this.searchValue=this.searchValInternal}initAlgoliaClient(){if(!this.searchAppId||!this.searchApiKey)return;this.algoliaClient=l(this.searchAppId,this.searchApiKey);this.addAlgoliaIndeces()}addIndeces(){this.internalSearchIndeces=[...this.internalSearchIndeces,...this.searchIndeces]}addAlgoliaIndeces(){if(!this.algoliaClient||!this.internalSearchIndeces.length)return;this.internalSearchIndeces.forEach((t=>{t.alogliaIndex=this.algoliaClient.initIndex(t.index)}));if(!this.searchIndex)this.searchIndex=this.internalSearchIndeces[0].index}thresholdChange(t,i){if(t>i){this.thresholdsGoingUp=true;this.setResizingState(true)}}ratioChange(){if(this.intersectRatio<1&&this.threshold>0){if(this.thresholdsGoingUp)this.setResizingState(true);this.threshold--;setTimeout((()=>this.ratioChange()),500)}else{this.thresholdReady=true;this.siteContent.style.minHeight=`calc(100% - ${this.barsDiv.clientHeight+1}px)`;let t,i;e((()=>{t=[...Array.from(this.el.querySelectorAll('nano-nav-item[slot="site"]')),...Array.from(this.el.querySelectorAll('nano-nav-item[slot="overflow"]'))];i=[];if(this.threshold<this.THRESHOLDLIMIT-m.icon)t.push(...Array.from(this.el.querySelectorAll('nano-nav-item[slot="icon"]')));else i.push(...Array.from(this.el.querySelectorAll('nano-nav-item[slot="icon"]')));if(this.threshold<this.THRESHOLDLIMIT-m.login)t.push(...Array.from(this.el.querySelectorAll('nano-nav-item[slot="loggedin"]')));else i.push(...Array.from(this.el.querySelectorAll('nano-nav-item[slot="loggedin"]')));if(this.threshold<this.THRESHOLDLIMIT-m.main)t.push(...Array.from(this.el.querySelectorAll('nano-nav-item[slot="main"]')));else i.push(...Array.from(this.el.querySelectorAll('nano-nav-item[slot="main"]')));if(this.threshold<this.THRESHOLDLIMIT-m.about)t.push(...Array.from(this.el.querySelectorAll('nano-nav-item[slot="about"]')));else i.push(...Array.from(this.el.querySelectorAll('nano-nav-item[slot="about"]')))}));s((()=>{t.forEach((t=>{t.classList.add("nano-global-nav-menu");t.classList.remove("nano-global-nav-bar")}));i.forEach((t=>{t.classList.remove("nano-global-nav-menu");t.classList.add("nano-global-nav-bar")}))}))}}assessReady(){if(this.thresholdReady&&this.remoteDataReady){this.ready=true}}remoteReady(){this.attachIO()}isReady(){this.nanoIsReady.emit()}setupAutocompleteBlur(){if(this.showAutocomplete){this.el.shadowRoot.addEventListener("click",this.onAutocompleteBlur)}else{this.el.shadowRoot.removeEventListener("click",this.onAutocompleteBlur)}}slotChange(){this.threshold=this.THRESHOLDLIMIT}thresholdClasses(){const t=[];let i=0;for(i;i<this.threshold;i++)t.push("threshold-"+(i+1));return t}onWindowResize(){if(this.threshold<this.THRESHOLDLIMIT&&window.innerWidth>this.currSize){this.threshold=this.THRESHOLDLIMIT}this.currSize=window.innerWidth;this.searchBarShown=false}secondaryOpen(t){if(!t.detail.secondaryMenu)return;t.stopPropagation();this.secondaryMenuOpen=true;this.menuContentDiv.style.minHeight=t.detail.secondaryMenu.scrollHeight+"px"}secondaryClose(t){if(!t.detail.secondaryMenu)return;t.stopPropagation();this.secondaryMenuOpen=false;this.menuContentDiv.style.minHeight=""}async handleUserMenu(){await p(this.userLinkPanel,"show",this.userMenuOpen);if(this.userMenuOpen){this.userLinkPanel.focus();this.userLinkPanel.addEventListener("focusout",this.onUserMenuBlur)}else{this.userLinkPanel.removeEventListener("focusout",this.onUserMenuBlur);this.el.focus()}}searchbarShow(){this.searchBarShown=true;this.searchBarEl.addEventListener("transitionend",this.onSearchBarShown);this.searchBarEl.style.display="block";setTimeout((()=>{this.searchBarEl.style.height=this.searchBarEl.querySelector(".search-widget").scrollHeight+"px"}),50)}autocompleteSnippet(t){const i=["title"];if(t._snippetResult){const e=i.find((i=>t._snippetResult[i]&&t._snippetResult[i].matchLevel!=="none"));if(e){if(e!=="title")return(t.title.length>15?t.title.substring(0,15)+" ...":t.title)+" "+t._snippetResult[e].value;else return t._snippetResult["title"].value}}return t.title}isSearchValSet(){if(this.searchValInternal.length<3)return false;return true}resetHitFocus(){this.currAIndex=-1}setActiveElement(t){this.autocompleteEles.map((t=>t.setAttribute("aria-selected","false")));t.focus({preventScroll:true});t.setAttribute("aria-selected","true")}assessSlottedContent(){e((()=>{this.hasSiteSlot=!!this.el.querySelectorAll('[slot="site"]').length;this.hasLoggedinSlot=!!this.el.querySelectorAll('[slot="loggedin"]').length;this.hasPromotionSlot=!!this.el.querySelectorAll('[slot="promotion"]').length;this.aboutSlotLen=this.el.querySelectorAll('[slot="about"]').length;this.iconSlotLen=this.el.querySelectorAll('[slot="icon"]').length;this.mainSlotLen=this.el.querySelectorAll('[slot="main"]').length;this.overflowSlotLen=this.el.querySelectorAll('[slot="overflow"]').length;this.searchSlotLen=this.el.querySelectorAll('[slot="search"]').length}))}attachIO(){if(this.io)return;const t=this.el.shadowRoot.querySelector(".global-nav .main-bar");if(typeof window!=="undefined"&&window.IntersectionObserver&&!!t){const i=this.io=new window.IntersectionObserver((t=>{this.intersectRatio=t.slice(-1)[0].intersectionRatio}),{root:t,threshold:1});i.observe(t.querySelector(".measure-ele"))}}componentDidLoad(){{this.debounceResize=d(this.onWindowResize.bind(this),300);window.addEventListener("resize",this.debounceResize);this.currSize=window.innerWidth}this.initAlgoliaClient();this.addAlgoliaIndeces();if(this.remoteDataReady)this.attachIO()}componentWillLoad(){c.init(this,["searchIndex","searchValue"],"url-hash","gns");if(typeof window!=="undefined"&&window.MutationObserver){const t=this.mo=new MutationObserver((()=>{this.assessSlottedContent()}));t.observe(this.el,{childList:true,subtree:false})}this.assessSlottedContent()}disconnectedCallback(){if(this.io){this.io.disconnect();this.io=undefined}if(this.mo){this.mo.disconnect();this.mo=undefined}window.removeEventListener("resize",this.debounceResize)}async connectedCallback(){this.getMyAccData()}autocompleteList(){let t;if(this.showAutocomplete&&this.scrollingUp){let i=0;let e=0;const s=(t,i)=>i.index!==this.currentIndex.index?t+i.hits.length:t;const a=(t,i)=>i.index===this.currentIndex.index?t+i.hits.length:t;if(this.scopeSearch){e=this.scopeSearch.results.reduce(s,0);i=this.scopeSearch.results.reduce(a,0)}if(this.autocompleteResults&&this.autocompleteResults.hits.length||e&&!i){let e=0;t=n("div",null,!i&&n("div",{class:"search-autocomplete-hit search-autocomplete-hit--no-result"},"No results matching '",this.searchValInternal,"' were found in"," ",n("strong",null,this.currentIndex.name),". Try another phrase."),this.autocompleteResults&&[this.autocompleteResults.hits.map(((t,i)=>n("a",{role:"option",ref:t=>this.autocompleteEles.push(t),tabindex:"-1",id:"autocomplete-hit-"+i,href:t.url,class:"search-autocomplete-hit",innerHTML:this.autocompleteSnippet(t)})))],(!i||this.currentIndex.allGroup)&&this.scopeSearch&&this.scopeSearch.results&&[this.scopeSearch.results.map(((t,i)=>{if(!t.hits.length||t.index===this.currentIndex.index||e>1)return;e++;return n("button",{role:"option",ref:t=>this.autocompleteEles.push(t),tabindex:"-1",id:"autocomplete-scope-"+i,class:"search-autocomplete-hit",onClick:()=>this.switchIndexSubmit(t.index),onMouseDown:()=>this.switchIndexSubmit(t.index)},'"',this.searchValInternal,'"'," ",n("div",{class:"search-autocomplete-hit-scope"},"in ",t.indexName))}))],!!i&&n("div",{class:"search-autocomplete-foot"},n("button",{role:"option",class:"search-autocomplete-submit",ref:t=>this.autocompleteEles.push(t),id:"autocomplete-foot",onClick:this.onSearchSubmit,onMouseDown:this.onSearchSubmit},"View all results")))}else if(!i){t=n("div",{class:"search-autocomplete-hit search-autocomplete-hit--no-result"},"No results matching '",this.searchValInternal,"' were found. Try another phrase.")}}return n("div",{class:"search-autocomplete",role:"listbox",id:"autocomplete-results","aria-expanded":this.showAutocomplete?"true":"false",hidden:!this.showAutocomplete,onKeyDown:this.onAutocompleteInteract},t)}searchWidget(){return[n("form",{class:"search-inputs",onSubmit:this.onSearchSubmit,id:"global-nav-search"},n("nano-select",{class:"search-input",label:"Which area of content would you like to search?",hideLabel:true,showInlineError:false,value:this.searchIndex,onNanoChange:this.onSearchIndexChange,mask:true},this.internalSearchIndeces.map((t=>n("nano-option",{selected:t.index===this.searchIndex,value:t.index},t.name||t.index)))),n("nano-input",{class:"search-input",label:"What would you like to search for?","aria-label":"What would you like to search for?",hideLabel:true,showInlineError:false,"clear-input":true,placeholder:"Search Nanopore",type:"text",ref:t=>this.searchInput=t,onNanoChange:this.onSearchChange,onNanoInput:this.onSearchInput,onKeyDown:this.onAutocompleteInteract,debounce:500,"aria-autocomplete":"list","aria-activedescendant":this.autocompleteEles[this.currAIndex]?this.autocompleteEles[this.currAIndex].id:false,"aria-controls":"autocomplete-results",onNanoFocus:this.showAutocompleteResults,value:this.searchValue,role:"textbox"},n("button",{class:{"search-icon":true,"search-icon--search":true,"search-icon--show":!this.searchValInternal.length},slot:"end",onMouseDown:t=>{this.searchValInternal=this.searchInput.value;this.onSearchSubmit(t,true)}},n("nano-icon",{name:"light/search"})),n("span",{class:{"search-icon":true,"search-icon--loader":true,"search-icon--show":this.searchLoading},slot:"end"},n("nano-icon",{name:"light/spinner-third"}))),n("input",{type:"submit"}))]}render(){this.autocompleteEles=[];const t=this.el.ownerDocument.dir==="rtl";const i=this.searchWidget();i.push(this.autocompleteList());return n(o,{class:{[this.thresholdClasses().join(" ")]:true,ready:this.ready,"search-bar-shown":this.searchBarShown&&this.scrollingUp,"search-auto-complete-shown":this.showAutocomplete&&this.scrollingUp,"modal-open":this.modalIsOpen,resizing:this.isResizing},dir:t?"rtl":null},n("div",{class:{"global-nav":true,"scrolling-down":!this.scrollingUp}},n("nav",{id:"global-nav-menu",class:{"gn-menu":true,open:this.modalOpen,"has-promotion":this.hasPromotionSlot,"menu-full-screen":this.menuFullScreen,"secondary-open":this.secondaryMenuOpen},"aria-expanded":this.modalOpen?"true":"false",ref:t=>this.menuDiv=t},n("div",{class:"gn-menu_wrap",ref:t=>this.menuWrapDiv=t,tabindex:"-1"},n("div",{class:"gn-menu_actions"},n("button",{class:"menu-btn icon-btn icon-btn",onMouseDown:this.onMenuBtnClick,onKeyDown:this.onMenuBtnKeyDown},this.threshold<this.THRESHOLDLIMIT-3&&n("nano-icon",{name:"light/times","aria-label":"close menu"}),this.threshold>=this.THRESHOLDLIMIT-3&&n("nano-icon",{name:"light/bars","aria-label":"close menu"})),this.threshold<this.THRESHOLDLIMIT-m.icon&&[!!this.iconSlotLen&&n("slot",{name:"icon"}),this.myAccData&&(!this.activeMyAccountSections||this.activeMyAccountSections.includes("icons"))&&[this.msgUrl&&n("a",{href:this.msgUrl,class:"icon-btn"},n("nano-icon",{name:"light/bell"}),this.msgCount>0&&n("span",{class:"gn-menu_actions-counter"},this.msgCount)),this.cartUrl&&n("a",{href:this.cartUrl,class:"icon-btn"},n("nano-icon",{name:"light/shopping-cart"}),this.cartCount>0&&n("span",{class:"gn-menu_actions-counter"},this.cartCount))]],this.myAccData&&this.myAccData.urls.login&&n("a",{href:this.myAccData.urls.login+this.ssoRedirect,class:"login-btn"},"Login / Register"," ",n("nano-icon",{name:"solid/chevron-right"}))),n("div",{class:"content-wrap",ref:t=>this.menuContentDiv=t},n("div",{class:"content"},n("nav",{class:"nav-links nav-links--main"},n("slot",{name:"overflow"}),this.threshold<this.THRESHOLDLIMIT-m.main&&!!this.mainSlotLen&&n("slot",{name:"main"})),((!!this.aboutSlotLen||!!this.aboutNavItms.length)&&this.hasSiteSlot||!!this.siteNavItms.length)&&n("div",null,(!!this.aboutSlotLen||!!this.aboutNavItms.length)&&[(this.threshold>=this.THRESHOLDLIMIT-(m.about+1)||this.mainSlotLen<2)&&this.overflowSlotLen<2&&n("div",{class:"nav-links-wrap"},!!this.aboutNavItms.length&&n("h4",{class:"nav-links_title"},"About"),n("nav",{class:"nav-links nav-links--sub","aria-label":"About the company links"},n("slot",{name:"about"}),this.aboutNavItms.map((t=>n("nano-nav-item",{class:"nano-global-nav nano-global-nav-menu"},n("a",{href:t.address,target:t.target},t.title)))))),(this.threshold<this.THRESHOLDLIMIT-(m.about+1)&&this.mainSlotLen>=2||this.overflowSlotLen>=2)&&n("nav",{class:"nav-links","aria-label":"About the company links"},!this.aboutNavItms.length&&n("slot",{name:"about"}),!!this.aboutNavItms.length&&n("nano-nav-item",{class:"nano-global-nav nano-global-nav-menu"},"Company",n("nano-icon",{slot:"icon-end",name:"solid/chevron-right"}),n("div",{slot:"secondary"},n("div",{class:"content"},n("button",{class:"back-btn",onClick:this.subMenuClose},n("nano-icon",{slot:"icon-end",name:"solid/chevron-left","aria-label":"go back"}),"Company"),n("slot",{name:"about"}),n("div",{class:"content--sub"},this.aboutNavItms.map((t=>n("nano-nav-item",{class:"nano-global-nav nano-global-nav-menu"},n("a",{href:t.address,target:t.target},t.title)))))))))],(this.hasSiteSlot||!!this.siteNavItms.length)&&[(this.threshold>=this.THRESHOLDLIMIT-2||this.mainSlotLen<2)&&this.overflowSlotLen<2&&n("div",{class:"nav-links-wrap"},n("h4",{class:"nav-links_title"},"Sites"),n("nav",{class:"nav-links nav-links--sub","aria-label":"Different company site links"},n("slot",{name:"site"}),this.siteNavItms.map((t=>n("nano-nav-item",{class:"nano-global-nav nano-global-nav-menu"},n("a",{href:t.address,target:t.target},t.title)))))),(this.threshold<this.THRESHOLDLIMIT-2&&this.mainSlotLen>=2||this.overflowSlotLen>=2)&&n("nav",{class:"nav-links","aria-label":"Different company site links"},n("nano-nav-item",{class:"nano-global-nav nano-global-nav-menu"},"Sites",n("nano-icon",{slot:"icon-end",name:"solid/chevron-right"}),n("div",{slot:"secondary"},n("div",{class:"content"},n("button",{class:"back-btn",onClick:this.subMenuClose},n("nano-icon",{slot:"icon-end",name:"solid/chevron-left","aria-label":"go back"}),"Sites"),n("div",{class:"content--sub"},n("slot",{name:"site"}),this.siteNavItms.map((t=>n("nano-nav-item",{class:"nano-global-nav nano-global-nav-menu"},n("a",{href:t.address,target:t.target},t.title)))))))))])),this.isLoggedIn&&this.threshold<this.THRESHOLDLIMIT-m.login&&(this.loggedInNavItms.length||this.hasLoggedinSlot)&&n("nav",{class:"nav-links","aria-label":"Your user account links"},n("nano-nav-item",{class:"nano-global-nav user-nav nano-global-nav-menu"},this.myAccountUser.name,n("nano-icon",{slot:"icon-end",name:"solid/chevron-right"}),n("div",{slot:"secondary"},n("div",{class:"content"},n("button",{class:"back-btn",onClick:this.subMenuClose},n("nano-icon",{slot:"icon-end",name:"solid/chevron-left","aria-label":"go back"}),this.myAccountUser.name),!!this.myAccountUser?.small_avatar_url&&n("nano-global-nav-user-profile",{myAccountUser:this.myAccountUser,userProfileUrl:this.userProfileUrl}),n("div",{class:"content--sub"},n("slot",{name:"loggedin"}),this.loggedInNavItms.map((t=>n("nano-nav-item",{class:"nano-global-nav nano-global-nav-menu"},n("a",{href:t.address,target:t.target},t.title)))),n("nano-nav-item",{class:"nano-global-nav nano-global-nav-menu"},n("a",{href:this.myAccData.urls.forgot_password+this.ssoRedirect},"Change Password"))))))),n("slot",{name:"promotion"}),this.myAccData&&this.myAccData.urls.logout&&n("div",{class:"login-btn logout-btn"},n("a",{href:this.myAccData.urls.logout+this.ssoRedirect},"Logout"))))),n("nano-sticker",{"auto-resize":"false","break-point-max":"800",quietMode:{h:600,w:800}},n("div",{class:"bars",ref:t=>this.barsDiv=t},n("nav",{class:"main-bar","aria-label":"Main site navigation",tabindex:"-1",ref:t=>this.mainBarDiv=t},(this.hasPromotionSlot||!!this.overflowSlotLen||(this.myAccData||!!this.iconSlotLen)&&this.threshold<this.THRESHOLDLIMIT-m.icon||this.isLoggedIn&&(!!this.loggedInNavItms.length||this.hasLoggedinSlot)&&this.threshold<this.THRESHOLDLIMIT-m.login||!!this.mainSlotLen&&this.threshold<this.THRESHOLDLIMIT-m.main||(!!this.aboutSlotLen||!!this.aboutNavItms.length)&&this.threshold<this.THRESHOLDLIMIT-m.about||this.hasSiteSlot||!!this.siteNavItms.length)&&n("button",{class:"menu-btn icon-btn",onMouseDown:this.menuOpen,onKeyDown:this.onMenuBtnKeyDown,"aria-expanded":this.modalOpen?"true":"false","aria-controls":"global-nav-menu",ref:t=>this.menuBtn=t},n("nano-icon",{name:"light/bars","aria-label":"open menu"})),this.showLogo&&n("a",{href:this.logoUrl,class:"logo-link"},n("img",{src:a(`./assets/ont-logo.svg`),alt:"Oxford Nanopore Technologies Logo",class:"logo"})),!this.showLogo&&n("div",{class:"logo-link"},n("slot",{name:"logo"})),n("div",{class:"nav-links nav-links--main"},n("slot",{name:"main"})),this.mainSlotLen===0&&this.threshold>=this.THRESHOLDLIMIT-m.search&&[this.showSearch&&!!this.internalSearchIndeces.length&&n("div",{class:"search-widget",role:"combobox","aria-owns":"autocomplete-results","aria-expanded":this.showAutocomplete&&this.autocompleteResults?"true":"false"},i),(!this.showSearch||!this.myAccData)&&!!this.searchSlotLen&&n("slot",{name:"search"})],(this.mainSlotLen>0||this.threshold<this.THRESHOLDLIMIT-m.search)&&(this.showSearch&&!!this.internalSearchIndeces.length||!!this.searchSlotLen)&&n("button",{class:{"icon-btn":true,"search-btn":true,"search-btn--open":this.searchBarShown},"aria-controls":"global-nav-search-bar","aria-expanded":this.searchBarShown?"true":"false",onMouseDown:this.onSearchBtnClick,onKeyDown:this.onSearchBtnKeyDown},n("nano-icon",{name:"light/search"})),this.threshold>=this.THRESHOLDLIMIT-m.icon&&[!!this.iconSlotLen&&n("slot",{name:"icon"}),this.myAccData&&(!this.activeMyAccountSections||this.activeMyAccountSections.includes("icons"))&&[this.msgUrl&&n("a",{href:this.msgUrl,class:"icon-btn"},n("nano-icon",{name:"light/bell"}),this.msgCount>0&&n("span",{class:"gn-menu_actions-counter"},this.msgCount)),this.cartUrl&&!!this.cartCount&&n("a",{href:this.cartUrl,class:"icon-btn"},n("nano-icon",{name:"light/shopping-cart"}),this.cartCount>0&&n("span",{class:"gn-menu_actions-counter"},this.cartCount))]],(!!this.aboutSlotLen||!!this.aboutNavItms.length)&&this.threshold>=this.THRESHOLDLIMIT-m.about&&n("nav",{class:"nav-links nav-links--sub","aria-label":"About the company. Links"},n("slot",{name:"about"}),!!this.aboutNavItms.length&&n("nano-nav-item",{class:"nano-global-nav nano-global-nav-bar"},n("a",{href:this.aboutNavItms[0].address,target:this.aboutNavItms[0].target},this.aboutNavItms[0].title))),this.myAccData&&(!this.activeMyAccountSections||this.activeMyAccountSections.includes("loggedin"))&&this.threshold>=this.THRESHOLDLIMIT-m.login&&[this.myAccData.urls.login&&n("a",{href:this.myAccData.urls.login+this.ssoRedirect,class:"login-btn"},"Login / Register"),this.myAccountUser&&n("div",{class:"user-links"},n("button",{class:{"icon-btn":true,"user-links-btn":true,open:this.userMenuOpen},onMouseDown:this.onUserBtnClick,onKeyDown:this.onUserBtnKeyDown}," ",this.myAccountUser.name,n("nano-icon",{name:"solid/caret-down"})),n("div",{class:"user-links-panel",tabindex:"-1",ref:t=>this.userLinkPanel=t},!!this.myAccountUser?.small_avatar_url&&n("nano-global-nav-user-profile",{myAccountUser:this.myAccountUser,userProfileUrl:this.userProfileUrl}),n("div",{class:"user-links-panel-content"},this.loggedInNavItms.map((t=>n("a",{href:t.address,target:t.target},t.title)))),n("div",{class:"user-links-panel-foot"},n("a",{href:this.myAccData.urls.forgot_password+this.ssoRedirect},"Change Password"),n("a",{href:this.myAccData.urls.logout+this.ssoRedirect},"Logout"))))],n("span",{class:"measure-ele"})),(this.mainSlotLen>0||this.threshold<this.THRESHOLDLIMIT-m.search)&&n("div",{id:"global-nav-search-bar",class:{"search-bar":true,show:this.searchBarShown},"aria-expanded":this.searchBarShown?"true":"false",role:"region",tabindex:"-1",ref:t=>this.searchBarEl=t},n("div",{class:"search-widget"},this.showSearch&&!!this.internalSearchIndeces.length&&n("div",null,i),(!this.showSearch||!this.myAccData)&&!!this.searchSlotLen&&n("slot",{name:"search"}))))),n("div",{class:"sticker-trigger"}),(this.threshold<this.THRESHOLDLIMIT-3||this.menuFullScreen)&&n("div",{class:{mask:true,open:this.modalOpen},onClick:this.menuClose,onTouchEnd:this.menuClose})),n("div",{class:"site-content",ref:t=>this.siteContent=t},n("slot",null)))}domainFor(t){if(!this.myAccData)return"";const i=this.myAccData.domains.find((i=>i.origin===t));return i?i.domain:""}processSearchResults(t){const i=t;const e=t;if(i.results){i.results.forEach(((t,e)=>{i.results[e]=this.processSearchResults(t)}));return i}else{e.hits.map((t=>{if(t.url&&!t.url.match(/^http/))t.url=location.protocol+"//"+this.domainFor(t.origin)+t.url}));return e}}processMyAccData(){if(!this.myAccData||!this.myAccData.search.indeces.length)return;if(this.myAccData.search.api_key)this.searchApiKey=this.myAccData.search.api_key;if(this.myAccData.search.app_id)this.searchAppId=this.myAccData.search.app_id;if(this.myAccData.cart.count)this.cartCount=this.myAccData.cart.count;if(this.myAccData.notifications.count)this.msgCount=this.myAccData.notifications.count;if(!this.searchAppId||!this.searchApiKey)return;this.internalSearchIndeces=[...this.myAccData.search.indeces,...this.searchIndeces];if(this.myAccData.urls.cart&&!this.cartUrl)this.cartUrl=this.myAccData.urls.cart;if(this.myAccData.urls.messages&&!this.msgUrl)this.msgUrl=this.myAccData.urls.messages}processMyAccLinks(){if(!this.myAccData.links||!this.myAccData.links.length)return;this.myAccData.links.forEach((t=>{switch(t.area){case"left-side-logged-in":case"left-side-logged-out":if(this.activeMyAccountSections&&!this.activeMyAccountSections.includes("sites"))break;if(this.isLoggedIn&&t.area==="left-side-logged-in")this.siteNavItms.push(t);else if(!this.isLoggedIn&&t.area==="left-side-logged-out")this.siteNavItms.push(t);break;case"right-side-logged-in":case"right-side-logged-out":if(this.activeMyAccountSections&&!this.activeMyAccountSections.includes("about"))break;if(this.isLoggedIn&&t.area==="right-side-logged-in")this.aboutNavItms.push(t);else if(!this.isLoggedIn&&t.area==="right-side-logged-out")this.aboutNavItms.push(t);break;case"profile-panel-list":if(this.activeMyAccountSections&&!this.activeMyAccountSections.includes("loggedin"))break;this.loggedInNavItms.push(t);break}}))}static get assetsDirs(){return["assets"]}get el(){return r(this)}static get watchers(){return{env:["getMyAccData"],ssoDataUrl:["getMyAccData"],searchIndex:["currentSelectedIndex"],searchValInternal:["changeInternalSearchVal"],searchApiKey:["initAlgoliaClient"],searchAppId:["initAlgoliaClient"],searchIndeces:["addIndeces"],internalSearchIndeces:["addAlgoliaIndeces"],threshold:["thresholdChange"],intersectRatio:["ratioChange"],thresholdReady:["assessReady"],remoteDataReady:["assessReady","remoteReady"],ready:["isReady"],showAutocomplete:["setupAutocompleteBlur","resetHitFocus"],aboutSlotLen:["slotChange"],iconSlotLen:["slotChange"],mainSlotLen:["slotChange"],overflowSlotLen:["slotChange"],searchSlotLen:["slotChange"],userMenuOpen:["handleUserMenu"]}}};g.style=u;export{g as nano_global_nav};
|
5
|
+
//# sourceMappingURL=p-653a25f8.entry.js.map
|