@xplortech/apollo-core 1.0.0-beta.8 → 2.4.2

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

@@ -1,37 +1,36 @@
-import type { DropdownItem } from './dropdownoption';
-import type { XplDropdownOption } from './xpl-dropdown-option/xpl-dropdown-option';
+import { EventEmitter } from '../../stencil-public-runtime';
+import type { DropdownItem } from './dropdown-option';
+interface XplDropdownOption extends HTMLXplDropdownOptionElement {
+    hostElement: HTMLXplDropdownOptionElement;
+}
 export declare class XplDropdown {
-  /** text to display as heading */
-  isOpen: boolean;
-  /** options that are listed */
-  closeOnSelect: boolean;
-  /** constant representing number of options that can be selected */
-  mode: 'single' | 'multi';
-  /** options that are listed */
-  options?: DropdownItem[];
-  /** whether selection should be made when focusing on interactable element */
-  selectOnFocus: boolean;
-  /** the id for the element that triggers the open state */
-  triggerId: string;
-  /**
-   * @callback update
-   * @param {Object} e - event object
-   * @param {Object} options - component
-   */
-  /** call back function invoked when a selection is made */
-  update?: (e: Event, { component }: {
-    component: XplDropdown;
-  }) => void;
-  hostElement: HTMLXplDropdownElement;
-  /**
-   * called on dropdown option click and keydown events to update isSelected states
-   */
-  handleSelect(e: Event, { component }: {
-    component: XplDropdownOption;
-  }): Promise<void>;
-  private handleClickOutside;
-  componentWillLoad(): void;
-  connectedCallback(): void;
-  disconnectedCallback(): void;
-  render(): any;
+    isOpen: boolean;
+    closeOnSelect: boolean;
+    mode: 'single' | 'multi';
+    options?: DropdownItem[];
+    anchorToTrigger: boolean;
+    selectedValues?: string | string[];
+    selectOnFocus: boolean;
+    triggerId: string;
+    update?: (e: any, { component }: {
+        component: XplDropdown;
+    }) => void;
+    hostElement: HTMLXplDropdownElement;
+    isOpenChange: EventEmitter<boolean>;
+    private requestAnimationFrameId;
+    onSelectedValuesChanged(newValues: string | string[], initialRender?: boolean): void;
+    onIsOpenStateChange(newValue: boolean): void;
+    onWindowScroll(): void;
+    handleSelect(e: any, { component }: {
+        component: XplDropdownOption;
+    }): Promise<void>;
+    private updateDropdownPosition;
+    private handleClickOutside;
+    componentWillLoad(): void;
+    private handleKeyDown;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    componentDidLoad(): void;
+    render(): any;
 }
+export {};

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

@@ -0,0 +1,41 @@
+declare const _default: {
+    title: string;
+    component: string;
+    argTypes: {
+        accordion: {
+            control: {
+                type: "boolean";
+            };
+        };
+        selectedItemCount: {
+            control: {
+                type: "number";
+            };
+        };
+    };
+    parameters: {
+        actions: {
+            handles: string[];
+        };
+    };
+    tags: string[];
+};
+export default _default;
+export declare const DynamicTable: {
+    ({ accordion, selectedItemCount }: {
+        accordion: any;
+        selectedItemCount: any;
+    }): string;
+    args: {
+        accordion: boolean;
+        selectedItemCount: number;
+    };
+    parameters: {
+        'web-component': {
+            render: string;
+        };
+        html: {
+            render: string;
+        };
+    };
+};

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

@@ -0,0 +1,14 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+export declare class XplDynamicTable {
+    el: HTMLXplDynamicTableElement;
+    selectedItemCount: number;
+    colCount: number;
+    selectedItemCountChange: EventEmitter<string[]>;
+    private updateColumnCount;
+    listenToDeselectEvent(): void;
+    listenToChangeEvent(): void;
+    private updateRowGap;
+    componentDidLoad(): void;
+    componentDidUpdate(): void;
+    render(): any;
+}

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

