hys-ui 0.1.0 → 0.2.0

package/dist/types/composables/table.d.ts

@@ -0,0 +1,309 @@
+import type { CSSProperties, HTMLAttributes, VNodeChild } from "vue";
+import type { Placement } from "./useFloating";
+export type HysTableKey = string | number;
+export type HysTableDirection = "asc" | "desc";
+export type HysTableFilterValue = string | number | boolean;
+export type HysTableFilters = Record<string, readonly HysTableFilterValue[]>;
+export interface HysTableSort {
+    key: string;
+    direction: HysTableDirection;
+}
+export interface HysTableSelectionProps {
+    disabled?: boolean;
+    label?: string;
+    title?: string;
+}
+export interface HysTableSelectionColumn {
+    label?: string;
+    width?: number;
+    fixed?: boolean | "left" | "right";
+    align?: "left" | "center" | "right";
+}
+export interface HysTableFilterConfirmOptions {
+    closeDropdown?: boolean;
+}
+export interface HysTableFilterResetOptions extends HysTableFilterConfirmOptions {
+    confirm?: boolean;
+}
+export interface HysTableScrollRowOptions {
+    behavior?: ScrollBehavior;
+    block?: "start" | "center" | "end" | "nearest";
+}
+export interface HysTableFilter {
+    label: string;
+    value: HysTableFilterValue;
+    disabled?: boolean;
+    children?: readonly HysTableFilter[];
+}
+export type HysTableElementAttrs = HTMLAttributes & Record<string, unknown>;
+export type HysTablePaginationPosition = "top-left" | "top-center" | "top-right" | "bottom-left" | "bottom-center" | "bottom-right";
+export interface HysTableCellContext<T extends object = Record<string, unknown>> {
+    row: T;
+    column: HysTableColumn<T>;
+    value: unknown;
+    rowIndex: number;
+    columnIndex: number;
+}
+export interface HysTableColumn<T extends object = any> {
+    key: string;
+    label: string;
+    dataIndex?: string | readonly (string | number)[];
+    type?: "default" | "selection" | "index" | "expand";
+    children?: readonly HysTableColumn<T>[];
+    width?: string | number;
+    minWidth?: number;
+    maxWidth?: number;
+    fixed?: boolean | "left" | "right";
+    align?: "left" | "center" | "right";
+    headerAlign?: "left" | "center" | "right";
+    sortable?: boolean | "custom";
+    sorter?: (a: T, b: T) => number;
+    sortBy?: string | ((row: T) => unknown) | readonly (string | ((row: T) => unknown))[];
+    sortOrders?: readonly (HysTableDirection | null)[];
+    defaultSortOrder?: HysTableDirection;
+    sortPriority?: number;
+    filters?: readonly HysTableFilter[];
+    filterable?: boolean;
+    filterMultiple?: boolean;
+    filterMode?: "menu" | "tree";
+    filterSearch?: boolean | ((query: string, option: HysTableFilter) => boolean);
+    defaultFilterValue?: readonly HysTableFilterValue[];
+    filterResetToDefault?: boolean;
+    filterMethod?: (value: HysTableFilterValue, row: T, column: HysTableColumn<T>) => boolean;
+    formatter?: (row: T, column: HysTableColumn<T>, value: unknown, index: number) => VNodeChild;
+    ellipsis?: boolean;
+    showOverflowTooltip?: boolean;
+    tooltipFormatter?: (context: HysTableCellContext<T>) => VNodeChild;
+    className?: string;
+    headerClassName?: string;
+    cellStyle?: CSSProperties | ((context: HysTableCellContext<T>) => CSSProperties);
+    summary?: "sum" | "avg" | "min" | "max" | "count";
+    index?: number | ((index: number, row: T) => VNodeChild);
+    hidden?: boolean;
+    responsive?: readonly ("xs" | "sm" | "md" | "lg" | "xl" | "xxl")[];
+    resizable?: boolean;
+    rowScope?: "row" | "rowgroup";
+    customCell?: (context: HysTableCellContext<T>) => HysTableElementAttrs;
+    customHeaderCell?: (column: HysTableColumn<T>, index: number) => HysTableElementAttrs;
+}
+export interface HysTablePagination {
+    position?: readonly HysTablePaginationPosition[];
+    page?: number;
+    pageSize?: number;
+    total?: number;
+    pageSizeOptions?: number[];
+    showSizeChanger?: boolean;
+    showQuickJumper?: boolean;
+    showTotal?: boolean;
+    compact?: boolean;
+    hideOnSinglePage?: boolean;
+}
+export interface HysTableQuery<T extends object = Record<string, unknown>> {
+    action: "sort" | "filter" | "page" | "pageSize";
+    page: number;
+    pageSize: number;
+    sorts: HysTableSort[];
+    filters: HysTableFilters;
+    currentData: T[];
+}
+export interface HysTableLoadContext {
+    signal: AbortSignal;
+    key: HysTableKey;
+    depth: number;
+}
+export interface HysTableLocale {
+    emptyText: string;
+    loadingText: string;
+    selectAll: string;
+    selectRow: string;
+    expandRow: string;
+    collapseRow: string;
+    expand: string;
+    collapse: string;
+    filter: string;
+    filterPlaceholder: string;
+    reset: string;
+    apply: string;
+    retry: string;
+    retryLabel: string;
+    scrollLabel: string;
+    resizeColumn: string;
+    sortAsc: string;
+    sortDesc: string;
+    filterSearch?: string;
+    noFilterMatch?: string;
+    invertSelection?: string;
+    clearSelection?: string;
+    selected?: string;
+    paginationLabels?: Partial<{
+        total: string;
+        perPage: string;
+        jump: string;
+        page: string;
+        first: string;
+        previous: string;
+        next: string;
+        last: string;
+    }>;
+}
+export interface HysTableProps<T extends object> {
+    locale?: Partial<HysTableLocale>;
+    columns: readonly HysTableColumn<T>[];
+    rows: readonly T[];
+    rowKey?: string | ((row: T) => HysTableKey);
+    emptyText?: string;
+    loading?: boolean;
+    disabled?: boolean;
+    striped?: boolean;
+    bordered?: boolean;
+    size?: "sm" | "md" | "lg";
+    tableLayout?: "auto" | "fixed";
+    caption?: string;
+    height?: number | string;
+    maxHeight?: number | string;
+    stickyHeader?: boolean;
+    showHeader?: boolean;
+    fit?: boolean;
+    scrollbarAlwaysOn?: boolean;
+    scrollbarTabindex?: number | string;
+    headerRowClassName?: string | ((columns: readonly HysTableColumn<T>[], level: number) => string);
+    headerRowStyle?: CSSProperties | ((columns: readonly HysTableColumn<T>[], level: number) => CSSProperties);
+    rowClassName?: string | ((row: T, index: number) => string);
+    rowStyle?: CSSProperties | ((row: T, index: number) => CSSProperties);
+    cellClassName?: string | ((context: HysTableCellContext<T>) => string);
+    cellStyle?: CSSProperties | ((context: HysTableCellContext<T>) => CSSProperties);
+    headerCellClassName?: string | ((column: HysTableColumn<T>, index: number) => string);
+    headerCellStyle?: CSSProperties | ((column: HysTableColumn<T>, index: number) => CSSProperties);
+    customRow?: (row: T, index: number) => HysTableElementAttrs;
+    customHeaderRow?: (columns: readonly HysTableColumn<T>[], index: number) => HysTableElementAttrs;
+    customCell?: (context: HysTableCellContext<T>) => HysTableElementAttrs;
+    customHeaderCell?: (column: HysTableColumn<T>, index: number) => HysTableElementAttrs;
+    selectable?: boolean | ((row: T, index: number) => boolean);
+    selectionType?: "checkbox" | "radio";
+    selectedRowKeys?: readonly HysTableKey[];
+    defaultSelectedRowKeys?: readonly HysTableKey[];
+    reserveSelection?: boolean;
+    checkStrictly?: boolean;
+    selectOnIndeterminate?: boolean;
+    selectionActions?: boolean;
+    rangeSelection?: boolean;
+    hideSelectAll?: boolean;
+    selectionColumn?: HysTableSelectionColumn;
+    getSelectionProps?: (row: T, index: number) => HysTableSelectionProps;
+    highlightCurrentRow?: boolean;
+    currentRowKey?: HysTableKey | null;
+    defaultCurrentRowKey?: HysTableKey;
+    showIndex?: boolean;
+    indexMethod?: (index: number, row: T) => VNodeChild;
+    sort?: HysTableSort | null;
+    sorts?: readonly HysTableSort[];
+    defaultSort?: HysTableSort | readonly HysTableSort[] | null;
+    multiSort?: boolean;
+    sortOrders?: readonly (HysTableDirection | null)[];
+    filters?: HysTableFilters;
+    defaultFilters?: HysTableFilters;
+    filterColumnKey?: string | null;
+    filterPlacement?: Placement;
+    appendFilterTo?: string | HTMLElement | false;
+    pagination?: boolean | HysTablePagination;
+    page?: number;
+    pageSize?: number;
+    total?: number;
+    serverMode?: boolean;
+    scrollToFirstRowOnChange?: boolean;
+    expandable?: boolean;
+    expandedRowKeys?: readonly HysTableKey[];
+    defaultExpandedRowKeys?: readonly HysTableKey[];
+    defaultExpandAll?: boolean;
+    rowExpandable?: (row: T) => boolean;
+    expandOnClickRow?: boolean;
+    showExpandColumn?: boolean;
+    expandColumnTitle?: string;
+    expandFixed?: boolean | "left" | "right";
+    preserveExpandedContent?: boolean;
+    treeMode?: boolean;
+    childrenKey?: string;
+    hasChildrenKey?: string;
+    indent?: number;
+    loadChildren?: (row: T, context: HysTableLoadContext) => readonly T[] | Promise<readonly T[]>;
+    showSummary?: boolean;
+    sumText?: string;
+    summaryMethod?: (context: {
+        columns: readonly HysTableColumn<T>[];
+        rows: T[];
+    }) => readonly VNodeChild[] | Record<string, VNodeChild>;
+    spanMethod?: (context: HysTableCellContext<T>) => {
+        rowspan?: number;
+        colspan?: number;
+    } | readonly [number, number] | undefined;
+    showOverflowTooltip?: boolean;
+    tooltipFormatter?: (context: HysTableCellContext<T>) => VNodeChild;
+    resizable?: boolean;
+    columnWidths?: Readonly<Record<string, number>>;
+    allowDragLastColumn?: boolean;
+}
+export interface HysTableInstance<T extends object = Record<string, unknown>> {
+    readonly element: HTMLElement | undefined;
+    readonly viewport: HTMLElement | undefined;
+    readonly selectedKeys: HysTableKey[];
+    readonly currentRow: T | undefined;
+    readonly expandedKeys: HysTableKey[];
+    readonly query: HysTableQuery<T>;
+    readonly columns: HysTableColumn<T>[];
+    clearSelection: () => Promise<boolean>;
+    getSelectionRows: () => T[];
+    getHalfSelectionRows: () => T[];
+    toggleRowSelection: (row: T | HysTableKey, selected?: boolean, range?: boolean) => Promise<boolean>;
+    toggleAllSelection: (selected?: boolean) => Promise<boolean>;
+    invertSelection: () => Promise<boolean>;
+    setCurrentRow: (row?: T | HysTableKey | null) => Promise<boolean>;
+    toggleRowExpansion: (row: T | HysTableKey, expanded?: boolean) => Promise<boolean>;
+    loadRow: (row: T | HysTableKey, force?: boolean) => Promise<boolean>;
+    updateKeyChildren: (row: T | HysTableKey, children: readonly T[]) => Promise<boolean>;
+    clearSort: () => void;
+    setSort: (sort: HysTableSort | readonly HysTableSort[] | null) => void;
+    clearFilter: (keys?: readonly string[]) => void;
+    setFilter: (key: string, values: readonly HysTableFilterValue[]) => void;
+    showFilter: (key: string) => Promise<boolean>;
+    hideFilter: () => Promise<boolean>;
+    setPage: (page: number) => void;
+    resizeColumn: (key: string, width: number) => void;
+    resetColumnWidths: () => void;
+    doLayout: () => Promise<void>;
+    scrollTo: (options: ScrollToOptions) => void;
+    setScrollTop: (top: number) => void;
+    setScrollLeft: (left: number) => void;
+    scrollToRow: (row: T | HysTableKey, options?: HysTableScrollRowOptions) => Promise<boolean>;
+}
+export interface TableNode<T extends object> {
+    row: T;
+    key: HysTableKey;
+    token: string;
+    index: number;
+    depth: number;
+    rootToken: string;
+    parent?: TableNode<T>;
+    children: TableNode<T>[];
+    lazy: boolean;
+}
+export interface TableHeader<T extends object> {
+    column: HysTableColumn<T>;
+    key: string;
+    leaves: HysTableColumn<T>[];
+    colspan: number;
+    rowspan: number;
+    fixed?: "left" | "right";
+}
+export declare const tableToken: (key: HysTableKey) => string;
+export declare function tableValue(row: object, path: string | readonly (string | number)[]): unknown;
+export declare const tableBreakpoint: (width: number) => "sm" | "md" | "lg" | "xs" | "xl" | "xxl";
+export declare function tableColumns<T extends object>(input: readonly HysTableColumn<T>[], breakpoint: ReturnType<typeof tableBreakpoint>, showExpandColumn?: boolean): {
+    leaves: HysTableColumn<T>[];
+    headers: TableHeader<T>[][];
+};
+export declare function tableCompare<T extends object>(sorts: readonly HysTableSort[], columns: readonly HysTableColumn<T>[]): (a: T, b: T) => number;
+export declare function tableMatches<T extends object>(row: T, filters: HysTableFilters, columns: readonly HysTableColumn<T>[]): boolean;
+export declare function tableFilterPredicate<T extends object>(filters: HysTableFilters, columns: readonly HysTableColumn<T>[]): (row: T) => boolean;
+/** Iterative traversal also tolerates accidentally cyclic filter definitions. */
+export declare function tableFilterOptions(filters: readonly HysTableFilter[]): HysTableFilter[];
+export declare function tableSummary<T extends object>(rows: readonly T[], column: HysTableColumn<T>): number | "" | "—";

