genesys-spark-components 3.0.0

package/dist/esm/gux-popup.entry.js

@@ -0,0 +1,62 @@
+import { r as registerInstance, h } from './index-ae6f2f18.js';
+import { c as createPopper } from './popper-93ecb064.js';
+
+const guxPopupCss = ".gux-target-container.gux-disabled{pointer-events:none;cursor:default;opacity:0.5}.gux-popup-container{z-index:1;visibility:hidden}.gux-popup-container.gux-expanded{visibility:visible}";
+
+const GuxPopup = class {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+    this.expanded = false;
+    this.disabled = false;
+  }
+  onExpandedChange(expanded) {
+    if (expanded) {
+      this.popperInstance.forceUpdate();
+    }
+  }
+  componentDidLoad() {
+    this.popperInstance = createPopper(this.targetElementContainer, this.popupElementContainer, {
+      modifiers: [
+        {
+          name: 'offset',
+          options: {
+            offset: [0, 2]
+          }
+        },
+        {
+          name: 'sameWidth',
+          enabled: true,
+          phase: 'beforeWrite',
+          requires: ['computeStyles'],
+          // eslint-disable-next-line @typescript-eslint/typedef
+          fn({ state }) {
+            state.styles.popper.width = `${state.rects.reference.width}px`;
+          },
+          // eslint-disable-next-line @typescript-eslint/typedef
+          effect({ state }) {
+            state.elements.popper.style.width = `${state.elements.reference.getBoundingClientRect().width}px`;
+          }
+        }
+      ],
+      placement: 'bottom-start'
+    });
+  }
+  disconnectedCallback() {
+    this.popperInstance.destroy();
+  }
+  render() {
+    return (h("div", { class: {
+        'gux-target-container': true,
+        'gux-disabled': this.disabled
+      }, ref: (el) => (this.targetElementContainer = el) }, h("slot", { name: "target" }), h("div", { class: {
+        'gux-popup-container': true,
+        'gux-expanded': this.expanded && !this.disabled
+      }, ref: (el) => (this.popupElementContainer = el) }, h("slot", { name: "popup" }))));
+  }
+  static get watchers() { return {
+    "expanded": ["onExpandedChange"]
+  }; }
+};
+GuxPopup.style = guxPopupCss;
+
+export { GuxPopup as gux_popup };