@cas-smartdesign/popover 4.1.1

package/dist/popover.mjs

@@ -0,0 +1,281 @@
+import { createPopper as d } from "@popperjs/core";
+const g = `<svg xmlns="http://www.w3.org/2000/svg" width="24" height="12" viewBox="0 0 24 12">\r
+  <path d="M0 0l11.96 12L24 0z" fill="#999" class="arrow-border"/>\r
+  <path d="M12 11L1 0h22z" fill="#f2f2f2" class="arrow-background"/>\r
+</svg>\r
+`, f = navigator.userAgent.indexOf("Trident") !== -1, h = 1, l = "sd-popover-open", o = class o extends HTMLElement {
+  constructor() {
+    super(...arguments), this._open = !1, this._firstUpdated = !1, this.toggle = () => {
+      this.open = !this.open;
+    }, this.show = () => {
+      this.open = !0;
+    }, this.hide = () => {
+      this.open = !1;
+    }, this.hideIfExternalTarget = (e) => {
+      const t = e.target;
+      (!(t instanceof HTMLElement) || !this._container.contains(t) && !this.targetElement.contains(t)) && this.hide();
+    };
+  }
+  get triggerType() {
+    return this.getAttribute("trigger-type");
+  }
+  set triggerType(e) {
+    e ? this.setAttribute("trigger-type", e) : this.removeAttribute("trigger-type");
+  }
+  get placement() {
+    return this.getAttribute("placement");
+  }
+  set placement(e) {
+    e ? this.setAttribute("placement", e) : this.removeAttribute("placement");
+  }
+  get targetElement() {
+    return this._targetElement;
+  }
+  set targetElement(e) {
+    this.removeTargetEventListener(this.targetElement), this._targetElement && this._targetElement.getAttribute("aria-expanded") == "true" && this._targetElement.setAttribute("aria-expanded", "false"), this._targetElement = e, e.setAttribute("aria-expanded", "false"), this.addTargetEventListener(this.targetElement), this.updatePopper();
+  }
+  get targetSelector() {
+    return this.getAttribute("target-selector");
+  }
+  set targetSelector(e) {
+    e ? this.setAttribute("target-selector", e) : this.removeAttribute("target-selector");
+  }
+  get modal() {
+    return this.hasAttribute("modal");
+  }
+  set modal(e) {
+    e ? this.setAttribute("modal", "") : this.removeAttribute("modal");
+  }
+  get popoverFor() {
+    return this.getAttribute("popover-for");
+  }
+  set popoverFor(e) {
+    e ? this.setAttribute("popover-for", e) : this.removeAttribute("popover-for");
+  }
+  get flipPriority() {
+    return this._flipPriority;
+  }
+  set flipPriority(e) {
+    e && e.length > 0 ? this._flipPriority = e : this._flipPriority = null, this.reConfigurePopper();
+  }
+  get offset() {
+    return this.getAttribute("offset") ? parseInt(this.getAttribute("offset")) : 0;
+  }
+  set offset(e) {
+    e ? this.setAttribute("offset", e.toString()) : this.removeAttribute("offset"), this.reConfigurePopper();
+  }
+  reConfigurePopper() {
+    this._popper && this.configurePopper();
+  }
+  get noArrow() {
+    return this.hasAttribute("no-arrow");
+  }
+  set noArrow(e) {
+    e ? this.setAttribute("no-arrow", "") : this.removeAttribute("no-arrow");
+  }
+  static get observedAttributes() {
+    return ["placement", "target-selector", "trigger-type"];
+  }
+  attributeChangedCallback(e, t) {
+    switch (e) {
+      case "placement": {
+        this.updatePopper();
+        break;
+      }
+      case "trigger-type": {
+        this.removeTargetEventListener(this.targetElement), this.addTargetEventListener(this.targetElement);
+        break;
+      }
+      case "target-selector": {
+        this.handleTargetSelectorChange(t);
+        break;
+      }
+    }
+  }
+  connectedCallback() {
+    this._firstUpdated || (this.firstUpdated(), this._firstUpdated = !0), this.targetElement ? this.addTargetEventListener(this.targetElement) : this.targetSelector && requestAnimationFrame(() => {
+      this.isConnected && this.handleTargetSelectorChange(null);
+    }), this._arrow = document.createElement("div"), this._arrow.classList.add("popover-arrow"), this._arrow.setAttribute("data-popper-arrow", ""), this._arrow.style.display = "flex", this._arrow.innerHTML = g;
+  }
+  disconnectedCallback() {
+    this.targetElement && (this.removeTargetEventListener(this.targetElement), this.removeTargetClassForOpen(this.targetElement)), this._resizeObserver && (this._resizeObserver.disconnect(), this._resizeObserver = null);
+  }
+  firstUpdated() {
+    this.style.display = "none", this.triggerType = this.triggerType || "click", this.placement = this.placement || "auto";
+  }
+  get open() {
+    return this._open;
+  }
+  set open(e) {
+    e !== this._open && (this._open = e, this.handleOpenChange());
+  }
+  handleOpenChange() {
+    this.open ? (this._popper || this.configurePopper(), this._container.innerHTML = "", this.popoverFor && this._container.setAttribute("popover-for", this.popoverFor), this.content && (this._container.prepend(this.content), Object.assign(this.content.style, {
+      position: "relative",
+      display: "block",
+      zIndex: 1
+    }), window.requestAnimationFrame(() => {
+      let e = getComputedStyle(this.content).backgroundColor;
+      e == "rgba(0, 0, 0, 0)" && (this.content.style.background = e = "#f2f2f2"), this._arrow.querySelector(".arrow-background").style.fill = e;
+    })), this.ensureArrowIsAdded(), this.ownerDocument.body.appendChild(this._container), this.updatePopper(), this.setAttribute("open", ""), this.modal && (window.addEventListener("click", this.hideIfExternalTarget, { capture: !0 }), window.addEventListener("focus", this.hideIfExternalTarget, { capture: !0 })), this.targetElement && (this.addTargetClassForOpen(this.targetElement), this.targetElement.setAttribute("aria-expanded", "true")), this.dispatchEvent(new CustomEvent("open"))) : (this.ownerDocument.body.removeChild(this._container), this.removeAttribute("open"), window.removeEventListener("click", this.hideIfExternalTarget, { capture: !0 }), window.removeEventListener("focus", this.hideIfExternalTarget, { capture: !0 }), this.targetElement && (this.removeTargetClassForOpen(this.targetElement), this.targetElement.setAttribute("aria-expanded", "false")), this.dispatchEvent(new CustomEvent("close")));
+  }
+  handleTargetSelectorChange(e) {
+    const t = document.querySelector(e);
+    t && (this.removeTargetEventListener(t), this.removeTargetClassForOpen(t)), this.targetSelector && (this.targetElement = document.querySelector(this.targetSelector), this.addTargetEventListener(this.targetElement));
+  }
+  addTargetEventListener(e) {
+    if (e)
+      switch (this.triggerType) {
+        case "hover": {
+          e.addEventListener("mouseenter", this.show), e.addEventListener("mouseleave", this.hide);
+          break;
+        }
+        case "click": {
+          e.addEventListener("click", this.toggle);
+          break;
+        }
+      }
+  }
+  removeTargetEventListener(e) {
+    if (e)
+      switch (this.triggerType) {
+        case "hover": {
+          e.removeEventListener("mouseenter", this.show), e.removeEventListener("mouseleave", this.hide);
+          break;
+        }
+        case "click": {
+          e.removeEventListener("click", this.toggle);
+          break;
+        }
+      }
+  }
+  configurePopper() {
+    this.createContentContainer(), this.ensureArrowIsAdded();
+    const e = this, t = {
+      placement: e.placement,
+      strategy: "absolute",
+      modifiers: [
+        {
+          name: "computeStyles",
+          options: {
+            gpuAcceleration: !f
+          }
+        },
+        {
+          name: "flip",
+          options: {
+            fallbackPlacements: e._flipPriority
+          }
+        },
+        {
+          name: "offset",
+          options: {
+            offset: () => [
+              0,
+              e.noArrow ? 0 + e.offset : this._arrow.clientHeight + e.offset
+            ]
+          }
+        },
+        {
+          name: "arrow",
+          options: {
+            padding: 6
+            // Avoid to reach the edges of the popper element with the arrow
+          }
+        },
+        {
+          name: "resetArrowStyles",
+          enabled: !0,
+          phase: "beforeWrite",
+          fn({ state: r }) {
+            Object.assign(e._arrow.style, {
+              top: r.styles.arrow.top || "",
+              left: r.styles.arrow.left || "",
+              bottom: r.styles.arrow.bottom || "",
+              right: r.styles.arrow.right || ""
+            });
+          }
+        },
+        {
+          name: "onUpdate",
+          enabled: !0,
+          phase: "afterWrite",
+          fn({ state: r }) {
+            e.updateArrow(r.placement);
+          }
+        }
+      ]
+    };
+    this._popper = d(this.targetElement, this._container, t);
+  }
+  createContentContainer() {
+    this._container = document.createElement("div"), this._container.classList.add("popover-container"), this._container.tabIndex = 0, this._resizeObserver && this._resizeObserver.disconnect(), this._resizeObserver = new ResizeObserver(() => {
+      this._popper && this._popper.update();
+    }), this._resizeObserver.observe(this._container), Object.assign(this._container.style, {
+      boxShadow: `0 4px 5px 0 rgba(0, 0, 0, 0.14),
+                        0 1px 10px 0 rgba(0, 0, 0, 0.12),
+                        0 2px 4px -1px rgba(0, 0, 0, 0.4)`,
+      border: "1px solid #999",
+      boxSizing: "border-box",
+      zIndex: 2e4
+    });
+  }
+  ensureArrowIsAdded() {
+    !this.noArrow && !this._container.contains(this._arrow) && this._container.appendChild(this._arrow);
+  }
+  updatePopper() {
+    this._popper && (this._popper.state.elements.reference = this.targetElement, this._popper.state.options.placement = this.placement, this.open && this._popper.update());
+  }
+  updateArrow(e) {
+    if (this._arrow) {
+      const t = this.getArrowVariant(e);
+      if (this._arrow.setAttribute("variant", t), this._content) {
+        const r = this._arrow.querySelector("svg"), p = this._arrow.clientWidth, s = this._arrow.clientHeight, n = `-${s - h}px`, c = (p - s) / 2, a = `-${s + c - h}px`;
+        switch (t) {
+          case "bottom": {
+            this._arrow.style.top = n, r.style.transform = "rotate(180deg)";
+            break;
+          }
+          case "top": {
+            this._arrow.style.bottom = n, r.style.transform = "rotate(0deg)";
+            break;
+          }
+          case "left": {
+            this._arrow.style.right = a, r.style.transform = "rotate(270deg)";
+            break;
+          }
+          case "right": {
+            this._arrow.style.left = a, r.style.transform = "rotate(90deg)";
+            break;
+          }
+        }
+      }
+    }
+  }
+  getArrowVariant(e) {
+    if (e.indexOf("bottom") !== -1)
+      return "bottom";
+    if (e.indexOf("top") !== -1)
+      return "top";
+    if (e.indexOf("left") !== -1)
+      return "left";
+    if (e.indexOf("right") !== -1)
+      return "right";
+  }
+  get content() {
+    return this._content || (this._content = this.firstElementChild, this._content.setAttribute("data-popper-content", "")), this._content;
+  }
+  addTargetClassForOpen(e) {
+    e && e.classList.add(l);
+  }
+  removeTargetClassForOpen(e) {
+    e && e.classList.remove(l);
+  }
+};
+o.ID = "sd-popover";
+let i = o;
+customElements.get(i.ID) || customElements.define(i.ID, i);
+export {
+  i as default
+};
+//# sourceMappingURL=popover.mjs.map

