@momentum-ui/web-components 2.22.17 → 2.23.1

package/dist/types/components/popover/Popover.utils.d.ts

@@ -0,0 +1,63 @@
+import { type Popover } from "./Popover";
+export declare class PopoverUtils {
+    /** @internal */
+    private readonly popover;
+    /** @internal */
+    private arrowPixelChange;
+    /** @internal */
+    private originalParent;
+    /** @internal */
+    private originalNextSibling;
+    constructor(popover: Popover);
+    /**
+     * Parses the delay string and sets the open and close delay values.
+     * If the delay string is invalid, the delay is set to 0.
+     * @returns An array containing the open and close delay values.
+     * @throws An error if the delay value is invalid.
+     */
+    setupDelay(): number[];
+    /**
+     * Sets up the hover bridge for the popover.
+     * The hover bridge is used to prevent the popover from closing when the mouse is over the popover.
+     *
+     * @param placement - The placement of the popover.
+     */
+    setupHoverBridge(placement: string): void;
+    /**
+     * If the `appendTo` property is set, finds the corresponding
+     * DOM element by its ID, and appends this popover as a child of that element when opened.
+     * When closed, returns to original position.
+     * @param isOpen Whether the popover is being opened (true) or closed (false)
+     */
+    handleAppendTo(isOpen: boolean): void;
+    /**
+     * Sets up the accessibility attributes for the popover.
+     */
+    setupAccessibility(): void;
+    /**
+     * Updates the aria-haspopup attribute on the trigger element.
+     */
+    updateAriaHasPopupAttribute(): void;
+    /**
+     * Updates the aria-expanded attribute on the trigger element.
+     */
+    updateAriaExpandedAttribute(): void;
+    /**
+     * Updates the arrow style based on the arrow data and placement.
+     *
+     * @param arrowData - The arrow data x and y.
+     * @param placement - The placement of the popover.
+     */
+    updateArrowStyle(arrowData: {
+        x?: number;
+        y?: number;
+    }, placement: string): void;
+    /**
+     * Updates the popover style based on the x and y position.
+     *
+     * @param x - The x position.
+     * @param y - The y position.
+     */
+    updatePopoverStyle(x: number, y: number): void;
+    createBackdrop(): void;
+}

package/dist/types/components/theme/Theme.d.ts