@@ -0,0 +1,9 @@
+export declare class XplDynamicTableCell {
+    el: HTMLXplDynamicTableCellElement;
+    disabled: boolean;
+    componentDidLoad(): void;
+    componentDidUpdate(): void;
+    private updateSlottedComponentsWhenDisabled;
+    private hostElement;
+    render(): any;
+}

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

@@ -0,0 +1,11 @@
+export declare class XplDynamicTableRow {
+    disabled: boolean;
+    selected: boolean;
+    isDisabled: boolean;
+    componentWillLoad(): void;
+    componentDidLoad(): void;
+    componentDidUpdate(): void;
+    private updateRowCellsDisabledState;
+    private hostElement;
+    render(): any;
+}

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

@@ -0,0 +1,133 @@
+declare const _default: {
+    title: string;
+    argTypes: {
+        unit1Lg: {
+            control: {
+                type: "number";
+            };
+        };
+        unit1Md: {
+            control: {
+                type: "number";
+            };
+        };
+        unit1Sm: {
+            control: {
+                type: "number";
+            };
+        };
+        unit1Xs: {
+            control: {
+                type: "number";
+            };
+        };
+        unit2Lg: {
+            control: {
+                type: "number";
+            };
+        };
+        unit2Md: {
+            control: {
+                type: "number";
+            };
+        };
+        unit2Sm: {
+            control: {
+                type: "number";
+            };
+        };
+        unit2Xs: {
+            control: {
+                type: "number";
+            };
+        };
+        unit3Lg: {
+            control: {
+                type: "number";
+            };
+        };
+        unit3Md: {
+            control: {
+                type: "number";
+            };
+        };
+        unit3Sm: {
+            control: {
+                type: "number";
+            };
+        };
+        unit3Xs: {
+            control: {
+                type: "number";
+            };
+        };
+        unit4Lg: {
+            control: {
+                type: "number";
+            };
+        };
+        unit4Md: {
+            control: {
+                type: "number";
+            };
+        };
+        unit4Sm: {
+            control: {
+                type: "number";
+            };
+        };
+        unit4Xs: {
+            control: {
+                type: "number";
+            };
+        };
+    };
+};
+export default _default;
+export declare const Grid: {
+    ({ unit1Lg, unit1Md, unit1Sm, unit1Xs, unit2Lg, unit2Md, unit2Sm, unit2Xs, unit3Lg, unit3Md, unit3Sm, unit3Xs, unit4Lg, unit4Md, unit4Sm, unit4Xs, }: {
+        unit1Lg: any;
+        unit1Md: any;
+        unit1Sm: any;
+        unit1Xs: any;
+        unit2Lg: any;
+        unit2Md: any;
+        unit2Sm: any;
+        unit2Xs: any;
+        unit3Lg: any;
+        unit3Md: any;
+        unit3Sm: any;
+        unit3Xs: any;
+        unit4Lg: any;
+        unit4Md: any;
+        unit4Sm: any;
+        unit4Xs: any;
+    }): string;
+    args: {
+        unit1Lg: number;
+        unit1Md: number;
+        unit1Sm: number;
+        unit1Xs: number;
+        unit2Lg: number;
+        unit2Md: number;
+        unit2Sm: number;
+        unit2Xs: number;
+        unit3Lg: number;
+        unit3Md: number;
+        unit3Sm: number;
+        unit3Xs: number;
+        unit4Lg: number;
+        unit4Md: number;
+        unit4Sm: number;
+        unit4Xs: number;
+    };
+    parameters: {
+        layout: string;
+        'web-component': {
+            render: string;
+        };
+        html: {
+            render(): void;
+        };
+    };
+};

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

@@ -1,5 +1,5 @@
 export declare class XplGrid {
-  container: HTMLXplGridElement;
-  componentDidLoad(): void;
-  render(): any;
+    container: HTMLXplGridElement;
+    componentDidLoad(): void;
+    render(): any;
 }

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

@@ -1,7 +1,7 @@
 export declare class XplGridItem {
-  xs: number;
-  sm: number;
-  md: number;
-  lg: number;
-  render(): any;
+    xs: number;
+    sm: number;
+    md: number;
+    lg: number;
+    render(): any;
 }

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

