@xplortech/apollo-core 2.6.0 → 2.7.0

package/dist/types/components/xpl-tabs/xpl-tabs.d.ts

@@ -1,28 +1,47 @@
 import { EventEmitter } from '../../stencil-public-runtime';
 export declare class Tabs {
-    value: string;
-    fullWidth: boolean;
-    tabChange: EventEmitter<string>;
-    el: HTMLElement;
-    selectedValue: string;
-    activeBarPosition: {
-        left: number;
-        width: number;
-    };
-    isMobileSelectChange: boolean;
-    onWindowResize(): void;
     private headingsContainerRef;
+    private observer;
+    private rafId;
     private tabHeadings;
     private tabPanels;
-    private observer;
-    private handleTabChange;
-    private getDefaultValue;
-    private updateActiveBarPosition;
-    private updateTabsSelectedState;
-    private collectTabs;
-    private renderChoices;
+    private tablistKeydownBound;
+    el: HTMLElement;
+    private activeBarPosition;
+    private choicesTick;
+    private isMobileSelectChange;
+    private selectedValue;
+    disabled: boolean;
+    onDisabledChanged(): void;
+    fullWidth: boolean;
+    onFullWidthChanged(): void;
+    type: 'tabs' | 'segment';
+    onTypeChanged(): void;
+    value: string;
+    onValueChanged(newValue: string): void;
+    tabChange: EventEmitter<string>;
     connectedCallback(): void;
     disconnectedCallback(): void;
+    componentWillLoad(): void;
     componentDidLoad(): void;
+    componentDidUpdate(): void;
+    componentDidRender(): void;
+    onWindowResize(): void;
+    private syncGroupDisabledOnTabs;
+    private applySelection;
+    private isOwnedTabOrPanel;
+    private collectTabs;
+    private syncVariantOnTabs;
+    private syncFullWidthOnTabs;
+    private getDefaultValue;
+    private handleTabChange;
+    private syncRovingTabindex;
+    private getEnabledTabHeadingsSync;
+    private attachTablistKeydown;
+    private isTablistRtl;
+    private onTablistKeydown;
+    private renderChoices;
+    private updateActiveBarPosition;
+    private mobileSelectClassNames;
     render(): any;
 }

package/dist/types/components/xpl-tag/tag.stories.d.ts

@@ -0,0 +1,65 @@
+interface TagStoryArgs {
+    disabled: boolean;
+    dismissible: boolean;
+    isDraggable: boolean;
+    size: 'default' | 'sm';
+    slot: string;
+    tagId: string;
+}
+declare const _default: {
+    title: string;
+    component: string;
+    argTypes: {
+        size: {
+            options: string[];
+            control: {
+                type: "select";
+            };
+        };
+        disabled: {
+            control: "boolean";
+        };
+        dismissible: {
+            control: "boolean";
+        };
+        isDraggable: {
+            control: "boolean";
+        };
+        slot: {
+            control: "text";
+        };
+        tagId: {
+            control: "text";
+        };
+    };
+};
+export default _default;
+export declare const Tag: {
+    (args: TagStoryArgs): string;
+    args: {
+        disabled: false;
+        dismissible: true;
+        isDraggable: false;
+        size: "default";
+        slot: string;
+        tagId: string;
+    };
+    parameters: {
+        layout: string;
+        docs: {
+            description: {
+                story: string;
+            };
+        };
+        'web-component': {
+            render: string;
+        };
+        html: {
+            render: string;
+        };
+        design: {
+            type: string;
+            url: string;
+        };
+    };
+};

package/dist/types/components/xpl-tag/xpl-tag.d.ts

@@ -1,5 +1,40 @@
 import { EventEmitter } from '../../stencil-public-runtime';
+export interface TagDragStartDetail {
+    tagId?: string;
+    content: string;
+    originalEvent: DragEvent;
+}
+export interface TagDragEndDetail {
+    tagId?: string;
+    dropped: boolean;
+    originalEvent: DragEvent;
+}
 export declare class Tag {
-    close: EventEmitter;
+    el: HTMLElement;
+    private dismissAriaLabelSuffix;
+    private isDragging;
+    disabled: boolean;
+    onDisabledChange(newValue: boolean): void;
+    dismissible: boolean;
+    isDraggable: boolean;
+    onIsDraggableChange(newValue: boolean): void;
+    size: 'default' | 'sm';
+    tagId?: string;
+    close: EventEmitter<void>;
+    tagDragEnd: EventEmitter<TagDragEndDetail>;
+    tagDragStart: EventEmitter<TagDragStartDetail>;
+    tagRemove: EventEmitter<void>;
+    componentDidRender(): void;
+    private getContentLabelText;
+    private syncDismissAriaLabelSuffix;
+    private handleTagClick;
+    private setDragPreviewToHost;
+    private handleContentKeyDown;
+    private handleDismissClick;
+    private handleDragStart;
+    private handleDragEnd;
+    private handleDragOver;
+    private handleDragEnter;
+    private handleHostDragStart;
     render(): any;
 }

