npm - @nanoporetech-digital/components - Versions diffs - 3.5.0 → 3.6.0 - Mend

@nanoporetech-digital/components 3.5.0 → 3.6.0

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

Files changed (226) hide show

package/dist/cjs/{nano-tooltip.cjs.entry.js → nano-progress-bar_2.cjs.entry.js} RENAMED Viewed

@@ -8,6 +8,27 @@ Object.defineProperty(exports, '__esModule', { value: true });
 const index = require('./index-41582c2a.js');
 const popover = require('./popover-508bcedb.js');
+const progressBarCss = ":host{box-sizing:border-box}*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}:host{--height:1em;--track-color:rgba(var(--nano-track-rgb, 228, 230, 232), 1);--indicator-color:rgba(var(--nano-indicator-rgb, 84, 140, 175), 1);--label-color:var(--nano-color-white, white);display:block}.progress-bar{position:relative;background-color:var(--track-color);height:var(--height);border-radius:var(--nano-layer-border-radius, var(--nano-border-radius-medium, 4px));overflow:hidden}.progress-bar__indicator{height:100%;font-size:0.75em;background-color:var(--indicator-color);color:var(--label-color);text-align:center;white-space:nowrap;overflow:hidden;transition:0.4s width, 0.4s background-color;transform:translateZ(0);-webkit-user-select:none;user-select:none;transform-origin:left}.progress-bar--indeterminate .progress-bar__indicator{animation:indeterminate 2.5s infinite cubic-bezier(0.37, 0, 0.63, 1)}@keyframes indeterminate{0%{scale:1 1;transform:translateX(-100%) translateZ(0)}75%,100%{scale:1 1;transform:translateX(100%) translateZ(0)}}";
+const ProgressBar = class {
+  constructor(hostRef) {
+    index.registerInstance(this, hostRef);
+    this.value = 0;
+    this.indeterminate = false;
+    this.showPercent = false;
+  }
+  render() {
+    return (index.h("div", { part: "base", class: {
+        'progress-bar': true,
+        'progress-bar--indeterminate': this.indeterminate,
+      }, role: "progressbar", title: this.host.title || undefined, "aria-label": "Progress", "aria-valuemin": "0", "aria-valuemax": "100", "aria-valuenow": this.indeterminate ? null : this.value }, index.h("div", { part: "indicator", class: "progress-bar__indicator", style: {
+        width: !this.indeterminate ? `${this.value}%` : undefined,
+      } }, index.h("span", { part: "label", class: "progress-bar__label" }, index.h("slot", null, !this.indeterminate && this.showPercent ? `${this.value}%` : '')))));
+  }
+  get host() { return index.getElement(this); }
+};
+ProgressBar.style = progressBarCss;
 const tooltipCss = ":host{box-sizing:border-box}*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}:host{--max-width:20rem;--hide-delay:0s;--hide-duration:0.125s;--hide-timing-function:ease;--show-delay:0.125s;--show-duration:0.125s;--show-timing-function:ease;display:contents}.tooltip{max-inline-size:var(--max-width);border-radius:var(--nano-tooltip-border-radius, var(--nano-border-radius-small, 2px));background-color:black;font-size:var(--nano-fontsize-small, 0.875rem);line-height:1.5;color:white;opacity:0;padding:var(--nano-tooltip-padding, var(--nano-spacing-xsmall, 4px) var(--nano-spacing-small, 8px));transform:translateY(10px) translateZ(0);transform-origin:bottom;transition-property:opacity, transform;transition-delay:var(--hide-delay);transition-duration:var(--hide-duration);transition-timing-function:var(--hide-timing-function);white-space:normal}.tooltip-arrow{content:\"\";position:absolute;inline-size:0;block-size:0;color:black;transition:0.2s ease transform}.tooltip-positioner{position:absolute;z-index:var(--nano-layer-index-tooltip, 1000)}.tooltip-positioner[data-popper-placement^=top] .tooltip{transform-origin:bottom;transform:translateY(-10px) translateZ(0)}.tooltip-positioner[data-popper-placement^=bottom] .tooltip{transform-origin:top}.tooltip-positioner[data-popper-placement^=left] .tooltip{transform-origin:right}.tooltip-positioner[data-popper-placement^=right] .tooltip{transform-origin:left}.tooltip-positioner.popover-visible .tooltip{opacity:1;transform:none;transition-delay:var(--show-delay);transition-duration:var(--show-duration);transition-timing-function:var(--show-timing-function)}.tooltip-positioner[data-popper-placement^=bottom] .tooltip-arrow{inset-block-end:100%;inset-inline-start:calc(50% - 5px);border-block-end:5px solid;border-inline-start:5px solid transparent;border-inline-end:5px solid transparent}.tooltip-positioner[data-popper-placement=bottom-start] .tooltip-arrow{inset-inline-start:5px}.tooltip-positioner[data-popper-placement=bottom-end] .tooltip-arrow{inset-inline:auto 5px}.tooltip-positioner[data-popper-placement^=top] .tooltip-arrow{inset-block-start:100%;inset-inline-start:calc(50% - 5px);border-block-start:5px solid;border-inline-start:5px solid transparent;border-inline-end:5px solid transparent}.tooltip-positioner[data-popper-placement=top-start] .tooltip-arrow{inset-inline-start:5px}.tooltip-positioner[data-popper-placement=top-end] .tooltip-arrow{inset-inline:auto 5px}.tooltip-positioner[data-popper-placement^=left] .tooltip-arrow{inset-block-start:calc(50% - 5px);inset-inline-start:100%;border-inline-start:5px solid;border-block-start:5px solid transparent;border-block-end:5px solid transparent}.tooltip-positioner[data-popper-placement=left-start] .tooltip-arrow{inset-block-start:5px}.tooltip-positioner[data-popper-placement=left-end] .tooltip-arrow{inset-block:auto 5px}.tooltip-positioner[data-popper-placement^=right] .tooltip-arrow{inset-block-start:calc(50% - 5px);inset-inline-end:100%;border-inline-end:5px solid;border-block-start:5px solid transparent;border-block-end:5px solid transparent}.tooltip-positioner[data-popper-placement=right-start] .tooltip-arrow{inset-block-start:5px}.tooltip-positioner[data-popper-placement=right-end] .tooltip-arrow{inset-block:auto 5px}";
 let id = 0;
