kritzel-stencil 0.0.126 → 0.0.128

package/dist/components/p-BmJbJwkH.js

@@ -0,0 +1,167 @@
+import { p as proxyCustomElement, H, c as createEvent, h, d as Host } from './p-BqrTPNyu.js';
+
+class KritzelHTMLHelper {
+    static getNumericValueFromStyle(element, property) {
+        const value = window.getComputedStyle(element).getPropertyValue(property);
+        return parseFloat(value) || 0;
+    }
+    static getScrollableParent(element) {
+        var _a, _b;
+        if (!element) {
+            return window;
+        }
+        const parent = (_b = (_a = element.parentNode) === null || _a === void 0 ? void 0 : _a.host) !== null && _b !== void 0 ? _b : element.parentElement;
+        if (!parent || parent.tagName === 'BODY') {
+            return window;
+        }
+        const style = window.getComputedStyle(parent);
+        if (style.overflow === 'auto' || style.overflowY === 'auto' || style.overflow === 'scroll' || style.overflowY === 'scroll') {
+            return parent;
+        }
+        return this.getScrollableParent(parent);
+    }
+    static isElementInViewport(element) {
+        if (!element) {
+            return false;
+        }
+        const scrollableParent = this.getScrollableParent(element);
+        const rect = element.getBoundingClientRect();
+        if (scrollableParent === window) {
+            const viewportHeight = window.innerHeight || document.documentElement.clientHeight;
+            const viewportWidth = window.innerWidth || document.documentElement.clientWidth;
+            return rect.top >= 0 && rect.left >= 0 && rect.bottom <= viewportHeight && rect.right <= viewportWidth;
+        }
+        const parentRect = scrollableParent.getBoundingClientRect();
+        return rect.top >= parentRect.top && rect.left >= parentRect.left && rect.bottom <= parentRect.bottom && rect.right <= parentRect.right;
+    }
+}
+
+const DEFAULT_OFFSET = 0;
+const MIN_LEFT_POSITION = 0;
+const Z_INDEX = '9005';
+const ID_PORTAL = 'portal';
+const KritzelPortal = /*@__PURE__*/ proxyCustomElement(class KritzelPortal extends H {
+    constructor(registerHost) {
+        super();
+        if (registerHost !== false) {
+            this.__registerHost();
+        }
+        this.__attachShadow();
+        this.close = createEvent(this, "close");
+        this.autoFocus = true;
+        this.moved = false;
+        this.handleScroll = () => {
+            const isAnchorInViewport = KritzelHTMLHelper.isElementInViewport(this.anchor);
+            if (!isAnchorInViewport) {
+                this.close.emit();
+                return;
+            }
+            this.calculatePosition();
+        };
+    }
+    anchorChanged(newValue) {
+        if (newValue) {
+            this.calculatePosition();
+        }
+    }
+    handleResize() {
+        this.calculatePosition();
+    }
+    calculateLeft() {
+        var _a;
+        if (!this.anchor || !this.portal)
+            return 0;
+        const refRect = this.anchor.getBoundingClientRect();
+        const portalRect = this.portal.getBoundingClientRect();
+        const offset = (_a = this.offsetX) !== null && _a !== void 0 ? _a : DEFAULT_OFFSET;
+        let left = refRect.left + offset;
+        const maxLeft = window.innerWidth - portalRect.width - MIN_LEFT_POSITION;
+        if (left < MIN_LEFT_POSITION)
+            left = MIN_LEFT_POSITION;
+        if (left > maxLeft)
+            left = maxLeft;
+        return Math.round(left + window.scrollX);
+    }
+    calculateTop() {
+        var _a;
+        if (!this.anchor || !this.portal)
+            return 0;
+        const refRect = this.anchor.getBoundingClientRect();
+        const portalRect = this.portal.getBoundingClientRect();
+        const offset = (_a = this.offsetY) !== null && _a !== void 0 ? _a : DEFAULT_OFFSET;
+        let top = refRect.bottom + offset;
+        if (top + portalRect.height > window.innerHeight) {
+            top = refRect.top - portalRect.height - offset;
+        }
+        return Math.round(top + window.scrollY);
+    }
+    createPortal() {
+        this.portal = document.createElement('div');
+        this.portal.setAttribute('id', ID_PORTAL);
+        this.portal.style.zIndex = Z_INDEX;
+        this.portal.style.position = 'absolute';
+        this.portal.style.top = '0px';
+        this.portal.style.left = '0px';
+        document.body.append(this.portal);
+    }
+    moveElementToPortal() {
+        this.portal.appendChild(this.element);
+        this.moved = true;
+    }
+    calculatePosition() {
+        if (!this.anchor || !this.portal)
+            return;
+        const top = this.calculateTop();
+        const left = this.calculateLeft();
+        this.portal.style.top = `${top}px`;
+        this.portal.style.left = `${left}px`;
+    }
+    componentWillLoad() {
+        this.createPortal();
+    }
+    componentDidLoad() {
+        var _a;
+        this.moveElementToPortal();
+        if (this.anchor) {
+            this.calculatePosition();
+            this.scrollableParent = KritzelHTMLHelper.getScrollableParent(this.anchor);
+            (_a = this.scrollableParent) === null || _a === void 0 ? void 0 : _a.addEventListener('scroll', this.handleScroll);
+        }
+    }
+    disconnectedCallback() {
+        var _a;
+        this.moved ? this.portal.remove() : (this.moved = true);
+        (_a = this.scrollableParent) === null || _a === void 0 ? void 0 : _a.removeEventListener('scroll', this.handleScroll);
+    }
+    render() {
+        return (h(Host, { key: 'e39525c3e9ddbf738b63ac0c08d8c1e2264783b1', ref: el => (this.element = el) }, h("slot", { key: '95202c5bea32c77dc1dde0a12a58ac9bcebd8812' })));
+    }
+    static get watchers() { return {
+        "anchor": ["anchorChanged"]
+    }; }
+}, [257, "kritzel-portal", {
+        "anchor": [16],
+        "offsetX": [2, "offset-x"],
+        "offsetY": [2, "offset-y"],
+        "autoFocus": [4, "auto-focus"]
+    }, [[11, "resize", "handleResize"]], {
+        "anchor": ["anchorChanged"]
+    }]);
+function defineCustomElement() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["kritzel-portal"];
+    components.forEach(tagName => { switch (tagName) {
+        case "kritzel-portal":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, KritzelPortal);
+            }
+            break;
+    } });
+}
+
+export { KritzelPortal as K, defineCustomElement as d };
+//# sourceMappingURL=p-BmJbJwkH.js.map
+
+//# sourceMappingURL=p-BmJbJwkH.js.map

