@xplortech/apollo-core 2.4.3 → 2.6.0

package/dist/types/components/xpl-input/xpl-input-phone/xpl-input-phone.d.ts

@@ -0,0 +1,48 @@
+import { EventEmitter } from '../../../stencil-public-runtime';
+import { type PhoneCountry } from './phone-country-data';
+export declare class InputPhone {
+    private dropdownRef;
+    private inputEl;
+    private lastCursorRef;
+    private lastFormattedRef;
+    el: HTMLElement;
+    dropdownOpen: boolean;
+    onDropdownOpenChange(isOpen: boolean): void;
+    hasErrorState: string | null;
+    onHasErrorStateChanged(newValue: string | null): void;
+    nationalNumber: string;
+    searchQuery: string;
+    selectedCountry: PhoneCountry;
+    triggerId: string;
+    defaultCountry?: string;
+    disabled?: boolean;
+    inputId?: string;
+    isInternational?: boolean;
+    name?: string;
+    placeholder?: string;
+    preferredCountries?: string[];
+    readonly?: boolean;
+    required?: boolean;
+    value?: string;
+    onValueChange(newValue: string): void;
+    hasErrorStateChanged: EventEmitter<string | null>;
+    valueChange: EventEmitter<string>;
+    componentWillLoad(): void;
+    componentDidUpdate(): void;
+    private get effectiveCountryCode();
+    private get effectiveDialCode();
+    private get isEditable();
+    private get orderedCountries();
+    private get filteredCountries();
+    private get displayValue();
+    private get effectivePlaceholder();
+    private get dropdownOptions();
+    private get maxInputLength();
+    private emitValue;
+    private validate;
+    private handleTriggerClick;
+    private handleNumberInput;
+    private handleClear;
+    private handleDropdownUpdate;
+    render(): any;
+}

package/dist/types/components/xpl-input/xpl-input-time/xpl-input-time.d.ts

@@ -1,6 +1,6 @@
 import { EventEmitter } from '../../../stencil-public-runtime';
 import { DropdownItem } from '../../xpl-dropdown/dropdown-option';