package/dist/popover.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"popover.mjs","sources":["../arrow.svg?raw","../popover.ts"],"sourcesContent":["export default \"<svg xmlns=\\\"http://www.w3.org/2000/svg\\\" width=\\\"24\\\" height=\\\"12\\\" viewBox=\\\"0 0 24 12\\\">\\r\\n  <path d=\\\"M0 0l11.96 12L24 0z\\\" fill=\\\"#999\\\" class=\\\"arrow-border\\\"/>\\r\\n  <path d=\\\"M12 11L1 0h22z\\\" fill=\\\"#f2f2f2\\\" class=\\\"arrow-background\\\"/>\\r\\n</svg>\\r\\n\"","import { createPopper, Instance as Popper, Options, Placement } from \"@popperjs/core\";\nimport { default as arrowSvg } from \"./arrow.svg?raw\";\n\nconst isIE11 = navigator.userAgent.indexOf(\"Trident\") !== -1;\nconst arrowOverlapOffset = 1;\nconst targetClassOpen = \"sd-popover-open\";\n\ndeclare global {\n    interface HTMLElementTagNameMap {\n        [Popover.ID]: Popover;\n    }\n}\n\nexport type TriggerType = \"click\" | \"hover\" | \"manual\";\nexport type ArrowVariant = \"bottom\" | \"left\" | \"right\" | \"top\";\nexport type IOpenEvent = void;\nexport type ICloseEvent = void;\n\nexport interface CustomEventMap extends HTMLElementEventMap {\n    open: CustomEvent<IOpenEvent>;\n    close: CustomEvent<ICloseEvent>;\n}\n\nexport default interface Popover {\n    addEventListener<K extends keyof CustomEventMap>(\n        event: K,\n        listener: ((this: this, ev: CustomEventMap[K]) => unknown) | null,\n        options?: AddEventListenerOptions | boolean,\n    ): void;\n    addEventListener(\n        type: string,\n        callback: EventListenerOrEventListenerObject | null,\n        options?: AddEventListenerOptions | boolean,\n    ): void;\n    removeEventListener<K extends keyof CustomEventMap>(\n        type: K,\n        listener: (this: this, ev: CustomEventMap[K]) => unknown,\n        options?: boolean | EventListenerOptions,\n    ): void;\n    removeEventListener(\n        type: string,\n        listener: EventListenerOrEventListenerObject,\n        options?: boolean | EventListenerOptions,\n    ): void;\n    dispatchEvent<EventType extends CustomEventMap[keyof CustomEventMap]>(event: EventType): boolean;\n}\n\nexport default class Popover extends HTMLElement {\n    public static readonly ID = \"sd-popover\";\n    private _open = false;\n    private _popper: Popper;\n    private _targetElement: HTMLElement;\n    private _container: HTMLElement;\n    private _arrow: HTMLElement;\n    private _content: HTMLElement;\n    private _firstUpdated = false;\n    private _flipPriority: Placement[];\n    private _resizeObserver: ResizeObserver;\n\n    public get triggerType(): TriggerType {\n        return this.getAttribute(\"trigger-type\") as TriggerType;\n    }\n\n    public set triggerType(type: TriggerType) {\n        if (type) {\n            this.setAttribute(\"trigger-type\", type);\n        } else {\n            this.removeAttribute(\"trigger-type\");\n        }\n    }\n\n    public get placement(): Placement {\n        return this.getAttribute(\"placement\") as Placement;\n    }\n\n    public set placement(placement: Placement) {\n        if (placement) {\n            this.setAttribute(\"placement\", placement);\n        } else {\n            this.removeAttribute(\"placement\");\n        }\n    }\n\n    public get targetElement(): HTMLElement {\n        return this._targetElement;\n    }\n\n    public set targetElement(element: HTMLElement) {\n        this.removeTargetEventListener(this.targetElement);\n        if (this._targetElement && \"true\" == this._targetElement.getAttribute(\"aria-expanded\")) {\n            this._targetElement.setAttribute(\"aria-expanded\", \"false\");\n        }\n        this._targetElement = element;\n        element.setAttribute(\"aria-expanded\", \"false\");\n        this.addTargetEventListener(this.targetElement);\n        this.updatePopper();\n    }\n\n    public get targetSelector(): string {\n        return this.getAttribute(\"target-selector\");\n    }\n\n    public set targetSelector(selector: string) {\n        if (selector) {\n            this.setAttribute(\"target-selector\", selector);\n        } else {\n            this.removeAttribute(\"target-selector\");\n        }\n    }\n\n    public get modal(): boolean {\n        return this.hasAttribute(\"modal\");\n    }\n\n    public set modal(modal: boolean) {\n        if (modal) {\n            this.setAttribute(\"modal\", \"\");\n        } else {\n            this.removeAttribute(\"modal\");\n        }\n    }\n\n    public get popoverFor(): string {\n        return this.getAttribute(\"popover-for\");\n    }\n\n    public set popoverFor(popoverFor: string) {\n        if (popoverFor) {\n            this.setAttribute(\"popover-for\", popoverFor);\n        } else {\n            this.removeAttribute(\"popover-for\");\n        }\n    }\n\n    public get flipPriority(): Placement[] {\n        return this._flipPriority;\n    }\n\n    public set flipPriority(priority: Placement[]) {\n        if (priority && priority.length > 0) {\n            this._flipPriority = priority;\n        } else {\n            this._flipPriority = null;\n        }\n        this.reConfigurePopper();\n    }\n\n    public get offset(): number {\n        return this.getAttribute(\"offset\") ? parseInt(this.getAttribute(\"offset\")) : 0;\n    }\n\n    public set offset(offset: number) {\n        if (offset) {\n            this.setAttribute(\"offset\", offset.toString());\n        } else {\n            this.removeAttribute(\"offset\");\n        }\n        this.reConfigurePopper();\n    }\n\n    private reConfigurePopper() {\n        if (this._popper) {\n            this.configurePopper();\n        }\n    }\n\n    public get noArrow(): boolean {\n        return this.hasAttribute(\"no-arrow\");\n    }\n\n    public set noArrow(noArrow: boolean) {\n        if (noArrow) {\n            this.setAttribute(\"no-arrow\", \"\");\n        } else {\n            this.removeAttribute(\"no-arrow\");\n        }\n    }\n\n    static get observedAttributes(): string[] {\n        return [\"placement\", \"target-selector\", \"trigger-type\"];\n    }\n\n    public attributeChangedCallback(name: string, oldValue: string): void {\n        switch (name) {\n            case \"placement\": {\n                this.updatePopper();\n                break;\n            }\n            case \"trigger-type\": {\n                this.removeTargetEventListener(this.targetElement);\n                this.addTargetEventListener(this.targetElement);\n                break;\n            }\n            case \"target-selector\": {\n                this.handleTargetSelectorChange(oldValue);\n                break;\n            }\n        }\n    }\n\n    public connectedCallback(): void {\n        if (!this._firstUpdated) {\n            this.firstUpdated();\n            this._firstUpdated = true;\n        }\n        if (this.targetElement) {\n            this.addTargetEventListener(this.targetElement);\n        } else if (this.targetSelector) {\n            // The browser is currently attaching html nodes to the dom tree, the target may not be present in it yet.\n            requestAnimationFrame(() => {\n                if (this.isConnected) {\n                    this.handleTargetSelectorChange(null);\n                }\n            });\n        }\n\n        this._arrow = document.createElement(\"div\");\n        this._arrow.classList.add(\"popover-arrow\");\n        this._arrow.setAttribute(\"data-popper-arrow\", \"\");\n        this._arrow.style.display = \"flex\";\n        this._arrow.innerHTML = arrowSvg;\n    }\n\n    public disconnectedCallback(): void {\n        if (this.targetElement) {\n            this.removeTargetEventListener(this.targetElement);\n            this.removeTargetClassForOpen(this.targetElement);\n        }\n        if (this._resizeObserver) {\n            this._resizeObserver.disconnect();\n            this._resizeObserver = null;\n        }\n    }\n\n    public toggle = (): void => {\n        this.open = !this.open;\n    };\n\n    public show = (): void => {\n        this.open = true;\n    };\n\n    public hide = (): void => {\n        this.open = false;\n    };\n\n    private firstUpdated(): void {\n        this.style.display = \"none\";\n        this.triggerType = this.triggerType || \"click\";\n        this.placement = this.placement || \"auto\";\n    }\n\n    private get open(): boolean {\n        return this._open;\n    }\n\n    private set open(open: boolean) {\n        if (open !== this._open) {\n            this._open = open;\n            this.handleOpenChange();\n        }\n    }\n\n    private handleOpenChange(): void {\n        if (this.open) {\n            if (!this._popper) {\n                this.configurePopper();\n            }\n\n            this._container.innerHTML = \"\";\n            if (this.popoverFor) {\n                this._container.setAttribute(\"popover-for\", this.popoverFor);\n            }\n            if (this.content) {\n                this._container.prepend(this.content);\n                Object.assign(this.content.style, {\n                    position: \"relative\",\n                    display: \"block\",\n                    zIndex: 1,\n                });\n                window.requestAnimationFrame(() => {\n                    let backgroundColor = getComputedStyle(this.content).backgroundColor;\n                    if (backgroundColor == \"rgba(0, 0, 0, 0)\") {\n                        this.content.style.background = backgroundColor = \"#f2f2f2\";\n                    }\n                    (this._arrow.querySelector(\".arrow-background\") as HTMLElement).style.fill = backgroundColor;\n                });\n            }\n            this.ensureArrowIsAdded();\n            this.ownerDocument.body.appendChild(this._container);\n            this.updatePopper();\n            this.setAttribute(\"open\", \"\");\n\n            if (this.modal) {\n                window.addEventListener(\"click\", this.hideIfExternalTarget, { capture: true });\n                window.addEventListener(\"focus\", this.hideIfExternalTarget, { capture: true });\n            }\n            if (this.targetElement) {\n                this.addTargetClassForOpen(this.targetElement);\n                this.targetElement.setAttribute(\"aria-expanded\", \"true\");\n            }\n            this.dispatchEvent(new CustomEvent(\"open\"));\n        } else {\n            this.ownerDocument.body.removeChild(this._container);\n            this.removeAttribute(\"open\");\n            window.removeEventListener(\"click\", this.hideIfExternalTarget, { capture: true });\n            window.removeEventListener(\"focus\", this.hideIfExternalTarget, { capture: true });\n\n            if (this.targetElement) {\n                this.removeTargetClassForOpen(this.targetElement);\n                this.targetElement.setAttribute(\"aria-expanded\", \"false\");\n            }\n            this.dispatchEvent(new CustomEvent(\"close\"));\n        }\n    }\n\n    private hideIfExternalTarget = (event: Event) => {\n        const target = event.target;\n        if (\n            !(target instanceof HTMLElement) ||\n            (!this._container.contains(target) && !this.targetElement.contains(target))\n        ) {\n            this.hide();\n        }\n    };\n\n    private handleTargetSelectorChange(oldValue: string): void {\n        const oldTarget = document.querySelector<HTMLElement>(oldValue);\n        if (oldTarget) {\n            this.removeTargetEventListener(oldTarget);\n            this.removeTargetClassForOpen(oldTarget);\n        }\n        if (this.targetSelector) {\n            this.targetElement = document.querySelector(this.targetSelector);\n            this.addTargetEventListener(this.targetElement);\n        }\n    }\n\n    private addTargetEventListener(target: HTMLElement): void {\n        if (target) {\n            switch (this.triggerType) {\n                case \"hover\": {\n                    target.addEventListener(\"mouseenter\", this.show);\n                    target.addEventListener(\"mouseleave\", this.hide);\n                    break;\n                }\n                case \"click\": {\n                    target.addEventListener(\"click\", this.toggle);\n                    break;\n                }\n            }\n        }\n    }\n\n    private removeTargetEventListener(target: HTMLElement): void {\n        if (target) {\n            switch (this.triggerType) {\n                case \"hover\": {\n                    target.removeEventListener(\"mouseenter\", this.show);\n                    target.removeEventListener(\"mouseleave\", this.hide);\n                    break;\n                }\n                case \"click\": {\n                    target.removeEventListener(\"click\", this.toggle);\n                    break;\n                }\n            }\n        }\n    }\n\n    private configurePopper(): void {\n        this.createContentContainer();\n        // In popper.js 2 the arrow needs to be added before calling Popper#createPopper\n        this.ensureArrowIsAdded();\n\n        // eslint-disable-next-line @typescript-eslint/no-this-alias\n        const popover = this;\n        const options: Options = {\n            placement: popover.placement as Placement,\n            strategy: \"absolute\",\n            modifiers: [\n                {\n                    name: \"computeStyles\",\n                    options: {\n                        gpuAcceleration: !isIE11,\n                    },\n                },\n                {\n                    name: \"flip\",\n                    options: {\n                        fallbackPlacements: popover._flipPriority,\n                    },\n                },\n                {\n                    name: \"offset\",\n                    options: {\n                        offset: () => {\n                            return [\n                                0,\n                                popover.noArrow ? 0 + popover.offset : this._arrow.clientHeight + popover.offset,\n                            ];\n                        },\n                    },\n                },\n                {\n                    name: \"arrow\",\n                    options: {\n                        padding: 6, // Avoid to reach the edges of the popper element with the arrow\n                    },\n                },\n                {\n                    name: \"resetArrowStyles\",\n                    enabled: true,\n                    phase: \"beforeWrite\",\n                    fn({ state }) {\n                        Object.assign(popover._arrow.style, {\n                            top: state.styles.arrow.top || \"\",\n                            left: state.styles.arrow.left || \"\",\n                            bottom: state.styles.arrow.bottom || \"\",\n                            right: state.styles.arrow.right || \"\",\n                        });\n                    },\n                },\n                {\n                    name: \"onUpdate\",\n                    enabled: true,\n                    phase: \"afterWrite\",\n                    fn({ state }) {\n                        popover.updateArrow(state.placement);\n                    },\n                },\n            ],\n        };\n        this._popper = createPopper(this.targetElement, this._container, options);\n    }\n\n    private createContentContainer(): void {\n        this._container = document.createElement(\"div\");\n        this._container.classList.add(\"popover-container\");\n        this._container.tabIndex = 0;\n        if (this._resizeObserver) {\n            this._resizeObserver.disconnect();\n        }\n        this._resizeObserver = new ResizeObserver(() => {\n            if (this._popper) {\n                this._popper.update();\n            }\n        });\n        this._resizeObserver.observe(this._container);\n        Object.assign(this._container.style, {\n            boxShadow: `0 4px 5px 0 rgba(0, 0, 0, 0.14),\n                        0 1px 10px 0 rgba(0, 0, 0, 0.12),\n                        0 2px 4px -1px rgba(0, 0, 0, 0.4)`,\n            border: \"1px solid #999\",\n            boxSizing: \"border-box\",\n            zIndex: 20000,\n        });\n    }\n\n    private ensureArrowIsAdded() {\n        if (!this.noArrow && !this._container.contains(this._arrow)) {\n            this._container.appendChild(this._arrow);\n        }\n    }\n\n    public updatePopper(): void {\n        if (this._popper) {\n            this._popper.state.elements.reference = this.targetElement;\n            this._popper.state.options.placement = this.placement;\n\n            if (this.open) {\n                this._popper.update();\n            }\n        }\n    }\n\n    private updateArrow(placement: Placement): void {\n        if (this._arrow) {\n            const arrowVariant = this.getArrowVariant(placement);\n            this._arrow.setAttribute(\"variant\", arrowVariant);\n            if (this._content) {\n                const svg = this._arrow.querySelector(\"svg\");\n\n                const arrowWidth = this._arrow.clientWidth;\n                const arrowHeight = this._arrow.clientHeight;\n                const verticalOffset = `-${arrowHeight - arrowOverlapOffset}px`;\n\n                const horizontalTransformationOffset = (arrowWidth - arrowHeight) / 2;\n                // Note that arrowHeight is used on purpose for the horizontalOffset\n                // as this is the height of the unrotated wrapper div which defines the gap between the\n                // reference element and the popover.\n                const horizontalOffset = `-${arrowHeight + horizontalTransformationOffset - arrowOverlapOffset}px`;\n\n                switch (arrowVariant) {\n                    case \"bottom\": {\n                        this._arrow.style.top = verticalOffset;\n                        svg.style.transform = \"rotate(180deg)\";\n                        break;\n                    }\n                    case \"top\": {\n                        this._arrow.style.bottom = verticalOffset;\n                        svg.style.transform = \"rotate(0deg)\";\n                        break;\n                    }\n                    case \"left\": {\n                        this._arrow.style.right = horizontalOffset;\n                        svg.style.transform = \"rotate(270deg)\";\n                        break;\n                    }\n                    case \"right\": {\n                        this._arrow.style.left = horizontalOffset;\n                        svg.style.transform = \"rotate(90deg)\";\n                        break;\n                    }\n                }\n            }\n        }\n    }\n\n    private getArrowVariant(placement: Placement): ArrowVariant {\n        if (placement.indexOf(\"bottom\") !== -1) {\n            return \"bottom\";\n        } else if (placement.indexOf(\"top\") !== -1) {\n            return \"top\";\n        } else if (placement.indexOf(\"left\") !== -1) {\n            return \"left\";\n        } else if (placement.indexOf(\"right\") !== -1) {\n            return \"right\";\n        }\n    }\n\n    private get content(): HTMLElement {\n        if (!this._content) {\n            this._content = this.firstElementChild as HTMLElement;\n            this._content.setAttribute(\"data-popper-content\", \"\");\n        }\n        return this._content;\n    }\n\n    private addTargetClassForOpen(target: HTMLElement): void {\n        if (target) {\n            target.classList.add(targetClassOpen);\n        }\n    }\n\n    private removeTargetClassForOpen(target: HTMLElement): void {\n        if (target) {\n            target.classList.remove(targetClassOpen);\n        }\n    }\n}\n\nif (!customElements.get(Popover.ID)) {\n    customElements.define(Popover.ID, Popover);\n}\n"],"names":["arrowSvg","isIE11","arrowOverlapOffset","targetClassOpen","_Popover","event","target","type","placement","element","selector","modal","popoverFor","priority","offset","noArrow","name","oldValue","open","backgroundColor","oldTarget","popover","options","state","createPopper","arrowVariant","svg","arrowWidth","arrowHeight","verticalOffset","horizontalTransformationOffset","horizontalOffset","Popover"],"mappings":"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"}

