@nanoporetech-digital/components 8.18.0 → 8.19.1

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

@@ -200,8 +200,9 @@ function storeSetData(host, rows) {
         // try our best to discern the column type (from first row) if unset
         if (unknownCols.length && i === 0) {
             store.config.state.columns = cols.map((col) => {
-                if (unknownCols.includes(col) && row[col.prop] && !col.type) {
-                    col.type = getDataType(row[col.prop]);
+                const val = getNestedProperty(row, col.prop);
+                if (unknownCols.includes(col) && val && !col.type) {
+                    col.type = getDataType(val);
                     if (col.type === 'date')
                         dateCols.push(col.prop);
                 }
@@ -212,12 +213,16 @@ function storeSetData(host, rows) {
         dateCols.forEach((colName) => {
             // coerce any date type;
             // Date(), timestamp, valid date string
-            const coerceDate = new Date(row[colName]);
-            if (!!coerceDate && Number(coerceDate))
+            const cellValue = getNestedProperty(row, colName);
+            const coerceDate = new Date(cellValue);
+            if (!!coerceDate && Number(coerceDate)) {
+                // Store as a flattened property (e.g., row["user.birthDate"])
+                // getNestedProperty will check this first before traversing nested structure
                 row[colName] = Number(coerceDate);
+            }
         });
         row['__index'] = i;
-        row['__uuid'] = cyrb53(cols.map((c) => row[c.prop]).join());
+        row['__uuid'] = cyrb53(cols.map((c) => getNestedProperty(row, c.prop)).join());
         return row;
     });
     store.data.state.rows = rows;
@@ -266,6 +271,39 @@ async function storeSort(host, prop, order) {
     }
 }
 
+// Separate file (so it's safe to import into the worker)
+/**
+ * Accesses a nested property using dot notation.
+ * @param obj - the object to access
+ * @param path - the property path (e.g., 'props.nested.name')
+ * @returns the value at the path, or undefined if not found
+ */
+function getNestedProperty(obj, path) {
+    if (!obj || path === null || path === undefined)
+        return undefined;
+    // Convert to string for consistent handling
+    const pathStr = String(path);
+    // Check for a flattened property first (optimization for transformed values)
+    // e.g., obj["user.birthDate"] takes precedence over obj.user.birthDate
+    if (obj[pathStr] !== undefined) {
+        return obj[pathStr];
+    }
+    // If the path doesn't contain a dot, just return the direct property
+    if (!pathStr.includes('.')) {
+        return obj[path];
+    }
+    // Split the path and traverse the object
+    const keys = pathStr.split('.');
+    let result = obj;
+    for (const key of keys) {
+        if (result === null || result === undefined) {
+            return undefined;
+        }
+        result = result[key];
+    }
+    return result;
+}
+
 /**
  * Get a model object for custom cell / property renderers.
  * @param rowIndex - the current row index being rendered
@@ -279,7 +317,9 @@ function colDataModel(rowIndex, colIndex) {
     const column = columns[colIndex];
     const prop = column?.prop;
     const rowModel = rows[rowIndex];
-    const cellModel = rowModel ? rowModel[columns[colIndex].prop] : '';
+    const cellModel = rowModel
+        ? getNestedProperty(rowModel, columns[colIndex].prop)
+        : '';
     return {
         prop,
         cellModel,

package/dist/components/nano-global-nav.js

@@ -45,7 +45,7 @@ const GlobalNav = /*@__PURE__*/ proxyCustomElement(class GlobalNav extends HTMLE
     /** Url to the Nanopore contact page */
     contactUrl = 'https://nanoporetech.com/contact';
     _sessionRedirect = window.location.href;
-    /** A url to take the user after login / logout. Defaults to current URL. Is automatically URI encoded */
+    /** A url to take the user after login or logout. Defaults to current URL. Is automatically URI encoded */
     get sessionRedirect() {
         return encodeURIComponent(this._sessionRedirect);
     }
@@ -457,7 +457,11 @@ const GlobalNav = /*@__PURE__*/ proxyCustomElement(class GlobalNav extends HTMLE
             return;
         return (h("div", { part: "user-panel", class: `gn__user-panel nano-theme-dark` }, h("div", { class: "gn__user-panel-head", slot: "label" }, h("nano-avatar", { initials: this.myAccountUser.first_name?.charAt(0) +
                 this.myAccountUser.last_name?.charAt(0) }, this.myAccountUser.small_avatar_url &&
-            !this.myAccountUser.small_avatar_url.includes('generic') && (h("img", { src: this.myAccountUser.small_avatar_url, alt: "User Avatar", height: 40, width: 40 }))), h("div", null, this.myAccountUser.name, h("br", null), this.myAccountUser.job_title, ", ", this.myAccountUser.company)), h("div", { class: "gn__user-panel-body" }, this.userLinks.map((link) => (h("a", { href: link.address, target: link.target || undefined }, link.title, (link.title === 'Messages' ||
+            !this.myAccountUser.small_avatar_url.includes('generic') && (h("img", { src: this.myAccountUser.small_avatar_url, alt: "User Avatar", height: 40, width: 40 }))), h("div", null, this.myAccountUser.name, h("br", null), this.myAccountUser.job_title && this.myAccountUser?.company
+            ? `${this.myAccountUser.job_title}, ${this.myAccountUser.company}`
+            : this.myAccountUser.job_title ||
+                this.myAccountUser.company ||
+                '')), h("div", { class: "gn__user-panel-body" }, this.userLinks.map((link) => (h("a", { href: link.address, target: link.target || undefined }, link.title, (link.title === 'Messages' ||
             link.address.includes(this.msgUrl) ||
             this.msgUrl.includes(link.address)) &&
             this.msgCount > 0 && (h("nano-badge", { theme: "danger", strength: "2" }, this.msgCount)))))), h("div", { class: "gn__user-panel-foot" }, h("nano-cta", { secondary: true, size: "small", icon: "false", class: "gn__login-cta" }, h("a", { href: this.formatLoginLink(this.logoutUrl) }, "Logout")))));
@@ -502,21 +506,21 @@ const GlobalNav = /*@__PURE__*/ proxyCustomElement(class GlobalNav extends HTMLE
     }
     render() {
         const bpps = this.bpPartials;
-        return (h(Host, { key: '3964e8a3aab86d4252876816ca934c69e75da22b', class: {
+        return (h(Host, { key: '63e6202a06bc4bc7a6a63f88d1923c3321a2b47c', class: {
                 'overflow-menu': this.breakpoint > bpps.mainMenu.breakpoint,
                 'bar-menu': this.breakpoint <= bpps.mainMenu.breakpoint,
                 'nano-global-nav': true,
-            } }, h("div", { key: 'fc2f728b3c4412913ffc2d18c07d057bf6e0bf87', class: {
+            } }, h("div", { key: '7fe0cb9446b86233ed7727fdc9aade6b94cb72eb', class: {
                 gn: true,
                 'gn__search-open': this.searchBarShown,
-            } }, h("nano-drawer", { key: '9a2c9109327ff9cd4eb2553df7e93571a29aa237', ref: (el) => (this.overflowMenu = el), label: "Main menu", part: "drawer", class: "gn__drawer nano-theme-dark", placement: "start", open: this.overflowOpen, onNanoAfterHide: () => (this.overflowOpen = false), onNanoAfterShow: () => (this.overflowOpen = true) }, h("div", { key: '649c672f237ce2145eda6c8988744f6709835615', class: "gn__drawer-header", part: "overflow-header", slot: "label" }, "Main menu"), h("nav", { key: 'd002c07a9eb1cdcc4e188e5b146ce8a11257ab98', class: "gn__drawer-menu", part: "overflow-menu" }, this.breakpoint > bpps.mainMenu.breakpoint
+            } }, h("nano-drawer", { key: 'ef476cfee137ebbee63c2f7a99935d4aafd2f7e4', ref: (el) => (this.overflowMenu = el), label: "Main menu", part: "drawer", class: "gn__drawer nano-theme-dark", placement: "start", open: this.overflowOpen, onNanoAfterHide: () => (this.overflowOpen = false), onNanoAfterShow: () => (this.overflowOpen = true) }, h("div", { key: 'c4cbe27955caffeb4f4a7dc755b6b08bf40a7f48', class: "gn__drawer-header", part: "overflow-header", slot: "label" }, "Main menu"), h("nav", { key: '26ec816c93427ce9f9cc4025e327b5e6cf9ba3e2', class: "gn__drawer-menu", part: "overflow-menu" }, this.breakpoint > bpps.mainMenu.breakpoint
             ? bpps.mainMenu.tpl()
-            : '', h("slot", { key: 'b6bf65e8ed92636f1eba4b376ecb2fd617bcd67f', name: "overflow" }))), h("div", { key: 'b7a5e9d074b63f1841d3946d0166389c73161f25', class: "gn__menu-bar-wrapper" }, h("div", { key: '6b4d27a83ed4cbf3a62c0b924b08c887e415904a', class: "gn__menu-bar", part: "menu-bar", ref: (el) => (this.mainMenuBar = el) }, h("nav", { key: 'bf3736fc4eb98e53a04357e30cd49fab8bf9ef7d', "aria-label": "Global navigation", class: `gn__main-menu ${this.shouldResize ? 'resizing' : ''}`, part: "main-menu", ref: (el) => (this.mainMenu = el) }, this.breakpoint > bpps.mainMenu.breakpoint && (h("nano-icon-button", { key: 'fb90f7ea03281cd5543b7723df27ac704367e43f', class: "gn__overflow-button", iconName: "light/bars", label: "Open Menu", onClick: () => this.overflowMenu.show() })), h("slot", { key: '94e0abe01ad7562fb72abde08ebad80e95d11042', name: "logo" }, h("a", { key: '1b01613c642f2bfd1df9df3d35517c6261f40b41', href: this.logoUrl, class: "gn__logo-link", part: "logo-link" }, this.breakpoint <= bpps.logo.breakpoint ? (h("img", { src: getAssetPath('../nano-assets/ont-logo.svg'), alt: `Oxford Nanopore Technologies logo. Features a stylised representation of a nanopore,
+            : '', h("slot", { key: '0693a9f4afdf63e63151b3f3fd4d3a0bbedde4ef', name: "overflow" }))), h("div", { key: 'd9ff383fb0f91876a533e8eb98bc47817b044729', class: "gn__menu-bar-wrapper" }, h("div", { key: '4536fd7593626672f20191b197a55b3d7b10b633', class: "gn__menu-bar", part: "menu-bar", ref: (el) => (this.mainMenuBar = el) }, h("nav", { key: 'ad22eb106a5d9c0ffd8eac8e5e995833f8adcd7e', "aria-label": "Global navigation", class: `gn__main-menu ${this.shouldResize ? 'resizing' : ''}`, part: "main-menu", ref: (el) => (this.mainMenu = el) }, this.breakpoint > bpps.mainMenu.breakpoint && (h("nano-icon-button", { key: 'c399d0e0c2a909a94a0b93ad00ebc5cb34e8c224', class: "gn__overflow-button", iconName: "light/bars", label: "Open Menu", onClick: () => this.overflowMenu.show() })), h("slot", { key: 'ee03de047e3937687e722a88e34356ffc151a9e9', name: "logo" }, h("a", { key: 'a39aad67426cdc5ce75fa334a303229bfab9e58c', href: this.logoUrl, class: "gn__logo-link", part: "logo-link" }, this.breakpoint <= bpps.logo.breakpoint ? (h("img", { src: getAssetPath('../nano-assets/ont-logo.svg'), alt: `Oxford Nanopore Technologies logo. Features a stylised representation of a nanopore,
                             (a tiny protein channel embedded in a membrane) through which DNA or RNA molecules are passed in for sequencing.`, class: "gn__logo gn__logo--large", width: "152", height: "36", part: "logo logo--large" })) : (h("img", { src: getAssetPath('../nano-assets/ont-wheel.svg'), alt: `Oxford Nanopore Technologies logo. A stylised representation of a nanopore,
-                            (a tiny protein channel embedded in a membrane) through which DNA or RNA molecules are passed in for sequencing.`, class: "gn__logo gn__logo--small", width: "36", height: "36", part: "logo logo--small" })))), this.breakpoint <= bpps.mainMenu.breakpoint && (h("div", { key: '6b303f5b2de6b26a5ec9480e08a0269fcf2f6857', class: "gn__main-menu-links" }, bpps.mainMenu.tpl())), h("div", { key: 'c2a63e53e7d72e5fabf40190d78d780d25f34c99', class: "gn__main-menu-actions" }, !this.myAccountData ||
-            (!!this.searchIndices.length && (h("nano-dropdown", { key: '1ec162b4ecbfc8360d152780cb29a6274cca3d7d', dialogTitle: "Search Oxford Nanopore Technologies", placement: "bottom", class: "gn__search-dropdown", skidding: -30, distance: 25, open: this.searchBarShown, onNanoAfterShow: this.handleSearchOpenEvent, onNanoAfterHide: this.handleSearchCloseEvent, autoOpen: !!this.searchIndices.length }, h("nano-icon-button", { key: '978738e596466f583580e48b330a96bac0b14fdc', class: "gn__search-button", slot: "trigger", iconName: "light/magnifying-glass", label: "Search" }), h("form", { key: '6227358213b66c38888cce78218291144c33ca71', ref: (form) => (this.searchForm = form), class: "gn__search-form", part: "search-form", onSubmit: this.onSearchSubmit }, this.searchIndices.length > 1 && (h("nano-select", { key: '36c4fe6caebc5e38702987ae9e3ba05d79e7ae28', part: "search-select", label: "Which site do you wish to search in?", mask: true, hideLabel: true, value: this.activeIndex?.index, onNanoChange: this.handleSearchIndexChangeEvent }, this.searchIndices.map((index) => (h("nano-option", { selected: index.name === this.searchIndex, value: index.index }, index.name || index.index))))), h("nano-input", { key: 'd10bf62d983978ab9a3c20f0cd1f64e543dea593', ref: (ele) => (this.searchInput = ele), part: "search-input", label: "Search Oxford Nanopore Technologies", placeholder: "Search Oxford Nanopore...", hideLabel: true, clearable: true, showInlineError: false, onNanoChange: (e) => {
+                            (a tiny protein channel embedded in a membrane) through which DNA or RNA molecules are passed in for sequencing.`, class: "gn__logo gn__logo--small", width: "36", height: "36", part: "logo logo--small" })))), this.breakpoint <= bpps.mainMenu.breakpoint && (h("div", { key: '46a926ede075e0bfde746fa174c0700a48bc308e', class: "gn__main-menu-links" }, bpps.mainMenu.tpl())), h("div", { key: 'e473ba724a01a0f596f6494b7bb452eef0c4ba53', class: "gn__main-menu-actions" }, !this.myAccountData ||
+            (!!this.searchIndices.length && (h("nano-dropdown", { key: '90fa8c9cc0566374afce5f8c722aa98176372d7d', dialogTitle: "Search Oxford Nanopore Technologies", placement: "bottom", class: "gn__search-dropdown", skidding: -30, distance: 25, open: this.searchBarShown, onNanoAfterShow: this.handleSearchOpenEvent, onNanoAfterHide: this.handleSearchCloseEvent, autoOpen: !!this.searchIndices.length }, h("nano-icon-button", { key: '73c7c855dd6baf3259429d55c9bf3d58c2e8ec03', class: "gn__search-button", slot: "trigger", iconName: "light/magnifying-glass", label: "Search" }), h("form", { key: 'f265a2ba3269f22c2efcbe73c7ffe4328fe9d0e8', ref: (form) => (this.searchForm = form), class: "gn__search-form", part: "search-form", onSubmit: this.onSearchSubmit }, this.searchIndices.length > 1 && (h("nano-select", { key: '498ea9e7b0dd5bb10dd92b2df0fccc76295b1042', part: "search-select", label: "Which site do you wish to search in?", mask: true, hideLabel: true, value: this.activeIndex?.index, onNanoChange: this.handleSearchIndexChangeEvent }, this.searchIndices.map((index) => (h("nano-option", { selected: index.name === this.searchIndex, value: index.index }, index.name || index.index))))), h("nano-input", { key: '78baa1860b433e8ee36cd6f2d34d026a7c1e8b21', ref: (ele) => (this.searchInput = ele), part: "search-input", label: "Search Oxford Nanopore Technologies", placeholder: "Search Oxford Nanopore...", hideLabel: true, clearable: true, showInlineError: false, onNanoChange: (e) => {
                     this.handleSearchTermChangeEvent(e.detail.value);
-                }, onNanoInput: this.handleSearchTermInputEvent, debounce: 500, value: this._searchValue }, h("nano-icon", { key: 'f5d7f79ac22c414adb0d02219a215618ccd89a7b', slot: "end", name: "light/magnifying-glass" }), h("nano-datalist", { key: 'a80c13a3d9382c730408d80f7f2058ca886678d2', class: "gn__search-results", onNanoSelect: (e) => e.preventDefault(), dropDownConfig: { tetherTo: this.searchForm }, disableFilter: true }, this.searchLoading && (h("div", { key: '1671b2988094fbefc0f3a7dfc09dd03688141e12', slot: "no-result", class: "gn__search-loading" }, h("nano-spinner", { key: 'dd88116ffa3881fe272673d57686f12159f056e4' }, "Searching..."))), this.noResultPartial(), !!this.autocompleteResults?.hits.length && [
+                }, onNanoInput: this.handleSearchTermInputEvent, debounce: 500, value: this._searchValue }, h("nano-icon", { key: 'f3b612bba31b0b1a930b170711080bce93324322', slot: "end", name: "light/magnifying-glass" }), h("nano-datalist", { key: 'a264479248b83b20cb42155e09c3033356a221b4', class: "gn__search-results", onNanoSelect: (e) => e.preventDefault(), dropDownConfig: { tetherTo: this.searchForm }, disableFilter: true }, this.searchLoading && (h("div", { key: '21d365a6554c31144d57900ec8cf50e6caa105b2', slot: "no-result", class: "gn__search-loading" }, h("nano-spinner", { key: 'b4f28c952fcfe765dea3ab7e4c0691e10de1317e' }, "Searching..."))), this.noResultPartial(), !!this.autocompleteResults?.hits.length && [
                 this.autocompleteResults.hits.map((hit, i) => (h("nano-option", { href: hit.url, class: "gn__search-result", onClick: () => {
                         searchInsight.sendClick({
                             index: this.activeIndex.index,
@@ -526,10 +530,10 @@ const GlobalNav = /*@__PURE__*/ proxyCustomElement(class GlobalNav extends HTMLE
                             positions: [i + 1],
                         });
                     } }, h("span", { innerHTML: this.autocompleteSnippet(hit) })))),
-                h("nano-option", { key: 'acbff4930245aabfbfe3d94cccbf0916a6419509', class: "gn__search-viewall", onNanoSelect: this.onSearchSubmit }, "View all results"),
-            ])))))), h("div", { key: '91cdf552cbf807a5f307da6381ff16fbba419bbe', class: "gn__cart" }, h("nano-icon-button", { key: '19c225ced356309ee741c74bc07fa7238e7bc9ff', iconName: "light/cart-shopping", label: "View your cart", href: this.cartUrl }), !!this.cartCount && (h("nano-badge", { key: '6c7d8a2da3276c017cb67f58b48a7358db22b428', theme: "danger", strength: "2" }, this.cartCount > 9 ? '9+' : this.cartCount))), this.breakpoint <= bpps.contact.breakpoint
+                h("nano-option", { key: 'b2a1dc7ff83c80599377850136d6233fa64cee3c', class: "gn__search-viewall", onNanoSelect: this.onSearchSubmit }, "View all results"),
+            ])))))), h("div", { key: '38bc65edb00ef4876340fdfc1f308a6805a1e1ec', class: "gn__cart" }, h("nano-icon-button", { key: 'b590faedc935181b9230c82509360ddc2a19f1cf', iconName: "light/cart-shopping", label: "View your cart", href: this.cartUrl }), !!this.cartCount && (h("nano-badge", { key: 'c7f45eea27607c6d4380ccdf3a7f2cacfd26bc80', theme: "danger", strength: "2" }, this.cartCount > 9 ? '9+' : this.cartCount))), this.breakpoint <= bpps.contact.breakpoint
             ? bpps.contact.tpl()
-            : '', this.isLoggedIn ? (h("nano-dropdown", { dialogTitle: "User menu", class: "gn__user-dropdown", distance: 10, placement: "bottom-end" }, h("button", { slot: "trigger", class: "gn__user-dropdown-trigger" }, h("nano-icon", { name: "light/user" }), h("nano-icon", { name: "light/chevron-down", class: "gn__user-dropdown-chevron" }), !!this.msgCount && (h("nano-badge", { theme: "danger", strength: "2" }, this.msgCount > 9 ? '9+' : this.msgCount))), this.loggedInPanel())) : (h("nano-cta", { secondary: true, size: "small", icon: "false", class: "gn__login-cta" }, h("a", { href: this.formatLoginLink(this.loginUrl) }, "Login"))))))), h("nano-global-search-results", { key: '7a58924f37e6f4517bec274b3a878a6e3d3e2553', part: "site-search-results" }, h("div", { key: '062c09847198b236c0731d6653584115ddd46e71', class: "gn__site", part: "site-wrapper" }, h("slot", { key: '971633747f2ec2a6a4dbee587a5a5ccfaaedc088' }))))));
+            : '', this.isLoggedIn ? (h("nano-dropdown", { dialogTitle: "User menu", class: "gn__user-dropdown", distance: 10, placement: "bottom-end" }, h("button", { slot: "trigger", class: "gn__user-dropdown-trigger" }, h("nano-icon", { name: "light/user" }), h("nano-icon", { name: "light/chevron-down", class: "gn__user-dropdown-chevron" }), !!this.msgCount && (h("nano-badge", { theme: "danger", strength: "2" }, this.msgCount > 9 ? '9+' : this.msgCount))), this.loggedInPanel())) : (h("nano-cta", { secondary: true, size: "small", icon: "false", class: "gn__login-cta" }, h("a", { href: this.formatLoginLink(this.loginUrl) }, "Login"))))))), h("nano-global-search-results", { key: '6443d9f0199f87ba5ca73b62b6c3c9e5700731b4', part: "site-search-results" }, h("div", { key: 'db0ce2d9157f7144b0c50d0833386ed4eeabdd02', class: "gn__site", part: "site-wrapper" }, h("slot", { key: 'a9ac7197c149153532f16f8f0f428b5e46d11b72' }))))));
     }
     static get assetsDirs() { return ["assets"]; }
     static get watchers() { return {

package/dist/components/table.worker.js

@@ -5,7 +5,7 @@ import { c as createWorker } from './nano-data-table.js';
 
 const workerName = 'table.worker';
 const workerMsgId = 'stencil.table.worker';
-const workerPath = new URL('assets/table.worker-TTndpijX.js', import.meta.url).href;
+const workerPath = new URL('assets/table.worker-DM_2DNEe.js', import.meta.url).href;
 let worker;
 try {
   // first try directly starting the worker with the URL

package/dist/esm/{nano-data-table-BXdzSqWC.js → nano-data-table-Bn4l0Q3q.js}

@@ -112,7 +112,7 @@ const createWorkerProxy = (worker, workerMsgId, exportedMethod) => (
   })
 );
 
-const workerPromise = import('./table.worker-DftFV8Z7.js').then(m => m.worker);
+const workerPromise = import('./table.worker-BMDbprO8.js').then(m => m.worker);
 const createWorkerStore = /*@__PURE__*/createWorkerProxy(workerPromise, 'stencil.table.worker', 'createWorkerStore');
 const syncConfigToWorker = /*@__PURE__*/createWorkerProxy(workerPromise, 'stencil.table.worker', 'syncConfigToWorker');
 const syncDataToWorker = /*@__PURE__*/createWorkerProxy(workerPromise, 'stencil.table.worker', 'syncDataToWorker');
@@ -193,8 +193,9 @@ function storeSetData(host, rows) {
         // try our best to discern the column type (from first row) if unset
         if (unknownCols.length && i === 0) {
             store.config.state.columns = cols.map((col) => {
-                if (unknownCols.includes(col) && row[col.prop] && !col.type) {
-                    col.type = getDataType(row[col.prop]);
+                const val = getNestedProperty(row, col.prop);
+                if (unknownCols.includes(col) && val && !col.type) {
+                    col.type = getDataType(val);
                     if (col.type === 'date')
                         dateCols.push(col.prop);
                 }
@@ -205,12 +206,16 @@ function storeSetData(host, rows) {
         dateCols.forEach((colName) => {
             // coerce any date type;
             // Date(), timestamp, valid date string
-            const coerceDate = new Date(row[colName]);
-            if (!!coerceDate && Number(coerceDate))
+            const cellValue = getNestedProperty(row, colName);
+            const coerceDate = new Date(cellValue);
+            if (!!coerceDate && Number(coerceDate)) {
+                // Store as a flattened property (e.g., row["user.birthDate"])
+                // getNestedProperty will check this first before traversing nested structure
                 row[colName] = Number(coerceDate);
+            }
         });
         row['__index'] = i;
-        row['__uuid'] = cyrb53(cols.map((c) => row[c.prop]).join());
+        row['__uuid'] = cyrb53(cols.map((c) => getNestedProperty(row, c.prop)).join());
         return row;
     });
     store.data.state.rows = rows;
@@ -259,6 +264,39 @@ async function storeSort(host, prop, order) {
     }
 }
 
+// Separate file (so it's safe to import into the worker)
+/**
+ * Accesses a nested property using dot notation.
+ * @param obj - the object to access
+ * @param path - the property path (e.g., 'props.nested.name')
+ * @returns the value at the path, or undefined if not found
+ */
+function getNestedProperty(obj, path) {
+    if (!obj || path === null || path === undefined)
+        return undefined;
+    // Convert to string for consistent handling
+    const pathStr = String(path);
+    // Check for a flattened property first (optimization for transformed values)
+    // e.g., obj["user.birthDate"] takes precedence over obj.user.birthDate
+    if (obj[pathStr] !== undefined) {
+        return obj[pathStr];
+    }
+    // If the path doesn't contain a dot, just return the direct property
+    if (!pathStr.includes('.')) {
+        return obj[path];
+    }
+    // Split the path and traverse the object
+    const keys = pathStr.split('.');
+    let result = obj;
+    for (const key of keys) {
+        if (result === null || result === undefined) {
+            return undefined;
+        }
+        result = result[key];
+    }
+    return result;
+}
+
 /**
  * Get a model object for custom cell / property renderers.
  * @param rowIndex - the current row index being rendered
@@ -272,7 +310,9 @@ function colDataModel(rowIndex, colIndex) {
     const column = columns[colIndex];
     const prop = column?.prop;
     const rowModel = rows[rowIndex];
-    const cellModel = rowModel ? rowModel[columns[colIndex].prop] : '';
+    const cellModel = rowModel
+        ? getNestedProperty(rowModel, columns[colIndex].prop)
+        : '';
     return {
         prop,
         cellModel,

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

@@ -1,7 +1,7 @@
 /*!
  * Custom elements for Nanopore-Digital Web applications
  */
-export { N as nano_data_table } from './nano-data-table-BXdzSqWC.js';
+export { N as nano_data_table } from './nano-data-table-Bn4l0Q3q.js';
 import './index-BM3Om9WE.js';
 import './renderer-DpNDfhNy.js';
 import './math-BEqsTfVK.js';

package/dist/esm/nano-global-nav.entry.js

@@ -28,7 +28,7 @@ const GlobalNav = class {
     /** Url to the Nanopore contact page */
     contactUrl = 'https://nanoporetech.com/contact';
     _sessionRedirect = window.location.href;
-    /** A url to take the user after login / logout. Defaults to current URL. Is automatically URI encoded */
+    /** A url to take the user after login or logout. Defaults to current URL. Is automatically URI encoded */
     get sessionRedirect() {
         return encodeURIComponent(this._sessionRedirect);
     }
@@ -437,7 +437,11 @@ const GlobalNav = class {
             return;
         return (h("div", { part: "user-panel", class: `gn__user-panel nano-theme-dark` }, h("div", { class: "gn__user-panel-head", slot: "label" }, h("nano-avatar", { initials: this.myAccountUser.first_name?.charAt(0) +
                 this.myAccountUser.last_name?.charAt(0) }, this.myAccountUser.small_avatar_url &&
-            !this.myAccountUser.small_avatar_url.includes('generic') && (h("img", { src: this.myAccountUser.small_avatar_url, alt: "User Avatar", height: 40, width: 40 }))), h("div", null, this.myAccountUser.name, h("br", null), this.myAccountUser.job_title, ", ", this.myAccountUser.company)), h("div", { class: "gn__user-panel-body" }, this.userLinks.map((link) => (h("a", { href: link.address, target: link.target || undefined }, link.title, (link.title === 'Messages' ||
+            !this.myAccountUser.small_avatar_url.includes('generic') && (h("img", { src: this.myAccountUser.small_avatar_url, alt: "User Avatar", height: 40, width: 40 }))), h("div", null, this.myAccountUser.name, h("br", null), this.myAccountUser.job_title && this.myAccountUser?.company
+            ? `${this.myAccountUser.job_title}, ${this.myAccountUser.company}`
+            : this.myAccountUser.job_title ||
+                this.myAccountUser.company ||
+                '')), h("div", { class: "gn__user-panel-body" }, this.userLinks.map((link) => (h("a", { href: link.address, target: link.target || undefined }, link.title, (link.title === 'Messages' ||
             link.address.includes(this.msgUrl) ||
             this.msgUrl.includes(link.address)) &&
             this.msgCount > 0 && (h("nano-badge", { theme: "danger", strength: "2" }, this.msgCount)))))), h("div", { class: "gn__user-panel-foot" }, h("nano-cta", { secondary: true, size: "small", icon: "false", class: "gn__login-cta" }, h("a", { href: this.formatLoginLink(this.logoutUrl) }, "Logout")))));
@@ -482,21 +486,21 @@ const GlobalNav = class {
     }
     render() {
         const bpps = this.bpPartials;
-        return (h(Host, { key: '3964e8a3aab86d4252876816ca934c69e75da22b', class: {
+        return (h(Host, { key: '63e6202a06bc4bc7a6a63f88d1923c3321a2b47c', class: {
                 'overflow-menu': this.breakpoint > bpps.mainMenu.breakpoint,
                 'bar-menu': this.breakpoint <= bpps.mainMenu.breakpoint,
                 'nano-global-nav': true,
-            } }, h("div", { key: 'fc2f728b3c4412913ffc2d18c07d057bf6e0bf87', class: {
+            } }, h("div", { key: '7fe0cb9446b86233ed7727fdc9aade6b94cb72eb', class: {
                 gn: true,
                 'gn__search-open': this.searchBarShown,
-            } }, h("nano-drawer", { key: '9a2c9109327ff9cd4eb2553df7e93571a29aa237', ref: (el) => (this.overflowMenu = el), label: "Main menu", part: "drawer", class: "gn__drawer nano-theme-dark", placement: "start", open: this.overflowOpen, onNanoAfterHide: () => (this.overflowOpen = false), onNanoAfterShow: () => (this.overflowOpen = true) }, h("div", { key: '649c672f237ce2145eda6c8988744f6709835615', class: "gn__drawer-header", part: "overflow-header", slot: "label" }, "Main menu"), h("nav", { key: 'd002c07a9eb1cdcc4e188e5b146ce8a11257ab98', class: "gn__drawer-menu", part: "overflow-menu" }, this.breakpoint > bpps.mainMenu.breakpoint
+            } }, h("nano-drawer", { key: 'ef476cfee137ebbee63c2f7a99935d4aafd2f7e4', ref: (el) => (this.overflowMenu = el), label: "Main menu", part: "drawer", class: "gn__drawer nano-theme-dark", placement: "start", open: this.overflowOpen, onNanoAfterHide: () => (this.overflowOpen = false), onNanoAfterShow: () => (this.overflowOpen = true) }, h("div", { key: 'c4cbe27955caffeb4f4a7dc755b6b08bf40a7f48', class: "gn__drawer-header", part: "overflow-header", slot: "label" }, "Main menu"), h("nav", { key: '26ec816c93427ce9f9cc4025e327b5e6cf9ba3e2', class: "gn__drawer-menu", part: "overflow-menu" }, this.breakpoint > bpps.mainMenu.breakpoint
             ? bpps.mainMenu.tpl()
-            : '', h("slot", { key: 'b6bf65e8ed92636f1eba4b376ecb2fd617bcd67f', name: "overflow" }))), h("div", { key: 'b7a5e9d074b63f1841d3946d0166389c73161f25', class: "gn__menu-bar-wrapper" }, h("div", { key: '6b4d27a83ed4cbf3a62c0b924b08c887e415904a', class: "gn__menu-bar", part: "menu-bar", ref: (el) => (this.mainMenuBar = el) }, h("nav", { key: 'bf3736fc4eb98e53a04357e30cd49fab8bf9ef7d', "aria-label": "Global navigation", class: `gn__main-menu ${this.shouldResize ? 'resizing' : ''}`, part: "main-menu", ref: (el) => (this.mainMenu = el) }, this.breakpoint > bpps.mainMenu.breakpoint && (h("nano-icon-button", { key: 'fb90f7ea03281cd5543b7723df27ac704367e43f', class: "gn__overflow-button", iconName: "light/bars", label: "Open Menu", onClick: () => this.overflowMenu.show() })), h("slot", { key: '94e0abe01ad7562fb72abde08ebad80e95d11042', name: "logo" }, h("a", { key: '1b01613c642f2bfd1df9df3d35517c6261f40b41', href: this.logoUrl, class: "gn__logo-link", part: "logo-link" }, this.breakpoint <= bpps.logo.breakpoint ? (h("img", { src: getAssetPath('../nano-assets/ont-logo.svg'), alt: `Oxford Nanopore Technologies logo. Features a stylised representation of a nanopore,
+            : '', h("slot", { key: '0693a9f4afdf63e63151b3f3fd4d3a0bbedde4ef', name: "overflow" }))), h("div", { key: 'd9ff383fb0f91876a533e8eb98bc47817b044729', class: "gn__menu-bar-wrapper" }, h("div", { key: '4536fd7593626672f20191b197a55b3d7b10b633', class: "gn__menu-bar", part: "menu-bar", ref: (el) => (this.mainMenuBar = el) }, h("nav", { key: 'ad22eb106a5d9c0ffd8eac8e5e995833f8adcd7e', "aria-label": "Global navigation", class: `gn__main-menu ${this.shouldResize ? 'resizing' : ''}`, part: "main-menu", ref: (el) => (this.mainMenu = el) }, this.breakpoint > bpps.mainMenu.breakpoint && (h("nano-icon-button", { key: 'c399d0e0c2a909a94a0b93ad00ebc5cb34e8c224', class: "gn__overflow-button", iconName: "light/bars", label: "Open Menu", onClick: () => this.overflowMenu.show() })), h("slot", { key: 'ee03de047e3937687e722a88e34356ffc151a9e9', name: "logo" }, h("a", { key: 'a39aad67426cdc5ce75fa334a303229bfab9e58c', href: this.logoUrl, class: "gn__logo-link", part: "logo-link" }, this.breakpoint <= bpps.logo.breakpoint ? (h("img", { src: getAssetPath('../nano-assets/ont-logo.svg'), alt: `Oxford Nanopore Technologies logo. Features a stylised representation of a nanopore,
                             (a tiny protein channel embedded in a membrane) through which DNA or RNA molecules are passed in for sequencing.`, class: "gn__logo gn__logo--large", width: "152", height: "36", part: "logo logo--large" })) : (h("img", { src: getAssetPath('../nano-assets/ont-wheel.svg'), alt: `Oxford Nanopore Technologies logo. A stylised representation of a nanopore,
-                            (a tiny protein channel embedded in a membrane) through which DNA or RNA molecules are passed in for sequencing.`, class: "gn__logo gn__logo--small", width: "36", height: "36", part: "logo logo--small" })))), this.breakpoint <= bpps.mainMenu.breakpoint && (h("div", { key: '6b303f5b2de6b26a5ec9480e08a0269fcf2f6857', class: "gn__main-menu-links" }, bpps.mainMenu.tpl())), h("div", { key: 'c2a63e53e7d72e5fabf40190d78d780d25f34c99', class: "gn__main-menu-actions" }, !this.myAccountData ||
-            (!!this.searchIndices.length && (h("nano-dropdown", { key: '1ec162b4ecbfc8360d152780cb29a6274cca3d7d', dialogTitle: "Search Oxford Nanopore Technologies", placement: "bottom", class: "gn__search-dropdown", skidding: -30, distance: 25, open: this.searchBarShown, onNanoAfterShow: this.handleSearchOpenEvent, onNanoAfterHide: this.handleSearchCloseEvent, autoOpen: !!this.searchIndices.length }, h("nano-icon-button", { key: '978738e596466f583580e48b330a96bac0b14fdc', class: "gn__search-button", slot: "trigger", iconName: "light/magnifying-glass", label: "Search" }), h("form", { key: '6227358213b66c38888cce78218291144c33ca71', ref: (form) => (this.searchForm = form), class: "gn__search-form", part: "search-form", onSubmit: this.onSearchSubmit }, this.searchIndices.length > 1 && (h("nano-select", { key: '36c4fe6caebc5e38702987ae9e3ba05d79e7ae28', part: "search-select", label: "Which site do you wish to search in?", mask: true, hideLabel: true, value: this.activeIndex?.index, onNanoChange: this.handleSearchIndexChangeEvent }, this.searchIndices.map((index) => (h("nano-option", { selected: index.name === this.searchIndex, value: index.index }, index.name || index.index))))), h("nano-input", { key: 'd10bf62d983978ab9a3c20f0cd1f64e543dea593', ref: (ele) => (this.searchInput = ele), part: "search-input", label: "Search Oxford Nanopore Technologies", placeholder: "Search Oxford Nanopore...", hideLabel: true, clearable: true, showInlineError: false, onNanoChange: (e) => {
+                            (a tiny protein channel embedded in a membrane) through which DNA or RNA molecules are passed in for sequencing.`, class: "gn__logo gn__logo--small", width: "36", height: "36", part: "logo logo--small" })))), this.breakpoint <= bpps.mainMenu.breakpoint && (h("div", { key: '46a926ede075e0bfde746fa174c0700a48bc308e', class: "gn__main-menu-links" }, bpps.mainMenu.tpl())), h("div", { key: 'e473ba724a01a0f596f6494b7bb452eef0c4ba53', class: "gn__main-menu-actions" }, !this.myAccountData ||
+            (!!this.searchIndices.length && (h("nano-dropdown", { key: '90fa8c9cc0566374afce5f8c722aa98176372d7d', dialogTitle: "Search Oxford Nanopore Technologies", placement: "bottom", class: "gn__search-dropdown", skidding: -30, distance: 25, open: this.searchBarShown, onNanoAfterShow: this.handleSearchOpenEvent, onNanoAfterHide: this.handleSearchCloseEvent, autoOpen: !!this.searchIndices.length }, h("nano-icon-button", { key: '73c7c855dd6baf3259429d55c9bf3d58c2e8ec03', class: "gn__search-button", slot: "trigger", iconName: "light/magnifying-glass", label: "Search" }), h("form", { key: 'f265a2ba3269f22c2efcbe73c7ffe4328fe9d0e8', ref: (form) => (this.searchForm = form), class: "gn__search-form", part: "search-form", onSubmit: this.onSearchSubmit }, this.searchIndices.length > 1 && (h("nano-select", { key: '498ea9e7b0dd5bb10dd92b2df0fccc76295b1042', part: "search-select", label: "Which site do you wish to search in?", mask: true, hideLabel: true, value: this.activeIndex?.index, onNanoChange: this.handleSearchIndexChangeEvent }, this.searchIndices.map((index) => (h("nano-option", { selected: index.name === this.searchIndex, value: index.index }, index.name || index.index))))), h("nano-input", { key: '78baa1860b433e8ee36cd6f2d34d026a7c1e8b21', ref: (ele) => (this.searchInput = ele), part: "search-input", label: "Search Oxford Nanopore Technologies", placeholder: "Search Oxford Nanopore...", hideLabel: true, clearable: true, showInlineError: false, onNanoChange: (e) => {
                     this.handleSearchTermChangeEvent(e.detail.value);
-                }, onNanoInput: this.handleSearchTermInputEvent, debounce: 500, value: this._searchValue }, h("nano-icon", { key: 'f5d7f79ac22c414adb0d02219a215618ccd89a7b', slot: "end", name: "light/magnifying-glass" }), h("nano-datalist", { key: 'a80c13a3d9382c730408d80f7f2058ca886678d2', class: "gn__search-results", onNanoSelect: (e) => e.preventDefault(), dropDownConfig: { tetherTo: this.searchForm }, disableFilter: true }, this.searchLoading && (h("div", { key: '1671b2988094fbefc0f3a7dfc09dd03688141e12', slot: "no-result", class: "gn__search-loading" }, h("nano-spinner", { key: 'dd88116ffa3881fe272673d57686f12159f056e4' }, "Searching..."))), this.noResultPartial(), !!this.autocompleteResults?.hits.length && [
+                }, onNanoInput: this.handleSearchTermInputEvent, debounce: 500, value: this._searchValue }, h("nano-icon", { key: 'f3b612bba31b0b1a930b170711080bce93324322', slot: "end", name: "light/magnifying-glass" }), h("nano-datalist", { key: 'a264479248b83b20cb42155e09c3033356a221b4', class: "gn__search-results", onNanoSelect: (e) => e.preventDefault(), dropDownConfig: { tetherTo: this.searchForm }, disableFilter: true }, this.searchLoading && (h("div", { key: '21d365a6554c31144d57900ec8cf50e6caa105b2', slot: "no-result", class: "gn__search-loading" }, h("nano-spinner", { key: 'b4f28c952fcfe765dea3ab7e4c0691e10de1317e' }, "Searching..."))), this.noResultPartial(), !!this.autocompleteResults?.hits.length && [
                 this.autocompleteResults.hits.map((hit, i) => (h("nano-option", { href: hit.url, class: "gn__search-result", onClick: () => {
                         searchInsight.sendClick({
                             index: this.activeIndex.index,
@@ -506,10 +510,10 @@ const GlobalNav = class {
                             positions: [i + 1],
                         });
                     } }, h("span", { innerHTML: this.autocompleteSnippet(hit) })))),
-                h("nano-option", { key: 'acbff4930245aabfbfe3d94cccbf0916a6419509', class: "gn__search-viewall", onNanoSelect: this.onSearchSubmit }, "View all results"),
-            ])))))), h("div", { key: '91cdf552cbf807a5f307da6381ff16fbba419bbe', class: "gn__cart" }, h("nano-icon-button", { key: '19c225ced356309ee741c74bc07fa7238e7bc9ff', iconName: "light/cart-shopping", label: "View your cart", href: this.cartUrl }), !!this.cartCount && (h("nano-badge", { key: '6c7d8a2da3276c017cb67f58b48a7358db22b428', theme: "danger", strength: "2" }, this.cartCount > 9 ? '9+' : this.cartCount))), this.breakpoint <= bpps.contact.breakpoint
+                h("nano-option", { key: 'b2a1dc7ff83c80599377850136d6233fa64cee3c', class: "gn__search-viewall", onNanoSelect: this.onSearchSubmit }, "View all results"),
+            ])))))), h("div", { key: '38bc65edb00ef4876340fdfc1f308a6805a1e1ec', class: "gn__cart" }, h("nano-icon-button", { key: 'b590faedc935181b9230c82509360ddc2a19f1cf', iconName: "light/cart-shopping", label: "View your cart", href: this.cartUrl }), !!this.cartCount && (h("nano-badge", { key: 'c7f45eea27607c6d4380ccdf3a7f2cacfd26bc80', theme: "danger", strength: "2" }, this.cartCount > 9 ? '9+' : this.cartCount))), this.breakpoint <= bpps.contact.breakpoint
             ? bpps.contact.tpl()
-            : '', this.isLoggedIn ? (h("nano-dropdown", { dialogTitle: "User menu", class: "gn__user-dropdown", distance: 10, placement: "bottom-end" }, h("button", { slot: "trigger", class: "gn__user-dropdown-trigger" }, h("nano-icon", { name: "light/user" }), h("nano-icon", { name: "light/chevron-down", class: "gn__user-dropdown-chevron" }), !!this.msgCount && (h("nano-badge", { theme: "danger", strength: "2" }, this.msgCount > 9 ? '9+' : this.msgCount))), this.loggedInPanel())) : (h("nano-cta", { secondary: true, size: "small", icon: "false", class: "gn__login-cta" }, h("a", { href: this.formatLoginLink(this.loginUrl) }, "Login"))))))), h("nano-global-search-results", { key: '7a58924f37e6f4517bec274b3a878a6e3d3e2553', part: "site-search-results" }, h("div", { key: '062c09847198b236c0731d6653584115ddd46e71', class: "gn__site", part: "site-wrapper" }, h("slot", { key: '971633747f2ec2a6a4dbee587a5a5ccfaaedc088' }))))));
+            : '', this.isLoggedIn ? (h("nano-dropdown", { dialogTitle: "User menu", class: "gn__user-dropdown", distance: 10, placement: "bottom-end" }, h("button", { slot: "trigger", class: "gn__user-dropdown-trigger" }, h("nano-icon", { name: "light/user" }), h("nano-icon", { name: "light/chevron-down", class: "gn__user-dropdown-chevron" }), !!this.msgCount && (h("nano-badge", { theme: "danger", strength: "2" }, this.msgCount > 9 ? '9+' : this.msgCount))), this.loggedInPanel())) : (h("nano-cta", { secondary: true, size: "small", icon: "false", class: "gn__login-cta" }, h("a", { href: this.formatLoginLink(this.loginUrl) }, "Login"))))))), h("nano-global-search-results", { key: '6443d9f0199f87ba5ca73b62b6c3c9e5700731b4', part: "site-search-results" }, h("div", { key: 'db0ce2d9157f7144b0c50d0833386ed4eeabdd02', class: "gn__site", part: "site-wrapper" }, h("slot", { key: 'a9ac7197c149153532f16f8f0f428b5e46d11b72' }))))));
     }
     static get assetsDirs() { return ["assets"]; }
     static get watchers() { return {

package/dist/esm/{table.worker-DftFV8Z7.js → table.worker-BMDbprO8.js}

@@ -1,7 +1,7 @@
 /*!
  * Custom elements for Nanopore-Digital Web applications
  */
-import { c as createWorker } from './nano-data-table-BXdzSqWC.js';
+import { c as createWorker } from './nano-data-table-Bn4l0Q3q.js';
 import './index-BM3Om9WE.js';
 import './renderer-DpNDfhNy.js';
 import './math-BEqsTfVK.js';
@@ -12,7 +12,7 @@ import './index-BlBZYxu4.js';
 
 const workerName = 'table.worker';
 const workerMsgId = 'stencil.table.worker';
-const workerPath = new URL('table.worker-TTndpijX.js', import.meta.url).href;
+const workerPath = new URL('table.worker-DM_2DNEe.js', import.meta.url).href;
 let worker;
 try {
   // first try directly starting the worker with the URL

package/dist/{nano-components/table.worker-TTndpijX.js → esm/table.worker-DM_2DNEe.js}

@@ -1,4 +1,4 @@
 /*!
  * Custom elements for Nanopore-Digital Web applications
  */
-(()=>{const n=(n,t)=>{const r=globalThis[t];return null!=r&&n instanceof r},t=r=>{if(null!=r){if(n(r,"ArrayBuffer")||n(r,"MessagePort")||n(r,"ImageBitmap")||n(r,"OffscreenCanvas"))return[r];if("object"==typeof r)return r.constructor===Object&&(r=Object.values(r)),Array.isArray(r)?r.flatMap(t):t(r.buffer)}return[]},r={},e="stencil.table.worker",o=e+".cb";addEventListener("message",(async({data:n})=>{if(n&&n[0]===e){let u,i,c=n[1],s=n[2],f=n[3],a=0,l=f.length;try{for(;a<l;a++)if(Array.isArray(f[a])&&f[a][0]===o){const n=f[a][1];f[a]=(...t)=>{postMessage([o,n,t])}}u=await r[s](...f)}catch(n){u=null,i=n instanceof Error?{isError:!0,value:{message:n.message,name:n.name,stack:n.stack}}:{isError:!1,value:n},u=void 0}const p=t(u);postMessage([e,c,u,i],p)}}));var u,i,c="undefined"!=typeof globalThis?globalThis:"undefined"!=typeof window?window:"undefined"!=typeof global?global:"undefined"!=typeof self?self:{};function s(n){return n&&n.__esModule&&Object.prototype.hasOwnProperty.call(n,"default")?n.default:n}var f=s(function(){if(i)return u;i=1;var n=/[\\^$.*+?()[\]{}|]/g,t=RegExp(n.source),r="object"==typeof self&&self&&self.Object===Object&&self,e="object"==typeof c&&c&&c.Object===Object&&c||r||Function("return this")(),o=Object.prototype.toString,s=e.Symbol,f=s?s.prototype:void 0,a=f?f.toString:void 0;return u=function(r){var e;return(r=null==(e=r)?"":function(n){if("string"==typeof n)return n;if(function(n){return"symbol"==typeof n||function(n){return!!n&&"object"==typeof n}(n)&&"[object Symbol]"==o.call(n)}(n))return a?a.call(n):"";var t=n+"";return"0"==t&&1/n==-1/0?"-0":t}(e))&&t.test(r)?r.replace(n,"\\$&"):r}}());function a(n,t,r,e){if("object"!=typeof n){if("exists"===t.type)return!!t.key.test(r.join("."))&&!!n;{const o=r.join(".");for(const n of e.ignorePaths)if(n.test(o))return!1;if(e.includePaths){let n=!1;for(const t of e.includePaths)if(t.test(o)){n=!0;break}if(!n)return!1}return!(t.key&&!t.key.test(o))&&function(n,t){return"string"==typeof n?t.checkString(n):"number"==typeof n&&t.checkNumber(n)}(n,t)}}if(Array.isArray(n)){for(const o of n)if(a(o,t,r,e))return!0}else for(const o in n){r.push(o);const u=a(n[o],t,r,e);if(r.pop(),u)return!0}return!1}function l(n,t,r,e){if(t.length>0){let o=!1;for(const u of t)if(a(n,u,[],e)?!u.negate:u.negate){if("OR"===r)return!0;o=!0}else if("AND"===r)return!1;return o}return!0}function p(n,t){const r=[];let e=!1,o=0,u="";for(let i=0;i<n.length;i++){const c=n[i];e?c===u&&(e=!1,u=""):'"'===c||"'"===c?(e=!0,u=c):c.match(t)&&!e&&(r.push(n.slice(o,i).trim()),o=i+1),i===n.length-1&&r.push(n.slice(o).trim())}return r.map((n=>n.startsWith('"')&&n.endsWith('"')||n.startsWith("'")&&n.endsWith("'")?n.slice(1,-1):n)).filter(Boolean)}const d={"<":function(n){const t=Number(n[0]);return n=>n<t},"<=":function(n){const t=Number(n[0]);return n=>n<=t},"=":function(n){const t=n[0].split(",").filter(Boolean).map(Number);return n=>{for(const r of t)if(n===r)return!0;return!1}},">=":function(n){const t=Number(n[0]);return n=>n>=t},">":function(n){const t=Number(n[0]);return n=>n>t},"..":function(n){const t=Number(n[0]),r=Number(n[1]);return n=>n>=t&&n<=r}};function w(n){const{values:t,operator:r}=function(n){const t=/^\s*\(?\s*(?<startOperator><=|>=|<|=|>|\.\.\s*)?\s*(?<firstValue>-?\d*\.?\d+)\s*(?:(?<afterDots>\.\.)\s*(?<secondValue>-?\d*\.?\d*))?\s*\)?\s*$/.exec(n);if(!t)return{operator:"=",values:[n]};if(!t.groups)throw new Error("unreachable");const{startOperator:r,firstValue:e,afterDots:o,secondValue:u}=t.groups;let i=r;const c=e?[e]:[];return".."===r?i="<=":r||!o||u?o&&(i=".."):i=">=",u&&(Number(u)<Number(e)?c.unshift(u):c.push(u)),{values:c,operator:i||"="}}(n),e=d[r];if(!e)throw new Error(`unknown operator ${r}`);return e(t)}const h={"<":function(n){return t=>t<n[0]},"<=":function(n){return t=>t<=n[0]},"=":function(n,t){const r=p(n[0],",").filter(Boolean).map((n=>new RegExp(`^${f(n)}$`,t)));return n=>{for(const t of r)if(t.test(n))return!0;return!1}},"~":function(n,t){const r=p(n[0],",").filter(Boolean).map((n=>new RegExp(f(n),t)));return n=>{for(const t of r)if(t.test(n))return!0;return!1}},">=":function(n){return t=>t>=n[0]},">":function(n){return t=>t>n[0]},"..":function(n){return t=>t>=n[0]&&t<=n[1]}};function y(n,t){const{values:r,operator:e}=function(n){const t=n.split(".."),r=/^\s*\(?(?<operator><=|<|=|>=|>)?\s*(?<value>\S*)\s*\)?$/.exec(t[0]);if(!r)return{operator:"~",values:[n]};if(!r.groups)throw new Error("unreachable");const{value:e}=r.groups;let{operator:o}=r.groups;const u=t[1]?.trim();let i=[e];return t.length>1&&(o="..",u?e?e<u?i.push(u):i.unshift(u):(i=[u],o="<="):o=">="),{operator:o||"~",values:i}}(n),o=h[e];if(!o)throw new Error(`unreachable unknown operator ${e}`);return o(r,t)}function b(n,t={}){const{index:r=!1,predicate:e="AND",ignorePaths:o=[],includePaths:u,pathAlias:i={}}=t,c=t.limit||1/0,s=t.caseSensitive?"":"i";let a=t.keywords||[];const d=function(n,t){const{insensitive:r}=t,e={};for(const[t,o]of Object.entries(n))e[t]=o instanceof RegExp?o:new RegExp(`(^|\\.)${f(o)}(\\.|$)`,r);return e}(i,{insensitive:s}),h=o.map((n=>"string"==typeof n?new RegExp(`(^|\\.)${f(n)}(\\.|$)`,s):n)),b=u?u.map((n=>"string"==typeof n?new RegExp(`(^|\\.)${f(n)}(\\.|$)`,s):n)):void 0;"string"==typeof a&&(a=p(a,/[\t\n\r ]/));const g=function(n,t={}){return n.map((n=>function(n,t={}){const{caseSensitive:r,pathAlias:e={}}=t,o=r?"":"i";let u=!1;n.startsWith("-")&&(u=!0,n=n.slice(1));const i=n.indexOf(":");if(-1!==i){const t=n.slice(Math.max(0,i+1));if(i>0){const r=n.slice(0,Math.max(0,i));return"is"===r?{type:"exists",negate:u,key:new RegExp(`(^|\\.)${f(t)}(\\.|$)`,o)}:{type:"matches",negate:u,key:e[r]||new RegExp(`(^|\\.)${f(r)}(\\.|$)`,o),checkNumber:w(t),checkString:y(t,o)}}}return{type:"matches",negate:u,checkNumber:w(n),checkString:y(n,o)}}(n,t)))}(a,{caseSensitive:t.caseSensitive,pathAlias:d});let v=0;if(r){const t=[];for(let r=0;r<n.length&&v<c;r++)l(n[r],g,e,{ignorePaths:h,includePaths:b})&&(v=t.push(r));return t}{const t=[];for(let r=0;r<n.length&&v<c;r++)l(n[r],g,e,{ignorePaths:h,includePaths:b})&&(v=t.push(n[r]));return t}}const g=new Map;async function v(n,t){const r=g.get(n);if(!r)throw new Error("cannot find worker with ID "+n);if(r.searchTerm=t,!t||!t.length)return r.filterRows=r.rows,k(r,r.rows);const e=r.columns.filter((n=>!1!==n.searchable));return r.filterRows=b(r.rows,{keywords:t,predicate:"OR",includePaths:[...e.map((n=>n.prop))],ignorePaths:["__uuid","__index"]}),k(r,r.filterRows)}function m(n,t,r=[],e=!1){return r&&r.length||e||(r=function(n){return n.columns.filter((n=>null!=n.filter)).reduce(((n,t)=>{const{prop:r,filter:e}=t;return n.push({prop:r,filter:e}),n}),[])}(n)),r&&r.length?(r.forEach((n=>{t="boolean"==typeof n.filter?t.filter((t=>t[n.prop]===n.filter)):b(t,{predicate:"string"==typeof n.filter?"AND":"OR",keywords:n.filter,includePaths:[n.prop],ignorePaths:["__uuid","__index"]})})),t):t}function E(n,t,r,e){if(!r&&!e){const t=function(n){const t=n.columns.find((n=>!!n.order));if(t){const{prop:n,order:r}=t;return{prop:n,order:r}}return null}(n);t&&({prop:r,order:e}=t)}if(!r||!e||!t.length)return t;const o=n.columns.find((n=>n.prop===r));return o?.sortCompareFn&&"function"==typeof o.sortCompareFn?t.slice().sort(o.sortCompareFn(r,e)):"text"===o?.type&&"string"==typeof t[0][r]?t.slice().sort(((n,t)=>n[r]?t[r]?"asc"===e?n[r].localeCompare(t[r]):t[r].localeCompare(n[r]):-1:1)):t.slice().sort(((n,t)=>[void 0,null].includes(n[r])?1:[void 0,null].includes(t[r])?-1:n[r]<t[r]?"asc"===e?-1:1:n[r]>t[r]?"asc"===e?1:-1:0))}function k(n,t){return E(n,t=m(n,t))}function $(n){return n.map((n=>(n?.sortCompareFn&&"string"==typeof n.sortCompareFn&&(n.sortCompareFn=new Function("return "+n.sortCompareFn)()),n)))}async function x(n){g.delete(n)}r.createWorkerStore=async function(n,t){const r=Date.now().toString(36)+Math.random().toString(36).substring(2);return g.set(r,{rows:n,columns:$(t)}),r},r.destroyWorkerStore=x,r.syncConfigToWorker=async function(n,t){const r=g.get(n);if(!r)throw new Error("cannot find worker with ID "+n);return r.columns=$(t),r.rows||r.columns||x(n),!0},r.syncDataToWorker=async function(n,t){const r=g.get(n);if(!r)throw new Error("cannot find worker with ID "+n);return r.rows=t,r.rows||r.columns||x(n),!0},r.workerFilter=async function(n,t){const r=g.get(n);if(!r)throw new Error("cannot find worker with ID "+n);const e=t&&t.length||!r.searchTerm?r.searchTerm?r.filterRows:r.rows:await v(n,r.searchTerm);return r.filterRows=m(r,e,t,!0),E(r,r.filterRows)},r.workerSearch=v,r.workerSort=async function(n,t,r){const e=g.get(n);if(!e)throw new Error("cannot find worker with ID "+n);return E(e,e.filterRows||e.rows,t,r)}})();
+(()=>{const n=(n,t)=>{const r=globalThis[t];return null!=r&&n instanceof r},t=r=>{if(null!=r){if(n(r,"ArrayBuffer")||n(r,"MessagePort")||n(r,"ImageBitmap")||n(r,"OffscreenCanvas"))return[r];if("object"==typeof r)return r.constructor===Object&&(r=Object.values(r)),Array.isArray(r)?r.flatMap(t):t(r.buffer)}return[]},r={},e="stencil.table.worker",o=e+".cb";addEventListener("message",(async({data:n})=>{if(n&&n[0]===e){let u,i,c=n[1],s=n[2],f=n[3],a=0,l=f.length;try{for(;a<l;a++)if(Array.isArray(f[a])&&f[a][0]===o){const n=f[a][1];f[a]=(...t)=>{postMessage([o,n,t])}}u=await r[s](...f)}catch(n){u=null,i=n instanceof Error?{isError:!0,value:{message:n.message,name:n.name,stack:n.stack}}:{isError:!1,value:n},u=void 0}const p=t(u);postMessage([e,c,u,i],p)}}));var u,i,c="undefined"!=typeof globalThis?globalThis:"undefined"!=typeof window?window:"undefined"!=typeof global?global:"undefined"!=typeof self?self:{};function s(n){return n&&n.__esModule&&Object.prototype.hasOwnProperty.call(n,"default")?n.default:n}var f=s(function(){if(i)return u;i=1;var n=/[\\^$.*+?()[\]{}|]/g,t=RegExp(n.source),r="object"==typeof self&&self&&self.Object===Object&&self,e="object"==typeof c&&c&&c.Object===Object&&c||r||Function("return this")(),o=Object.prototype.toString,s=e.Symbol,f=s?s.prototype:void 0,a=f?f.toString:void 0;return u=function(r){var e;return(r=null==(e=r)?"":function(n){if("string"==typeof n)return n;if(function(n){return"symbol"==typeof n||function(n){return!!n&&"object"==typeof n}(n)&&"[object Symbol]"==o.call(n)}(n))return a?a.call(n):"";var t=n+"";return"0"==t&&1/n==-1/0?"-0":t}(e))&&t.test(r)?r.replace(n,"\\$&"):r}}());function a(n,t,r,e){if("object"!=typeof n){if("exists"===t.type)return!!t.key.test(r.join("."))&&!!n;{const o=r.join(".");for(const n of e.ignorePaths)if(n.test(o))return!1;if(e.includePaths){let n=!1;for(const t of e.includePaths)if(t.test(o)){n=!0;break}if(!n)return!1}return!(t.key&&!t.key.test(o))&&function(n,t){return"string"==typeof n?t.checkString(n):"number"==typeof n&&t.checkNumber(n)}(n,t)}}if(Array.isArray(n)){for(const o of n)if(a(o,t,r,e))return!0}else for(const o in n){r.push(o);const u=a(n[o],t,r,e);if(r.pop(),u)return!0}return!1}function l(n,t,r,e){if(t.length>0){let o=!1;for(const u of t)if(a(n,u,[],e)?!u.negate:u.negate){if("OR"===r)return!0;o=!0}else if("AND"===r)return!1;return o}return!0}function p(n,t){const r=[];let e=!1,o=0,u="";for(let i=0;i<n.length;i++){const c=n[i];e?c===u&&(e=!1,u=""):'"'===c||"'"===c?(e=!0,u=c):c.match(t)&&!e&&(r.push(n.slice(o,i).trim()),o=i+1),i===n.length-1&&r.push(n.slice(o).trim())}return r.map((n=>n.startsWith('"')&&n.endsWith('"')||n.startsWith("'")&&n.endsWith("'")?n.slice(1,-1):n)).filter(Boolean)}const d={"<":function(n){const t=Number(n[0]);return n=>n<t},"<=":function(n){const t=Number(n[0]);return n=>n<=t},"=":function(n){const t=n[0].split(",").filter(Boolean).map(Number);return n=>{for(const r of t)if(n===r)return!0;return!1}},">=":function(n){const t=Number(n[0]);return n=>n>=t},">":function(n){const t=Number(n[0]);return n=>n>t},"..":function(n){const t=Number(n[0]),r=Number(n[1]);return n=>n>=t&&n<=r}};function w(n){const{values:t,operator:r}=function(n){const t=/^\s*\(?\s*(?<startOperator><=|>=|<|=|>|\.\.\s*)?\s*(?<firstValue>-?\d*\.?\d+)\s*(?:(?<afterDots>\.\.)\s*(?<secondValue>-?\d*\.?\d*))?\s*\)?\s*$/.exec(n);if(!t)return{operator:"=",values:[n]};if(!t.groups)throw new Error("unreachable");const{startOperator:r,firstValue:e,afterDots:o,secondValue:u}=t.groups;let i=r;const c=e?[e]:[];return".."===r?i="<=":r||!o||u?o&&(i=".."):i=">=",u&&(Number(u)<Number(e)?c.unshift(u):c.push(u)),{values:c,operator:i||"="}}(n),e=d[r];if(!e)throw new Error(`unknown operator ${r}`);return e(t)}const h={"<":function(n){return t=>t<n[0]},"<=":function(n){return t=>t<=n[0]},"=":function(n,t){const r=p(n[0],",").filter(Boolean).map((n=>new RegExp(`^${f(n)}$`,t)));return n=>{for(const t of r)if(t.test(n))return!0;return!1}},"~":function(n,t){const r=p(n[0],",").filter(Boolean).map((n=>new RegExp(f(n),t)));return n=>{for(const t of r)if(t.test(n))return!0;return!1}},">=":function(n){return t=>t>=n[0]},">":function(n){return t=>t>n[0]},"..":function(n){return t=>t>=n[0]&&t<=n[1]}};function y(n,t){const{values:r,operator:e}=function(n){const t=n.split(".."),r=/^\s*\(?(?<operator><=|<|=|>=|>)?\s*(?<value>\S*)\s*\)?$/.exec(t[0]);if(!r)return{operator:"~",values:[n]};if(!r.groups)throw new Error("unreachable");const{value:e}=r.groups;let{operator:o}=r.groups;const u=t[1]?.trim();let i=[e];return t.length>1&&(o="..",u?e?e<u?i.push(u):i.unshift(u):(i=[u],o="<="):o=">="),{operator:o||"~",values:i}}(n),o=h[e];if(!o)throw new Error(`unreachable unknown operator ${e}`);return o(r,t)}function g(n,t={}){const{index:r=!1,predicate:e="AND",ignorePaths:o=[],includePaths:u,pathAlias:i={}}=t,c=t.limit||1/0,s=t.caseSensitive?"":"i";let a=t.keywords||[];const d=function(n,t){const{insensitive:r}=t,e={};for(const[t,o]of Object.entries(n))e[t]=o instanceof RegExp?o:new RegExp(`(^|\\.)${f(o)}(\\.|$)`,r);return e}(i,{insensitive:s}),h=o.map((n=>"string"==typeof n?new RegExp(`(^|\\.)${f(n)}(\\.|$)`,s):n)),g=u?u.map((n=>"string"==typeof n?new RegExp(`(^|\\.)${f(n)}(\\.|$)`,s):n)):void 0;"string"==typeof a&&(a=p(a,/[\t\n\r ]/));const b=function(n,t={}){return n.map((n=>function(n,t={}){const{caseSensitive:r,pathAlias:e={}}=t,o=r?"":"i";let u=!1;n.startsWith("-")&&(u=!0,n=n.slice(1));const i=n.indexOf(":");if(-1!==i){const t=n.slice(Math.max(0,i+1));if(i>0){const r=n.slice(0,Math.max(0,i));return"is"===r?{type:"exists",negate:u,key:new RegExp(`(^|\\.)${f(t)}(\\.|$)`,o)}:{type:"matches",negate:u,key:e[r]||new RegExp(`(^|\\.)${f(r)}(\\.|$)`,o),checkNumber:w(t),checkString:y(t,o)}}}return{type:"matches",negate:u,checkNumber:w(n),checkString:y(n,o)}}(n,t)))}(a,{caseSensitive:t.caseSensitive,pathAlias:d});let v=0;if(r){const t=[];for(let r=0;r<n.length&&v<c;r++)l(n[r],b,e,{ignorePaths:h,includePaths:g})&&(v=t.push(r));return t}{const t=[];for(let r=0;r<n.length&&v<c;r++)l(n[r],b,e,{ignorePaths:h,includePaths:g})&&(v=t.push(n[r]));return t}}function b(n,t){if(!n||null==t)return;const r=String(t);if(void 0!==n[r])return n[r];if(!r.includes("."))return n[t];const e=r.split(".");let o=n;for(const n of e){if(null==o)return;o=o[n]}return o}const v=new Map;async function m(n,t){const r=v.get(n);if(!r)throw new Error("cannot find worker with ID "+n);if(r.searchTerm=t,!t||!t.length)return r.filterRows=r.rows,$(r,r.rows);const e=r.columns.filter((n=>!1!==n.searchable));return r.filterRows=g(r.rows,{keywords:t,predicate:"OR",includePaths:[...e.map((n=>n.prop))],ignorePaths:["__uuid","__index"]}),$(r,r.filterRows)}function E(n,t,r=[],e=!1){return r&&r.length||e||(r=function(n){return n.columns.filter((n=>null!=n.filter)).reduce(((n,t)=>{const{prop:r,filter:e}=t;return n.push({prop:r,filter:e}),n}),[])}(n)),r&&r.length?(r.forEach((n=>{t="boolean"==typeof n.filter?t.filter((t=>b(t,n.prop)===n.filter)):g(t,{predicate:"string"==typeof n.filter?"AND":"OR",keywords:n.filter,includePaths:[n.prop],ignorePaths:["__uuid","__index"]})})),t):t}function k(n,t,r,e){if(!r&&!e){const t=function(n){const t=n.columns.find((n=>!!n.order));if(t){const{prop:n,order:r}=t;return{prop:n,order:r}}return null}(n);t&&({prop:r,order:e}=t)}if(!r||!e||!t.length)return t;const o=n.columns.find((n=>n.prop===r));return o?.sortCompareFn&&"function"==typeof o.sortCompareFn?t.slice().sort(o.sortCompareFn(r,e)):"text"===o?.type&&"string"==typeof b(t[0],r)?t.slice().sort(((n,t)=>{const o=b(n,r),u=b(t,r);return o?u?"asc"===e?o.localeCompare(u):u.localeCompare(o):-1:1})):t.slice().sort(((n,t)=>{const o=b(n,r),u=b(t,r);return[void 0,null].includes(o)?1:[void 0,null].includes(u)?-1:o<u?"asc"===e?-1:1:o>u?"asc"===e?1:-1:0}))}function $(n,t){return k(n,t=E(n,t))}function x(n){return n.map((n=>(n?.sortCompareFn&&"string"==typeof n.sortCompareFn&&(n.sortCompareFn=new Function("return "+n.sortCompareFn)()),n)))}async function N(n){v.delete(n)}r.createWorkerStore=async function(n,t){const r=Date.now().toString(36)+Math.random().toString(36).substring(2);return v.set(r,{rows:n,columns:x(t)}),r},r.destroyWorkerStore=N,r.syncConfigToWorker=async function(n,t){const r=v.get(n);if(!r)throw new Error("cannot find worker with ID "+n);return r.columns=x(t),r.rows||r.columns||N(n),!0},r.syncDataToWorker=async function(n,t){const r=v.get(n);if(!r)throw new Error("cannot find worker with ID "+n);return r.rows=t,r.rows||r.columns||N(n),!0},r.workerFilter=async function(n,t){const r=v.get(n);if(!r)throw new Error("cannot find worker with ID "+n);const e=t&&t.length||!r.searchTerm?r.searchTerm?r.filterRows:r.rows:await m(n,r.searchTerm);return r.filterRows=E(r,e,t,!0),k(r,r.filterRows)},r.workerSearch=m,r.workerSort=async function(n,t,r){const e=v.get(n);if(!e)throw new Error("cannot find worker with ID "+n);return k(e,e.filterRows||e.rows,t,r)}})();

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

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

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

@@ -1,4 +1,4 @@
 /*!
  * Custom elements for Nanopore-Digital Web applications
  */
-export{N as nano_data_table}from"./nano-data-table-BXdzSqWC.js";import"./index-BM3Om9WE.js";import"./renderer-DpNDfhNy.js";import"./math-BEqsTfVK.js";import"./throttle-C93FMm2Z.js";import"./scroll-1nFw8CNk.js";import"./dom-dlicJTEJ.js";import"./index-BlBZYxu4.js";
+export{N as nano_data_table}from"./nano-data-table-Bn4l0Q3q.js";import"./index-BM3Om9WE.js";import"./renderer-DpNDfhNy.js";import"./math-BEqsTfVK.js";import"./throttle-C93FMm2Z.js";import"./scroll-1nFw8CNk.js";import"./dom-dlicJTEJ.js";import"./index-BlBZYxu4.js";