@@ -49,6 +49,7 @@ export declare namespace Theme {
         virtualReference: HTMLDivElement;
         private placement;
         private popperInstance;
+        private activeTooltipTrigger;
         private setTheme;
         getStyleElement(): HTMLStyleElement;
         applyStyle(): void;

package/dist/types/index.d.ts

@@ -30,6 +30,7 @@ export { CoachmarkPopover } from "./components/coachmark-popover/CoachmarkPopove
 export { Coachmark } from "./components/coachmark/Coachmark";
 export { CodeEditor } from "./components/code-editor/CodeEditor";
 export { ComboBox } from "./components/combobox/ComboBox";
+export { CountryCodePicker } from "./components/country-code-picker/CountryCodePicker";
 export { DateRangePicker } from "./components/date-range-picker/DateRangePicker";
 export { DateTimePicker } from "./components/date-time-picker/DateTimePicker";
 export { DatePicker } from "./components/datepicker/DatePicker";
@@ -81,3 +82,4 @@ export { ToggleSwitch } from "./components/toggle-switch/ToggleSwitch";
 export { Tooltip } from "./components/tooltip/Tooltip";
 export { iconUrlManager } from "./managers/IconUrlManager";
 export { ThemeManager, themeManager } from "./managers/ThemeManager";
+export type { Events, PopoverColor, PopoverPlacement, PopoverStrategy, PopoverTrigger } from "./components/popover/Popover.types";

package/dist/types/utils/helpers.d.ts

@@ -16,3 +16,5 @@ export declare function debounce<T>(func: Function, wait: number, immediate?: bo
 export declare const throttle: (fn: (...args: any[]) => unknown, delay?: number) => (...args: any[]) => void;
 export declare function closestElement(selector: string, base: HTMLElement): HTMLElement | null;
 export declare function getElementSafe<T>(elements: T[], index: number): T | undefined;
+export declare function querySelectorDeep(selector: string, base?: HTMLElement | Document | ShadowRoot): Element | null;
+export declare function getElementByIdDeep(id: string, base?: HTMLElement | Document | ShadowRoot): Element | null;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@momentum-ui/web-components",
-  "version": "2.22.17",
+  "version": "2.23.1",
   "author": "Yana Harris",
   "license": "MIT",
   "repository": "https://github.com/momentum-design/momentum-ui.git",
@@ -15,6 +15,7 @@
     "@interactjs/utils": "1.10.3",
     "@momentum-design/icons": "0.19.0",
     "@popperjs/core": "^2.11.8",
+    "@floating-ui/dom": "^1.7.0",
     "country-codes-list": "1.6.8",
     "country-flags-svg": "1.1.4",
     "dompurify": "^3.2.4",

package/dist/4663.js

@@ -1 +0,0 @@
-"use strict";(self["momentum-web-components-[id]"]=self["momentum-web-components-[id]"]||[]).push([[4663,5211],{35211:(o,r,e)=>{e.d(r,{KC:()=>p});const p=16},50325:(o,r,e)=>{e.d(r,{A:()=>p});const p=e(41488).css`.md-popover{box-sizing:border-box;position:relative;color:var(--popover-text-color);--popover-variant-border-color:var(--popover-border-color);--popover-variant-bg-color:var(--popover-bg-color)}.md-popover.inverted{color:var(--popover-inverted-text-color);--popover-variant-border-color:var(--popover-inverted-border-color);--popover-variant-bg-color:var(--popover-inverted-bg-color)}.md-popover *{box-sizing:inherit}.md-popover .popover-container{filter:drop-shadow(0 0 1px rgba(0, 0, 0, .12)) drop-shadow(0 24px 48px rgba(0, 0, 0, .2));box-sizing:border-box;display:none;position:absolute;z-index:1000;background-color:var(--popover-variant-bg-color);border:1px solid var(--popover-variant-border-color);border-radius:.5rem;padding:.75rem;min-height:24px;min-width:14px;max-width:292px}.md-popover .popover-container[data-show]{display:flex}.md-popover .popover-content{display:flex;justify-content:space-around;width:100%;flex-grow:1;font-size:1rem;font-weight:400;line-height:1.5rem}.md-popover .cancel-icon-button{position:absolute;right:.75rem;top:.75rem;padding-left:.5rem;width:1.25rem;height:1.25rem;cursor:pointer}.md-popover .popover-arrow{position:absolute;width:0;height:0;visibility:hidden}.md-popover .popover-arrow::before{content:"";position:absolute;width:16px;height:16px;background:var(--popover-variant-bg-color);border:1px solid var(--popover-variant-border-color);transform:rotate(45deg);visibility:visible}.popover-container[data-popper-placement^=top]>.popover-arrow{bottom:0}.popover-container[data-popper-placement^=top]>.popover-arrow::before{left:calc(50% - 8px);bottom:-9px;border-top:none;border-left:none;border-bottom-right-radius:3px}.popover-container[data-popper-placement^=bottom]>.popover-arrow{top:0}.popover-container[data-popper-placement^=bottom]>.popover-arrow::before{left:calc(50% - 8px);top:-9px;border-bottom:none;border-right:none;border-top-left-radius:3px}.popover-container[data-popper-placement^=right]>.popover-arrow{left:0}.popover-container[data-popper-placement^=right]>.popover-arrow::before{left:-9px;top:calc(50% - 8px);border-right:none;border-top:none;border-bottom-left-radius:3px}.popover-container[data-popper-placement^=left]>.popover-arrow{right:0}.popover-container[data-popper-placement^=left]>.popover-arrow::before{right:-9px;border-bottom:none;border-left:none;top:calc(50% - 8px);border-top-right-radius:3px}`}}]);