package/npm-third-party-licenses.json

@@ -0,0 +1,192 @@
+{
+    "@cypress/vite-dev-server@5.0.7": {
+        "licenses": "MIT",
+        "repository": "https://github.com/cypress-io/cypress",
+        "licenseUrl": "https://github.com/cypress-io/cypress/tree/develop/npm/vite-dev-server#readme"
+    },
+    "@popperjs/core@2.11.8": {
+        "licenses": "MIT",
+        "repository": "https://github.com/popperjs/popper-core",
+        "licenseUrl": "https://github.com/popperjs/popper-core/raw/HEAD/LICENSE.md"
+    },
+    "@rollup/plugin-node-resolve@15.2.3": {
+        "licenses": "MIT",
+        "repository": "https://github.com/rollup/plugins",
+        "licenseUrl": "https://github.com/rollup/plugins/raw/HEAD/LICENSE"
+    },
+    "@types/node@20.10.6": {
+        "licenses": "MIT",
+        "repository": "https://github.com/DefinitelyTyped/DefinitelyTyped",
+        "licenseUrl": "https://github.com/DefinitelyTyped/DefinitelyTyped/raw/HEAD/LICENSE"
+    },
+    "@types/postcss-prefix-selector@1.16.3": {
+        "licenses": "MIT",
+        "repository": "https://github.com/DefinitelyTyped/DefinitelyTyped",
+        "licenseUrl": "https://github.com/DefinitelyTyped/DefinitelyTyped/raw/HEAD/LICENSE"
+    },
+    "@typescript-eslint/eslint-plugin@6.17.0": {
+        "licenses": "MIT",
+        "repository": "https://github.com/typescript-eslint/typescript-eslint",
+        "licenseUrl": "https://github.com/typescript-eslint/typescript-eslint/raw/HEAD/LICENSE"
+    },
+    "@typescript-eslint/parser@6.17.0": {
+        "licenses": "BSD-2-Clause",
+        "repository": "https://github.com/typescript-eslint/typescript-eslint",
+        "licenseUrl": "https://github.com/typescript-eslint/typescript-eslint/raw/HEAD/LICENSE"
+    },
+    "@vitest/coverage-v8@1.1.1": {
+        "licenses": "MIT",
+        "repository": "https://github.com/vitest-dev/vitest",
+        "licenseUrl": "https://github.com/vitest-dev/vitest/raw/HEAD/LICENSE"
+    },
+    "@vitest/ui@1.1.1": {
+        "licenses": "MIT",
+        "repository": "https://github.com/vitest-dev/vitest",
+        "licenseUrl": "https://github.com/vitest-dev/vitest/raw/HEAD/LICENSE"
+    },
+    "axe-core@4.8.3": {
+        "licenses": "MPL-2.0",
+        "repository": "https://github.com/dequelabs/axe-core",
+        "licenseUrl": "https://github.com/dequelabs/axe-core/raw/HEAD/LICENSE"
+    },
+    "cypress-axe@1.5.0": {
+        "licenses": "MIT",
+        "repository": "https://github.com/component-driven/cypress-axe",
+        "licenseUrl": "https://github.com/component-driven/cypress-axe/raw/HEAD/License.md"
+    },
+    "cypress-real-events@1.13.0": {
+        "licenses": "MIT",
+        "repository": "https://github.com/dmtrKovalenko/cypress-real-events",
+        "licenseUrl": "https://github.com/dmtrKovalenko/cypress-real-events"
+    },
+    "cypress@13.6.2": {
+        "licenses": "MIT",
+        "repository": "https://github.com/cypress-io/cypress",
+        "licenseUrl": "https://cypress.io"
+    },
+    "esbuild@0.19.11": {
+        "licenses": "MIT",
+        "repository": "https://github.com/evanw/esbuild",
+        "licenseUrl": "https://github.com/evanw/esbuild/raw/HEAD/LICENSE.md"
+    },
+    "eslint-config-google@0.14.0": {
+        "licenses": "Apache-2.0",
+        "repository": "https://github.com/google/eslint-config-google",
+        "licenseUrl": "https://github.com/google/eslint-config-google/raw/HEAD/LICENSE"
+    },
+    "eslint-config-prettier@9.1.0": {
+        "licenses": "MIT",
+        "repository": "https://github.com/prettier/eslint-config-prettier",
+        "licenseUrl": "https://github.com/prettier/eslint-config-prettier/raw/HEAD/LICENSE"
+    },
+    "eslint@8.56.0": {
+        "licenses": "MIT",
+        "repository": "https://github.com/eslint/eslint",
+        "licenseUrl": "https://github.com/eslint/eslint/raw/HEAD/LICENSE"
+    },
+    "github-markdown-css@5.5.0": {
+        "licenses": "MIT",
+        "repository": "https://github.com/sindresorhus/github-markdown-css",
+        "licenseUrl": "https://github.com/sindresorhus/github-markdown-css/raw/HEAD/license"
+    },
+    "highlight.js@11.9.0": {
+        "licenses": "BSD-3-Clause",
+        "repository": "https://github.com/highlightjs/highlight.js",
+        "licenseUrl": "https://github.com/highlightjs/highlight.js/raw/HEAD/LICENSE"
+    },
+    "junit-report-builder@3.1.0": {
+        "licenses": "MIT",
+        "repository": "https://github.com/davidparsson/junit-report-builder",
+        "licenseUrl": "https://github.com/davidparsson/junit-report-builder/raw/HEAD/LICENSE"
+    },
+    "lint-staged@15.2.0": {
+        "licenses": "MIT",
+        "repository": "https://github.com/okonet/lint-staged",
+        "licenseUrl": "https://github.com/okonet/lint-staged/raw/HEAD/LICENSE"
+    },
+    "marked@11.1.1": {
+        "licenses": "MIT",
+        "repository": "https://github.com/markedjs/marked",
+        "licenseUrl": "https://github.com/markedjs/marked/raw/HEAD/LICENSE.md"
+    },
+    "postcss-prefix-selector@1.16.0": {
+        "licenses": "MIT",
+        "repository": "https://github.com/RadValentin/postcss-prefix-selector",
+        "licenseUrl": "https://github.com/RadValentin/postcss-prefix-selector/raw/HEAD/LICENSE"
+    },
+    "postcss@8.4.32": {
+        "licenses": "MIT",
+        "repository": "https://github.com/postcss/postcss",
+        "licenseUrl": "https://github.com/postcss/postcss/raw/HEAD/LICENSE"
+    },
+    "prettier@3.1.1": {
+        "licenses": "MIT",
+        "repository": "https://github.com/prettier/prettier",
+        "licenseUrl": "https://github.com/prettier/prettier/raw/HEAD/LICENSE"
+    },
+    "resolve-pkg@2.0.0": {
+        "licenses": "MIT",
+        "repository": "https://github.com/sindresorhus/resolve-pkg",
+        "licenseUrl": "https://github.com/sindresorhus/resolve-pkg/raw/HEAD/license"
+    },
+    "sass@1.69.6": {
+        "licenses": "MIT",
+        "repository": "https://github.com/sass/dart-sass",
+        "licenseUrl": "https://github.com/sass/dart-sass/raw/HEAD/LICENSE"
+    },
+    "stylelint-config-recommended-scss@14.0.0": {
+        "licenses": "MIT",
+        "repository": "https://github.com/stylelint-scss/stylelint-config-recommended-scss",
+        "licenseUrl": "https://github.com/stylelint-scss/stylelint-config-recommended-scss/raw/HEAD/LICENSE"
+    },
+    "stylelint-config-standard@36.0.0": {
+        "licenses": "MIT",
+        "repository": "https://github.com/stylelint/stylelint-config-standard",
+        "licenseUrl": "https://github.com/stylelint/stylelint-config-standard/raw/HEAD/LICENSE"
+    },
+    "stylelint-scss@6.0.0": {
+        "licenses": "MIT",
+        "repository": "https://github.com/stylelint-scss/stylelint-scss",
+        "licenseUrl": "https://github.com/stylelint-scss/stylelint-scss/raw/HEAD/LICENSE"
+    },
+    "stylelint@16.1.0": {
+        "licenses": "MIT",
+        "repository": "https://github.com/stylelint/stylelint",
+        "licenseUrl": "https://github.com/stylelint/stylelint/raw/HEAD/LICENSE"
+    },
+    "tsup@8.0.1": {
+        "licenses": "MIT",
+        "repository": "https://github.com/egoist/tsup",
+        "licenseUrl": "https://github.com/egoist/tsup/raw/HEAD/LICENSE"
+    },
+    "turbo@1.11.2": {
+        "licenses": "MPL-2.0",
+        "repository": "https://github.com/vercel/turbo",
+        "licenseUrl": "https://github.com/vercel/turbo/raw/HEAD/LICENSE"
+    },
+    "typescript@5.3.3": {
+        "licenses": "Apache-2.0",
+        "repository": "https://github.com/Microsoft/TypeScript",
+        "licenseUrl": "https://github.com/Microsoft/TypeScript/raw/HEAD/LICENSE.txt"
+    },
+    "vite-tsconfig-paths@4.2.3": {
+        "licenses": "MIT",
+        "repository": "https://github.com/aleclarson/vite-tsconfig-paths",
+        "licenseUrl": "https://github.com/aleclarson/vite-tsconfig-paths/raw/HEAD/LICENSE"
+    },
+    "vite@5.0.10": {
+        "licenses": "MIT",
+        "repository": "https://github.com/vitejs/vite",
+        "licenseUrl": "https://github.com/vitejs/vite/raw/HEAD/LICENSE.md"
+    },
+    "vitest@1.1.1": {
+        "licenses": "MIT",
+        "repository": "https://github.com/vitest-dev/vitest",
+        "licenseUrl": "https://github.com/vitest-dev/vitest/raw/HEAD/LICENSE.md"
+    },
+    "yargs@17.7.2": {
+        "licenses": "MIT",
+        "repository": "https://github.com/yargs/yargs",
+        "licenseUrl": "https://github.com/yargs/yargs/raw/HEAD/LICENSE"
+    }
+}

