@nanoporetech-digital/components 7.9.2 → 8.0.0-alpha.0

package/dist/cjs/nano-slides.cjs.entry.js

@@ -1,16 +1,12 @@
 /*!
- * Web Components for Nanopore digital Web Apps
+ * Custom elements for Nanopore-Digital Web applications
  */
 'use strict';
 
-Object.defineProperty(exports, '__esModule', { value: true });
-
-const nanoSlides_entry = require('./nano-slides-0a60315d.js');
-require('./index-615cdb64.js');
-require('./renderer-cd8b6098.js');
+var nanoSlides_entry = require('./nano-slides-D5q9vQ4P.js');
+require('./index-DYD4xvxr.js');
+require('./renderer-SkVn69pT.js');
 
 
 
 exports.nano_slides = nanoSlides_entry.Slides;
-
-//# sourceMappingURL=nano-slides.cjs.entry.js.map

package/dist/cjs/nano-sortable.cjs.entry.js

@@ -1,18 +1,15 @@
 /*!
- * Web Components for Nanopore digital Web Apps
+ * Custom elements for Nanopore-Digital Web applications
  */
 'use strict';
 
-Object.defineProperty(exports, '__esModule', { value: true });
+var index = require('./index-DYD4xvxr.js');
+var renderer = require('./renderer-SkVn69pT.js');
+var drag = require('./drag-B5XXLJW9.js');
+var throttle = require('./throttle-CrRDOkln.js');
+var events = require('./events-pBdXJwIU.js');
 
