@rotki/ui-library 0.2.4 → 0.3.0

package/dist/components/tables/DataTable.vue.d.ts

@@ -0,0 +1,280 @@
+import { type TablePaginationData } from './TablePagination.vue';
+export interface TableColumn {
+    key: string;
+    sortable?: boolean;
+    direction?: 'asc' | 'desc';
+    align?: 'left' | 'right';
+    class?: string;
+    [key: string]: any;
+}
+export interface SortColumn {
+    column?: string;
+    direction: 'asc' | 'desc';
+}
+export interface TableOptions {
+    pagination?: TablePaginationData;
+    sort?: SortColumn | SortColumn[];
+}
+export interface Props {
+    /**
+     * list of items for each row
+     */
+    rows: Array<Record<string, any>>;
+    /**
+     * the attribute used to identify each row uniquely for selection, usually `id`
+     */
+    rowAttr: string;
+    /**
+     * model for selected rows, add a v-model to support row selection
+     */
+    modelValue?: string[];
+    /**
+     * model for insternal searching
+     */
+    search?: string;
+    /**
+     * model for paginating data
+     * @example v-model:pagination="{ total: 10, limit: 5, page: 1 }"
+     */
+    pagination?: TablePaginationData;
+    /**
+     * modifiers for specifying externally paginated tables
+     * use this when api controls pagination
+     * @example v-model:pagination.external="{ total: 10, limit: 5, page: 1 }"
+     */
+    paginationModifiers?: {
+        external: boolean;
+    };
+    /**
+     * model for sort column/columns data
+     * single column sort
+     * @example v-model:sort="{ column: 'name', direction: 'asc' }"
+     * multi columns sort
+     * @example v-model:sort="[{ column: 'name', direction: 'asc' }]"
+     */
+    sort?: SortColumn | SortColumn[];
+    /**
+     * modifiers for specifying externally sorted tables
+     * use this when api controls sorting
+     * single column sort
+     * @example v-model:sort.external="{ column: 'name', direction: 'asc' }"
+     * multi columns sort
+     * @example v-model:sort.external="[{ column: 'name', direction: 'asc' }]"
+     */
+    sortModifiers?: {
+        external: boolean;
+    };
+    /**
+     * list of column definitions
+     */
+    cols?: Array<TableColumn>;
+    /**
+     * attribute to use from column definitions to display column titles
+     */
+    columnAttr?: string;
+    /**
+     * flag to show a more or less spaceous table
+     */
+    dense?: boolean;
+    /**
+     * flag to outline the flag with a border
+     */
+    outlined?: boolean;
+    /**
+     * flag to show loading state of the table
+     * triggers an indefinite progress at the bottom of the table header
+     */
+    loading?: boolean;
+    /**
+     * data to display for empty state
+     * text and icon
+     * @example :empty="{ icon: 'transactions-line', label: 'No transactions found' }"
+     */
+    empty?: {
+        label?: string;
+        description?: string;
+    };
+}
+declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
+    sort: {
+        type: globalThis.PropType<SortColumn | SortColumn[]>;
+        default: undefined;
+    };
+    search: {
+        type: globalThis.PropType<string>;
+        default: string;
+    };
+    outlined: {
+        type: globalThis.PropType<boolean>;
+    };
+    loading: {
+        type: globalThis.PropType<boolean>;
+        default: boolean;
+    };
+    modelValue: {
+        type: globalThis.PropType<string[]>;
+        default: undefined;
+    };
+    dense: {
+        type: globalThis.PropType<boolean>;
+    };
+    empty: {
+        type: globalThis.PropType<{
+            label?: string | undefined;
+            description?: string | undefined;
+        }>;
+        default: () => {
+            label: string;
+        };
+    };
+    rows: {
+        type: globalThis.PropType<Record<string, any>[]>;
+        required: true;
+    };
+    rowAttr: {
+        type: globalThis.PropType<string>;
+        required: true;
+    };
+    pagination: {
+        type: globalThis.PropType<TablePaginationData>;
+        default: undefined;
+    };
+    paginationModifiers: {
+        type: globalThis.PropType<{
+            external: boolean;
+        }>;
+        default: undefined;
+    };
+    sortModifiers: {
+        type: globalThis.PropType<{
+            external: boolean;
+        }>;
+        default: undefined;
+    };
+    cols: {
+        type: globalThis.PropType<TableColumn[]>;
+        default: undefined;
+    };
+    columnAttr: {
+        type: globalThis.PropType<string>;
+        default: string;
+    };
+}, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:model-value": (value?: string[] | undefined) => void;
+    "update:pagination": (value?: TablePaginationData | undefined) => void;
+    "update:sort": (value?: SortColumn | SortColumn[] | undefined) => void;
+    "update:options": (value?: TableOptions | undefined) => void;
+}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    sort: {
+        type: globalThis.PropType<SortColumn | SortColumn[]>;
+        default: undefined;
+    };
+    search: {
+        type: globalThis.PropType<string>;
+        default: string;
+    };
+    outlined: {
+        type: globalThis.PropType<boolean>;
+    };
+    loading: {
+        type: globalThis.PropType<boolean>;
+        default: boolean;
+    };
+    modelValue: {
+        type: globalThis.PropType<string[]>;
+        default: undefined;
+    };
+    dense: {
+        type: globalThis.PropType<boolean>;
+    };
+    empty: {
+        type: globalThis.PropType<{
+            label?: string | undefined;
+            description?: string | undefined;
+        }>;
+        default: () => {
+            label: string;
+        };
+    };
+    rows: {
+        type: globalThis.PropType<Record<string, any>[]>;
+        required: true;
+    };
+    rowAttr: {
+        type: globalThis.PropType<string>;
+        required: true;
+    };
+    pagination: {
+        type: globalThis.PropType<TablePaginationData>;
+        default: undefined;
+    };
+    paginationModifiers: {
+        type: globalThis.PropType<{
+            external: boolean;
+        }>;
+        default: undefined;
+    };
+    sortModifiers: {
+        type: globalThis.PropType<{
+            external: boolean;
+        }>;
+        default: undefined;
+    };
+    cols: {
+        type: globalThis.PropType<TableColumn[]>;
+        default: undefined;
+    };
+    columnAttr: {
+        type: globalThis.PropType<string>;
+        default: string;
+    };
+}>> & {
+    "onUpdate:model-value"?: ((value?: string[] | undefined) => any) | undefined;
+    "onUpdate:pagination"?: ((value?: TablePaginationData | undefined) => any) | undefined;
+    "onUpdate:sort"?: ((value?: SortColumn | SortColumn[] | undefined) => any) | undefined;
+    "onUpdate:options"?: ((value?: TableOptions | undefined) => any) | undefined;
+}, {
+    sort: SortColumn | SortColumn[];
+    search: string;
+    loading: boolean;
+    modelValue: string[];
+    empty: {
+        label?: string | undefined;
+        description?: string | undefined;
+    };
+    pagination: TablePaginationData;
+    paginationModifiers: {
+        external: boolean;
+    };
+    sortModifiers: {
+        external: boolean;
+    };
+    cols: TableColumn[];
+    columnAttr: string;
+}, {}>, Partial<Record<string, (_: {
+    column: TableColumn | {
+        [x: string]: string | boolean;
+        key: string;
+        sortable: boolean;
+        class: string;
+    };
+}) => any>> & Partial<Record<string, (_: {
+    column: TableColumn | {
+        [x: string]: string | boolean;
+        key: string;
+        sortable: boolean;
+        class: string;
+    };
+    row: Record<string, any>;
+    index: number;
+}) => any>> & {
+    "no-data"?(_: {}): any;
+    "empty-description"?(_: {}): any;
+    tfoot?(_: {}): any;
+}>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/tables/TablePagination.vue.d.ts