package/dist/types/composables/textInput.d.ts

@@ -0,0 +1,76 @@
+import type { Component, InputHTMLAttributes, TextareaHTMLAttributes } from "vue";
+export interface HysInputFormatInfo {
+    userTyping: boolean;
+    input: string;
+}
+export interface HysInputCountInfo {
+    value: string;
+    count: number;
+    maxLength?: number;
+}
+export type HysInputCountStrategy = boolean | ((value: string) => number);
+export interface HysInputProps {
+    modelValue?: string | number | null;
+    defaultValue?: string | number | null;
+    placeholder?: string;
+    type?: string;
+    label?: string;
+    disabled?: boolean;
+    readonly?: boolean;
+    ariaLabel?: string;
+    error?: string;
+    status?: "error" | "warning" | "success";
+    clearable?: boolean;
+    clearIcon?: Component;
+    prefixIcon?: Component;
+    suffixIcon?: Component;
+    showPassword?: boolean;
+    showPasswordOn?: "click" | "mousedown";
+    passwordVisible?: boolean;
+    defaultPasswordVisible?: boolean;
+    showCount?: boolean | {
+        formatter: (info: HysInputCountInfo) => string;
+    };
+    showWordLimit?: boolean;
+    countPosition?: "inside" | "outside";
+    wordLimitPosition?: "inside" | "outside";
+    countGraphemes?: HysInputCountStrategy;
+    maxlength?: number | string;
+    minlength?: number | string;
+    formatter?: (value: string, info: HysInputFormatInfo) => string;
+    parser?: (value: string) => string | number;
+    allowInput?: (value: string) => boolean;
+    autocomplete?: string;
+    name?: string;
+    size?: "sm" | "md" | "lg";
+    rows?: number;
+    autosize?: boolean | {
+        minRows?: number;
+        maxRows?: number;
+    };
+    resize?: "none" | "both" | "horizontal" | "vertical";
+    inputProps?: InputHTMLAttributes | TextareaHTMLAttributes;
+    autofocus?: boolean;
+    selectOnFocus?: boolean;
+    bordered?: boolean;
+    round?: boolean;
+}
+export interface HysInputInstance {
+    input: HTMLInputElement | HTMLTextAreaElement | undefined;
+    textarea: HTMLTextAreaElement | undefined;
+    isComposing: boolean;
+    focus: (options?: FocusOptions) => void;
+    blur: () => void;
+    select: () => void;
+    clear: () => void;
+    resize: () => Promise<void>;
+    setSelectionRange: (start: number, end: number, direction?: "forward" | "backward" | "none") => void;
+    scrollTo: (options: ScrollToOptions) => void;
+}
+export type HysTextareaProps = Omit<HysInputProps, 'type' | 'showPassword' | 'showPasswordOn' | 'passwordVisible' | 'defaultPasswordVisible'>;
+export interface HysTextareaInstance extends Omit<HysInputInstance, 'input'> {
+    input: HTMLTextAreaElement | undefined;
+}
+export declare function textCount(value: string, strategy?: HysInputCountStrategy): number;
+export declare function textLimit(value: string, max: number | undefined, strategy?: HysInputCountStrategy): string;
+export declare function textLengthLimit(value?: string | number): number | undefined;