package/package.json

@@ -0,0 +1,33 @@
+{
+  "name": "@cas-smartdesign/popover",
+  "version": "4.1.1",
+  "description": "A popover element which appears next to its target when triggered",
+  "main": "dist/popover-with-externals.js",
+  "module": "dist/popover.mjs",
+  "types": "dist/popover.d.ts",
+  "license": "SEE LICENSE IN LICENSE",
+  "dependencies": {
+    "@popperjs/core": "^2.11.8"
+  },
+  "files": [
+    "dist",
+    "npm-third-party-licenses.json"
+  ],
+  "publishConfig": {
+    "registry": "https://registry.npmjs.org/",
+    "access": "public"
+  },
+  "devDependencies": {
+    "@cas-smartdesign/element-preview": "^0.2.1",
+    "@cas-smartdesign/license-generator": "^1.6.1"
+  },
+  "scripts": {
+    "version": "pnpm version",
+    "generate-declaration": "tsc -p tsconfig.types.json",
+    "build:no-license": "vite build && pnpm generate-declaration && vite build --mode documentation",
+    "build": "pnpm generate-license && pnpm build:no-license",
+    "watch": "vite build --watch",
+    "dev": "vite",
+    "generate-license": "sd-license-generator --r ../../"
+  }
+}

package/readme.md