package/dist/types/components/xpl-top-nav/top-nav.stories.d.ts

@@ -0,0 +1,471 @@
+export type TopNavPreviewViewportArg = 'responsive' | 'iphone12';
+declare function topNavPreviewViewportDecorator(story: () => unknown, context: {
+    args: TopNavArgs;
+    globals?: Record<string, unknown>;
+}): unknown;
+declare function topNavDarkStoryDecorator(story: () => unknown): HTMLDivElement;
+declare const meta: {
+    title: string;
+    component: string;
+    decorators: (typeof topNavDarkStoryDecorator)[];
+    parameters: {
+        design: {
+            type: "figma";
+            url: string;
+        };
+        darkMode: {
+            current: string;
+        };
+        actions: {
+            handles: string[];
+        };
+        docs: {
+            description: {
+                component: string;
+            };
+        };
+    };
+};
+export default meta;
+export interface TopNavArgs {
+    previewViewport?: TopNavPreviewViewportArg;
+    label?: string;
+    navControl?: boolean;
+    childAccountLabel?: string;
+    brandName?: string;
+    brandHref?: string;
+    brandLogo?: string;
+    menuUsername?: string;
+    menuEmail?: string;
+}
+export declare const TopNavigation: {
+    (args: TopNavArgs): string;
+    args: {
+        previewViewport: "responsive";
+        navControl: true;
+        label: string;
+        childAccountLabel: string;
+        brandName: string;
+        brandHref: string;
+        brandLogo: string;
+        menuUsername: string;
+        menuEmail: string;
+    };
+    decorators: (typeof topNavPreviewViewportDecorator)[];
+    argTypes: {
+        previewViewport: {
+            control: string;
+            options: ("responsive" | "iphone12")[];
+            description: string;
+            table: {
+                category: string;
+            };
+        };
+        brandName: {
+            control: string;
+            description: string;
+        };
+        brandHref: {
+            control: string;
+            description: string;
+        };
+        brandLogo: {
+            control: string;
+            description: string;
+            table: {
+                category: string;
+            };
+        };
+        childAccountLabel: {
+            control: string;
+            description: string;
+        };
+        navControl: {
+            control: string;
+            description: string;
+        };
+        label: {
+            control: string;
+            description: string;
+        };
+        menuUsername: {
+            control: string;
+            description: string;
+            table: {
+                category: string;
+            };
+        };
+        menuEmail: {
+            control: string;
+            description: string;
+            table: {
+                category: string;
+            };
+        };
+        navOpen: {
+            control: boolean;
+            description: string;
+            table: {
+                category: string;
+            };
+        };
+        brandClick: {
+            control: boolean;
+            description: string;
+            table: {
+                category: string;
+            };
+        };
+    };
+    parameters: {
+        layout: string;
+        design: {
+            type: "figma";
+            url: string;
+        };
+        viewport: {
+            viewports: {
+                mobile600: {
+                    name: string;
+                    styles: {
+                        width: string;
+                        height: string;
+                    };
+                    type: "mobile";
+                };
+                iphone5: {
+                    readonly name: "iPhone 5";
+                    readonly styles: {
+                        readonly height: "568px";
+                        readonly width: "320px";
+                    };
+                    readonly type: "mobile";
+                };
+                iphone6: {
+                    readonly name: "iPhone 6";
+                    readonly styles: {
+                        readonly height: "667px";
+                        readonly width: "375px";
+                    };
+                    readonly type: "mobile";
+                };
+                iphone6p: {
+                    readonly name: "iPhone 6 Plus";
+                    readonly styles: {
+                        readonly height: "736px";
+                        readonly width: "414px";
+                    };
+                    readonly type: "mobile";
+                };
+                iphone8p: {
+                    readonly name: "iPhone 8 Plus";
+                    readonly styles: {
+                        readonly height: "736px";
+                        readonly width: "414px";
+                    };
+                    readonly type: "mobile";
+                };
+                iphonex: {
+                    readonly name: "iPhone X";
+                    readonly styles: {
+                        readonly height: "812px";
+                        readonly width: "375px";
+                    };
+                    readonly type: "mobile";
+                };
+                iphonexr: {
+                    readonly name: "iPhone XR";
+                    readonly styles: {
+                        readonly height: "896px";
+                        readonly width: "414px";
+                    };
+                    readonly type: "mobile";
+                };
+                iphonexsmax: {
+                    readonly name: "iPhone XS Max";
+                    readonly styles: {
+                        readonly height: "896px";
+                        readonly width: "414px";
+                    };
+                    readonly type: "mobile";
+                };
+                iphonese2: {
+                    readonly name: "iPhone SE (2nd generation)";
+                    readonly styles: {
+                        readonly height: "667px";
+                        readonly width: "375px";
+                    };
+                    readonly type: "mobile";
+                };
+                iphone12mini: {
+                    readonly name: "iPhone 12 mini";
+                    readonly styles: {
+                        readonly height: "812px";
+                        readonly width: "375px";
+                    };
+                    readonly type: "mobile";
+                };
+                iphone12: {
+                    readonly name: "iPhone 12";
+                    readonly styles: {
+                        readonly height: "844px";
+                        readonly width: "390px";
+                    };
+                    readonly type: "mobile";
+                };
+                iphone12promax: {
+                    readonly name: "iPhone 12 Pro Max";
+                    readonly styles: {
+                        readonly height: "926px";
+                        readonly width: "428px";
+                    };
+                    readonly type: "mobile";
+                };
+                iphoneSE3: {
+                    readonly name: "iPhone SE 3rd generation";
+                    readonly styles: {
+                        readonly height: "667px";
+                        readonly width: "375px";
+                    };
+                    readonly type: "mobile";
+                };
+                iphone13: {
+                    readonly name: "iPhone 13";
+                    readonly styles: {
+                        readonly height: "844px";
+                        readonly width: "390px";
+                    };
+                    readonly type: "mobile";
+                };
+                iphone13pro: {
+                    readonly name: "iPhone 13 Pro";
+                    readonly styles: {
+                        readonly height: "844px";
+                        readonly width: "390px";
+                    };
+                    readonly type: "mobile";
+                };
+                iphone13promax: {
+                    readonly name: "iPhone 13 Pro Max";
+                    readonly styles: {
+                        readonly height: "926px";
+                        readonly width: "428px";
+                    };
+                    readonly type: "mobile";
+                };
+                iphone14: {
+                    readonly name: "iPhone 14";
+                    readonly styles: {
+                        readonly height: "844px";
+                        readonly width: "390px";
+                    };
+                    readonly type: "mobile";
+                };
+                iphone14pro: {
+                    readonly name: "iPhone 14 Pro";
+                    readonly styles: {
+                        readonly height: "852px";
+                        readonly width: "393px";
+                    };
+                    readonly type: "mobile";
+                };
+                iphone14promax: {
+                    readonly name: "iPhone 14 Pro Max";
+                    readonly styles: {
+                        readonly height: "932px";
+                        readonly width: "430px";
+                    };
+                    readonly type: "mobile";
+                };
+                ipad: {
+                    readonly name: "iPad";
+                    readonly styles: {
+                        readonly height: "1024px";
+                        readonly width: "768px";
+                    };
+                    readonly type: "tablet";
+                };
+                ipad10p: {
+                    readonly name: "iPad Pro 10.5-in";
+                    readonly styles: {
+                        readonly height: "1112px";
+                        readonly width: "834px";
+                    };
+                    readonly type: "tablet";
+                };
+                ipad11p: {
+                    readonly name: "iPad Pro 11-in";
+                    readonly styles: {
+                        readonly height: "1194px";
+                        readonly width: "834px";
+                    };
+                    readonly type: "tablet";
+                };
+                ipad12p: {
+                    readonly name: "iPad Pro 12.9-in";
+                    readonly styles: {
+                        readonly height: "1366px";
+                        readonly width: "1024px";
+                    };
+                    readonly type: "tablet";
+                };
+                galaxys5: {
+                    readonly name: "Galaxy S5";
+                    readonly styles: {
+                        readonly height: "640px";
+                        readonly width: "360px";
+                    };
+                    readonly type: "mobile";
+                };
+                galaxys9: {
+                    readonly name: "Galaxy S9";
+                    readonly styles: {
+                        readonly height: "740px";
+                        readonly width: "360px";
+                    };
+                    readonly type: "mobile";
+                };
+                nexus5x: {
+                    readonly name: "Nexus 5X";
+                    readonly styles: {
+                        readonly height: "660px";
+                        readonly width: "412px";
+                    };
+                    readonly type: "mobile";
+                };
+                nexus6p: {
+                    readonly name: "Nexus 6P";
+                    readonly styles: {
+                        readonly height: "732px";
+                        readonly width: "412px";
+                    };
+                    readonly type: "mobile";
+                };
+                pixel: {
+                    readonly name: "Pixel";
+                    readonly styles: {
+                        readonly height: "960px";
+                        readonly width: "540px";
+                    };
+                    readonly type: "mobile";
+                };
+                pixelxl: {
+                    readonly name: "Pixel XL";
+                    readonly styles: {
+                        readonly height: "1280px";
+                        readonly width: "720px";
+                    };
+                    readonly type: "mobile";
+                };
+            };
+        };
+        'web-component': {
+            render: string;
+        };
+        html: {
+            render: string;
+        };
+    };
+};
+interface TopNavItemArgs {
+    active?: boolean;
+    href?: string;
+    icon?: string;
+    itemAriaLabel?: string;
+    label?: string;
+    selected?: boolean;
+}
+export declare const TopNavItem: {
+    (args: TopNavItemArgs): string;
+    args: {
+        href: string;
+        label: string;
+        selected: boolean;
+    };
+    argTypes: {
+        active: {
+            control: string;
+            description: string;
+        };
+        href: {
+            control: string;
+            description: string;
+        };
+        label: {
+            control: string;
+            description: string;
+        };
+        icon: {
+            control: string;
+            description: string;
+        };
+        itemAriaLabel: {
+            control: string;
+            description: string;
+        };
+        selected: {
+            control: string;
+            description: string;
+        };
+        navItemClick: {
+            control: boolean;
+            description: string;
+            table: {
+                category: string;
+            };
+        };
+    };
+    parameters: {
+        layout: string;
+        design: {
+            type: "figma";
+            url: string;
+        };
+        'web-component': {
+            render: string;
+        };
+        html: {
+            render: string;
+        };
+    };
+};
+interface TopNavMenuArgs {
+    username?: string;
+    email?: string;
+    showRightAsideMobile?: boolean;
+}
+export declare const TopNavMenu: {
+    (args: TopNavMenuArgs): string;
+    args: {
+        username: string;
+        email: string;
+        showRightAsideMobile: boolean;
+    };
+    argTypes: {
+        username: {
+            control: string;
+            description: string;
+        };
+        email: {
+            control: string;
+            description: string;
+        };
+        showRightAsideMobile: {
+            control: string;
+            description: string;
+        };
+    };
+    parameters: {
+        layout: string;
+        design: {
+            type: "figma";
+            url: string;
+        };
+        'web-component': {
+            render: string;
+        };
+        html: {
+            render: string;
+        };
+    };
+};