-const index = require('./index-615cdb64.js');
-const renderer = require('./renderer-cd8b6098.js');
-const drag = require('./drag-c0a99167.js');
-const throttle = require('./throttle-46a497fb.js');
-const events = require('./events-96e9a3d4.js');
-
-const sortableCss = ":host{box-sizing:border-box}*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}:host{box-sizing:border-box}*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}:host{position:relative;display:block}.sortable__live-region{clip:rect(1px, 1px, 1px, 1px);clip-path:inset(50%);block-size:1px;inline-size:1px;margin:-1px;overflow:hidden;padding:0;position:absolute}";
-const NanoSortableStyle0 = sortableCss;
+const sortableCss = ":host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host{position:relative;display:block}.sortable__live-region{clip-path:inset(50%);block-size:1px;overflow:hidden;position:absolute;white-space:nowrap;inline-size:1px}";
 
 // Orientation map to limit dragging to horizontal or vertical.
 const orientationMap = {
@@ -81,6 +78,7 @@ const Sortable = class {
      * you must use this function to render a control *outside* of the focusable element.
      * @param _number
      * @param _element
+     * @default () => <nano-icon-button></nano-icon-button>;
      * @returns a function that attaches a keyboard accessible handle control element.
      * The function itself *must* return the handle element.
      */
@@ -413,6 +411,7 @@ const Sortable = class {
         const targetElement = e.target;
         let foundHandle;
         let sortEle;
+        console.log('yooo', e.key);
         if (this.handleSelector) {
             foundHandle = targetElement.closest(this.handleSelector);
             sortEle = targetElement.closest(this.itemSelector);
@@ -730,7 +729,7 @@ const Sortable = class {
         }
     }
     render() {
-        return (renderer.h(index.Host, { key: 'c9bce5fa4dd5410d54d84a41ab8ece10d316ede0', class: "nano-sortable" }, renderer.h("div", { key: 'beffbe43a385e254cb696cb5ba98797c0a8be718', class: "sortable__live-region", "aria-live": "polite", "aria-relevant": "additions", "aria-atomic": "true", role: "log", part: "announcements" }, this.ariaTextList.map((str) => (renderer.h("div", null, str)))), renderer.h("slot", { key: '9a552eeb74869b9825311907172f44ea0358a3cb' })));
+        return (renderer.h(index.Host, { key: '864871b13cc5f7a14e5b3a72c7776daec8f75bf0', class: "nano-sortable" }, renderer.h("div", { key: '9645cde622750e8d9476430712bb71ca090b6d0d', class: "sortable__live-region", "aria-live": "polite", "aria-relevant": "additions", "aria-atomic": "true", role: "log", part: "announcements" }, this.ariaTextList.map((str) => (renderer.h("div", null, str)))), renderer.h("slot", { key: '5083e13e75b08b68732fccc7181d2358e5a3198d' })));
     }
     static get watchers() { return {
         "itemSelector": ["handleItemSelectorChange"],
@@ -739,8 +738,6 @@ const Sortable = class {
         "sortableHostElement": ["handleSortableHostElement"]
     }; }
 };
-Sortable.style = NanoSortableStyle0;
+Sortable.style = sortableCss;
 
 exports.nano_sortable = Sortable;
-
-//# sourceMappingURL=nano-sortable.cjs.entry.js.map

package/dist/cjs/nano-spinner.cjs.entry.js

@@ -1,15 +1,12 @@
 /*!
- * Web Components for Nanopore digital Web Apps
+ * Custom elements for Nanopore-Digital Web applications
  */
 'use strict';
 
-Object.defineProperty(exports, '__esModule', { value: true });
+var index = require('./index-DYD4xvxr.js');
+var renderer = require('./renderer-SkVn69pT.js');
 
-const index = require('./index-615cdb64.js');
-const renderer = require('./renderer-cd8b6098.js');
-
-const spinnerCss = ":host{box-sizing:border-box}*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}:host{box-sizing:border-box}*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}:host{display:inline-block;--base-color-rgb:var(--nano-indicator-rgb, 84 140 175);--indicator-color:var(\n      --nano-indicator-color,\n      rgb(var(--base-color-rgb) / 100%)\n    );--track-color:var(--nano-track-color, rgb(var(--base-color-rgb) / 20%));--overlay-color:var(--nano-layer-overlay-light, rgb(255 255 255 / 70%))}.spinner{display:flex;flex-direction:column;align-items:center;justify-content:center}:host([overlay]:not([overlay=false])) .spinner{position:absolute;inset:0}:host([overlay]:not([overlay=false])) .spinner .spinner__loader,:host([overlay]:not([overlay=false])) .spinner .spinner__text{z-index:1}.spinner__overlay{background:var(--overlay-color);position:absolute;inset:0;z-index:0;-webkit-backdrop-filter:blur(var(--nano-layer-overlay-blur, 3px));backdrop-filter:blur(var(--nano-layer-overlay-blur, 3px))}.spinner__loader{font-size:var(--spinner-scale, 1em)}.spinner__spin{display:block;margin:auto;inline-size:1em;block-size:1em;border-radius:50%;border:solid 0.1em var(--track-color);border-block-start-color:var(--indicator-color);border-inline-end-color:var(--indicator-color);border-inline-start-color:var(--indicator-color);animation:1s linear infinite spin}.spinner__dna{font-size:0.2286em;display:flex}.spinner__dnatrack{position:relative;padding-block:0;padding-inline:0.625em;block-size:4.375em;inline-size:0.625em;overflow:hidden}.spinner__dnatrack::before{content:\"\";position:absolute;inset-block-start:1.875em;inset-inline-start:50%;transform:translateX(-50%) translateZ(0);inline-size:0.0625em;inline-size:max(.0625em, 1px);block-size:0.625em;background:var(--track-color);animation:flex 1.5s linear infinite;transform-origin:center center}.spinner__dnatrack--2::before{animation:flex 1.5s -1.3s linear infinite}.spinner__dnatrack--3::before{animation:flex 1.5s -1.1s linear infinite}.spinner__dnatrack--4::before{animation:flex 1.5s -0.9s linear infinite}.spinner__dnatrack--5::before{animation:flex 1.5s -0.75s linear infinite}.spinner__dnadot{position:absolute;inline-size:0.5em;block-size:0.5em;border-radius:50%;background:var(--indicator-color);animation:rotate 1.5s linear infinite;transform-origin:center center;inset-inline-start:50%;transform:translateX(-50%) translateZ(0) translateY(0)}.spinner__dnadot--2{animation:rotate 1.5s -0.75s linear infinite}.spinner__dnadot--3{animation:rotate 1.5s -1.3s linear infinite}.spinner__dnadot--4{animation:rotate 1.5s -0.55s linear infinite}.spinner__dnadot--5{animation:rotate 1.5s -1.1s linear infinite}.spinner__dnadot--6{animation:rotate 1.5s -0.35s linear infinite}.spinner__dnadot--7{animation:rotate 1.5s -0.9s linear infinite}.spinner__dnadot--8{animation:rotate 1.5s -0.15s linear infinite}.spinner__dnadot--9{animation:rotate 1.5s -0.75s linear infinite}.spinner__dnadot--10{animation:rotate 1.5s 0s linear infinite}.spinner__text{text-align:center;position:relative;margin-block-start:0.5em}@keyframes spin{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}@keyframes rotate{0%,100%{transform:translateX(-50%) translateY(0) scale(1)}25%{transform:translateX(-50%) translateY(1.875em) scale(2)}50%{transform:translateX(-50%) translateY(3.75em) scale(1)}75%{transform:translateX(-50%) translateY(1.875em) scale(0.3)}}@keyframes flex{0%,100%{transform:translateX(-50%) scaleY(5)}25%{transform:translateX(-50%) scaleY(1)}50%{transform:translateX(-50%) scaleY(5)}75%{transform:translateX(-50%) scaleY(1)}}";
-const NanoSpinnerStyle0 = spinnerCss;
+const spinnerCss = ":host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host{display:inline-block;--base-color-rgb:var(--nano-indicator-rgb, 84 140 175);--indicator-color:var(\n      --nano-indicator-color,\n      rgb(var(--base-color-rgb) / 100%)\n    );--track-color:var(--nano-track-color, rgb(var(--base-color-rgb) / 20%));--overlay-color:var(--nano-layer-overlay-light, rgb(255 255 255 / 70%))}.spinner{display:flex;flex-direction:column;align-items:center;justify-content:center}:host([overlay]:not([overlay=false])) .spinner{position:absolute;inset:0}:host([overlay]:not([overlay=false])) .spinner .spinner__loader,:host([overlay]:not([overlay=false])) .spinner .spinner__text{z-index:1}.spinner__overlay{background:var(--overlay-color);position:absolute;inset:0;z-index:0}.spinner__loader{font-size:var(--spinner-scale, 1em)}.spinner__spin{display:block;margin:auto;inline-size:1em;block-size:1em;border-radius:50%;border:solid 0.1em var(--track-color);border-block-start-color:var(--indicator-color);border-inline-end-color:var(--indicator-color);border-inline-start-color:var(--indicator-color);animation:1s linear infinite spin}.spinner__dna{font-size:0.2286em;display:flex}.spinner__dnatrack{position:relative;padding-block:0;padding-inline:0.625em;block-size:4.375em;inline-size:0.625em;overflow:hidden}.spinner__dnatrack::before{content:\"\";position:absolute;inset-block-start:1.875em;inset-inline-start:50%;transform:translateX(-50%) translateZ(0);inline-size:0.0625em;inline-size:max(.0625em, 1px);block-size:0.625em;background:var(--track-color);animation:flex 1.5s linear infinite;transform-origin:center center}.spinner__dnatrack--2::before{animation:flex 1.5s -1.3s linear infinite}.spinner__dnatrack--3::before{animation:flex 1.5s -1.1s linear infinite}.spinner__dnatrack--4::before{animation:flex 1.5s -0.9s linear infinite}.spinner__dnatrack--5::before{animation:flex 1.5s -0.75s linear infinite}.spinner__dnadot{position:absolute;inline-size:0.5em;block-size:0.5em;border-radius:50%;background:var(--indicator-color);animation:rotate 1.5s linear infinite;transform-origin:center center;inset-inline-start:50%;transform:translateX(-50%) translateZ(0) translateY(0)}.spinner__dnadot--2{animation:rotate 1.5s -0.75s linear infinite}.spinner__dnadot--3{animation:rotate 1.5s -1.3s linear infinite}.spinner__dnadot--4{animation:rotate 1.5s -0.55s linear infinite}.spinner__dnadot--5{animation:rotate 1.5s -1.1s linear infinite}.spinner__dnadot--6{animation:rotate 1.5s -0.35s linear infinite}.spinner__dnadot--7{animation:rotate 1.5s -0.9s linear infinite}.spinner__dnadot--8{animation:rotate 1.5s -0.15s linear infinite}.spinner__dnadot--9{animation:rotate 1.5s -0.75s linear infinite}.spinner__dnadot--10{animation:rotate 1.5s 0s linear infinite}.spinner__text{text-align:center;position:relative;margin-block-start:0.5em}@keyframes spin{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}@keyframes rotate{0%,100%{transform:translateX(-50%) translateY(0) scale(1)}25%{transform:translateX(-50%) translateY(1.875em) scale(2)}50%{transform:translateX(-50%) translateY(3.75em) scale(1)}75%{transform:translateX(-50%) translateY(1.875em) scale(0.3)}}@keyframes flex{0%,100%{transform:translateX(-50%) scaleY(5)}25%{transform:translateX(-50%) scaleY(1)}50%{transform:translateX(-50%) scaleY(5)}75%{transform:translateX(-50%) scaleY(1)}}";
 
 const Spinner = class {
     constructor(hostRef) {
@@ -25,11 +22,9 @@ const Spinner = class {
         this.hasText = !!this.el.childNodes.length;
     }
     render() {
-        return (renderer.h(index.Host, { key: '650f22e1f076d786590389993562fb03d73b50d5', class: "nano-spinner" }, renderer.h("div", { key: '392afaac4ae23acdc247a7d4d5dea7166beaa6f4', class: "spinner", "aria-busy": "true", "aria-live": "polite" }, renderer.h("div", { key: '71699c822304d7bc40bc6510a373bd6da4905dc0', class: "spinner__loader" }, this.type === 'dna' && (renderer.h("div", { key: 'f3cf1be6056a3aacd9f08fb2ba20a0196a751912', class: "spinner__dna" }, renderer.h("div", { key: '9fbc4e80ce66f14751001ed7e9559e01649d1e7b', class: "spinner__dnatrack spinner__dnatrack--1" }, renderer.h("div", { key: '1242c2d9c928cf0e371133335ad05dc1e1426380', class: "spinner__dnadot spinner__dnadot--1" }), renderer.h("div", { key: '1dcfced70f0813796681ca5049fb50144d83e9ec', class: "spinner__dnadot spinner__dnadot--2" })), renderer.h("div", { key: 'cdb111d45ddbab07c9c0fed293bff499e306215e', class: "spinner__dnatrack spinner__dnatrack--2" }, renderer.h("div", { key: '326aa2074a4e16f7d6fddc41354672188c602f70', class: "spinner__dnadot spinner__dnadot--3" }), renderer.h("div", { key: 'd436ba81949ada55d5fe2356e663ba1b2f24f1fd', class: "spinner__dnadot spinner__dnadot--4" })), renderer.h("div", { key: 'ad2b9393afa3d2e9109fe7af696ab06001541344', class: "spinner__dnatrack spinner__dnatrack--3" }, renderer.h("div", { key: 'db18ff89bdfa702a733e817099ec03e550b7a967', class: "spinner__dnadot spinner__dnadot--5" }), renderer.h("div", { key: '812f51e0fdb34fae89c048fef6925feeed8e5d7f', class: "spinner__dnadot spinner__dnadot--6" })), renderer.h("div", { key: 'e53e41b6adc1fbf35ae07f7e0783b097d5a201db', class: "spinner__dnatrack spinner__dnatrack--4" }, renderer.h("div", { key: '0407e5a7234424094b1bc452a6f3bfe2c38ad7a7', class: "spinner__dnadot spinner__dnadot--7" }), renderer.h("div", { key: 'f9c9ee014b3cb7df2f6ca9e1f5ef6fc21a7b2c5c', class: "spinner__dnadot spinner__dnadot--8" })), renderer.h("div", { key: '3af97dda00e1ed9eaa738a2e0167f59916a69dbe', class: "spinner__dnatrack spinner__dnatrack--5" }, renderer.h("div", { key: '1f49f2d13828475a24dc318f3f28cca6973e01d5', class: "spinner__dnadot spinner__dnadot--9" }), renderer.h("div", { key: '5aee21e437ab1f35a35a1616e170ce1fed8d2811', class: "spinner__dnadot spinner__dnadot--10" })))), this.type === 'circle' && renderer.h("span", { key: '3e87f7a4aca4c55d750b6f01d14f83c8c9b232e8', class: "spinner__spin" })), this.hasText && (renderer.h("div", { class: "spinner__text", key: "spinner-text" }, renderer.h("slot", { key: '1e3e90c45121e16f4297ccf31d3809910d5721cf' }))), this.overlay && (renderer.h("div", { class: "spinner__overlay", key: "spinner-overlay" })))));
+        return (renderer.h(index.Host, { key: 'dbc40d7788bbf362c854bb8e2edfec5eba74dab7', class: "nano-spinner" }, renderer.h("div", { key: '43ed7c0bc040a058f5ae2e667d060bc977ab1cd6', class: "spinner", "aria-busy": "true", "aria-live": "polite" }, renderer.h("div", { key: 'e5b5e56150e94540cb10114ea50414fbfa388f9b', class: "spinner__loader" }, this.type === 'dna' && (renderer.h("div", { key: 'd710dd242b6f87267dd7e5e027e06970d50bf404', class: "spinner__dna" }, renderer.h("div", { key: '8a352a82329fab518e60016e02b6a8ed5acc2f09', class: "spinner__dnatrack spinner__dnatrack--1" }, renderer.h("div", { key: '11df9066edf3c1976e3a2389d01ec16db6351449', class: "spinner__dnadot spinner__dnadot--1" }), renderer.h("div", { key: '4b3491c97ff57acc3630e084965c22f4f2be21ac', class: "spinner__dnadot spinner__dnadot--2" })), renderer.h("div", { key: '539be4e37c8ef5942c96a9e956da72edaa85a717', class: "spinner__dnatrack spinner__dnatrack--2" }, renderer.h("div", { key: 'cb819582c58208d071303faa623a6d1204eae265', class: "spinner__dnadot spinner__dnadot--3" }), renderer.h("div", { key: '852c3b793018c03021555321f9c10f5060a129f0', class: "spinner__dnadot spinner__dnadot--4" })), renderer.h("div", { key: '915260775e7f710e9d54c80ebe66a4be9ffb4d56', class: "spinner__dnatrack spinner__dnatrack--3" }, renderer.h("div", { key: 'bad113420011fbeff7421a347459060ea0e27c32', class: "spinner__dnadot spinner__dnadot--5" }), renderer.h("div", { key: 'e2d6aee7635d1262116119240f4d4e7518b26fc6', class: "spinner__dnadot spinner__dnadot--6" })), renderer.h("div", { key: '0ccd6e6d73eca5bcc50073bd4502d88cdd1aaaeb', class: "spinner__dnatrack spinner__dnatrack--4" }, renderer.h("div", { key: '1046da948f271f9a8812e1795eca262a86eb5e77', class: "spinner__dnadot spinner__dnadot--7" }), renderer.h("div", { key: '65b4f08dd543597c477bf3bb3d1b01d2de29d897', class: "spinner__dnadot spinner__dnadot--8" })), renderer.h("div", { key: '7e6df709a6c943e14cafdbcff845a40aaedadca9', class: "spinner__dnatrack spinner__dnatrack--5" }, renderer.h("div", { key: '70e7baee2dea251a9413905a0f8df825ea8a1c9f', class: "spinner__dnadot spinner__dnadot--9" }), renderer.h("div", { key: 'ca16ebfa9ab9932f67dbe542eacced2056644295', class: "spinner__dnadot spinner__dnadot--10" })))), this.type === 'circle' && renderer.h("span", { key: 'fa9e17f125e1f435f75538b24111cefbbce930c8', class: "spinner__spin" })), this.hasText && (renderer.h("div", { class: "spinner__text", key: "spinner-text" }, renderer.h("slot", { key: 'c2ce2c01f09a02201a1247f9db1baae3afd62c55' }))), this.overlay && (renderer.h("div", { class: "spinner__overlay", key: "spinner-overlay" })))));
     }
 };
-Spinner.style = NanoSpinnerStyle0;
+Spinner.style = spinnerCss;
 
 exports.nano_spinner = Spinner;
-
-//# sourceMappingURL=nano-spinner.cjs.entry.js.map

package/dist/cjs/nano-split-pane.cjs.entry.js

@@ -1,18 +1,15 @@
 /*!
- * Web Components for Nanopore digital Web Apps
+ * Custom elements for Nanopore-Digital Web applications
  */
 'use strict';
 
-Object.defineProperty(exports, '__esModule', { value: true });
+var index = require('./index-DYD4xvxr.js');
+var renderer = require('./renderer-SkVn69pT.js');
+var drag = require('./drag-B5XXLJW9.js');
+var math = require('./math-DIjJ3V87.js');
+var throttle = require('./throttle-CrRDOkln.js');
 
-const index = require('./index-615cdb64.js');
-const renderer = require('./renderer-cd8b6098.js');
-const drag = require('./drag-c0a99167.js');
-const math = require('./math-ea9cdc71.js');
-const throttle = require('./throttle-46a497fb.js');
-
-const splitPaneCss = ":host{box-sizing:border-box}*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}:host{box-sizing:border-box}*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}:host{--divider-width:12px;--divider-hit-area:14px;--min:0%;--max:100%;--background-color:#e4e6e8;--content-color:#918b86;display:grid}.start,.end{overflow:hidden}.divider{flex:0 0 var(--divider-width);display:flex;position:relative;align-items:center;justify-content:center;background-color:var(--background-color);color:var(--content-color);z-index:1;font-size:0.8rem}.divider:focus{outline:none}:host(:not([disabled])) .divider:focus-visible{background-color:var(--nano-control-focus-color, rgba(144, 198, 231, 0.8))}:host([disabled]) .divider{cursor:not-allowed}:host(:not([vertical]):not([disabled])) .divider{cursor:col-resize}:host(:not([vertical])) .divider::after{display:flex;content:\"\";position:absolute;block-size:100%;inset-inline-start:calc(var(--divider-hit-area) / -2 + var(--divider-width) / 2);inline-size:var(--divider-hit-area)}:host([vertical]){flex-direction:column}:host([vertical]:not([disabled])) .divider{cursor:row-resize}:host([vertical]) .divider::after{content:\"\";position:absolute;inline-size:100%;inset-block-start:calc(var(--divider-hit-area) / -2 + var(--divider-width) / 2);block-size:var(--divider-hit-area)}";
-const NanoSplitPaneStyle0 = splitPaneCss;
+const splitPaneCss = ":host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host{--divider-width:4px;--divider-hit-area:14px;--min:0%;--max:100%;--background-color:var(--nano-color-neutral-300);--content-color:var(--nano-color-neutral-1000);display:grid}.start,.end{overflow:hidden}.divider{flex:0 0 var(--divider-width);display:flex;position:relative;align-items:center;justify-content:center;background-color:var(--background-color);color:var(--content-color);z-index:1;font-size:0.8rem}.divider:focus{outline:none}:host(:not([disabled])) .divider:focus-visible{background-color:var(--nano-focus-ring-color)}:host([disabled]) .divider{cursor:not-allowed}:host(:not([vertical],[disabled])) .divider{cursor:col-resize}:host(:not([vertical])) .divider::after{display:flex;content:\"\";position:absolute;block-size:100%;inset-inline-start:calc(var(--divider-hit-area) / -2 + var(--divider-width) / 2);inline-size:var(--divider-hit-area)}:host([vertical]){flex-direction:column}:host([vertical]:not([disabled])) .divider{cursor:row-resize}:host([vertical]) .divider::after{content:\"\";position:absolute;inline-size:100%;inset-block-start:calc(var(--divider-hit-area) / -2 + var(--divider-width) / 2);block-size:var(--divider-hit-area)}";
 
 const SplitPane = class {
     get host() { return index.getElement(this); }
@@ -290,15 +287,13 @@ const SplitPane = class {
         else {
             styles[gridTemplate] = `${primary} var(--divider-width) ${secondary}`;
         }
-        return (renderer.h(index.Host, { style: styles, class: "nano-split-pane" }, renderer.h("div", { part: "panel start", class: "start" }, renderer.h("slot", { name: "start" })), renderer.h("div", { part: "divider", class: "divider", tabindex: this.disabled ? undefined : '0', role: "separator", "aria-label": "Resize", onKeyDown: this.handleKeyDown, onMouseDown: this.handleDrag, onTouchStart: this.handleDrag }, renderer.h("slot", { name: "handle" }, !this.disabled && this.vertical ? (renderer.h("nano-icon", { slot: "handle", name: "solid/grip-lines" })) : (renderer.h("nano-icon", { slot: "handle", name: "solid/grip-lines-vertical" })))), renderer.h("div", { part: "panel end", class: "end" }, renderer.h("slot", { name: "end" }))));
+        return (renderer.h(index.Host, { style: styles, class: "nano-split-pane" }, renderer.h("div", { part: "panel start", class: "start" }, renderer.h("slot", { name: "start" })), renderer.h("div", { part: "divider", class: "divider", tabindex: this.disabled ? undefined : '0', role: "separator", "aria-label": "Resize", onKeyDown: this.handleKeyDown, onMouseDown: this.handleDrag, onTouchStart: this.handleDrag }, renderer.h("slot", { name: "handle" }, !this.disabled && this.vertical ? (renderer.h("nano-icon", { slot: "handle", name: "solid/grip-dots" })) : (renderer.h("nano-icon", { slot: "handle", name: "solid/grip-dots-vertical" })))), renderer.h("div", { part: "panel end", class: "end" }, renderer.h("slot", { name: "end" }))));
     }
     static get watchers() { return {
         "position": ["handlePositionChange"],
         "positionInPixels": ["handlePositionInPixelsChange"]
     }; }
 };
-SplitPane.style = NanoSplitPaneStyle0;
+SplitPane.style = splitPaneCss;
 
 exports.nano_split_pane = SplitPane;
-
-//# sourceMappingURL=nano-split-pane.cjs.entry.js.map

package/dist/cjs/nano-sticker.cjs.entry.js

@@ -1,18 +1,15 @@
 /*!
- * Web Components for Nanopore digital Web Apps
+ * Custom elements for Nanopore-Digital Web applications
  */
 'use strict';
 
-Object.defineProperty(exports, '__esModule', { value: true });
+var index = require('./index-DYD4xvxr.js');
+var dom = require('./dom-a3wgHxbn.js');
+var throttle = require('./throttle-CrRDOkln.js');
+var scroll = require('./scroll-DXjC771e.js');
+var renderer = require('./renderer-SkVn69pT.js');
 
-const index = require('./index-615cdb64.js');
-const dom = require('./dom-b99a1aec.js');
-const throttle = require('./throttle-46a497fb.js');
-const scrollParent = require('./scroll-parent-798d9651.js');
-const renderer = require('./renderer-cd8b6098.js');
-
-const stickerCss = ":host{box-sizing:border-box}*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}:host{box-sizing:border-box}*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}:host{--stuck-left:initial;--stuck-right:initial;--stuck-z-index:var(--nano-layer-index-menubar, 10);--top-hide:translateY(-110%);--bottom-hide:translateY(110%);display:block;max-inline-size:100%}:host([sticky]){position:sticky;transition:0.3s ease transform;will-change:min-block-size}:host([sticky][stuck]){inset-inline:var(--stuck-left) var(--stuck-right);z-index:var(--stuck-z-index) !important}:host([sticky][hide][placed-top]){transform:var(--top-hide)}:host([sticky][hide][placed-bottom]){transform:var(--bottom-hide)}:host([sticky][index=\"1\"]){z-index:calc(var(--stuck-z-index) + 1)}:host([sticky][index=\"2\"]){z-index:calc(var(--stuck-z-index) + 2)}:host([sticky][index=\"3\"]){z-index:calc(var(--stuck-z-index) + 3)}:host([sticky][index=\"4\"]){z-index:calc(var(--stuck-z-index) + 4)}:host([sticky][index=\"5\"]){z-index:calc(var(--stuck-z-index) + 5)}.sticker{display:inherit;max-inline-size:inherit;inline-size:100%}.sticker:not(.stuck){inline-size:auto !important}.sticker.sticky{transition:0.3s ease all;position:relative}:host([index=\"1\"]) .sticker.sticky{z-index:calc(var(--stuck-z-index) + 1)}:host([index=\"2\"]) .sticker.sticky{z-index:calc(var(--stuck-z-index) + 2)}:host([index=\"3\"]) .sticker.sticky{z-index:calc(var(--stuck-z-index) + 3)}:host([index=\"4\"]) .sticker.sticky{z-index:calc(var(--stuck-z-index) + 4)}:host([index=\"5\"]) .sticker.sticky{z-index:calc(var(--stuck-z-index) + 5)}.sticker.stuck{position:fixed;inset-inline:var(--stuck-left) var(--stuck-right);z-index:var(--stuck-z-index);transform:translateY(0)}:host([placed-top]) .sticker.stuck{inset-block-start:0}:host([placed-bottom]) .sticker.stuck{inset-block-end:0}:host([placed-top]) .sticker.stuck.hide{transform:var(--top-hide)}:host([placed-bottom]) .sticker.stuck.hide{transform:var(--bottom-hide)}.sticker-content{display:flex;flex-wrap:wrap}";
-const NanoStickerStyle0 = stickerCss;
+const stickerCss = ":host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host{--stuck-left:initial;--stuck-right:initial;--stuck-z-index:var(--nano-layer-index-menubar, 10);--top-hide:translateY(-110%);--bottom-hide:translateY(110%);display:block;max-inline-size:100%}:host([sticky]){position:sticky;transition:0.3s ease transform;will-change:min-block-size}:host([sticky][stuck]){inset-inline:var(--stuck-left) var(--stuck-right);z-index:var(--stuck-z-index) !important}:host([sticky][hide][placed-top]){transform:var(--top-hide)}:host([sticky][hide][placed-bottom]){transform:var(--bottom-hide)}:host([sticky][index=\"1\"]){z-index:calc(var(--stuck-z-index) + 1)}:host([sticky][index=\"2\"]){z-index:calc(var(--stuck-z-index) + 2)}:host([sticky][index=\"3\"]){z-index:calc(var(--stuck-z-index) + 3)}:host([sticky][index=\"4\"]){z-index:calc(var(--stuck-z-index) + 4)}:host([sticky][index=\"5\"]){z-index:calc(var(--stuck-z-index) + 5)}.sticker{display:inherit;max-inline-size:inherit;inline-size:100%}.sticker:not(.stuck){inline-size:auto !important}.sticker.sticky{transition:0.3s ease all;position:relative}:host([index=\"1\"]) .sticker.sticky{z-index:calc(var(--stuck-z-index) + 1)}:host([index=\"2\"]) .sticker.sticky{z-index:calc(var(--stuck-z-index) + 2)}:host([index=\"3\"]) .sticker.sticky{z-index:calc(var(--stuck-z-index) + 3)}:host([index=\"4\"]) .sticker.sticky{z-index:calc(var(--stuck-z-index) + 4)}:host([index=\"5\"]) .sticker.sticky{z-index:calc(var(--stuck-z-index) + 5)}.sticker.stuck{position:fixed;inset-inline:var(--stuck-left) var(--stuck-right);z-index:var(--stuck-z-index);transform:translateY(0)}:host([placed-top]) .sticker.stuck{inset-block-start:0}:host([placed-bottom]) .sticker.stuck{inset-block-end:0}:host([placed-top]) .sticker.stuck.hide{transform:var(--top-hide)}:host([placed-bottom]) .sticker.stuck.hide{transform:var(--bottom-hide)}.sticker-content{display:flex;flex-wrap:wrap}";
 
 function _getScrollTop(ele) {
     return ele instanceof Document ? window.pageYOffset : ele.scrollTop;
@@ -559,9 +556,9 @@ const Sticker = class {
     }
     bootstrapGurantor() {
         this.hasBootstrapped = true;
-        const scrollParent$1 = this.scrollParent || scrollParent.findScrollParent(this.host);
+        const scrollParent = this.scrollParent || scroll.findScrollParent(this.host);
         this.scrollParent =
-            scrollParent$1 === document.documentElement ? document : scrollParent$1;
+            scrollParent === document.documentElement ? document : scrollParent;
         this.isRootSticker = this.scrollParent instanceof Document;
         this.trigger = this.trigger || document.createElement('div');
         this.trigger.innerHTML = ' ';
@@ -613,12 +610,12 @@ const Sticker = class {
         this.hasBootstrapped = false;
     }
     render() {
-        return (renderer.h(index.Host, { key: 'b282e10cddb66120a13fcade77d1f2b554a20579', sticky: !this.isRootSticker && !this.stickToEle && this.isSticky, hide: this.hide && this.isStuck, siblings: this.stuckCounter, index: this.stickerIndex, stuck: this.isStuck && this.isSticky, "placed-bottom": this.positions.includes('bottom'), "placed-top": this.positions.includes('top'), "placed-end": this.positions.includes('end'), "placed-start": this.positions.includes('start'), class: "nano-sticker" }, renderer.h("div", { key: '33b8b8a569e522809bc9dd8efba10282728117a8', class: {
+        return (renderer.h(index.Host, { key: 'cdcb7fdadde75c5f860cbc5d93ef7d6f58bc499b', sticky: !this.isRootSticker && !this.stickToEle && this.isSticky, hide: this.hide && this.isStuck, siblings: this.stuckCounter, index: this.stickerIndex, stuck: this.isStuck && this.isSticky, "placed-bottom": this.positions.includes('bottom'), "placed-top": this.positions.includes('top'), "placed-end": this.positions.includes('end'), "placed-start": this.positions.includes('start'), class: "nano-sticker" }, renderer.h("div", { key: 'fa8b5831edde3d5e39036681cc75a0c2c0e84ccf', class: {
                 sticker: true,
                 sticky: this.isRootSticker && this.isSticky,
                 stuck: this.isStuck && this.isRootSticker && this.isSticky,
                 hide: this.isRootSticker && this.hide && this.isStuck,
-            }, ref: (div) => (this.sticker = div) }, renderer.h("div", { key: 'bc0584d28222ecaa8c362817ef3a71f618fe4796', class: "sticker-content", ref: (div) => (this.content = div) }, renderer.h("slot", { key: '12f6f6dca5d58ccdc446aee97cd5bee39f3c322e' })))));
+            }, ref: (div) => (this.sticker = div) }, renderer.h("div", { key: '8ec62a7127c1823f5e2ab35b80617ec495fa4121', class: "sticker-content", ref: (div) => (this.content = div) }, renderer.h("slot", { key: '6206fa5ac74522b69e7c5a99b4147458399f3a5d' })))));
     }
     static get watchers() { return {
         "trigger": ["updateTriggerOffset"],
@@ -636,8 +633,6 @@ const Sticker = class {
         "hide": ["handleHideChange"]
     }; }
 };
-Sticker.style = NanoStickerStyle0;
+Sticker.style = stickerCss;
 
 exports.nano_sticker = Sticker;
-
-//# sourceMappingURL=nano-sticker.cjs.entry.js.map

package/dist/cjs/nano-tab-content.cjs.entry.js

@@ -1,18 +1,15 @@
 /*!
- * Web Components for Nanopore digital Web Apps
+ * Custom elements for Nanopore-Digital Web applications
  */
 'use strict';
 
-Object.defineProperty(exports, '__esModule', { value: true });
+var index = require('./index-DYD4xvxr.js');
+var renderer = require('./renderer-SkVn69pT.js');
 
-const index = require('./index-615cdb64.js');
-const renderer = require('./renderer-cd8b6098.js');
-
-const tabContentCss = ":host{box-sizing:border-box}*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}:host{box-sizing:border-box}*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}:host{display:block;opacity:1;animation:opacity 0.3s ease-in-out forwards;animation-duration:0s !important}:host(.ready){animation-duration:0.3s !important}@media only screen and (width <= 768px){:host([animation-dir=left]){animation:slide-right 0.3s ease-in-out;opacity:1}:host([animation-dir=right]){animation:slide-left 0.3s ease-in-out;opacity:1}}.nano-tab-content{position:relative}@keyframes opacity{0%{opacity:0}100%{opacity:1}}@keyframes slide-left{0%{transform:translate3d(-100%, 0, 0)}50%{transform:translate3d(0%) translate3d(-0.9em)}100%{transform:translate3d(0, 0, 0)}}@keyframes slide-right{0%{transform:translate3d(100%, 0, 0)}50%{transform:translateX(0%) translate3d(0.9em)}100%{transform:translate3d(0, 0, 0)}}@media (prefers-reduced-motion: reduce){*{animation:none !important}}";
-const NanoTabContentStyle0 = tabContentCss;
+const tabContentCss = ":host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host{display:block;opacity:1;animation:opacity 0.3s ease-in-out forwards;animation-duration:0s !important}:host(.ready){animation-duration:0.3s !important}@media only screen and (width <= 768px){:host([animation-dir=left]){animation:slide-right 0.3s ease-in-out;opacity:1}:host([animation-dir=right]){animation:slide-left 0.3s ease-in-out;opacity:1}}.nano-tab-content{position:relative}@keyframes opacity{0%{opacity:0}100%{opacity:1}}@keyframes slide-left{0%{transform:translate3d(-100%, 0, 0)}50%{transform:translate3d(0%) translate3d(-0.9em)}100%{transform:translate3d(0, 0, 0)}}@keyframes slide-right{0%{transform:translate3d(100%, 0, 0)}50%{transform:translateX(0%) translate3d(0.9em)}100%{transform:translate3d(0, 0, 0)}}@media (prefers-reduced-motion: reduce){*{animation:none !important}}";
 
 let id = 0;
-const TabPanel = class {
+const NanoTabContent = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
     }
@@ -27,14 +24,12 @@ const TabPanel = class {
         requestAnimationFrame(() => (this.ready = true));
     }
     render() {
-        return (renderer.h(index.Host, { key: '08abcc599bd876200b180401e671ddbd6a9bf32f', id: this.host.id || this.tabContentId, style: { display: this.active ? 'block' : 'none' }, role: "tabpanel", "aria-hidden": this.active ? 'false' : 'true', class: {
+        return (renderer.h(index.Host, { key: '7afee777be86f5847c5ac4c8de6babae3199b01d', id: this.host.id || this.tabContentId, style: { display: this.active ? 'block' : 'none' }, role: "tabpanel", "aria-hidden": this.active ? 'false' : 'true', class: {
                 ready: this.ready,
                 'nano-tab-content': true,
-            } }, renderer.h("div", { key: '11c30baa5c02d8ad2d134e18ab7757482cbf64a1', part: "base", class: "nano-tab-content" }, renderer.h("slot", { key: 'e57eea4e5a61fdc5b57d9c745ea479055f3caa13' }))));
+            } }, renderer.h("div", { key: 'c316e2c15458eeb9fb6162d81060b81a1132e795', part: "base", class: "nano-tab-content" }, renderer.h("slot", { key: '532eedd714e732749cfe9b303b1f4c633e89491c' }))));
     }
 };
-TabPanel.style = NanoTabContentStyle0;
-
-exports.nano_tab_content = TabPanel;
+NanoTabContent.style = tabContentCss;
 
-//# sourceMappingURL=nano-tab-content.cjs.entry.js.map
+exports.nano_tab_content = NanoTabContent;