@@ -0,0 +1,44 @@
+declare const _default: {
+    title: string;
+    component: string;
+    argTypes: {
+        title: {
+            type: {
+                name: "string";
+                required: true;
+            };
+        };
+        expanded: {
+            type: {
+                name: "boolean";
+            };
+        };
+        disabled: {
+            type: {
+                name: "boolean";
+            };
+        };
+    };
+    tags: string[];
+};
+export default _default;
+export declare const HeaderAccordion: {
+    ({ title, expanded, disabled }: {
+        title: any;
+        expanded: any;
+        disabled: any;
+    }): string;
+    args: {
+        title: string;
+        expanded: boolean;
+        disabled: boolean;
+    };
+    parameters: {
+        'web-component': {
+            render: string;
+        };
+        html: {
+            render: string;
+        };
+    };
+};

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

@@ -0,0 +1,20 @@
+export declare class XplHeaderAccordion {
+    el: HTMLXplHeaderAccordionElement;
+    contentId: string;
+    initialExpanded: boolean;
+    disabled: boolean;
+    selectedCount: number;
+    hasCheckbox: boolean;
+    expanded: boolean;
+    parentChecked: boolean;
+    parentIndeterminate: boolean;
+    private toggleAccordion;
+    private applyBorderRadiusToLastRow;
+    private handleParentCheckboxChange;
+    watchSelectedCount(selectedCount: number, _previousCount: number): void;
+    private updateParentCheckbox;
+    handleChildCheckboxChange(): void;
+    componentDidLoad(): void;
+    componentWillRender(): void;
+    render(): any;
+}

package/dist/types/components/xpl-icon/icons.stories.d.ts

@@ -0,0 +1,54 @@
+declare const _default: {
+    title: string;
+    argTypes: {
+        size: {
+            control: {
+                type: string;
+                max: number;
+            };
+        };
+        color: {
+            type: {
+                name: string;
+                required: boolean;
+            };
+        };
+    };
+};
+export default _default;
+export declare const Icons: {
+    ({ size, color }: {
+        size: any;
+        color: any;
+    }): string;
+    args: {
+        size: number;
+        color: string;
+    };
+    parameters: {
+        layout: string;
+        'web-component': {
+            render: string;
+        };
+    };
+};
+export declare const Icon: {
+    ({ size, color, icon, backgroundColor }: {
+        size: any;
+        color: any;
+        icon: any;
+        backgroundColor: any;
+    }): string;
+    args: {
+        size: number;
+        color: string;
+        icon: string;
+        backgroundColor: string;
+    };
+    parameters: {
+        layout: string;
+        'web-component': {
+            render: string;
+        };
+    };
+};

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

@@ -0,0 +1,8 @@
+import data from '@xplortech/apollo-icons/build/data.json';
+export type IconName = keyof typeof data;
+export declare class XplIcon {
+    icon: IconName;
+    size: number;
+    backgroundColor?: string;
+    render(): any;
+}

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