package/dist/types/composables/toastEscape.d.ts

@@ -0,0 +1 @@
+export declare function registerToastEscape(close: () => void): () => void;

package/dist/types/composables/transfer.d.ts

@@ -0,0 +1,180 @@
+import type { CSSProperties, VNodeChild } from "vue";
+export type HysTransferKey = string | number;
+export type HysTransferSide = "left" | "right";
+export interface HysTransferOption<K extends HysTransferKey = HysTransferKey> {
+    value: K;
+    label: string;
+    disabled?: boolean;
+}
+export interface HysTransferFieldNames {
+    value?: string;
+    label?: string;
+    disabled?: string;
+}
+export interface HysTransferPagination {
+    pageSize?: number;
+    pageSizeOptions?: number[];
+    showSizeChanger?: boolean;
+    compact?: boolean;
+}
+export interface HysTransferLocale {
+    leftTitle: string;
+    rightTitle: string;
+    search: string;
+    emptyLeft: string;
+    emptyRight: string;
+    noMatch: string;
+    loading: string;
+    selectAll: string;
+    invert: string;
+    remove: string;
+    moveRight: string;
+    moveLeft: string;
+    dragRight: string;
+    dragLeft: string;
+    dragCount: string;
+    moved: string;
+    added: string;
+    removed: string;
+    firstPage: string;
+    previousPage: string;
+    nextPage: string;
+    lastPage: string;
+    perPage: string;
+}
+export interface HysTransferHeaderInfo {
+    side: HysTransferSide;
+    total: number;
+    filtered: number;
+    checked: number;
+}
+export interface HysTransferRecord<T extends object, K extends HysTransferKey> {
+    key: K;
+    label: string;
+    disabled: boolean;
+    option: T;
+}
+export interface HysTransferProps<T extends object, K extends HysTransferKey> {
+    options: readonly T[];
+    modelValue?: readonly K[];
+    defaultValue?: readonly K[];
+    fieldNames?: HysTransferFieldNames;
+    rowKey?: (option: T) => K;
+    disabled?: boolean;
+    loading?: boolean;
+    filterable?: boolean;
+    filterMethod?: (query: string, option: T, side: HysTransferSide) => boolean;
+    filterPlaceholder?: string | readonly [string, string];
+    searchValues?: Partial<Record<HysTransferSide, string>>;
+    titles?: readonly [string, string];
+    buttonTexts?: readonly [string, string];
+    showSelectAll?: boolean;
+    showInvert?: boolean;
+    checkedKeys?: readonly K[];
+    defaultCheckedKeys?: readonly K[];
+    leftDefaultChecked?: readonly K[];
+    rightDefaultChecked?: readonly K[];
+    targetOrder?: "original" | "push" | "unshift";
+    oneWay?: boolean;
+    draggable?: boolean;
+    dragChecked?: boolean;
+    animated?: boolean;
+    size?: "sm" | "md" | "lg";
+    listHeight?: number;
+    listStyle?: CSSProperties;
+    operationStyle?: CSSProperties;
+    status?: "error" | "warning";
+    pagination?: boolean | HysTransferPagination;
+    pages?: Partial<Record<HysTransferSide, number>>;
+    pageSizes?: Partial<Record<HysTransferSide, number>>;
+    virtual?: boolean;
+    itemHeight?: number;
+    overscan?: number;
+    locale?: Partial<HysTransferLocale>;
+    format?: (info: HysTransferHeaderInfo) => string;
+    renderContent?: (option: T, side: HysTransferSide) => VNodeChild;
+    ariaLabel?: string;
+    validateEvent?: boolean;
+}
+export interface HysTransferPanelContext<T extends object, K extends HysTransferKey> {
+    side: HysTransferSide;
+    items: T[];
+    filteredItems: T[];
+    checkedKeys: K[];
+    disabled: boolean;
+    query: string;
+    check: (key: K, checked?: boolean) => Promise<boolean>;
+    setCheckedKeys: (keys: readonly K[]) => Promise<boolean>;
+    checkAll: (checked?: boolean) => Promise<boolean>;
+    remove: (keys: readonly K[]) => Promise<boolean>;
+}
+export interface HysTransferInstance<T extends object = HysTransferOption, K extends HysTransferKey = HysTransferKey> {
+    readonly element: HTMLElement | undefined;
+    readonly targetKeys: K[];
+    readonly checkedKeys: K[];
+    getCheckedKeys: (side?: HysTransferSide) => K[];
+    getTargetItems: () => T[];
+    move: (direction: HysTransferSide, keys?: readonly K[]) => Promise<boolean>;
+    remove: (keys: readonly K[]) => Promise<boolean>;
+    setCheckedKeys: (keys: readonly K[]) => Promise<boolean>;
+    clearChecked: (side?: HysTransferSide) => Promise<boolean>;
+    checkAll: (side: HysTransferSide, checked?: boolean, scope?: "page" | "filtered" | "all") => Promise<boolean>;
+    invertSelection: (side: HysTransferSide, scope?: "page" | "filtered" | "all") => Promise<boolean>;
+    setSearch: (side: HysTransferSide, value: string) => void;
+    clearSearch: (side?: HysTransferSide) => void;
+    setPage: (side: HysTransferSide, page: number) => void;
+    setPageSize: (side: HysTransferSide, size: number) => void;
+    scrollTo: (side: HysTransferSide, options: {
+        key?: K;
+        top?: number;
+        behavior?: ScrollBehavior;
+    }) => Promise<void>;
+    focus: (side?: HysTransferSide) => void;
+}
+export declare const transferToken: (key: HysTransferKey) => string;
+export interface HysTransferSlots<T extends object, K extends HysTransferKey> {
+    default?: (props: {
+        option: T;
+        label: string;
+        side: HysTransferSide;
+        checked: boolean;
+        disabled: boolean;
+    }) => any;
+    option?: (props: {
+        option: T;
+        label: string;
+        side: HysTransferSide;
+        checked: boolean;
+        disabled: boolean;
+    }) => any;
+    panel?: (props: HysTransferPanelContext<T, K>) => any;
+    header?: (props: {
+        info: HysTransferHeaderInfo;
+        side: HysTransferSide;
+        allChecked: boolean;
+        indeterminate: boolean;
+        checkAll: (checked?: boolean) => Promise<boolean>;
+    }) => any;
+    footer?: (props: HysTransferPanelContext<T, K>) => any;
+    "left-footer"?: (props: HysTransferPanelContext<T, K>) => any;
+    "right-footer"?: (props: HysTransferPanelContext<T, K>) => any;
+    empty?: (props: HysTransferPanelContext<T, K>) => any;
+    "left-empty"?: (props: HysTransferPanelContext<T, K>) => any;
+    "right-empty"?: (props: HysTransferPanelContext<T, K>) => any;
+    loading?: (props: {
+        side: HysTransferSide;
+    }) => any;
+    operations?: (props: {
+        move: (side: HysTransferSide, keys?: readonly K[]) => Promise<boolean>;
+        disabled: boolean;
+        leftChecked: K[];
+        rightChecked: K[];
+    }) => any;
+}
+export declare function transferValue(option: object, path: string): unknown;
+export declare function transferRows<T extends object, K extends HysTransferKey>(props: Pick<HysTransferProps<T, K>, "options" | "fieldNames" | "rowKey">): {
+    rows: HysTransferRecord<T, K>[];
+    map: Map<K, HysTransferRecord<T, K>>;
+};
+export declare const transferWords: (locale?: Partial<HysTransferLocale>) => HysTransferLocale;
+export declare const transferLabel: (text: string, values: Record<string, string | number>) => string;