npm - @nanoporetech-digital/components - Versions diffs - 3.7.1 → 3.8.1 - Mend

@nanoporetech-digital/components 3.7.1 → 3.8.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (781) hide show

package/dist/esm/nano-spinner.entry.js CHANGED Viewed

@@ -1,9 +1,9 @@
 /*!
  * Web Components for Nanopore digital Web Apps
  */
-import { r as registerInstance, h, g as getElement } from './index-3c280603.js';
+import { r as registerInstance, h, g as getElement } from './index-b4e277ad.js';
-const spinnerCss = ":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(--nano-indicator-color, rgba(var(--base-color-rgb), 1));--track-color:var(--nano-track-color, rgba(var(--base-color-rgb), 0.2));--overlay-color:var(--nano-layer-overlay-light, rgba(255, 255, 255, .7))}.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% 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 spinnerCss = ":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;-webkit-margin-before:0.5em;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) {
@@ -16,7 +16,7 @@ const Spinner = class {
     this.hasText = !!this.el.childNodes.length;
   }
   render() {
-    return (h("div", { class: "spinner", "aria-busy": "true", "aria-live": "polite" }, h("div", { class: "spinner__loader" }, this.type === 'dna' && (h("div", { class: "spinner__dna" }, h("div", { class: "spinner__dnatrack spinner__dnatrack--1" }, h("div", { class: "spinner__dnadot spinner__dnadot--1" }), h("div", { class: "spinner__dnadot spinner__dnadot--2" })), h("div", { class: "spinner__dnatrack spinner__dnatrack--2" }, h("div", { class: "spinner__dnadot spinner__dnadot--3" }), h("div", { class: "spinner__dnadot spinner__dnadot--4" })), h("div", { class: "spinner__dnatrack spinner__dnatrack--3" }, h("div", { class: "spinner__dnadot spinner__dnadot--5" }), h("div", { class: "spinner__dnadot spinner__dnadot--6" })), h("div", { class: "spinner__dnatrack spinner__dnatrack--4" }, h("div", { class: "spinner__dnadot spinner__dnadot--7" }), h("div", { class: "spinner__dnadot spinner__dnadot--8" })), h("div", { class: "spinner__dnatrack spinner__dnatrack--5" }, h("div", { class: "spinner__dnadot spinner__dnadot--9" }), h("div", { class: "spinner__dnadot spinner__dnadot--10" })))), this.type === 'circle' && h("span", { class: "spinner__spin" })), this.hasText && (h("div", { class: "spinner__text" }, h("slot", null))), this.overlay && h("div", { class: "spinner__overlay" })));
+    return (h("div", { class: "spinner", "aria-busy": "true", "aria-live": "polite" }, h("div", { class: "spinner__loader" }, this.type === 'dna' && (h("div", { class: "spinner__dna" }, h("div", { class: "spinner__dnatrack spinner__dnatrack--1" }, h("div", { class: "spinner__dnadot spinner__dnadot--1" }), h("div", { class: "spinner__dnadot spinner__dnadot--2" })), h("div", { class: "spinner__dnatrack spinner__dnatrack--2" }, h("div", { class: "spinner__dnadot spinner__dnadot--3" }), h("div", { class: "spinner__dnadot spinner__dnadot--4" })), h("div", { class: "spinner__dnatrack spinner__dnatrack--3" }, h("div", { class: "spinner__dnadot spinner__dnadot--5" }), h("div", { class: "spinner__dnadot spinner__dnadot--6" })), h("div", { class: "spinner__dnatrack spinner__dnatrack--4" }, h("div", { class: "spinner__dnadot spinner__dnadot--7" }), h("div", { class: "spinner__dnadot spinner__dnadot--8" })), h("div", { class: "spinner__dnatrack spinner__dnatrack--5" }, h("div", { class: "spinner__dnadot spinner__dnadot--9" }), h("div", { class: "spinner__dnadot spinner__dnadot--10" })))), this.type === 'circle' && h("span", { class: "spinner__spin" })), this.hasText && (h("div", { class: "spinner__text", key: "spinner-text" }, h("slot", null))), this.overlay && (h("div", { class: "spinner__overlay", key: "spinner-overlay" }))));
   }
   get el() { return getElement(this); }
 };

package/dist/esm/nano-spinner.entry.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"nano-spinner.entry.js","mappings":";;;;;AAAA,MAAM,UAAU,GAAG,~~86GAA86G~~;;~~MCkBp7G~~,OAAO;;;mBAEU,KAAK;gBAGA,KAAK;mBAGM,KAAK;;EAEjD,iBAAiB;IACf,IAAI,CAAC,OAAO,GAAG,CAAC,CAAC,IAAI,CAAC,EAAE,CAAC,UAAU,CAAC,MAAM,CAAC;GAC5C;EAED,MAAM;IACJ,QACE,WAAK,KAAK,EAAC,SAAS,eAAW,MAAM,eAAW,QAAQ,IACtD,WAAK,KAAK,EAAC,iBAAiB,IACzB,IAAI,CAAC,IAAI,KAAK,KAAK,KAClB,WAAK,KAAK,EAAC,cAAc,IACvB,WAAK,KAAK,EAAC,wCAAwC,IACjD,WAAK,KAAK,EAAC,oCAAoC,GAAO,EACtD,WAAK,KAAK,EAAC,oCAAoC,GAAO,CAClD,EACN,WAAK,KAAK,EAAC,wCAAwC,IACjD,WAAK,KAAK,EAAC,oCAAoC,GAAO,EACtD,WAAK,KAAK,EAAC,oCAAoC,GAAO,CAClD,EACN,WAAK,KAAK,EAAC,wCAAwC,IACjD,WAAK,KAAK,EAAC,oCAAoC,GAAO,EACtD,WAAK,KAAK,EAAC,oCAAoC,GAAO,CAClD,EACN,WAAK,KAAK,EAAC,wCAAwC,IACjD,WAAK,KAAK,EAAC,oCAAoC,GAAO,EACtD,WAAK,KAAK,EAAC,oCAAoC,GAAO,CAClD,EACN,WAAK,KAAK,EAAC,wCAAwC,IACjD,WAAK,KAAK,EAAC,oCAAoC,GAAO,EACtD,WAAK,KAAK,EAAC,qCAAqC,GAAO,CACnD,CACF,CACP,EACA,IAAI,CAAC,IAAI,KAAK,QAAQ,IAAI,YAAM,KAAK,EAAC,eAAe,GAAQ,CAC1D,EACL,IAAI,CAAC,OAAO,KACX,WAAK,KAAK,EAAC,eAAe,~~IACxB~~,eAAQ,CACJ,CACP,EACA,IAAI,CAAC,OAAO,~~IAAI~~,WAAK,KAAK,EAAC,kBAAkB,GAAO,~~CACjD~~,EACN;GACH;;;;;;;","names":[],"sources":["./src/components/spinner/spinner.scss?tag=nano-spinner&encapsulation=shadow","./src/components/spinner/spinner.tsx"],"sourcesContent":["@import '../../global/style/nano-theme/components';\n@import '../../global/style/nano-theme/layers';\n\n:host {\n /*\n @prop --base-color-rgb: default #{$progress-indicator-color-rgb}\n * @prop --indicator-color: default var(--nano-indicator-color, rgba(var(--base-color-rgb), 1));\n * @prop --track-color: default var(--nano-track-color, rgba(var(--base-color-rgb), 0.2));\n * @prop --spinner-scale: optional scaling of the spinner. default contextual font-size\n * @prop --overlay-color: #{$layer-overlay-light};\n /\n\n display: inline-block;\n\n // --spinner-scale: 5em;\n --base-color-rgb: #{$progress-indicator-color-rgb};\n --indicator-color: var(--nano-indicator-color~~, rgba~~(var(--base-color-rgb), 1));\n --track-color: var(--nano-track-color, ~~rgba~~(var(--base-color-rgb), ~~0.2~~));\n --overlay-color: #{$layer-overlay-light};\n}\n\n.spinner {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n\n :host([overlay]:not([overlay='false'])) & {\n position: absolute;\n inset: 0;\n\n .spinner__loader,\n .spinner__text {\n z-index: 1;\n }\n }\n\n &__overlay {\n background: var(--overlay-color);\n position: absolute;\n inset: 0;\n z-index: 0;\n backdrop-filter: blur(#{$layer-overlay-blur});\n }\n\n &__loader {\n font-size: var(--spinner-scale, 1em);\n }\n\n &__spin {\n display: block;\n margin: auto;\n inline-size: 1em;\n block-size: 1em;\n border-radius: 50%;\n border: solid 0.1em var(--track-color);\n border-block-start-color: var(--indicator-color);\n border-inline-end-color: var(--indicator-color);\n border-inline-start-color: var(--indicator-color);\n animation: 1s linear infinite spin;\n }\n\n &__dna {\n font-size: 0.2286em;\n display: flex;\n }\n\n &__dnatrack {\n position: relative;\n padding-block: 0;\n padding-inline: 0.625em;\n block-size: 4.375em;\n inline-size: 0.625em;\n overflow: hidden;\n\n &::before {\n content: '';\n position: absolute;\n inset-block-start: 1.875em;\n inset-inline-start: 50%;\n transform: translateX(-50%) translateZ(0);\n inline-size: 0.0625em;\n inline-size: #{'max(.0625em, 1px)'};\n block-size: 0.625em;\n background: var(--track-color);\n animation: flex 1.5s linear infinite;\n transform-origin: center center;\n }\n\n &--2::before {\n animation: flex 1.5s -1.3s linear infinite;\n }\n\n &--3::before {\n animation: flex 1.5s -1.1s linear infinite;\n }\n\n &--4::before {\n animation: flex 1.5s -0.9s linear infinite;\n }\n\n &--5::before {\n animation: flex 1.5s -0.75s linear infinite;\n }\n }\n\n &__dnadot {\n position: absolute;\n inline-size: 0.5em;\n block-size: 0.5em;\n border-radius: 50~~% 50~~%;\n background: var(--indicator-color);\n animation: rotate 1.5s linear infinite;\n transform-origin: center center;\n inset-inline-start: 50%;\n transform: translateX(-50%) translateZ(0) translateY(0);\n\n &--2 {\n animation: rotate 1.5s -0.75s linear infinite;\n }\n\n &--3 {\n animation: rotate 1.5s -1.3s linear infinite;\n }\n\n &--4 {\n animation: rotate 1.5s -0.55s linear infinite;\n }\n\n &--5 {\n animation: rotate 1.5s -1.1s linear infinite;\n }\n\n &--6 {\n animation: rotate 1.5s -0.35s linear infinite;\n }\n\n &--7 {\n animation: rotate 1.5s -0.9s linear infinite;\n }\n\n &--8 {\n animation: rotate 1.5s -0.15s linear infinite;\n }\n\n &--9 {\n animation: rotate 1.5s -0.75s linear infinite;\n }\n\n &--10 {\n animation: rotate 1.5s 0s linear infinite;\n }\n }\n\n &__text {\n text-align: center;\n position: relative;\n margin-block-start: 0.5em;\n }\n\n @keyframes spin {\n 0% {\n transform: rotate(0deg);\n }\n\n 100% {\n transform: rotate(360deg);\n }\n }\n\n @keyframes rotate {\n 0%,\n 100% {\n transform: translateX(-50%) translateY(0) scale(1);\n }\n\n 25% {\n transform: translateX(-50%) translateY(1.875em) scale(2);\n }\n\n 50% {\n transform: translateX(-50%) translateY(3.75em) scale(1);\n }\n\n 75% {\n transform: translateX(-50%) translateY(1.875em) scale(0.3);\n }\n }\n\n @keyframes flex {\n 0%,\n 100% {\n transform: translateX(-50%) scaleY(5);\n }\n\n 25% {\n transform: translateX(-50%) scaleY(1);\n }\n\n 50% {\n transform: translateX(-50%) scaleY(5);\n }\n\n 75% {\n transform: translateX(-50%) scaleY(1);\n }\n }\n}\n","import {\n Component,\n h,\n ComponentInterface,\n Prop,\n Element,\n State,\n} from '@stencil/core';\n\n/\n Spinners are used to show the progress of an indeterminate operation.\n * @slot - Used for loading messages\n /\n@Component({\n tag: 'nano-spinner',\n styleUrl: 'spinner.scss',\n shadow: true,\n})\nexport class Spinner implements ComponentInterface {\n @Element() el: HTMLNanoSpinnerElement;\n @State() hasText: boolean = false;\n\n /* The type of spinner animation. dna should be used for larger, page loads. Circle for smaller component loaders. /\n @Prop() type: 'dna' \| 'circle' = 'dna';\n\n /* Displays absolutely with an overlay */\n @Prop({ reflect: true }) overlay: boolean = false;\n\n componentWillLoad() {\n this.hasText = !!this.el.childNodes.length;\n }\n\n render() {\n return (\n <div class=\"spinner\" aria-busy=\"true\" aria-live=\"polite\">\n <div class=\"spinner__loader\">\n {this.type === 'dna' && (\n <div class=\"spinner__dna\">\n <div class=\"spinner__dnatrack spinner__dnatrack--1\">\n <div class=\"spinner__dnadot spinner__dnadot--1\"></div>\n <div class=\"spinner__dnadot spinner__dnadot--2\"></div>\n </div>\n <div class=\"spinner__dnatrack spinner__dnatrack--2\">\n <div class=\"spinner__dnadot spinner__dnadot--3\"></div>\n <div class=\"spinner__dnadot spinner__dnadot--4\"></div>\n </div>\n <div class=\"spinner__dnatrack spinner__dnatrack--3\">\n <div class=\"spinner__dnadot spinner__dnadot--5\"></div>\n <div class=\"spinner__dnadot spinner__dnadot--6\"></div>\n </div>\n <div class=\"spinner__dnatrack spinner__dnatrack--4\">\n <div class=\"spinner__dnadot spinner__dnadot--7\"></div>\n <div class=\"spinner__dnadot spinner__dnadot--8\"></div>\n </div>\n <div class=\"spinner__dnatrack spinner__dnatrack--5\">\n <div class=\"spinner__dnadot spinner__dnadot--9\"></div>\n <div class=\"spinner__dnadot spinner__dnadot--10\"></div>\n </div>\n </div>\n )}\n {this.type === 'circle' && <span class=\"spinner__spin\"></span>}\n </div>\n {this.hasText && (\n <div class=\"spinner__text\">\n <slot />\n </div>\n )}\n {this.overlay && <div class=\"spinner__overlay\"></div>}\n </div>\n );\n }\n}\n"],"version":3}
1	+ {"file":"nano-spinner.entry.js","mappings":";;;;;AAAA,MAAM,UAAU,GAAG,29GAA29G;;MCkBj+G,OAAO;;;mBAEU,KAAK;gBAGA,KAAK;mBAGM,KAAK;;EAEjD,iBAAiB;IACf,IAAI,CAAC,OAAO,GAAG,CAAC,CAAC,IAAI,CAAC,EAAE,CAAC,UAAU,CAAC,MAAM,CAAC;GAC5C;EAED,MAAM;IACJ,QACE,WAAK,KAAK,EAAC,SAAS,eAAW,MAAM,eAAW,QAAQ,IACtD,WAAK,KAAK,EAAC,iBAAiB,IACzB,IAAI,CAAC,IAAI,KAAK,KAAK,KAClB,WAAK,KAAK,EAAC,cAAc,IACvB,WAAK,KAAK,EAAC,wCAAwC,IACjD,WAAK,KAAK,EAAC,oCAAoC,GAAO,EACtD,WAAK,KAAK,EAAC,oCAAoC,GAAO,CAClD,EACN,WAAK,KAAK,EAAC,wCAAwC,IACjD,WAAK,KAAK,EAAC,oCAAoC,GAAO,EACtD,WAAK,KAAK,EAAC,oCAAoC,GAAO,CAClD,EACN,WAAK,KAAK,EAAC,wCAAwC,IACjD,WAAK,KAAK,EAAC,oCAAoC,GAAO,EACtD,WAAK,KAAK,EAAC,oCAAoC,GAAO,CAClD,EACN,WAAK,KAAK,EAAC,wCAAwC,IACjD,WAAK,KAAK,EAAC,oCAAoC,GAAO,EACtD,WAAK,KAAK,EAAC,oCAAoC,GAAO,CAClD,EACN,WAAK,KAAK,EAAC,wCAAwC,IACjD,WAAK,KAAK,EAAC,oCAAoC,GAAO,EACtD,WAAK,KAAK,EAAC,qCAAqC,GAAO,CACnD,CACF,CACP,EACA,IAAI,CAAC,IAAI,KAAK,QAAQ,IAAI,YAAM,KAAK,EAAC,eAAe,GAAQ,CAC1D,EACL,IAAI,CAAC,OAAO,KACX,WAAK,KAAK,EAAC,eAAe,EAAC,GAAG,EAAC,cAAc,IAC3C,eAAQ,CACJ,CACP,EACA,IAAI,CAAC,OAAO,KACX,WAAK,KAAK,EAAC,kBAAkB,EAAC,GAAG,EAAC,iBAAiB,GAAO,CAC3D,CACG,EACN;GACH;;;;;;;","names":[],"sources":["./src/components/spinner/spinner.scss?tag=nano-spinner&encapsulation=shadow","./src/components/spinner/spinner.tsx"],"sourcesContent":["@import '../../global/style/nano-theme/components';\n@import '../../global/style/nano-theme/layers';\n\n:host {\n /*\n @prop --base-color-rgb: default #{$progress-indicator-color-rgb}\n * @prop --indicator-color: default var(--nano-indicator-color, rgba(var(--base-color-rgb), 1));\n * @prop --track-color: default var(--nano-track-color, rgba(var(--base-color-rgb), 0.2));\n * @prop --spinner-scale: optional scaling of the spinner. default contextual font-size\n * @prop --overlay-color: #{$layer-overlay-light};\n /\n\n display: inline-block;\n\n // --spinner-scale: 5em;\n --base-color-rgb: #{$progress-indicator-color-rgb};\n --indicator-color:\n var(\n --nano-indicator-color,\n rgb(var(--base-color-rgb) / 100%)\n );\n --track-color: var(--nano-track-color, rgb(var(--base-color-rgb) / 20%));\n --overlay-color: #{$layer-overlay-light};\n}\n\n.spinner {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n\n :host([overlay]:not([overlay='false'])) & {\n position: absolute;\n inset: 0;\n\n .spinner__loader,\n .spinner__text {\n z-index: 1;\n }\n }\n\n &__overlay {\n background: var(--overlay-color);\n position: absolute;\n inset: 0;\n z-index: 0;\n backdrop-filter: blur(#{$layer-overlay-blur});\n }\n\n &__loader {\n font-size: var(--spinner-scale, 1em);\n }\n\n &__spin {\n display: block;\n margin: auto;\n inline-size: 1em;\n block-size: 1em;\n border-radius: 50%;\n border: solid 0.1em var(--track-color);\n border-block-start-color: var(--indicator-color);\n border-inline-end-color: var(--indicator-color);\n border-inline-start-color: var(--indicator-color);\n animation: 1s linear infinite spin;\n }\n\n &__dna {\n font-size: 0.2286em;\n display: flex;\n }\n\n &__dnatrack {\n position: relative;\n padding-block: 0;\n padding-inline: 0.625em;\n block-size: 4.375em;\n inline-size: 0.625em;\n overflow: hidden;\n\n &::before {\n content: '';\n position: absolute;\n inset-block-start: 1.875em;\n inset-inline-start: 50%;\n transform: translateX(-50%) translateZ(0);\n inline-size: 0.0625em;\n inline-size: #{'max(.0625em, 1px)'};\n block-size: 0.625em;\n background: var(--track-color);\n animation: flex 1.5s linear infinite;\n transform-origin: center center;\n }\n\n &--2::before {\n animation: flex 1.5s -1.3s linear infinite;\n }\n\n &--3::before {\n animation: flex 1.5s -1.1s linear infinite;\n }\n\n &--4::before {\n animation: flex 1.5s -0.9s linear infinite;\n }\n\n &--5::before {\n animation: flex 1.5s -0.75s linear infinite;\n }\n }\n\n &__dnadot {\n position: absolute;\n inline-size: 0.5em;\n block-size: 0.5em;\n border-radius: 50%;\n background: var(--indicator-color);\n animation: rotate 1.5s linear infinite;\n transform-origin: center center;\n inset-inline-start: 50%;\n transform: translateX(-50%) translateZ(0) translateY(0);\n\n &--2 {\n animation: rotate 1.5s -0.75s linear infinite;\n }\n\n &--3 {\n animation: rotate 1.5s -1.3s linear infinite;\n }\n\n &--4 {\n animation: rotate 1.5s -0.55s linear infinite;\n }\n\n &--5 {\n animation: rotate 1.5s -1.1s linear infinite;\n }\n\n &--6 {\n animation: rotate 1.5s -0.35s linear infinite;\n }\n\n &--7 {\n animation: rotate 1.5s -0.9s linear infinite;\n }\n\n &--8 {\n animation: rotate 1.5s -0.15s linear infinite;\n }\n\n &--9 {\n animation: rotate 1.5s -0.75s linear infinite;\n }\n\n &--10 {\n animation: rotate 1.5s 0s linear infinite;\n }\n }\n\n &__text {\n text-align: center;\n position: relative;\n margin-block-start: 0.5em;\n }\n\n @keyframes spin {\n 0% {\n transform: rotate(0deg);\n }\n\n 100% {\n transform: rotate(360deg);\n }\n }\n\n @keyframes rotate {\n 0%,\n 100% {\n transform: translateX(-50%) translateY(0) scale(1);\n }\n\n 25% {\n transform: translateX(-50%) translateY(1.875em) scale(2);\n }\n\n 50% {\n transform: translateX(-50%) translateY(3.75em) scale(1);\n }\n\n 75% {\n transform: translateX(-50%) translateY(1.875em) scale(0.3);\n }\n }\n\n @keyframes flex {\n 0%,\n 100% {\n transform: translateX(-50%) scaleY(5);\n }\n\n 25% {\n transform: translateX(-50%) scaleY(1);\n }\n\n 50% {\n transform: translateX(-50%) scaleY(5);\n }\n\n 75% {\n transform: translateX(-50%) scaleY(1);\n }\n }\n}\n","import {\n Component,\n h,\n ComponentInterface,\n Prop,\n Element,\n State,\n} from '@stencil/core';\n\n/\n Spinners are used to show the progress of an indeterminate operation.\n * @slot - Used for loading messages\n /\n@Component({\n tag: 'nano-spinner',\n styleUrl: 'spinner.scss',\n shadow: true,\n})\nexport class Spinner implements ComponentInterface {\n @Element() el: HTMLNanoSpinnerElement;\n @State() hasText: boolean = false;\n\n /* The type of spinner animation. dna should be used for larger, page loads. Circle for smaller component loaders. /\n @Prop() type: 'dna' \| 'circle' = 'dna';\n\n /* Displays absolutely with an overlay */\n @Prop({ reflect: true }) overlay: boolean = false;\n\n componentWillLoad() {\n this.hasText = !!this.el.childNodes.length;\n }\n\n render() {\n return (\n <div class=\"spinner\" aria-busy=\"true\" aria-live=\"polite\">\n <div class=\"spinner__loader\">\n {this.type === 'dna' && (\n <div class=\"spinner__dna\">\n <div class=\"spinner__dnatrack spinner__dnatrack--1\">\n <div class=\"spinner__dnadot spinner__dnadot--1\"></div>\n <div class=\"spinner__dnadot spinner__dnadot--2\"></div>\n </div>\n <div class=\"spinner__dnatrack spinner__dnatrack--2\">\n <div class=\"spinner__dnadot spinner__dnadot--3\"></div>\n <div class=\"spinner__dnadot spinner__dnadot--4\"></div>\n </div>\n <div class=\"spinner__dnatrack spinner__dnatrack--3\">\n <div class=\"spinner__dnadot spinner__dnadot--5\"></div>\n <div class=\"spinner__dnadot spinner__dnadot--6\"></div>\n </div>\n <div class=\"spinner__dnatrack spinner__dnatrack--4\">\n <div class=\"spinner__dnadot spinner__dnadot--7\"></div>\n <div class=\"spinner__dnadot spinner__dnadot--8\"></div>\n </div>\n <div class=\"spinner__dnatrack spinner__dnatrack--5\">\n <div class=\"spinner__dnadot spinner__dnadot--9\"></div>\n <div class=\"spinner__dnadot spinner__dnadot--10\"></div>\n </div>\n </div>\n )}\n {this.type === 'circle' && <span class=\"spinner__spin\"></span>}\n </div>\n {this.hasText && (\n <div class=\"spinner__text\" key=\"spinner-text\">\n <slot />\n </div>\n )}\n {this.overlay && (\n <div class=\"spinner__overlay\" key=\"spinner-overlay\"></div>\n )}\n </div>\n );\n }\n}\n"],"version":3}

