@xplortech/apollo-core 2.5.0 → 2.7.0

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

@@ -40,17 +40,11 @@ declare const _default: {
                 type: "select";
             };
         };
-        timeFormat: {
-            control: {
-                type: "select";
-            };
-            options: string[];
-        };
     };
 };
 export default _default;
 export declare const Input: {
-    ({ label, description, disabled, error, errorMessage, pre, post, type }: {
+    ({ label, description, disabled, error, errorMessage, pre, post, type, defaultCountry, isInternational, }: {
         label: any;
         description: any;
         disabled: any;
@@ -59,6 +53,8 @@ export declare const Input: {
         pre: any;
         post: any;
         type: any;
+        defaultCountry: any;
+        isInternational: any;
     }): string;
     args: {
         label: string;
@@ -69,6 +65,30 @@ export declare const Input: {
         pre: string;
         post: string;
         type: string;
+        defaultCountry: string;
+        isInternational: boolean;
+    };
+    argTypes: {
+        defaultCountry: {
+            control: {
+                type: string;
+            };
+            description: string;
+            if: {
+                arg: string;
+                eq: string;
+            };
+        };
+        isInternational: {
+            control: {
+                type: string;
+            };
+            description: string;
+            if: {
+                arg: string;
+                eq: string;
+            };
+        };
     };
     parameters: {
         layout: string;
@@ -195,6 +215,14 @@ export declare const Timepicker: {
         max: string;
         type: string;
     };
+    argTypes: {
+        timeFormat: {
+            control: {
+                type: string;
+            };
+            options: string[];
+        };
+    };
     parameters: {
         layout: string;
         'web-component': {
@@ -208,3 +236,5 @@ export declare const Timepicker: {
 export declare const Password: any;
 export declare const File: any;
 export declare const Color: any;
+export declare const Phone: any;
+export declare const Search: any;

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

@@ -1,6 +1,6 @@
 import { EventEmitter } from '../../../stencil-public-runtime';
 import { ColorValues } from './color-utils';
-export declare class XplInputColor {
+export declare class InputColor {
     value: string;
     placeholder: string;
     disabled?: boolean;

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

@@ -1,5 +1,6 @@
 import { EventEmitter } from '../../../stencil-public-runtime';
-export declare class XplInputDate {
+export declare class InputDate {
+    el: HTMLElement;
     inputId?: string;
     disabled?: boolean;
     name?: string;
@@ -19,12 +20,18 @@ export declare class XplInputDate {
         start: Date;
         end: Date;
     }>;
+    private flatpickrStaticLayout;
     private hasErrorState?;
-    private flatpickrInstance;
+    private flatpickrInstance?;
     private valueChanged;
     onHasErrorStateChanged(newValue: string | null): void;
     onValueChanged(newValue: string | string[]): void;
     private input;
-    componentDidLoad(): void;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    componentDidRender(): void;
+    private ensureFlatpickr;
+    private initFlatpickr;
+    private unwrapStaleFlatpickrWrapper;
     render(): any;
 }

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

@@ -1,5 +1,5 @@
 import { EventEmitter } from '../../../stencil-public-runtime';
-export declare class XplInputFile {
+export declare class InputFile {
     el: HTMLElement;
     disabled?: boolean;
     name?: string;

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

@@ -0,0 +1,13 @@
+export interface PhoneCountry {
+    countryCode: string;
+    dialCode: string;
+    name: string;
+}
+export declare const PHONE_COUNTRIES: PhoneCountry[];
+export declare function getCountryByCode(countryCode: string): PhoneCountry | undefined;
+export declare function getCountryByDialCode(dialCode: string): PhoneCountry | undefined;
+export declare function parseE164(value: string): {
+    dialCode: string;
+    nationalNumber: string;
+} | null;
+export declare function toE164(dialCode: string, nationalNumber: string): string;

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

@@ -0,0 +1,5 @@
+export declare function digitsOnly(value: string): string;
+export declare function getMaxNationalNumberLength(countryCode: string): number;
+export declare function getPlaceholderPattern(countryCode: string): string;
+export declare function formatNationalNumber(digits: string, countryCode: string): string;
+export declare function getCursorPositionAfterFormat(prevFormatted: string, nextFormatted: string, prevCursor: number): number;

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-search/xpl-input-search.d.ts

@@ -0,0 +1,39 @@
+import { EventEmitter } from '../../../stencil-public-runtime';
+export declare class InputSearch {
+    private inputEl?;
+    el: HTMLElement;
+    private hasAncestorForm;
+    ariaLabel: string;
+    autocomplete: string;
+    disabled: boolean;
+    errorMessageId?: string;
+    hasError: boolean;
+    hasVisibleLabel: boolean;
+    inputId: string;
+    name?: string;
+    placeholder: string;
+    readonly: boolean;
+    required: boolean;
+    shape: 'rounded' | 'box';
+    value: string;
+    blurEvent: EventEmitter<FocusEvent>;
+    focusEvent: EventEmitter<FocusEvent>;
+    inputEvent: EventEmitter<string>;
+    search: EventEmitter<string>;
+    valueChange: EventEmitter<string>;
+    connectedCallback(): void;
+    setFocus(): Promise<void>;
+    private syncAncestorFormFlag;
+    private get hasValue();
+    private get resolvedInputAriaLabel();
+    private get rendersInnerSearchForm();
+    private emitSearchCommit;
+    private handleInnerFormSubmit;
+    private handleClear;
+    private handleInput;
+    private handleKeyDown;
+    private handleFocus;
+    private handleBlur;
+    private renderShell;
+    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,9 @@
 import { EventEmitter } from '../../stencil-public-runtime';
-export declare class XplInput {
+export declare class Input {
+    private input;
+    private preSlotObserver?;
+    private searchInputRef?;
+    el: HTMLElement;
     _id?: string;
     description?: string;
     disabled?: boolean;
@@ -28,20 +32,34 @@ export declare class XplInput {
     hideFileNames?: boolean;
     hideAcceptText?: boolean;
     hideEyeDropper?: boolean;
-    type?: 'date' | 'time' | 'text' | 'number' | 'password' | 'file' | 'color';
+    defaultCountry?: string;
+    preferredCountries?: string[];
+    isInternational?: boolean;
+    ariaLabel: string;
+    shape?: 'rounded' | 'box';
+    type?: 'date' | 'time' | 'text' | 'number' | 'password' | 'file' | 'color' | 'phone' | 'search';
     focusEvent: EventEmitter<FocusEvent>;
     blurEvent: EventEmitter<FocusEvent>;
     valueChange: EventEmitter<string>;
     inputEvent: EventEmitter<string>;
+    search: EventEmitter<string>;
     private valueChanged;
     characterCount: number;
     passwordVisible: boolean;
-    private input;
-    private updateCharacterCount;
-    private handleFocus;
+    hasPreSlotContent: boolean;
     private handleBlur;
+    private handleFocus;
     private handleInput;
+    private hasDirectPreSlotChild;
+    private syncPreSlotContent;
+    private updateCharacterCount;
     componentWillLoad(): void;
+    componentDidLoad(): void;
+    disconnectedCallback(): void;
+    setFocus(): Promise<void>;
+    private handleSearchBlurForward;
+    private handleSearchCommit;
+    private handleSearchFocusForward;
     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

@@ -1,40 +1,307 @@
 declare const _default: {
     title: string;
+    parameters: {
+        controls: {
+            sort: string;
+        };
+    };
     argTypes: {
+        type: {
+            name: string;
+            control: {
+                type: "select";
+            };
+            options: string[];
+            table: {
+                category: string;
+            };
+        };
         avatar: {
             options: string[];
             control: {
                 type: "select";
             };
+            if: {
+                arg: string;
+                eq: string;
+            };
+            table: {
+                category: string;
+            };
         };
         avatars: {
-            type: {
-                name: "boolean";
+            control: {
+                type: "boolean";
+            };
+            if: {
+                arg: string;
+                eq: string;
+            };
+            table: {
+                category: string;
             };
         };
         badges: {
-            type: {
-                name: "boolean";
+            control: {
+                type: "boolean";
+            };
+            if: {
+                arg: string;
+                eq: string;
+            };
+            table: {
+                category: string;
             };
         };
         link: {
-            type: {
-                name: "boolean";
+            control: {
+                type: "boolean";
+            };
+            if: {
+                arg: string;
+                eq: string;
+            };
+            table: {
+                category: string;
             };
         };
         metadata: {
-            type: {
-                name: "boolean";
+            control: {
+                type: "boolean";
+            };
+            if: {
+                arg: string;
+                eq: string;
+            };
+            table: {
+                category: string;
             };
         };
         title: {
-            type: {
-                name: "string";
+            control: {
+                type: "text";
+            };
+            if: {
+                arg: string;
+                eq: string;
+            };
+            table: {
+                category: string;
             };
         };
         subtext: {
-            type: {
-                name: "string";
+            control: {
+                type: "text";
+            };
+            if: {
+                arg: string;
+                eq: string;
+            };
+            table: {
+                category: string;
+            };
+        };
+        listLabel: {
+            control: "text";
+            if: {
+                arg: string;
+                eq: string;
+            };
+            description: string;
+            table: {
+                category: string;
+            };
+        };
+        listLabelledBy: {
+            name: string;
+            control: "text";
+            if: {
+                arg: string;
+                eq: string;
+            };
+            description: string;
+            table: {
+                category: string;
+            };
+        };
+        showSelectable: {
+            control: "boolean";
+            if: {
+                arg: string;
+                eq: string;
+            };
+            table: {
+                category: string;
+            };
+        };
+        showReorderable: {
+            control: "boolean";
+            if: {
+                arg: string;
+                eq: string;
+            };
+            description: string;
+            table: {
+                category: string;
+            };
+        };
+        showAsLink: {
+            control: "boolean";
+            if: {
+                arg: string;
+                eq: string;
+            };
+            table: {
+                category: string;
+            };
+        };
+        showTitle: {
+            control: "boolean";
+            if: {
+                arg: string;
+                eq: string;
+            };
+            table: {
+                category: string;
+            };
+        };
+        slotTitle: {
+            control: "text";
+            if: {
+                arg: string;
+                eq: boolean;
+            };
+            table: {
+                category: string;
+            };
+        };
+        showDivider: {
+            control: "boolean";
+            if: {
+                arg: string;
+                eq: string;
+            };
+            description: string;
+            table: {
+                category: string;
+            };
+        };
+        titleBadgeVariant: {
+            control: {
+                type: "select";
+            };
+            options: string[];
+            if: {
+                arg: string;
+                eq: string;
+            };
+            table: {
+                category: string;
+            };
+        };
+        showMetadata: {
+            control: "boolean";
+            if: {
+                arg: string;
+                eq: string;
+            };
+            table: {
+                category: string;
+            };
+        };
+        showAvatar: {
+            control: "boolean";
+            if: {
+                arg: string;
+                eq: string;
+            };
+            table: {
+                category: string;
+            };
+        };
+        slotAvatar: {
+            options: string[];
+            control: {
+                type: "select";
+            };
+            if: {
+                arg: string;
+                eq: boolean;
+            };
+            table: {
+                category: string;
+            };
+        };
+        showDetails: {
+            control: "boolean";
+            if: {
+                arg: string;
+                eq: string;
+            };
+            table: {
+                category: string;
+            };
+        };
+        slotDetails: {
+            control: "text";
+            if: {
+                arg: string;
+                eq: boolean;
+            };
+            table: {
+                category: string;
+            };
+        };
+        showBadges: {
+            control: "boolean";
+            if: {
+                arg: string;
+                eq: string;
+            };
+            table: {
+                category: string;
+            };
+        };
+        showActions: {
+            control: "boolean";
+            if: {
+                arg: string;
+                eq: string;
+            };
+            table: {
+                category: string;
+            };
+        };
+        showExtras: {
+            control: "boolean";
+            if: {
+                arg: string;
+                eq: string;
+            };
+            table: {
+                category: string;
+            };
+        };
+        showError: {
+            control: "boolean";
+            if: {
+                arg: string;
+                eq: string;
+            };
+            description: string;
+            table: {
+                category: string;
+            };
+        };
+        errorBorderOnly: {
+            control: "boolean";
+            if: {
+                arg: string;
+                eq: string;
+            };
+            description: string;
+            table: {
+                category: string;
             };
         };
     };
@@ -43,6 +310,7 @@ export default _default;
 export declare const List: {
     (props: any): string;
     args: {
+        type: string;
         avatar: string;
         avatars: boolean;
         badges: boolean;
@@ -50,6 +318,24 @@ export declare const List: {
         metadata: boolean;
         title: string;
         subtext: string;
+        listLabel: string;
+        listLabelledBy: string;
+        showAvatar: boolean;
+        showTitle: boolean;
+        showDivider: boolean;
+        titleBadgeVariant: string;
+        showMetadata: boolean;
+        showDetails: boolean;
+        showBadges: boolean;
+        showActions: boolean;
+        showExtras: boolean;
+        showError: boolean;
+        errorBorderOnly: boolean;
+        showSelectable: boolean;
+        showReorderable: boolean;
+        showAsLink: boolean;
+        slotTitle: string;
+        slotDetails: string;
     };
     parameters: {
         layout: string;
@@ -57,7 +343,7 @@ export declare const List: {
             render: string[];
         };
         html: {
-            render: void;
+            render: string;
         };
         design: {
             type: string;

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

@@ -1,4 +1,17 @@
+export interface XplListOrderChangeDetail {
+    itemId?: string;
+    direction: 'up' | 'down';
+    orderedItemIds: string[];
+}
+export interface XplListItemReorderDetail {
+    itemId?: string;
+    item?: HTMLElement;
+    direction?: 'up' | 'down';
+    keyboardMode?: boolean;
+    exitKeyboardMode?: boolean;
+}
 export interface ListItem {
+    id?: string;
     avatar?: string;
     avatars?: string[];
     badges?: string[] | {