@beeq/core 1.12.14-beta.0 → 1.13.1

package/dist/collection/services/libraries/floating-ui/index.js

@@ -3,11 +3,28 @@
  * © https://beeq.design - Apache 2 License.
  */
 import { arrow, autoUpdate, computePosition, flip, hide, offset, shift, size, } from "@floating-ui/dom";
+const STATIC_SIDE_BY_PLACEMENT = {
+    top: 'bottom',
+    right: 'left',
+    bottom: 'top',
+    left: 'right',
+};
+/**
+ * Thin wrapper around Floating UI that owns the shared middleware pipeline
+ * and ensures each instance has at most one `autoUpdate` subscription.
+ *
+ * Lifecycle:
+ * - `start()` starts position tracking and performs an initial reposition.
+ * - `stop()` stops tracking and invalidates pending positioning results.
+ * - `reposition()` computes and applies the position once.
+ * - `configure(options)` updates options and repositions only when active.
+ */
 export class FloatingUI {
     panel;
     trigger;
     options;
-    cleanUp;
+    cleanup;
+    repositionId = 0;
     constructor(trigger, panel, options) {
         this.trigger = trigger;
         this.panel = panel;
@@ -18,74 +35,92 @@ export class FloatingUI {
             sameWidth: false,
             ...options,
         };
-        this.init(options);
     }
-    init(options) {
-        this.options = Object.assign(this.options, options);
-        this.update();
+    /**
+     * Merges new options into the current configuration. Active instances
+     * reposition without recreating their `autoUpdate` subscription; stopped
+     * instances apply the options the next time they start.
+     */
+    configure(options) {
+        Object.assign(this.options, options);
+        this.repositionId += 1;
+        if (options.sameWidth === false) {
+            this.panel.style.width = '';
+        }
+        if (!this.cleanup)
+            return;
+        void this.reposition();
     }
-    update() {
-        this.cleanUp = autoUpdate(this.trigger, this.panel, () => {
-            (async () => {
-                const { x, y, placement, middlewareData } = await computePosition(this.trigger, this.panel, {
-                    placement: this.options.placement,
-                    strategy: this.options.strategy,
-                    middleware: [
-                        offset({ mainAxis: this.options.distance, crossAxis: this.options.skidding }),
-                        flip(),
-                        shift(),
-                        size(this.options.sameWidth && {
-                            apply({ rects, elements }) {
-                                Object.assign(elements.floating.style, {
-                                    width: `${rects.reference.width}px`,
-                                });
-                            },
-                        }),
-                        arrow({ element: this.options.arrow || null }),
-                        this.positionChange(),
-                        hide(),
-                    ],
-                });
-                this.applyPanelPosition(x, y);
-                this.applyArrowPosition(placement, middlewareData);
-                this.applyVisibility(middlewareData);
-            })();
-        });
+    /**
+     * Opens the `autoUpdate` subscription so the panel keeps tracking the
+     * trigger through scroll, resize, layout and ancestor changes. No-op if
+     * the subscription is already running.
+     */
+    start() {
+        if (this.cleanup)
+            return;
+        this.cleanup = autoUpdate(this.trigger, this.panel, () => void this.reposition());
     }
-    destroy() {
-        if (!this.cleanUp)
+    /**
+     * Tears down the `autoUpdate` subscription. Idempotent — safe to call
+     * multiple times, and before the first `start()`.
+     */
+    stop() {
+        this.repositionId += 1;
+        if (!this.cleanup)
             return;
-        this.cleanUp();
+        this.cleanup();
+        this.cleanup = undefined;
     }
-    positionChange() {
-        return {
-            name: 'positionChange',
-            fn: ({ placement: position }) => {
-                if (typeof this.options.onPositionChange !== 'function')
-                    return {};
-                this.options.onPositionChange(position);
-                return {};
-            },
-        };
+    /**
+     * Runs a single Floating UI `computePosition` pass and applies the
+     * resulting styles to the panel (and the arrow, if configured).
+     */
+    async reposition() {
+        const repositionId = ++this.repositionId;
+        const { arrow: arrowElement, distance, onPositionChange, placement: configuredPlacement, sameWidth, skidding, strategy, } = this.options;
+        const { x, y, placement, middlewareData } = await computePosition(this.trigger, this.panel, {
+            placement: configuredPlacement,
+            strategy,
+            middleware: [
+                offset({ mainAxis: distance, crossAxis: skidding }),
+                flip(),
+                shift(),
+                size({
+                    apply: ({ rects, elements }) => {
+                        if (repositionId !== this.repositionId || !elements.floating.isConnected)
+                            return;
+                        elements.floating.style.width = sameWidth ? `${rects.reference.width}px` : '';
+                    },
+                }),
+                ...(arrowElement ? [arrow({ element: arrowElement })] : []),
+                hide(),
+            ],
+        });
+        if (repositionId !== this.repositionId || !this.panel.isConnected)
+            return;
+        this.applyPanelPosition(x, y);
+        this.applyArrowPosition(arrowElement, placement, middlewareData);
+        this.applyVisibility(middlewareData);
+        onPositionChange?.(placement);
     }
     applyPanelPosition(x, y) {
+        const dpr = window.devicePixelRatio || 1;
+        const roundedX = Math.round(x * dpr) / dpr;
+        const roundedY = Math.round(y * dpr) / dpr;
         Object.assign(this.panel.style, {
             top: '0',
             left: '0',
-            transform: `translate(${this.roundByDPR(x)}px,${this.roundByDPR(y)}px)`,
+            transform: `translate(${roundedX}px, ${roundedY}px)`,
         });
     }
-    applyArrowPosition(placement, middlewareData) {
-        if (!this.options.arrow)
+    applyArrowPosition(arrowElement, placement, middlewareData) {
+        if (!arrowElement)
             return;
-        const { x: arrowX, y: arrowY } = middlewareData.arrow;
-        const staticSide = {
-            top: 'bottom',
-            right: 'left',
-            bottom: 'top',
-            left: 'right',
-        }[placement.split('-')[0]];
-        Object.assign(this.options.arrow.style, {
+        const { x: arrowX, y: arrowY } = middlewareData.arrow ?? {};
+        const basePlacement = placement.split('-')[0];
+        const staticSide = STATIC_SIDE_BY_PLACEMENT[basePlacement];
+        Object.assign(arrowElement.style, {
             left: arrowX != null ? `${arrowX}px` : '',
             top: arrowY != null ? `${arrowY}px` : '',
             right: '',
@@ -94,14 +129,8 @@ export class FloatingUI {
         });
     }
     applyVisibility(middlewareData) {
-        const { referenceHidden } = middlewareData.hide;
-        Object.assign(this.panel.style, {
-            visibility: referenceHidden ? 'hidden' : 'visible',
-        });
-    }
-    roundByDPR(value) {
-        const dpr = window.devicePixelRatio || 1;
-        return Math.round(value * dpr) / dpr;
+        const referenceHidden = middlewareData.hide?.referenceHidden;
+        this.panel.style.visibility = referenceHidden ? 'hidden' : 'visible';
     }
 }
 //# sourceMappingURL=index.js.map

package/dist/collection/services/libraries/floating-ui/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../../packages/beeq/src/services/libraries/floating-ui/index.ts"],"names":[],"mappings":"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","sourcesContent":["import {\n  arrow,\n  autoUpdate,\n  computePosition,\n  flip,\n  hide,\n  type MiddlewareData,\n  offset,\n  type ReferenceElement,\n  shift,\n  size,\n} from '@floating-ui/dom';\n\nimport type { FloatingUIOptions } from '../../interfaces';\n\nexport class FloatingUI {\n  panel: HTMLElement;\n  trigger: ReferenceElement;\n  options: FloatingUIOptions;\n  cleanUp: () => void;\n\n  constructor(trigger: ReferenceElement, panel: HTMLElement, options?: FloatingUIOptions) {\n    this.trigger = trigger;\n    this.panel = panel;\n    this.options = {\n      distance: 20,\n      placement: 'bottom',\n      strategy: 'absolute',\n      sameWidth: false,\n      ...options,\n    };\n    this.init(options);\n  }\n\n  init(options: FloatingUIOptions) {\n    this.options = Object.assign(this.options, options);\n    this.update();\n  }\n\n  update() {\n    this.cleanUp = autoUpdate(this.trigger, this.panel, () => {\n      (async () => {\n        const { x, y, placement, middlewareData } = await computePosition(this.trigger, this.panel, {\n          placement: this.options.placement,\n          strategy: this.options.strategy,\n          middleware: [\n            offset({ mainAxis: this.options.distance, crossAxis: this.options.skidding }),\n            flip(),\n            shift(),\n            size(\n              this.options.sameWidth && {\n                apply({ rects, elements }) {\n                  Object.assign(elements.floating.style, {\n                    width: `${rects.reference.width}px`,\n                  });\n                },\n              },\n            ),\n            arrow({ element: this.options.arrow || null }),\n            this.positionChange(),\n            hide(),\n          ],\n        });\n\n        this.applyPanelPosition(x, y);\n        this.applyArrowPosition(placement, middlewareData);\n        this.applyVisibility(middlewareData);\n      })();\n    });\n  }\n\n  destroy() {\n    if (!this.cleanUp) return;\n    this.cleanUp();\n  }\n\n  positionChange() {\n    return {\n      name: 'positionChange',\n      fn: ({ placement: position }) => {\n        if (typeof this.options.onPositionChange !== 'function') return {};\n        this.options.onPositionChange(position);\n        return {};\n      },\n    };\n  }\n\n  private applyPanelPosition(x: number, y: number) {\n    Object.assign(this.panel.style, {\n      top: '0',\n      left: '0',\n      transform: `translate(${this.roundByDPR(x)}px,${this.roundByDPR(y)}px)`,\n    });\n  }\n\n  private applyArrowPosition(placement: string, middlewareData: MiddlewareData) {\n    if (!this.options.arrow) return;\n\n    const { x: arrowX, y: arrowY } = middlewareData.arrow;\n    const staticSide = {\n      top: 'bottom',\n      right: 'left',\n      bottom: 'top',\n      left: 'right',\n    }[placement.split('-')[0]];\n\n    Object.assign(this.options.arrow.style, {\n      left: arrowX != null ? `${arrowX}px` : '',\n      top: arrowY != null ? `${arrowY}px` : '',\n      right: '',\n      bottom: '',\n      [staticSide]: '-4px',\n    });\n  }\n\n  private applyVisibility(middlewareData: MiddlewareData) {\n    const { referenceHidden } = middlewareData.hide;\n    Object.assign(this.panel.style, {\n      visibility: referenceHidden ? 'hidden' : 'visible',\n    });\n  }\n\n  private roundByDPR(value: number) {\n    const dpr = window.devicePixelRatio || 1;\n    return Math.round(value * dpr) / dpr;\n  }\n}\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../../packages/beeq/src/services/libraries/floating-ui/index.ts"],"names":[],"mappings":"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","sourcesContent":["import {\n  arrow,\n  autoUpdate,\n  computePosition,\n  flip,\n  hide,\n  type MiddlewareData,\n  offset,\n  type Placement,\n  type ReferenceElement,\n  shift,\n  size,\n} from '@floating-ui/dom';\n\nimport type { FloatingUIOptions } from '../../interfaces';\n\nconst STATIC_SIDE_BY_PLACEMENT = {\n  top: 'bottom',\n  right: 'left',\n  bottom: 'top',\n  left: 'right',\n} as const;\n\n/**\n * Thin wrapper around Floating UI that owns the shared middleware pipeline\n * and ensures each instance has at most one `autoUpdate` subscription.\n *\n * Lifecycle:\n * - `start()` starts position tracking and performs an initial reposition.\n * - `stop()` stops tracking and invalidates pending positioning results.\n * - `reposition()` computes and applies the position once.\n * - `configure(options)` updates options and repositions only when active.\n */\nexport class FloatingUI {\n  readonly panel: HTMLElement;\n  readonly trigger: ReferenceElement;\n  readonly options: FloatingUIOptions;\n  private cleanup: (() => void) | undefined;\n  private repositionId = 0;\n\n  constructor(trigger: ReferenceElement, panel: HTMLElement, options?: FloatingUIOptions) {\n    this.trigger = trigger;\n    this.panel = panel;\n    this.options = {\n      distance: 20,\n      placement: 'bottom',\n      strategy: 'absolute',\n      sameWidth: false,\n      ...options,\n    };\n  }\n\n  /**\n   * Merges new options into the current configuration. Active instances\n   * reposition without recreating their `autoUpdate` subscription; stopped\n   * instances apply the options the next time they start.\n   */\n  configure(options: Partial<FloatingUIOptions>): void {\n    Object.assign(this.options, options);\n    this.repositionId += 1;\n\n    if (options.sameWidth === false) {\n      this.panel.style.width = '';\n    }\n    if (!this.cleanup) return;\n\n    void this.reposition();\n  }\n\n  /**\n   * Opens the `autoUpdate` subscription so the panel keeps tracking the\n   * trigger through scroll, resize, layout and ancestor changes. No-op if\n   * the subscription is already running.\n   */\n  start(): void {\n    if (this.cleanup) return;\n\n    this.cleanup = autoUpdate(this.trigger, this.panel, () => void this.reposition());\n  }\n\n  /**\n   * Tears down the `autoUpdate` subscription. Idempotent — safe to call\n   * multiple times, and before the first `start()`.\n   */\n  stop(): void {\n    this.repositionId += 1;\n    if (!this.cleanup) return;\n\n    this.cleanup();\n    this.cleanup = undefined;\n  }\n\n  /**\n   * Runs a single Floating UI `computePosition` pass and applies the\n   * resulting styles to the panel (and the arrow, if configured).\n   */\n  async reposition(): Promise<void> {\n    const repositionId = ++this.repositionId;\n    const {\n      arrow: arrowElement,\n      distance,\n      onPositionChange,\n      placement: configuredPlacement,\n      sameWidth,\n      skidding,\n      strategy,\n    } = this.options;\n    const { x, y, placement, middlewareData } = await computePosition(this.trigger, this.panel, {\n      placement: configuredPlacement,\n      strategy,\n      middleware: [\n        offset({ mainAxis: distance, crossAxis: skidding }),\n        flip(),\n        shift(),\n        size({\n          apply: ({ rects, elements }) => {\n            if (repositionId !== this.repositionId || !elements.floating.isConnected) return;\n            elements.floating.style.width = sameWidth ? `${rects.reference.width}px` : '';\n          },\n        }),\n        ...(arrowElement ? [arrow({ element: arrowElement })] : []),\n        hide(),\n      ],\n    });\n\n    if (repositionId !== this.repositionId || !this.panel.isConnected) return;\n\n    this.applyPanelPosition(x, y);\n    this.applyArrowPosition(arrowElement, placement, middlewareData);\n    this.applyVisibility(middlewareData);\n\n    onPositionChange?.(placement);\n  }\n\n  private applyPanelPosition(x: number, y: number): void {\n    const dpr = window.devicePixelRatio || 1;\n    const roundedX = Math.round(x * dpr) / dpr;\n    const roundedY = Math.round(y * dpr) / dpr;\n\n    Object.assign(this.panel.style, {\n      top: '0',\n      left: '0',\n      transform: `translate(${roundedX}px, ${roundedY}px)`,\n    });\n  }\n\n  private applyArrowPosition(\n    arrowElement: HTMLElement | null | undefined,\n    placement: Placement,\n    middlewareData: MiddlewareData,\n  ): void {\n    if (!arrowElement) return;\n\n    const { x: arrowX, y: arrowY } = middlewareData.arrow ?? {};\n    const basePlacement = placement.split('-')[0] as keyof typeof STATIC_SIDE_BY_PLACEMENT;\n    const staticSide = STATIC_SIDE_BY_PLACEMENT[basePlacement];\n\n    Object.assign(arrowElement.style, {\n      left: arrowX != null ? `${arrowX}px` : '',\n      top: arrowY != null ? `${arrowY}px` : '',\n      right: '',\n      bottom: '',\n      [staticSide]: '-4px',\n    });\n  }\n\n  private applyVisibility(middlewareData: MiddlewareData): void {\n    const referenceHidden = middlewareData.hide?.referenceHidden;\n    this.panel.style.visibility = referenceHidden ? 'hidden' : 'visible';\n  }\n}\n"]}

package/dist/collection/shared/test-utils/computedStyle.js

@@ -3,32 +3,32 @@
  * © https://beeq.design - Apache 2 License.
  */
 /**
- * Enhances page to retrieve element style by a given selector
- * @param {E2EPage} page - stencil instance of puppeteer page
- * @param {String} selector - selector to be passed to querySelector, it supports stencil `>>>` selector
- * @returns {Object} style declaration
+ * Retrieves computed CSS styles for an element, with support for shadow DOM piercing via `>>>` selector.
+ * Works directly with the DOM (designed for browser-mode e2e tests).
+ *
+ * @param {string} selector - CSS selector, supports `>>>` to pierce into shadow DOM
+ * @param {ReadonlyArray<T>} [filter] - Optional list of CSS property names to return
+ * @returns {Pick<CSSStyleDeclaration, T>} The computed style (filtered if specified)
  */
-export const computedStyle = (page, selector, filter) => {
-    return page.evaluate((querySelector, filter) => {
-        const [lightDomSelector, shadowDomSelector] = querySelector.split('>>>');
-        let element = document.querySelector(lightDomSelector);
+export const computedStyle = (selector, filter) => {
+    const [lightDomSelector, shadowDomSelector] = selector.split('>>>').map((s) => s.trim());
+    let element = document.querySelector(lightDomSelector);
+    if (!element) {
+        throw new Error(`Could not find element ${lightDomSelector}`);
+    }
+    if (shadowDomSelector) {
+        element = element.shadowRoot?.querySelector(shadowDomSelector) ?? null;
         if (!element) {
-            throw new Error(`Could not find element ${lightDomSelector}`);
+            throw new Error(`Could not find element ${shadowDomSelector}`);
         }
-        if (shadowDomSelector) {
-            element = element.shadowRoot.querySelector(shadowDomSelector);
-            if (!element) {
-                throw new Error(`Could not find element ${shadowDomSelector}`);
-            }
-        }
-        const style = getComputedStyle(element);
-        if (filter) {
-            return filter.reduce((acc, key) => {
-                acc[key] = style[key];
-                return acc;
-            }, {});
-        }
-        return JSON.parse(JSON.stringify(style));
-    }, selector, filter);
+    }
+    const style = getComputedStyle(element);
+    if (filter) {
+        return filter.reduce((acc, key) => {
+            acc[key] = style[key];
+            return acc;
+        }, {});
+    }
+    return JSON.parse(JSON.stringify(style));
 };
 //# sourceMappingURL=computedStyle.js.map

package/dist/collection/shared/test-utils/computedStyle.js.map

@@ -1 +1 @@
-{"version":3,"file":"computedStyle.js","sourceRoot":"","sources":["../../../../../../packages/beeq/src/shared/test-utils/computedStyle.ts"],"names":[],"mappings":"AAEA;;;;;GAKG;AACH,MAAM,CAAC,MAAM,aAAa,GAAG,CAC3B,IAAa,EACb,QAAgB,EAChB,MAAyB,EACc,EAAE;IACzC,OAAO,IAAI,CAAC,QAAQ,CAClB,CAAC,aAAqB,EAAE,MAAiB,EAAE,EAAE;QAC3C,MAAM,CAAC,gBAAgB,EAAE,iBAAiB,CAAC,GAAG,aAAa,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC;QAEzE,IAAI,OAAO,GAAG,QAAQ,CAAC,aAAa,CAAC,gBAAgB,CAAC,CAAC;QAEvD,IAAI,CAAC,OAAO,EAAE,CAAC;YACb,MAAM,IAAI,KAAK,CAAC,0BAA0B,gBAAgB,EAAE,CAAC,CAAC;QAChE,CAAC;QAED,IAAI,iBAAiB,EAAE,CAAC;YACtB,OAAO,GAAG,OAAO,CAAC,UAAU,CAAC,aAAa,CAAC,iBAAiB,CAAC,CAAC;YAE9D,IAAI,CAAC,OAAO,EAAE,CAAC;gBACb,MAAM,IAAI,KAAK,CAAC,0BAA0B,iBAAiB,EAAE,CAAC,CAAC;YACjE,CAAC;QACH,CAAC;QAED,MAAM,KAAK,GAAG,gBAAgB,CAAC,OAAO,CAAC,CAAC;QAExC,IAAI,MAAM,EAAE,CAAC;YACX,OAAO,MAAM,CAAC,MAAM,CAClB,CAAC,GAAG,EAAE,GAAG,EAAE,EAAE;gBACX,GAAG,CAAC,GAAG,CAAC,GAAG,KAAK,CAAC,GAAG,CAAC,CAAC;gBACtB,OAAO,GAAG,CAAC;YACb,CAAC,EACD,EAAkC,CACnC,CAAC;QACJ,CAAC;QAED,OAAO,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,CAAC,CAAC;IAC3C,CAAC,EACD,QAAQ,EACR,MAAM,CACP,CAAC;AACJ,CAAC,CAAC","sourcesContent":["import type { E2EPage } from '@stencil/core/testing';\n\n/**\n * Enhances page to retrieve element style by a given selector\n * @param {E2EPage} page - stencil instance of puppeteer page\n * @param {String} selector - selector to be passed to querySelector, it supports stencil `>>>` selector\n * @returns {Object} style declaration\n */\nexport const computedStyle = <T extends keyof CSSStyleDeclaration>(\n  page: E2EPage,\n  selector: string,\n  filter?: ReadonlyArray<T>,\n): Promise<Pick<CSSStyleDeclaration, T>> => {\n  return page.evaluate(\n    (querySelector: string, filter?: Array<T>) => {\n      const [lightDomSelector, shadowDomSelector] = querySelector.split('>>>');\n\n      let element = document.querySelector(lightDomSelector);\n\n      if (!element) {\n        throw new Error(`Could not find element ${lightDomSelector}`);\n      }\n\n      if (shadowDomSelector) {\n        element = element.shadowRoot.querySelector(shadowDomSelector);\n\n        if (!element) {\n          throw new Error(`Could not find element ${shadowDomSelector}`);\n        }\n      }\n\n      const style = getComputedStyle(element);\n\n      if (filter) {\n        return filter.reduce(\n          (acc, key) => {\n            acc[key] = style[key];\n            return acc;\n          },\n          {} as Pick<CSSStyleDeclaration, T>,\n        );\n      }\n\n      return JSON.parse(JSON.stringify(style));\n    },\n    selector,\n    filter,\n  );\n};\n"]}
+{"version":3,"file":"computedStyle.js","sourceRoot":"","sources":["../../../../../../packages/beeq/src/shared/test-utils/computedStyle.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AACH,MAAM,CAAC,MAAM,aAAa,GAAG,CAC3B,QAAgB,EAChB,MAAyB,EACK,EAAE;IAChC,MAAM,CAAC,gBAAgB,EAAE,iBAAiB,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,IAAI,EAAE,CAAC,CAAC;IAEzF,IAAI,OAAO,GAAmB,QAAQ,CAAC,aAAa,CAAC,gBAAgB,CAAC,CAAC;IAEvE,IAAI,CAAC,OAAO,EAAE,CAAC;QACb,MAAM,IAAI,KAAK,CAAC,0BAA0B,gBAAgB,EAAE,CAAC,CAAC;IAChE,CAAC;IAED,IAAI,iBAAiB,EAAE,CAAC;QACtB,OAAO,GAAG,OAAO,CAAC,UAAU,EAAE,aAAa,CAAC,iBAAiB,CAAC,IAAI,IAAI,CAAC;QAEvE,IAAI,CAAC,OAAO,EAAE,CAAC;YACb,MAAM,IAAI,KAAK,CAAC,0BAA0B,iBAAiB,EAAE,CAAC,CAAC;QACjE,CAAC;IACH,CAAC;IAED,MAAM,KAAK,GAAG,gBAAgB,CAAC,OAAO,CAAC,CAAC;IAExC,IAAI,MAAM,EAAE,CAAC;QACX,OAAO,MAAM,CAAC,MAAM,CAClB,CAAC,GAAG,EAAE,GAAG,EAAE,EAAE;YACX,GAAG,CAAC,GAAG,CAAC,GAAG,KAAK,CAAC,GAAG,CAAC,CAAC;YACtB,OAAO,GAAG,CAAC;QACb,CAAC,EACD,EAAkC,CACnC,CAAC;IACJ,CAAC;IAED,OAAO,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,CAAC,CAAC;AAC3C,CAAC,CAAC","sourcesContent":["/**\n * Retrieves computed CSS styles for an element, with support for shadow DOM piercing via `>>>` selector.\n * Works directly with the DOM (designed for browser-mode e2e tests).\n *\n * @param {string} selector - CSS selector, supports `>>>` to pierce into shadow DOM\n * @param {ReadonlyArray<T>} [filter] - Optional list of CSS property names to return\n * @returns {Pick<CSSStyleDeclaration, T>} The computed style (filtered if specified)\n */\nexport const computedStyle = <T extends keyof CSSStyleDeclaration>(\n  selector: string,\n  filter?: ReadonlyArray<T>,\n): Pick<CSSStyleDeclaration, T> => {\n  const [lightDomSelector, shadowDomSelector] = selector.split('>>>').map((s) => s.trim());\n\n  let element: Element | null = document.querySelector(lightDomSelector);\n\n  if (!element) {\n    throw new Error(`Could not find element ${lightDomSelector}`);\n  }\n\n  if (shadowDomSelector) {\n    element = element.shadowRoot?.querySelector(shadowDomSelector) ?? null;\n\n    if (!element) {\n      throw new Error(`Could not find element ${shadowDomSelector}`);\n    }\n  }\n\n  const style = getComputedStyle(element);\n\n  if (filter) {\n    return filter.reduce(\n      (acc, key) => {\n        acc[key] = style[key];\n        return acc;\n      },\n      {} as Pick<CSSStyleDeclaration, T>,\n    );\n  }\n\n  return JSON.parse(JSON.stringify(style));\n};\n"]}

package/dist/collection/shared/test-utils/setProperties.js

@@ -4,7 +4,7 @@
  */
 /**
  * Enhances page to set and retrieve properties based on attributes parameter. It typed against bq web components
- * @param {E2EPage} page - stencil instance of puppeteer page
+ * @param {E2EPage} page - Stencil E2E page instance
  * @param {String} element - element selector
  * @param {Object} attributes - attributes that will be set on element instance
  * @returns {Object} attributes that were set on element instance

package/dist/collection/shared/test-utils/setProperties.js.map

@@ -1 +1 @@
-{"version":3,"file":"setProperties.js","sourceRoot":"","sources":["../../../../../../packages/beeq/src/shared/test-utils/setProperties.ts"],"names":[],"mappings":"AAQA;;;;;;GAMG;AACH,MAAM,CAAC,MAAM,aAAa,GAAG,KAAK,EAChC,IAAa,EACb,OAAU,EACV,UAA6C,EAC7C,EAAE;IACF,MAAM,IAAI,CAAC,KAAK,CACd,OAAO,EACP,CAAC,UAAU,EAAE,UAAU,EAAE,EAAE;QACzB,IAAI,UAAU,IAAI,OAAO,UAAU,KAAK,QAAQ,EAAE,CAAC;YACjD,MAAM,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC,OAAO,CAAC,CAAC,IAAI,EAAE,EAAE;gBACvC,UAAU,CAAC,IAAI,CAAC,GAAG,UAAU,CAAC,IAAI,CAAC,CAAC;YACtC,CAAC,CAAC,CAAC;QACL,CAAC;IACH,CAAC,EACD,UAAU,CACX,CAAC;IAEF,MAAM,IAAI,CAAC,cAAc,EAAE,CAAC;IAE5B,OAAO,IAAI,CAAC,KAAK,CACf,OAAO,EACP,CAAC,UAAU,EAAE,UAAU,EAAE,EAAE;QACzB,MAAM,KAAK,GAA4B,EAAE,CAAC;QAC1C,IAAI,UAAU,IAAI,OAAO,UAAU,KAAK,QAAQ,EAAE,CAAC;YACjD,MAAM,CAAC,IAAI,CAAC,UAAoB,CAAC,CAAC,OAAO,CAAC,CAAC,IAAI,EAAE,EAAE;gBACjD,KAAK,CAAC,IAAI,CAAC,GAAG,UAAU,CAAC,IAAI,CAAC,CAAC;YACjC,CAAC,CAAC,CAAC;QACL,CAAC;QACD,OAAO,KAAK,CAAC;IACf,CAAC,EACD,UAAU,CACX,CAAC;AACJ,CAAC,CAAC","sourcesContent":["import type { E2EPage } from '@stencil/core/testing';\n\nexport type BqHTMLTagNameMap = keyof {\n  [TAG in keyof HTMLElementTagNameMap as TAG extends `bq-${string}` ? TAG : never]: TAG extends `bq-${string}`\n    ? TAG\n    : never;\n};\n\n/**\n * Enhances page to set and retrieve properties based on attributes parameter. It typed against bq web components\n * @param {E2EPage} page - stencil instance of puppeteer page\n * @param {String} element - element selector\n * @param {Object} attributes - attributes that will be set on element instance\n * @returns {Object} attributes that were set on element instance\n */\nexport const setProperties = async <T extends keyof HTMLElementTagNameMap = BqHTMLTagNameMap>(\n  page: E2EPage,\n  element: T,\n  attributes: Partial<HTMLElementTagNameMap[T]>,\n) => {\n  await page.$eval(\n    element,\n    (elementRef, attributes) => {\n      if (attributes && typeof attributes === 'object') {\n        Object.keys(attributes).forEach((attr) => {\n          elementRef[attr] = attributes[attr];\n        });\n      }\n    },\n    attributes,\n  );\n\n  await page.waitForChanges();\n\n  return page.$eval(\n    element,\n    (elementRef, attributes) => {\n      const attrs: Record<string, unknown> = {};\n      if (attributes && typeof attributes === 'object') {\n        Object.keys(attributes as object).forEach((attr) => {\n          attrs[attr] = elementRef[attr];\n        });\n      }\n      return attrs;\n    },\n    attributes,\n  );\n};\n"]}
+{"version":3,"file":"setProperties.js","sourceRoot":"","sources":["../../../../../../packages/beeq/src/shared/test-utils/setProperties.ts"],"names":[],"mappings":"AAQA;;;;;;GAMG;AACH,MAAM,CAAC,MAAM,aAAa,GAAG,KAAK,EAChC,IAAa,EACb,OAAU,EACV,UAA6C,EAC7C,EAAE;IACF,MAAM,IAAI,CAAC,KAAK,CACd,OAAO,EACP,CAAC,UAAU,EAAE,UAAU,EAAE,EAAE;QACzB,IAAI,UAAU,IAAI,OAAO,UAAU,KAAK,QAAQ,EAAE,CAAC;YACjD,MAAM,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC,OAAO,CAAC,CAAC,IAAI,EAAE,EAAE;gBACvC,UAAU,CAAC,IAAI,CAAC,GAAG,UAAU,CAAC,IAAI,CAAC,CAAC;YACtC,CAAC,CAAC,CAAC;QACL,CAAC;IACH,CAAC,EACD,UAAU,CACX,CAAC;IAEF,MAAM,IAAI,CAAC,cAAc,EAAE,CAAC;IAE5B,OAAO,IAAI,CAAC,KAAK,CACf,OAAO,EACP,CAAC,UAAU,EAAE,UAAU,EAAE,EAAE;QACzB,MAAM,KAAK,GAA4B,EAAE,CAAC;QAC1C,IAAI,UAAU,IAAI,OAAO,UAAU,KAAK,QAAQ,EAAE,CAAC;YACjD,MAAM,CAAC,IAAI,CAAC,UAAoB,CAAC,CAAC,OAAO,CAAC,CAAC,IAAI,EAAE,EAAE;gBACjD,KAAK,CAAC,IAAI,CAAC,GAAG,UAAU,CAAC,IAAI,CAAC,CAAC;YACjC,CAAC,CAAC,CAAC;QACL,CAAC;QACD,OAAO,KAAK,CAAC;IACf,CAAC,EACD,UAAU,CACX,CAAC;AACJ,CAAC,CAAC","sourcesContent":["import type { E2EPage } from '@stencil/core/testing';\n\nexport type BqHTMLTagNameMap = keyof {\n  [TAG in keyof HTMLElementTagNameMap as TAG extends `bq-${string}` ? TAG : never]: TAG extends `bq-${string}`\n    ? TAG\n    : never;\n};\n\n/**\n * Enhances page to set and retrieve properties based on attributes parameter. It typed against bq web components\n * @param {E2EPage} page - Stencil E2E page instance\n * @param {String} element - element selector\n * @param {Object} attributes - attributes that will be set on element instance\n * @returns {Object} attributes that were set on element instance\n */\nexport const setProperties = async <T extends keyof HTMLElementTagNameMap = BqHTMLTagNameMap>(\n  page: E2EPage,\n  element: T,\n  attributes: Partial<HTMLElementTagNameMap[T]>,\n) => {\n  await page.$eval(\n    element,\n    (elementRef, attributes) => {\n      if (attributes && typeof attributes === 'object') {\n        Object.keys(attributes).forEach((attr) => {\n          elementRef[attr] = attributes[attr];\n        });\n      }\n    },\n    attributes,\n  );\n\n  await page.waitForChanges();\n\n  return page.$eval(\n    element,\n    (elementRef, attributes) => {\n      const attrs: Record<string, unknown> = {};\n      if (attributes && typeof attributes === 'object') {\n        Object.keys(attributes as object).forEach((attr) => {\n          attrs[attr] = elementRef[attr];\n        });\n      }\n      return attrs;\n    },\n    attributes,\n  );\n};\n"]}

package/dist/collection/shared/test-utils/sleep.js

@@ -2,5 +2,9 @@
  * Built by Endavans
  * © https://beeq.design - Apache 2 License.
  */
-export { setTimeout as sleep } from 'node:timers/promises';
+/**
+ * Returns a promise that resolves after the given number of milliseconds.
+ * Compatible with both Node.js (unit tests) and browser environments (e2e tests).
+ */
+export const sleep = (ms) => new Promise((resolve) => setTimeout(resolve, ms));
 //# sourceMappingURL=sleep.js.map

package/dist/collection/shared/test-utils/sleep.js.map

@@ -1 +1 @@
-{"version":3,"file":"sleep.js","sourceRoot":"","sources":["../../../../../../packages/beeq/src/shared/test-utils/sleep.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,IAAI,KAAK,EAAE,MAAM,sBAAsB,CAAC","sourcesContent":["export { setTimeout as sleep } from 'node:timers/promises';\n"]}
+{"version":3,"file":"sleep.js","sourceRoot":"","sources":["../../../../../../packages/beeq/src/shared/test-utils/sleep.ts"],"names":[],"mappings":"AAAA;;;GAGG;AACH,MAAM,CAAC,MAAM,KAAK,GAAG,CAAC,EAAU,EAAiB,EAAE,CAAC,IAAI,OAAO,CAAC,CAAC,OAAO,EAAE,EAAE,CAAC,UAAU,CAAC,OAAO,EAAE,EAAE,CAAC,CAAC,CAAC","sourcesContent":["/**\n * Returns a promise that resolves after the given number of milliseconds.\n * Compatible with both Node.js (unit tests) and browser environments (e2e tests).\n */\nexport const sleep = (ms: number): Promise<void> => new Promise((resolve) => setTimeout(resolve, ms));\n"]}

package/dist/collection/shared/utils/cssVariables.js

@@ -11,7 +11,7 @@ const CSSVALUEPREFIX = '--bq-';
  * @return {string} The corresponding CSS custom property variable
  */
 export function getColorCSSVariable(colorName) {
-    if (!isClient)
+    if (!isClient())
         return undefined;
     const token = `${CSSVALUEPREFIX}${colorName}`;
     const value = getComputedStyle(document.documentElement).getPropertyValue(token);

package/dist/collection/shared/utils/cssVariables.js.map

@@ -1 +1 @@
-{"version":3,"file":"cssVariables.js","sourceRoot":"","sources":["../../../../../../packages/beeq/src/shared/utils/cssVariables.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AAEtC,MAAM,cAAc,GAAG,OAAO,CAAC;AAE/B;;;;;GAKG;AACH,MAAM,UAAU,mBAAmB,CAAC,SAAiB;IACnD,IAAI,CAAC,QAAQ;QAAE,OAAO,SAAS,CAAC;IAEhC,MAAM,KAAK,GAAG,GAAG,cAAc,GAAG,SAAS,EAAE,CAAC;IAC9C,MAAM,KAAK,GAAG,gBAAgB,CAAC,QAAQ,CAAC,eAAe,CAAC,CAAC,gBAAgB,CAAC,KAAK,CAAC,CAAC;IACjF,IAAI,CAAC,KAAK;QAAE,OAAO,SAAS,CAAC;IAE7B,OAAO,OAAO,KAAK,GAAG,CAAC;AACzB,CAAC;AAED;;;;;GAKG;AACH,MAAM,UAAU,mBAAmB,CAAC,QAAgB,EAAE,SAAkB;IACtE,MAAM,MAAM,GAAG,gBAAgB,CAAC,SAAS,CAAC,CAAC;IAC3C,OAAO,MAAM,CAAC,MAAM,CAAC,gBAAgB,CAAC,KAAK,QAAQ,EAAE,CAAC,CAAC,CAAC,IAAI,EAAE,CAAC;AACjE,CAAC","sourcesContent":["import { isClient } from './isClient';\n\nconst CSSVALUEPREFIX = '--bq-';\n\n/**\n * Get CSS custom property variable of a given color string value\n *\n * @param {string} colorName - Valid string value.\n * @return {string} The corresponding CSS custom property variable\n */\nexport function getColorCSSVariable(colorName: string): string | undefined {\n  if (!isClient) return undefined;\n\n  const token = `${CSSVALUEPREFIX}${colorName}`;\n  const value = getComputedStyle(document.documentElement).getPropertyValue(token);\n  if (!value) return undefined;\n\n  return `var(${token})`;\n}\n\n/**\n * Get compiled CSS custom property value\n *\n * @param {string} variable - The variable name for which to get its value\n * @return {string} The corresponding value for the given CSS custom property\n */\nexport function getCSSVariableValue(variable: string, component: Element): string {\n  const styles = getComputedStyle(component);\n  return String(styles.getPropertyValue(`--${variable}`)).trim();\n}\n"]}
+{"version":3,"file":"cssVariables.js","sourceRoot":"","sources":["../../../../../../packages/beeq/src/shared/utils/cssVariables.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AAEtC,MAAM,cAAc,GAAG,OAAO,CAAC;AAE/B;;;;;GAKG;AACH,MAAM,UAAU,mBAAmB,CAAC,SAAiB;IACnD,IAAI,CAAC,QAAQ,EAAE;QAAE,OAAO,SAAS,CAAC;IAElC,MAAM,KAAK,GAAG,GAAG,cAAc,GAAG,SAAS,EAAE,CAAC;IAC9C,MAAM,KAAK,GAAG,gBAAgB,CAAC,QAAQ,CAAC,eAAe,CAAC,CAAC,gBAAgB,CAAC,KAAK,CAAC,CAAC;IACjF,IAAI,CAAC,KAAK;QAAE,OAAO,SAAS,CAAC;IAE7B,OAAO,OAAO,KAAK,GAAG,CAAC;AACzB,CAAC;AAED;;;;;GAKG;AACH,MAAM,UAAU,mBAAmB,CAAC,QAAgB,EAAE,SAAkB;IACtE,MAAM,MAAM,GAAG,gBAAgB,CAAC,SAAS,CAAC,CAAC;IAC3C,OAAO,MAAM,CAAC,MAAM,CAAC,gBAAgB,CAAC,KAAK,QAAQ,EAAE,CAAC,CAAC,CAAC,IAAI,EAAE,CAAC;AACjE,CAAC","sourcesContent":["import { isClient } from './isClient';\n\nconst CSSVALUEPREFIX = '--bq-';\n\n/**\n * Get CSS custom property variable of a given color string value\n *\n * @param {string} colorName - Valid string value.\n * @return {string} The corresponding CSS custom property variable\n */\nexport function getColorCSSVariable(colorName: string): string | undefined {\n  if (!isClient()) return undefined;\n\n  const token = `${CSSVALUEPREFIX}${colorName}`;\n  const value = getComputedStyle(document.documentElement).getPropertyValue(token);\n  if (!value) return undefined;\n\n  return `var(${token})`;\n}\n\n/**\n * Get compiled CSS custom property value\n *\n * @param {string} variable - The variable name for which to get its value\n * @return {string} The corresponding value for the given CSS custom property\n */\nexport function getCSSVariableValue(variable: string, component: Element): string {\n  const styles = getComputedStyle(component);\n  return String(styles.getPropertyValue(`--${variable}`)).trim();\n}\n"]}

package/dist/collection/shared/utils/event.js.map

@@ -1 +1 @@
-{"version":3,"file":"event.js","sourceRoot":"","sources":["../../../../../../packages/beeq/src/shared/utils/event.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AACH,MAAM,CAAC,MAAM,2BAA2B,GAAG,CAAC,KAAY,EAAE,WAAwB,EAAW,EAAE;IAC7F,MAAM,IAAI,GAAG,KAAK,CAAC,YAAY,EAAE,CAAC;IAElC,OAAO,IAAI,CAAC,QAAQ,CAAC,WAAW,CAAC,CAAC;AACpC,CAAC,CAAC","sourcesContent":["/**\n * Check if the event target is a child of the host element\n * @param event - The event to check\n * @param hostElement - The host element to check against\n * @returns True if the event target is a child of the host element\n */\nexport const isEventTargetChildOfElement = (event: Event, hostElement: HTMLElement): boolean => {\n  const path = event.composedPath();\n\n  return path.includes(hostElement);\n};\n"]}
+{"version":3,"file":"event.js","sourceRoot":"","sources":["../../../../../../packages/beeq/src/shared/utils/event.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AACH,MAAM,CAAC,MAAM,2BAA2B,GAAG,CAAC,KAAY,EAAE,WAAwB,EAAW,EAAE;IAC7F,MAAM,IAAI,GAAG,KAAK,CAAC,YAAY,EAAE,CAAC;IAElC,OAAO,IAAI,CAAC,QAAQ,CAAC,WAAW,CAAC,CAAC;AACpC,CAAC,CAAC","sourcesContent":["/**\n * Check if the event target is a child of the host element\n * @param event - The event to check\n * @param hostElement - The host element to check against\n * @returns True if the event target is a child of the host element\n */\nexport const isEventTargetChildOfElement = (event: Event, hostElement: EventTarget): boolean => {\n  const path = event.composedPath();\n\n  return path.includes(hostElement);\n};\n"]}

package/dist/collection/shared/utils/index.js

@@ -16,6 +16,7 @@ export * from './isDefined';
 export * from './isEmpty';
 export * from './isHTMLElement';
 export * from './isNil';
+export * from './isPopoverSupported';
 export * from './isString';
 export * from './props';
 export * from './scrollLock';

package/dist/collection/shared/utils/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../packages/beeq/src/shared/utils/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAC;AAC7B,cAAc,SAAS,CAAC;AACxB,cAAc,gBAAgB,CAAC;AAC/B,cAAc,QAAQ,CAAC;AACvB,cAAc,YAAY,CAAC;AAC3B,cAAc,SAAS,CAAC;AACxB,cAAc,QAAQ,CAAC;AACvB,cAAc,kBAAkB,CAAC;AACjC,cAAc,aAAa,CAAC;AAC5B,cAAc,YAAY,CAAC;AAC3B,cAAc,aAAa,CAAC;AAC5B,cAAc,WAAW,CAAC;AAC1B,cAAc,iBAAiB,CAAC;AAChC,cAAc,SAAS,CAAC;AACxB,cAAc,YAAY,CAAC;AAC3B,cAAc,SAAS,CAAC;AACxB,cAAc,cAAc,CAAC;AAC7B,cAAc,iBAAiB,CAAC;AAChC,cAAc,QAAQ,CAAC;AACvB,cAAc,iBAAiB,CAAC;AAChC,cAAc,cAAc,CAAC","sourcesContent":["export * from './assetsPath';\nexport * from './clamp';\nexport * from './cssVariables';\nexport * from './date';\nexport * from './debounce';\nexport * from './event';\nexport * from './form';\nexport * from './getNextElement';\nexport * from './getRandom';\nexport * from './isClient';\nexport * from './isDefined';\nexport * from './isEmpty';\nexport * from './isHTMLElement';\nexport * from './isNil';\nexport * from './isString';\nexport * from './props';\nexport * from './scrollLock';\nexport * from './setRafTimeout';\nexport * from './slot';\nexport * from './stringToArray';\nexport * from './transition';\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../packages/beeq/src/shared/utils/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAC;AAC7B,cAAc,SAAS,CAAC;AACxB,cAAc,gBAAgB,CAAC;AAC/B,cAAc,QAAQ,CAAC;AACvB,cAAc,YAAY,CAAC;AAC3B,cAAc,SAAS,CAAC;AACxB,cAAc,QAAQ,CAAC;AACvB,cAAc,kBAAkB,CAAC;AACjC,cAAc,aAAa,CAAC;AAC5B,cAAc,YAAY,CAAC;AAC3B,cAAc,aAAa,CAAC;AAC5B,cAAc,WAAW,CAAC;AAC1B,cAAc,iBAAiB,CAAC;AAChC,cAAc,SAAS,CAAC;AACxB,cAAc,sBAAsB,CAAC;AACrC,cAAc,YAAY,CAAC;AAC3B,cAAc,SAAS,CAAC;AACxB,cAAc,cAAc,CAAC;AAC7B,cAAc,iBAAiB,CAAC;AAChC,cAAc,QAAQ,CAAC;AACvB,cAAc,iBAAiB,CAAC;AAChC,cAAc,cAAc,CAAC","sourcesContent":["export * from './assetsPath';\nexport * from './clamp';\nexport * from './cssVariables';\nexport * from './date';\nexport * from './debounce';\nexport * from './event';\nexport * from './form';\nexport * from './getNextElement';\nexport * from './getRandom';\nexport * from './isClient';\nexport * from './isDefined';\nexport * from './isEmpty';\nexport * from './isHTMLElement';\nexport * from './isNil';\nexport * from './isPopoverSupported';\nexport * from './isString';\nexport * from './props';\nexport * from './scrollLock';\nexport * from './setRafTimeout';\nexport * from './slot';\nexport * from './stringToArray';\nexport * from './transition';\n"]}

package/dist/collection/shared/utils/isPopoverSupported.js

@@ -0,0 +1,12 @@
+/*!
+ * Built by Endavans
+ * © https://beeq.design - Apache 2 License.
+ */
+/** Returns whether the current runtime provides the complete HTML Popover API. */
+export const isPopoverSupported = () => {
+    return (typeof HTMLElement !== 'undefined' &&
+        'popover' in HTMLElement.prototype &&
+        typeof HTMLElement.prototype.showPopover === 'function' &&
+        typeof HTMLElement.prototype.hidePopover === 'function');
+};
+//# sourceMappingURL=isPopoverSupported.js.map

package/dist/collection/shared/utils/isPopoverSupported.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"isPopoverSupported.js","sourceRoot":"","sources":["../../../../../../packages/beeq/src/shared/utils/isPopoverSupported.ts"],"names":[],"mappings":"AAAA,kFAAkF;AAClF,MAAM,CAAC,MAAM,kBAAkB,GAAG,GAAY,EAAE;IAC9C,OAAO,CACL,OAAO,WAAW,KAAK,WAAW;QAClC,SAAS,IAAI,WAAW,CAAC,SAAS;QAClC,OAAO,WAAW,CAAC,SAAS,CAAC,WAAW,KAAK,UAAU;QACvD,OAAO,WAAW,CAAC,SAAS,CAAC,WAAW,KAAK,UAAU,CACxD,CAAC;AACJ,CAAC,CAAC","sourcesContent":["/** Returns whether the current runtime provides the complete HTML Popover API. */\nexport const isPopoverSupported = (): boolean => {\n  return (\n    typeof HTMLElement !== 'undefined' &&\n    'popover' in HTMLElement.prototype &&\n    typeof HTMLElement.prototype.showPopover === 'function' &&\n    typeof HTMLElement.prototype.hidePopover === 'function'\n  );\n};\n"]}

package/dist/collection/shared/utils/props.js

@@ -12,13 +12,14 @@
  * @returns {void}
  */
 export const validatePropValue = (ACCEPTED_VALUES, fallbackValue, element, propertyName) => {
-    const propertyValue = element[propertyName];
+    const propertyKey = propertyName;
+    const propertyValue = element[propertyKey];
     // Early return if the property value is one of the accepted values
     if (ACCEPTED_VALUES.includes(propertyValue))
         return;
     // Override property with fallback value
-    element[propertyName] = fallbackValue;
+    element[propertyKey] = fallbackValue;
     // Notify developer in the browser console
-    console.warn(`[${element.tagName.toUpperCase()}] Please notice that "${String(propertyName)}" should be one of ${ACCEPTED_VALUES.join('|')}`);
+    console.warn(`[${element.tagName.toUpperCase()}] Please notice that "${propertyKey}" should be one of ${ACCEPTED_VALUES.join('|')}`);
 };
 //# sourceMappingURL=props.js.map

package/dist/collection/shared/utils/props.js.map

@@ -1 +1 @@
-{"version":3,"file":"props.js","sourceRoot":"","sources":["../../../../../../packages/beeq/src/shared/utils/props.ts"],"names":[],"mappings":"AAGA;;;;;;;;GAQG;AACH,MAAM,CAAC,MAAM,iBAAiB,GAAG,CAC/B,eAA8B,EAC9B,aAAgB,EAChB,OAAU,EACV,YAAkC,EAC5B,EAAE;IACR,MAAM,aAAa,GAAG,OAAO,CAAC,YAAsB,CAAC,CAAC;IACtD,mEAAmE;IACnE,IAAI,eAAe,CAAC,QAAQ,CAAC,aAAa,CAAC;QAAE,OAAO;IACpD,wCAAwC;IACxC,OAAO,CAAC,YAAsB,CAAC,GAAG,aAAa,CAAC;IAChD,0CAA0C;IAC1C,OAAO,CAAC,IAAI,CACV,IAAI,OAAO,CAAC,OAAO,CAAC,WAAW,EAAE,yBAAyB,MAAM,CAC9D,YAAY,CACb,sBAAsB,eAAe,CAAC,IAAI,CAAC,GAAG,CAAC,EAAE,CACnD,CAAC;AACJ,CAAC,CAAC","sourcesContent":["export type TExtractProp<T> = T[keyof T] extends infer U ? U : never;\nexport type TValidProperty<E, T> = TExtractProp<{ [K in keyof E]: E[K] extends T ? K : never }>;\n\n/**\n * Validate the element property value, if is one of the accepted values\n *\n * @param {readonly} ACCEPTED_VALUES - The list of the accepted values to check against.\n * @param {unknown} fallbackValue - The default value to assign\n * @param {Element} element - The component reference\n * @param {string} propertyName - The property name (will be used in the console notification)\n * @returns {void}\n */\nexport const validatePropValue = <T extends E[keyof E], E extends Element>(\n  ACCEPTED_VALUES: Readonly<T[]>,\n  fallbackValue: T,\n  element: E,\n  propertyName: TValidProperty<E, T>,\n): void => {\n  const propertyValue = element[propertyName as string];\n  // Early return if the property value is one of the accepted values\n  if (ACCEPTED_VALUES.includes(propertyValue)) return;\n  // Override property with fallback value\n  element[propertyName as string] = fallbackValue;\n  // Notify developer in the browser console\n  console.warn(\n    `[${element.tagName.toUpperCase()}] Please notice that \"${String(\n      propertyName,\n    )}\" should be one of ${ACCEPTED_VALUES.join('|')}`,\n  );\n};\n"]}
+{"version":3,"file":"props.js","sourceRoot":"","sources":["../../../../../../packages/beeq/src/shared/utils/props.ts"],"names":[],"mappings":"AAGA;;;;;;;;GAQG;AACH,MAAM,CAAC,MAAM,iBAAiB,GAAG,CAC/B,eAA8B,EAC9B,aAAgB,EAChB,OAAU,EACV,YAAkC,EAC5B,EAAE;IACR,MAAM,WAAW,GAAG,YAAsB,CAAC;IAC3C,MAAM,aAAa,GAAG,OAAO,CAAC,WAAW,CAAC,CAAC;IAC3C,mEAAmE;IACnE,IAAI,eAAe,CAAC,QAAQ,CAAC,aAAa,CAAC;QAAE,OAAO;IACpD,wCAAwC;IACxC,OAAO,CAAC,WAAW,CAAC,GAAG,aAAa,CAAC;IACrC,0CAA0C;IAC1C,OAAO,CAAC,IAAI,CACV,IAAI,OAAO,CAAC,OAAO,CAAC,WAAW,EAAE,yBAAyB,WAAW,sBAAsB,eAAe,CAAC,IAAI,CAAC,GAAG,CAAC,EAAE,CACvH,CAAC;AACJ,CAAC,CAAC","sourcesContent":["export type TExtractProp<T> = T[keyof T] extends infer U ? U : never;\nexport type TValidProperty<E, T> = TExtractProp<{ [K in keyof E]: E[K] extends T ? K : never }>;\n\n/**\n * Validate the element property value, if is one of the accepted values\n *\n * @param {readonly} ACCEPTED_VALUES - The list of the accepted values to check against.\n * @param {unknown} fallbackValue - The default value to assign\n * @param {Element} element - The component reference\n * @param {string} propertyName - The property name (will be used in the console notification)\n * @returns {void}\n */\nexport const validatePropValue = <T extends E[keyof E], E extends Element>(\n  ACCEPTED_VALUES: Readonly<T[]>,\n  fallbackValue: T,\n  element: E,\n  propertyName: TValidProperty<E, T>,\n): void => {\n  const propertyKey = propertyName as string;\n  const propertyValue = element[propertyKey];\n  // Early return if the property value is one of the accepted values\n  if (ACCEPTED_VALUES.includes(propertyValue)) return;\n  // Override property with fallback value\n  element[propertyKey] = fallbackValue;\n  // Notify developer in the browser console\n  console.warn(\n    `[${element.tagName.toUpperCase()}] Please notice that \"${propertyKey}\" should be one of ${ACCEPTED_VALUES.join('|')}`,\n  );\n};\n"]}

package/dist/collection/shared/utils/slot.js.map

@@ -1 +1 @@
-{"version":3,"file":"slot.js","sourceRoot":"","sources":["../../../../../../packages/beeq/src/shared/utils/slot.ts"],"names":[],"mappings":"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","sourcesContent":["/*=========================================================================================\n= Credit:                                                                                =\n= https://github.com/shoelace-style/shoelace/blob/next/src/utilities/slot.ts             =\n=========================================================================================*/\n\nfunction isElementNode(node: Node): node is HTMLElement {\n  return node.nodeType === Node.ELEMENT_NODE;\n}\n\nfunction isTextNode(node: Node): node is Text {\n  return node.nodeType === Node.TEXT_NODE;\n}\n\nfunction getText(node: Node, currentLevel = 1, maxLevel = Infinity): string {\n  let text = '';\n  if (currentLevel <= maxLevel) {\n    if (isTextNode(node)) {\n      text += node.textContent;\n    } else if (isElementNode(node) && node.hasChildNodes()) {\n      const nextLevel = currentLevel + 1;\n      node.childNodes.forEach((node) => {\n        text += getText(node, nextLevel, maxLevel);\n      });\n    }\n  }\n\n  return text;\n}\n\nexport interface IOptions {\n  recurse: boolean;\n  maxLevel?: number;\n}\n\n/**\n * Iterates over all of its assigned element and text nodes of a given slot and returns the concatenated HTML as a string.\n *\n * @param {HTMLSlotElement} slot - Slot HTML element\n * @return {string} The concatenated HTML as a string\n */\nexport function getInnerHTML(slot: HTMLSlotElement): string {\n  const nodes = slot.assignedNodes({ flatten: true });\n  let html = '';\n\n  [...nodes].forEach((node) => {\n    if (isElementNode(node)) {\n      html += node.outerHTML;\n    }\n\n    if (isTextNode(node)) {\n      html += node.textContent;\n    }\n  });\n\n  return html;\n}\n\n/**\n * Iterates over all of its assigned text nodes of a given slot and returns the concatenated text as a string.\n *\n * @param {HTMLSlotElement} slot - Slot HTML element\n * @return {string} The concatenated text as a string\n */\nexport function getTextContent(slot: HTMLSlotElement): string;\n/**\n * Iterates over all of its assigned text nodes of a given slot and returns the concatenated text as a string.\n *\n * @param {HTMLSlotElement} slot - Slot HTML element\n * @param {IOptions} options - Options to retrieve text\n * @return {string} The concatenated text as a string\n */\nexport function getTextContent(slot: HTMLSlotElement, options: IOptions): string;\nexport function getTextContent(slot: HTMLSlotElement, options?: IOptions): string {\n  const nodes = slot.assignedNodes({ flatten: true });\n  const { recurse = false, maxLevel } = options ?? {};\n  let text = '';\n\n  [...nodes].forEach((node) => {\n    text += getText(node, 1, recurse ? maxLevel : 1);\n  });\n\n  return text.trim();\n}\n\n/**\n * Determines whether a slot with the given name exists in an element.\n *\n * @param {HTMLElement} el - The HTMl element to check\n * @param {string} name - Name of the slot to check inside the HTML element\n * @return {boolean} True or false if the given HTML element has slot\n */\nexport function hasSlot(el: HTMLElement, name: string): boolean {\n  return (\n    Array.from(el.querySelectorAll('[slot]')).filter((slottedEl: HTMLSlotElement) => slottedEl.slot === name).length > 0\n  );\n}\n\n/**\n * Will return whether if a given slot have HTML children elements or not.\n *\n * @param {HTMLElement} el - The HTML element that holds the slot\n * @param {string} [name] - Optional slot name\n * @return {boolean} True or false if the slot have HTML children elements\n */\nexport function hasSlotContent(el: HTMLElement, name?: string): boolean {\n  if (!el) return false;\n\n  const slotSelector = name ? `[name='${name}']` : '';\n  const slotContent = el.querySelector<HTMLSlotElement>(`slot${slotSelector}`)?.assignedElements({ flatten: true });\n  if (!slotContent || !Array.isArray(slotContent)) return false;\n\n  return !!slotContent.length;\n}\n"]}
+{"version":3,"file":"slot.js","sourceRoot":"","sources":["../../../../../../packages/beeq/src/shared/utils/slot.ts"],"names":[],"mappings":"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","sourcesContent":["/*=========================================================================================\n= Credit:                                                                                =\n= https://github.com/shoelace-style/shoelace/blob/next/src/utilities/slot.ts             =\n=========================================================================================*/\n\nfunction isElementNode(node: Node): node is HTMLElement {\n  return node.nodeType === Node.ELEMENT_NODE;\n}\n\nfunction isTextNode(node: Node): node is Text {\n  return node.nodeType === Node.TEXT_NODE;\n}\n\nfunction getText(node: Node, currentLevel = 1, maxLevel = Infinity): string {\n  let text = '';\n  if (currentLevel <= maxLevel) {\n    if (isTextNode(node)) {\n      text += node.textContent;\n    } else if (isElementNode(node) && node.hasChildNodes()) {\n      const nextLevel = currentLevel + 1;\n      node.childNodes.forEach((node) => {\n        text += getText(node, nextLevel, maxLevel);\n      });\n    }\n  }\n\n  return text;\n}\n\nexport interface IOptions {\n  recurse: boolean;\n  maxLevel?: number;\n}\n\n/**\n * Iterates over all of its assigned element and text nodes of a given slot and returns the concatenated HTML as a string.\n *\n * @param {HTMLSlotElement} slot - Slot HTML element\n * @return {string} The concatenated HTML as a string\n */\nexport function getInnerHTML(slot: HTMLSlotElement): string {\n  const nodes = slot.assignedNodes({ flatten: true });\n  let html = '';\n\n  [...nodes].forEach((node) => {\n    if (isElementNode(node)) {\n      html += node.outerHTML;\n    }\n\n    if (isTextNode(node)) {\n      html += node.textContent;\n    }\n  });\n\n  return html;\n}\n\n/**\n * Iterates over all of its assigned text nodes of a given slot and returns the concatenated text as a string.\n *\n * @param {HTMLSlotElement} slot - Slot HTML element\n * @return {string} The concatenated text as a string\n */\nexport function getTextContent(slot: HTMLSlotElement): string;\n/**\n * Iterates over all of its assigned text nodes of a given slot and returns the concatenated text as a string.\n *\n * @param {HTMLSlotElement} slot - Slot HTML element\n * @param {IOptions} options - Options to retrieve text\n * @return {string} The concatenated text as a string\n */\nexport function getTextContent(slot: HTMLSlotElement, options: IOptions): string;\nexport function getTextContent(slot: HTMLSlotElement, options?: IOptions): string {\n  const nodes = slot.assignedNodes({ flatten: true });\n  const { recurse = false, maxLevel } = options ?? {};\n  let text = '';\n\n  [...nodes].forEach((node) => {\n    text += getText(node, 1, recurse ? maxLevel : 1);\n  });\n\n  return text.trim();\n}\n\n/**\n * Determines whether a slot with the given name exists in an element.\n *\n * @param {HTMLElement} el - The HTMl element to check\n * @param {string} name - Name of the slot to check inside the HTML element\n * @return {boolean} True or false if the given HTML element has slot\n */\nexport function hasSlot(el: HTMLElement, name: string): boolean {\n  return (\n    Array.from(el.querySelectorAll('[slot]')).filter((slottedEl: HTMLSlotElement) => slottedEl.slot === name).length > 0\n  );\n}\n\n/**\n * Will return whether if a given slot have HTML children elements or not.\n *\n * @param {HTMLElement} el - The HTML element that holds the slot\n * @param {string} [name] - Optional slot name\n * @return {boolean} True or false if the slot have HTML children elements\n */\nexport function hasSlotContent(el?: HTMLElement, name?: string): boolean {\n  if (!el) return false;\n\n  const slotSelector = name ? `[name='${name}']` : '';\n  const slotContent = el.querySelector<HTMLSlotElement>(`slot${slotSelector}`)?.assignedElements({ flatten: true });\n  if (!slotContent || !Array.isArray(slotContent)) return false;\n\n  return !!slotContent.length;\n}\n"]}

package/dist/collection/shared/utils/transition.js.map

@@ -1 +1 @@
-{"version":3,"file":"transition.js","sourceRoot":"","sources":["../../../../../../packages/beeq/src/shared/utils/transition.ts"],"names":[],"mappings":"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","sourcesContent":["/* -------------------------------------------------------------------------- */\n/*            Credits to MikeMcCall for the original implementation           */\n/*            Github: https://github.com/mmccall10/el-transition              */\n/* -------------------------------------------------------------------------- */\n\ninterface HTMLElementWithAnimations extends HTMLElement {\n  getAnimations(): Animation[];\n}\n\n/**\n * Transition an element entry\n *\n * @param element The element to enter\n * @param transitionName The name of the transition\n * @returns A promise that resolves when the transition is complete\n */\nexport const enter = async (element: HTMLElement, transitionName: string | null = null): Promise<void> => {\n  element.classList.remove('hidden');\n  await transition('enter', element, transitionName);\n};\n\n/**\n * Transition an element exit\n *\n * @param element The element to leave\n * @param transitionName The name of the transition\n * @returns A promise that resolves when the transition is complete\n */\nexport const leave = async (element: HTMLElement, transitionName: string | null = null): Promise<void> => {\n  await transition('leave', element, transitionName);\n  element.classList.add('hidden');\n};\n\n/**\n * Toggle an element entry/exit\n *\n * @param element The element to toggle\n * @param transitionName The name of the transition\n * @returns A promise that resolves when the transition is complete\n */\nexport const toggle = async (element: HTMLElement, transitionName: string | null = null): Promise<void> => {\n  if (element.classList.contains('hidden')) {\n    await enter(element, transitionName);\n  } else {\n    await leave(element, transitionName);\n  }\n};\n\n/**\n * Perform a transition on an element\n *\n * @param direction The direction of the transition\n * @param element The element to transition\n * @param animation The animation to use\n * @returns A promise that resolves when the transition is complete\n * @internal\n */\nconst transition = async (direction: string, element: HTMLElement, animation: string | null): Promise<void> => {\n  const { dataset } = element;\n  const animationClass = animation ? `${animation}-${direction}` : direction;\n  const transitionKey = `transition${direction.charAt(0).toUpperCase() + direction.slice(1)}`;\n\n  // Get the genesis, start, and end classes\n  const genesisClasses = getDatasetValueOrDefault(dataset, transitionKey, animationClass);\n  const startClasses = getDatasetValueOrDefault(dataset, `${transitionKey}Start`, `${animationClass}-start`);\n  const endClasses = getDatasetValueOrDefault(dataset, `${transitionKey}End`, `${animationClass}-end`);\n\n  // Add genesis and start classes, then wait for the next frame\n  addClasses(element, genesisClasses);\n  addClasses(element, startClasses);\n  await nextFrame();\n\n  // Replace start classes with end classes, then wait for the transition to finish\n  removeClasses(element, startClasses);\n  addClasses(element, endClasses);\n  await afterTransition(element as HTMLElementWithAnimations);\n\n  // Remove end and genesis classes\n  removeClasses(element, endClasses);\n  removeClasses(element, genesisClasses);\n};\n\n/**\n * Get the value of a dataset key or a default value\n *\n * @param dataset The dataset to get the value from\n * @param key The key to get the value for\n * @param defaultValue The default value to return if the key is not found\n * @returns The value of the dataset key or the default value\n * @internal\n */\nconst getDatasetValueOrDefault = (dataset: DOMStringMap, key: string, defaultValue: string): string[] => {\n  return dataset[key] ? dataset[key].split(' ') : [defaultValue];\n};\n\n/**\n * Add classes to an element\n *\n * @param element The element to add the CSS classes to\n * @param classes The classes to add\n * @internal\n */\nconst addClasses = (element: HTMLElement, classes: string[]): void => {\n  element.classList.add(...classes);\n};\n\n/**\n * Remove classes from an element\n *\n * @param element The element to remove the CSS classes from\n * @param classes The classes to remove\n * @internal\n */\nconst removeClasses = (element: HTMLElement, classes: string[]): void => {\n  element.classList.remove(...classes);\n};\n\n/**\n * Wait for the next frame\n * @returns A promise that resolves when the next frame is available\n * @internal\n */\nconst nextFrame = (): Promise<void> => {\n  return new Promise((resolve) => {\n    requestAnimationFrame(() => {\n      requestAnimationFrame(() => resolve());\n    });\n  });\n};\n\n/**\n * Wait for all animations to finish\n * @param element The element to wait for\n * @returns A promise that resolves when all animations are finished\n * @internal\n */\nconst afterTransition = (element: HTMLElementWithAnimations): Promise<Animation[]> => {\n  return Promise.all(element.getAnimations().map((animation) => animation.finished));\n};\n"]}
+{"version":3,"file":"transition.js","sourceRoot":"","sources":["../../../../../../packages/beeq/src/shared/utils/transition.ts"],"names":[],"mappings":"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","sourcesContent":["/* -------------------------------------------------------------------------- */\n/*            Credits to MikeMcCall for the original implementation           */\n/*            Github: https://github.com/mmccall10/el-transition              */\n/* -------------------------------------------------------------------------- */\n\ninterface HTMLElementWithAnimations extends HTMLElement {\n  getAnimations(): Animation[];\n}\n\n/**\n * Transition an element entry\n *\n * @param element The element to enter\n * @param transitionName The name of the transition\n * @returns A promise that resolves when the transition is complete\n */\nexport const enter = async (element: HTMLElement, transitionName: string | null = null): Promise<void> => {\n  element.classList.remove('hidden');\n  await transition('enter', element, transitionName);\n};\n\n/**\n * Transition an element exit\n *\n * @param element The element to leave\n * @param transitionName The name of the transition\n * @returns A promise that resolves when the transition is complete\n */\nexport const leave = async (element: HTMLElement, transitionName: string | null = null): Promise<void> => {\n  await transition('leave', element, transitionName);\n  element.classList.add('hidden');\n};\n\n/**\n * Toggle an element entry/exit\n *\n * @param element The element to toggle\n * @param transitionName The name of the transition\n * @returns A promise that resolves when the transition is complete\n */\nexport const toggle = async (element: HTMLElement, transitionName: string | null = null): Promise<void> => {\n  if (element.classList.contains('hidden')) {\n    await enter(element, transitionName);\n  } else {\n    await leave(element, transitionName);\n  }\n};\n\n/**\n * Perform a transition on an element\n *\n * @param direction The direction of the transition\n * @param element The element to transition\n * @param animation The animation to use\n * @returns A promise that resolves when the transition is complete\n * @internal\n */\nconst transition = async (direction: string, element: HTMLElement, animation: string | null): Promise<void> => {\n  const { dataset } = element;\n  const animationClass = animation ? `${animation}-${direction}` : direction;\n  const transitionKey = `transition${direction.charAt(0).toUpperCase() + direction.slice(1)}`;\n\n  // Get the genesis, start, and end classes\n  const genesisClasses = getDatasetValueOrDefault(dataset, transitionKey, animationClass);\n  const startClasses = getDatasetValueOrDefault(dataset, `${transitionKey}Start`, `${animationClass}-start`);\n  const endClasses = getDatasetValueOrDefault(dataset, `${transitionKey}End`, `${animationClass}-end`);\n\n  // Add genesis and start classes, then wait for the next frame\n  addClasses(element, genesisClasses);\n  addClasses(element, startClasses);\n  await nextFrame();\n\n  // Replace start classes with end classes, then wait for the transition to finish\n  removeClasses(element, startClasses);\n  addClasses(element, endClasses);\n  await afterTransition(element);\n\n  // Remove end and genesis classes\n  removeClasses(element, endClasses);\n  removeClasses(element, genesisClasses);\n};\n\n/**\n * Get the value of a dataset key or a default value\n *\n * @param dataset The dataset to get the value from\n * @param key The key to get the value for\n * @param defaultValue The default value to return if the key is not found\n * @returns The value of the dataset key or the default value\n * @internal\n */\nconst getDatasetValueOrDefault = (dataset: DOMStringMap, key: string, defaultValue: string): string[] => {\n  return dataset[key] ? dataset[key].split(' ') : [defaultValue];\n};\n\n/**\n * Add classes to an element\n *\n * @param element The element to add the CSS classes to\n * @param classes The classes to add\n * @internal\n */\nconst addClasses = (element: HTMLElement, classes: string[]): void => {\n  element.classList.add(...classes);\n};\n\n/**\n * Remove classes from an element\n *\n * @param element The element to remove the CSS classes from\n * @param classes The classes to remove\n * @internal\n */\nconst removeClasses = (element: HTMLElement, classes: string[]): void => {\n  element.classList.remove(...classes);\n};\n\n/**\n * Wait for the next frame\n * @returns A promise that resolves when the next frame is available\n * @internal\n */\nconst nextFrame = (): Promise<void> => {\n  return new Promise((resolve) => {\n    requestAnimationFrame(() => {\n      requestAnimationFrame(() => resolve());\n    });\n  });\n};\n\n/**\n * Wait for all animations to finish\n * @param element The element to wait for\n * @returns A promise that resolves when all animations are finished\n * @internal\n */\nconst afterTransition = (element: HTMLElementWithAnimations): Promise<Animation[]> => {\n  return Promise.all(element.getAnimations().map((animation) => animation.finished));\n};\n"]}