@simon_he/vue-tui 0.0.8 → 1.0.0

package/dist/vue/components/TDataTable.d.ts

@@ -0,0 +1,367 @@
+import type { PropType } from "vue";
+import type { Style } from "../../core/types.js";
+import { type TTableColumn, type TTableRow } from "./TTable.js";
+export type TDataTableSortDirection = "asc" | "desc";
+export type TDataTableSortChangePayload = Readonly<{
+    sortBy: string;
+    sortDirection: TDataTableSortDirection;
+}>;
+export type TDataTableRowSelectPayload = Readonly<{
+    row: TTableRow;
+    /** Visible row index within the current viewport. */
+    index: number;
+    /** Absolute row index in the filtered/sorted result set. */
+    dataIndex: number;
+    /** Original index in the input rows array. */
+    originalIndex: number;
+    key: unknown;
+}>;
+export type TDataTableSorter = (a: TTableRow, b: TTableRow, column: TTableColumn) => number;
+export type TDataTableFilterPredicate = (row: TTableRow, query: string, columns: readonly TTableColumn[], originalIndex: number) => boolean;
+export type TDataTableSelectionMode = "none" | "single" | "multiple";
+export declare const TDataTable: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    x: {
+        type: NumberConstructor;
+        required: true;
+    };
+    y: {
+        type: NumberConstructor;
+        required: true;
+    };
+    w: {
+        type: NumberConstructor;
+        required: true;
+    };
+    h: {
+        type: NumberConstructor;
+        required: true;
+    };
+    zIndex: {
+        type: NumberConstructor;
+        default: number;
+    };
+    columns: {
+        type: PropType<readonly TTableColumn[]>;
+        required: true;
+    };
+    /**
+     * TDataTable can accept a controlled viewport offset through scrollTop. It is
+     * still non-virtual: rows are sorted/filtered in memory and only the visible
+     * slice is passed to TTable.
+     */
+    rows: {
+        type: PropType<readonly TTableRow[]>;
+        required: true;
+    };
+    rowKey: {
+        type: PropType<string | ((row: TTableRow, index: number) => unknown)>;
+        default: undefined;
+    };
+    selectedRowKey: {
+        type: any;
+        default: undefined;
+    };
+    selectedRowKeys: {
+        type: PropType<readonly unknown[]>;
+        default: undefined;
+    };
+    scrollTop: {
+        type: NumberConstructor;
+        default: undefined;
+    };
+    /** Sorts by the raw row value at this key; column format only affects display and filtering. */
+    sortBy: {
+        type: StringConstructor;
+        default: string;
+    };
+    sortDirection: {
+        type: PropType<TDataTableSortDirection>;
+        default: string;
+    };
+    sortable: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    manualSort: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    sorter: {
+        type: PropType<TDataTableSorter>;
+        default: undefined;
+    };
+    filter: {
+        type: StringConstructor;
+        default: string;
+    };
+    filterable: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    manualFilter: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    filterPredicate: {
+        type: PropType<TDataTableFilterPredicate>;
+        default: undefined;
+    };
+    selectable: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    selectionMode: {
+        type: PropType<TDataTableSelectionMode>;
+        default: string;
+    };
+    border: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    style: {
+        type: PropType<Style>;
+        default: undefined;
+    };
+    headerStyle: {
+        type: PropType<Style>;
+        default: undefined;
+    };
+    borderStyle: {
+        type: PropType<Style>;
+        default: undefined;
+    };
+    selectedStyle: {
+        type: PropType<Style>;
+        default: undefined;
+    };
+    activeStyle: {
+        type: PropType<Style>;
+        default: undefined;
+    };
+    emptyText: {
+        type: StringConstructor;
+        default: string;
+    };
+}>, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
+    [key: string]: any;
+}>, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:selectedRowKey": (_key: unknown) => true;
+    "update:selectedRowKeys": (_keys: unknown[]) => true;
+    "update:scrollTop": (_scrollTop: number) => true;
+    "update:sortBy": (_key: string) => true;
+    "update:sortDirection": (_direction: TDataTableSortDirection) => true;
+    sortChange: (_payload: TDataTableSortChangePayload) => true;
+    rowSelect: (_payload: TDataTableRowSelectPayload) => true;
+}, string, (import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps), Readonly<import("vue").ExtractPropTypes<{
+    x: {
+        type: NumberConstructor;
+        required: true;
+    };
+    y: {
+        type: NumberConstructor;
+        required: true;
+    };
+    w: {
+        type: NumberConstructor;
+        required: true;
+    };
+    h: {
+        type: NumberConstructor;
+        required: true;
+    };
+    zIndex: {
+        type: NumberConstructor;
+        default: number;
+    };
+    columns: {
+        type: PropType<readonly TTableColumn[]>;
+        required: true;
+    };
+    /**
+     * TDataTable can accept a controlled viewport offset through scrollTop. It is
+     * still non-virtual: rows are sorted/filtered in memory and only the visible
+     * slice is passed to TTable.
+     */
+    rows: {
+        type: PropType<readonly TTableRow[]>;
+        required: true;
+    };
+    rowKey: {
+        type: PropType<string | ((row: TTableRow, index: number) => unknown)>;
+        default: undefined;
+    };
+    selectedRowKey: {
+        type: any;
+        default: undefined;
+    };
+    selectedRowKeys: {
+        type: PropType<readonly unknown[]>;
+        default: undefined;
+    };
+    scrollTop: {
+        type: NumberConstructor;
+        default: undefined;
+    };
+    /** Sorts by the raw row value at this key; column format only affects display and filtering. */
+    sortBy: {
+        type: StringConstructor;
+        default: string;
+    };
+    sortDirection: {
+        type: PropType<TDataTableSortDirection>;
+        default: string;
+    };
+    sortable: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    manualSort: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    sorter: {
+        type: PropType<TDataTableSorter>;
+        default: undefined;
+    };
+    filter: {
+        type: StringConstructor;
+        default: string;
+    };
+    filterable: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    manualFilter: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    filterPredicate: {
+        type: PropType<TDataTableFilterPredicate>;
+        default: undefined;
+    };
+    selectable: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    selectionMode: {
+        type: PropType<TDataTableSelectionMode>;
+        default: string;
+    };
+    border: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    style: {
+        type: PropType<Style>;
+        default: undefined;
+    };
+    headerStyle: {
+        type: PropType<Style>;
+        default: undefined;
+    };
+    borderStyle: {
+        type: PropType<Style>;
+        default: undefined;
+    };
+    selectedStyle: {
+        type: PropType<Style>;
+        default: undefined;
+    };
+    activeStyle: {
+        type: PropType<Style>;
+        default: undefined;
+    };
+    emptyText: {
+        type: StringConstructor;
+        default: string;
+    };
+}>> & Readonly<{
+    "onUpdate:scrollTop"?: ((_scrollTop: number) => any) | undefined;
+    "onUpdate:selectedRowKey"?: ((_key: unknown) => any) | undefined;
+    "onUpdate:selectedRowKeys"?: ((_keys: unknown[]) => any) | undefined;
+    "onUpdate:sortBy"?: ((_key: string) => any) | undefined;
+    "onUpdate:sortDirection"?: ((_direction: TDataTableSortDirection) => any) | undefined;
+    onSortChange?: ((_payload: Readonly<{
+        sortBy: string;
+        sortDirection: TDataTableSortDirection;
+    }>) => any) | undefined;
+    onRowSelect?: ((_payload: Readonly<{
+        row: TTableRow;
+        /** Visible row index within the current viewport. */
+        index: number;
+        /** Absolute row index in the filtered/sorted result set. */
+        dataIndex: number;
+        /** Original index in the input rows array. */
+        originalIndex: number;
+        key: unknown;
+    }>) => any) | undefined;
+}>, {
+    filter: string;
+    style: Readonly<{
+        fg?: string;
+        bg?: string;
+        bold?: boolean;
+        dim?: boolean;
+        italic?: boolean;
+        underline?: boolean;
+        inverse?: boolean;
+        href?: string;
+    }>;
+    zIndex: number;
+    selectable: boolean;
+    border: boolean;
+    selectedStyle: Readonly<{
+        fg?: string;
+        bg?: string;
+        bold?: boolean;
+        dim?: boolean;
+        italic?: boolean;
+        underline?: boolean;
+        inverse?: boolean;
+        href?: string;
+    }>;
+    emptyText: string;
+    headerStyle: Readonly<{
+        fg?: string;
+        bg?: string;
+        bold?: boolean;
+        dim?: boolean;
+        italic?: boolean;
+        underline?: boolean;
+        inverse?: boolean;
+        href?: string;
+    }>;
+    scrollTop: number;
+    activeStyle: Readonly<{
+        fg?: string;
+        bg?: string;
+        bold?: boolean;
+        dim?: boolean;
+        italic?: boolean;
+        underline?: boolean;
+        inverse?: boolean;
+        href?: string;
+    }>;
+    rowKey: string | ((row: TTableRow, index: number) => unknown);
+    borderStyle: Readonly<{
+        fg?: string;
+        bg?: string;
+        bold?: boolean;
+        dim?: boolean;
+        italic?: boolean;
+        underline?: boolean;
+        inverse?: boolean;
+        href?: string;
+    }>;
+    selectedRowKey: any;
+    selectedRowKeys: readonly unknown[];
+    sortBy: string;
+    sortDirection: TDataTableSortDirection;
+    sortable: boolean;
+    manualSort: boolean;
+    sorter: TDataTableSorter;
+    filterable: boolean;
+    manualFilter: boolean;
+    filterPredicate: TDataTableFilterPredicate;
+    selectionMode: TDataTableSelectionMode;
+}, {}>;