package/dist/types/components/xpl-top-nav/xpl-nav-header-menu/xpl-nav-header-menu.d.ts

@@ -0,0 +1,18 @@
+export declare class NavHeaderMenu {
+    private deferredRightAsideSlotWorkTimeoutId?;
+    private rightAsideMobileSlotObserver?;
+    el: HTMLElement;
+    private rightAsideMobilePresent;
+    email?: string;
+    username?: string;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    componentWillLoad(): void;
+    componentWillRender(): void;
+    componentDidRender(): void;
+    private scheduleDeferredRightAsideSlotWork;
+    private connectRightAsideMobileSlotObserver;
+    private disconnectRightAsideMobileSlotObserver;
+    private syncRightAsideMobileSlotPresent;
+    render(): any;
+}

package/dist/types/components/xpl-top-nav/xpl-top-nav-item/xpl-top-nav-item.d.ts

@@ -0,0 +1,48 @@
+import { EventEmitter } from '../../../stencil-public-runtime';
+export declare class TopNavItem {
+    private deferredHasDropdownObserverSyncTimeoutId?;
+    private deferredPostRenderTopNavItemTimeoutId?;
+    private dropdownSlotObserver?;
+    private parentListitemContextObserver?;
+    private selfListitemContextObserver?;
+    el: HTMLElement;
+    hasDropdown: boolean;
+    onHasDropdownChanged(): void;
+    private hostListitemRole;
+    open: boolean;
+    active: boolean;
+    href?: string;
+    icon: string;
+    itemAriaLabel?: string;
+    label?: string;
+    selected: boolean;
+    navItemClick: EventEmitter<MouseEvent>;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    componentWillLoad(): void;
+    componentWillRender(): void;
+    componentDidRender(): void;
+    handleCloseNavDropdownRequest(): void;
+    private scheduleHasDropdownSyncFromObserver;
+    private connectDropdownSlotObserver;
+    private disconnectDropdownSlotObserver;
+    private disconnectListitemContextObservers;
+    private connectListitemContextObservers;
+    private schedulePostRenderTopNavItemWork;
+    private syncDropdownDocListeners;
+    private syncHasDropdownFromDom;
+    private onDocClickCapture;
+    private onDocKeyDownCapture;
+    private getNavDropdownBroadcastRoot;
+    private broadcastCloseOtherDropdownHosts;
+    private syntheticActivationClickFromKeyboard;
+    private handleClick;
+    private handleKeyDown;
+    private static isInternalRenderedHostChild;
+    private hasNonDropdownLightDomChild;
+    private getInnerAriaLabel;
+    private computeHostListitemRole;
+    private syncHostListitemRole;
+    private renderInner;
+    render(): any;
+}