@@ -0,0 +1,46 @@
+export interface TablePaginationData {
+    page: number;
+    total: number;
+    limit: number;
+    limits?: number[];
+}
+export interface Props {
+    modelValue: TablePaginationData;
+    dense?: boolean;
+    loading?: boolean;
+}
+declare const _default: import("vue").DefineComponent<{
+    loading: {
+        type: globalThis.PropType<boolean>;
+        default: boolean;
+    };
+    modelValue: {
+        type: globalThis.PropType<TablePaginationData>;
+        required: true;
+    };
+    dense: {
+        type: globalThis.PropType<boolean>;
+        default: boolean;
+    };
+}, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:model-value": (value: TablePaginationData) => void;
+}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    loading: {
+        type: globalThis.PropType<boolean>;
+        default: boolean;
+    };
+    modelValue: {
+        type: globalThis.PropType<TablePaginationData>;
+        required: true;
+    };
+    dense: {
+        type: globalThis.PropType<boolean>;
+        default: boolean;
+    };
+}>> & {
+    "onUpdate:model-value"?: ((value: TablePaginationData) => any) | undefined;
+}, {
+    loading: boolean;
+    dense: boolean;
+}, {}>;
+export default _default;

package/dist/composables/index.es.js

@@ -1,4 +1,4 @@
-import { u as s, a } from "../index-1f5d0d16.js";
+import { u as s, a } from "../index-2304aade.js";
 import "../all-icons.es.js";
 import "@vueuse/core";
 import "vue";