package/dist/vue/components/TDebugOverlay.d.ts

@@ -0,0 +1,43 @@
+import type { PropType } from "vue";
+export declare const TDebugOverlay: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    mode: {
+        type: PropType<"focus" | "all">;
+        default: string;
+    };
+    panel: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    maxRects: {
+        type: NumberConstructor;
+        default: number;
+    };
+    zIndex: {
+        type: NumberConstructor;
+        default: number;
+    };
+}>, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
+    [key: string]: any;
+}> | null, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, (import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps), Readonly<import("vue").ExtractPropTypes<{
+    mode: {
+        type: PropType<"focus" | "all">;
+        default: string;
+    };
+    panel: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    maxRects: {
+        type: NumberConstructor;
+        default: number;
+    };
+    zIndex: {
+        type: NumberConstructor;
+        default: number;
+    };
+}>> & Readonly<{}>, {
+    mode: "focus" | "all";
+    zIndex: number;
+    panel: boolean;
+    maxRects: number;
+}, {}>;

package/dist/vue/components/TDialog.d.ts

@@ -0,0 +1,255 @@
+import type { PropType } from "vue";
+import type { Style } from "../../core/types.js";
+import { type TOverlayPlacement as Placement } from "../overlay.js";
+export type DialogButton = Readonly<{
+    label: string;
+    value?: unknown;
+    id?: string;
+    kind?: "default" | "primary" | "danger" | "muted" | "accent";
+    default?: boolean;
+    style?: Style;
+    selectedStyle?: Style;
+}>;
+export declare const TDialog: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    modelValue: {
+        type: BooleanConstructor;
+        required: true;
+    };
+    w: {
+        type: NumberConstructor;
+        required: true;
+    };
+    h: {
+        type: NumberConstructor;
+        required: true;
+    };
+    title: {
+        type: StringConstructor;
+        default: string;
+    };
+    padding: {
+        type: NumberConstructor;
+        default: number;
+    };
+    zIndex: {
+        type: NumberConstructor;
+        default: number;
+    };
+    style: {
+        type: PropType<Style>;
+        default: undefined;
+    };
+    titleStyle: {
+        type: PropType<Style>;
+        default: undefined;
+    };
+    contentStyle: {
+        type: PropType<Style>;
+        default: undefined;
+    };
+    backdropStyle: {
+        type: PropType<Style>;
+        default: undefined;
+    };
+    placement: {
+        type: PropType<Placement>;
+        default: string;
+    };
+    offsetX: {
+        type: NumberConstructor;
+        default: number;
+    };
+    offsetY: {
+        type: NumberConstructor;
+        default: number;
+    };
+    backdrop: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    closeOnBackdrop: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    closeOnEsc: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    closeOnBlur: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    teleport: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    tabMode: {
+        type: PropType<"cycle" | "wrapFromButtons">;
+        default: string;
+    };
+    buttons: {
+        type: PropType<DialogButton[]>;
+        default: () => never[];
+    };
+    closeOnConfirm: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+}>, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
+    [key: string]: any;
+}> | null, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("keydown" | "focus" | "blur" | "close" | "update:modelValue" | "confirm")[], "keydown" | "focus" | "blur" | "close" | "update:modelValue" | "confirm", (import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps), Readonly<import("vue").ExtractPropTypes<{
+    modelValue: {
+        type: BooleanConstructor;
+        required: true;
+    };
+    w: {
+        type: NumberConstructor;
+        required: true;
+    };
+    h: {
+        type: NumberConstructor;
+        required: true;
+    };
+    title: {
+        type: StringConstructor;
+        default: string;
+    };
+    padding: {
+        type: NumberConstructor;
+        default: number;
+    };
+    zIndex: {
+        type: NumberConstructor;
+        default: number;
+    };
+    style: {
+        type: PropType<Style>;
+        default: undefined;
+    };
+    titleStyle: {
+        type: PropType<Style>;
+        default: undefined;
+    };
+    contentStyle: {
+        type: PropType<Style>;
+        default: undefined;
+    };
+    backdropStyle: {
+        type: PropType<Style>;
+        default: undefined;
+    };
+    placement: {
+        type: PropType<Placement>;
+        default: string;
+    };
+    offsetX: {
+        type: NumberConstructor;
+        default: number;
+    };
+    offsetY: {
+        type: NumberConstructor;
+        default: number;
+    };
+    backdrop: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    closeOnBackdrop: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    closeOnEsc: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    closeOnBlur: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    teleport: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    tabMode: {
+        type: PropType<"cycle" | "wrapFromButtons">;
+        default: string;
+    };
+    buttons: {
+        type: PropType<DialogButton[]>;
+        default: () => never[];
+    };
+    closeOnConfirm: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+}>> & Readonly<{
+    onKeydown?: ((...args: any[]) => any) | undefined;
+    onFocus?: ((...args: any[]) => any) | undefined;
+    onBlur?: ((...args: any[]) => any) | undefined;
+    onClose?: ((...args: any[]) => any) | undefined;
+    "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
+    onConfirm?: ((...args: any[]) => any) | undefined;
+}>, {
+    style: Readonly<{
+        fg?: string;
+        bg?: string;
+        bold?: boolean;
+        dim?: boolean;
+        italic?: boolean;
+        underline?: boolean;
+        inverse?: boolean;
+        href?: string;
+    }>;
+    title: string;
+    zIndex: number;
+    buttons: Readonly<{
+        label: string;
+        value?: unknown;
+        id?: string;
+        kind?: "default" | "primary" | "danger" | "muted" | "accent";
+        default?: boolean;
+        style?: Style;
+        selectedStyle?: Style;
+    }>[];
+    padding: number;
+    titleStyle: Readonly<{
+        fg?: string;
+        bg?: string;
+        bold?: boolean;
+        dim?: boolean;
+        italic?: boolean;
+        underline?: boolean;
+        inverse?: boolean;
+        href?: string;
+    }>;
+    placement: Placement;
+    offsetX: number;
+    offsetY: number;
+    contentStyle: Readonly<{
+        fg?: string;
+        bg?: string;
+        bold?: boolean;
+        dim?: boolean;
+        italic?: boolean;
+        underline?: boolean;
+        inverse?: boolean;
+        href?: string;
+    }>;
+    backdropStyle: Readonly<{
+        fg?: string;
+        bg?: string;
+        bold?: boolean;
+        dim?: boolean;
+        italic?: boolean;
+        underline?: boolean;
+        inverse?: boolean;
+        href?: string;
+    }>;
+    backdrop: boolean;
+    closeOnBackdrop: boolean;
+    closeOnEsc: boolean;
+    closeOnBlur: boolean;
+    tabMode: "cycle" | "wrapFromButtons";
+    teleport: boolean;
+    closeOnConfirm: boolean;
+}, {}>;