@nanoporetech-digital/components 8.12.2 → 8.13.0

package/dist/types/components/slides/slides.d.ts

@@ -25,7 +25,6 @@ import type { FlickityOptions, Flickity, DragEvent, SlideAnimation } from './sli
 export declare class Slides implements ComponentInterface {
     private flickityEl;
     private flickityReady;
-    private mutationO?;
     private resizeO?;
     private readyflickity;
     private flickity;

package/dist/types/utils/renderer.d.ts

@@ -4,7 +4,7 @@ import { h as stencilH } from '../stencil-public-runtime';
  * @param tag
  * @returns the transformed tag
  */
-export declare function transformTag(tag: string): string;
+export declare function transformTag<T extends string>(tag: T): T;
 /**
  * Augment Stencil's `h()` function to add a tag prefix
  * @param args incoming JSX arguments

package/docs-json.json

@@ -1,5 +1,5 @@
 {
-  "timestamp": "2025-10-17T10:04:55",
+  "timestamp": "2025-10-29T14:52:38",
   "compiler": {
     "name": "@stencil/core",
     "version": "4.36.1",
@@ -3369,7 +3369,7 @@
             "references": {
               "Breadcrumb": {
                 "location": "local",
-                "path": "/builds/8qhywLzS/0/Digital/nano-components/packages/components/src/components/breadcrumb/breadcrumb.tsx",
+                "path": "/builds/YtJk83se/0/Digital/nano-components/packages/components/src/components/breadcrumb/breadcrumb.tsx",
                 "id": "src/components/breadcrumb/breadcrumb.tsx::Breadcrumb"
               }
             }
@@ -4911,6 +4911,11 @@
         }
       ],
       "styles": [
+        {
+          "name": "--gap",
+          "annotation": "prop",
+          "docs": "The gap between checkboxes. Defaults to var(--nano-spacing-md)."
+        },
         {
           "name": "--help-msg-color",
           "annotation": "prop",

package/hydrate/index.js

@@ -3836,7 +3836,8 @@ class HasSlotController {
             // * Regular shadow DOM component *
             childNodes = [...this.host.shadowRoot.childNodes];
         }
-        else if (!this.host.classList.contains('hydrated')) {
+        else if (!this.host.classList.contains('hydrated') &&
+            this.host.__childNodes) {
             // * Non-shadow, polyfilled component *
             // Component has not done initial render. Return component internals
             childNodes = [...(this.host?.__childNodes ?? [])];
@@ -3846,7 +3847,7 @@ class HasSlotController {
             childNodes = [...this.host.childNodes];
         }
         return childNodes.some((node) => {
-            if (node.nodeType === Node.TEXT_NODE && node.textContent.trim() !== '') {
+            if (node.nodeType === Node.TEXT_NODE && !!node.textContent.trim()) {
                 return true;
             }
             if (node.nodeType === Node.ELEMENT_NODE) {
@@ -8470,7 +8471,7 @@ const getClassMap = (classes) => {
     return map;
 };
 
-const checkboxGroupCss = ".sc-nano-checkbox-group-h,*.sc-nano-checkbox-group,*.sc-nano-checkbox-group::before,*.sc-nano-checkbox-group::after{box-sizing:border-box}[hidden].sc-nano-checkbox-group{display:none !important}@media (prefers-reduced-motion: reduce){.sc-nano-checkbox-group-h,*.sc-nano-checkbox-group,*.sc-nano-checkbox-group::before,*.sc-nano-checkbox-group::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}.sc-nano-checkbox-group-h,*.sc-nano-checkbox-group,*.sc-nano-checkbox-group::before,*.sc-nano-checkbox-group::after{box-sizing:border-box}[hidden].sc-nano-checkbox-group{display:none !important}@media (prefers-reduced-motion: reduce){.sc-nano-checkbox-group-h,*.sc-nano-checkbox-group,*.sc-nano-checkbox-group::before,*.sc-nano-checkbox-group::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}.sc-nano-checkbox-group-h{--label-color:var(--nano-color-base-1000);--label-font-size:var(--nano-font-size-xs);--invalid-msg-color:var(--nano-color-danger-1100);--help-msg-color:var(--nano-color-base-1000);--more-font-size:var(--nano-font-size-2xs);display:block;inline-size:100%}.sc-nano-checkbox-group-h *.sc-nano-checkbox-group{box-sizing:inherit}.cbgroup.sc-nano-checkbox-group{margin:0;padding:0;border:0}.cbgroup__error.sc-nano-checkbox-group,.cbgroup__help.sc-nano-checkbox-group,.cbgroup__more.sc-nano-checkbox-group{display:block;inline-size:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.cbgroup__error.sc-nano-checkbox-group,.cbgroup__help.sc-nano-checkbox-group{inset-block-start:0;inset-inline-start:0;position:absolute;font-size:var(--more-font-size);line-height:1.2;transition:0.3s ease-out opacity;font-style:italic}.show-error.sc-nano-checkbox-group .cbgroup__error.sc-nano-checkbox-group,.show-error.sc-nano-checkbox-group .cbgroup__help.sc-nano-checkbox-group{opacity:1}.cbgroup__error.sc-nano-checkbox-group{color:var(--invalid-msg-color);opacity:0}.has-error.sc-nano-checkbox-group .cbgroup__error.sc-nano-checkbox-group{opacity:1}.cbgroup__help.sc-nano-checkbox-group{opacity:1;color:var(--help-msg-color)}.has-error.sc-nano-checkbox-group .cbgroup__help.sc-nano-checkbox-group{opacity:0}.cbgroup__more.sc-nano-checkbox-group{block-size:1em;margin-block:var(--nano-spacing-sm) 0;position:relative;opacity:0;display:none;transition:all var(--nano-transition-fast) ease;transition-behavior:allow-discrete}.has-helper.sc-nano-checkbox-group .cbgroup__more.sc-nano-checkbox-group,.has-error.sc-nano-checkbox-group .cbgroup__more.sc-nano-checkbox-group{display:block;opacity:1}.cbgroup__legend.sc-nano-checkbox-group{font-size:var(--nano-font-size-xs);line-height:var(--nano-line-height-normal);letter-spacing:var(--nano-letter-spacing-loose);padding:0 0 0.9375rem;margin:0;display:block;inline-size:100%}.cbgroup__legend.visually-hide.sc-nano-checkbox-group{clip-path:inset(50%);block-size:1px;overflow:hidden;position:absolute;white-space:nowrap;inline-size:1px}.cbgroup__cbs.sc-nano-checkbox-group{margin:0;padding:0;display:flex;flex-direction:column;gap:var(--nano-spacing-md)}.types-segment.sc-nano-checkbox-group-h .cbgroup__cbs.sc-nano-checkbox-group{flex-direction:row;gap:0}.types-tag.sc-nano-checkbox-group-h .cbgroup__cbs.sc-nano-checkbox-group{flex-direction:row;gap:var(--nano-spacing-sm)}";
+const checkboxGroupCss = ".sc-nano-checkbox-group-h,*.sc-nano-checkbox-group,*.sc-nano-checkbox-group::before,*.sc-nano-checkbox-group::after{box-sizing:border-box}[hidden].sc-nano-checkbox-group{display:none !important}@media (prefers-reduced-motion: reduce){.sc-nano-checkbox-group-h,*.sc-nano-checkbox-group,*.sc-nano-checkbox-group::before,*.sc-nano-checkbox-group::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}.sc-nano-checkbox-group-h,*.sc-nano-checkbox-group,*.sc-nano-checkbox-group::before,*.sc-nano-checkbox-group::after{box-sizing:border-box}[hidden].sc-nano-checkbox-group{display:none !important}@media (prefers-reduced-motion: reduce){.sc-nano-checkbox-group-h,*.sc-nano-checkbox-group,*.sc-nano-checkbox-group::before,*.sc-nano-checkbox-group::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}.sc-nano-checkbox-group-h{--label-color:var(--nano-color-base-1000);--label-font-size:var(--nano-font-size-xs);--invalid-msg-color:var(--nano-color-danger-1100);--help-msg-color:var(--nano-color-base-1000);--more-font-size:var(--nano-font-size-2xs);--gap:var(--nano-spacing-md);display:block;inline-size:100%}.sc-nano-checkbox-group-h *.sc-nano-checkbox-group{box-sizing:inherit}.cbgroup.sc-nano-checkbox-group{margin:0;padding:0;border:0}.cbgroup__error.sc-nano-checkbox-group,.cbgroup__help.sc-nano-checkbox-group,.cbgroup__more.sc-nano-checkbox-group{display:block;inline-size:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.cbgroup__error.sc-nano-checkbox-group,.cbgroup__help.sc-nano-checkbox-group{inset-block-start:0;inset-inline-start:0;position:absolute;font-size:var(--more-font-size);line-height:1.2;transition:0.3s ease-out opacity;font-style:italic}.show-error.sc-nano-checkbox-group .cbgroup__error.sc-nano-checkbox-group,.show-error.sc-nano-checkbox-group .cbgroup__help.sc-nano-checkbox-group{opacity:1}.cbgroup__error.sc-nano-checkbox-group{color:var(--invalid-msg-color);opacity:0}.has-error.sc-nano-checkbox-group .cbgroup__error.sc-nano-checkbox-group{opacity:1}.cbgroup__help.sc-nano-checkbox-group{opacity:1;color:var(--help-msg-color)}.has-error.sc-nano-checkbox-group .cbgroup__help.sc-nano-checkbox-group{opacity:0}.cbgroup__more.sc-nano-checkbox-group{block-size:1em;margin-block:var(--nano-spacing-sm) 0;position:relative;opacity:0;display:none;transition:all var(--nano-transition-fast) ease;transition-behavior:allow-discrete}.has-helper.sc-nano-checkbox-group .cbgroup__more.sc-nano-checkbox-group,.has-error.sc-nano-checkbox-group .cbgroup__more.sc-nano-checkbox-group{display:block;opacity:1}.cbgroup__legend.sc-nano-checkbox-group{font-size:var(--nano-font-size-xs);line-height:var(--nano-line-height-normal);letter-spacing:var(--nano-letter-spacing-loose);padding:0 0 0.9375rem;margin:0;display:block;inline-size:100%}.cbgroup__legend.visually-hide.sc-nano-checkbox-group{clip-path:inset(50%);block-size:1px;overflow:hidden;position:absolute;white-space:nowrap;inline-size:1px}.cbgroup__cbs.sc-nano-checkbox-group{margin:0;padding:0;display:flex;flex-direction:column;gap:var(--gap)}.types-segment.sc-nano-checkbox-group-h .cbgroup__cbs.sc-nano-checkbox-group{flex-direction:row;--gap:0}.types-tag.sc-nano-checkbox-group-h .cbgroup__cbs.sc-nano-checkbox-group{flex-direction:row;--gap:var(--nano-spacing-sm)}";
 
 /**
  * Checkbox group is an optional wrapper for all [checkbox](/components/checkbox) controls.
@@ -9534,18 +9535,18 @@ class DataList {
         }
     }
     render() {
-        return (h(Host, { key: '269f57e6eccd251685f84a94d53f380d6545a3cb', class: "nano-datalist", role: this.actvOptEles.length ? 'listbox' : undefined, "aria-owns": this.optionIds.length ? this.optionIds.join(' ') : undefined, "aria-label": this.optionIds.length
+        return (h(Host, { key: '8acb3be76246d665171db96444cff3a5141e1132', class: "nano-datalist", role: this.actvOptEles.length ? 'listbox' : undefined, "aria-owns": this.optionIds.length ? this.optionIds.join(' ') : undefined, "aria-label": this.optionIds.length
                 ? 'Select options from the list below'
-                : undefined }, h("nano-dropdown", { key: 'ee6398b356dc1a0ff9fa35e84955314fc95435b6', part: "dropdown", exportparts: "trigger:dropdown__trigger, panel:dropdown__panel", ...this.dropDownConfig, ref: (el) => (this.nanoDropdown = el), dialogTitle: "Select options from the list below", class: {
+                : undefined }, h("nano-dropdown", { key: '56c051873a20a3dab17a36eec1a2f040f83247fa', part: "dropdown", exportparts: "trigger:dropdown__trigger, panel:dropdown__panel", ...this.dropDownConfig, ref: (el) => (this.nanoDropdown = el), dialogTitle: "Select options from the list below", class: {
                 dlist__dropdown: true,
                 'dlist--isfiltered': this.isFiltered,
-            }, onNanoAfterShow: this.handleShow, onNanoAfterHide: this.handleHide, role: "group" }, h("nano-menu", { key: 'f80006a5ba62c227094da52672b4abf6ee6335dc', part: "main-menu", ref: (el) => (this.listBox = el), hidden: !this.actvOptEles.length, type: "listbox", label: this.inputLabel ? this.inputLabel.textContent : undefined, class: {
+            }, onNanoAfterShow: this.handleShow, onNanoAfterHide: this.handleHide, role: "group" }, h("nano-menu", { key: '7559b648617c8d32f61c670e4dc78c0d60d36dc4', part: "main-menu", ref: (el) => (this.listBox = el), hidden: !this.actvOptEles.length, type: "listbox", label: this.inputLabel ? this.inputLabel.textContent : undefined, class: {
                 dlist__menu: true,
                 'dlist__menu--open': this.dropwdownOpen,
-            }, tabIndex: -1, onNanoSelect: this.optSelected, onKeyDown: this.optionKeyDown }, h("slot", { key: '8a2d3160b990c99baeaf4fd9bdd7bb04229d642c', name: "list-top" }), h("slot", { key: '2230e4458be0998d59d18250e1d22188baf2f6b1' }), h("slot", { key: 'fca84cbd01495e4b62ba95c4c07681f506939d3f', name: "internal-opts" }), h("slot", { key: '076fd81c15f5ac6590e5311503262a07f60e8454', name: "list-bottom" })), h("nano-menu", { key: 'd4878bc502b4fcc0de01f67b5065ad017f445f75', part: "no-result-menu", type: "listbox", label: "No results found", hidden: !!this.actvOptEles.length, class: {
+            }, tabIndex: -1, onNanoSelect: this.optSelected, onKeyDown: this.optionKeyDown }, h("slot", { key: '02bd8ba511db314637e8991d29234a22967cf27d', name: "list-top" }), h("slot", { key: 'cb0234e0dd103293c1f1292af62575dd766af730' }), h("slot", { key: '0adac42b20ee0338de74217e6e91c00be6b5b6a7', name: "internal-opts" }), h("slot", { key: '906255e4e6fdc87fa8bf6e278ad076f179553925', name: "list-bottom" })), h("nano-menu", { key: '9aa978054227c9bb928c06ce93303ceda48cbf29', part: "no-result-menu", type: "listbox", label: "No results found", hidden: !!this.actvOptEles.length, class: {
                 dlist__menu: true,
                 'dlist__menu--open': this.dropwdownOpen,
-            } }, h("slot", { key: '2ac583af3ac8b24ace627637ab86471999df9465', name: "no-result" })), !!this.actvOptEles && (h("div", { key: '4971780255baf694fcc447756ca02e1115ece871', class: "dlist__status" }, this.actvOptEles.length, " result", this.actvOptEles.length > 1 ? 's' : '', " available.")))));
+            } }, h("slot", { key: '4e2ce9dcb39d0c823ed27f13dc8c9a8873f0ca9f', name: "no-result" })), !!this.actvOptEles && (h("div", { key: 'c6bf0c88d7b1fcd24b2882c7db851ffca2e77ba3', class: "dlist__status" }, this.actvOptEles.length, " result", this.actvOptEles.length > 1 ? 's' : '', " available.")))));
     }
     static get watchers() { return {
         "open": ["openWatcher"],
@@ -21148,7 +21149,7 @@ function mergeCellProperties(rowIndex, colIndex, defaultProps) {
  */
 function colheadFootRender(col) {
     const tpl = col?.columnTemplate;
-    return tpl ? (tpl(hAsync, col)) : (hAsync(Fragment, null, col.title));
+    return tpl ? tpl(hAsync, col) : (hAsync(Fragment, null, col.title));
 }
 function headerPinClasses(type, vPinned, toString = false) {
     const classes = {
@@ -21285,7 +21286,7 @@ function cellRender(rowIndex, colIndex) {
         // custom rendering can render to the templateEle OR return a promise<string>
         tplResult = result && result['then'] ? result : templateEle;
     }
-    return tplResult ? (tplResult) : model.cellModel !== undefined && model.cellModel !== null ? (h(Fragment, null, model.cellModel?.toString())) : ('');
+    return tplResult ? tplResult : model.cellModel !== undefined && model.cellModel !== null ? (h(Fragment, null, model.cellModel?.toString())) : ('');
 }
 const baseCellClasses = (colIndex, toString = false) => {
     const store = fetchStores();
@@ -24604,28 +24605,15 @@ class NanoTable {
         this.handleHideCaptionChange();
     }
     componentDidRender() {
-        if (this.scrollable !== false && this.table) {
-            // a hack. Revise in-future.
-            // the table is always rendered in the light DOM - so it should always be visible, but
-            // if we conditionally render the slot within the masked overflow there's quite a noticeable
-            //  CLS as it moves before the nano-masked-overflow is bootstrapped.
-            customElements
-                .whenDefined(transformTag('nano-masked-overflow'))
-                .then(() => {
-                this.host
-                    .querySelector('.nano-table__overflow')
-                    ?.appendChild(this.table);
-            });
-        }
     }
     disconnectedCallback() {
         this.cleanUpObservers();
     }
     render() {
-        return (h(Host, { key: '54758d3dbda3695305222d5717ad0503d355dc42', class: {
+        return (h(Host, { key: 'bd86de55fe8bc0259cf6e7e112c4bb48ad190761', class: {
                 'nano-table': true,
                 'nano-table--props-ready': this.propsReady,
-            } }, this.scrollable && (h("nano-masked-overflow", { key: '28386faf317ffb158e7c743a9891c07d1843bcaf', hideScrollbars: false, scrollControls: false, label: this.caption?.textContent || undefined, class: "nano-table__overflow-container" }, h("div", { key: 'b3c3169a26443abbc19761df5bd543edafae52f2', class: "nano-table__overflow" }))), h("slot", { key: 'a2ced54f3b39798c78a06fded180291111dfd1b1' })));
+            } }, this.scrollable && (h("nano-masked-overflow", { key: '7002c33f0368801339f718e191922cb03b28ce08', hideScrollbars: false, scrollControls: false, label: this.caption?.textContent || undefined, class: "nano-table__overflow-container" }, h("div", { key: '60b7c9a2d7a6bde7ffcde6ce62b0477790601cf5', class: "nano-table__overflow" }))), h("slot", { key: '3d4fb01789dd5c1b0a2b3872534e796e5182d579' })));
     }
     static get watchers() { return {
         "compact": ["handleCompactChange"],
@@ -29636,7 +29624,6 @@ class Slides {
     }
     flickityEl;
     flickityReady = false;
-    mutationO;
     resizeO;
     readyflickity;
     flickity = new Promise((resolve) => {
@@ -29700,7 +29687,7 @@ class Slides {
     async animationChange(_, oldAnim) {
         const [flkty, slides] = await Promise.all([
             this.getflickity(),
-            this.waitForSlides(this.host),
+            this.waitForSlides(),
         ]);
         // clear old stuff
         slides.forEach((slide) => {
@@ -29790,9 +29777,11 @@ class Slides {
      * child slides.
      */
     async update() {
+        if (!this.didInit)
+            return;
         const [flickity] = await Promise.all([
             this.getflickity(),
-            this.waitForSlides(this.host),
+            this.waitForSlides(),
         ]);
         this.childrenEles = this.host.querySelectorAll(`${transformTag('nano-slide')} > *`);
         flickity.reloadCells();
@@ -29980,7 +29969,7 @@ class Slides {
         const finalOptions = this.normalizeOptions();
         await this.loadFlickityModules(finalOptions);
         // init flickity core
-        await this.waitForSlides(this.host);
+        await this.waitForSlides();
         this.flickityEl =
             this.flickityEl || this._getRoot().querySelector('.flickity-container');
         if (!this.flickityEl)
@@ -30070,8 +30059,8 @@ class Slides {
         // @ts-expect-error - merged options don't quite match the flickity options
         return { ...flickityOptions, ...mergedEventOptions, ...this.options };
     }
-    waitForSlides = (host) => {
-        const allSlides = Array.from(host.querySelectorAll(transformTag('nano-slide')));
+    waitForSlides = () => {
+        const allSlides = Array.from(this.host.querySelectorAll(transformTag('nano-slide')));
         this.slideCount = allSlides.length;
         let toLoadSlides = allSlides.filter((ele) => !ele.ready);
         if (!toLoadSlides.length)
@@ -30081,13 +30070,13 @@ class Slides {
                 toLoadSlides = toLoadSlides.filter((ele) => ele !== ev.target);
                 if (!toLoadSlides.length) {
                     resolve(allSlides);
-                    host.removeEventListener('nanoSlideReady', slideResolver);
-                    host.removeEventListener('nano-slide-ready', slideResolver);
+                    this.host.removeEventListener('nanoSlideReady', slideResolver);
+                    this.host.removeEventListener('nano-slide-ready', slideResolver);
                 }
             };
-            host.addEventListener('nanoSlideReady', slideResolver);
+            this.host.addEventListener('nanoSlideReady', slideResolver);
             // fallback for vue who can't handle camelcase event names
-            host.addEventListener('nano-slide-ready', slideResolver);
+            this.host.addEventListener('nano-slide-ready', slideResolver);
         });
     };
     componentDidLoad() {
@@ -30098,10 +30087,6 @@ class Slides {
         }
     }
     disconnectedCallback() {
-        if (this.mutationO) {
-            this.mutationO.disconnect();
-            this.mutationO = undefined;
-        }
         if (this.resizeO) {
             this.resizeO.disconnect();
             this.resizeO = undefined;
@@ -30109,15 +30094,15 @@ class Slides {
         this.destroyflickity();
     }
     render() {
-        return (h(Host, { key: '6dedc1589f5ae629975f38303f658de914c8f506', class: "nano-slides" }, h("div", { key: '528c7b10972b258ef0345525a9fa82c289ecc083', class: {
+        return (h(Host, { key: '87cf8ae3ff3ded83f82ef3bfc5d76381afb967e0', class: "nano-slides" }, h("div", { key: 'af12496fc219421dcf416607a7c5cc9b0e59968e', class: {
                 slideshow: true,
                 ready: this.ready,
                 'not-ready': !this.ready,
-            }, part: "base" }, h("div", { key: '4d16a4da0692f53500c755600a539edf5dc2d606', ref: (div) => (this.flickityEl = div), class: {
+            }, part: "base" }, h("div", { key: 'c5995f58b334a741e4c7930be1354d4814dd436b', ref: (div) => (this.flickityEl = div), class: {
                 'flickity-container': true,
                 'slides-ready': this.slidesReady,
                 'slides-not-ready': !this.slidesReady,
-            }, part: "slide-container" }, h("slot", { key: 'ddcdf042f8d25069c08578e7417e3f5571386b76' })), h("div", { key: '5a456eee7631c979fef473352d2c4beec7a5cf2e', class: "ui-extras" }, h("slot", { key: '3994bac2fd8111223df9e3886481edf72b0f2d54', name: "ui" })), this.slideCount > 1 && this.pager && (h("div", { key: '2966cef941d7232110ba4dbba0aefdb33e757216', class: "pagination flickity-page-dots", part: "pagination" }, Array.from({ length: this.slideCount }).map((_, index) => (h("button", { part: "pagination-item--active", key: index, class: {
+            }, part: "slide-container" }, h("slot", { key: 'f4b17d46db05d7b23ff79501cc435b2b6beadcb2', onSlotchange: () => this.update() })), h("div", { key: '483ab2edd42b87d48bcc0793cbe5c21efdd1a4d3', class: "ui-extras" }, h("slot", { key: '8fc3e7b78980381d52817c0faa80efa5439a14a6', name: "ui" })), this.slideCount > 1 && this.pager && (h("div", { key: '4e7c781d179dda4d43356ae9a5892d913d17b43c', class: "pagination flickity-page-dots", part: "pagination" }, Array.from({ length: this.slideCount }).map((_, index) => (h("button", { part: "pagination-item--active", key: index, class: {
                 'pagination-btn': true,
                 'pagination-btn--active': this.isActive(index),
                 'is-selected': this.isActive(index),

package/hydrate/index.mjs

@@ -3834,7 +3834,8 @@ class HasSlotController {
             // * Regular shadow DOM component *
             childNodes = [...this.host.shadowRoot.childNodes];
         }
-        else if (!this.host.classList.contains('hydrated')) {
+        else if (!this.host.classList.contains('hydrated') &&
+            this.host.__childNodes) {
             // * Non-shadow, polyfilled component *
             // Component has not done initial render. Return component internals
             childNodes = [...(this.host?.__childNodes ?? [])];
@@ -3844,7 +3845,7 @@ class HasSlotController {
             childNodes = [...this.host.childNodes];
         }
         return childNodes.some((node) => {
-            if (node.nodeType === Node.TEXT_NODE && node.textContent.trim() !== '') {
+            if (node.nodeType === Node.TEXT_NODE && !!node.textContent.trim()) {
                 return true;
             }
             if (node.nodeType === Node.ELEMENT_NODE) {
@@ -8468,7 +8469,7 @@ const getClassMap = (classes) => {
     return map;
 };
 
-const checkboxGroupCss = ".sc-nano-checkbox-group-h,*.sc-nano-checkbox-group,*.sc-nano-checkbox-group::before,*.sc-nano-checkbox-group::after{box-sizing:border-box}[hidden].sc-nano-checkbox-group{display:none !important}@media (prefers-reduced-motion: reduce){.sc-nano-checkbox-group-h,*.sc-nano-checkbox-group,*.sc-nano-checkbox-group::before,*.sc-nano-checkbox-group::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}.sc-nano-checkbox-group-h,*.sc-nano-checkbox-group,*.sc-nano-checkbox-group::before,*.sc-nano-checkbox-group::after{box-sizing:border-box}[hidden].sc-nano-checkbox-group{display:none !important}@media (prefers-reduced-motion: reduce){.sc-nano-checkbox-group-h,*.sc-nano-checkbox-group,*.sc-nano-checkbox-group::before,*.sc-nano-checkbox-group::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}.sc-nano-checkbox-group-h{--label-color:var(--nano-color-base-1000);--label-font-size:var(--nano-font-size-xs);--invalid-msg-color:var(--nano-color-danger-1100);--help-msg-color:var(--nano-color-base-1000);--more-font-size:var(--nano-font-size-2xs);display:block;inline-size:100%}.sc-nano-checkbox-group-h *.sc-nano-checkbox-group{box-sizing:inherit}.cbgroup.sc-nano-checkbox-group{margin:0;padding:0;border:0}.cbgroup__error.sc-nano-checkbox-group,.cbgroup__help.sc-nano-checkbox-group,.cbgroup__more.sc-nano-checkbox-group{display:block;inline-size:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.cbgroup__error.sc-nano-checkbox-group,.cbgroup__help.sc-nano-checkbox-group{inset-block-start:0;inset-inline-start:0;position:absolute;font-size:var(--more-font-size);line-height:1.2;transition:0.3s ease-out opacity;font-style:italic}.show-error.sc-nano-checkbox-group .cbgroup__error.sc-nano-checkbox-group,.show-error.sc-nano-checkbox-group .cbgroup__help.sc-nano-checkbox-group{opacity:1}.cbgroup__error.sc-nano-checkbox-group{color:var(--invalid-msg-color);opacity:0}.has-error.sc-nano-checkbox-group .cbgroup__error.sc-nano-checkbox-group{opacity:1}.cbgroup__help.sc-nano-checkbox-group{opacity:1;color:var(--help-msg-color)}.has-error.sc-nano-checkbox-group .cbgroup__help.sc-nano-checkbox-group{opacity:0}.cbgroup__more.sc-nano-checkbox-group{block-size:1em;margin-block:var(--nano-spacing-sm) 0;position:relative;opacity:0;display:none;transition:all var(--nano-transition-fast) ease;transition-behavior:allow-discrete}.has-helper.sc-nano-checkbox-group .cbgroup__more.sc-nano-checkbox-group,.has-error.sc-nano-checkbox-group .cbgroup__more.sc-nano-checkbox-group{display:block;opacity:1}.cbgroup__legend.sc-nano-checkbox-group{font-size:var(--nano-font-size-xs);line-height:var(--nano-line-height-normal);letter-spacing:var(--nano-letter-spacing-loose);padding:0 0 0.9375rem;margin:0;display:block;inline-size:100%}.cbgroup__legend.visually-hide.sc-nano-checkbox-group{clip-path:inset(50%);block-size:1px;overflow:hidden;position:absolute;white-space:nowrap;inline-size:1px}.cbgroup__cbs.sc-nano-checkbox-group{margin:0;padding:0;display:flex;flex-direction:column;gap:var(--nano-spacing-md)}.types-segment.sc-nano-checkbox-group-h .cbgroup__cbs.sc-nano-checkbox-group{flex-direction:row;gap:0}.types-tag.sc-nano-checkbox-group-h .cbgroup__cbs.sc-nano-checkbox-group{flex-direction:row;gap:var(--nano-spacing-sm)}";
+const checkboxGroupCss = ".sc-nano-checkbox-group-h,*.sc-nano-checkbox-group,*.sc-nano-checkbox-group::before,*.sc-nano-checkbox-group::after{box-sizing:border-box}[hidden].sc-nano-checkbox-group{display:none !important}@media (prefers-reduced-motion: reduce){.sc-nano-checkbox-group-h,*.sc-nano-checkbox-group,*.sc-nano-checkbox-group::before,*.sc-nano-checkbox-group::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}.sc-nano-checkbox-group-h,*.sc-nano-checkbox-group,*.sc-nano-checkbox-group::before,*.sc-nano-checkbox-group::after{box-sizing:border-box}[hidden].sc-nano-checkbox-group{display:none !important}@media (prefers-reduced-motion: reduce){.sc-nano-checkbox-group-h,*.sc-nano-checkbox-group,*.sc-nano-checkbox-group::before,*.sc-nano-checkbox-group::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}.sc-nano-checkbox-group-h{--label-color:var(--nano-color-base-1000);--label-font-size:var(--nano-font-size-xs);--invalid-msg-color:var(--nano-color-danger-1100);--help-msg-color:var(--nano-color-base-1000);--more-font-size:var(--nano-font-size-2xs);--gap:var(--nano-spacing-md);display:block;inline-size:100%}.sc-nano-checkbox-group-h *.sc-nano-checkbox-group{box-sizing:inherit}.cbgroup.sc-nano-checkbox-group{margin:0;padding:0;border:0}.cbgroup__error.sc-nano-checkbox-group,.cbgroup__help.sc-nano-checkbox-group,.cbgroup__more.sc-nano-checkbox-group{display:block;inline-size:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.cbgroup__error.sc-nano-checkbox-group,.cbgroup__help.sc-nano-checkbox-group{inset-block-start:0;inset-inline-start:0;position:absolute;font-size:var(--more-font-size);line-height:1.2;transition:0.3s ease-out opacity;font-style:italic}.show-error.sc-nano-checkbox-group .cbgroup__error.sc-nano-checkbox-group,.show-error.sc-nano-checkbox-group .cbgroup__help.sc-nano-checkbox-group{opacity:1}.cbgroup__error.sc-nano-checkbox-group{color:var(--invalid-msg-color);opacity:0}.has-error.sc-nano-checkbox-group .cbgroup__error.sc-nano-checkbox-group{opacity:1}.cbgroup__help.sc-nano-checkbox-group{opacity:1;color:var(--help-msg-color)}.has-error.sc-nano-checkbox-group .cbgroup__help.sc-nano-checkbox-group{opacity:0}.cbgroup__more.sc-nano-checkbox-group{block-size:1em;margin-block:var(--nano-spacing-sm) 0;position:relative;opacity:0;display:none;transition:all var(--nano-transition-fast) ease;transition-behavior:allow-discrete}.has-helper.sc-nano-checkbox-group .cbgroup__more.sc-nano-checkbox-group,.has-error.sc-nano-checkbox-group .cbgroup__more.sc-nano-checkbox-group{display:block;opacity:1}.cbgroup__legend.sc-nano-checkbox-group{font-size:var(--nano-font-size-xs);line-height:var(--nano-line-height-normal);letter-spacing:var(--nano-letter-spacing-loose);padding:0 0 0.9375rem;margin:0;display:block;inline-size:100%}.cbgroup__legend.visually-hide.sc-nano-checkbox-group{clip-path:inset(50%);block-size:1px;overflow:hidden;position:absolute;white-space:nowrap;inline-size:1px}.cbgroup__cbs.sc-nano-checkbox-group{margin:0;padding:0;display:flex;flex-direction:column;gap:var(--gap)}.types-segment.sc-nano-checkbox-group-h .cbgroup__cbs.sc-nano-checkbox-group{flex-direction:row;--gap:0}.types-tag.sc-nano-checkbox-group-h .cbgroup__cbs.sc-nano-checkbox-group{flex-direction:row;--gap:var(--nano-spacing-sm)}";
 
 /**
  * Checkbox group is an optional wrapper for all [checkbox](/components/checkbox) controls.
@@ -9532,18 +9533,18 @@ class DataList {
         }
     }
     render() {
-        return (h(Host, { key: '269f57e6eccd251685f84a94d53f380d6545a3cb', class: "nano-datalist", role: this.actvOptEles.length ? 'listbox' : undefined, "aria-owns": this.optionIds.length ? this.optionIds.join(' ') : undefined, "aria-label": this.optionIds.length
+        return (h(Host, { key: '8acb3be76246d665171db96444cff3a5141e1132', class: "nano-datalist", role: this.actvOptEles.length ? 'listbox' : undefined, "aria-owns": this.optionIds.length ? this.optionIds.join(' ') : undefined, "aria-label": this.optionIds.length
                 ? 'Select options from the list below'
-                : undefined }, h("nano-dropdown", { key: 'ee6398b356dc1a0ff9fa35e84955314fc95435b6', part: "dropdown", exportparts: "trigger:dropdown__trigger, panel:dropdown__panel", ...this.dropDownConfig, ref: (el) => (this.nanoDropdown = el), dialogTitle: "Select options from the list below", class: {
+                : undefined }, h("nano-dropdown", { key: '56c051873a20a3dab17a36eec1a2f040f83247fa', part: "dropdown", exportparts: "trigger:dropdown__trigger, panel:dropdown__panel", ...this.dropDownConfig, ref: (el) => (this.nanoDropdown = el), dialogTitle: "Select options from the list below", class: {
                 dlist__dropdown: true,
                 'dlist--isfiltered': this.isFiltered,
-            }, onNanoAfterShow: this.handleShow, onNanoAfterHide: this.handleHide, role: "group" }, h("nano-menu", { key: 'f80006a5ba62c227094da52672b4abf6ee6335dc', part: "main-menu", ref: (el) => (this.listBox = el), hidden: !this.actvOptEles.length, type: "listbox", label: this.inputLabel ? this.inputLabel.textContent : undefined, class: {
+            }, onNanoAfterShow: this.handleShow, onNanoAfterHide: this.handleHide, role: "group" }, h("nano-menu", { key: '7559b648617c8d32f61c670e4dc78c0d60d36dc4', part: "main-menu", ref: (el) => (this.listBox = el), hidden: !this.actvOptEles.length, type: "listbox", label: this.inputLabel ? this.inputLabel.textContent : undefined, class: {
                 dlist__menu: true,
                 'dlist__menu--open': this.dropwdownOpen,
-            }, tabIndex: -1, onNanoSelect: this.optSelected, onKeyDown: this.optionKeyDown }, h("slot", { key: '8a2d3160b990c99baeaf4fd9bdd7bb04229d642c', name: "list-top" }), h("slot", { key: '2230e4458be0998d59d18250e1d22188baf2f6b1' }), h("slot", { key: 'fca84cbd01495e4b62ba95c4c07681f506939d3f', name: "internal-opts" }), h("slot", { key: '076fd81c15f5ac6590e5311503262a07f60e8454', name: "list-bottom" })), h("nano-menu", { key: 'd4878bc502b4fcc0de01f67b5065ad017f445f75', part: "no-result-menu", type: "listbox", label: "No results found", hidden: !!this.actvOptEles.length, class: {
+            }, tabIndex: -1, onNanoSelect: this.optSelected, onKeyDown: this.optionKeyDown }, h("slot", { key: '02bd8ba511db314637e8991d29234a22967cf27d', name: "list-top" }), h("slot", { key: 'cb0234e0dd103293c1f1292af62575dd766af730' }), h("slot", { key: '0adac42b20ee0338de74217e6e91c00be6b5b6a7', name: "internal-opts" }), h("slot", { key: '906255e4e6fdc87fa8bf6e278ad076f179553925', name: "list-bottom" })), h("nano-menu", { key: '9aa978054227c9bb928c06ce93303ceda48cbf29', part: "no-result-menu", type: "listbox", label: "No results found", hidden: !!this.actvOptEles.length, class: {
                 dlist__menu: true,
                 'dlist__menu--open': this.dropwdownOpen,
-            } }, h("slot", { key: '2ac583af3ac8b24ace627637ab86471999df9465', name: "no-result" })), !!this.actvOptEles && (h("div", { key: '4971780255baf694fcc447756ca02e1115ece871', class: "dlist__status" }, this.actvOptEles.length, " result", this.actvOptEles.length > 1 ? 's' : '', " available.")))));
+            } }, h("slot", { key: '4e2ce9dcb39d0c823ed27f13dc8c9a8873f0ca9f', name: "no-result" })), !!this.actvOptEles && (h("div", { key: 'c6bf0c88d7b1fcd24b2882c7db851ffca2e77ba3', class: "dlist__status" }, this.actvOptEles.length, " result", this.actvOptEles.length > 1 ? 's' : '', " available.")))));
     }
     static get watchers() { return {
         "open": ["openWatcher"],
@@ -21146,7 +21147,7 @@ function mergeCellProperties(rowIndex, colIndex, defaultProps) {
  */
 function colheadFootRender(col) {
     const tpl = col?.columnTemplate;
-    return tpl ? (tpl(hAsync, col)) : (hAsync(Fragment, null, col.title));
+    return tpl ? tpl(hAsync, col) : (hAsync(Fragment, null, col.title));
 }
 function headerPinClasses(type, vPinned, toString = false) {
     const classes = {
@@ -21283,7 +21284,7 @@ function cellRender(rowIndex, colIndex) {
         // custom rendering can render to the templateEle OR return a promise<string>
         tplResult = result && result['then'] ? result : templateEle;
     }
-    return tplResult ? (tplResult) : model.cellModel !== undefined && model.cellModel !== null ? (h(Fragment, null, model.cellModel?.toString())) : ('');
+    return tplResult ? tplResult : model.cellModel !== undefined && model.cellModel !== null ? (h(Fragment, null, model.cellModel?.toString())) : ('');
 }
 const baseCellClasses = (colIndex, toString = false) => {
     const store = fetchStores();
@@ -24602,28 +24603,15 @@ class NanoTable {
         this.handleHideCaptionChange();
     }
     componentDidRender() {
-        if (this.scrollable !== false && this.table) {
-            // a hack. Revise in-future.
-            // the table is always rendered in the light DOM - so it should always be visible, but
-            // if we conditionally render the slot within the masked overflow there's quite a noticeable
-            //  CLS as it moves before the nano-masked-overflow is bootstrapped.
-            customElements
-                .whenDefined(transformTag('nano-masked-overflow'))
-                .then(() => {
-                this.host
-                    .querySelector('.nano-table__overflow')
-                    ?.appendChild(this.table);
-            });
-        }
     }
     disconnectedCallback() {
         this.cleanUpObservers();
     }
     render() {
-        return (h(Host, { key: '54758d3dbda3695305222d5717ad0503d355dc42', class: {
+        return (h(Host, { key: 'bd86de55fe8bc0259cf6e7e112c4bb48ad190761', class: {
                 'nano-table': true,
                 'nano-table--props-ready': this.propsReady,
-            } }, this.scrollable && (h("nano-masked-overflow", { key: '28386faf317ffb158e7c743a9891c07d1843bcaf', hideScrollbars: false, scrollControls: false, label: this.caption?.textContent || undefined, class: "nano-table__overflow-container" }, h("div", { key: 'b3c3169a26443abbc19761df5bd543edafae52f2', class: "nano-table__overflow" }))), h("slot", { key: 'a2ced54f3b39798c78a06fded180291111dfd1b1' })));
+            } }, this.scrollable && (h("nano-masked-overflow", { key: '7002c33f0368801339f718e191922cb03b28ce08', hideScrollbars: false, scrollControls: false, label: this.caption?.textContent || undefined, class: "nano-table__overflow-container" }, h("div", { key: '60b7c9a2d7a6bde7ffcde6ce62b0477790601cf5', class: "nano-table__overflow" }))), h("slot", { key: '3d4fb01789dd5c1b0a2b3872534e796e5182d579' })));
     }
     static get watchers() { return {
         "compact": ["handleCompactChange"],
@@ -29634,7 +29622,6 @@ class Slides {
     }
     flickityEl;
     flickityReady = false;
-    mutationO;
     resizeO;
     readyflickity;
     flickity = new Promise((resolve) => {
@@ -29698,7 +29685,7 @@ class Slides {
     async animationChange(_, oldAnim) {
         const [flkty, slides] = await Promise.all([
             this.getflickity(),
-            this.waitForSlides(this.host),
+            this.waitForSlides(),
         ]);
         // clear old stuff
         slides.forEach((slide) => {
@@ -29788,9 +29775,11 @@ class Slides {
      * child slides.
      */
     async update() {
+        if (!this.didInit)
+            return;
         const [flickity] = await Promise.all([
             this.getflickity(),
-            this.waitForSlides(this.host),
+            this.waitForSlides(),
         ]);
         this.childrenEles = this.host.querySelectorAll(`${transformTag('nano-slide')} > *`);
         flickity.reloadCells();
@@ -29978,7 +29967,7 @@ class Slides {
         const finalOptions = this.normalizeOptions();
         await this.loadFlickityModules(finalOptions);
         // init flickity core
-        await this.waitForSlides(this.host);
+        await this.waitForSlides();
         this.flickityEl =
             this.flickityEl || this._getRoot().querySelector('.flickity-container');
         if (!this.flickityEl)
@@ -30068,8 +30057,8 @@ class Slides {
         // @ts-expect-error - merged options don't quite match the flickity options
         return { ...flickityOptions, ...mergedEventOptions, ...this.options };
     }
-    waitForSlides = (host) => {
-        const allSlides = Array.from(host.querySelectorAll(transformTag('nano-slide')));
+    waitForSlides = () => {
+        const allSlides = Array.from(this.host.querySelectorAll(transformTag('nano-slide')));
         this.slideCount = allSlides.length;
         let toLoadSlides = allSlides.filter((ele) => !ele.ready);
         if (!toLoadSlides.length)
@@ -30079,13 +30068,13 @@ class Slides {
                 toLoadSlides = toLoadSlides.filter((ele) => ele !== ev.target);
                 if (!toLoadSlides.length) {
                     resolve(allSlides);
-                    host.removeEventListener('nanoSlideReady', slideResolver);
-                    host.removeEventListener('nano-slide-ready', slideResolver);
+                    this.host.removeEventListener('nanoSlideReady', slideResolver);
+                    this.host.removeEventListener('nano-slide-ready', slideResolver);
                 }
             };
-            host.addEventListener('nanoSlideReady', slideResolver);
+            this.host.addEventListener('nanoSlideReady', slideResolver);
             // fallback for vue who can't handle camelcase event names
-            host.addEventListener('nano-slide-ready', slideResolver);
+            this.host.addEventListener('nano-slide-ready', slideResolver);
         });
     };
     componentDidLoad() {
@@ -30096,10 +30085,6 @@ class Slides {
         }
     }
     disconnectedCallback() {
-        if (this.mutationO) {
-            this.mutationO.disconnect();
-            this.mutationO = undefined;
-        }
         if (this.resizeO) {
             this.resizeO.disconnect();
             this.resizeO = undefined;
@@ -30107,15 +30092,15 @@ class Slides {
         this.destroyflickity();
     }
     render() {
-        return (h(Host, { key: '6dedc1589f5ae629975f38303f658de914c8f506', class: "nano-slides" }, h("div", { key: '528c7b10972b258ef0345525a9fa82c289ecc083', class: {
+        return (h(Host, { key: '87cf8ae3ff3ded83f82ef3bfc5d76381afb967e0', class: "nano-slides" }, h("div", { key: 'af12496fc219421dcf416607a7c5cc9b0e59968e', class: {
                 slideshow: true,
                 ready: this.ready,
                 'not-ready': !this.ready,
-            }, part: "base" }, h("div", { key: '4d16a4da0692f53500c755600a539edf5dc2d606', ref: (div) => (this.flickityEl = div), class: {
+            }, part: "base" }, h("div", { key: 'c5995f58b334a741e4c7930be1354d4814dd436b', ref: (div) => (this.flickityEl = div), class: {
                 'flickity-container': true,
                 'slides-ready': this.slidesReady,
                 'slides-not-ready': !this.slidesReady,
-            }, part: "slide-container" }, h("slot", { key: 'ddcdf042f8d25069c08578e7417e3f5571386b76' })), h("div", { key: '5a456eee7631c979fef473352d2c4beec7a5cf2e', class: "ui-extras" }, h("slot", { key: '3994bac2fd8111223df9e3886481edf72b0f2d54', name: "ui" })), this.slideCount > 1 && this.pager && (h("div", { key: '2966cef941d7232110ba4dbba0aefdb33e757216', class: "pagination flickity-page-dots", part: "pagination" }, Array.from({ length: this.slideCount }).map((_, index) => (h("button", { part: "pagination-item--active", key: index, class: {
+            }, part: "slide-container" }, h("slot", { key: 'f4b17d46db05d7b23ff79501cc435b2b6beadcb2', onSlotchange: () => this.update() })), h("div", { key: '483ab2edd42b87d48bcc0793cbe5c21efdd1a4d3', class: "ui-extras" }, h("slot", { key: '8fc3e7b78980381d52817c0faa80efa5439a14a6', name: "ui" })), this.slideCount > 1 && this.pager && (h("div", { key: '4e7c781d179dda4d43356ae9a5892d913d17b43c', class: "pagination flickity-page-dots", part: "pagination" }, Array.from({ length: this.slideCount }).map((_, index) => (h("button", { part: "pagination-item--active", key: index, class: {
                 'pagination-btn': true,
                 'pagination-btn--active': this.isActive(index),
                 'is-selected': this.isActive(index),

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nanoporetech-digital/components",
-  "version": "8.12.2",
+  "version": "8.13.0",
   "sideEffects": false,
   "repository": {
     "type": "git",
@@ -60,7 +60,7 @@
     "smart-array-filter": "^4.0.2",
     "stencil-wormhole": "3.2.1",
     "tyqs": "^0.1.3",
-    "@nanoporetech-digital/style": "8.12.2"
+    "@nanoporetech-digital/style": "8.13.0"
   },
   "devDependencies": {
     "@algolia/client-search": "^4.22.1",

package/dist/nano-components/slot-D31cEKyt.js

@@ -1,4 +0,0 @@
-/*!
- * Custom elements for Nanopore-Digital Web applications
- */
-import{g as t,j as s}from"./index-BM3Om9WE.js";import{g as h}from"./dom-dlicJTEJ.js";function i(t){const s=t.getRootNode();return s.host?s.host.innerText:t.innerText}class o{host;slotNames=[];constructor(s,...h){this.slotNames=h;const i=s.componentWillLoad;s.componentWillLoad=()=>{this.host=t(s),i&&i.call(s)};const o=s.connectedCallback;s.connectedCallback=()=>{this.host=t(s),this.hostConnected(),o&&o.call(s)};const e=s.disconnectedCallback;s.disconnectedCallback=()=>{this.hostDisconnected(),this.host=void 0,e&&e.call(s)}}hasDefaultSlot(){if(!this.host)return!1;let t;return t=this.host.shadowRoot?[...this.host.shadowRoot.childNodes]:this.host.classList.contains("hydrated")?[...this.host.childNodes]:[...this.host?.__childNodes??[]],t.some((t=>t.nodeType===Node.TEXT_NODE&&""!==t.textContent.trim()||t.nodeType===Node.ELEMENT_NODE&&!t.hasAttribute("slot")))}hasNamedSlot(t){return!!this.host&&h(this.host,`[slot="${t}"]`,!0).length>0}has(t){return"[default]"===t?this.hasDefaultSlot():this.hasNamedSlot(t)}hostConnected(){(this.host.shadowRoot??this.host).addEventListener("slotchange",this.handleSlotChange)}hostDisconnected(){this.host&&(this.host.shadowRoot??this.host).removeEventListener("slotchange",this.handleSlotChange)}handleSlotChange=t=>{const h=t.target;(this.slotNames.includes("[default]")&&!h.name||h.name&&this.slotNames.includes(h.name))&&s(this.host)}}export{o as H,i as g}