package/dist/components/p-BmJbJwkH.js.map

@@ -0,0 +1 @@
+{"file":"p-BmJbJwkH.js","mappings":";;MAAa,iBAAiB,CAAA;AAC7B,IAAA,OAAO,wBAAwB,CAAC,OAAoB,EAAE,QAAgB,EAAA;AACpE,QAAA,MAAM,KAAK,GAAG,MAAM,CAAC,gBAAgB,CAAC,OAAO,CAAC,CAAC,gBAAgB,CAAC,QAAQ,CAAC;AACzE,QAAA,OAAO,UAAU,CAAC,KAAK,CAAC,IAAI,CAAC;;IAG/B,OAAO,mBAAmB,CAAC,OAAoB,EAAA;;QAC5C,IAAI,CAAC,OAAO,EAAE;AACZ,YAAA,OAAO,MAAM;;QAGf,MAAM,MAAM,GAAG,CAAC,EAAA,GAAA,CAAA,EAAA,GAAC,OAAO,CAAC,UAAyB,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAE,IAAoB,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,EAAA,GAAI,OAAO,CAAC,aAAa;QAEjG,IAAI,CAAC,MAAM,IAAI,MAAM,CAAC,OAAO,KAAK,MAAM,EAAE;AACxC,YAAA,OAAO,MAAM;;QAGf,MAAM,KAAK,GAAG,MAAM,CAAC,gBAAgB,CAAC,MAAM,CAAC;QAC7C,IAAI,KAAK,CAAC,QAAQ,KAAK,MAAM,IAAI,KAAK,CAAC,SAAS,KAAK,MAAM,IAAI,KAAK,CAAC,QAAQ,KAAK,QAAQ,IAAI,KAAK,CAAC,SAAS,KAAK,QAAQ,EAAE;AAC1H,YAAA,OAAO,MAAM;;AAGf,QAAA,OAAO,IAAI,CAAC,mBAAmB,CAAC,MAAM,CAAC;;IAGzC,OAAO,mBAAmB,CAAC,OAAoB,EAAA;QAC7C,IAAI,CAAC,OAAO,EAAE;AACZ,YAAA,OAAO,KAAK;;QAGd,MAAM,gBAAgB,GAAG,IAAI,CAAC,mBAAmB,CAAC,OAAO,CAAC;AAC1D,QAAA,MAAM,IAAI,GAAG,OAAO,CAAC,qBAAqB,EAAE;AAE5C,QAAA,IAAI,gBAAgB,KAAK,MAAM,EAAE;YAC/B,MAAM,cAAc,GAAG,MAAM,CAAC,WAAW,IAAI,QAAQ,CAAC,eAAe,CAAC,YAAY;YAClF,MAAM,aAAa,GAAG,MAAM,CAAC,UAAU,IAAI,QAAQ,CAAC,eAAe,CAAC,WAAW;YAE/E,OAAO,IAAI,CAAC,GAAG,IAAI,CAAC,IAAI,IAAI,CAAC,IAAI,IAAI,CAAC,IAAI,IAAI,CAAC,MAAM,IAAI,cAAc,IAAI,IAAI,CAAC,KAAK,IAAI,aAAa;;AAGxG,QAAA,MAAM,UAAU,GAAI,gBAAgC,CAAC,qBAAqB,EAAE;AAE5E,QAAA,OAAO,IAAI,CAAC,GAAG,IAAI,UAAU,CAAC,GAAG,IAAI,IAAI,CAAC,IAAI,IAAI,UAAU,CAAC,IAAI,IAAI,IAAI,CAAC,MAAM,IAAI,UAAU,CAAC,MAAM,IAAI,IAAI,CAAC,KAAK,IAAI,UAAU,CAAC,KAAK;;AAE1I;;ACzCD,MAAM,cAAc,GAAG,CAAC;AACxB,MAAM,iBAAiB,GAAG,CAAC;AAC3B,MAAM,OAAO,GAAG,MAAM;AACtB,MAAM,SAAS,GAAG,QAAQ;MAMb,aAAa,iBAAAA,kBAAA,CAAA,MAAA,aAAA,SAAAC,CAAA,CAAA;AAJ1B,IAAA,WAAA,CAAA,YAAA,EAAA;;;;;;;AAsBE,QAAA,IAAS,CAAA,SAAA,GAAY,IAAI;AASjB,QAAA,IAAK,CAAA,KAAA,GAAY,KAAK;AAStB,QAAA,IAAY,CAAA,YAAA,GAAG,MAAK;YAC1B,MAAM,kBAAkB,GAAG,iBAAiB,CAAC,mBAAmB,CAAC,IAAI,CAAC,MAAM,CAAC;YAE7E,IAAI,CAAC,kBAAkB,EAAE;AACvB,gBAAA,IAAI,CAAC,KAAK,CAAC,IAAI,EAAE;gBACjB;;YAGF,IAAI,CAAC,iBAAiB,EAAE;AAC1B,SAAC;AAgFF;AAxHC,IAAA,aAAa,CAAC,QAAqB,EAAA;QACjC,IAAI,QAAQ,EAAE;YACZ,IAAI,CAAC,iBAAiB,EAAE;;;IAyB5B,YAAY,GAAA;QACV,IAAI,CAAC,iBAAiB,EAAE;;IAclB,aAAa,GAAA;;QACnB,IAAI,CAAC,IAAI,CAAC,MAAM,IAAI,CAAC,IAAI,CAAC,MAAM;AAAE,YAAA,OAAO,CAAC;QAC1C,MAAM,OAAO,GAAG,IAAI,CAAC,MAAM,CAAC,qBAAqB,EAAE;QACnD,MAAM,UAAU,GAAG,IAAI,CAAC,MAAM,CAAC,qBAAqB,EAAE;QAEtD,MAAM,MAAM,GAAG,CAAA,EAAA,GAAA,IAAI,CAAC,OAAO,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,EAAA,GAAI,cAAc;AAC7C,QAAA,IAAI,IAAI,GAAG,OAAO,CAAC,IAAI,GAAG,MAAM;QAEhC,MAAM,OAAO,GAAG,MAAM,CAAC,UAAU,GAAG,UAAU,CAAC,KAAK,GAAG,iBAAiB;QACxE,IAAI,IAAI,GAAG,iBAAiB;YAAE,IAAI,GAAG,iBAAiB;QACtD,IAAI,IAAI,GAAG,OAAO;YAAE,IAAI,GAAG,OAAO;QAElC,OAAO,IAAI,CAAC,KAAK,CAAC,IAAI,GAAG,MAAM,CAAC,OAAO,CAAC;;IAGlC,YAAY,GAAA;;QAClB,IAAI,CAAC,IAAI,CAAC,MAAM,IAAI,CAAC,IAAI,CAAC,MAAM;AAAE,YAAA,OAAO,CAAC;QAC1C,MAAM,OAAO,GAAG,IAAI,CAAC,MAAM,CAAC,qBAAqB,EAAE;QACnD,MAAM,UAAU,GAAG,IAAI,CAAC,MAAM,CAAC,qBAAqB,EAAE;QACtD,MAAM,MAAM,GAAG,CAAA,EAAA,GAAA,IAAI,CAAC,OAAO,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,EAAA,GAAI,cAAc;AAE7C,QAAA,IAAI,GAAG,GAAG,OAAO,CAAC,MAAM,GAAG,MAAM;QAEjC,IAAI,GAAG,GAAG,UAAU,CAAC,MAAM,GAAG,MAAM,CAAC,WAAW,EAAE;YAChD,GAAG,GAAG,OAAO,CAAC,GAAG,GAAG,UAAU,CAAC,MAAM,GAAG,MAAM;;QAGhD,OAAO,IAAI,CAAC,KAAK,CAAC,GAAG,GAAG,MAAM,CAAC,OAAO,CAAC;;IAGjC,YAAY,GAAA;QAClB,IAAI,CAAC,MAAM,GAAG,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC;QAC3C,IAAI,CAAC,MAAM,CAAC,YAAY,CAAC,IAAI,EAAE,SAAS,CAAC;QACzC,IAAI,CAAC,MAAM,CAAC,KAAK,CAAC,MAAM,GAAG,OAAO;QAClC,IAAI,CAAC,MAAM,CAAC,KAAK,CAAC,QAAQ,GAAG,UAAU;QACvC,IAAI,CAAC,MAAM,CAAC,KAAK,CAAC,GAAG,GAAG,KAAK;QAC7B,IAAI,CAAC,MAAM,CAAC,KAAK,CAAC,IAAI,GAAG,KAAK;QAC9B,QAAQ,CAAC,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,MAAM,CAAC;;IAG3B,mBAAmB,GAAA;QACzB,IAAI,CAAC,MAAM,CAAC,WAAW,CAAC,IAAI,CAAC,OAAO,CAAC;AACrC,QAAA,IAAI,CAAC,KAAK,GAAG,IAAI;;IAGX,iBAAiB,GAAA;QACvB,IAAI,CAAC,IAAI,CAAC,MAAM,IAAI,CAAC,IAAI,CAAC,MAAM;YAAE;AAClC,QAAA,MAAM,GAAG,GAAG,IAAI,CAAC,YAAY,EAAE;AAC/B,QAAA,MAAM,IAAI,GAAG,IAAI,CAAC,aAAa,EAAE;QACjC,IAAI,CAAC,MAAM,CAAC,KAAK,CAAC,GAAG,GAAG,CAAA,EAAG,GAAG,CAAA,EAAA,CAAI;QAClC,IAAI,CAAC,MAAM,CAAC,KAAK,CAAC,IAAI,GAAG,CAAA,EAAG,IAAI,CAAA,EAAA,CAAI;;IAGtC,iBAAiB,GAAA;QACf,IAAI,CAAC,YAAY,EAAE;;IAGrB,gBAAgB,GAAA;;QACd,IAAI,CAAC,mBAAmB,EAAE;AAC1B,QAAA,IAAI,IAAI,CAAC,MAAM,EAAE;YACf,IAAI,CAAC,iBAAiB,EAAE;YACxB,IAAI,CAAC,gBAAgB,GAAG,iBAAiB,CAAC,mBAAmB,CAAC,IAAI,CAAC,MAAM,CAAC;AAC1E,YAAA,CAAA,EAAA,GAAA,IAAI,CAAC,gBAAgB,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAE,gBAAgB,CAAC,QAAQ,EAAE,IAAI,CAAC,YAAY,CAAC;;;IAIxE,oBAAoB,GAAA;;QAClB,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,MAAM,CAAC,MAAM,EAAE,IAAI,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC;AACvD,QAAA,CAAA,EAAA,GAAA,IAAI,CAAC,gBAAgB,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAE,mBAAmB,CAAC,QAAQ,EAAE,IAAI,CAAC,YAAY,CAAC;;IAGzE,MAAM,GAAA;AACJ,QAAA,QACE,CAAC,CAAA,IAAI,EAAC,EAAA,GAAA,EAAA,0CAAA,EAAA,GAAG,EAAE,EAAE,KAAK,IAAI,CAAC,OAAO,GAAG,EAAE,CAAC,EAAA,EAClC,CAAQ,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAA,CACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/helpers/html.helper.ts","src/components/shared/kritzel-portal/kritzel-portal.tsx"],"sourcesContent":["export class KritzelHTMLHelper {\r\n static getNumericValueFromStyle(element: HTMLElement, property: string): number {\r\n   const value = window.getComputedStyle(element).getPropertyValue(property);\r\n   return parseFloat(value) || 0;\r\n }\r\n\r\n static getScrollableParent(element: HTMLElement): HTMLElement | Window {\r\n    if (!element) {\r\n      return window;\r\n    }\r\n\r\n    const parent = ((element.parentNode as ShadowRoot)?.host as HTMLElement) ?? element.parentElement;\r\n\r\n    if (!parent || parent.tagName === 'BODY') {\r\n      return window;\r\n    }\r\n\r\n    const style = window.getComputedStyle(parent);\r\n    if (style.overflow === 'auto' || style.overflowY === 'auto' || style.overflow === 'scroll' || style.overflowY === 'scroll') {\r\n      return parent;\r\n    }\r\n\r\n    return this.getScrollableParent(parent);\r\n  }\r\n\r\n  static isElementInViewport(element: HTMLElement): boolean {\r\n    if (!element) {\r\n      return false;\r\n    }\r\n\r\n    const scrollableParent = this.getScrollableParent(element);\r\n    const rect = element.getBoundingClientRect();\r\n\r\n    if (scrollableParent === window) {\r\n      const viewportHeight = window.innerHeight || document.documentElement.clientHeight;\r\n      const viewportWidth = window.innerWidth || document.documentElement.clientWidth;\r\n\r\n      return rect.top >= 0 && rect.left >= 0 && rect.bottom <= viewportHeight && rect.right <= viewportWidth;\r\n    }\r\n\r\n    const parentRect = (scrollableParent as HTMLElement).getBoundingClientRect();\r\n\r\n    return rect.top >= parentRect.top && rect.left >= parentRect.left && rect.bottom <= parentRect.bottom && rect.right <= parentRect.right;\r\n  }\r\n}","import { Component, Host, Listen, Prop, Watch, h, Event, EventEmitter } from '@stencil/core';\r\nimport { KritzelHTMLHelper } from '../../../helpers/html.helper';\r\n\r\nconst DEFAULT_OFFSET = 0;\r\nconst MIN_LEFT_POSITION = 0;\r\nconst Z_INDEX = '9005';\r\nconst ID_PORTAL = 'portal';\r\n\r\n@Component({\r\n  tag: 'kritzel-portal',\r\n  shadow: true,\r\n})\r\nexport class KritzelPortal {\r\n  @Prop()\r\n  anchor: HTMLElement;\r\n\r\n  @Watch('anchor')\r\n  anchorChanged(newValue: HTMLElement) {\r\n    if (newValue) {\r\n      this.calculatePosition();\r\n    }\r\n  }\r\n\r\n  @Prop()\r\n  offsetX: number;\r\n\r\n  @Prop()\r\n  offsetY: number;\r\n\r\n  @Prop()\r\n  autoFocus: boolean = true;\r\n\r\n  @Event()\r\n  close: EventEmitter<void>;\r\n\r\n  private portal: HTMLElement;\r\n\r\n  private element: HTMLElement;\r\n\r\n  private moved: boolean = false;\r\n\r\n  private scrollableParent: HTMLElement | Window;\r\n\r\n  @Listen('resize', { target: 'window', capture: true })\r\n  handleResize() {\r\n    this.calculatePosition();\r\n  }\r\n\r\n  private handleScroll = () => {\r\n    const isAnchorInViewport = KritzelHTMLHelper.isElementInViewport(this.anchor);\r\n\r\n    if (!isAnchorInViewport) {\r\n      this.close.emit();\r\n      return;\r\n    }\r\n\r\n    this.calculatePosition();\r\n  };\r\n\r\n  private calculateLeft() {\r\n    if (!this.anchor || !this.portal) return 0;\r\n    const refRect = this.anchor.getBoundingClientRect();\r\n    const portalRect = this.portal.getBoundingClientRect();\r\n\r\n    const offset = this.offsetX ?? DEFAULT_OFFSET;\r\n    let left = refRect.left + offset;\r\n\r\n    const maxLeft = window.innerWidth - portalRect.width - MIN_LEFT_POSITION;\r\n    if (left < MIN_LEFT_POSITION) left = MIN_LEFT_POSITION;\r\n    if (left > maxLeft) left = maxLeft;\r\n\r\n    return Math.round(left + window.scrollX);\r\n  }\r\n\r\n  private calculateTop() {\r\n    if (!this.anchor || !this.portal) return 0;\r\n    const refRect = this.anchor.getBoundingClientRect();\r\n    const portalRect = this.portal.getBoundingClientRect();\r\n    const offset = this.offsetY ?? DEFAULT_OFFSET;\r\n\r\n    let top = refRect.bottom + offset;\r\n\r\n    if (top + portalRect.height > window.innerHeight) {\r\n      top = refRect.top - portalRect.height - offset;\r\n    }\r\n\r\n    return Math.round(top + window.scrollY);\r\n  }\r\n\r\n  private createPortal() {\r\n    this.portal = document.createElement('div');\r\n    this.portal.setAttribute('id', ID_PORTAL);\r\n    this.portal.style.zIndex = Z_INDEX;\r\n    this.portal.style.position = 'absolute';\r\n    this.portal.style.top = '0px';\r\n    this.portal.style.left = '0px';\r\n    document.body.append(this.portal);\r\n  }\r\n\r\n  private moveElementToPortal() {\r\n    this.portal.appendChild(this.element);\r\n    this.moved = true;\r\n  }\r\n\r\n  private calculatePosition() {\r\n    if (!this.anchor || !this.portal) return;\r\n    const top = this.calculateTop();\r\n    const left = this.calculateLeft();\r\n    this.portal.style.top = `${top}px`;\r\n    this.portal.style.left = `${left}px`;\r\n  }\r\n\r\n  componentWillLoad() {\r\n    this.createPortal();\r\n  }\r\n\r\n  componentDidLoad() {\r\n    this.moveElementToPortal();\r\n    if (this.anchor) {\r\n      this.calculatePosition();\r\n      this.scrollableParent = KritzelHTMLHelper.getScrollableParent(this.anchor);\r\n      this.scrollableParent?.addEventListener('scroll', this.handleScroll);\r\n    }\r\n  }\r\n\r\n  disconnectedCallback() {\r\n    this.moved ? this.portal.remove() : (this.moved = true);\r\n    this.scrollableParent?.removeEventListener('scroll', this.handleScroll);\r\n  }\r\n\r\n  render() {\r\n    return (\r\n      <Host ref={el => (this.element = el)}>\r\n        <slot />\r\n      </Host>\r\n    );\r\n  }\r\n}"],"version":3}