package/dist/composables/popper.d.ts

@@ -0,0 +1,251 @@
+import { type VirtualElement } from '@popperjs/core/lib/popper-lite';
+import { type MaybeElement } from '@vueuse/core';
+import type { Instance, Placement, PositioningStrategy } from '@popperjs/core';
+import type { Ref } from 'vue';
+export interface PopperOptions {
+    locked?: boolean;
+    overflowPadding?: number;
+    offsetDistance?: number;
+    offsetSkid?: number;
+    placement?: Placement;
+    strategy?: PositioningStrategy;
+    gpuAcceleration?: boolean;
+    adaptive?: boolean;
+    scroll?: boolean;
+    resize?: boolean;
+}
+export declare const DEFAULT_POPPER_OPTIONS: PopperOptions;
+export declare const createPopper: <TModifier extends Partial<import("@popperjs/core").Modifier<any, any>>>(reference: Element | VirtualElement, popper: HTMLElement, options?: Partial<import("@popperjs/core").OptionsGeneric<TModifier>> | undefined) => Instance;
+export declare const usePopper: (options: Ref<PopperOptions>, disabled?: Ref<boolean>, openDelay?: Ref<number>, closeDelay?: Ref<number>, virtualReference?: Ref<Element | VirtualElement>) => {
+    reference: Ref<MaybeElement>;
+    popper: Ref<MaybeElement>;
+    instance: Ref<{
+        state: {
+            elements: {
+                reference: Element | {
+                    getBoundingClientRect: () => ClientRect | DOMRect;
+                    contextElement?: Element | undefined;
+                };
+                popper: HTMLElement;
+                arrow?: HTMLElement | undefined;
+            };
+            options: {
+                placement: Placement;
+                modifiers: any[];
+                strategy: PositioningStrategy;
+                onFirstUpdate?: ((arg0: Partial<import("@popperjs/core").State>) => void) | undefined;
+            };
+            placement: Placement;
+            strategy: PositioningStrategy;
+            orderedModifiers: {
+                name: any;
+                enabled: boolean;
+                phase: import("@popperjs/core").ModifierPhases;
+                requires?: string[] | undefined;
+                requiresIfExists?: string[] | undefined;
+                fn: (arg0: import("@popperjs/core").ModifierArguments<any>) => void | import("@popperjs/core").State;
+                effect?: ((arg0: import("@popperjs/core").ModifierArguments<any>) => void | (() => void)) | undefined;
+                options?: Partial<any> | undefined;
+                data?: import("@popperjs/core").Obj | undefined;
+            }[];
+            rects: {
+                reference: {
+                    width: number;
+                    height: number;
+                    x: number;
+                    y: number;
+                };
+                popper: {
+                    width: number;
+                    height: number;
+                    x: number;
+                    y: number;
+                };
+            };
+            scrollParents: {
+                reference: (Element | {
+                    innerHeight: number;
+                    offsetHeight: number;
+                    innerWidth: number;
+                    offsetWidth: number;
+                    pageXOffset: number;
+                    pageYOffset: number;
+                    getComputedStyle: typeof getComputedStyle;
+                    addEventListener: (type: any, listener: any, optionsOrUseCapture?: any) => void;
+                    removeEventListener: (type: any, listener: any, optionsOrUseCapture?: any) => void;
+                    Element: Element;
+                    HTMLElement: HTMLElement;
+                    Node: Node;
+                    toString: () => "[object Window]";
+                    devicePixelRatio: number;
+                    visualViewport?: {
+                        addEventListener: (type: string, callback: EventListenerOrEventListenerObject | null, options?: boolean | AddEventListenerOptions | undefined) => void;
+                        dispatchEvent: (event: Event) => boolean;
+                        removeEventListener: (type: string, callback: EventListenerOrEventListenerObject | null, options?: boolean | EventListenerOptions | undefined) => void;
+                        width: number;
+                        height: number;
+                        offsetLeft: number;
+                        offsetTop: number;
+                        scale: number;
+                    } | undefined;
+                    ShadowRoot: ShadowRoot;
+                } | {
+                    addEventListener: (type: string, callback: EventListenerOrEventListenerObject | null, options?: boolean | AddEventListenerOptions | undefined) => void;
+                    dispatchEvent: (event: Event) => boolean;
+                    removeEventListener: (type: string, callback: EventListenerOrEventListenerObject | null, options?: boolean | EventListenerOptions | undefined) => void;
+                    width: number;
+                    height: number;
+                    offsetLeft: number;
+                    offsetTop: number;
+                    scale: number;
+                })[];
+                popper: (Element | {
+                    innerHeight: number;
+                    offsetHeight: number;
+                    innerWidth: number;
+                    offsetWidth: number;
+                    pageXOffset: number;
+                    pageYOffset: number;
+                    getComputedStyle: typeof getComputedStyle;
+                    addEventListener: (type: any, listener: any, optionsOrUseCapture?: any) => void;
+                    removeEventListener: (type: any, listener: any, optionsOrUseCapture?: any) => void;
+                    Element: Element;
+                    HTMLElement: HTMLElement;
+                    Node: Node;
+                    toString: () => "[object Window]";
+                    devicePixelRatio: number;
+                    visualViewport?: {
+                        addEventListener: (type: string, callback: EventListenerOrEventListenerObject | null, options?: boolean | AddEventListenerOptions | undefined) => void;
+                        dispatchEvent: (event: Event) => boolean;
+                        removeEventListener: (type: string, callback: EventListenerOrEventListenerObject | null, options?: boolean | EventListenerOptions | undefined) => void;
+                        width: number;
+                        height: number;
+                        offsetLeft: number;
+                        offsetTop: number;
+                        scale: number;
+                    } | undefined;
+                    ShadowRoot: ShadowRoot;
+                } | {
+                    addEventListener: (type: string, callback: EventListenerOrEventListenerObject | null, options?: boolean | AddEventListenerOptions | undefined) => void;
+                    dispatchEvent: (event: Event) => boolean;
+                    removeEventListener: (type: string, callback: EventListenerOrEventListenerObject | null, options?: boolean | EventListenerOptions | undefined) => void;
+                    width: number;
+                    height: number;
+                    offsetLeft: number;
+                    offsetTop: number;
+                    scale: number;
+                })[];
+            };
+            styles: {
+                [key: string]: Partial<CSSStyleDeclaration>;
+            };
+            attributes: {
+                [key: string]: {
+                    [key: string]: string | boolean;
+                };
+            };
+            modifiersData: {
+                [x: string]: any;
+                arrow?: {
+                    x?: number | undefined;
+                    y?: number | undefined;
+                    centerOffset: number;
+                } | undefined;
+                hide?: {
+                    isReferenceHidden: boolean;
+                    hasPopperEscaped: boolean;
+                    referenceClippingOffsets: {
+                        top: number;
+                        left: number;
+                        right: number;
+                        bottom: number;
+                    };
+                    popperEscapeOffsets: {
+                        top: number;
+                        left: number;
+                        right: number;
+                        bottom: number;
+                    };
+                } | undefined;
+                offset?: {
+                    auto?: {
+                        y: number;
+                        x: number;
+                    } | undefined;
+                    left?: {
+                        y: number;
+                        x: number;
+                    } | undefined;
+                    right?: {
+                        y: number;
+                        x: number;
+                    } | undefined;
+                    "auto-start"?: {
+                        y: number;
+                        x: number;
+                    } | undefined;
+                    "auto-end"?: {
+                        y: number;
+                        x: number;
+                    } | undefined;
+                    top?: {
+                        y: number;
+                        x: number;
+                    } | undefined;
+                    bottom?: {
+                        y: number;
+                        x: number;
+                    } | undefined;
+                    "top-start"?: {
+                        y: number;
+                        x: number;
+                    } | undefined;
+                    "top-end"?: {
+                        y: number;
+                        x: number;
+                    } | undefined;
+                    "bottom-start"?: {
+                        y: number;
+                        x: number;
+                    } | undefined;
+                    "bottom-end"?: {
+                        y: number;
+                        x: number;
+                    } | undefined;
+                    "right-start"?: {
+                        y: number;
+                        x: number;
+                    } | undefined;
+                    "right-end"?: {
+                        y: number;
+                        x: number;
+                    } | undefined;
+                    "left-start"?: {
+                        y: number;
+                        x: number;
+                    } | undefined;
+                    "left-end"?: {
+                        y: number;
+                        x: number;
+                    } | undefined;
+                } | undefined;
+                preventOverflow?: {
+                    y: number;
+                    x: number;
+                } | undefined;
+                popperOffsets?: {
+                    y: number;
+                    x: number;
+                } | undefined;
+            };
+            reset: boolean;
+        };
+        destroy: () => void;
+        forceUpdate: () => void;
+        update: () => Promise<Partial<import("@popperjs/core").State>>;
+        setOptions: (setOptionsAction: Partial<import("@popperjs/core").OptionsGeneric<any>> | ((prev: Partial<import("@popperjs/core").OptionsGeneric<any>>) => Partial<import("@popperjs/core").OptionsGeneric<any>>)) => Promise<Partial<import("@popperjs/core").State>>;
+    } | null>;
+    open: Ref<boolean>;
+    onMouseOver: () => void;
+    onMouseLeave: () => void;
+};