-export declare class XplInputTime {
+export declare class InputTime {
     inputId?: string;
     disabled?: boolean;
     name?: string;

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

@@ -1,5 +1,6 @@
 import { EventEmitter } from '../../stencil-public-runtime';
-export declare class XplInput {
+export declare class Input {
+    el: HTMLElement;
     _id?: string;
     description?: string;
     disabled?: boolean;
@@ -28,7 +29,10 @@ export declare class XplInput {
     hideFileNames?: boolean;
     hideAcceptText?: boolean;
     hideEyeDropper?: boolean;
-    type?: 'date' | 'time' | 'text' | 'number' | 'password' | 'file' | 'color';
+    defaultCountry?: string;
+    preferredCountries?: string[];
+    isInternational?: boolean;
+    type?: 'date' | 'time' | 'text' | 'number' | 'password' | 'file' | 'color' | 'phone';
     focusEvent: EventEmitter<FocusEvent>;
     blurEvent: EventEmitter<FocusEvent>;
     valueChange: EventEmitter<string>;
@@ -36,12 +40,18 @@ export declare class XplInput {
     private valueChanged;
     characterCount: number;
     passwordVisible: boolean;
+    hasPreSlotContent: boolean;
     private input;
     private updateCharacterCount;
     private handleFocus;
     private handleBlur;
     private handleInput;
+    private preSlotObserver?;
+    private hasDirectPreSlotChild;
+    private syncPreSlotContent;
     componentWillLoad(): void;
+    componentDidLoad(): void;
+    disconnectedCallback(): void;
     private renderInput;
     render(): any;
 }

package/dist/types/components/xpl-large-card/large-card.stories.d.ts

@@ -67,5 +67,9 @@ export declare const LargeCard: {
         html: {
             render: string;
         };
+        design: {
+            type: string;
+            url: string;
+        };
     };
 };

package/dist/types/components/xpl-large-card/xpl-large-card.d.ts

@@ -1,4 +1,4 @@
-export declare class XplLargeCard {
+export declare class LargeCard {
     el: HTMLXplLargeCardElement;
     link?: boolean;
     name: string;

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

@@ -59,5 +59,9 @@ export declare const List: {
         html: {
             render: void;
         };
+        design: {
+            type: string;
+            url: string;
+        };
     };
 };

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

@@ -1,5 +1,5 @@
 import type { ListItem } from './listitem';
-export declare class XplList {
+export declare class List {
     items?: ListItem[];
     render(): any;
 }

package/dist/types/components/xpl-main-nav/xpl-main-nav.d.ts

@@ -1,5 +1,5 @@
 import { EventEmitter } from '../../stencil-public-runtime';
-export declare class XplMainNav {
+export declare class MainNav {
     width: 'default' | 'md' | 'sm';
     navWidth: EventEmitter<string>;
     private navWidthHandler;

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

@@ -95,5 +95,9 @@ export declare const Modal: {
     };
     parameters: {
         layout: string;
+        design: {
+            type: string;
+            url: string;
+        };
     };
 };

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

@@ -1,5 +1,5 @@
 import { EventEmitter } from '../../stencil-public-runtime';
-export declare class XplModal {
+export declare class Modal {
     isOpen: boolean;
     size: 'large' | 'medium' | 'small';
     variant: 'default' | 'warning';

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

@@ -1,5 +1,5 @@
 import { EventEmitter } from '../../stencil-public-runtime';
-export declare class XplNavItem {
+export declare class NavItem {
     navControl?: boolean;
     navOpen: EventEmitter<boolean>;
     private onNavToggle;

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

@@ -31,5 +31,9 @@ export declare const Pagination: {
         'web-component': {
             render: string;
         };
+        design: {
+            type: string;
+            url: string;
+        };
     };
 };

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

@@ -1,5 +1,5 @@
 import { EventEmitter } from '../../stencil-public-runtime';
-export declare class XplPagination {
+export declare class Pagination {
     totalPages: number;
     withPageControl: boolean;
     currentPage: number;

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

@@ -0,0 +1,20 @@
+declare const _default: {
+    title: string;
+    component: string;
+    argTypes: {
+        accent: {
+            options: string[];
+            control: {
+                type: "select";
+            };
+        };
+        padding: {
+            options: string[];
+            control: {
+                type: "select";
+            };
+        };
+    };
+};
+export default _default;
+export declare const Panel: any;

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

@@ -0,0 +1,5 @@
+export declare class XplPanel {
+    accent: 'none' | 'primary' | 'secondary' | 'positive' | 'negative' | 'highlight';
+    padding: 'default' | 'tight' | 'loose';
+    render(): any;
+}

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

@@ -1,6 +1,6 @@
 import { EventEmitter } from '../../stencil-public-runtime';
 export type PopoverPosition = 'top-left' | 'middle-left' | 'bottom-left' | 'top-right' | 'middle-right' | 'bottom-right' | 'top-start' | 'top-middle' | 'top-end' | 'bottom-start' | 'bottom-middle' | 'bottom-end';
-export declare class XplPopover {
+export declare class Popover {
     el: HTMLElement;
     isOpen: boolean;
     disabled: boolean;

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

@@ -30,5 +30,9 @@ export declare const Progress: {
         html: {
             render: string;
         };
+        design: {
+            type: string;
+            url: string;
+        };
     };
 };

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

@@ -1,4 +1,4 @@
-export declare class XplProgress {
+export declare class Progress {
     steps?: string[];
     currentStep: number;
     private getCircleClass;

package/dist/types/components/xpl-progress-bar/progress-bar.stories.d.ts

@@ -0,0 +1,73 @@
+declare const _default: {
+    title: string;
+    argTypes: {
+        label: {
+            type: {
+                name: "string";
+                required: false;
+            };
+            description: string;
+        };
+        helperText: {
+            type: {
+                name: "string";
+                required: false;
+            };
+            description: string;
+        };
+        max: {
+            control: {
+                type: "number";
+            };
+            description: string;
+        };
+        value: {
+            control: {
+                type: "range";
+                min: number;
+                max: number;
+                step: number;
+            };
+            description: string;
+        };
+        size: {
+            options: string[];
+            control: {
+                type: "select";
+            };
+            description: string;
+        };
+        variant: {
+            options: string[];
+            control: {
+                type: "select";
+            };
+            description: string;
+        };
+    };
+};
+export default _default;
+export declare const ProgressBar: {
+    (args: any): string;
+    args: {
+        label: string;
+        helperText: string;
+        max: number;
+        value: number;
+        size: string;
+        variant: string;
+    };
+    parameters: {
+        layout: string;
+        'web-component': {
+            render: string;
+        };
+        html: {
+            render: string;
+        };
+        design: {
+            type: string;
+            url: string;
+        };
+    };
+};

package/dist/types/components/xpl-progress-bar/xpl-progress-bar.d.ts

@@ -0,0 +1,15 @@
+export declare class ProgressBar {
+    helperText?: string;
+    label?: string;
+    max: number;
+    size: 'sm' | 'lg';
+    value: number;
+    variant: 'default' | 'success' | 'error' | 'indeterminate';
+    private get clampedValue();
+    private get isComplete();
+    private get isError();
+    private get isSuccess();
+    private get showStatusIcon();
+    private get isIndeterminate();
+    render(): any;
+}

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

@@ -75,5 +75,9 @@ export declare const Radio: {
         html: {
             render: string;
         };
+        design: {
+            type: string;
+            url: string;
+        };
     };
 };

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

@@ -1,5 +1,5 @@
 import { EventEmitter } from '../../stencil-public-runtime';
-export declare class XplRadio {
+export declare class Radio {
     checked?: boolean;
     description?: string;
     disabled?: boolean;

package/dist/types/components/xpl-secondary-nav/xpl-secondary-nav.d.ts

@@ -1,3 +1,3 @@
-export declare class XplSecondaryNav {
+export declare class SecondaryNav {
     render(): any;
 }

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

@@ -121,6 +121,10 @@ export declare const Select: {
         html: {
             render: void;
         };
+        design: {
+            type: string;
+            url: string;
+        };
     };
 };
 export declare const SelectWValues: {

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

@@ -1,10 +1,8 @@
 import { EventEmitter } from '../../stencil-public-runtime';
-import data from '@xplortech/apollo-icons/build/data.json';
 import type { DropdownItem } from '../xpl-dropdown/dropdown-option';
-export type IconName = keyof typeof data;
-export declare class XplSelect {
+export declare class Select {
     choices?: DropdownItem[];
-    selectIcon?: IconName;
+    selectIcon?: string;
     description?: string;
     disabled?: boolean;
     error?: string;

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

@@ -0,0 +1,80 @@
+import type { StoryObj } from '@storybook/web-components-vite';
+export interface NavItem {
+    label: string;
+    icon?: string;
+    selected?: boolean;
+    disabled?: boolean;
+    hidden?: boolean;
+    expanded?: boolean;
+    hasChildren?: boolean;
+    link?: boolean;
+    href?: string;
+    children?: NavItem[];
+}
+export interface NavDemoConfig {
+    navLabel: string;
+    items: NavItem[];
+    footerItems: NavItem[];
+}
+interface SideNavFullDemoArgs {
+    navConfig: NavDemoConfig;
+}
+declare const _default: {
+    title: string;
+    component: string;
+    parameters: {
+        layout: string;
+    };
+};
+export default _default;
+export declare const SideNavigation: {
+    ({ navConfig }: SideNavFullDemoArgs): string;
+    args: {
+        navConfig: {
+            navLabel: string;
+            items: NavItem[];
+            footerItems: NavItem[];
+        };
+    };
+    argTypes: {
+        navConfig: {
+            control: string;
+            description: string;
+        };
+    };
+    parameters: {
+        layout: string;
+        design: {
+            type: string;
+            url: string;
+        };
+        docs: {
+            description: {
+                story: string;
+            };
+        };
+        'web-component': {
+            render: string;
+        };
+        html: {
+            render: string;
+        };
+    };
+};
+type SideNavItemStory = StoryObj<{
+    label: string;
+    icon: string;
+    selected: boolean;
+    disabled: boolean;
+    hidden: boolean;
+    expanded: boolean;
+    hasChildren: boolean;
+    link: boolean;
+    childLabel1: string;
+    childLabel2: string;
+}>;
+export declare const ItemPlayground: SideNavItemStory;
+type FooterStory = StoryObj<{
+    footerItems: NavItem[];
+}>;
+export declare const FooterSlot: FooterStory;

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

@@ -0,0 +1,20 @@
+import { EventEmitter } from '../../../stencil-public-runtime';
+export declare class SideNavItem {
+    el: HTMLElement;
+    disabled: boolean;
+    expanded: boolean;
+    hasChildren: boolean;
+    hidden: boolean;
+    icon?: string;
+    label?: string;
+    link: boolean;
+    private syncLinkHasChildrenExclusivity;
+    selected: boolean;
+    expandedChange: EventEmitter<boolean>;
+    navClick: EventEmitter<void>;
+    componentWillLoad(): void;
+    componentWillRender(): void;
+    private enforceLinkExcludesHasChildren;
+    private handleClick;
+    render(): any;
+}

package/dist/types/components/xpl-side-nav/xpl-side-nav.d.ts

@@ -0,0 +1,4 @@
+export declare class SideNav {
+    label?: string;
+    render(): any;
+}

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

@@ -1,4 +1,4 @@
-export declare class XplSkeleton {
+export declare class Skeleton {
     classNames?: string;
     fullWidth?: boolean;
     height?: CSSStyleDeclaration['height'];

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

@@ -111,4 +111,10 @@ export declare const Slideout: {
         tertiaryButtonText: string;
         variant: string;
     };
+    parameters: {
+        design: {
+            type: string;
+            url: string;
+        };
+    };
 };

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

@@ -1,5 +1,5 @@
 import { EventEmitter } from '../../stencil-public-runtime';
-export declare class XplSlideout {
+export declare class Slideout {
     isOpen: boolean;
     backdrop: boolean;
     variant: 'default' | 'warning';

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

@@ -1,5 +1,5 @@
 import { EventEmitter } from '../../stencil-public-runtime';
-export declare class XplTab {
+export declare class Tab {
     target: string;
     selected: boolean;
     tabChange: EventEmitter<string>;

package/dist/types/components/xpl-tab-panel/xpl-tab-panel.d.ts

@@ -1,4 +1,4 @@
-export declare class XplTabPanel {
+export declare class TabPanel {
     target: string;
     selected: boolean;
     render(): any;

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

@@ -80,5 +80,9 @@ export declare const Table: {
         html: {
             render: string[];
         };
+        design: {
+            type: string;
+            url: string;
+        };
     };
 };

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

@@ -1,5 +1,5 @@
 import { EventEmitter } from '../../stencil-public-runtime';
-export declare class XplTable {
+export declare class Table {
     el: HTMLXplTableElement;
     columns?: string[];
     data?: string[][];

package/dist/types/components/xpl-table-header/table-header.stories.d.ts

@@ -99,5 +99,9 @@ export declare const TableHeader: {
         html: {
             render: string;
         };
+        design: {
+            type: string;
+            url: string;
+        };
     };
 };

package/dist/types/components/xpl-table-header/xpl-table-header.d.ts

@@ -1,3 +1,3 @@
-export declare class XplTableHeader {
+export declare class TableHeader {
     render(): any;
 }

package/dist/types/components/xpl-table-header-cell/table-header-cell.stories.d.ts

@@ -51,5 +51,9 @@ export declare const TableHeaderCell: {
                 sortable: any;
             }) => string;
         };
+        design: {
+            type: string;
+            url: string;
+        };
     };
 };

package/dist/types/components/xpl-table-header-cell/xpl-table-header-cell.d.ts

@@ -1,8 +1,7 @@
 import { EventEmitter } from '../../stencil-public-runtime';
-import { IconName } from '../xpl-icon/xpl-icon';
-export declare class XplTableHeaderCell {
+export declare class TableHeaderCell {
     el: HTMLXplTableHeaderCellElement;
-    icon?: IconName;
+    icon?: string;
     sortable?: boolean;
     label?: string;
     type: 'label' | 'checkbox' | 'icon';

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

@@ -36,5 +36,9 @@ export declare const Tabs: {
         html: {
             render: string[];
         };
+        design: {
+            type: string;
+            url: string;
+        };
     };
 };

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

@@ -1,10 +1,10 @@
 import { EventEmitter } from '../../stencil-public-runtime';
-export declare class XplTabs {
+export declare class Tabs {
     value: string;
     fullWidth: boolean;
     tabChange: EventEmitter<string>;
     el: HTMLElement;
-    selectedValue: any;
+    selectedValue: string;
     activeBarPosition: {
         left: number;
         width: number;

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

@@ -1,5 +1,5 @@
 import { EventEmitter } from '../../stencil-public-runtime';
-export declare class XplTag {
+export declare class Tag {
     close: EventEmitter;
     render(): any;
 }

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

@@ -58,5 +58,9 @@ export declare const Toast: {
         html: {
             render: string;
         };
+        design: {
+            type: string;
+            url: string;
+        };
     };
 };

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

@@ -1,4 +1,4 @@
-export declare class XplToast {
+export declare class Toast {
     el: HTMLXplToastElement;
     variant: 'neutral' | 'warning' | 'success';
     showIcon?: boolean;

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

@@ -63,5 +63,9 @@ export declare const Toggle: {
         html: {
             render: string;
         };
+        design: {
+            type: string;
+            url: string;
+        };
     };
 };

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

@@ -1,4 +1,4 @@
-export declare class XplToggle {
+export declare class Toggle {
     checked?: boolean;
     description?: string;
     disabled?: boolean;