@ironsource/shared-ui 2.0.0-rc.4 → 2.0.0-rc.6

package/components/table/v4/index.d.ts

@@ -0,0 +1,601 @@
+import DataGrid from './DataGrid.vue';
+import DataGridMenu from './DataGridMenu.vue';
+declare const DataGridTypes: () => (({
+    new (...args: any[]): {
+        $: import("vue").ComponentInternalInstance;
+        $data: {};
+        $props: Partial<{
+            sort: import("../common/Table.types").Sort;
+            title: string;
+            search: string;
+            testId: string;
+            isLoading: boolean;
+            searchPlaceholder: string;
+            selection: unknown[];
+            searchAutoFocus: boolean;
+            isSticky: boolean;
+            sections: import("../common/Table.types").Section[];
+            isStickyHeader: boolean;
+            emptyStateTitle: string;
+            emptyStateSubtitle: string;
+            isInfiniteScroll: boolean;
+            infiniteScrollThreshold: number;
+            rowHeight: number | ((index: number) => number);
+            loadingRowCount: number;
+            defaultScrollPosition: number;
+            getRowId: (row: import("../common/Table.types").Row, index: number) => string | number;
+            emptyStateVariant: "error" | "no-access" | "no-results" | "no-data" | "files" | "settings";
+            showSearch: boolean;
+        }> & Omit<Readonly<import("vue").ExtractPropTypes<{
+            sort: {
+                type: import("vue").PropType<import("../common/Table.types").Sort>;
+                default: any;
+            };
+            title: {
+                type: import("vue").PropType<string>;
+                default: string;
+            };
+            search: {
+                type: import("vue").PropType<string>;
+                default: any;
+            };
+            testId: {
+                type: import("vue").PropType<string>;
+                default: string;
+            };
+            isLoading: {
+                type: import("vue").PropType<boolean>;
+                default: boolean;
+            };
+            searchPlaceholder: {
+                type: import("vue").PropType<string>;
+                default: string;
+            };
+            selection: {
+                type: import("vue").PropType<unknown[]>;
+                default: any;
+            };
+            columns: {
+                type: import("vue").PropType<import("../common/Table.types").Column[]>;
+                required: true;
+            };
+            searchAutoFocus: {
+                type: import("vue").PropType<boolean>;
+                default: boolean;
+            };
+            isSticky: {
+                type: import("vue").PropType<boolean>;
+                default: boolean;
+            };
+            rows: {
+                type: import("vue").PropType<import("../common/Table.types").Row[]>;
+                required: true;
+            };
+            sections: {
+                type: import("vue").PropType<import("../common/Table.types").Section[]>;
+                default: any;
+            };
+            isStickyHeader: {
+                type: import("vue").PropType<boolean>;
+                default: boolean;
+            };
+            emptyStateTitle: {
+                type: import("vue").PropType<string>;
+                default: string;
+            };
+            emptyStateSubtitle: {
+                type: import("vue").PropType<string>;
+                default: string;
+            };
+            isInfiniteScroll: {
+                type: import("vue").PropType<boolean>;
+                default: boolean;
+            };
+            infiniteScrollThreshold: {
+                type: import("vue").PropType<number>;
+                default: number;
+            };
+            rowHeight: {
+                type: import("vue").PropType<number | ((index: number) => number)>;
+                default: number;
+            };
+            loadingRowCount: {
+                type: import("vue").PropType<number>;
+                default: number;
+            };
+            defaultScrollPosition: {
+                type: import("vue").PropType<number>;
+                default: any;
+            };
+            getRowId: {
+                type: import("vue").PropType<(row: import("../common/Table.types").Row, index: number) => string | number>;
+                default: (row: any, index: any) => any;
+            };
+            emptyStateVariant: {
+                type: import("vue").PropType<"error" | "no-access" | "no-results" | "no-data" | "files" | "settings">;
+                default: string;
+            };
+            showSearch: {
+                type: import("vue").PropType<boolean>;
+                default: boolean;
+            };
+        }>> & {
+            onOnScroll?: (event: Event) => any;
+            "onUpdate:sort"?: (newSort: import("../common/Table.types").Sort) => any;
+            onSaveRow?: (args_0: {
+                value: unknown;
+                confirm: () => void;
+                rowIndex: number;
+                cellIndex: number;
+            }) => any;
+            onLoadMore?: () => any;
+            "onUpdate:search"?: (query: string) => any;
+            "onUpdate:selection"?: (selection: unknown[]) => any;
+        } & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, "sort" | "title" | "search" | "testId" | "isLoading" | "searchPlaceholder" | "selection" | "searchAutoFocus" | "isSticky" | "sections" | "isStickyHeader" | "emptyStateTitle" | "emptyStateSubtitle" | "isInfiniteScroll" | "infiniteScrollThreshold" | "rowHeight" | "loadingRowCount" | "defaultScrollPosition" | "getRowId" | "emptyStateVariant" | "showSearch">;
+        $attrs: {
+            [x: string]: unknown;
+        };
+        $refs: {
+            [x: string]: unknown;
+        };
+        $slots: Readonly<{
+            [name: string]: import("vue").Slot;
+        }>;
+        $root: import("vue").ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, import("vue").ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}, {}, string>, {}>;
+        $parent: import("vue").ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, import("vue").ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}, {}, string>, {}>;
+        $emit: ((event: "onScroll", event: Event) => void) & ((event: "update:sort", newSort: import("../common/Table.types").Sort) => void) & ((event: "saveRow", args_0: {
+            value: unknown;
+            confirm: () => void;
+            rowIndex: number;
+            cellIndex: number;
+        }) => void) & ((event: "loadMore") => void) & ((event: "update:search", query: string) => void) & ((event: "update:selection", selection: unknown[]) => void);
+        $el: any;
+        $options: import("vue").ComponentOptionsBase<Readonly<import("vue").ExtractPropTypes<{
+            sort: {
+                type: import("vue").PropType<import("../common/Table.types").Sort>;
+                default: any;
+            };
+            title: {
+                type: import("vue").PropType<string>;
+                default: string;
+            };
+            search: {
+                type: import("vue").PropType<string>;
+                default: any;
+            };
+            testId: {
+                type: import("vue").PropType<string>;
+                default: string;
+            };
+            isLoading: {
+                type: import("vue").PropType<boolean>;
+                default: boolean;
+            };
+            searchPlaceholder: {
+                type: import("vue").PropType<string>;
+                default: string;
+            };
+            selection: {
+                type: import("vue").PropType<unknown[]>;
+                default: any;
+            };
+            columns: {
+                type: import("vue").PropType<import("../common/Table.types").Column[]>;
+                required: true;
+            };
+            searchAutoFocus: {
+                type: import("vue").PropType<boolean>;
+                default: boolean;
+            };
+            isSticky: {
+                type: import("vue").PropType<boolean>;
+                default: boolean;
+            };
+            rows: {
+                type: import("vue").PropType<import("../common/Table.types").Row[]>;
+                required: true;
+            };
+            sections: {
+                type: import("vue").PropType<import("../common/Table.types").Section[]>;
+                default: any;
+            };
+            isStickyHeader: {
+                type: import("vue").PropType<boolean>;
+                default: boolean;
+            };
+            emptyStateTitle: {
+                type: import("vue").PropType<string>;
+                default: string;
+            };
+            emptyStateSubtitle: {
+                type: import("vue").PropType<string>;
+                default: string;
+            };
+            isInfiniteScroll: {
+                type: import("vue").PropType<boolean>;
+                default: boolean;
+            };
+            infiniteScrollThreshold: {
+                type: import("vue").PropType<number>;
+                default: number;
+            };
+            rowHeight: {
+                type: import("vue").PropType<number | ((index: number) => number)>;
+                default: number;
+            };
+            loadingRowCount: {
+                type: import("vue").PropType<number>;
+                default: number;
+            };
+            defaultScrollPosition: {
+                type: import("vue").PropType<number>;
+                default: any;
+            };
+            getRowId: {
+                type: import("vue").PropType<(row: import("../common/Table.types").Row, index: number) => string | number>;
+                default: (row: any, index: any) => any;
+            };
+            emptyStateVariant: {
+                type: import("vue").PropType<"error" | "no-access" | "no-results" | "no-data" | "files" | "settings">;
+                default: string;
+            };
+            showSearch: {
+                type: import("vue").PropType<boolean>;
+                default: boolean;
+            };
+        }>> & {
+            onOnScroll?: (event: Event) => any;
+            "onUpdate:sort"?: (newSort: import("../common/Table.types").Sort) => any;
+            onSaveRow?: (args_0: {
+                value: unknown;
+                confirm: () => void;
+                rowIndex: number;
+                cellIndex: number;
+            }) => any;
+            onLoadMore?: () => any;
+            "onUpdate:search"?: (query: string) => any;
+            "onUpdate:selection"?: (selection: unknown[]) => any;
+        }, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+            "update:sort": (newSort: import("../common/Table.types").Sort) => void;
+            "update:search": (query: string) => void;
+            "update:selection": (selection: unknown[]) => void;
+            onScroll: (event: Event) => void;
+            saveRow: (args_0: {
+                value: unknown;
+                confirm: () => void;
+                rowIndex: number;
+                cellIndex: number;
+            }) => void;
+            loadMore: () => void;
+        }, string, {
+            sort: import("../common/Table.types").Sort;
+            title: string;
+            search: string;
+            testId: string;
+            isLoading: boolean;
+            searchPlaceholder: string;
+            selection: unknown[];
+            searchAutoFocus: boolean;
+            isSticky: boolean;
+            sections: import("../common/Table.types").Section[];
+            isStickyHeader: boolean;
+            emptyStateTitle: string;
+            emptyStateSubtitle: string;
+            isInfiniteScroll: boolean;
+            infiniteScrollThreshold: number;
+            rowHeight: number | ((index: number) => number);
+            loadingRowCount: number;
+            defaultScrollPosition: number;
+            getRowId: (row: import("../common/Table.types").Row, index: number) => string | number;
+            emptyStateVariant: "error" | "no-access" | "no-results" | "no-data" | "files" | "settings";
+            showSearch: boolean;
+        }, {}, string> & {
+            beforeCreate?: (() => void) | (() => void)[];
+            created?: (() => void) | (() => void)[];
+            beforeMount?: (() => void) | (() => void)[];
+            mounted?: (() => void) | (() => void)[];
+            beforeUpdate?: (() => void) | (() => void)[];
+            updated?: (() => void) | (() => void)[];
+            activated?: (() => void) | (() => void)[];
+            deactivated?: (() => void) | (() => void)[];
+            beforeDestroy?: (() => void) | (() => void)[];
+            beforeUnmount?: (() => void) | (() => void)[];
+            destroyed?: (() => void) | (() => void)[];
+            unmounted?: (() => void) | (() => void)[];
+            renderTracked?: ((e: import("vue").DebuggerEvent) => void) | ((e: import("vue").DebuggerEvent) => void)[];
+            renderTriggered?: ((e: import("vue").DebuggerEvent) => void) | ((e: import("vue").DebuggerEvent) => void)[];
+            errorCaptured?: ((err: unknown, instance: import("vue").ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, import("vue").ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}, {}, string>, {}>, info: string) => boolean | void) | ((err: unknown, instance: import("vue").ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, import("vue").ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}, {}, string>, {}>, info: string) => boolean | void)[];
+        };
+        $forceUpdate: () => void;
+        $nextTick: typeof import("vue").nextTick;
+        $watch<T extends string | ((...args: any) => any)>(source: T, cb: T extends (...args: any) => infer R ? (args_0: R, args_1: R) => any : (...args: any) => any, options?: import("vue").WatchOptions<boolean>): import("vue").WatchStopHandle;
+    } & Readonly<import("vue").ExtractPropTypes<{
+        sort: {
+            type: import("vue").PropType<import("../common/Table.types").Sort>;
+            default: any;
+        };
+        title: {
+            type: import("vue").PropType<string>;
+            default: string;
+        };
+        search: {
+            type: import("vue").PropType<string>;
+            default: any;
+        };
+        testId: {
+            type: import("vue").PropType<string>;
+            default: string;
+        };
+        isLoading: {
+            type: import("vue").PropType<boolean>;
+            default: boolean;
+        };
+        searchPlaceholder: {
+            type: import("vue").PropType<string>;
+            default: string;
+        };
+        selection: {
+            type: import("vue").PropType<unknown[]>;
+            default: any;
+        };
+        columns: {
+            type: import("vue").PropType<import("../common/Table.types").Column[]>;
+            required: true;
+        };
+        searchAutoFocus: {
+            type: import("vue").PropType<boolean>;
+            default: boolean;
+        };
+        isSticky: {
+            type: import("vue").PropType<boolean>;
+            default: boolean;
+        };
+        rows: {
+            type: import("vue").PropType<import("../common/Table.types").Row[]>;
+            required: true;
+        };
+        sections: {
+            type: import("vue").PropType<import("../common/Table.types").Section[]>;
+            default: any;
+        };
+        isStickyHeader: {
+            type: import("vue").PropType<boolean>;
+            default: boolean;
+        };
+        emptyStateTitle: {
+            type: import("vue").PropType<string>;
+            default: string;
+        };
+        emptyStateSubtitle: {
+            type: import("vue").PropType<string>;
+            default: string;
+        };
+        isInfiniteScroll: {
+            type: import("vue").PropType<boolean>;
+            default: boolean;
+        };
+        infiniteScrollThreshold: {
+            type: import("vue").PropType<number>;
+            default: number;
+        };
+        rowHeight: {
+            type: import("vue").PropType<number | ((index: number) => number)>;
+            default: number;
+        };
+        loadingRowCount: {
+            type: import("vue").PropType<number>;
+            default: number;
+        };
+        defaultScrollPosition: {
+            type: import("vue").PropType<number>;
+            default: any;
+        };
+        getRowId: {
+            type: import("vue").PropType<(row: import("../common/Table.types").Row, index: number) => string | number>;
+            default: (row: any, index: any) => any;
+        };
+        emptyStateVariant: {
+            type: import("vue").PropType<"error" | "no-access" | "no-results" | "no-data" | "files" | "settings">;
+            default: string;
+        };
+        showSearch: {
+            type: import("vue").PropType<boolean>;
+            default: boolean;
+        };
+    }>> & {
+        onOnScroll?: (event: Event) => any;
+        "onUpdate:sort"?: (newSort: import("../common/Table.types").Sort) => any;
+        onSaveRow?: (args_0: {
+            value: unknown;
+            confirm: () => void;
+            rowIndex: number;
+            cellIndex: number;
+        }) => any;
+        onLoadMore?: () => any;
+        "onUpdate:search"?: (query: string) => any;
+        "onUpdate:selection"?: (selection: unknown[]) => any;
+    } & import("vue").ShallowUnwrapRef<{}> & {} & import("vue").ComponentCustomProperties & {};
+    __isFragment?: never;
+    __isTeleport?: never;
+    __isSuspense?: never;
+} & import("vue").ComponentOptionsBase<Readonly<import("vue").ExtractPropTypes<{
+    sort: {
+        type: import("vue").PropType<import("../common/Table.types").Sort>;
+        default: any;
+    };
+    title: {
+        type: import("vue").PropType<string>;
+        default: string;
+    };
+    search: {
+        type: import("vue").PropType<string>;
+        default: any;
+    };
+    testId: {
+        type: import("vue").PropType<string>;
+        default: string;
+    };
+    isLoading: {
+        type: import("vue").PropType<boolean>;
+        default: boolean;
+    };
+    searchPlaceholder: {
+        type: import("vue").PropType<string>;
+        default: string;
+    };
+    selection: {
+        type: import("vue").PropType<unknown[]>;
+        default: any;
+    };
+    columns: {
+        type: import("vue").PropType<import("../common/Table.types").Column[]>;
+        required: true;
+    };
+    searchAutoFocus: {
+        type: import("vue").PropType<boolean>;
+        default: boolean;
+    };
+    isSticky: {
+        type: import("vue").PropType<boolean>;
+        default: boolean;
+    };
+    rows: {
+        type: import("vue").PropType<import("../common/Table.types").Row[]>;
+        required: true;
+    };
+    sections: {
+        type: import("vue").PropType<import("../common/Table.types").Section[]>;
+        default: any;
+    };
+    isStickyHeader: {
+        type: import("vue").PropType<boolean>;
+        default: boolean;
+    };
+    emptyStateTitle: {
+        type: import("vue").PropType<string>;
+        default: string;
+    };
+    emptyStateSubtitle: {
+        type: import("vue").PropType<string>;
+        default: string;
+    };
+    isInfiniteScroll: {
+        type: import("vue").PropType<boolean>;
+        default: boolean;
+    };
+    infiniteScrollThreshold: {
+        type: import("vue").PropType<number>;
+        default: number;
+    };
+    rowHeight: {
+        type: import("vue").PropType<number | ((index: number) => number)>;
+        default: number;
+    };
+    loadingRowCount: {
+        type: import("vue").PropType<number>;
+        default: number;
+    };
+    defaultScrollPosition: {
+        type: import("vue").PropType<number>;
+        default: any;
+    };
+    getRowId: {
+        type: import("vue").PropType<(row: import("../common/Table.types").Row, index: number) => string | number>;
+        default: (row: any, index: any) => any;
+    };
+    emptyStateVariant: {
+        type: import("vue").PropType<"error" | "no-access" | "no-results" | "no-data" | "files" | "settings">;
+        default: string;
+    };
+    showSearch: {
+        type: import("vue").PropType<boolean>;
+        default: boolean;
+    };
+}>> & {
+    onOnScroll?: (event: Event) => any;
+    "onUpdate:sort"?: (newSort: import("../common/Table.types").Sort) => any;
+    onSaveRow?: (args_0: {
+        value: unknown;
+        confirm: () => void;
+        rowIndex: number;
+        cellIndex: number;
+    }) => any;
+    onLoadMore?: () => any;
+    "onUpdate:search"?: (query: string) => any;
+    "onUpdate:selection"?: (selection: unknown[]) => any;
+}, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:sort": (newSort: import("../common/Table.types").Sort) => void;
+    "update:search": (query: string) => void;
+    "update:selection": (selection: unknown[]) => void;
+    onScroll: (event: Event) => void;
+    saveRow: (args_0: {
+        value: unknown;
+        confirm: () => void;
+        rowIndex: number;
+        cellIndex: number;
+    }) => void;
+    loadMore: () => void;
+}, string, {
+    sort: import("../common/Table.types").Sort;
+    title: string;
+    search: string;
+    testId: string;
+    isLoading: boolean;
+    searchPlaceholder: string;
+    selection: unknown[];
+    searchAutoFocus: boolean;
+    isSticky: boolean;
+    sections: import("../common/Table.types").Section[];
+    isStickyHeader: boolean;
+    emptyStateTitle: string;
+    emptyStateSubtitle: string;
+    isInfiniteScroll: boolean;
+    infiniteScrollThreshold: number;
+    rowHeight: number | ((index: number) => number);
+    loadingRowCount: number;
+    defaultScrollPosition: number;
+    getRowId: (row: import("../common/Table.types").Row, index: number) => string | number;
+    emptyStateVariant: "error" | "no-access" | "no-results" | "no-data" | "files" | "settings";
+    showSearch: boolean;
+}, {}, string> & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps & (new () => {
+    $slots: Partial<Record<`section-${string}`, (_: {}) => any>> & Partial<Record<`header-${string}`, (_: {
+        column: import("../common/Table.types").Column;
+    }) => any>> & Partial<Record<`cell-${string}`, (_: {
+        cell: unknown;
+        isLoading: boolean;
+        cellIndex: number;
+        row: import("@vueuse/core").UseVirtualListItem<import("../common/Table.types").Row>;
+        rowIndex: number;
+    }) => any>> & {
+        title?(_: {}): any;
+        search?(_: {}): any;
+        "table-header-actions"?(_: {}): any;
+        loader?(_: {}): any;
+        expanded?(_: {
+            row: import("@vueuse/core").UseVirtualListItem<import("../common/Table.types").Row>;
+            gridColumnTemplate: any;
+        }): any;
+        "empty-state"?(_: {}): any;
+        footer?(_: {}): any;
+    };
+})) | import("vue").DefineComponent<{
+    menuItems: {
+        type: import("vue").PropType<import("../common/Table.types").MenuItem[]>;
+        required: true;
+        default: () => any[];
+    };
+}, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    selected: (option: unknown) => void;
+}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    menuItems: {
+        type: import("vue").PropType<import("../common/Table.types").MenuItem[]>;
+        required: true;
+        default: () => any[];
+    };
+}>> & {
+    onSelected?: (option: unknown) => any;
+}, {
+    menuItems: import("../common/Table.types").MenuItem[];
+}>)[];
+export type { Column, Sort, MenuItem } from '../common/Table.types';
+export { DataGrid, DataGridMenu, DataGridTypes };