package/dist/index-2304aade.js

@@ -0,0 +1,115 @@
+import { RiAlertFill as A, RiAlertLine as y, RiArrowDownLine as E, RiArrowDropDownFill as T, RiArrowLeftLine as D, RiArrowLeftSLine as I, RiArrowRightLine as v, RiArrowRightSLine as B, RiCheckLine as M, RiCheckboxBlankCircleFill as S, RiCheckboxBlankCircleLine as O, RiCheckboxBlankLine as j, RiCheckboxCircleFill as U, RiCheckboxCircleLine as V, RiCheckboxFill as W, RiCheckboxIndeterminateFill as q, RiCloseCircleLine as G, RiCloseFill as P, RiCloseLine as z, RiDatabase2Line as H, RiErrorWarningFill as J, RiErrorWarningLine as K, RiEyeLine as N, RiEyeOffLine as Q, RiInformationFill as X, RiInformationLine as Y, RiRadioButtonLine as Z, RiMoreFill as _ } from "./all-icons.es.js";
+import { createGlobalState as ee, useColorMode as ie } from "@vueuse/core";
+import { ref as C, computed as m, watch as re } from "vue";
+import { set as f, get as e } from "@vueuse/shared";
+import { c as te } from "./colors-01d79c7b.js";
+const de = ee(() => {
+  const t = [
+    A,
+    y,
+    E,
+    T,
+    D,
+    I,
+    v,
+    B,
+    M,
+    S,
+    O,
+    j,
+    U,
+    V,
+    W,
+    q,
+    G,
+    P,
+    z,
+    H,
+    J,
+    K,
+    N,
+    Q,
+    X,
+    Y,
+    Z,
+    _
+  ], i = C({});
+  return { registeredIcons: i, registerIcons: (a) => {
+    f(i, {
+      ...e(i),
+      ...Object.fromEntries(
+        [...t, ...a].map(({ name: s, path: d }) => [s, d])
+      )
+    });
+  } };
+}), r = {
+  auto: "auto",
+  light: "light",
+  dark: "dark"
+}, L = (t) => Object.fromEntries(
+  te.map((i) => [
+    i,
+    {
+      DEFAULT: `var(--rui-${t}-${i}-main)`,
+      lighter: `var(--rui-${t}-${i}-lighter)`,
+      darker: `var(--rui-${t}-${i}-darker)`
+    }
+  ])
+), b = {
+  light: L("light"),
+  dark: L("dark")
+}, u = C({ ...b }), me = () => {
+  const { store: t, state: i, system: h } = ie(), a = m(
+    () => e(t) === r.auto
+  ), s = m(
+    () => e(a) && e(h) === r.light || e(i) === r.light
+  ), d = m(
+    () => e(a) && e(h) === r.dark || e(i) === r.dark
+  ), g = m(() => e(s) ? e(u).light : e(u).dark), c = (l) => {
+    f(t, l || r.auto);
+  }, p = () => {
+    e(a) ? c(r.light) : e(s) ? c(r.dark) : e(d) && c(r.auto);
+  }, k = (l) => {
+    f(u, l);
+  };
+  return {
+    isAutoControlled: a,
+    isLight: s,
+    isDark: d,
+    config: u,
+    theme: g,
+    store: t,
+    state: i,
+    init: (l) => {
+      c(l.mode ?? r.auto), k(l.config ?? { ...b }), typeof window < "u" && re(
+        [s, g],
+        ([x, w]) => {
+          const F = Object.entries(w).map(([o, n]) => ({
+            [`--rui-${o}-main`]: n.DEFAULT,
+            [`--rui-${o}-lighter`]: n.lighter,
+            [`--rui-${o}-darker`]: n.darker
+          })).reduce((o, n) => ({ ...o, ...n }), {}), R = x ? r.light : r.dark, $ = {
+            "--rui-text-primary": `var(--rui-${R}-text-primary)`,
+            "--rui-text-secondary": `var(--rui-${R}-text-secondary)`,
+            "--rui-text-disabled": `var(--rui-${R}-text-disabled)`
+          };
+          Object.entries({
+            ...F,
+            ...$
+          }).forEach(([o, n]) => {
+            document.documentElement.style.setProperty(o, n);
+          });
+        },
+        { immediate: !0 }
+      );
+    },
+    setThemeConfig: k,
+    toggleThemeMode: p,
+    switchThemeScheme: c
+  };
+};
+export {
+  r as T,
+  me as a,
+  de as u
+};