@@ -0,0 +1,69 @@
+# @cas-smartdesign/popover
+
+A popover element with SmartDesign look & feel.
+
+## Attributes
+
+- `placement`: **_string (default: "auto")_**
+  - Defines the placement of the popper relative to the reference element
+  - Valid placements are: `auto`, `top`, `right`, `bottom`, `left`
+  - Each placement can have a variation from this list: `-start`, `-end`
+  - The `auto` placement will place the window on the side with more space available.
+- `target-selector`: **_string (default: "")_**
+  - Defines the selector to use to find the target element
+- `trigger-type` **_string (default: "click")_**
+  - Defines the type of event for which the popover should open
+  - Valid values are:
+    - `click` - clicking on the target element
+    - `hover` - moving the cursor on the target element
+    - `manual` - no event handler will be set up, the popover can be opened programatically by calling the `show` method and hid by calling the `hide` method
+- `modal` **_boolean (default: false)_**
+  - Defines whether the popover is modal and closed on clicks or focusing outside of the content or target element.
+- `no-arrow` **_boolean (default: false)_**
+  - Defines whether the popover contains an arrow pointing to the reference element.
+- `popover-for` **_string (default: "")_**
+  - This value is mirrored to the opened popover-container.
+  - By that the popover can be identified for example for styling purposes.
+- `offset` **_string (default: "0")_**
+  - The offset attribute lets you displace a popper element from its reference element.
+
+## Properties
+
+- `placement`: Placement
+  - Reflects the corresponding attribute
+- `targetSelector`: string
+  - Reflects the corresponding attribute
+- `triggerType`: TriggerType
+  - Reflects the corresponding attribute
+- `modal`: boolean
+  - Reflects the corresponding attribute
+- `noArrow`: boolean
+  - Reflects the corresponding attribute
+- `popoverFor`: string
+  - Reflects the corresponding attribute
+- `flipPriority`: Position[]
+  - Defines the preferred order of positions to place the window in order to prevent overflow
+- `offset`: number
+  - Reflects the correspondig attribute
+
+## Public methods
+
+- `show`
+  - Sets the `open` attribute to true, thus showing the popover
+- `hide`
+  - Sets the `open` attribute to false, thus hiding the popover
+- `toggle`
+  - Negates the value of the `open` attribute
+
+## Custom events
+
+- `open`
+  - Dispatched when the popover has opened.
+- `close`
+  - Dispatched when the popover has closed.
+
+## Adding a child element
+
+- The first child element represents the content of the popover window.
+
+## Examples