@@ -0,0 +1,206 @@
+declare const _default: {
+    title: string;
+    parameters: {
+        actions: {
+            handles: string[];
+        };
+    };
+    argTypes: {
+        label: {
+            type: {
+                name: "string";
+                required: true;
+            };
+        };
+        description: {
+            type: {
+                name: "string";
+                required: false;
+            };
+        };
+        disabled: {
+            type: {
+                name: "boolean";
+            };
+        };
+        error: {
+            type: {
+                name: "boolean";
+            };
+        };
+        errorMessage: {
+            type: {
+                name: "string";
+                required: false;
+            };
+        };
+        type: {
+            options: string[];
+            control: {
+                type: "select";
+            };
+        };
+        timeFormat: {
+            control: {
+                type: "select";
+            };
+            options: string[];
+        };
+    };
+};
+export default _default;
+export declare const Input: {
+    ({ label, description, disabled, error, errorMessage, pre, post, type }: {
+        label: any;
+        description: any;
+        disabled: any;
+        error: any;
+        errorMessage: any;
+        pre: any;
+        post: any;
+        type: any;
+    }): string;
+    args: {
+        label: string;
+        description: string;
+        disabled: boolean;
+        error: boolean;
+        errorMessage: string;
+        pre: string;
+        post: string;
+        type: string;
+    };
+    parameters: {
+        layout: string;
+        'web-component': {
+            render: string;
+        };
+        html: {
+            render: any[];
+        };
+    };
+};
+export declare const Multiline: {
+    ({ label, description, disabled, error, errorMessage, maxCharacterCount, }: {
+        label: any;
+        description: any;
+        disabled: any;
+        error: any;
+        errorMessage: any;
+        maxCharacterCount: any;
+    }): string;
+    args: {
+        label: string;
+        description: string;
+        disabled: boolean;
+        error: boolean;
+        errorMessage: string;
+        maxCharacterCount: number;
+    };
+    parameters: {
+        layout: string;
+        'web-component': {
+            render: string;
+        };
+        html: {
+            render: string[];
+        };
+    };
+};
+export declare const Datepicker: {
+    ({ label, dateFormat, description, disabled, error, errorMessage, min, mode, max, required, type, }: {
+        label: any;
+        dateFormat: any;
+        description: any;
+        disabled: any;
+        error: any;
+        errorMessage: any;
+        min: any;
+        mode: any;
+        max: any;
+        required: any;
+        type: any;
+    }): string;
+    argTypes: {
+        mode: {
+            options: string[];
+            control: {
+                type: string;
+            };
+        };
+        type: {
+            options: string[];
+            control: {
+                type: string;
+            };
+        };
+    };
+    args: {
+        mode: string;
+        label: string;
+        dateFormat: string;
+        description: string;
+        disabled: boolean;
+        error: boolean;
+        errorMessage: string;
+        min: string;
+        max: string;
+        required: boolean;
+        type: string;
+    };
+    parameters: {
+        layout: string;
+        'web-component': {
+            render: string;
+        };
+        html: {
+            render: string[];
+        };
+    };
+};
+export declare const Timepicker: {
+    ({ label, description, disabled, error, errorMessage, required, readonly, value, step, timeFormat, allowCustomOption, min, max, type, }: {
+        label: any;
+        description: any;
+        disabled: any;
+        error: any;
+        errorMessage: any;
+        required: any;
+        readonly: any;
+        value: any;
+        step: any;
+        timeFormat: any;
+        allowCustomOption: any;
+        min: any;
+        max: any;
+        type: any;
+    }): string;
+    args: {
+        label: string;
+        description: string;
+        disabled: boolean;
+        error: boolean;
+        errorMessage: string;
+        required: boolean;
+        readonly: boolean;
+        value: string;
+        step: number;
+        timeFormat: string;
+        allowCustomOption: boolean;
+        min: string;
+        max: string;
+        type: string;
+    };
+    parameters: {
+        layout: string;
+        'web-component': {
+            render: string;
+        };
+        html: {
+            render: string[];
+        };
+    };
+};
+export declare const Password: any;
+export declare const File: any;
+export declare const Color: any;

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

@@ -0,0 +1,41 @@
+export interface ColorValues {
+    hex: string;
+    r: number;
+    g: number;
+    b: number;
+    a: number;
+}
+export declare const hslaToRgba: (hue: number, saturation: number, lightness: number, alpha: number) => string;
+export declare const hsvToRgb: (h: number, s: number, v: number) => {
+    r: number;
+    g: number;
+    b: number;
+};
+export declare const rgbToHsl: (rInput: number, gInput: number, bInput: number) => {
+    hue: number;
+    saturation: number;
+    lightness: number;
+};
+export declare const rgbToHsv: (r: number, g: number, b: number, fixedHue?: number) => {
+    h: number;
+    s: number;
+    v: number;
+};
+export declare const hexToRgb: (hex?: string) => number[];
+export declare const rgbToHex: (r: number, g: number, b: number) => string;
+export declare const stringToObjectColor: (input: string) => {
+    hex: string;
+    r: number;
+    g: number;
+    b: number;
+    a: number;
+};
+export declare const objectToStringColor: (color: ColorValues) => string;
+export declare const reverseCursorPosition: (hue: number, color: {
+    r: number;
+    g: number;
+    b: number;
+}, width: number, height: number) => {
+    x: number;
+    y: number;
+};