@@ -71,6 +92,7 @@ const Tooltip = class {
     this.distance = 10;
     this.open = false;
     this.skidding = 0;
+    this.hoist = false;
     this.trigger = 'hover focus';
   }
   get target() {
@@ -90,7 +112,7 @@ const Tooltip = class {
   /** Shows the tooltip. */
   async show() {
     // Prevent subsequent calls to the method, whether manually or triggered by the `open` watcher
-    if (this.isVisible) {
+    if (this.isVisible || this.disabled) {
       return;
     }
     const slShow = this.nanoShow.emit();
@@ -133,6 +155,7 @@ const Tooltip = class {
   }
   syncOptions() {
     this.popover.setOptions({
+      strategy: this.hoist ? 'fixed' : 'absolute',
       placement: this.placement,
       distance: this.distance,
       skidding: this.skidding,
@@ -163,10 +186,10 @@ const Tooltip = class {
     this.popover.destroy();
   }
   render() {
-    return (index.h(index.Host, { onKeyDown: this.handleKeyDown, onMouseOver: this.handleMouseOver, onMouseOut: this.handleMouseOut, onBlur: this.handleBlur, onFocus: this.handleFocus, onClick: this.handleClick }, index.h("slot", { onSlotchange: this.handleSlotChange }), !this.disabled && (index.h("div", { ref: (el) => (this.tooltipPositioner = el), class: "tooltip-positioner" }, index.h("div", { part: "base", ref: (el) => (this.tooltip = el), class: {
+    return (index.h(index.Host, { onKeyDown: this.handleKeyDown, onMouseOver: this.handleMouseOver, onMouseOut: this.handleMouseOut, onBlur: this.handleBlur, onFocus: this.handleFocus, onClick: this.handleClick }, index.h("slot", { onSlotchange: this.handleSlotChange }), index.h("div", { ref: (el) => (this.tooltipPositioner = el), class: "tooltip-positioner" }, index.h("div", { part: "base", ref: (el) => (this.tooltip = el), class: {
         tooltip: true,
         'tooltip--open': this.open,
-      }, role: "tooltip", "aria-hidden": this.open ? 'false' : 'true' }, index.h("slot", { name: "content", onSlotchange: this.handleTTSlotChange }, index.h("div", { id: this.componentId }, this.content)), index.h("div", { class: "tooltip-arrow", "data-popper-arrow": true }))))));
+      }, role: "tooltip", "aria-hidden": this.open ? 'false' : 'true' }, index.h("slot", { name: "content", onSlotchange: this.handleTTSlotChange }, index.h("div", { id: this.componentId }, this.content)), index.h("div", { class: "tooltip-arrow", "data-popper-arrow": true })))));
   }
   get host() { return index.getElement(this); }
   static get watchers() { return {
@@ -175,6 +198,7 @@ const Tooltip = class {
 };
 Tooltip.style = tooltipCss;
+exports.nano_progress_bar = ProgressBar;
 exports.nano_tooltip = Tooltip;
-//# sourceMappingURL=nano-tooltip.cjs.entry.js.map
+//# sourceMappingURL=nano-progress-bar_2.cjs.entry.js.map

package/dist/cjs/nano-progress-bar_2.cjs.entry.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"file":"nano-progress-bar.nano-tooltip.entry.cjs.js","mappings":"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","names":["h","Popover","Host"],"sources":["./src/components/progress-bar/progress-bar.scss?tag=nano-progress-bar&encapsulation=shadow","./src/components/progress-bar/progress-bar.tsx","./src/components/tooltip/tooltip.scss?tag=nano-tooltip&encapsulation=shadow","./src/components/tooltip/tooltip.tsx"],"sourcesContent":["@import '../../global/style/nano-theme/components';\n@import '../../global/style/nano-theme/layers';\n\n/**\n * @prop --height: The progress bar's height. Default 1em\n * @prop --track-color: The track color. Default rgba(#{$progress-track-color-rgb}, 1);\n * @prop --indicator-color: The indicator color. Default rgba(#{$progress-indicator-color-rgb}, 1);\n * @prop --label-color: The label color. Default var(--nano-color-white, white);\n */\n:host {\n --height: 1em;\n --track-color: rgba(#{$progress-track-color-rgb}, 1);\n --indicator-color: rgba(#{$progress-indicator-color-rgb}, 1);\n --label-color: var(--nano-color-white, white);\n\n display: block;\n}\n\n.progress-bar {\n position: relative;\n background-color: var(--track-color);\n height: var(--height);\n border-radius: $layer-border-radius;\n overflow: hidden;\n}\n\n.progress-bar__indicator {\n height: 100%;\n font-size: 0.75em;\n background-color: var(--indicator-color);\n color: var(--label-color);\n text-align: center;\n white-space: nowrap;\n overflow: hidden;\n transition: 0.4s width, 0.4s background-color;\n transform: translateZ(0);\n user-select: none;\n transform-origin: left;\n}\n\n// Indeterminate\n.progress-bar--indeterminate .progress-bar__indicator {\n animation: indeterminate 2.5s infinite cubic-bezier(0.37, 0, 0.63, 1);\n}\n\n@keyframes indeterminate {\n 0% {\n scale: 1 1;\n transform: translateX(-100%) translateZ(0);\n }\n\n 75%,\n 100% {\n scale: 1 1;\n transform: translateX(100%) translateZ(0);\n }\n}\n","import { Component, Prop, h, Element } from '@stencil/core';\n\n/**\n * Used to show the status of an ongoing operation.\n *\n * @slot - A label to show inside the indicator.\n *\n * @part base - The component's base wrapper.\n * @part indicator - The progress bar indicator.\n * @part label - The progress bar label.\n */\n\n@Component({\n tag: 'nano-progress-bar',\n styleUrl: 'progress-bar.scss',\n shadow: true,\n})\nexport class ProgressBar {\n @Element() host: HTMLNanoProgressBarElement;\n\n /** The progress bar's percentage, 0 to 100. */\n @Prop() value = 0;\n\n /** When true, percentage is ignored, the label is hidden, and the progress bar is drawn in an indeterminate state. */\n @Prop() indeterminate = false;\n\n /** Whether to show the progress bar's current percent as text. Will be overwritten if you use the default slot. */\n @Prop() showPercent = false;\n\n render() {\n return (\n <div\n part=\"base\"\n class={{\n 'progress-bar': true,\n 'progress-bar--indeterminate': this.indeterminate,\n }}\n role=\"progressbar\"\n title={this.host.title || undefined}\n aria-label=\"Progress\"\n aria-valuemin=\"0\"\n aria-valuemax=\"100\"\n aria-valuenow={this.indeterminate ? null : this.value}\n >\n <div\n part=\"indicator\"\n class=\"progress-bar__indicator\"\n style={{\n width: !this.indeterminate ? `${this.value}%` : undefined,\n }}\n >\n <span part=\"label\" class=\"progress-bar__label\">\n <slot>\n {!this.indeterminate && this.showPercent ? `${this.value}%` : ''}\n </slot>\n </span>\n </div>\n </div>\n );\n }\n}\n","@import '../../global/style/nano-theme/components';\n@import '../../global/style/nano-theme/layers';\n\n/**\n * @prop --hide-delay: The amount of time to wait before hiding the tooltip.\n * @prop --hide-duration: The amount of time the hide transition takes to complete.\n * @prop --hide-timing-function: The timing function (easing) to use for the hide transition.\n * @prop --max-width: The maximum width of the tooltip.\n * @prop --show-delay: The amount of time to wait before showing the tooltip.\n * @prop --show-duration: The amount of time the show transition takes to complete.\n * @prop --show-timing-function: The timing function (easing) to use for the show transition.\n */\n:host {\n --max-width: 20rem;\n --hide-delay: 0s;\n --hide-duration: 0.125s;\n --hide-timing-function: ease;\n --show-delay: 0.125s;\n --show-duration: 0.125s;\n --show-timing-function: ease;\n\n /* autoprefixer: ignore next */\n display: contents;\n}\n\n.tooltip {\n $self: &;\n\n max-inline-size: var(--max-width);\n border-radius: #{$tooltip-border-radius};\n background-color: black;\n font-size: #{$tooltip-fontsize};\n line-height: 1.5;\n color: white;\n opacity: 0;\n padding: #{$tooltip-padding};\n transform: translateY(10px) translateZ(0);\n transform-origin: bottom;\n transition-property: opacity, transform;\n transition-delay: var(--hide-delay);\n transition-duration: var(--hide-duration);\n transition-timing-function: var(--hide-timing-function);\n white-space: normal;\n\n &-arrow {\n content: '';\n position: absolute;\n inline-size: 0;\n block-size: 0;\n color: black;\n transition: 0.2s ease transform;\n }\n\n &-positioner {\n position: absolute;\n z-index: #{$layer-index-tooltip};\n\n &[data-popper-placement^='top'] #{$self} {\n transform-origin: bottom;\n transform: translateY(-10px) translateZ(0);\n }\n\n &[data-popper-placement^='bottom'] #{$self} {\n transform-origin: top;\n }\n\n &[data-popper-placement^='left'] #{$self} {\n transform-origin: right;\n }\n\n &[data-popper-placement^='right'] #{$self} {\n transform-origin: left;\n }\n\n &.popover-visible #{$self} {\n opacity: 1;\n transform: none;\n transition-delay: var(--show-delay);\n transition-duration: var(--show-duration);\n transition-timing-function: var(--show-timing-function);\n }\n\n // Arrow + bottom\n &[data-popper-placement^='bottom'] #{$self}-arrow {\n inset-block-end: 100%;\n inset-inline-start: calc(50% - #{$tooltip-arrow-size});\n border-block-end: #{$tooltip-arrow-size} solid;\n border-inline-start: #{$tooltip-arrow-size} solid transparent;\n border-inline-end: #{$tooltip-arrow-size} solid transparent;\n }\n\n &[data-popper-placement='bottom-start'] #{$self}-arrow {\n inset-inline-start: #{$tooltip-arrow-offset};\n }\n\n &[data-popper-placement='bottom-end'] #{$self}-arrow {\n inset-inline: auto #{$tooltip-arrow-offset};\n }\n\n // Arrow + top\n &[data-popper-placement^='top'] #{$self}-arrow {\n inset-block-start: 100%;\n inset-inline-start: calc(50% - #{$tooltip-arrow-size});\n border-block-start: #{$tooltip-arrow-size} solid;\n border-inline-start: #{$tooltip-arrow-size} solid transparent;\n border-inline-end: #{$tooltip-arrow-size} solid transparent;\n }\n\n &[data-popper-placement='top-start'] #{$self}-arrow {\n inset-inline-start: #{$tooltip-arrow-offset};\n }\n\n &[data-popper-placement='top-end'] #{$self}-arrow {\n inset-inline: auto #{$tooltip-arrow-offset};\n }\n\n // Arrow + left\n &[data-popper-placement^='left'] #{$self}-arrow {\n inset-block-start: calc(50% - #{$tooltip-arrow-size});\n inset-inline-start: 100%;\n border-inline-start: #{$tooltip-arrow-size} solid;\n border-block-start: #{$tooltip-arrow-size} solid transparent;\n border-block-end: #{$tooltip-arrow-size} solid transparent;\n }\n\n &[data-popper-placement='left-start'] #{$self}-arrow {\n inset-block-start: #{$tooltip-arrow-offset};\n }\n\n &[data-popper-placement='left-end'] #{$self}-arrow {\n inset-block: auto #{$tooltip-arrow-offset};\n }\n\n // Arrow + right\n &[data-popper-placement^='right'] #{$self}-arrow {\n inset-block-start: calc(50% - #{$tooltip-arrow-size});\n inset-inline-end: 100%;\n border-inline-end: #{$tooltip-arrow-size} solid;\n border-block-start: #{$tooltip-arrow-size} solid transparent;\n border-block-end: #{$tooltip-arrow-size} solid transparent;\n }\n\n &[data-popper-placement='right-start'] #{$self}-arrow {\n inset-block-start: #{$tooltip-arrow-offset};\n }\n\n &[data-popper-placement='right-end'] #{$self}-arrow {\n inset-block: auto #{$tooltip-arrow-offset};\n }\n }\n}\n","import {\n Component,\n Element,\n Event,\n EventEmitter,\n Host,\n Method,\n Prop,\n Watch,\n h,\n} from '@stencil/core';\nimport Popover from '../../utils/popover';\n\nlet id = 0;\n\n/**\n * Tooltips display additional information based on a specific action.\n * @slot - The tooltip's target element. Only the first element will be used as the target.\n * @slot content - The tooltip's content. Alternatively, you can use the content prop.\n */\n@Component({\n tag: 'nano-tooltip',\n styleUrl: 'tooltip.scss',\n shadow: true,\n})\nexport class Tooltip {\n private componentId = `tooltip-${++id}`;\n private isVisible = false;\n private popover: Popover;\n private tooltipPositioner: HTMLElement;\n private tooltip: any;\n\n private _target: HTMLElement;\n private get target() {\n return this._target;\n }\n private set target(newTarget) {\n if (newTarget !== this._target && this._target) {\n this._target.removeAttribute('aria-describedby');\n }\n newTarget.setAttribute('aria-describedby', this.componentId);\n this._target = newTarget;\n }\n\n @Element() host: HTMLNanoTooltipElement;\n\n /** The tooltip's content. Alternatively, you can use the content slot. */\n @Prop() content = '';\n\n /**\n * The preferred placement of the tooltip. Note that the actual placement may vary as needed to keep the tooltip\n * inside of the viewport.\n */\n @Prop() placement:\n | 'top'\n | 'top-start'\n | 'top-end'\n | 'right'\n | 'right-start'\n | 'right-end'\n | 'bottom'\n | 'bottom-start'\n | 'bottom-end'\n | 'left'\n | 'left-start'\n | 'left-end' = 'top';\n\n /** Set to true to disable the tooltip so it won't show when triggered. */\n @Prop() disabled = false;\n\n /** The distance in pixels from which to offset the tooltip away from its target. */\n @Prop() distance = 10;\n\n /** Indicates whether or not the tooltip is open. You can use this in lieu of the show/hide methods. */\n @Prop({ mutable: true, reflect: true }) open = false;\n\n /** The distance in pixels from which to offset the tooltip along its target. */\n @Prop() skidding = 0;\n\n /**\n * Enable this option to prevent the panel from being clipped when the component is placed inside a container with\n * `overflow: auto|scroll`.\n */\n @Prop() hoist = false;\n\n /**\n * Controls how the tooltip is activated. Possible options include `click`, `hover`, `focus`, and `manual`. Multiple\n * options can be passed by separating them with a space. When manual is used, the tooltip must be activated\n * programmatically.\n */\n @Prop() trigger: string = 'hover focus';\n\n @Watch('open')\n handleOpenChange() {\n this.open ? this.show() : this.hide();\n }\n\n // Events\n\n /** Emitted when the tooltip begins to show. Calling `event.preventDefault()` will prevent it from being shown. */\n @Event() nanoShow: EventEmitter;\n\n /** Emitted after the tooltip has shown and all transitions are complete. */\n @Event() nanoAfterShow: EventEmitter;\n\n /** Emitted when the tooltip begins to hide. Calling `event.preventDefault()` will prevent it from being hidden. */\n @Event() nanoHide: EventEmitter;\n\n /** Emitted after the tooltip has hidden and all transitions are complete. */\n @Event() nanoAfterHide: EventEmitter;\n\n // Public methods\n\n /** Shows the tooltip. */\n @Method()\n async show() {\n // Prevent subsequent calls to the method, whether manually or triggered by the `open` watcher\n if (this.isVisible || this.disabled) {\n return;\n }\n const slShow = this.nanoShow.emit();\n if (slShow.defaultPrevented) {\n this.open = false;\n return;\n }\n\n this.isVisible = true;\n this.open = true;\n this.popover.show();\n }\n\n /** Hides the tooltip. */\n @Method()\n async hide() {\n // Prevent subsequent calls to the method, whether manually or triggered by the `open` watcher\n if (!this.isVisible) {\n return;\n }\n\n const slHide = this.nanoHide.emit();\n if (slHide.defaultPrevented) {\n this.open = true;\n return;\n }\n\n this.isVisible = false;\n this.open = false;\n this.popover.hide();\n }\n\n // Private methods\n\n private getTarget() {\n // Get the first child that isn't a <style> or content slot\n const target = [...Array.from(this.host.children)].find(\n (el) =>\n el.tagName.toLowerCase() !== 'style' &&\n el.getAttribute('slot') !== 'content'\n ) as HTMLElement;\n\n if (!target) {\n throw new Error('Invalid tooltip target: no child element was found.');\n }\n\n return target;\n }\n\n private hasTrigger(triggerType: string) {\n const triggers = this.trigger.split(' ');\n return triggers.includes(triggerType);\n }\n\n private syncOptions() {\n this.popover.setOptions({\n strategy: this.hoist ? 'fixed' : 'absolute',\n placement: this.placement,\n distance: this.distance,\n skidding: this.skidding,\n transitionElement: this.tooltip,\n onAfterHide: () => this.nanoAfterHide.emit(),\n onAfterShow: () => this.nanoAfterShow.emit(),\n });\n }\n\n // Event Handlers\n\n private handleBlur = () => {\n if (this.hasTrigger('focus')) {\n this.hide();\n }\n };\n\n private handleClick = () => {\n if (this.hasTrigger('click')) {\n this.open ? this.hide() : this.show();\n }\n };\n\n private handleFocus = () => {\n if (this.hasTrigger('focus')) {\n this.show();\n }\n };\n\n private handleKeyDown = (event: KeyboardEvent) => {\n // Pressing escape when the target element has focus should dismiss the tooltip\n if (this.open && event.key === 'Escape') {\n event.stopPropagation();\n this.hide();\n }\n };\n\n private handleMouseOver = () => {\n if (this.hasTrigger('hover')) {\n this.show();\n }\n };\n\n private handleMouseOut = () => {\n if (this.hasTrigger('hover')) {\n this.hide();\n }\n };\n\n private handleSlotChange = () => {\n this.target = this.getTarget();\n };\n\n private handleTTSlotChange = () => {\n const contentDiv =\n this.host.querySelector(`[id=\"${this.componentId}\"]`) ||\n this.host.shadowRoot.getElementById(this.componentId);\n\n Array.from(this.host.querySelectorAll('[slot=\"content\"]'))\n .filter((elm) => elm !== contentDiv)\n .forEach((elm) => {\n contentDiv.appendChild(elm);\n });\n };\n\n // Stencil hooks\n\n componentDidLoad() {\n this.target = this.getTarget();\n this.popover = new Popover(this.target, this.tooltipPositioner);\n this.syncOptions();\n\n const ele = this.host.shadowRoot.getElementById(this.componentId);\n ele.slot = 'content';\n this.host.appendChild(ele);\n this.handleTTSlotChange();\n\n // Show on init if open\n this.tooltipPositioner.hidden = !this.open;\n if (this.open) {\n this.show();\n }\n }\n\n componentDidUpdate() {\n this.syncOptions();\n }\n\n disconnectedCallback() {\n this.popover.destroy();\n }\n\n render() {\n return (\n <Host\n onKeyDown={this.handleKeyDown}\n onMouseOver={this.handleMouseOver}\n onMouseOut={this.handleMouseOut}\n onBlur={this.handleBlur}\n onFocus={this.handleFocus}\n onClick={this.handleClick}\n >\n <slot onSlotchange={this.handleSlotChange} />\n <div\n ref={(el) => (this.tooltipPositioner = el)}\n class=\"tooltip-positioner\"\n >\n <div\n part=\"base\"\n ref={(el) => (this.tooltip = el)}\n class={{\n tooltip: true,\n 'tooltip--open': this.open,\n }}\n role=\"tooltip\"\n aria-hidden={this.open ? 'false' : 'true'}\n >\n <slot name=\"content\" onSlotchange={this.handleTTSlotChange}>\n <div id={this.componentId}>{this.content}</div>\n </slot>\n <div class=\"tooltip-arrow\" data-popper-arrow></div>\n </div>\n </div>\n </Host>\n );\n }\n}\n"],"version":3}

package/dist/cjs/nano-resize-observe_2.cjs.entry.js CHANGED Viewed

@@ -12,10 +12,14 @@ const ResizeObserve = class {
     index.registerInstance(this, hostRef);
     this.nanoResizeStateChange = index.createEvent(this, "nanoResizeStateChange", 7);
     this.nanoResizeObserverReady = index.createEvent(this, "nanoResizeObserverReady", 7);
+    this.nanoResizeContentFitChange = index.createEvent(this, "nanoResizeContentFitChange", 7);
     this.isReady = false;
     this.assessChanges = () => {
       if (!this.currentWidth && !this.currentHeight)
         return;
+      index.readTask(() => this.assesContentFit());
+      if (!this.states || !this.appliedStates)
+        return;
       const changedStates = { h: new Map(), w: new Map() };
       let hasChanged = false;
       Object.keys(this.appliedStates).forEach((dimType) => {
@@ -45,6 +49,9 @@ const ResizeObserve = class {
     this.currentWidth = undefined;
     this.currentHeight = undefined;
     this.classNames = [];
+    this.contentFitX = null;
+    this.contentFitY = null;
+    this.notifyContentFit = undefined;
     this.states = undefined;
   }
   classNameChange() {
@@ -60,8 +67,6 @@ const ResizeObserve = class {
   statesChanged() {
     if (!this.states)
       return;
-    if (!this.ro)
-      this.attachRO();
     const toBpDir = (bpDir) => {
       const bpDirSpl = bpDir.split(/(\d+)/).filter((bs) => bs.length);
       return { bp: parseInt(bpDirSpl[0]), dir: bpDirSpl[1] };
@@ -84,7 +89,59 @@ const ResizeObserve = class {
       }
     });
   }
+  assesContentFit() {
+    if (!this.notifyContentFit)
+      return;
+    const findNonContentsEle = (ele) => {
+      if (window.getComputedStyle(ele).display !== 'contents')
+        return ele;
+      const recurse = (e) => {
+        return Array.from(e.children).find((cEle) => {
+          if (window.getComputedStyle(cEle).display !== 'contents')
+            return cEle;
+          recurse(cEle);
+        });
+      };
+      return recurse(ele);
+    };
+    let didChange = false;
+    const measureEle = findNonContentsEle(this.host.firstElementChild);
+    if (measureEle) {
+      if (this.notifyContentFit?.includes('x')) {
+        if (this.currentWidth < measureEle.scrollWidth &&
+          this.contentFitX !== false) {
+          didChange = true;
+          this.contentFitX = false;
+        }
+        else if (this.currentWidth >= measureEle.scrollWidth &&
+          this.contentFitX !== true) {
+          didChange = true;
+          this.contentFitX = true;
+        }
+      }
+      if (this.notifyContentFit?.includes('y')) {
+        if (this.currentHeight < measureEle.scrollHeight &&
+          this.contentFitY !== false) {
+          didChange = true;
+          this.contentFitY = false;
+        }
+        else if (this.currentHeight >= measureEle.scrollHeight &&
+          this.contentFitY !== true) {
+          didChange = true;
+          this.contentFitY = true;
+        }
+      }
+      if (didChange) {
+        this.nanoResizeContentFitChange.emit({
+          x: this.contentFitX,
+          y: this.contentFitY,
+        });
+      }
+    }
+  }
   applyChanges(changes) {
+    if (!this.states)
+      return;
     let classNames = [...this.classNames];
     Object.keys(changes).forEach((dimType) => {
       changes[dimType].forEach((state) => {
@@ -115,35 +172,40 @@ const ResizeObserve = class {
     return retObj;
   }
   attachRO() {
-    this.ro = new ResizeObserver((entries) => {
-      for (const entry of entries) {
-        this.currentWidth = entry.contentRect.width;
-        this.currentHeight = entry.contentRect.height;
-      }
+    this.ro = new ResizeObserver(() => {
+      const { width, height } = this.host.getBoundingClientRect();
+      this.currentWidth = Math.ceil(width);
+      this.currentHeight = Math.ceil(height);
     });
     this.ro.observe(this.host);
   }
   componentWillLoad() {
     this.classNames = Array.from(this.host.classList);
-    if (!this.states)
-      return;
     if (!this.currentWidth || !this.currentHeight) {
       index.readTask(() => {
         const { width, height } = this.host.getBoundingClientRect();
-        this.currentWidth = width;
-        this.currentHeight = height;
+        this.currentWidth = Math.ceil(width);
+        this.currentHeight = Math.ceil(height);
       });
     }
     this.statesChanged();
     // set all class as 'not-' by deafult
     this.applyChanges(this.appliedStates);
   }
+  connectedCallback() {
+    if (!this.ro)
+      this.attachRO();
+  }
   disconnectedCallback() {
     if (this.ro)
       this.ro.disconnect();
   }
   render() {
-    return (index.h(index.Host, null, index.h("slot", null)));
+    return (index.h(index.Host, null, index.h("slot", null), !!this.notifyContentFit &&
+      (this.contentFitX !== null || this.contentFitY !== null) && [
+      !!this.contentFitX ? (index.h("slot", { name: "content-fit-x" })) : (index.h("slot", { name: "content-nofit-x" })),
+      !!this.contentFitY ? (index.h("slot", { name: "content-fit-y" })) : (index.h("slot", { name: "content-nofit-y" })),
+    ]));
   }
   get host() { return index.getElement(this); }
   static get watchers() { return {

package/dist/cjs/nano-resize-observe_2.cjs.entry.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"nano-resize-observe.nano-skeleton.entry.cjs.js","mappings":";;;;;;;;;MA+Ba,aAAa;;;;;IAGhB,YAAO,GAAG,KAAK,CAAC;IA4DhB,kBAAa,GAAG;MACtB,IAAI,CAAC,IAAI,CAAC,YAAY,IAAI,CAAC,IAAI,CAAC,aAAa;QAAE,OAAO;MACtD,MAAM,aAAa,GAAc,EAAE,CAAC,EAAE,IAAI,GAAG,EAAE,EAAE,CAAC,EAAE,IAAI,GAAG,EAAE,EAAE,CAAC;MAChE,IAAI,UAAU,GAAG,KAAK,CAAC;MAEvB,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC,OAAO,CAAC,CAAC,OAAO;QAC9C,IAAI,GAAW,CAAC;QAChB,IAAI,OAAO,KAAK,GAAG;UAAE,GAAG,GAAG,IAAI,CAAC,aAAa,CAAC;;UACzC,GAAG,GAAG,IAAI,CAAC,YAAY,CAAC;QAE7B,IAAI,CAAC,aAAa,CAAC,OAAO,CAAC,CAAC,OAAO,CACjC,CAAC,KAA0B,EAAE,EAAU;UACrC,IAAI,GAAG,IAAI,EAAE,IAAI,KAAK,CAAC,OAAO,KAAK,KAAK,EAAE;YACxC,KAAK,CAAC,OAAO,GAAG,IAAI,CAAC;YACrB,aAAa,CAAC,OAAO,CAAC,CAAC,GAAG,CAAC,EAAE,EAAE,KAAK,CAAC,CAAC;YACtC,UAAU,GAAG,IAAI,CAAC;WACnB;eAAM,IAAI,GAAG,GAAG,EAAE,IAAI,KAAK,CAAC,OAAO,KAAK,IAAI,EAAE;YAC7C,KAAK,CAAC,OAAO,GAAG,KAAK,CAAC;YACtB,aAAa,CAAC,OAAO,CAAC,CAAC,GAAG,CAAC,EAAE,EAAE,KAAK,CAAC,CAAC;YACtC,UAAU,GAAG,IAAI,CAAC;WACnB;SACF,CACF,CAAC;OACH,CAAC,CAAC;MACH,IAAI,UAAU;QAAE,IAAI,CAAC,YAAY,CAAC,aAAa,CAAC,CAAC;WAC5C,IAAI,CAAC,IAAI,CAAC,UAAU,CAAC,QAAQ,CAAC,UAAU,CAAC;QAC5C,IAAI,CAAC,UAAU,GAAG,CAAC,UAAU,CAAC,CAAC;KAClC,CAAC;;;sBAlF8B,EAAE;;;EAGlC,eAAe;IACb,IAAI,CAAC,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;IAChD,IAAI,CAAC,IAAI,CAAC,OAAO,IAAI,IAAI,CAAC,UAAU,CAAC,QAAQ,CAAC,UAAU,CAAC,EAAE;MACzD,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC;MACpB,IAAI,CAAC,uBAAuB,CAAC,IAAI,EAAE,CAAC;KACrC;GACF;EAcD,gBAAgB;IACd,IAAI,CAAC,aAAa,EAAE,CAAC;GACtB;EAGD,aAAa;IACX,IAAI,CAAC,IAAI,CAAC,MAAM;MAAE,OAAO;IACzB,IAAI,CAAC,IAAI,CAAC,EAAE;MAAE,IAAI,CAAC,QAAQ,EAAE,CAAC;IAE9B,MAAM,OAAO,GAAG,CAAC,KAAa;MAC5B,MAAM,QAAQ,GAAG,KAAK,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC,MAAM,CAAC,CAAC,EAAE,KAAK,EAAE,CAAC,MAAM,CAAC,CAAC;MAChE,OAAO,EAAE,EAAE,EAAE,QAAQ,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,EAAE,GAAG,EAAE,QAAQ,CAAC,CAAC,CAAC,EAAE,CAAC;KACxD,CAAC;IACF,IAAI,CAAC,aAAa,GAAG,EAAE,CAAC,EAAE,IAAI,GAAG,EAAE,EAAE,CAAC,EAAE,IAAI,GAAG,EAAE,EAAE,CAAC;;IAGpD,IAAI,CAAC,MAAM,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,GAAG,CAAC,CAAC,EAAE;MAC5B,EAAE,GAAG,EAAE,CAAC,IAAI,EAAE,CAAC;MACf,IAAI,EAAE,CAAC,QAAQ,CAAC,GAAG,CAAC,EAAE;QACpB,MAAM,CAAC,GAAG,EAAE,GAAG,OAAO,CAAC,GAAG,EAAE,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;QACxC,MAAM,EAAE,EAAE,EAAE,GAAG,EAAE,GAAG,OAAO,CAAC,GAAG,CAAC,CAAC;QACjC,IAAI,CAAC,aAAa,CAAC,GAAsB,CAAC,CAAC,GAAG,CAAC,EAAE,EAAE;UACjD,MAAM,EAAE,OAAO;UACf,OAAO,EAAE,KAAK;SACf,CAAC,CAAC;OACJ;WAAM;QACL,MAAM,EAAE,EAAE,EAAE,GAAG,EAAE,GAAG,OAAO,CAAC,EAAE,CAAC,CAAC;QAChC,IAAI,CAAC,aAAa,CAAC,GAAsB,CAAC,CAAC,GAAG,CAAC,EAAE,EAAE,EAAE,OAAO,EAAE,KAAK,EAAE,CAAC,CAAC;OACxE;KACF,CAAC,CAAC;GACJ;EA+BO,YAAY,CAAC,OAAkB;IACrC,IAAI,UAAU,GAAG,CAAC,GAAG,IAAI,CAAC,UAAU,CAAC,CAAC;IACtC,MAAM,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC,OAAO,CAAC,CAAC,OAAwB;MACpD,OAAO,CAAC,OAAO,CAAC,CAAC,OAAO,CAAC,CAAC,KAAK;QAC7B,IAAI,CAAC,KAAK,CAAC,MAAM;UAAE,OAAO;QAC1B,KAAK,CAAC,MAAM,CAAC,GAAG,CAAC,CAAC,EAAE;UAClB,IAAI,KAAK,CAAC,OAAO,EAAE;YACjB,UAAU,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;YACpB,UAAU,GAAG,UAAU,CAAC,MAAM,CAAC,CAAC,EAAE,KAAK,EAAE,KAAK,MAAM,GAAG,EAAE,CAAC,CAAC;WAC5D;eAAM;YACL,UAAU,CAAC,IAAI,CAAC,MAAM,GAAG,EAAE,CAAC,CAAC;YAC7B,UAAU,GAAG,UAAU,CAAC,MAAM,CAAC,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,CAAC,CAAC;WACnD;SACF,CAAC,CAAC;OACJ,CAAC,CAAC;KACJ,CAAC,CAAC;IACH,IAAI,CAAC,UAAU,GAAG,CAAC,UAAU,EAAE,GAAG,UAAU,CAAC,CAAC;IAC9C,IAAI,CAAC,qBAAqB,CAAC,IAAI,CAAC,IAAI,CAAC,WAAW,CAAC,OAAO,CAAC,CAAC,CAAC;GAC5D;EAEO,WAAW,CAAC,SAAoB;IACtC,MAAM,MAAM,GAAG,EAAE,CAAC;IAClB,MAAM,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC,OAAO,CAAC,CAAC,OAAwB;MACtD,SAAS,CAAC,OAAO,CAAC,CAAC,OAAO,CAAC,CAAC,KAA0B,EAAE,EAAU;QAChE,MAAM,CAAC,EAAE,GAAG,OAAO,CAAC,GAAG,KAAK,CAAC,OAAO,CAAC;OACtC,CAAC,CAAC;KACJ,CAAC,CAAC;IACH,OAAO,MAAM,CAAC;GACf;EAEO,QAAQ;IACd,IAAI,CAAC,EAAE,GAAG,IAAI,cAAc,CAAC,CAAC,OAAO;MACnC,KAAK,MAAM,KAAK,IAAI,OAAO,EAAE;QAC3B,IAAI,CAAC,YAAY,GAAG,KAAK,CAAC,WAAW,CAAC,KAAK,CAAC;QAC5C,IAAI,CAAC,aAAa,GAAG,KAAK,CAAC,WAAW,CAAC,MAAM,CAAC;OAC/C;KACF,CAAC,CAAC;IACH,IAAI,CAAC,EAAE,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;GAC5B;EAED,iBAAiB;IACf,IAAI,CAAC,UAAU,GAAG,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC;IAClD,IAAI,CAAC,IAAI,CAAC,MAAM;MAAE,OAAO;IAEzB,IAAI,CAAC,IAAI,CAAC,YAAY,IAAI,CAAC,IAAI,CAAC,aAAa,EAAE;MAC7CA,cAAQ,CAAC;QACP,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,GAAG,IAAI,CAAC,IAAI,CAAC,qBAAqB,EAAE,CAAC;QAC5D,IAAI,CAAC,YAAY,GAAG,KAAK,CAAC;QAC1B,IAAI,CAAC,aAAa,GAAG,MAAM,CAAC;OAC7B,CAAC,CAAC;KACJ;IACD,IAAI,CAAC,aAAa,EAAE,CAAC;;IAErB,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC;GACvC;EAED,oBAAoB;IAClB,IAAI,IAAI,CAAC,EAAE;MAAE,IAAI,CAAC,EAAE,CAAC,UAAU,EAAE,CAAC;GACnC;EAED,MAAM;IACJ,QACEC,QAACC,UAAI,QACHD,qBAAQ,CACH,EACP;GACH;;;;;;;;;;;AC7LH,MAAM,WAAW,GAAG,82BAA82B;;MCYr3B,QAAQ;;;oBAEA,IAAI;;EAEvB,MAAM;IACJ,QACEA,iBACE,KAAK,EAAE;QACL,QAAQ,EAAE,IAAI;QACd,OAAO,EAAE,IAAI,CAAC,QAAQ;OACvB,IAEDA,iBAAK,KAAK,EAAC,qBAAqB,aAAa,CACzC,EACN;GACH;;;;;;;","names":["readTask","h","Host"],"sources":["./src/components/resize-observe/resize-observe.tsx","./src/components/skeleton/skeleton.scss?tag=nano-skeleton&encapsulation=shadow","./src/components/skeleton/skeleton.tsx"],"sourcesContent":["import {\n Component,\n h,\n Prop,\n Element,\n Host,\n State,\n Watch,\n ComponentInterface,\n Event,\n EventEmitter,\n readTask,\n} from '@stencil/core';\n// import { debounce } from '../../utils/throttle';\nimport type { ResizeStateChangeEventDetail } from '../../interface';\n\ntype ResizeObserverState = { states?: string[]; applied?: boolean };\ninterface StateMaps {\n h: Map<number, ResizeObserverState>;\n w: Map<number, ResizeObserverState>;\n}\n\n/*\n A Resize-Observer utility component.\n * Takes a string list of sizes and optional class-names. Adds class-names and fires `nanoResizeStateChange` events when the component reaches those sizes.\n * @slot - Main slot for any content.\n /\n@Component({\n tag: 'nano-resize-observe',\n styles: `nano-resize-observe { display: block }`,\n})\nexport class ResizeObserve implements ComponentInterface {\n private ro: ResizeObserver;\n private appliedStates: StateMaps;\n private isReady = false;\n\n @Element() host: HTMLNanoResizeObserveElement;\n @State() currentWidth: number;\n @State() currentHeight: number;\n @State() classNames: string[] = [];\n\n @Watch('classNames')\n classNameChange() {\n this.host.className = this.classNames.join(' ');\n if (!this.isReady && this.classNames.includes('is-ready')) {\n this.isReady = true;\n this.nanoResizeObserverReady.emit();\n }\n }\n\n /* string list of sizes and optional class-names. Adds class-names and fires nanoResizeStateChange events. Upon hitting breakpoints.\n * Format: `states=\"800w, 300h class1 class2\"` /\n @Prop() states: string;\n\n /* A resize break point is switched on or off /\n @Event() nanoResizeStateChange!: EventEmitter<ResizeStateChangeEventDetail>;\n\n /* Fires after the initial loading and assessment /\n @Event() nanoResizeObserverReady!: EventEmitter<void>;\n\n @Watch('currentHeight')\n @Watch('currentWidth')\n dimensionChanged() {\n this.assessChanges();\n }\n\n @Watch('states')\n statesChanged() {\n if (!this.states) return;\n if (!this.ro) this.attachRO();\n\n const toBpDir = (bpDir: string) => {\n const bpDirSpl = bpDir.split(/(\\d+)/).filter((bs) => bs.length);\n return { bp: parseInt(bpDirSpl[0]), dir: bpDirSpl[1] };\n };\n this.appliedStates = { h: new Map(), w: new Map() };\n\n // parse state string\n this.states.split(',').map((st) => {\n st = st.trim();\n if (st.includes(' ')) {\n const [key, ...classes] = st.split(' ');\n const { bp, dir } = toBpDir(key);\n this.appliedStates[dir as keyof StateMaps].set(bp, {\n states: classes,\n applied: false,\n });\n } else {\n const { bp, dir } = toBpDir(st);\n this.appliedStates[dir as keyof StateMaps].set(bp, { applied: false });\n }\n });\n }\n\n private assessChanges = () => {\n if (!this.currentWidth && !this.currentHeight) return;\n const changedStates: StateMaps = { h: new Map(), w: new Map() };\n let hasChanged = false;\n\n Object.keys(this.appliedStates).forEach((dimType) => {\n let dim: number;\n if (dimType === 'h') dim = this.currentHeight;\n else dim = this.currentWidth;\n\n this.appliedStates[dimType].forEach(\n (state: ResizeObserverState, bp: number) => {\n if (dim >= bp && state.applied === false) {\n state.applied = true;\n changedStates[dimType].set(bp, state);\n hasChanged = true;\n } else if (dim < bp && state.applied === true) {\n state.applied = false;\n changedStates[dimType].set(bp, state);\n hasChanged = true;\n }\n }\n );\n });\n if (hasChanged) this.applyChanges(changedStates);\n else if (!this.classNames.includes('is-ready'))\n this.classNames = ['is-ready'];\n };\n\n private applyChanges(changes: StateMaps) {\n let classNames = [...this.classNames];\n Object.keys(changes).forEach((dimType: keyof StateMaps) => {\n changes[dimType].forEach((state) => {\n if (!state.states) return;\n state.states.map((st) => {\n if (state.applied) {\n classNames.push(st);\n classNames = classNames.filter((cl) => cl !== 'not-' + st);\n } else {\n classNames.push('not-' + st);\n classNames = classNames.filter((cl) => cl !== st);\n }\n });\n });\n });\n this.classNames = ['is-ready', ...classNames];\n this.nanoResizeStateChange.emit(this.toSimpleObj(changes));\n }\n\n private toSimpleObj(stateMaps: StateMaps) {\n const retObj = {};\n Object.keys(stateMaps).forEach((dimType: keyof StateMaps) => {\n stateMaps[dimType].forEach((state: ResizeObserverState, bp: number) => {\n retObj[bp + dimType] = state.applied;\n });\n });\n return retObj;\n }\n\n private attachRO() {\n this.ro = new ResizeObserver((entries) => {\n for (const entry of entries) {\n this.currentWidth = entry.contentRect.width;\n this.currentHeight = entry.contentRect.height;\n }\n });\n this.ro.observe(this.host);\n }\n\n componentWillLoad() {\n this.classNames = Array.from(this.host.classList);\n if (!this.states) return;\n\n if (!this.currentWidth \|\| !this.currentHeight) {\n readTask(() => {\n const { width, height } = this.host.getBoundingClientRect();\n this.currentWidth = width;\n this.currentHeight = height;\n });\n }\n this.statesChanged();\n // set all class as 'not-' by deafult\n this.applyChanges(this.appliedStates);\n }\n\n disconnectedCallback() {\n if (this.ro) this.ro.disconnect();\n }\n\n render() {\n return (\n <Host>\n <slot />\n </Host>\n );\n }\n}\n","@import '../../global/style/nano-theme/components';\n\n:host {\n /\n @prop --base-color-rgb: default #{$skeleton-color-rgb};\n * @prop --color: default var(--nano-skeleton-color, rgba(var(--base-color-rgb), 1));\n * @prop --tint: default var(--nano-skeleton-tint, rgba(var(--base-color-rgb), .3));\n /\n\n --base-color-rgb: #{$skeleton-color-rgb};\n --color: var(--nano-skeleton-color, rgba(var(--base-color-rgb), 1));\n --tint: var(--nano-skeleton-tint, rgba(var(--base-color-rgb), 0.5));\n\n display: block;\n position: relative;\n border-radius: 0.25rem;\n min-block-size: 1em;\n line-height: inherit;\n}\n\n.skeleton {\n display: flex;\n min-inline-size: 100%;\n min-block-size: 100%;\n border-radius: inherit;\n line-height: inherit;\n}\n\n.skeleton__indicator {\n flex: 1 1 auto;\n background: var(--color);\n border-radius: inherit;\n line-height: inherit;\n}\n\n.skeleton.animate .skeleton__indicator {\n background:\n linear-gradient(\n 270deg,\n var(--tint),\n var(--color),\n var(--color),\n var(--tint)\n );\n background-size: 400% 100%;\n animation: loader 6s ease-in-out infinite;\n}\n\n@keyframes loader {\n 0% {\n background-position: 200% 0;\n }\n\n to {\n background-position: -200% 0;\n }\n}\n","import { Component, Prop, h, ComponentInterface } from '@stencil/core';\n\n/\n Skeletons are used to show where content will eventually be drawn.\n * Simple containers for scaffolding layouts that mimic what users will see when content has finished loading.\n * Prevents large areas of empty space during asynchronous operations.\n /\n@Component({\n tag: 'nano-skeleton',\n styleUrl: 'skeleton.scss',\n shadow: true,\n})\nexport class Skeleton implements ComponentInterface {\n /* When `true`, the skeleton will animate. */\n @Prop() animated = true;\n\n render() {\n return (\n <div\n class={{\n skeleton: true,\n animate: this.animated,\n }}\n >\n <div class=\"skeleton__indicator\"> </div>\n </div>\n );\n }\n}\n"],"version":3}
1	+ {"file":"nano-resize-observe.nano-skeleton.entry.cjs.js","mappings":"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","names":["readTask","h","Host"],"sources":["./src/components/resize-observe/resize-observe.tsx","./src/components/skeleton/skeleton.scss?tag=nano-skeleton&encapsulation=shadow","./src/components/skeleton/skeleton.tsx"],"sourcesContent":["import {\n Component,\n h,\n Prop,\n Element,\n Host,\n State,\n Watch,\n ComponentInterface,\n Event,\n EventEmitter,\n readTask,\n} from '@stencil/core';\nimport type { ResizeStateChangeEventDetail } from '../../interface';\n\ntype ResizeObserverState = { states?: string[]; applied?: boolean };\ninterface StateMaps {\n h: Map<number, ResizeObserverState>;\n w: Map<number, ResizeObserverState>;\n}\n\n/*\n A Resize-Observer utility component.\n * Takes a string list of sizes and optional class-names.\n * Adds class-names and fires `nanoResizeStateChange` events when the component reaches those sizes.\n * Additionally, can fire events when content no-longer fits within the element.\n * @slot - Main slot for any content.\n * @slot content-fit-x - optional slot (when `notifyContentFit` is set). Shows when content fits / doesn't get cut off\n * @slot content-nofit-x - optional slot (when `notifyContentFit` is set). Shows when content doesn't get cut off\n * @slot content-fit-y - optional slot (when `notifyContentFit` is set). Shows when content fits / doesn't get cut off\n * @slot content-nofit-y - optional slot (when `notifyContentFit` is set). Shows when content doesn't get cut off\n /\n@Component({\n tag: 'nano-resize-observe',\n styles: `nano-resize-observe { display: block }`,\n shadow: true,\n})\nexport class ResizeObserve implements ComponentInterface {\n private ro: ResizeObserver;\n private appliedStates: StateMaps;\n private isReady = false;\n\n @Element() host: HTMLNanoResizeObserveElement;\n @State() currentWidth: number;\n @State() currentHeight: number;\n @State() classNames: string[] = [];\n @State() contentFitX = null;\n @State() contentFitY = null;\n\n @Watch('classNames')\n classNameChange() {\n this.host.className = this.classNames.join(' ');\n if (!this.isReady && this.classNames.includes('is-ready')) {\n this.isReady = true;\n this.nanoResizeObserverReady.emit();\n }\n }\n\n /* Fire `nanoResizeContentFitChange` events notifying\n * whether content currently fits or does not on the x, y or both axis'.\n * Also makes the `content-fit-...` slots available /\n @Prop() notifyContentFit: 'x' \| 'y' \| 'xy';\n\n /* string list of sizes and optional class-names. Adds class-names and fires nanoResizeStateChange events. Upon hitting breakpoints.\n * Format: `states=\"800w, 300h class1 class2\"` /\n @Prop() states: string;\n\n /* A resize break point is switched on or off /\n @Event() nanoResizeStateChange!: EventEmitter<ResizeStateChangeEventDetail>;\n\n /* Fires after the initial loading and assessment /\n @Event() nanoResizeObserverReady!: EventEmitter<void>;\n\n /* Fires when the content either begins or stops to fit. Will only work when `notifyContentFit` is set. /\n @Event() nanoResizeContentFitChange!: EventEmitter<{\n x: boolean;\n y: boolean;\n }>;\n\n @Watch('currentHeight')\n @Watch('currentWidth')\n dimensionChanged() {\n this.assessChanges();\n }\n\n @Watch('states')\n statesChanged() {\n if (!this.states) return;\n\n const toBpDir = (bpDir: string) => {\n const bpDirSpl = bpDir.split(/(\\d+)/).filter((bs) => bs.length);\n return { bp: parseInt(bpDirSpl[0]), dir: bpDirSpl[1] };\n };\n this.appliedStates = { h: new Map(), w: new Map() };\n\n // parse state string\n this.states.split(',').map((st) => {\n st = st.trim();\n if (st.includes(' ')) {\n const [key, ...classes] = st.split(' ');\n const { bp, dir } = toBpDir(key);\n this.appliedStates[dir as keyof StateMaps].set(bp, {\n states: classes,\n applied: false,\n });\n } else {\n const { bp, dir } = toBpDir(st);\n this.appliedStates[dir as keyof StateMaps].set(bp, { applied: false });\n }\n });\n }\n\n private assesContentFit() {\n if (!this.notifyContentFit) return;\n\n const findNonContentsEle = (ele: Element) => {\n if (window.getComputedStyle(ele).display !== 'contents') return ele;\n\n const recurse = (e: Element): Element \| null => {\n return Array.from(e.children).find((cEle: HTMLElement) => {\n if (window.getComputedStyle(cEle).display !== 'contents') return cEle;\n recurse(cEle);\n });\n };\n return recurse(ele);\n };\n\n let didChange = false;\n const measureEle = findNonContentsEle(this.host.firstElementChild);\n\n if (measureEle) {\n if (this.notifyContentFit?.includes('x')) {\n if (\n this.currentWidth < measureEle.scrollWidth &&\n this.contentFitX !== false\n ) {\n didChange = true;\n this.contentFitX = false;\n } else if (\n this.currentWidth >= measureEle.scrollWidth &&\n this.contentFitX !== true\n ) {\n didChange = true;\n this.contentFitX = true;\n }\n }\n\n if (this.notifyContentFit?.includes('y')) {\n if (\n this.currentHeight < measureEle.scrollHeight &&\n this.contentFitY !== false\n ) {\n didChange = true;\n this.contentFitY = false;\n } else if (\n this.currentHeight >= measureEle.scrollHeight &&\n this.contentFitY !== true\n ) {\n didChange = true;\n this.contentFitY = true;\n }\n }\n\n if (didChange) {\n this.nanoResizeContentFitChange.emit({\n x: this.contentFitX,\n y: this.contentFitY,\n });\n }\n }\n }\n\n private assessChanges = () => {\n if (!this.currentWidth && !this.currentHeight) return;\n readTask(() => this.assesContentFit());\n\n if (!this.states \|\| !this.appliedStates) return;\n\n const changedStates: StateMaps = { h: new Map(), w: new Map() };\n let hasChanged = false;\n\n Object.keys(this.appliedStates).forEach((dimType) => {\n let dim: number;\n if (dimType === 'h') dim = this.currentHeight;\n else dim = this.currentWidth;\n\n this.appliedStates[dimType].forEach(\n (state: ResizeObserverState, bp: number) => {\n if (dim >= bp && state.applied === false) {\n state.applied = true;\n changedStates[dimType].set(bp, state);\n hasChanged = true;\n } else if (dim < bp && state.applied === true) {\n state.applied = false;\n changedStates[dimType].set(bp, state);\n hasChanged = true;\n }\n }\n );\n });\n if (hasChanged) this.applyChanges(changedStates);\n else if (!this.classNames.includes('is-ready'))\n this.classNames = ['is-ready'];\n };\n\n private applyChanges(changes: StateMaps) {\n if (!this.states) return;\n\n let classNames = [...this.classNames];\n Object.keys(changes).forEach((dimType: keyof StateMaps) => {\n changes[dimType].forEach((state) => {\n if (!state.states) return;\n state.states.map((st) => {\n if (state.applied) {\n classNames.push(st);\n classNames = classNames.filter((cl) => cl !== 'not-' + st);\n } else {\n classNames.push('not-' + st);\n classNames = classNames.filter((cl) => cl !== st);\n }\n });\n });\n });\n this.classNames = ['is-ready', ...classNames];\n this.nanoResizeStateChange.emit(this.toSimpleObj(changes));\n }\n\n private toSimpleObj(stateMaps: StateMaps) {\n const retObj = {};\n Object.keys(stateMaps).forEach((dimType: keyof StateMaps) => {\n stateMaps[dimType].forEach((state: ResizeObserverState, bp: number) => {\n retObj[bp + dimType] = state.applied;\n });\n });\n return retObj;\n }\n\n private attachRO() {\n this.ro = new ResizeObserver(() => {\n const { width, height } = this.host.getBoundingClientRect();\n this.currentWidth = Math.ceil(width);\n this.currentHeight = Math.ceil(height);\n });\n this.ro.observe(this.host);\n }\n\n componentWillLoad() {\n this.classNames = Array.from(this.host.classList);\n\n if (!this.currentWidth \|\| !this.currentHeight) {\n readTask(() => {\n const { width, height } = this.host.getBoundingClientRect();\n this.currentWidth = Math.ceil(width);\n this.currentHeight = Math.ceil(height);\n });\n }\n this.statesChanged();\n // set all class as 'not-' by deafult\n this.applyChanges(this.appliedStates);\n }\n\n connectedCallback() {\n if (!this.ro) this.attachRO();\n }\n\n disconnectedCallback() {\n if (this.ro) this.ro.disconnect();\n }\n\n render() {\n return (\n <Host>\n <slot />\n {!!this.notifyContentFit &&\n (this.contentFitX !== null \|\| this.contentFitY !== null) && [\n !!this.contentFitX ? (\n <slot name=\"content-fit-x\" />\n ) : (\n <slot name=\"content-nofit-x\" />\n ),\n !!this.contentFitY ? (\n <slot name=\"content-fit-y\" />\n ) : (\n <slot name=\"content-nofit-y\" />\n ),\n ]}\n </Host>\n );\n }\n}\n","@import '../../global/style/nano-theme/components';\n\n:host {\n /\n @prop --base-color-rgb: default #{$skeleton-color-rgb};\n * @prop --color: default var(--nano-skeleton-color, rgba(var(--base-color-rgb), 1));\n * @prop --tint: default var(--nano-skeleton-tint, rgba(var(--base-color-rgb), .3));\n /\n\n --base-color-rgb: #{$skeleton-color-rgb};\n --color: var(--nano-skeleton-color, rgba(var(--base-color-rgb), 1));\n --tint: var(--nano-skeleton-tint, rgba(var(--base-color-rgb), 0.5));\n\n display: block;\n position: relative;\n border-radius: 0.25rem;\n min-block-size: 1em;\n line-height: inherit;\n}\n\n.skeleton {\n display: flex;\n min-inline-size: 100%;\n min-block-size: 100%;\n border-radius: inherit;\n line-height: inherit;\n}\n\n.skeleton__indicator {\n flex: 1 1 auto;\n background: var(--color);\n border-radius: inherit;\n line-height: inherit;\n}\n\n.skeleton.animate .skeleton__indicator {\n background:\n linear-gradient(\n 270deg,\n var(--tint),\n var(--color),\n var(--color),\n var(--tint)\n );\n background-size: 400% 100%;\n animation: loader 6s ease-in-out infinite;\n}\n\n@keyframes loader {\n 0% {\n background-position: 200% 0;\n }\n\n to {\n background-position: -200% 0;\n }\n}\n","import { Component, Prop, h, ComponentInterface } from '@stencil/core';\n\n/\n Skeletons are used to show where content will eventually be drawn.\n * Simple containers for scaffolding layouts that mimic what users will see when content has finished loading.\n * Prevents large areas of empty space during asynchronous operations.\n /\n@Component({\n tag: 'nano-skeleton',\n styleUrl: 'skeleton.scss',\n shadow: true,\n})\nexport class Skeleton implements ComponentInterface {\n /* When `true`, the skeleton will animate. */\n @Prop() animated = true;\n\n render() {\n return (\n <div\n class={{\n skeleton: true,\n animate: this.animated,\n }}\n >\n <div class=\"skeleton__indicator\"> </div>\n </div>\n );\n }\n}\n"],"version":3}

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

@@ -244,6 +244,8 @@ 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)
+      return;
     if (this.contentSizeObserver) {
       this.contentSizeObserver.disconnect();
       this.contentSizeObserver = undefined;

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

	@@ -1 +1 @@
1	- {"file":"nano-sticker.entry.cjs.js","mappings":"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","names":["getOffset","debounce","h","Host"],"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.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.cjs.js","mappings":"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","names":["getOffset","debounce","h","Host"],"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}

package/dist/cjs/nano-tab-group.cjs.entry.js CHANGED Viewed

@@ -184,7 +184,7 @@ const TabGroup = class {
         this.updateScrollControls();
       }, 500);
       /** maintain a weakmap of mutation observers to maintain tab / indicator position on all changes. */
-      const nodes = ev.target.assignedNodes({ flatten: true });
+      const nodes = ev.target.assignedElements({ flatten: true });
       nodes.forEach((node) => {
         if (!this.mutationObservers.get(node)) {
           const mo = new MutationObserver(() => {