package/dist/esm/nano-split-pane.entry.js CHANGED Viewed

@@ -1,7 +1,7 @@
 /*!
  * Web Components for Nanopore digital Web Apps
  */
-import { r as registerInstance, c as createEvent, h, a as Host, g as getElement } from './index-3c280603.js';
+import { r as registerInstance, c as createEvent, h, a as Host, g as getElement } from './index-b4e277ad.js';
 import { c as clamp } from './math-c02ddfda.js';
 import { d as debounce } from './throttle-7836544e.js';
@@ -23,9 +23,19 @@ function drag(container, onMove) {
   document.addEventListener('pointerup', stop);
 }
-const splitPaneCss = ":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],[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 splitPaneCss = ":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 SplitPane = class {
+  get size() {
+    const { width, height } = this.host.getBoundingClientRect();
+    return this.vertical ? height : width;
+  }
+  get shouldAnimate() {
+    return this.didLoad && this._shouldAnimate;
+  }
+  set shouldAnimate(sa) {
+    this._shouldAnimate = sa;
+  }
   constructor(hostRef) {
     registerInstance(this, hostRef);
     this.nanoReposition = createEvent(this, "nanoReposition", 7);
@@ -122,16 +132,6 @@ const SplitPane = class {
     this.animationDuration = 0.6;
     this.handlePositionChange = debounce(this.handlePositionChange.bind(this), 100);
   }
-  get size() {
-    const { width, height } = this.host.getBoundingClientRect();
-    return this.vertical ? height : width;
-  }
-  get shouldAnimate() {
-    return this.didLoad && this._shouldAnimate;
-  }
-  set shouldAnimate(sa) {
-    this._shouldAnimate = sa;
-  }
   /**
    * The current position of the divider from the primary panel's edge
    * as a percentage 0-100. Defaults to 50% of the container's initial size.
@@ -152,7 +152,7 @@ const SplitPane = class {
     }
     this._position = pos;
   }
-  // eslint-disable-next-line @stencil/no-unused-watch
+  // eslint-disable-next-line @stencil-community/no-unused-watch
   handlePositionChange() {
     this.cachedPositionInPixels = this.percentageToPixels(this.position);
     this.positionInPixels = this.percentageToPixels(this.position);
@@ -209,6 +209,8 @@ const SplitPane = class {
     return (value / this.size) * 100;
   }
   attachRO() {
+    if (!window['ResizeObserver'])
+      return;
     this.detachRO();
     this.ro = new ResizeObserver(() => this.handleResize());
     this.ro.observe(this.host);

package/dist/esm/nano-split-pane.entry.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"nano-split-pane.entry.js","mappings":"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","names":[],"sources":["./src/utils/drag.ts","./src/components/split-pane/split-pane.scss?tag=nano-split-pane&encapsulation=shadow","./src/components/split-pane/split-pane.tsx"],"sourcesContent":["export function drag(\n container: HTMLElement,\n onMove: (x: number, y: number) => void\n) {\n function move(pointerEvent: PointerEvent) {\n const dims = container.getBoundingClientRect();\n const defaultView = container.ownerDocument.defaultView!;\n const offsetX = dims.left + defaultView.pageXOffset;\n const offsetY = dims.top + defaultView.pageYOffset;\n const x = pointerEvent.pageX - offsetX;\n const y = pointerEvent.pageY - offsetY;\n\n onMove(x, y);\n }\n\n function stop() {\n document.removeEventListener('pointermove', move);\n document.removeEventListener('pointerup', stop);\n }\n\n document.addEventListener('pointermove', move, { passive: true });\n document.addEventListener('pointerup', stop);\n}\n","@use 'sass:map';\n@use 'sass:list';\n\n@import '../../global/style/nano-theme/components';\n@import '../../global/style/nano-theme/form';\n\n:host {\n /*\n @prop --divider-width: The width of the visible divider. Default 4px.\n * @prop --divider-hit-area: The invisible region around the divider where dragging can occur. This is\n * usually wider than the divider to facilitate easier dragging. Default 12px.\n * @prop --min: The minimum allowed size of the primary panel. Default 0.\n * @prop --max: The maximum allowed size of the primary panel. Default 100%.\n * @prop --background-color: Handle background. Default #{map.get($colors, lightgrey)}.\n * @prop --content-color: Handle color. Default #{map.get($colors, dimgrey)}.\n /\n --divider-width: 12px;\n --divider-hit-area: 14px;\n --min: 0%;\n --max: 100%;\n --background-color: #{map.get($colors, lightgrey)};\n --content-color: #{map.get($colors, dimgrey)};\n\n display: grid;\n}\n\n.start,\n.end {\n overflow: hidden;\n}\n\n.divider {\n flex: 0 0 var(--divider-width);\n display: flex;\n position: relative;\n align-items: center;\n justify-content: center;\n background-color: var(--background-color);\n color: var(--content-color);\n z-index: 1;\n font-size: 0.8rem;\n}\n\n.divider:focus {\n outline: none;\n}\n\n:host(:not([disabled])) .divider:focus-visible {\n background-color: #{$control-focus-color};\n}\n\n:host([disabled]) .divider {\n cursor: not-allowed;\n}\n\n/ Horizontal /\n:host(:not([vertical], [disabled])) .divider {\n cursor: col-resize;\n}\n\n:host(:not([vertical])) .divider::after {\n display: flex;\n content: '';\n position: absolute;\n block-size: 100%;\n inset-inline-start: calc(var(--divider-hit-area) / -2 + var(--divider-width) / 2);\n inline-size: var(--divider-hit-area);\n}\n\n/ Vertical /\n:host([vertical]) {\n flex-direction: column;\n}\n\n:host([vertical]:not([disabled])) .divider {\n cursor: row-resize;\n}\n\n:host([vertical]) .divider::after {\n content: '';\n position: absolute;\n inline-size: 100%;\n inset-block-start: calc(var(--divider-hit-area) / -2 + var(--divider-width) / 2);\n block-size: var(--divider-hit-area);\n}\n","import {\n Prop,\n Component,\n Watch,\n Event,\n EventEmitter,\n ComponentInterface,\n Element,\n Host,\n h,\n Method,\n} from '@stencil/core';\nimport { drag } from '../../utils/drag';\nimport { clamp } from '../../utils/math';\nimport { debounce } from '../../utils/throttle';\n\n/\n Split panes display two adjacent panels, allowing the user to reposition them.\n \n @part start - The start panel.\n * @part end - The end panel.\n * @part panel - Targets both the start and end panels.\n * @part divider - The divider that separates the start and end panels.\n \n @slot start - The start panel.\n * @slot end - The end panel.\n * @slot handle - An optional handle to render at the center of the divider.\n /\n@Component({\n tag: 'nano-split-pane',\n styleUrl: 'split-pane.scss',\n shadow: true,\n})\nexport class SplitPane implements ComponentInterface {\n @Element() host: HTMLNanoSplitPaneElement;\n private cachedPositionInPixels: number;\n private ro: ResizeObserver;\n private isAnimating = false;\n private didLoad = false;\n\n private get size() {\n const { width, height } = this.host.getBoundingClientRect();\n return this.vertical ? height : width;\n }\n\n private get shouldAnimate() {\n return this.didLoad && this._shouldAnimate;\n }\n private set shouldAnimate(sa: boolean) {\n this._shouldAnimate = sa;\n }\n private _shouldAnimate: boolean = true;\n\n constructor() {\n this.handlePositionChange = debounce(\n this.handlePositionChange.bind(this),\n 100\n );\n }\n\n /\n The current position of the divider from the primary panel's edge\n * as a percentage 0-100. Defaults to 50% of the container's initial size.\n /\n @Prop()\n get position() {\n return this._position;\n }\n set position(pos: number) {\n // override too high / low\n pos = Math.min(Math.max(pos, 0), 100);\n if (isNaN(pos) \|\| pos === this._position) return;\n\n if (\n this.shouldAnimate &&\n this.animationDuration > 0 &&\n !isNaN(this.position)\n ) {\n this.animatePosition(pos);\n return;\n }\n this._position = pos;\n }\n private _position: number;\n\n // eslint-disable-next-line @stencil/no-unused-watch\n @Watch('position')\n handlePositionChange() {\n this.cachedPositionInPixels = this.percentageToPixels(this.position);\n this.positionInPixels = this.percentageToPixels(this.position);\n this.nanoReposition.emit();\n }\n\n /\n The current position of the divider from the primary panel's edge in pixels.\n /\n @Prop({ mutable: true }) positionInPixels: number;\n\n @Watch('positionInPixels')\n handlePositionInPixelsChange() {\n this.position = this.pixelsToPercentage(this.positionInPixels);\n }\n\n /* Draws the split panel in a vertical orientation with the start and end panels stacked. /\n @Prop({ reflect: true }) vertical = false;\n\n /* Disables resizing. Note that the position may still change as a result of resizing the host element. /\n @Prop({ reflect: true }) disabled = false;\n\n /\n If no primary panel is designated, both panels will resize proportionally when the host element is resized. If a\n * primary panel is designated, it will maintain its size and the other panel will grow or shrink as needed when the\n * host element is resized.\n /\n @Prop() primary?: 'start' \| 'end';\n\n /\n One or more space-separated values at which the divider should snap. Values can be in pixels or percentages, e.g.\n * `\"100px 50%\"`.\n /\n @Prop() snap?: string;\n\n /* How close the divider must be to a snap point until snapping occurs. /\n @Prop() snapThreshold = 12;\n\n /* When changing `position` via property, the pane will animate into position. Make `animationDuration` 0 to disable. /\n @Prop() animationDuration = 0.6;\n\n /* Emitted when the divider's position changes. /\n @Event() nanoReposition: EventEmitter;\n\n /* Emitted when the divider is being dragged. /\n @Event() nanoDragging: EventEmitter<number>;\n\n /* Utility to convert % to pixels /\n @Method()\n async getPercentageToPixels(value: number) {\n return this.percentageToPixels(value);\n }\n\n /* Utility to convert pixels to % (`position`) /\n @Method()\n async getPixelsToPercentage(value: number) {\n return this.pixelsToPercentage(value);\n }\n\n // Private logic\n\n private animatePosition(end: number) {\n if (this.isAnimating) return;\n\n const duration = this.animationDuration; // seconds\n const fps = 60;\n const start = this.position;\n const distance = end - start;\n\n let position = start;\n let time = 0;\n\n function easeInOutQuad(t: number, s: number, e: number, d: number) {\n if ((t /= d / 2) < 1) return (e / 2) t * t + s;\n else return (-e / 2) * (--t * (t - 2) - 1) + s;\n }\n\n const go = () => {\n time += 1 / fps;\n position = easeInOutQuad(time, start, distance, duration);\n\n if (\n (end > start && position >= end) \|\|\n (end < start && position <= end)\n ) {\n this.position = end;\n this.shouldAnimate = true;\n this.isAnimating = false;\n return;\n }\n this.position = position;\n requestAnimationFrame(go);\n };\n\n this.shouldAnimate = false;\n this.isAnimating = true;\n requestAnimationFrame(go);\n }\n\n private percentageToPixels(value: number) {\n return this.size * (value / 100);\n }\n\n private pixelsToPercentage(value: number) {\n return (value / this.size) * 100;\n }\n\n private attachRO() {\n this.detachRO();\n this.ro = new ResizeObserver(() => this.handleResize());\n this.ro.observe(this.host);\n }\n\n private detachRO() {\n if (!this.ro) return;\n this.ro.unobserve(this.host);\n this.ro = undefined;\n }\n\n // Event handlers\n\n private handleDrag = (e: Event) => {\n if (this.disabled) {\n return;\n }\n\n // Prevent text selection when dragging\n e.preventDefault();\n\n drag(this.host, (x, y) => {\n let newPositionInPixels = this.vertical ? y : x;\n\n this.nanoDragging.emit(newPositionInPixels);\n\n // Flip for end panels\n if (this.primary === 'end') {\n newPositionInPixels = this.size - newPositionInPixels;\n }\n\n // Check snap points\n if (this.snap) {\n const snaps = this.snap.split(' ');\n\n snaps.forEach((value) => {\n let snapPoint: number;\n\n if (value.endsWith('%')) {\n snapPoint = this.size * (parseFloat(value) / 100);\n } else {\n snapPoint = parseFloat(value);\n }\n\n if (\n newPositionInPixels >= snapPoint - this.snapThreshold &&\n newPositionInPixels <= snapPoint + this.snapThreshold\n ) {\n newPositionInPixels = snapPoint;\n }\n });\n }\n this.shouldAnimate = false;\n this.position = clamp(\n this.pixelsToPercentage(newPositionInPixels),\n 0,\n 100\n );\n requestAnimationFrame(() => (this.shouldAnimate = true));\n });\n };\n\n private handleKeyDown = (event: KeyboardEvent) => {\n if (this.disabled) {\n return;\n }\n\n if (\n [\n 'ArrowLeft',\n 'ArrowRight',\n 'ArrowUp',\n 'ArrowDown',\n 'Home',\n 'End',\n ].includes(event.key)\n ) {\n let newPosition = this.position;\n const incr =\n (event.shiftKey ? 10 : 1) * (this.primary === 'end' ? -1 : 1);\n\n event.preventDefault();\n\n if (\n (event.key === 'ArrowLeft' && !this.vertical) \|\|\n (event.key === 'ArrowUp' && this.vertical)\n ) {\n newPosition -= incr;\n }\n\n if (\n (event.key === 'ArrowRight' && !this.vertical) \|\|\n (event.key === 'ArrowDown' && this.vertical)\n ) {\n newPosition += incr;\n }\n\n if (event.key === 'Home') {\n newPosition = this.primary === 'end' ? 100 : 0;\n }\n\n if (event.key === 'End') {\n newPosition = this.primary === 'end' ? 0 : 100;\n }\n\n this.shouldAnimate = false;\n\n this.position = clamp(newPosition, 0, 100);\n requestAnimationFrame(() => (this.shouldAnimate = true));\n }\n };\n\n private handleResize = () => {\n if (!this.didLoad \|\| this.isAnimating) return;\n\n // Resize when a primary panel is set\n if (this.primary) {\n this.shouldAnimate = false;\n this.position = this.pixelsToPercentage(this.cachedPositionInPixels);\n requestAnimationFrame(() => (this.shouldAnimate = true));\n }\n };\n\n componentDidLoad(): void {\n if (this.positionInPixels) this.handlePositionInPixelsChange();\n setTimeout(() => (this.didLoad = true));\n }\n\n connectedCallback() {\n this.cachedPositionInPixels = this.percentageToPixels(this.position);\n this.attachRO();\n }\n\n disconnectedCallback() {\n this.detachRO();\n }\n\n componentDidRender(): void {\n // bit hacky ... because we use getter / setter for position, there's a render before `position` is passed in via attribute\n // if we set a default position in the class, this causes the divider to jump (from default to user set position)\n // so - wait a render, see if there's a position passed in via attribute, then set default if not\n requestAnimationFrame(() => {\n if (typeof this.position === 'undefined') {\n this.position = 50;\n }\n });\n }\n\n render() {\n if (typeof this.position === 'undefined') return;\n const styles: { gridTemplateRows?: string; gridTemplateColumns?: string } =\n {};\n const gridTemplate = this.vertical\n ? 'gridTemplateRows'\n : 'gridTemplateColumns';\n const primary = `\n clamp(\n 0%,\n clamp(\n var(--min),\n ${this.position}% - var(--divider-width) / 2,\n var(--max)\n ),\n calc(100% - var(--divider-width))\n )\n `;\n const secondary = 'auto';\n\n if (this.primary === 'end') {\n styles[gridTemplate] = `${secondary} var(--divider-width) ${primary}`;\n } else {\n styles[gridTemplate] = `${primary} var(--divider-width) ${secondary}`;\n }\n\n return (\n <Host style={styles}>\n <div part=\"panel start\" class=\"start\">\n <slot name=\"start\"></slot>\n </div>\n <div\n part=\"divider\"\n class=\"divider\"\n tabindex={this.disabled ? undefined : '0'}\n role=\"separator\"\n aria-label=\"Resize\"\n onKeyDown={this.handleKeyDown}\n onMouseDown={this.handleDrag}\n onTouchStart={this.handleDrag}\n >\n <slot name=\"handle\">\n {!this.disabled && this.vertical ? (\n <nano-icon slot=\"handle\" name=\"solid/grip-lines\" />\n ) : (\n <nano-icon slot=\"handle\" name=\"solid/grip-lines-vertical\" />\n )}\n </slot>\n </div>\n <div part=\"panel end\" class=\"end\">\n <slot name=\"end\"></slot>\n </div>\n </Host>\n );\n }\n}\n"],"version":3}
1	+ {"file":"nano-split-pane.entry.js","mappings":"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","names":[],"sources":["./src/utils/drag.ts","./src/components/split-pane/split-pane.scss?tag=nano-split-pane&encapsulation=shadow","./src/components/split-pane/split-pane.tsx"],"sourcesContent":["export function drag(\n container: HTMLElement,\n onMove: (x: number, y: number) => void\n) {\n function move(pointerEvent: PointerEvent) {\n const dims = container.getBoundingClientRect();\n const defaultView = container.ownerDocument.defaultView!;\n const offsetX = dims.left + defaultView.pageXOffset;\n const offsetY = dims.top + defaultView.pageYOffset;\n const x = pointerEvent.pageX - offsetX;\n const y = pointerEvent.pageY - offsetY;\n\n onMove(x, y);\n }\n\n function stop() {\n document.removeEventListener('pointermove', move);\n document.removeEventListener('pointerup', stop);\n }\n\n document.addEventListener('pointermove', move, { passive: true });\n document.addEventListener('pointerup', stop);\n}\n","@use 'sass:map';\n@use 'sass:list';\n\n@import '../../global/style/nano-theme/components';\n@import '../../global/style/nano-theme/form';\n\n:host {\n /*\n @prop --divider-width: The width of the visible divider. Default 4px.\n * @prop --divider-hit-area: The invisible region around the divider where dragging can occur. This is\n * usually wider than the divider to facilitate easier dragging. Default 12px.\n * @prop --min: The minimum allowed size of the primary panel. Default 0.\n * @prop --max: The maximum allowed size of the primary panel. Default 100%.\n * @prop --background-color: Handle background. Default #{map.get($colors, lightgrey)}.\n * @prop --content-color: Handle color. Default #{map.get($colors, dimgrey)}.\n /\n --divider-width: 12px;\n --divider-hit-area: 14px;\n --min: 0%;\n --max: 100%;\n --background-color: #{map.get($colors, lightgrey)};\n --content-color: #{map.get($colors, dimgrey)};\n\n display: grid;\n}\n\n.start,\n.end {\n overflow: hidden;\n}\n\n.divider {\n flex: 0 0 var(--divider-width);\n display: flex;\n position: relative;\n align-items: center;\n justify-content: center;\n background-color: var(--background-color);\n color: var(--content-color);\n z-index: 1;\n font-size: 0.8rem;\n}\n\n.divider:focus {\n outline: none;\n}\n\n:host(:not([disabled])) .divider:focus-visible {\n background-color: #{$control-focus-color};\n}\n\n:host([disabled]) .divider {\n cursor: not-allowed;\n}\n\n/ Horizontal /\n:host(:not([vertical]):not([disabled])) .divider {\n cursor: col-resize;\n}\n\n:host(:not([vertical])) .divider::after {\n display: flex;\n content: '';\n position: absolute;\n block-size: 100%;\n inset-inline-start:\n calc(\n var(--divider-hit-area) / -2 + var(--divider-width) / 2\n );\n inline-size: var(--divider-hit-area);\n}\n\n/ Vertical /\n:host([vertical]) {\n flex-direction: column;\n}\n\n:host([vertical]:not([disabled])) .divider {\n cursor: row-resize;\n}\n\n:host([vertical]) .divider::after {\n content: '';\n position: absolute;\n inline-size: 100%;\n inset-block-start:\n calc(\n var(--divider-hit-area) / -2 + var(--divider-width) / 2\n );\n block-size: var(--divider-hit-area);\n}\n","import {\n Prop,\n Component,\n Watch,\n Event,\n EventEmitter,\n ComponentInterface,\n Element,\n Host,\n h,\n Method,\n} from '@stencil/core';\nimport { drag } from '../../utils/drag';\nimport { clamp } from '../../utils/math';\nimport { debounce } from '../../utils/throttle';\n\n/\n Split panes display two adjacent panels, allowing the user to reposition them.\n \n @part start - The start panel.\n * @part end - The end panel.\n * @part panel - Targets both the start and end panels.\n * @part divider - The divider that separates the start and end panels.\n \n @slot start - The start panel.\n * @slot end - The end panel.\n * @slot handle - An optional handle to render at the center of the divider.\n /\n@Component({\n tag: 'nano-split-pane',\n styleUrl: 'split-pane.scss',\n shadow: true,\n})\nexport class SplitPane implements ComponentInterface {\n @Element() host: HTMLNanoSplitPaneElement;\n private cachedPositionInPixels: number;\n private ro: ResizeObserver;\n private isAnimating = false;\n private didLoad = false;\n\n private get size() {\n const { width, height } = this.host.getBoundingClientRect();\n return this.vertical ? height : width;\n }\n\n private get shouldAnimate() {\n return this.didLoad && this._shouldAnimate;\n }\n private set shouldAnimate(sa: boolean) {\n this._shouldAnimate = sa;\n }\n private _shouldAnimate: boolean = true;\n\n constructor() {\n this.handlePositionChange = debounce(\n this.handlePositionChange.bind(this),\n 100\n );\n }\n\n /\n The current position of the divider from the primary panel's edge\n * as a percentage 0-100. Defaults to 50% of the container's initial size.\n /\n @Prop()\n get position() {\n return this._position;\n }\n set position(pos: number) {\n // override too high / low\n pos = Math.min(Math.max(pos, 0), 100);\n if (isNaN(pos) \|\| pos === this._position) return;\n\n if (\n this.shouldAnimate &&\n this.animationDuration > 0 &&\n !isNaN(this.position)\n ) {\n this.animatePosition(pos);\n return;\n }\n this._position = pos;\n }\n private _position: number;\n\n // eslint-disable-next-line @stencil-community/no-unused-watch\n @Watch('position')\n handlePositionChange() {\n this.cachedPositionInPixels = this.percentageToPixels(this.position);\n this.positionInPixels = this.percentageToPixels(this.position);\n this.nanoReposition.emit();\n }\n\n /\n The current position of the divider from the primary panel's edge in pixels.\n /\n @Prop({ mutable: true }) positionInPixels: number;\n\n @Watch('positionInPixels')\n handlePositionInPixelsChange() {\n this.position = this.pixelsToPercentage(this.positionInPixels);\n }\n\n /* Draws the split panel in a vertical orientation with the start and end panels stacked. /\n @Prop({ reflect: true }) vertical = false;\n\n /* Disables resizing. Note that the position may still change as a result of resizing the host element. /\n @Prop({ reflect: true }) disabled = false;\n\n /\n If no primary panel is designated, both panels will resize proportionally when the host element is resized. If a\n * primary panel is designated, it will maintain its size and the other panel will grow or shrink as needed when the\n * host element is resized.\n /\n @Prop() primary?: 'start' \| 'end';\n\n /\n One or more space-separated values at which the divider should snap. Values can be in pixels or percentages, e.g.\n * `\"100px 50%\"`.\n /\n @Prop() snap?: string;\n\n /* How close the divider must be to a snap point until snapping occurs. /\n @Prop() snapThreshold = 12;\n\n /* When changing `position` via property, the pane will animate into position. Make `animationDuration` 0 to disable. /\n @Prop() animationDuration = 0.6;\n\n /* Emitted when the divider's position changes. /\n @Event() nanoReposition: EventEmitter;\n\n /* Emitted when the divider is being dragged. /\n @Event() nanoDragging: EventEmitter<number>;\n\n /* Utility to convert % to pixels /\n @Method()\n async getPercentageToPixels(value: number) {\n return this.percentageToPixels(value);\n }\n\n /* Utility to convert pixels to % (`position`) /\n @Method()\n async getPixelsToPercentage(value: number) {\n return this.pixelsToPercentage(value);\n }\n\n // Private logic\n\n private animatePosition(end: number) {\n if (this.isAnimating) return;\n\n const duration = this.animationDuration; // seconds\n const fps = 60;\n const start = this.position;\n const distance = end - start;\n\n let position = start;\n let time = 0;\n\n function easeInOutQuad(t: number, s: number, e: number, d: number) {\n if ((t /= d / 2) < 1) return (e / 2) t * t + s;\n else return (-e / 2) * (--t * (t - 2) - 1) + s;\n }\n\n const go = () => {\n time += 1 / fps;\n position = easeInOutQuad(time, start, distance, duration);\n\n if (\n (end > start && position >= end) \|\|\n (end < start && position <= end)\n ) {\n this.position = end;\n this.shouldAnimate = true;\n this.isAnimating = false;\n return;\n }\n this.position = position;\n requestAnimationFrame(go);\n };\n\n this.shouldAnimate = false;\n this.isAnimating = true;\n requestAnimationFrame(go);\n }\n\n private percentageToPixels(value: number) {\n return this.size * (value / 100);\n }\n\n private pixelsToPercentage(value: number) {\n return (value / this.size) * 100;\n }\n\n private attachRO() {\n if (!window['ResizeObserver']) return;\n\n this.detachRO();\n this.ro = new ResizeObserver(() => this.handleResize());\n this.ro.observe(this.host);\n }\n\n private detachRO() {\n if (!this.ro) return;\n this.ro.unobserve(this.host);\n this.ro = undefined;\n }\n\n // Event handlers\n\n private handleDrag = (e: Event) => {\n if (this.disabled) {\n return;\n }\n\n // Prevent text selection when dragging\n e.preventDefault();\n\n drag(this.host, (x, y) => {\n let newPositionInPixels = this.vertical ? y : x;\n\n this.nanoDragging.emit(newPositionInPixels);\n\n // Flip for end panels\n if (this.primary === 'end') {\n newPositionInPixels = this.size - newPositionInPixels;\n }\n\n // Check snap points\n if (this.snap) {\n const snaps = this.snap.split(' ');\n\n snaps.forEach((value) => {\n let snapPoint: number;\n\n if (value.endsWith('%')) {\n snapPoint = this.size * (parseFloat(value) / 100);\n } else {\n snapPoint = parseFloat(value);\n }\n\n if (\n newPositionInPixels >= snapPoint - this.snapThreshold &&\n newPositionInPixels <= snapPoint + this.snapThreshold\n ) {\n newPositionInPixels = snapPoint;\n }\n });\n }\n this.shouldAnimate = false;\n this.position = clamp(\n this.pixelsToPercentage(newPositionInPixels),\n 0,\n 100\n );\n requestAnimationFrame(() => (this.shouldAnimate = true));\n });\n };\n\n private handleKeyDown = (event: KeyboardEvent) => {\n if (this.disabled) {\n return;\n }\n\n if (\n [\n 'ArrowLeft',\n 'ArrowRight',\n 'ArrowUp',\n 'ArrowDown',\n 'Home',\n 'End',\n ].includes(event.key)\n ) {\n let newPosition = this.position;\n const incr =\n (event.shiftKey ? 10 : 1) * (this.primary === 'end' ? -1 : 1);\n\n event.preventDefault();\n\n if (\n (event.key === 'ArrowLeft' && !this.vertical) \|\|\n (event.key === 'ArrowUp' && this.vertical)\n ) {\n newPosition -= incr;\n }\n\n if (\n (event.key === 'ArrowRight' && !this.vertical) \|\|\n (event.key === 'ArrowDown' && this.vertical)\n ) {\n newPosition += incr;\n }\n\n if (event.key === 'Home') {\n newPosition = this.primary === 'end' ? 100 : 0;\n }\n\n if (event.key === 'End') {\n newPosition = this.primary === 'end' ? 0 : 100;\n }\n\n this.shouldAnimate = false;\n\n this.position = clamp(newPosition, 0, 100);\n requestAnimationFrame(() => (this.shouldAnimate = true));\n }\n };\n\n private handleResize = () => {\n if (!this.didLoad \|\| this.isAnimating) return;\n\n // Resize when a primary panel is set\n if (this.primary) {\n this.shouldAnimate = false;\n this.position = this.pixelsToPercentage(this.cachedPositionInPixels);\n requestAnimationFrame(() => (this.shouldAnimate = true));\n }\n };\n\n componentDidLoad(): void {\n if (this.positionInPixels) this.handlePositionInPixelsChange();\n setTimeout(() => (this.didLoad = true));\n }\n\n connectedCallback() {\n this.cachedPositionInPixels = this.percentageToPixels(this.position);\n this.attachRO();\n }\n\n disconnectedCallback() {\n this.detachRO();\n }\n\n componentDidRender(): void {\n // bit hacky ... because we use getter / setter for position, there's a render before `position` is passed in via attribute\n // if we set a default position in the class, this causes the divider to jump (from default to user set position)\n // so - wait a render, see if there's a position passed in via attribute, then set default if not\n requestAnimationFrame(() => {\n if (typeof this.position === 'undefined') {\n this.position = 50;\n }\n });\n }\n\n render() {\n if (typeof this.position === 'undefined') return;\n const styles: { gridTemplateRows?: string; gridTemplateColumns?: string } =\n {};\n const gridTemplate = this.vertical\n ? 'gridTemplateRows'\n : 'gridTemplateColumns';\n const primary = `\n clamp(\n 0%,\n clamp(\n var(--min),\n ${this.position}% - var(--divider-width) / 2,\n var(--max)\n ),\n calc(100% - var(--divider-width))\n )\n `;\n const secondary = 'auto';\n\n if (this.primary === 'end') {\n styles[gridTemplate] = `${secondary} var(--divider-width) ${primary}`;\n } else {\n styles[gridTemplate] = `${primary} var(--divider-width) ${secondary}`;\n }\n\n return (\n <Host style={styles}>\n <div part=\"panel start\" class=\"start\">\n <slot name=\"start\"></slot>\n </div>\n <div\n part=\"divider\"\n class=\"divider\"\n tabindex={this.disabled ? undefined : '0'}\n role=\"separator\"\n aria-label=\"Resize\"\n onKeyDown={this.handleKeyDown}\n onMouseDown={this.handleDrag}\n onTouchStart={this.handleDrag}\n >\n <slot name=\"handle\">\n {!this.disabled && this.vertical ? (\n <nano-icon slot=\"handle\" name=\"solid/grip-lines\" />\n ) : (\n <nano-icon slot=\"handle\" name=\"solid/grip-lines-vertical\" />\n )}\n </slot>\n </div>\n <div part=\"panel end\" class=\"end\">\n <slot name=\"end\"></slot>\n </div>\n </Host>\n );\n }\n}\n"],"version":3}

package/dist/esm/nano-sticker.entry.js CHANGED Viewed

@@ -1,8 +1,8 @@
 /*!
  * Web Components for Nanopore digital Web Apps
  */
-import { r as registerInstance, c as createEvent, h, a as Host, g as getElement } from './index-3c280603.js';
-import { a as getOffset } from './dom-d3ad49e2.js';
+import { r as registerInstance, c as createEvent, h, a as Host, g as getElement } from './index-b4e277ad.js';
+import { a as getOffset } from './dom-311c9e1e.js';
 import { d as debounce } from './throttle-7836544e.js';
 const stickerCss = ":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}";
@@ -34,6 +34,8 @@ const Sticker = class {
     /** Assesses the public API quitemode and works out if it should be applied atm.
      * If 'smallscreen', or there is a breakpointmax / min it will add a resizeobserver to conditionally add behaviour */
     this.setupParentResizeListener = () => {
+      if (!window['ResizeObserver'])
+        return;
       if (this.parentSizeObserver) {
         this.parentSizeObserver.disconnect();
         this.parentSizeObserver = undefined;
@@ -240,7 +242,7 @@ const Sticker = class {
   /** A root sticker is a fixed element Or this sticker is sticking to another.
    * We need a content resize watcher to make sure we maintain a correct placeholder size in the body */
   stickerResizeListener() {
-    if (!this.content)
+    if (!this.content || !window['ResizeObserver'])
       return;
     if (this.contentSizeObserver) {
       this.contentSizeObserver.disconnect();
@@ -495,7 +497,7 @@ const Sticker = class {
     const scroll = (_node) => regex.test(overflow(_node));
     const docHeight = document.documentElement.getBoundingClientRect().height;
     const scrollParent = (_node) => {
-      if (!(_node instanceof HTMLElement))
+      if (!(typeof _node === 'object'))
         return;
       const ps = parents(_node, []);
       return (ps.find((ele) => scroll(ele) && ele.getBoundingClientRect().height !== docHeight) || document);

package/dist/esm/nano-sticker.entry.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"nano-sticker.entry.js","mappings":"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","names":[],"sources":["./src/components/sticker/sticker.scss?tag=nano-sticker&encapsulation=shadow","./src/components/sticker/sticker.tsx"],"sourcesContent":["@import '../../global/style/nano-theme/layers';\n\n:host {\n /*\n @prop --stuck-left: The left position when your sticker is stuck. This can be useful to force your sticker to fill the viewport for example. Defaults to initial\n * @prop --stuck-right: The right position when your sticker is stuck. This can be useful to force your sticker to fill the viewport for example. Defaults to initial\n * @prop --stuck-z-index: The z-index order to display your sticker. Can be useful when displaying multiple stickers simultaneously. Defaults to #{$layer-index-menubar};\n * @prop --top-hide: This is used for the hide transform animation (e.g. when quiet-mode is on). Defaults to translateY(-110%);\n * @prop --bottom-hide: This is used for the hide transform animation (e.g. when quiet-mode is on). Defaults to translateY(110%);\n /\n\n --stuck-left: initial;\n --stuck-right: initial;\n --stuck-z-index: #{$layer-index-menubar};\n --top-hide: translateY(-110%);\n --bottom-hide: translateY(110%);\n\n display: block;\n max-inline-size: 100%;\n}\n\n:host([sticky]) {\n position: sticky;\n transition: 0.3s ease transform;\n will-change: min-block-size;\n}\n\n:host([sticky][stuck]) {\n inset-inline: var(--stuck-left) var(--stuck-right);\n z-index: var(--stuck-z-index) !important;\n}\n\n:host([sticky][hide][placed-top]) {\n transform: var(--top-hide);\n}\n\n:host([sticky][hide][placed-bottom]) {\n transform: var(--bottom-hide);\n}\n\n:host([sticky][index='1']) {\n z-index: calc(var(--stuck-z-index) + 1);\n}\n\n:host([sticky][index='2']) {\n z-index: calc(var(--stuck-z-index) + 2);\n}\n\n:host([sticky][index='3']) {\n z-index: calc(var(--stuck-z-index) + 3);\n}\n\n:host([sticky][index='4']) {\n z-index: calc(var(--stuck-z-index) + 4);\n}\n\n:host([sticky][index='5']) {\n z-index: calc(var(--stuck-z-index) + 5);\n}\n\n.sticker {\n display: inherit;\n max-inline-size: inherit;\n inline-size: 100%;\n\n &:not(.stuck) {\n inline-size: auto !important;\n }\n\n &.sticky {\n transition: 0.3s ease all;\n position: relative;\n\n :host([index='1']) & {\n z-index: calc(var(--stuck-z-index) + 1);\n }\n\n :host([index='2']) & {\n z-index: calc(var(--stuck-z-index) + 2);\n }\n\n :host([index='3']) & {\n z-index: calc(var(--stuck-z-index) + 3);\n }\n\n :host([index='4']) & {\n z-index: calc(var(--stuck-z-index) + 4);\n }\n\n :host([index='5']) & {\n z-index: calc(var(--stuck-z-index) + 5);\n }\n }\n\n &.stuck {\n position: fixed;\n inset-inline: var(--stuck-left) var(--stuck-right);\n z-index: var(--stuck-z-index);\n transform: translateY(0);\n\n :host([placed-top]) & {\n inset-block-start: 0;\n }\n\n :host([placed-bottom]) & {\n inset-block-end: 0;\n }\n\n &.hide {\n :host([placed-top]) & {\n transform: var(--top-hide);\n }\n\n :host([placed-bottom]) & {\n transform: var(--bottom-hide);\n }\n }\n }\n}\n\n.sticker-content {\n display: flex;\n flex-wrap: wrap;\n}\n","import {\n Component,\n ComponentInterface,\n h,\n Host,\n Prop,\n State,\n Watch,\n Element,\n Event,\n EventEmitter,\n Method,\n} from '@stencil/core';\nimport { getOffset } from '../../utils/dom';\nimport { debounce } from '../../utils/throttle';\n\nfunction _getScrollTop(ele: HTMLElement \| Document) {\n return ele instanceof Document ? window.pageYOffset : ele.scrollTop;\n}\n\nfunction _getOffset(ele: HTMLElement, parent: HTMLElement \| Document) {\n const parentEle =\n parent instanceof Document ? document.documentElement : parent;\n return getOffset(ele, parentEle);\n}\n\ntype Positions = 'top' \| 'bottom' \| 'start' \| 'end';\n\n/\n The Sticker component is a toolbox for 'sticking' items to scrolling containers.\n \n /\n@Component({\n tag: 'nano-sticker',\n styleUrl: 'sticker.scss',\n shadow: true,\n})\nexport class Sticker implements ComponentInterface {\n private isRtl: boolean = false;\n private io: IntersectionObserver;\n private contentSizeObserver: ResizeObserver;\n private parentSizeObserver: ResizeObserver;\n private sticker: HTMLDivElement;\n private content: HTMLDivElement;\n private scrollPosCache = 0;\n private scrollPosThresholdCache = 0;\n private cacheOffset: number \| { v: number; h: number } = 0;\n private slottedContent: Element[];\n private pauseResizeWatcher = false;\n private listenForScrollParent = false;\n private stickToEleInitSize?: DOMRect;\n private positions: Positions[] = [];\n private pauseHide: boolean = false;\n private hasBootstrapped = false;\n\n @Element() host: HTMLNanoStickerElement;\n\n // Internal State\n\n @State() isStuck = false;\n @State() isRootSticker = true;\n @State() hide = false;\n @State() scrollHide = false;\n @State() multiStickerHide = false;\n @State() scrollingTo = false;\n @State() quietModeIsOn = false;\n @State() stuckCounter = 0;\n @State() stickerIndex = 0;\n @State() stickToEle?: HTMLNanoStickerElement;\n @State() triggerPos: { top: number; left: number };\n @State() trigger: HTMLDivElement;\n @State() _offset: number \| { v: number; h: number } = 0;\n\n // Public API\n\n /** Only applicable to root stickers. When applied the sticker will grow or shrink to the scrollParent size /\n @Prop() autoResize = true;\n\n /* Manually enable / disabled sticky behaviour /\n @Prop({ mutable: true }) isSticky = true;\n\n /* Distance the item should be stuck from the sticky edge. /\n @Prop({ mutable: true }) offset: number \| { v: number; h: number } = 0;\n\n /* The edge of the scroll-parent to stick to /\n @Prop() position: 'top' \| 'bottom' = 'top';\n // other opts I'd like one day. 'start' \| 'end' \| 'top-start' \| 'top-end' \| 'bottom-start' \| 'bottom-end'\n\n /* When applied, the sticker will hide when the scroll-parent\n * is scrolling away from the sticker's stuck position and show when scrolling toward it.\n * By default this will apply when the parent is below either the h or w dimensions /\n @Prop() quietMode: 'on' \| 'off' \| { h: number; w: number } = {\n h: 600,\n w: 600,\n };\n\n /* When applied stickers will hide upon new stickers being stuck to the same position /\n @Prop() hideOnNewStickers = true;\n\n /* The max width of the item to implement sticky behaviour. /\n @Prop() breakPointMax: null \| number = null;\n\n /* The min width of the item to implement sticky behaviour. /\n @Prop() breakPointMin: null \| number = null;\n\n /* Define which scroll element to listen & stick to.\n * By default, it will find traverse the DOM to find the closest. /\n @Prop({ mutable: true }) scrollParent?: HTMLElement \| Document;\n\n /* Upon being stuck, attach the sticker to another sticker element.\n * A JS query selector that returns a <nano-sticker> /\n @Prop() stickTo: string;\n\n // Broadcasted Events\n\n /* Emitted when a sticker is stuck /\n @Event() nanoStuck!: EventEmitter<{ sticker: HTMLNanoStickerElement }>;\n\n /* Emitted when a sticker is unstuck /\n @Event() nanoUnstuck!: EventEmitter<{ sticker: HTMLNanoStickerElement }>;\n\n /* Emitted when a sticker is hidden /\n @Event() nanoHide!: EventEmitter<{ sticker: HTMLNanoStickerElement }>;\n\n /* Emitted when a sticker is showing /\n @Event() nanoShow!: EventEmitter<{ sticker: HTMLNanoStickerElement }>;\n\n // Public methods\n\n /\n Method to return the visibility status of the sticker\n * @returns boolean\n /\n @Method()\n async isHiding() {\n return this.hide;\n }\n\n /\n Method to return the stuck status of the sticker\n * @returns boolean\n /\n @Method()\n async isSticking() {\n this.shouldStick();\n return this.isStuck;\n }\n\n /* @internal /\n @Method()\n async setTriggerPos(offset: number \| { v: number; h: number }) {\n return (this._offset = offset);\n }\n\n /* @internal /\n @Method()\n async getTriggerPos() {\n return this.triggerPos;\n }\n\n /* @internal /\n @Method()\n async pauseHiding(pause: boolean) {\n return (this.pauseHide = pause);\n }\n\n // Watchers\n\n /* Keep a note of trigger position. Need this to track sticker order in the DOM /\n @Watch('trigger')\n @Watch('scrollParent')\n updateTriggerOffset() {\n if (!this.trigger \|\| !this.scrollParent \|\| !this.listenForScrollParent)\n return;\n this.triggerPos = _getOffset(this.trigger, this.scrollParent);\n }\n\n /* A root sticker is a fixed element Or this sticker is sticking to another.\n * We need a content resize watcher to make sure we maintain a correct placeholder size in the body /\n @Watch('position')\n stickerResizeListener() {\n if (!this.content) return;\n\n if (this.contentSizeObserver) {\n this.contentSizeObserver.disconnect();\n this.contentSizeObserver = undefined;\n }\n\n this.contentSizeObserver = new ResizeObserver((entries) => {\n for (const entry of entries) {\n if (this.pauseResizeWatcher) return;\n\n if (entry.contentRect.height) {\n if (this.position === 'top')\n this.host.style.height = entry.contentRect.height + 'px';\n if (this.position === 'bottom')\n this.host.style.minHeight = entry.contentRect.height + 'px';\n }\n }\n });\n this.contentSizeObserver.observe(this.content);\n }\n\n @Watch('quietMode')\n quietModeChange() {\n if (this.quietMode === 'on')\n requestAnimationFrame(() => (this.quietModeIsOn = true));\n else if (this.quietMode === 'off')\n requestAnimationFrame(() => (this.quietModeIsOn = false));\n }\n\n /* offset is part of the public API but we also use it to manipulate trigger points /\n @Watch('offset')\n @Watch('_offset')\n setOffset() {\n this.trigger.setAttribute('style', '');\n let v: number, h: number, _v: number, _h: number;\n const sticker: HTMLElement =\n this.isRootSticker \|\| this.stickToEle ? this.sticker : this.host;\n\n if (!sticker) return;\n\n if (typeof this.offset === 'object') ({ v, h } = this.offset);\n else v = h = this.offset;\n\n if (typeof this._offset === 'object') ({ v = _v, h = _h } = this._offset);\n else _v = _h = this._offset;\n\n const setPos = (pos: 'top' \| 'bottom' \| 'left' \| 'right') => {\n const u = pos.match(/(top\|bottom)/) ? v : h;\n setTriggetPos(pos);\n sticker.style[pos] = u + 'px';\n if (u)\n this.host.style.setProperty(\n '--hide-transform-amount',\n `(110% + ${u}px)`\n );\n else this.host.style.setProperty('--hide-transform-amount', null);\n };\n\n const setTriggetPos = (pos: 'top' \| 'bottom' \| 'left' \| 'right') => {\n const u = pos.match(/(top\|bottom)/) ? v + _v : h + _h;\n this.trigger.style[pos] = u -1 + 'px';\n this.trigger.style.position = 'relative';\n this.trigger.style.height = '1px';\n };\n\n if (\n (this.positions.includes('start') && this.isRtl) \|\|\n (this.positions.includes('end') && !this.isRtl)\n )\n setPos('right');\n\n if (\n (this.positions.includes('end') && this.isRtl) \|\|\n (this.positions.includes('start') && !this.isRtl)\n )\n setPos('left');\n\n if (this.positions.includes('top')) setPos('top');\n if (this.positions.includes('bottom')) setPos('bottom');\n }\n\n @Watch('position')\n positionChange() {\n this.positions = this.position.split('-') as Positions[];\n this.setOffset();\n }\n\n /** If this sticker is attached to a 'master' sticker (stickToEle),\n * here we move the content of this sticker in and out accordingly /\n @Watch('isStuck')\n async stuckChange() {\n if (this.isStuck) {\n if (this.stickToEle) {\n const content = this.host.children;\n this.slottedContent = Array.from(content);\n\n this.slottedContent.forEach((child: HTMLElement) => {\n this.stickToEle.appendChild(child);\n child.style.order = this.stickerIndex + '';\n });\n\n this.nanoStuck.emit({ sticker: this.stickToEle });\n } else this.nanoStuck.emit({ sticker: this.host });\n } else {\n this.scrollHide = false;\n\n if (this.stickToEle) {\n this.slottedContent.forEach((child: HTMLElement) => {\n this.host.appendChild(child);\n child.style.order = '';\n });\n this.nanoUnstuck.emit({ sticker: this.stickToEle });\n } else this.nanoUnstuck.emit({ sticker: this.host });\n }\n }\n\n /* attach scroll listener. 'hides' stickers when scrolling away from trigger and 'shows' when scrolling toward /\n @Watch('quietModeIsOn')\n attachScrollListeners() {\n if (this.quietModeIsOn)\n this.scrollParent.addEventListener('scroll', this.onScroll, {\n passive: true,\n capture: false,\n });\n else if (this.scrollParent) {\n this.scrollParent.removeEventListener('scroll', this.onScroll);\n this.moveTrigger(true);\n }\n }\n\n /* Add / remove parent scrolling listeners. If there's stickToEle we need to remove them /\n @Watch('scrollParent')\n @Watch('stickToEle')\n handleParentEvents(_, oldParent: null \| HTMLElement = null) {\n if (!this.listenForScrollParent) return;\n if (oldParent) this.manageListenersOnParent(false, oldParent);\n if (this.scrollParent) this.manageListenersOnParent(!this.stickToEle);\n }\n\n /* Add remove specific listeners if we're sticking to a sticker.\n * We need to adjust triggers according to the status of the 'master' /\n @Watch('stickToEle')\n stickToEleChange(_, oldEle: null \| HTMLNanoStickerElement) {\n if (this.stickToEle) {\n this.stickToEle.addEventListener('nanoHide', this.onStickToDisplayEvent);\n this.stickToEle.addEventListener('nanoShow', this.onStickToDisplayEvent);\n this.stickToEle.addEventListener('nanoStuck', this.onStickToDisplayEvent);\n this.stickToEle.addEventListener(\n 'nanoUnstuck',\n this.onStickToDisplayEvent\n );\n }\n if (oldEle) {\n oldEle.removeEventListener('nanoHide', this.onStickToDisplayEvent);\n oldEle.removeEventListener('nanoShow', this.onStickToDisplayEvent);\n oldEle.removeEventListener('nanoStuck', this.onStickToDisplayEvent);\n oldEle.removeEventListener('nanoUnstuck', this.onStickToDisplayEvent);\n }\n }\n\n /* Find and set the stickToEle from the public, selector string /\n @Watch('stickTo')\n stickToChange() {\n if (this.stickTo)\n this.stickToEle = this.scrollParent.querySelector(this.stickTo);\n else this.stickToEle = undefined;\n }\n\n /* 2 potential criteria for hiding. Multi-stickers or quietmode. /\n @Watch('multiStickerHide')\n @Watch('scrollHide')\n visibilityDecisionHandler() {\n if (this.multiStickerHide \|\| this.scrollHide) this.hide = true;\n else this.hide = false;\n }\n\n @Watch('hide')\n handleHideChange() {\n if (this.hide) this.nanoHide.emit({ sticker: this.host });\n else this.nanoShow.emit({ sticker: this.host });\n }\n\n @Watch('scrollParent')\n setupIO() {\n if (this.io) {\n this.io.disconnect();\n this.io = undefined;\n }\n if (!this.scrollParent \|\| !this.hasBootstrapped \|\| !this.trigger) return;\n\n this.isRootSticker = this.scrollParent instanceof Document;\n let root = this.scrollParent;\n if (this.scrollParent instanceof Document) root = null;\n\n this.io = new window.IntersectionObserver(\n (_) => {\n if (this.pauseResizeWatcher \|\| !this.isSticky) return;\n this.shouldStick(_.slice(-1)[0]);\n },\n { root: root as HTMLElement }\n );\n\n this.io.observe(this.trigger);\n }\n\n // Private methods / handlers\n\n /* Assesses the public API quitemode and works out if it should be applied atm.\n * If 'smallscreen', or there is a breakpointmax / min it will add a resizeobserver to conditionally add behaviour /\n private setupParentResizeListener = () => {\n if (this.parentSizeObserver) {\n this.parentSizeObserver.disconnect();\n this.parentSizeObserver = undefined;\n }\n\n this.parentSizeObserver = new ResizeObserver((entries) => {\n for (const entry of entries) {\n let height: number, width: number;\n if (entry.contentRect.height) height = entry.contentRect.height;\n if (entry.contentRect.width) width = entry.contentRect.width;\n\n if (typeof this.quietMode === 'object') {\n if (width < this.quietMode.w \|\| height < this.quietMode.h)\n this.quietModeIsOn = true;\n else this.quietModeIsOn = false;\n }\n\n if (this.breakPointMin) {\n if (width > this.breakPointMin) this.isSticky = true;\n else this.isSticky = false;\n }\n\n if (this.breakPointMax) {\n if (width < this.breakPointMax) this.isSticky = true;\n else this.isSticky = false;\n }\n\n if (this.isRootSticker && this.sticker && this.autoResize)\n this.sticker.style.width = this.host.scrollWidth + 'px';\n }\n });\n\n const toWatch =\n this.scrollParent instanceof Document\n ? this.scrollParent.documentElement\n : this.scrollParent;\n if (toWatch) this.parentSizeObserver.observe(toWatch);\n };\n\n /* For stickTo stickers. We listen to the events from the 'master' sticker to ammend the hide/show trigger\n * Main diffs from rootstickers / non is height being on 'master' /\n private onStickToDisplayEvent = (\n e: CustomEvent<{ sticker: HTMLNanoStickerElement }>\n ) => {\n if (e.detail.sticker !== this.stickToEle) return;\n\n switch (e.type) {\n case 'nanoHide':\n this._offset = 0;\n this.cacheOffset = this.offset;\n this.offset = 0;\n /* trigger moves down, underneath sticker if the main sticker hides /\n if (!this.isStuck) this.moveTrigger(false);\n\n /* If it's an actual 'position: sticky' element, we need to give the sticker an appropriate height.\n * This minimises content jumping around as items are added /\n if (!this.isRootSticker && this.quietModeIsOn) {\n requestAnimationFrame(() => {\n this.stickToEle.style.minHeight =\n this.stickToEleInitSize.height +\n (this.host.scrollHeight +\n (typeof this.cacheOffset === 'object'\n ? this.cacheOffset.v\n : this.cacheOffset)) +\n 'px';\n this.stickToEle.setTriggerPos(this.stickToEleInitSize.height -1);\n });\n }\n break;\n case 'nanoShow':\n this._offset = this.stickToEleInitSize.height;\n this.offset = this.cacheOffset;\n this.moveTrigger(true);\n\n /** reset master sticker size /\n if (!this.isRootSticker && this.quietModeIsOn) {\n requestAnimationFrame(() => {\n this.stickToEle.style.minHeight = '';\n this.stickToEle.setTriggerPos(0);\n });\n }\n break;\n case 'nanoStuck':\n this.stickToEleInitSize = this.stickToEle.getBoundingClientRect();\n this._offset = this.stickToEleInitSize.height;\n break;\n }\n };\n\n /* Add or removes event listeners / observers on scrolling parent\n * for when the scrolling parent changes, or, this sticker is sticking to another /\n private manageListenersOnParent(\n addEvents: boolean,\n ele?: HTMLElement \| Document\n ) {\n const scrollParent = ele \|\| this.scrollParent;\n\n if (!scrollParent) return;\n\n if (!addEvents) {\n try {\n if (this.quietModeIsOn)\n scrollParent.removeEventListener('scroll', this.onScroll);\n scrollParent.removeEventListener('nanoStuck', this.onStickEvent);\n scrollParent.removeEventListener('nanoUnstuck', this.onStickEvent);\n } catch (e) {\n console.error('Events haven`t been added');\n }\n } else {\n scrollParent.addEventListener('nanoStuck', this.onStickEvent);\n scrollParent.addEventListener('nanoUnstuck', this.onStickEvent);\n\n if (this.quietModeIsOn) this.attachScrollListeners();\n }\n this.setupParentResizeListener();\n }\n\n /* Handler applied to scrolling parent. When 'hideOnNewStickers' is true, hide this sticker on subsequent stuck stickers. /\n private onStickEvent = async (\n e: CustomEvent<{ sticker: HTMLNanoStickerElement }>\n ) => {\n const sticker = e.detail ? e.detail.sticker : null;\n if (!sticker \|\| sticker.position !== this.position) return;\n\n const incomingTriggerPos = await sticker.getTriggerPos();\n\n if (\n e.type === 'nanoStuck' &&\n sticker !== this.host &&\n sticker.scrollParent === this.host.scrollParent\n ) {\n this.stickerIndex++;\n\n if (!this.hideOnNewStickers) return;\n\n if (\n (this.positions.includes('top') &&\n this.triggerPos.top < incomingTriggerPos.top) \|\|\n (this.positions.includes('bottom') &&\n this.triggerPos.top > incomingTriggerPos.top)\n ) {\n this.multiStickerHide = true;\n this.stuckCounter++;\n }\n }\n\n if (\n e.type === 'nanoUnstuck' &&\n sticker !== this.host &&\n sticker.scrollParent === this.host.scrollParent\n ) {\n this.stickerIndex--;\n\n if (!this.hideOnNewStickers) return;\n\n if (\n (this.positions.includes('top') &&\n this.triggerPos.top < incomingTriggerPos.top) \|\|\n (this.positions.includes('bottom') &&\n this.triggerPos.top > incomingTriggerPos.top)\n ) {\n this.stuckCounter--;\n if (this.stuckCounter < 1) this.multiStickerHide = false;\n }\n }\n };\n\n /* Scroll handler applied to scrolling parent. Only applied when quietmode is on.\n * 'hides' stickers when scrolling over 100px away from trigger and 'shows' when scrolling toward /\n private onScroll = () => {\n const y: number = _getScrollTop(this.scrollParent);\n\n // scrolling up\n if (y < this.scrollPosCache) {\n if (!this.positions.includes('bottom')) this.handleScrollTo();\n else this.handleScrollAway(y);\n }\n\n // scrolling down\n if (y > this.scrollPosCache) {\n if (!this.positions.includes('bottom')) this.handleScrollAway(y);\n else this.handleScrollTo();\n }\n this.scrollPosCache = y;\n };\n\n /* Watch for scroll direction. Only applies when quietmode is on.\n * We need to addjust the position of the trigger when the sticker is hidden /\n private handleScrollTo() {\n this.scrollPosThresholdCache = null;\n if (!this.scrollHide) return;\n\n if (this.scrollingTo !== true) {\n this._offset = this.cacheOffset \|\| this._offset;\n }\n this.scrollingTo = true;\n this.scrollHide = false;\n }\n\n private handleScrollAway(currScroll: number) {\n if (this.scrollHide) return;\n\n if (!this.isStuck) return;\n\n if (this.scrollingTo !== false) {\n this.cacheOffset = this._offset;\n this._offset = 0;\n }\n this.scrollingTo = false;\n\n if (!this.scrollPosThresholdCache)\n this.scrollPosThresholdCache = currScroll;\n else if (\n !this.pauseHide &&\n Math.abs(currScroll - this.scrollPosThresholdCache) > 100\n )\n this.scrollHide = true;\n }\n\n private moveTrigger(toInitial?: boolean) {\n if (\n (this.positions.includes('bottom') && !toInitial) \|\|\n (!this.positions.includes('bottom') && toInitial)\n ) {\n this.host.parentNode.insertBefore(this.trigger, this.host);\n } else\n this.host.parentNode.insertBefore(this.trigger, this.host.nextSibling);\n }\n\n /\n Gets the 'closest' scrolling parent\n * @returns either an element with `overflow: scroll \| auto` or the parent Document\n */\n private getScrollParent(): HTMLElement \| Document {\n const regex = /(auto\|scroll)/;\n const parents = (_node: Node, ps: Node[]) => {\n if (_node.parentNode === null) {\n return ps;\n }\n return parents(_node.parentNode, ps.concat([_node]));\n };\n const style = (_node, prop) =>\n getComputedStyle(_node, null).getPropertyValue(prop);\n const overflow = (_node) =>\n style(_node, 'overflow') +\n style(_node, 'overflow-y') +\n style(_node, 'overflow-x');\n const scroll = (_node) => regex.test(overflow(_node));\n const docHeight = document.documentElement.getBoundingClientRect().height;\n\n const scrollParent = (_node: HTMLElement) => {\n if (!(_node instanceof HTMLElement)) return;\n\n const ps = parents(_node, []);\n return (\n ps.find(\n (ele) =>\n scroll(ele) && ele.getBoundingClientRect().height !== docHeight\n ) \|\| document\n );\n };\n\n return scrollParent(this.host);\n }\n\n private shouldStick(data?: IntersectionObserverEntry) {\n let scrollAmt: number;\n\n if (this.positions.includes('top')) {\n if (!this.isRootSticker)\n scrollAmt = _getOffset(this.trigger, this.scrollParent).top;\n else scrollAmt = this.trigger.getBoundingClientRect().top;\n this.isStuck = scrollAmt < -1;\n } else if (this.positions.includes('bottom')) {\n scrollAmt = this.trigger.getBoundingClientRect().top;\n const parentBounding =\n data && data.rootBounds\n ? data.rootBounds\n : (this.scrollParent instanceof Document\n ? document.documentElement\n : this.scrollParent\n ).getBoundingClientRect();\n this.isStuck = scrollAmt > parentBounding.height + parentBounding.top;\n }\n }\n\n private bootstrapGurantor() {\n this.hasBootstrapped = true;\n\n this.scrollParent = this.scrollParent \|\| this.getScrollParent();\n this.isRootSticker = this.scrollParent instanceof Document;\n\n this.trigger = this.trigger \|\| document.createElement('div');\n this.trigger.classList.add('sticker-trigger');\n\n this.positionChange();\n this.moveTrigger(true);\n this.quietModeChange();\n\n this.listenForScrollParent = true;\n this.handleParentEvents(true);\n\n this.stickerIndex = Array.from(\n this.scrollParent.querySelectorAll('nano-sticker')\n )\n .filter(\n (sticker: HTMLNanoStickerElement) => sticker.position === this.position\n )\n .findIndex((sticker) => sticker === this.host);\n\n this.setOffset();\n this.stickerResizeListener();\n this.setupParentResizeListener();\n\n // bit of a hack ... add default 'order'. Required for 'stickTo' elements.\n this.slottedContent = Array.from(this.host.children);\n this.slottedContent.forEach((child: HTMLElement) => {\n child.style.order = this.stickerIndex + '';\n });\n\n this.updateTriggerOffset();\n this.stickToChange();\n this.setupIO();\n this.onStickToDisplayEvent = debounce(this.onStickToDisplayEvent, 50);\n }\n\n // Stencil metthods\n\n connectedCallback() {\n this.isRtl =\n this.host.dir === 'rtl' \|\|\n (this.host.ownerDocument as Document).dir === 'rtl';\n\n // this is all horrible.... shrug\n document.documentElement.addEventListener('nanoComponentsReady', () => {\n setTimeout((_) => this.bootstrapGurantor(), 200);\n });\n setTimeout((_) => {\n if (!this.hasBootstrapped) this.bootstrapGurantor();\n }, 1000);\n }\n\n disconnectedCallback() {\n if (this.io) {\n this.io.disconnect();\n this.io = undefined;\n }\n\n if (this.parentSizeObserver) {\n this.parentSizeObserver.disconnect();\n this.parentSizeObserver = undefined;\n }\n\n this.scrollParent = null;\n this.hasBootstrapped = false;\n }\n\n render() {\n return (\n <Host\n sticky={!this.isRootSticker && !this.stickToEle && this.isSticky}\n hide={this.hide && this.isStuck}\n siblings={this.stuckCounter}\n index={this.stickerIndex}\n stuck={this.isStuck && this.isSticky}\n placed-bottom={this.positions.includes('bottom')}\n placed-top={this.positions.includes('top')}\n placed-end={this.positions.includes('end')}\n placed-start={this.positions.includes('start')}\n >\n <div\n class={{\n sticker: true,\n sticky: this.isRootSticker && this.isSticky,\n stuck: this.isStuck && this.isRootSticker && this.isSticky,\n hide: this.isRootSticker && this.hide && this.isStuck,\n }}\n ref={(div) => (this.sticker = div)}\n >\n <div class=\"sticker-content\" ref={(div) => (this.content = div)}>\n <slot />\n </div>\n </div>\n </Host>\n );\n }\n}\n"],"version":3}
1	+ {"file":"nano-sticker.entry.js","mappings":";;;;;;;AAAA,MAAM,UAAU,GAAG,g6DAAg6D;;ACgBn7D,SAAS,aAAa,CAAC,GAA2B;EAChD,OAAO,GAAG,YAAY,QAAQ,GAAG,MAAM,CAAC,WAAW,GAAG,GAAG,CAAC,SAAS,CAAC;AACtE,CAAC;AAED,SAAS,UAAU,CAAC,GAAgB,EAAE,MAA8B;EAClE,MAAM,SAAS,GACb,MAAM,YAAY,QAAQ,GAAG,QAAQ,CAAC,eAAe,GAAG,MAAM,CAAC;EACjE,OAAO,SAAS,CAAC,GAAG,EAAE,SAAS,CAAC,CAAC;AACnC,CAAC;MAaY,OAAO;;;;;;;IACV,UAAK,GAAY,KAAK,CAAC;IAMvB,mBAAc,GAAG,CAAC,CAAC;IACnB,4BAAuB,GAAG,CAAC,CAAC;IAC5B,gBAAW,GAAsC,CAAC,CAAC;IAEnD,uBAAkB,GAAG,KAAK,CAAC;IAC3B,0BAAqB,GAAG,KAAK,CAAC;IAE9B,cAAS,GAAgB,EAAE,CAAC;IAC5B,cAAS,GAAY,KAAK,CAAC;IAC3B,oBAAe,GAAG,KAAK,CAAC;;;;IAkVxB,8BAAyB,GAAG;MAClC,IAAI,CAAC,MAAM,CAAC,gBAAgB,CAAC;QAAE,OAAO;MAEtC,IAAI,IAAI,CAAC,kBAAkB,EAAE;QAC3B,IAAI,CAAC,kBAAkB,CAAC,UAAU,EAAE,CAAC;QACrC,IAAI,CAAC,kBAAkB,GAAG,SAAS,CAAC;OACrC;MAED,IAAI,CAAC,kBAAkB,GAAG,IAAI,cAAc,CAAC,CAAC,OAAO;QACnD,KAAK,MAAM,KAAK,IAAI,OAAO,EAAE;UAC3B,IAAI,MAAc,EAAE,KAAa,CAAC;UAClC,IAAI,KAAK,CAAC,WAAW,CAAC,MAAM;YAAE,MAAM,GAAG,KAAK,CAAC,WAAW,CAAC,MAAM,CAAC;UAChE,IAAI,KAAK,CAAC,WAAW,CAAC,KAAK;YAAE,KAAK,GAAG,KAAK,CAAC,WAAW,CAAC,KAAK,CAAC;UAE7D,IAAI,OAAO,IAAI,CAAC,SAAS,KAAK,QAAQ,EAAE;YACtC,IAAI,KAAK,GAAG,IAAI,CAAC,SAAS,CAAC,CAAC,IAAI,MAAM,GAAG,IAAI,CAAC,SAAS,CAAC,CAAC;cACvD,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC;;cACvB,IAAI,CAAC,aAAa,GAAG,KAAK,CAAC;WACjC;UAED,IAAI,IAAI,CAAC,aAAa,EAAE;YACtB,IAAI,KAAK,GAAG,IAAI,CAAC,aAAa;cAAE,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC;;cAChD,IAAI,CAAC,QAAQ,GAAG,KAAK,CAAC;WAC5B;UAED,IAAI,IAAI,CAAC,aAAa,EAAE;YACtB,IAAI,KAAK,GAAG,IAAI,CAAC,aAAa;cAAE,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC;;cAChD,IAAI,CAAC,QAAQ,GAAG,KAAK,CAAC;WAC5B;UAED,IAAI,IAAI,CAAC,aAAa,IAAI,IAAI,CAAC,OAAO,IAAI,IAAI,CAAC,UAAU;YACvD,IAAI,CAAC,OAAO,CAAC,KAAK,CAAC,KAAK,GAAG,IAAI,CAAC,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC;SAC3D;OACF,CAAC,CAAC;MAEH,MAAM,OAAO,GACX,IAAI,CAAC,YAAY,YAAY,QAAQ;UACjC,IAAI,CAAC,YAAY,CAAC,eAAe;UACjC,IAAI,CAAC,YAAY,CAAC;MACxB,IAAI,OAAO;QAAE,IAAI,CAAC,kBAAkB,CAAC,OAAO,CAAC,OAAO,CAAC,CAAC;KACvD,CAAC;;;IAIM,0BAAqB,GAAG,CAC9B,CAAmD;MAEnD,IAAI,CAAC,CAAC,MAAM,CAAC,OAAO,KAAK,IAAI,CAAC,UAAU;QAAE,OAAO;MAEjD,QAAQ,CAAC,CAAC,IAAI;QACZ,KAAK,UAAU;UACb,IAAI,CAAC,OAAO,GAAG,CAAC,CAAC;UACjB,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC,MAAM,CAAC;UAC/B,IAAI,CAAC,MAAM,GAAG,CAAC,CAAC;;UAEhB,IAAI,CAAC,IAAI,CAAC,OAAO;YAAE,IAAI,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC;;;UAI3C,IAAI,CAAC,IAAI,CAAC,aAAa,IAAI,IAAI,CAAC,aAAa,EAAE;YAC7C,qBAAqB,CAAC;cACpB,IAAI,CAAC,UAAU,CAAC,KAAK,CAAC,SAAS;gBAC7B,IAAI,CAAC,kBAAkB,CAAC,MAAM;mBAC7B,IAAI,CAAC,IAAI,CAAC,YAAY;qBACpB,OAAO,IAAI,CAAC,WAAW,KAAK,QAAQ;wBACjC,IAAI,CAAC,WAAW,CAAC,CAAC;wBAClB,IAAI,CAAC,WAAW,CAAC,CAAC;kBACxB,IAAI,CAAC;cACP,IAAI,CAAC,UAAU,CAAC,aAAa,CAAC,IAAI,CAAC,kBAAkB,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC;aACpE,CAAC,CAAC;WACJ;UACD,MAAM;QACR,KAAK,UAAU;UACb,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC,kBAAkB,CAAC,MAAM,CAAC;UAC9C,IAAI,CAAC,MAAM,GAAG,IAAI,CAAC,WAAW,CAAC;UAC/B,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,CAAC;;UAGvB,IAAI,CAAC,IAAI,CAAC,aAAa,IAAI,IAAI,CAAC,aAAa,EAAE;YAC7C,qBAAqB,CAAC;cACpB,IAAI,CAAC,UAAU,CAAC,KAAK,CAAC,SAAS,GAAG,EAAE,CAAC;cACrC,IAAI,CAAC,UAAU,CAAC,aAAa,CAAC,CAAC,CAAC,CAAC;aAClC,CAAC,CAAC;WACJ;UACD,MAAM;QACR,KAAK,WAAW;UACd,IAAI,CAAC,kBAAkB,GAAG,IAAI,CAAC,UAAU,CAAC,qBAAqB,EAAE,CAAC;UAClE,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC,kBAAkB,CAAC,MAAM,CAAC;UAC9C,MAAM;OACT;KACF,CAAC;;IA+BM,iBAAY,GAAG,OACrB,CAAmD;MAEnD,MAAM,OAAO,GAAG,CAAC,CAAC,MAAM,GAAG,CAAC,CAAC,MAAM,CAAC,OAAO,GAAG,IAAI,CAAC;MACnD,IAAI,CAAC,OAAO,IAAI,OAAO,CAAC,QAAQ,KAAK,IAAI,CAAC,QAAQ;QAAE,OAAO;MAE3D,MAAM,kBAAkB,GAAG,MAAM,OAAO,CAAC,aAAa,EAAE,CAAC;MAEzD,IACE,CAAC,CAAC,IAAI,KAAK,WAAW;QACtB,OAAO,KAAK,IAAI,CAAC,IAAI;QACrB,OAAO,CAAC,YAAY,KAAK,IAAI,CAAC,IAAI,CAAC,YAAY,EAC/C;QACA,IAAI,CAAC,YAAY,EAAE,CAAC;QAEpB,IAAI,CAAC,IAAI,CAAC,iBAAiB;UAAE,OAAO;QAEpC,IACE,CAAC,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAC,KAAK,CAAC;UAC7B,IAAI,CAAC,UAAU,CAAC,GAAG,GAAG,kBAAkB,CAAC,GAAG;WAC7C,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAC,QAAQ,CAAC;YAChC,IAAI,CAAC,UAAU,CAAC,GAAG,GAAG,kBAAkB,CAAC,GAAG,CAAC,EAC/C;UACA,IAAI,CAAC,gBAAgB,GAAG,IAAI,CAAC;UAC7B,IAAI,CAAC,YAAY,EAAE,CAAC;SACrB;OACF;MAED,IACE,CAAC,CAAC,IAAI,KAAK,aAAa;QACxB,OAAO,KAAK,IAAI,CAAC,IAAI;QACrB,OAAO,CAAC,YAAY,KAAK,IAAI,CAAC,IAAI,CAAC,YAAY,EAC/C;QACA,IAAI,CAAC,YAAY,EAAE,CAAC;QAEpB,IAAI,CAAC,IAAI,CAAC,iBAAiB;UAAE,OAAO;QAEpC,IACE,CAAC,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAC,KAAK,CAAC;UAC7B,IAAI,CAAC,UAAU,CAAC,GAAG,GAAG,kBAAkB,CAAC,GAAG;WAC7C,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAC,QAAQ,CAAC;YAChC,IAAI,CAAC,UAAU,CAAC,GAAG,GAAG,kBAAkB,CAAC,GAAG,CAAC,EAC/C;UACA,IAAI,CAAC,YAAY,EAAE,CAAC;UACpB,IAAI,IAAI,CAAC,YAAY,GAAG,CAAC;YAAE,IAAI,CAAC,gBAAgB,GAAG,KAAK,CAAC;SAC1D;OACF;KACF,CAAC;;;IAIM,aAAQ,GAAG;MACjB,MAAM,CAAC,GAAW,aAAa,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC;;MAGnD,IAAI,CAAC,GAAG,IAAI,CAAC,cAAc,EAAE;QAC3B,IAAI,CAAC,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAC,QAAQ,CAAC;UAAE,IAAI,CAAC,cAAc,EAAE,CAAC;;UACzD,IAAI,CAAC,gBAAgB,CAAC,CAAC,CAAC,CAAC;OAC/B;;MAGD,IAAI,CAAC,GAAG,IAAI,CAAC,cAAc,EAAE;QAC3B,IAAI,CAAC,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAC,QAAQ,CAAC;UAAE,IAAI,CAAC,gBAAgB,CAAC,CAAC,CAAC,CAAC;;UAC5D,IAAI,CAAC,cAAc,EAAE,CAAC;OAC5B;MACD,IAAI,CAAC,cAAc,GAAG,CAAC,CAAC;KACzB,CAAC;mBAvgBiB,KAAK;yBACC,IAAI;gBACb,KAAK;sBACC,KAAK;4BACC,KAAK;uBACV,KAAK;yBACH,KAAK;wBACN,CAAC;wBACD,CAAC;;;;mBAI6B,CAAC;sBAKlC,IAAI;oBAGW,IAAI;kBAG6B,CAAC;oBAGjC,KAAK;qBAMmB;MAC3D,CAAC,EAAE,GAAG;MACN,CAAC,EAAE,GAAG;KACP;6BAG2B,IAAI;yBAGO,IAAI;yBAGJ,IAAI;;;;;;;;;EA+B3C,MAAM,QAAQ;IACZ,OAAO,IAAI,CAAC,IAAI,CAAC;GAClB;;;;;EAOD,MAAM,UAAU;IACd,IAAI,CAAC,WAAW,EAAE,CAAC;IACnB,OAAO,IAAI,CAAC,OAAO,CAAC;GACrB;;EAID,MAAM,aAAa,CAAC,MAAyC;IAC3D,QAAQ,IAAI,CAAC,OAAO,GAAG,MAAM,EAAE;GAChC;;EAID,MAAM,aAAa;IACjB,OAAO,IAAI,CAAC,UAAU,CAAC;GACxB;;EAID,MAAM,WAAW,CAAC,KAAc;IAC9B,QAAQ,IAAI,CAAC,SAAS,GAAG,KAAK,EAAE;GACjC;;;EAOD,mBAAmB;IACjB,IAAI,CAAC,IAAI,CAAC,OAAO,IAAI,CAAC,IAAI,CAAC,YAAY,IAAI,CAAC,IAAI,CAAC,qBAAqB;MACpE,OAAO;IACT,IAAI,CAAC,UAAU,GAAG,UAAU,CAAC,IAAI,CAAC,OAAO,EAAE,IAAI,CAAC,YAAY,CAAC,CAAC;GAC/D;;;EAKD,qBAAqB;IACnB,IAAI,CAAC,IAAI,CAAC,OAAO,IAAI,CAAC,MAAM,CAAC,gBAAgB,CAAC;MAAE,OAAO;IAEvD,IAAI,IAAI,CAAC,mBAAmB,EAAE;MAC5B,IAAI,CAAC,mBAAmB,CAAC,UAAU,EAAE,CAAC;MACtC,IAAI,CAAC,mBAAmB,GAAG,SAAS,CAAC;KACtC;IAED,IAAI,CAAC,mBAAmB,GAAG,IAAI,cAAc,CAAC,CAAC,OAAO;MACpD,KAAK,MAAM,KAAK,IAAI,OAAO,EAAE;QAC3B,IAAI,IAAI,CAAC,kBAAkB;UAAE,OAAO;QAEpC,IAAI,KAAK,CAAC,WAAW,CAAC,MAAM,EAAE;UAC5B,IAAI,IAAI,CAAC,QAAQ,KAAK,KAAK;YACzB,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,MAAM,GAAG,KAAK,CAAC,WAAW,CAAC,MAAM,GAAG,IAAI,CAAC;UAC3D,IAAI,IAAI,CAAC,QAAQ,KAAK,QAAQ;YAC5B,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,SAAS,GAAG,KAAK,CAAC,WAAW,CAAC,MAAM,GAAG,IAAI,CAAC;SAC/D;OACF;KACF,CAAC,CAAC;IACH,IAAI,CAAC,mBAAmB,CAAC,OAAO,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;GAChD;EAGD,eAAe;IACb,IAAI,IAAI,CAAC,SAAS,KAAK,IAAI;MACzB,qBAAqB,CAAC,OAAO,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC,CAAC,CAAC;SACtD,IAAI,IAAI,CAAC,SAAS,KAAK,KAAK;MAC/B,qBAAqB,CAAC,OAAO,IAAI,CAAC,aAAa,GAAG,KAAK,CAAC,CAAC,CAAC;GAC7D;;EAKD,SAAS;IACP,IAAI,CAAC,OAAO,CAAC,YAAY,CAAC,OAAO,EAAE,EAAE,CAAC,CAAC;IACvC,IAAI,CAAS,EAAE,CAAS,EAAE,EAAU,EAAE,EAAU,CAAC;IACjD,MAAM,OAAO,GACX,IAAI,CAAC,aAAa,IAAI,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC,IAAI,CAAC;IAEnE,IAAI,CAAC,OAAO;MAAE,OAAO;IAErB,IAAI,OAAO,IAAI,CAAC,MAAM,KAAK,QAAQ;MAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,GAAG,IAAI,CAAC,MAAM,EAAE;;MACzD,CAAC,GAAG,CAAC,GAAG,IAAI,CAAC,MAAM,CAAC;IAEzB,IAAI,OAAO,IAAI,CAAC,OAAO,KAAK,QAAQ;MAAE,CAAC,EAAE,CAAC,GAAG,EAAE,EAAE,CAAC,GAAG,EAAE,EAAE,GAAG,IAAI,CAAC,OAAO,EAAE;;MACrE,EAAE,GAAG,EAAE,GAAG,IAAI,CAAC,OAAO,CAAC;IAE5B,MAAM,MAAM,GAAG,CAAC,GAAwC;MACtD,MAAM,CAAC,GAAG,GAAG,CAAC,KAAK,CAAC,cAAc,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;MAC5C,aAAa,CAAC,GAAG,CAAC,CAAC;MACnB,OAAO,CAAC,KAAK,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,IAAI,CAAC;MAC9B,IAAI,CAAC;QACH,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,WAAW,CACzB,yBAAyB,EACzB,WAAW,CAAC,KAAK,CAClB,CAAC;;QACC,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,WAAW,CAAC,yBAAyB,EAAE,IAAI,CAAC,CAAC;KACnE,CAAC;IAEF,MAAM,aAAa,GAAG,CAAC,GAAwC;MAC7D,MAAM,CAAC,GAAG,GAAG,CAAC,KAAK,CAAC,cAAc,CAAC,GAAG,CAAC,GAAG,EAAE,GAAG,CAAC,GAAG,EAAE,CAAC;MACtD,IAAI,CAAC,OAAO,CAAC,KAAK,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC,GAAG,IAAI,CAAC;MACxC,IAAI,CAAC,OAAO,CAAC,KAAK,CAAC,QAAQ,GAAG,UAAU,CAAC;MACzC,IAAI,CAAC,OAAO,CAAC,KAAK,CAAC,MAAM,GAAG,KAAK,CAAC;KACnC,CAAC;IAEF,IACE,CAAC,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAC,OAAO,CAAC,IAAI,IAAI,CAAC,KAAK;OAC9C,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAC,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC;MAE/C,MAAM,CAAC,OAAO,CAAC,CAAC;IAElB,IACE,CAAC,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAC,KAAK,CAAC,IAAI,IAAI,CAAC,KAAK;OAC5C,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC;MAEjD,MAAM,CAAC,MAAM,CAAC,CAAC;IAEjB,IAAI,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAC,KAAK,CAAC;MAAE,MAAM,CAAC,KAAK,CAAC,CAAC;IAClD,IAAI,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAC,QAAQ,CAAC;MAAE,MAAM,CAAC,QAAQ,CAAC,CAAC;GACzD;EAGD,cAAc;IACZ,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC,GAAG,CAAgB,CAAC;IACzD,IAAI,CAAC,SAAS,EAAE,CAAC;GAClB;;;EAKD,MAAM,WAAW;IACf,IAAI,IAAI,CAAC,OAAO,EAAE;MAChB,IAAI,IAAI,CAAC,UAAU,EAAE;QACnB,MAAM,OAAO,GAAG,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC;QACnC,IAAI,CAAC,cAAc,GAAG,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;QAE1C,IAAI,CAAC,cAAc,CAAC,OAAO,CAAC,CAAC,KAAkB;UAC7C,IAAI,CAAC,UAAU,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC;UACnC,KAAK,CAAC,KAAK,CAAC,KAAK,GAAG,IAAI,CAAC,YAAY,GAAG,EAAE,CAAC;SAC5C,CAAC,CAAC;QAEH,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,EAAE,OAAO,EAAE,IAAI,CAAC,UAAU,EAAE,CAAC,CAAC;OACnD;;QAAM,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,EAAE,OAAO,EAAE,IAAI,CAAC,IAAI,EAAE,CAAC,CAAC;KACpD;SAAM;MACL,IAAI,CAAC,UAAU,GAAG,KAAK,CAAC;MAExB,IAAI,IAAI,CAAC,UAAU,EAAE;QACnB,IAAI,CAAC,cAAc,CAAC,OAAO,CAAC,CAAC,KAAkB;UAC7C,IAAI,CAAC,IAAI,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC;UAC7B,KAAK,CAAC,KAAK,CAAC,KAAK,GAAG,EAAE,CAAC;SACxB,CAAC,CAAC;QACH,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,EAAE,OAAO,EAAE,IAAI,CAAC,UAAU,EAAE,CAAC,CAAC;OACrD;;QAAM,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,EAAE,OAAO,EAAE,IAAI,CAAC,IAAI,EAAE,CAAC,CAAC;KACtD;GACF;;EAID,qBAAqB;IACnB,IAAI,IAAI,CAAC,aAAa;MACpB,IAAI,CAAC,YAAY,CAAC,gBAAgB,CAAC,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAE;QAC1D,OAAO,EAAE,IAAI;QACb,OAAO,EAAE,KAAK;OACf,CAAC,CAAC;SACA,IAAI,IAAI,CAAC,YAAY,EAAE;MAC1B,IAAI,CAAC,YAAY,CAAC,mBAAmB,CAAC,QAAQ,EAAE,IAAI,CAAC,QAAQ,CAAC,CAAC;MAC/D,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,CAAC;KACxB;GACF;;EAKD,kBAAkB,CAAC,CAAC,EAAE,YAAgC,IAAI;IACxD,IAAI,CAAC,IAAI,CAAC,qBAAqB;MAAE,OAAO;IACxC,IAAI,SAAS;MAAE,IAAI,CAAC,uBAAuB,CAAC,KAAK,EAAE,SAAS,CAAC,CAAC;IAC9D,IAAI,IAAI,CAAC,YAAY;MAAE,IAAI,CAAC,uBAAuB,CAAC,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC;GACvE;;;EAKD,gBAAgB,CAAC,CAAC,EAAE,MAAqC;IACvD,IAAI,IAAI,CAAC,UAAU,EAAE;MACnB,IAAI,CAAC,UAAU,CAAC,gBAAgB,CAAC,UAAU,EAAE,IAAI,CAAC,qBAAqB,CAAC,CAAC;MACzE,IAAI,CAAC,UAAU,CAAC,gBAAgB,CAAC,UAAU,EAAE,IAAI,CAAC,qBAAqB,CAAC,CAAC;MACzE,IAAI,CAAC,UAAU,CAAC,gBAAgB,CAAC,WAAW,EAAE,IAAI,CAAC,qBAAqB,CAAC,CAAC;MAC1E,IAAI,CAAC,UAAU,CAAC,gBAAgB,CAC9B,aAAa,EACb,IAAI,CAAC,qBAAqB,CAC3B,CAAC;KACH;IACD,IAAI,MAAM,EAAE;MACV,MAAM,CAAC,mBAAmB,CAAC,UAAU,EAAE,IAAI,CAAC,qBAAqB,CAAC,CAAC;MACnE,MAAM,CAAC,mBAAmB,CAAC,UAAU,EAAE,IAAI,CAAC,qBAAqB,CAAC,CAAC;MACnE,MAAM,CAAC,mBAAmB,CAAC,WAAW,EAAE,IAAI,CAAC,qBAAqB,CAAC,CAAC;MACpE,MAAM,CAAC,mBAAmB,CAAC,aAAa,EAAE,IAAI,CAAC,qBAAqB,CAAC,CAAC;KACvE;GACF;;EAID,aAAa;IACX,IAAI,IAAI,CAAC,OAAO;MACd,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC,YAAY,CAAC,aAAa,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;;MAC7D,IAAI,CAAC,UAAU,GAAG,SAAS,CAAC;GAClC;;EAKD,yBAAyB;IACvB,IAAI,IAAI,CAAC,gBAAgB,IAAI,IAAI,CAAC,UAAU;MAAE,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC;;MAC1D,IAAI,CAAC,IAAI,GAAG,KAAK,CAAC;GACxB;EAGD,gBAAgB;IACd,IAAI,IAAI,CAAC,IAAI;MAAE,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,EAAE,OAAO,EAAE,IAAI,CAAC,IAAI,EAAE,CAAC,CAAC;;MACrD,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,EAAE,OAAO,EAAE,IAAI,CAAC,IAAI,EAAE,CAAC,CAAC;GACjD;EAGD,OAAO;IACL,IAAI,IAAI,CAAC,EAAE,EAAE;MACX,IAAI,CAAC,EAAE,CAAC,UAAU,EAAE,CAAC;MACrB,IAAI,CAAC,EAAE,GAAG,SAAS,CAAC;KACrB;IACD,IAAI,CAAC,IAAI,CAAC,YAAY,IAAI,CAAC,IAAI,CAAC,eAAe,IAAI,CAAC,IAAI,CAAC,OAAO;MAAE,OAAO;IAEzE,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC,YAAY,YAAY,QAAQ,CAAC;IAC3D,IAAI,IAAI,GAAG,IAAI,CAAC,YAAY,CAAC;IAC7B,IAAI,IAAI,CAAC,YAAY,YAAY,QAAQ;MAAE,IAAI,GAAG,IAAI,CAAC;IAEvD,IAAI,CAAC,EAAE,GAAG,IAAI,MAAM,CAAC,oBAAoB,CACvC,CAAC,CAAC;MACA,IAAI,IAAI,CAAC,kBAAkB,IAAI,CAAC,IAAI,CAAC,QAAQ;QAAE,OAAO;MACtD,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;KAClC,EACD,EAAE,IAAI,EAAE,IAAmB,EAAE,CAC9B,CAAC;IAEF,IAAI,CAAC,EAAE,CAAC,OAAO,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;GAC/B;;;EAoGO,uBAAuB,CAC7B,SAAkB,EAClB,GAA4B;IAE5B,MAAM,YAAY,GAAG,GAAG,IAAI,IAAI,CAAC,YAAY,CAAC;IAE9C,IAAI,CAAC,YAAY;MAAE,OAAO;IAE1B,IAAI,CAAC,SAAS,EAAE;MACd,IAAI;QACF,IAAI,IAAI,CAAC,aAAa;UACpB,YAAY,CAAC,mBAAmB,CAAC,QAAQ,EAAE,IAAI,CAAC,QAAQ,CAAC,CAAC;QAC5D,YAAY,CAAC,mBAAmB,CAAC,WAAW,EAAE,IAAI,CAAC,YAAY,CAAC,CAAC;QACjE,YAAY,CAAC,mBAAmB,CAAC,aAAa,EAAE,IAAI,CAAC,YAAY,CAAC,CAAC;OACpE;MAAC,OAAO,CAAC,EAAE;QACV,OAAO,CAAC,KAAK,CAAC,2BAA2B,CAAC,CAAC;OAC5C;KACF;SAAM;MACL,YAAY,CAAC,gBAAgB,CAAC,WAAW,EAAE,IAAI,CAAC,YAAY,CAAC,CAAC;MAC9D,YAAY,CAAC,gBAAgB,CAAC,aAAa,EAAE,IAAI,CAAC,YAAY,CAAC,CAAC;MAEhE,IAAI,IAAI,CAAC,aAAa;QAAE,IAAI,CAAC,qBAAqB,EAAE,CAAC;KACtD;IACD,IAAI,CAAC,yBAAyB,EAAE,CAAC;GAClC;;;EAyEO,cAAc;IACpB,IAAI,CAAC,uBAAuB,GAAG,IAAI,CAAC;IACpC,IAAI,CAAC,IAAI,CAAC,UAAU;MAAE,OAAO;IAE7B,IAAI,IAAI,CAAC,WAAW,KAAK,IAAI,EAAE;MAC7B,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC,WAAW,IAAI,IAAI,CAAC,OAAO,CAAC;KACjD;IACD,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC;IACxB,IAAI,CAAC,UAAU,GAAG,KAAK,CAAC;GACzB;EAEO,gBAAgB,CAAC,UAAkB;IACzC,IAAI,IAAI,CAAC,UAAU;MAAE,OAAO;IAE5B,IAAI,CAAC,IAAI,CAAC,OAAO;MAAE,OAAO;IAE1B,IAAI,IAAI,CAAC,WAAW,KAAK,KAAK,EAAE;MAC9B,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC,OAAO,CAAC;MAChC,IAAI,CAAC,OAAO,GAAG,CAAC,CAAC;KAClB;IACD,IAAI,CAAC,WAAW,GAAG,KAAK,CAAC;IAEzB,IAAI,CAAC,IAAI,CAAC,uBAAuB;MAC/B,IAAI,CAAC,uBAAuB,GAAG,UAAU,CAAC;SACvC,IACH,CAAC,IAAI,CAAC,SAAS;MACf,IAAI,CAAC,GAAG,CAAC,UAAU,GAAG,IAAI,CAAC,uBAAuB,CAAC,GAAG,GAAG;MAEzD,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC;GAC1B;EAEO,WAAW,CAAC,SAAmB;IACrC,IACE,CAAC,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAC,QAAQ,CAAC,IAAI,CAAC,SAAS;OAC/C,CAAC,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAC,QAAQ,CAAC,IAAI,SAAS,CAAC,EACjD;MACA,IAAI,CAAC,IAAI,CAAC,UAAU,CAAC,YAAY,CAAC,IAAI,CAAC,OAAO,EAAE,IAAI,CAAC,IAAI,CAAC,CAAC;KAC5D;;MACC,IAAI,CAAC,IAAI,CAAC,UAAU,CAAC,YAAY,CAAC,IAAI,CAAC,OAAO,EAAE,IAAI,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC;GAC1E;;;;;EAMO,eAAe;IACrB,MAAM,KAAK,GAAG,eAAe,CAAC;IAC9B,MAAM,OAAO,GAAG,CAAC,KAAW,EAAE,EAAU;MACtC,IAAI,KAAK,CAAC,UAAU,KAAK,IAAI,EAAE;QAC7B,OAAO,EAAE,CAAC;OACX;MACD,OAAO,OAAO,CAAC,KAAK,CAAC,UAAU,EAAE,EAAE,CAAC,MAAM,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC;KACtD,CAAC;IACF,MAAM,KAAK,GAAG,CAAC,KAAK,EAAE,IAAI,KACxB,gBAAgB,CAAC,KAAK,EAAE,IAAI,CAAC,CAAC,gBAAgB,CAAC,IAAI,CAAC,CAAC;IACvD,MAAM,QAAQ,GAAG,CAAC,KAAK,KACrB,KAAK,CAAC,KAAK,EAAE,UAAU,CAAC;MACxB,KAAK,CAAC,KAAK,EAAE,YAAY,CAAC;MAC1B,KAAK,CAAC,KAAK,EAAE,YAAY,CAAC,CAAC;IAC7B,MAAM,MAAM,GAAG,CAAC,KAAK,KAAK,KAAK,CAAC,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC,CAAC;IACtD,MAAM,SAAS,GAAG,QAAQ,CAAC,eAAe,CAAC,qBAAqB,EAAE,CAAC,MAAM,CAAC;IAE1E,MAAM,YAAY,GAAG,CAAC,KAAkB;MACtC,IAAI,EAAE,OAAO,KAAK,KAAK,QAAQ,CAAC;QAAE,OAAO;MAEzC,MAAM,EAAE,GAAG,OAAO,CAAC,KAAK,EAAE,EAAE,CAAC,CAAC;MAC9B,QACE,EAAE,CAAC,IAAI,CACL,CAAC,GAAG,KACF,MAAM,CAAC,GAAG,CAAC,IAAI,GAAG,CAAC,qBAAqB,EAAE,CAAC,MAAM,KAAK,SAAS,CAClE,IAAI,QAAQ,EACb;KACH,CAAC;IAEF,OAAO,YAAY,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;GAChC;EAEO,WAAW,CAAC,IAAgC;IAClD,IAAI,SAAiB,CAAC;IAEtB,IAAI,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAC,KAAK,CAAC,EAAE;MAClC,IAAI,CAAC,IAAI,CAAC,aAAa;QACrB,SAAS,GAAG,UAAU,CAAC,IAAI,CAAC,OAAO,EAAE,IAAI,CAAC,YAAY,CAAC,CAAC,GAAG,CAAC;;QACzD,SAAS,GAAG,IAAI,CAAC,OAAO,CAAC,qBAAqB,EAAE,CAAC,GAAG,CAAC;MAC1D,IAAI,CAAC,OAAO,GAAG,SAAS,GAAG,CAAC,CAAC,CAAC;KAC/B;SAAM,IAAI,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAC,QAAQ,CAAC,EAAE;MAC5C,SAAS,GAAG,IAAI,CAAC,OAAO,CAAC,qBAAqB,EAAE,CAAC,GAAG,CAAC;MACrD,MAAM,cAAc,GAClB,IAAI,IAAI,IAAI,CAAC,UAAU;UACnB,IAAI,CAAC,UAAU;UACf,CAAC,IAAI,CAAC,YAAY,YAAY,QAAQ;YAClC,QAAQ,CAAC,eAAe;YACxB,IAAI,CAAC,YAAY,EACnB,qBAAqB,EAAE,CAAC;MAChC,IAAI,CAAC,OAAO,GAAG,SAAS,GAAG,cAAc,CAAC,MAAM,GAAG,cAAc,CAAC,GAAG,CAAC;KACvE;GACF;EAEO,iBAAiB;IACvB,IAAI,CAAC,eAAe,GAAG,IAAI,CAAC;IAE5B,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,YAAY,IAAI,IAAI,CAAC,eAAe,EAAE,CAAC;IAChE,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC,YAAY,YAAY,QAAQ,CAAC;IAE3D,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC,OAAO,IAAI,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;IAC7D,IAAI,CAAC,OAAO,CAAC,SAAS,CAAC,GAAG,CAAC,iBAAiB,CAAC,CAAC;IAE9C,IAAI,CAAC,cAAc,EAAE,CAAC;IACtB,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,CAAC;IACvB,IAAI,CAAC,eAAe,EAAE,CAAC;IAEvB,IAAI,CAAC,qBAAqB,GAAG,IAAI,CAAC;IAClC,IAAI,CAAC,kBAAkB,CAAC,IAAI,CAAC,CAAC;IAE9B,IAAI,CAAC,YAAY,GAAG,KAAK,CAAC,IAAI,CAC5B,IAAI,CAAC,YAAY,CAAC,gBAAgB,CAAC,cAAc,CAAC,CACnD;OACE,MAAM,CACL,CAAC,OAA+B,KAAK,OAAO,CAAC,QAAQ,KAAK,IAAI,CAAC,QAAQ,CACxE;OACA,SAAS,CAAC,CAAC,OAAO,KAAK,OAAO,KAAK,IAAI,CAAC,IAAI,CAAC,CAAC;IAEjD,IAAI,CAAC,SAAS,EAAE,CAAC;IACjB,IAAI,CAAC,qBAAqB,EAAE,CAAC;IAC7B,IAAI,CAAC,yBAAyB,EAAE,CAAC;;IAGjC,IAAI,CAAC,cAAc,GAAG,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;IACrD,IAAI,CAAC,cAAc,CAAC,OAAO,CAAC,CAAC,KAAkB;MAC7C,KAAK,CAAC,KAAK,CAAC,KAAK,GAAG,IAAI,CAAC,YAAY,GAAG,EAAE,CAAC;KAC5C,CAAC,CAAC;IAEH,IAAI,CAAC,mBAAmB,EAAE,CAAC;IAC3B,IAAI,CAAC,aAAa,EAAE,CAAC;IACrB,IAAI,CAAC,OAAO,EAAE,CAAC;IACf,IAAI,CAAC,qBAAqB,GAAG,QAAQ,CAAC,IAAI,CAAC,qBAAqB,EAAE,EAAE,CAAC,CAAC;GACvE;;EAID,iBAAiB;IACf,IAAI,CAAC,KAAK;MACR,IAAI,CAAC,IAAI,CAAC,GAAG,KAAK,KAAK;QACtB,IAAI,CAAC,IAAI,CAAC,aAA0B,CAAC,GAAG,KAAK,KAAK,CAAC;;IAGtD,QAAQ,CAAC,eAAe,CAAC,gBAAgB,CAAC,qBAAqB,EAAE;MAC/D,UAAU,CAAC,CAAC,CAAC,KAAK,IAAI,CAAC,iBAAiB,EAAE,EAAE,GAAG,CAAC,CAAC;KAClD,CAAC,CAAC;IACH,UAAU,CAAC,CAAC,CAAC;MACX,IAAI,CAAC,IAAI,CAAC,eAAe;QAAE,IAAI,CAAC,iBAAiB,EAAE,CAAC;KACrD,EAAE,IAAI,CAAC,CAAC;GACV;EAED,oBAAoB;IAClB,IAAI,IAAI,CAAC,EAAE,EAAE;MACX,IAAI,CAAC,EAAE,CAAC,UAAU,EAAE,CAAC;MACrB,IAAI,CAAC,EAAE,GAAG,SAAS,CAAC;KACrB;IAED,IAAI,IAAI,CAAC,kBAAkB,EAAE;MAC3B,IAAI,CAAC,kBAAkB,CAAC,UAAU,EAAE,CAAC;MACrC,IAAI,CAAC,kBAAkB,GAAG,SAAS,CAAC;KACrC;IAED,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC;IACzB,IAAI,CAAC,eAAe,GAAG,KAAK,CAAC;GAC9B;EAED,MAAM;IACJ,QACE,EAAC,IAAI,IACH,MAAM,EAAE,CAAC,IAAI,CAAC,aAAa,IAAI,CAAC,IAAI,CAAC,UAAU,IAAI,IAAI,CAAC,QAAQ,EAChE,IAAI,EAAE,IAAI,CAAC,IAAI,IAAI,IAAI,CAAC,OAAO,EAC/B,QAAQ,EAAE,IAAI,CAAC,YAAY,EAC3B,KAAK,EAAE,IAAI,CAAC,YAAY,EACxB,KAAK,EAAE,IAAI,CAAC,OAAO,IAAI,IAAI,CAAC,QAAQ,mBACrB,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAC,QAAQ,CAAC,gBACpC,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAC,KAAK,CAAC,gBAC9B,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAC,KAAK,CAAC,kBAC5B,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAC,OAAO,CAAC,IAE9C,WACE,KAAK,EAAE;QACL,OAAO,EAAE,IAAI;QACb,MAAM,EAAE,IAAI,CAAC,aAAa,IAAI,IAAI,CAAC,QAAQ;QAC3C,KAAK,EAAE,IAAI,CAAC,OAAO,IAAI,IAAI,CAAC,aAAa,IAAI,IAAI,CAAC,QAAQ;QAC1D,IAAI,EAAE,IAAI,CAAC,aAAa,IAAI,IAAI,CAAC,IAAI,IAAI,IAAI,CAAC,OAAO;OACtD,EACD,GAAG,EAAE,CAAC,GAAG,MAAM,IAAI,CAAC,OAAO,GAAG,GAAG,CAAC,IAElC,WAAK,KAAK,EAAC,iBAAiB,EAAC,GAAG,EAAE,CAAC,GAAG,MAAM,IAAI,CAAC,OAAO,GAAG,GAAG,CAAC,IAC7D,eAAQ,CACJ,CACF,CACD,EACP;GACH;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["./src/components/sticker/sticker.scss?tag=nano-sticker&encapsulation=shadow","./src/components/sticker/sticker.tsx"],"sourcesContent":["@import '../../global/style/nano-theme/layers';\n\n:host {\n /*\n @prop --stuck-left: The left position when your sticker is stuck. This can be useful to force your sticker to fill the viewport for example. Defaults to initial\n * @prop --stuck-right: The right position when your sticker is stuck. This can be useful to force your sticker to fill the viewport for example. Defaults to initial\n * @prop --stuck-z-index: The z-index order to display your sticker. Can be useful when displaying multiple stickers simultaneously. Defaults to #{$layer-index-menubar};\n * @prop --top-hide: This is used for the hide transform animation (e.g. when quiet-mode is on). Defaults to translateY(-110%);\n * @prop --bottom-hide: This is used for the hide transform animation (e.g. when quiet-mode is on). Defaults to translateY(110%);\n /\n\n --stuck-left: initial;\n --stuck-right: initial;\n --stuck-z-index: #{$layer-index-menubar};\n --top-hide: translateY(-110%);\n --bottom-hide: translateY(110%);\n\n display: block;\n max-inline-size: 100%;\n}\n\n:host([sticky]) {\n position: sticky;\n transition: 0.3s ease transform;\n will-change: min-block-size;\n}\n\n:host([sticky][stuck]) {\n inset-inline: var(--stuck-left) var(--stuck-right);\n z-index: var(--stuck-z-index) !important;\n}\n\n:host([sticky][hide][placed-top]) {\n transform: var(--top-hide);\n}\n\n:host([sticky][hide][placed-bottom]) {\n transform: var(--bottom-hide);\n}\n\n:host([sticky][index='1']) {\n z-index: calc(var(--stuck-z-index) + 1);\n}\n\n:host([sticky][index='2']) {\n z-index: calc(var(--stuck-z-index) + 2);\n}\n\n:host([sticky][index='3']) {\n z-index: calc(var(--stuck-z-index) + 3);\n}\n\n:host([sticky][index='4']) {\n z-index: calc(var(--stuck-z-index) + 4);\n}\n\n:host([sticky][index='5']) {\n z-index: calc(var(--stuck-z-index) + 5);\n}\n\n.sticker {\n display: inherit;\n max-inline-size: inherit;\n inline-size: 100%;\n\n &:not(.stuck) {\n inline-size: auto !important;\n }\n\n &.sticky {\n transition: 0.3s ease all;\n position: relative;\n\n :host([index='1']) & {\n z-index: calc(var(--stuck-z-index) + 1);\n }\n\n :host([index='2']) & {\n z-index: calc(var(--stuck-z-index) + 2);\n }\n\n :host([index='3']) & {\n z-index: calc(var(--stuck-z-index) + 3);\n }\n\n :host([index='4']) & {\n z-index: calc(var(--stuck-z-index) + 4);\n }\n\n :host([index='5']) & {\n z-index: calc(var(--stuck-z-index) + 5);\n }\n }\n\n &.stuck {\n position: fixed;\n inset-inline: var(--stuck-left) var(--stuck-right);\n z-index: var(--stuck-z-index);\n transform: translateY(0);\n\n :host([placed-top]) & {\n inset-block-start: 0;\n }\n\n :host([placed-bottom]) & {\n inset-block-end: 0;\n }\n\n &.hide {\n :host([placed-top]) & {\n transform: var(--top-hide);\n }\n\n :host([placed-bottom]) & {\n transform: var(--bottom-hide);\n }\n }\n }\n}\n\n.sticker-content {\n display: flex;\n flex-wrap: wrap;\n}\n","import {\n Component,\n ComponentInterface,\n h,\n Host,\n Prop,\n State,\n Watch,\n Element,\n Event,\n EventEmitter,\n Method,\n} from '@stencil/core';\nimport { getOffset } from '../../utils/dom';\nimport { debounce } from '../../utils/throttle';\n\nfunction _getScrollTop(ele: HTMLElement \| Document) {\n return ele instanceof Document ? window.pageYOffset : ele.scrollTop;\n}\n\nfunction _getOffset(ele: HTMLElement, parent: HTMLElement \| Document) {\n const parentEle =\n parent instanceof Document ? document.documentElement : parent;\n return getOffset(ele, parentEle);\n}\n\ntype Positions = 'top' \| 'bottom' \| 'start' \| 'end';\n\n/\n The Sticker component is a toolbox for 'sticking' items to scrolling containers.\n \n /\n@Component({\n tag: 'nano-sticker',\n styleUrl: 'sticker.scss',\n shadow: true,\n})\nexport class Sticker implements ComponentInterface {\n private isRtl: boolean = false;\n private io: IntersectionObserver;\n private contentSizeObserver: ResizeObserver;\n private parentSizeObserver: ResizeObserver;\n private sticker: HTMLDivElement;\n private content: HTMLDivElement;\n private scrollPosCache = 0;\n private scrollPosThresholdCache = 0;\n private cacheOffset: number \| { v: number; h: number } = 0;\n private slottedContent: Element[];\n private pauseResizeWatcher = false;\n private listenForScrollParent = false;\n private stickToEleInitSize?: DOMRect;\n private positions: Positions[] = [];\n private pauseHide: boolean = false;\n private hasBootstrapped = false;\n\n @Element() host: HTMLNanoStickerElement;\n\n // Internal State\n\n @State() isStuck = false;\n @State() isRootSticker = true;\n @State() hide = false;\n @State() scrollHide = false;\n @State() multiStickerHide = false;\n @State() scrollingTo = false;\n @State() quietModeIsOn = false;\n @State() stuckCounter = 0;\n @State() stickerIndex = 0;\n @State() stickToEle?: HTMLNanoStickerElement;\n @State() triggerPos: { top: number; left: number };\n @State() trigger: HTMLDivElement;\n @State() _offset: number \| { v: number; h: number } = 0;\n\n // Public API\n\n /** Only applicable to root stickers. When applied the sticker will grow or shrink to the scrollParent size /\n @Prop() autoResize = true;\n\n /* Manually enable / disabled sticky behaviour /\n @Prop({ mutable: true }) isSticky = true;\n\n /* Distance the item should be stuck from the sticky edge. /\n @Prop({ mutable: true }) offset: number \| { v: number; h: number } = 0;\n\n /* The edge of the scroll-parent to stick to /\n @Prop() position: 'top' \| 'bottom' = 'top';\n // other opts I'd like one day. 'start' \| 'end' \| 'top-start' \| 'top-end' \| 'bottom-start' \| 'bottom-end'\n\n /* When applied, the sticker will hide when the scroll-parent\n * is scrolling away from the sticker's stuck position and show when scrolling toward it.\n * By default this will apply when the parent is below either the h or w dimensions /\n @Prop() quietMode: 'on' \| 'off' \| { h: number; w: number } = {\n h: 600,\n w: 600,\n };\n\n /* When applied stickers will hide upon new stickers being stuck to the same position /\n @Prop() hideOnNewStickers = true;\n\n /* The max width of the item to implement sticky behaviour. /\n @Prop() breakPointMax: null \| number = null;\n\n /* The min width of the item to implement sticky behaviour. /\n @Prop() breakPointMin: null \| number = null;\n\n /* Define which scroll element to listen & stick to.\n * By default, it will find traverse the DOM to find the closest. /\n @Prop({ mutable: true }) scrollParent?: HTMLElement \| Document;\n\n /* Upon being stuck, attach the sticker to another sticker element.\n * A JS query selector that returns a <nano-sticker> /\n @Prop() stickTo: string;\n\n // Broadcasted Events\n\n /* Emitted when a sticker is stuck /\n @Event() nanoStuck!: EventEmitter<{ sticker: HTMLNanoStickerElement }>;\n\n /* Emitted when a sticker is unstuck /\n @Event() nanoUnstuck!: EventEmitter<{ sticker: HTMLNanoStickerElement }>;\n\n /* Emitted when a sticker is hidden /\n @Event() nanoHide!: EventEmitter<{ sticker: HTMLNanoStickerElement }>;\n\n /* Emitted when a sticker is showing /\n @Event() nanoShow!: EventEmitter<{ sticker: HTMLNanoStickerElement }>;\n\n // Public methods\n\n /\n Method to return the visibility status of the sticker\n * @returns boolean\n /\n @Method()\n async isHiding() {\n return this.hide;\n }\n\n /\n Method to return the stuck status of the sticker\n * @returns boolean\n /\n @Method()\n async isSticking() {\n this.shouldStick();\n return this.isStuck;\n }\n\n /* @internal /\n @Method()\n async setTriggerPos(offset: number \| { v: number; h: number }) {\n return (this._offset = offset);\n }\n\n /* @internal /\n @Method()\n async getTriggerPos() {\n return this.triggerPos;\n }\n\n /* @internal /\n @Method()\n async pauseHiding(pause: boolean) {\n return (this.pauseHide = pause);\n }\n\n // Watchers\n\n /* Keep a note of trigger position. Need this to track sticker order in the DOM /\n @Watch('trigger')\n @Watch('scrollParent')\n updateTriggerOffset() {\n if (!this.trigger \|\| !this.scrollParent \|\| !this.listenForScrollParent)\n return;\n this.triggerPos = _getOffset(this.trigger, this.scrollParent);\n }\n\n /* A root sticker is a fixed element Or this sticker is sticking to another.\n * We need a content resize watcher to make sure we maintain a correct placeholder size in the body /\n @Watch('position')\n stickerResizeListener() {\n if (!this.content \|\| !window['ResizeObserver']) return;\n\n if (this.contentSizeObserver) {\n this.contentSizeObserver.disconnect();\n this.contentSizeObserver = undefined;\n }\n\n this.contentSizeObserver = new ResizeObserver((entries) => {\n for (const entry of entries) {\n if (this.pauseResizeWatcher) return;\n\n if (entry.contentRect.height) {\n if (this.position === 'top')\n this.host.style.height = entry.contentRect.height + 'px';\n if (this.position === 'bottom')\n this.host.style.minHeight = entry.contentRect.height + 'px';\n }\n }\n });\n this.contentSizeObserver.observe(this.content);\n }\n\n @Watch('quietMode')\n quietModeChange() {\n if (this.quietMode === 'on')\n requestAnimationFrame(() => (this.quietModeIsOn = true));\n else if (this.quietMode === 'off')\n requestAnimationFrame(() => (this.quietModeIsOn = false));\n }\n\n /* offset is part of the public API but we also use it to manipulate trigger points /\n @Watch('offset')\n @Watch('_offset')\n setOffset() {\n this.trigger.setAttribute('style', '');\n let v: number, h: number, _v: number, _h: number;\n const sticker: HTMLElement =\n this.isRootSticker \|\| this.stickToEle ? this.sticker : this.host;\n\n if (!sticker) return;\n\n if (typeof this.offset === 'object') ({ v, h } = this.offset);\n else v = h = this.offset;\n\n if (typeof this._offset === 'object') ({ v = _v, h = _h } = this._offset);\n else _v = _h = this._offset;\n\n const setPos = (pos: 'top' \| 'bottom' \| 'left' \| 'right') => {\n const u = pos.match(/(top\|bottom)/) ? v : h;\n setTriggetPos(pos);\n sticker.style[pos] = u + 'px';\n if (u)\n this.host.style.setProperty(\n '--hide-transform-amount',\n `(110% + ${u}px)`\n );\n else this.host.style.setProperty('--hide-transform-amount', null);\n };\n\n const setTriggetPos = (pos: 'top' \| 'bottom' \| 'left' \| 'right') => {\n const u = pos.match(/(top\|bottom)/) ? v + _v : h + _h;\n this.trigger.style[pos] = u -1 + 'px';\n this.trigger.style.position = 'relative';\n this.trigger.style.height = '1px';\n };\n\n if (\n (this.positions.includes('start') && this.isRtl) \|\|\n (this.positions.includes('end') && !this.isRtl)\n )\n setPos('right');\n\n if (\n (this.positions.includes('end') && this.isRtl) \|\|\n (this.positions.includes('start') && !this.isRtl)\n )\n setPos('left');\n\n if (this.positions.includes('top')) setPos('top');\n if (this.positions.includes('bottom')) setPos('bottom');\n }\n\n @Watch('position')\n positionChange() {\n this.positions = this.position.split('-') as Positions[];\n this.setOffset();\n }\n\n /** If this sticker is attached to a 'master' sticker (stickToEle),\n * here we move the content of this sticker in and out accordingly /\n @Watch('isStuck')\n async stuckChange() {\n if (this.isStuck) {\n if (this.stickToEle) {\n const content = this.host.children;\n this.slottedContent = Array.from(content);\n\n this.slottedContent.forEach((child: HTMLElement) => {\n this.stickToEle.appendChild(child);\n child.style.order = this.stickerIndex + '';\n });\n\n this.nanoStuck.emit({ sticker: this.stickToEle });\n } else this.nanoStuck.emit({ sticker: this.host });\n } else {\n this.scrollHide = false;\n\n if (this.stickToEle) {\n this.slottedContent.forEach((child: HTMLElement) => {\n this.host.appendChild(child);\n child.style.order = '';\n });\n this.nanoUnstuck.emit({ sticker: this.stickToEle });\n } else this.nanoUnstuck.emit({ sticker: this.host });\n }\n }\n\n /* attach scroll listener. 'hides' stickers when scrolling away from trigger and 'shows' when scrolling toward /\n @Watch('quietModeIsOn')\n attachScrollListeners() {\n if (this.quietModeIsOn)\n this.scrollParent.addEventListener('scroll', this.onScroll, {\n passive: true,\n capture: false,\n });\n else if (this.scrollParent) {\n this.scrollParent.removeEventListener('scroll', this.onScroll);\n this.moveTrigger(true);\n }\n }\n\n /* Add / remove parent scrolling listeners. If there's stickToEle we need to remove them /\n @Watch('scrollParent')\n @Watch('stickToEle')\n handleParentEvents(_, oldParent: null \| HTMLElement = null) {\n if (!this.listenForScrollParent) return;\n if (oldParent) this.manageListenersOnParent(false, oldParent);\n if (this.scrollParent) this.manageListenersOnParent(!this.stickToEle);\n }\n\n /* Add remove specific listeners if we're sticking to a sticker.\n * We need to adjust triggers according to the status of the 'master' /\n @Watch('stickToEle')\n stickToEleChange(_, oldEle: null \| HTMLNanoStickerElement) {\n if (this.stickToEle) {\n this.stickToEle.addEventListener('nanoHide', this.onStickToDisplayEvent);\n this.stickToEle.addEventListener('nanoShow', this.onStickToDisplayEvent);\n this.stickToEle.addEventListener('nanoStuck', this.onStickToDisplayEvent);\n this.stickToEle.addEventListener(\n 'nanoUnstuck',\n this.onStickToDisplayEvent\n );\n }\n if (oldEle) {\n oldEle.removeEventListener('nanoHide', this.onStickToDisplayEvent);\n oldEle.removeEventListener('nanoShow', this.onStickToDisplayEvent);\n oldEle.removeEventListener('nanoStuck', this.onStickToDisplayEvent);\n oldEle.removeEventListener('nanoUnstuck', this.onStickToDisplayEvent);\n }\n }\n\n /* Find and set the stickToEle from the public, selector string /\n @Watch('stickTo')\n stickToChange() {\n if (this.stickTo)\n this.stickToEle = this.scrollParent.querySelector(this.stickTo);\n else this.stickToEle = undefined;\n }\n\n /* 2 potential criteria for hiding. Multi-stickers or quietmode. /\n @Watch('multiStickerHide')\n @Watch('scrollHide')\n visibilityDecisionHandler() {\n if (this.multiStickerHide \|\| this.scrollHide) this.hide = true;\n else this.hide = false;\n }\n\n @Watch('hide')\n handleHideChange() {\n if (this.hide) this.nanoHide.emit({ sticker: this.host });\n else this.nanoShow.emit({ sticker: this.host });\n }\n\n @Watch('scrollParent')\n setupIO() {\n if (this.io) {\n this.io.disconnect();\n this.io = undefined;\n }\n if (!this.scrollParent \|\| !this.hasBootstrapped \|\| !this.trigger) return;\n\n this.isRootSticker = this.scrollParent instanceof Document;\n let root = this.scrollParent;\n if (this.scrollParent instanceof Document) root = null;\n\n this.io = new window.IntersectionObserver(\n (_) => {\n if (this.pauseResizeWatcher \|\| !this.isSticky) return;\n this.shouldStick(_.slice(-1)[0]);\n },\n { root: root as HTMLElement }\n );\n\n this.io.observe(this.trigger);\n }\n\n // Private methods / handlers\n\n /* Assesses the public API quitemode and works out if it should be applied atm.\n * If 'smallscreen', or there is a breakpointmax / min it will add a resizeobserver to conditionally add behaviour /\n private setupParentResizeListener = () => {\n if (!window['ResizeObserver']) return;\n\n if (this.parentSizeObserver) {\n this.parentSizeObserver.disconnect();\n this.parentSizeObserver = undefined;\n }\n\n this.parentSizeObserver = new ResizeObserver((entries) => {\n for (const entry of entries) {\n let height: number, width: number;\n if (entry.contentRect.height) height = entry.contentRect.height;\n if (entry.contentRect.width) width = entry.contentRect.width;\n\n if (typeof this.quietMode === 'object') {\n if (width < this.quietMode.w \|\| height < this.quietMode.h)\n this.quietModeIsOn = true;\n else this.quietModeIsOn = false;\n }\n\n if (this.breakPointMin) {\n if (width > this.breakPointMin) this.isSticky = true;\n else this.isSticky = false;\n }\n\n if (this.breakPointMax) {\n if (width < this.breakPointMax) this.isSticky = true;\n else this.isSticky = false;\n }\n\n if (this.isRootSticker && this.sticker && this.autoResize)\n this.sticker.style.width = this.host.scrollWidth + 'px';\n }\n });\n\n const toWatch =\n this.scrollParent instanceof Document\n ? this.scrollParent.documentElement\n : this.scrollParent;\n if (toWatch) this.parentSizeObserver.observe(toWatch);\n };\n\n /* For stickTo stickers. We listen to the events from the 'master' sticker to ammend the hide/show trigger\n * Main diffs from rootstickers / non is height being on 'master' /\n private onStickToDisplayEvent = (\n e: CustomEvent<{ sticker: HTMLNanoStickerElement }>\n ) => {\n if (e.detail.sticker !== this.stickToEle) return;\n\n switch (e.type) {\n case 'nanoHide':\n this._offset = 0;\n this.cacheOffset = this.offset;\n this.offset = 0;\n /* trigger moves down, underneath sticker if the main sticker hides /\n if (!this.isStuck) this.moveTrigger(false);\n\n /* If it's an actual 'position: sticky' element, we need to give the sticker an appropriate height.\n * This minimises content jumping around as items are added /\n if (!this.isRootSticker && this.quietModeIsOn) {\n requestAnimationFrame(() => {\n this.stickToEle.style.minHeight =\n this.stickToEleInitSize.height +\n (this.host.scrollHeight +\n (typeof this.cacheOffset === 'object'\n ? this.cacheOffset.v\n : this.cacheOffset)) +\n 'px';\n this.stickToEle.setTriggerPos(this.stickToEleInitSize.height -1);\n });\n }\n break;\n case 'nanoShow':\n this._offset = this.stickToEleInitSize.height;\n this.offset = this.cacheOffset;\n this.moveTrigger(true);\n\n /** reset master sticker size /\n if (!this.isRootSticker && this.quietModeIsOn) {\n requestAnimationFrame(() => {\n this.stickToEle.style.minHeight = '';\n this.stickToEle.setTriggerPos(0);\n });\n }\n break;\n case 'nanoStuck':\n this.stickToEleInitSize = this.stickToEle.getBoundingClientRect();\n this._offset = this.stickToEleInitSize.height;\n break;\n }\n };\n\n /* Add or removes event listeners / observers on scrolling parent\n * for when the scrolling parent changes, or, this sticker is sticking to another /\n private manageListenersOnParent(\n addEvents: boolean,\n ele?: HTMLElement \| Document\n ) {\n const scrollParent = ele \|\| this.scrollParent;\n\n if (!scrollParent) return;\n\n if (!addEvents) {\n try {\n if (this.quietModeIsOn)\n scrollParent.removeEventListener('scroll', this.onScroll);\n scrollParent.removeEventListener('nanoStuck', this.onStickEvent);\n scrollParent.removeEventListener('nanoUnstuck', this.onStickEvent);\n } catch (e) {\n console.error('Events haven`t been added');\n }\n } else {\n scrollParent.addEventListener('nanoStuck', this.onStickEvent);\n scrollParent.addEventListener('nanoUnstuck', this.onStickEvent);\n\n if (this.quietModeIsOn) this.attachScrollListeners();\n }\n this.setupParentResizeListener();\n }\n\n /* Handler applied to scrolling parent. When 'hideOnNewStickers' is true, hide this sticker on subsequent stuck stickers. /\n private onStickEvent = async (\n e: CustomEvent<{ sticker: HTMLNanoStickerElement }>\n ) => {\n const sticker = e.detail ? e.detail.sticker : null;\n if (!sticker \|\| sticker.position !== this.position) return;\n\n const incomingTriggerPos = await sticker.getTriggerPos();\n\n if (\n e.type === 'nanoStuck' &&\n sticker !== this.host &&\n sticker.scrollParent === this.host.scrollParent\n ) {\n this.stickerIndex++;\n\n if (!this.hideOnNewStickers) return;\n\n if (\n (this.positions.includes('top') &&\n this.triggerPos.top < incomingTriggerPos.top) \|\|\n (this.positions.includes('bottom') &&\n this.triggerPos.top > incomingTriggerPos.top)\n ) {\n this.multiStickerHide = true;\n this.stuckCounter++;\n }\n }\n\n if (\n e.type === 'nanoUnstuck' &&\n sticker !== this.host &&\n sticker.scrollParent === this.host.scrollParent\n ) {\n this.stickerIndex--;\n\n if (!this.hideOnNewStickers) return;\n\n if (\n (this.positions.includes('top') &&\n this.triggerPos.top < incomingTriggerPos.top) \|\|\n (this.positions.includes('bottom') &&\n this.triggerPos.top > incomingTriggerPos.top)\n ) {\n this.stuckCounter--;\n if (this.stuckCounter < 1) this.multiStickerHide = false;\n }\n }\n };\n\n /* Scroll handler applied to scrolling parent. Only applied when quietmode is on.\n * 'hides' stickers when scrolling over 100px away from trigger and 'shows' when scrolling toward /\n private onScroll = () => {\n const y: number = _getScrollTop(this.scrollParent);\n\n // scrolling up\n if (y < this.scrollPosCache) {\n if (!this.positions.includes('bottom')) this.handleScrollTo();\n else this.handleScrollAway(y);\n }\n\n // scrolling down\n if (y > this.scrollPosCache) {\n if (!this.positions.includes('bottom')) this.handleScrollAway(y);\n else this.handleScrollTo();\n }\n this.scrollPosCache = y;\n };\n\n /* Watch for scroll direction. Only applies when quietmode is on.\n * We need to addjust the position of the trigger when the sticker is hidden /\n private handleScrollTo() {\n this.scrollPosThresholdCache = null;\n if (!this.scrollHide) return;\n\n if (this.scrollingTo !== true) {\n this._offset = this.cacheOffset \|\| this._offset;\n }\n this.scrollingTo = true;\n this.scrollHide = false;\n }\n\n private handleScrollAway(currScroll: number) {\n if (this.scrollHide) return;\n\n if (!this.isStuck) return;\n\n if (this.scrollingTo !== false) {\n this.cacheOffset = this._offset;\n this._offset = 0;\n }\n this.scrollingTo = false;\n\n if (!this.scrollPosThresholdCache)\n this.scrollPosThresholdCache = currScroll;\n else if (\n !this.pauseHide &&\n Math.abs(currScroll - this.scrollPosThresholdCache) > 100\n )\n this.scrollHide = true;\n }\n\n private moveTrigger(toInitial?: boolean) {\n if (\n (this.positions.includes('bottom') && !toInitial) \|\|\n (!this.positions.includes('bottom') && toInitial)\n ) {\n this.host.parentNode.insertBefore(this.trigger, this.host);\n } else\n this.host.parentNode.insertBefore(this.trigger, this.host.nextSibling);\n }\n\n /\n Gets the 'closest' scrolling parent\n * @returns either an element with `overflow: scroll \| auto` or the parent Document\n */\n private getScrollParent(): HTMLElement \| Document {\n const regex = /(auto\|scroll)/;\n const parents = (_node: Node, ps: Node[]) => {\n if (_node.parentNode === null) {\n return ps;\n }\n return parents(_node.parentNode, ps.concat([_node]));\n };\n const style = (_node, prop) =>\n getComputedStyle(_node, null).getPropertyValue(prop);\n const overflow = (_node) =>\n style(_node, 'overflow') +\n style(_node, 'overflow-y') +\n style(_node, 'overflow-x');\n const scroll = (_node) => regex.test(overflow(_node));\n const docHeight = document.documentElement.getBoundingClientRect().height;\n\n const scrollParent = (_node: HTMLElement) => {\n if (!(typeof _node === 'object')) return;\n\n const ps = parents(_node, []);\n return (\n ps.find(\n (ele) =>\n scroll(ele) && ele.getBoundingClientRect().height !== docHeight\n ) \|\| document\n );\n };\n\n return scrollParent(this.host);\n }\n\n private shouldStick(data?: IntersectionObserverEntry) {\n let scrollAmt: number;\n\n if (this.positions.includes('top')) {\n if (!this.isRootSticker)\n scrollAmt = _getOffset(this.trigger, this.scrollParent).top;\n else scrollAmt = this.trigger.getBoundingClientRect().top;\n this.isStuck = scrollAmt < -1;\n } else if (this.positions.includes('bottom')) {\n scrollAmt = this.trigger.getBoundingClientRect().top;\n const parentBounding =\n data && data.rootBounds\n ? data.rootBounds\n : (this.scrollParent instanceof Document\n ? document.documentElement\n : this.scrollParent\n ).getBoundingClientRect();\n this.isStuck = scrollAmt > parentBounding.height + parentBounding.top;\n }\n }\n\n private bootstrapGurantor() {\n this.hasBootstrapped = true;\n\n this.scrollParent = this.scrollParent \|\| this.getScrollParent();\n this.isRootSticker = this.scrollParent instanceof Document;\n\n this.trigger = this.trigger \|\| document.createElement('div');\n this.trigger.classList.add('sticker-trigger');\n\n this.positionChange();\n this.moveTrigger(true);\n this.quietModeChange();\n\n this.listenForScrollParent = true;\n this.handleParentEvents(true);\n\n this.stickerIndex = Array.from(\n this.scrollParent.querySelectorAll('nano-sticker')\n )\n .filter(\n (sticker: HTMLNanoStickerElement) => sticker.position === this.position\n )\n .findIndex((sticker) => sticker === this.host);\n\n this.setOffset();\n this.stickerResizeListener();\n this.setupParentResizeListener();\n\n // bit of a hack ... add default 'order'. Required for 'stickTo' elements.\n this.slottedContent = Array.from(this.host.children);\n this.slottedContent.forEach((child: HTMLElement) => {\n child.style.order = this.stickerIndex + '';\n });\n\n this.updateTriggerOffset();\n this.stickToChange();\n this.setupIO();\n this.onStickToDisplayEvent = debounce(this.onStickToDisplayEvent, 50);\n }\n\n // Stencil metthods\n\n connectedCallback() {\n this.isRtl =\n this.host.dir === 'rtl' \|\|\n (this.host.ownerDocument as Document).dir === 'rtl';\n\n // this is all horrible.... shrug\n document.documentElement.addEventListener('nanoComponentsReady', () => {\n setTimeout((_) => this.bootstrapGurantor(), 200);\n });\n setTimeout((_) => {\n if (!this.hasBootstrapped) this.bootstrapGurantor();\n }, 1000);\n }\n\n disconnectedCallback() {\n if (this.io) {\n this.io.disconnect();\n this.io = undefined;\n }\n\n if (this.parentSizeObserver) {\n this.parentSizeObserver.disconnect();\n this.parentSizeObserver = undefined;\n }\n\n this.scrollParent = null;\n this.hasBootstrapped = false;\n }\n\n render() {\n return (\n <Host\n sticky={!this.isRootSticker && !this.stickToEle && this.isSticky}\n hide={this.hide && this.isStuck}\n siblings={this.stuckCounter}\n index={this.stickerIndex}\n stuck={this.isStuck && this.isSticky}\n placed-bottom={this.positions.includes('bottom')}\n placed-top={this.positions.includes('top')}\n placed-end={this.positions.includes('end')}\n placed-start={this.positions.includes('start')}\n >\n <div\n class={{\n sticker: true,\n sticky: this.isRootSticker && this.isSticky,\n stuck: this.isStuck && this.isRootSticker && this.isSticky,\n hide: this.isRootSticker && this.hide && this.isStuck,\n }}\n ref={(div) => (this.sticker = div)}\n >\n <div class=\"sticker-content\" ref={(div) => (this.content = div)}>\n <slot />\n </div>\n </div>\n </Host>\n );\n }\n}\n"],"version":3}

package/dist/esm/nano-tab-content.entry.js CHANGED Viewed

@@ -1,20 +1,26 @@
 /*!
  * Web Components for Nanopore digital Web Apps
  */
-import { r as registerInstance, h, a as Host, g as getElement } from './index-3c280603.js';
+import { r as registerInstance, h, a as Host, g as getElement } from './index-b4e277ad.js';
-const tabContentCss = ":host{box-sizing:border-box}*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}:host{display:block;transform:translate3d(0, 0, 0);animation:opacity 0.3s ease-in-out forwards;opacity:1}@media only screen and (max-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:100%}}@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 tabContentCss = ":host{box-sizing:border-box}*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}:host{display:block;transform:translate3d(0, 0, 0);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 (max-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 {
   constructor(hostRef) {
     registerInstance(this, hostRef);
     this.tabContentId = `nano-tab-content-${++id}`;
+    this.ready = false;
     this.name = '';
     this.active = false;
   }
+  componentDidLoad() {
+    requestAnimationFrame(() => (this.ready = true));
+  }
   render() {
-    return (h(Host, { id: this.host.id || this.tabContentId, style: { display: this.active ? 'block' : 'none' }, role: "tabpanel", "aria-hidden": this.active ? 'false' : 'true' }, h("div", { part: "base", class: "nano-tab-content" }, h("slot", null))));
+    return (h(Host, { id: this.host.id || this.tabContentId, style: { display: this.active ? 'block' : 'none' }, role: "tabpanel", "aria-hidden": this.active ? 'false' : 'true', class: {
+        ready: this.ready,
+      } }, h("div", { part: "base", class: "nano-tab-content" }, h("slot", null))));
   }
   get host() { return getElement(this); }
 };

package/dist/esm/nano-tab-content.entry.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"nano-tab-content.entry.js","mappings":";;;;;AAAA,MAAM,aAAa,GAAG,~~w1BAAw1B~~;;~~ACS92B~~,IAAI,EAAE,GAAG,CAAC,CAAC;MAUE,QAAQ;;;IACX,iBAAY,GAAG,oBAAoB,EAAE,EAAE,EAAE,CAAC;~~gBAKlB~~,EAAE;kBAGA,KAAK;;EAEvC,MAAM;IACJ,QACE,EAAC,IAAI,IACH,EAAE,EAAE,IAAI,CAAC,IAAI,CAAC,EAAE,IAAI,IAAI,CAAC,YAAY,EACrC,KAAK,EAAE,EAAE,OAAO,EAAE,IAAI,CAAC,MAAM,GAAG,OAAO,GAAG,MAAM,EAAE,EAClD,IAAI,EAAC,UAAU,iBACF,IAAI,CAAC,MAAM,GAAG,OAAO,GAAG,MAAM,~~IAE3C~~,WAAK,IAAI,EAAC,MAAM,EAAC,KAAK,EAAC,kBAAkB,IACvC,eAAQ,CACJ,CACD,EACP;GACH;;;;;;;","names":[],"sources":["./src/components/tabs/tab-content.scss?tag=nano-tab-content&encapsulation=shadow","./src/components/tabs/tab-content.tsx"],"sourcesContent":[":host {\n display: block;\n transform: translate3d(0, 0, 0);\n animation: opacity 0.3s ease-in-out forwards;\n ~~opacity~~: 1;\n}\n\n@media only screen and (max-width: 768px) {\n :host([animation-dir='left']) {\n animation: slide-right 0.3s ease-in-out;\n opacity: 1;\n }\n\n :host([animation-dir='right']) {\n animation: slide-left 0.3s ease-in-out;\n opacity: 1;\n }\n}\n\n.nano-tab-content {\n position: relative;\n}\n\n@keyframes opacity {\n 0% {\n opacity: 0;\n }\n\n 100% {\n opacity: ~~100%;\~~n }\n}\n\n@keyframes slide-left {\n 0% {\n transform: translate3d(-100%, 0, 0);\n }\n\n 50% {\n transform: translate3d(0%) translate3d(-0.9em);\n }\n\n 100% {\n transform: translate3d(0, 0, 0);\n }\n}\n\n@keyframes slide-right {\n 0% {\n transform: translate3d(100%, 0, 0);\n }\n\n 50% {\n transform: translateX(0%) translate3d(0.9em);\n }\n\n 100% {\n transform: translate3d(0, 0, 0);\n }\n}\n\n@media (prefers-reduced-motion: reduce) {\n * {\n animation: none !important;\n }\n}\n","import {\n Component,\n Element,\n Host,\n Prop,\n h,\n ComponentInterface,\n} from '@stencil/core';\n\nlet id = 0;\n\n/*\n @slot - The tab panel's content.\n /\n@Component({\n tag: 'nano-tab-content',\n styleUrl: 'tab-content.scss',\n shadow: true,\n})\nexport class TabPanel implements ComponentInterface {\n private tabContentId = `nano-tab-content-${++id}`;\n\n @Element() host: HTMLNanoTabContentElement;\n\n /* The tab panel's name. /\n @Prop({ reflect: true }) name = '';\n\n /* When true, the tab content will be shown. */\n @Prop({ reflect: true }) active = false;\n\n render() {\n return (\n <Host\n id={this.host.id \|\| this.tabContentId}\n style={{ display: this.active ? 'block' : 'none' }}\n role=\"tabpanel\"\n aria-hidden={this.active ? 'false' : 'true'}\n >\n <div part=\"base\" class=\"nano-tab-content\">\n <slot />\n </div>\n </Host>\n );\n }\n}\n"],"version":3}
1	+ {"file":"nano-tab-content.entry.js","mappings":";;;;;AAAA,MAAM,aAAa,GAAG,u6BAAu6B;;ACU77B,IAAI,EAAE,GAAG,CAAC,CAAC;MAUE,QAAQ;;;IACX,iBAAY,GAAG,oBAAoB,EAAE,EAAE,EAAE,CAAC;iBACjC,KAAK;gBAKU,EAAE;kBAGA,KAAK;;EAEvC,gBAAgB;IACd,qBAAqB,CAAC,OAAO,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,CAAC,CAAC;GAClD;EAED,MAAM;IACJ,QACE,EAAC,IAAI,IACH,EAAE,EAAE,IAAI,CAAC,IAAI,CAAC,EAAE,IAAI,IAAI,CAAC,YAAY,EACrC,KAAK,EAAE,EAAE,OAAO,EAAE,IAAI,CAAC,MAAM,GAAG,OAAO,GAAG,MAAM,EAAE,EAClD,IAAI,EAAC,UAAU,iBACF,IAAI,CAAC,MAAM,GAAG,OAAO,GAAG,MAAM,EAC3C,KAAK,EAAE;QACL,KAAK,EAAE,IAAI,CAAC,KAAK;OAClB,IAED,WAAK,IAAI,EAAC,MAAM,EAAC,KAAK,EAAC,kBAAkB,IACvC,eAAQ,CACJ,CACD,EACP;GACH;;;;;;;","names":[],"sources":["./src/components/tabs/tab-content.scss?tag=nano-tab-content&encapsulation=shadow","./src/components/tabs/tab-content.tsx"],"sourcesContent":[":host {\n display: block;\n transform: translate3d(0, 0, 0);\n opacity: 1;\n animation: opacity 0.3s ease-in-out forwards;\n animation-duration: 0s !important;\n}\n\n:host(.ready) {\n animation-duration: 0.3s !important;\n}\n\n@media only screen and (max-width: 768px) {\n :host([animation-dir='left']) {\n animation: slide-right 0.3s ease-in-out;\n opacity: 1;\n }\n\n :host([animation-dir='right']) {\n animation: slide-left 0.3s ease-in-out;\n opacity: 1;\n }\n}\n\n.nano-tab-content {\n position: relative;\n}\n\n@keyframes opacity {\n 0% {\n opacity: 0;\n }\n\n 100% {\n opacity: 1;\n }\n}\n\n@keyframes slide-left {\n 0% {\n transform: translate3d(-100%, 0, 0);\n }\n\n 50% {\n transform: translate3d(0%) translate3d(-0.9em);\n }\n\n 100% {\n transform: translate3d(0, 0, 0);\n }\n}\n\n@keyframes slide-right {\n 0% {\n transform: translate3d(100%, 0, 0);\n }\n\n 50% {\n transform: translateX(0%) translate3d(0.9em);\n }\n\n 100% {\n transform: translate3d(0, 0, 0);\n }\n}\n\n@media (prefers-reduced-motion: reduce) {\n * {\n animation: none !important;\n }\n}\n","import {\n Component,\n Element,\n Host,\n Prop,\n h,\n ComponentInterface,\n State,\n} from '@stencil/core';\n\nlet id = 0;\n\n/*\n @slot - The tab panel's content.\n /\n@Component({\n tag: 'nano-tab-content',\n styleUrl: 'tab-content.scss',\n shadow: true,\n})\nexport class TabPanel implements ComponentInterface {\n private tabContentId = `nano-tab-content-${++id}`;\n @State() ready = false;\n\n @Element() host: HTMLNanoTabContentElement;\n\n /* The tab panel's name. /\n @Prop({ reflect: true }) name = '';\n\n /* When true, the tab content will be shown. */\n @Prop({ reflect: true }) active = false;\n\n componentDidLoad(): void {\n requestAnimationFrame(() => (this.ready = true));\n }\n\n render() {\n return (\n <Host\n id={this.host.id \|\| this.tabContentId}\n style={{ display: this.active ? 'block' : 'none' }}\n role=\"tabpanel\"\n aria-hidden={this.active ? 'false' : 'true'}\n class={{\n ready: this.ready,\n }}\n >\n <div part=\"base\" class=\"nano-tab-content\">\n <slot />\n </div>\n </Host>\n );\n }\n}\n"],"version":3}