package/components/table/v4/index.js

@@ -0,0 +1,8 @@
+import r from "./DataGrid.vue.js";
+import t from "./DataGridMenu.vue.js";
+const i = () => [r, t];
+export {
+  r as DataGrid,
+  t as DataGridMenu,
+  i as DataGridTypes
+};

package/components/table/v4/storyUtils.d.ts

@@ -0,0 +1,4 @@
+export declare const getRandomRows: (count: number, template?: string[]) => any[][];
+export declare const exampleRows: string[][];
+export declare const moreExampleRows: string[][];
+export declare const exampleRowsWithExtraColumns: string[][];

package/components/table-cells/common/Editable.common.d.ts

@@ -0,0 +1,5 @@
+export declare const editableCommon: (props: any) => {
+    onEdit: () => void;
+    target: any;
+    isEditing: import("vue").Ref<boolean>;
+};

package/components/table-cells/common/Editable.common.js

@@ -0,0 +1,39 @@
+import { ref as a, provide as v } from "vue";
+import { useTableContext as s } from "../../table/common/TableContext.js";
+import { EditableContext as d } from "./EditableContext.js";
+import { onClickOutside as f } from "@vueuse/core";
+const E = (e) => {
+  const l = a(!1), o = a(e.cell), r = a(null), u = s("Editable"), t = a(null);
+  v(d, {
+    focusable: !0,
+    value: o,
+    error: t,
+    confirmable: !0,
+    onChange(n) {
+      o.value = n, t.value = e.validateFunction?.(o.value);
+    },
+    onClose: () => {
+      const n = e.validateFunction?.(o.value);
+      t.value = n, !n && (u.onClose({
+        rowIndex: e.rowIndex,
+        cellIndex: e.cellIndex,
+        value: o.value
+      }), l.value = !1);
+    }
+  });
+  const i = () => {
+    l.value || (l.value = !l.value);
+  }, c = () => {
+    o.value = e.cell, t.value = null;
+  };
+  return f(r, () => {
+    l.value = !1, c(), u.onClose();
+  }), {
+    onEdit: i,
+    target: r,
+    isEditing: l
+  };
+};
+export {
+  E as editableCommon
+};