@ldkj/web-ui 0.10.0 → 0.11.1

package/components/data-display/table/Table.d.ts

@@ -0,0 +1,2 @@
+import type { TableComponent } from "./types";
+export declare const Table: TableComponent;

package/components/data-display/table/constants.d.ts

@@ -0,0 +1,3 @@
+import type { TableSize, TableVariant } from "./types";
+export declare const sizeCellClass: Record<TableSize, string>;
+export declare const variantRootClass: Record<TableVariant, string>;

package/components/data-display/table/index.d.ts

@@ -0,0 +1,2 @@
+export * from "./Table";
+export * from "./types";

package/components/data-display/table/parts.d.ts

@@ -0,0 +1,8 @@
+import { type BoxProps } from "@/components/layout/box";
+import type { TableColumnProps } from "./types";
+export declare function TableColumnDeclaration<RecordType extends object = Record<string, unknown>>(_: TableColumnProps<RecordType>): null;
+export declare function TableHead(props: BoxProps<"thead">): import("react/jsx-runtime").JSX.Element;
+export declare function TableBody(props: BoxProps<"tbody">): import("react/jsx-runtime").JSX.Element;
+export declare function TableRow(props: BoxProps<"tr">): import("react/jsx-runtime").JSX.Element;
+export declare function TableHeaderCell(props: BoxProps<"th">): import("react/jsx-runtime").JSX.Element;
+export declare function TableCell(props: BoxProps<"td">): import("react/jsx-runtime").JSX.Element;

package/components/data-display/table/sections.d.ts

@@ -0,0 +1,43 @@
+import * as React from "react";
+import type { TableColumn, TableProps, TableSize } from "./types";
+export type TableRowMeta<RecordType extends object> = {
+    record: RecordType;
+    index: number;
+    absoluteIndex: number;
+    key: React.Key;
+    disabled: boolean;
+};
+export type TableHeaderRowsProps<RecordType extends object = Record<string, unknown>> = {
+    selectionEnabled: boolean;
+    size: TableSize;
+    allChecked: boolean;
+    partiallyChecked: boolean;
+    selectableKeysLength: number;
+    onToggleCurrentPage: (checked: boolean) => void;
+    indexColumn: TableProps<RecordType>["indexColumn"];
+    visibleColumns: TableColumn<RecordType>[];
+};
+export declare function TableHeaderRows<RecordType extends object = Record<string, unknown>>(props: TableHeaderRowsProps<RecordType>): import("react/jsx-runtime").JSX.Element;
+export type TableBodyRowsProps<RecordType extends object = Record<string, unknown>> = {
+    bodyProps?: TableProps<RecordType>["bodyProps"];
+    currentRowMeta: TableRowMeta<RecordType>[];
+    selectedSet: Set<React.Key>;
+    rowProps?: TableProps<RecordType>["rowProps"];
+    size: TableSize;
+    striped: boolean;
+    hoverable: boolean;
+    selectionEnabled: boolean;
+    onToggleRow: (key: React.Key, checked: boolean) => void;
+    indexColumn: TableProps<RecordType>["indexColumn"];
+    visibleColumns: TableColumn<RecordType>[];
+    empty: React.ReactNode;
+    tableColumnCount: number;
+};
+export declare function TableBodyRows<RecordType extends object = Record<string, unknown>>(props: TableBodyRowsProps<RecordType>): import("react/jsx-runtime").JSX.Element;
+export type TablePaginationFooterProps = {
+    pageCount: number;
+    currentPage: number;
+    justifyClassName: string;
+    onPageChange: (event: React.MouseEvent<HTMLAnchorElement>, page: number) => void;
+};
+export declare function TablePaginationFooter(props: TablePaginationFooterProps): import("react/jsx-runtime").JSX.Element | null;

package/components/data-display/table/types.d.ts

@@ -0,0 +1,73 @@
+import * as React from "react";
+import type { BoxProps } from "@/components/layout/box";
+import type { SxProps } from "@/styling";
+import type { TableBody, TableCell, TableColumnDeclaration, TableHead, TableHeaderCell, TableRow } from "./parts";
+export type TableAlign = "left" | "center" | "right";
+export type TableSize = "sm" | "md" | "lg";
+export type TableVariant = "outlined" | "filled" | "ghost";
+export type TableColumn<RecordType extends object = Record<string, unknown>> = {
+    key?: React.Key;
+    dataIndex?: keyof RecordType | (string & {});
+    title?: React.ReactNode;
+    hidden?: boolean;
+    width?: number | string;
+    align?: TableAlign;
+    headerAlign?: TableAlign;
+    className?: string;
+    headerClassName?: string;
+    sx?: SxProps;
+    headerSx?: SxProps;
+    render?: (value: unknown, record: RecordType, index: number) => React.ReactNode;
+};
+export type TableColumnProps<RecordType extends object = Record<string, unknown>> = TableColumn<RecordType>;
+export type TableRowSelection<RecordType extends object = Record<string, unknown>> = {
+    selectedRowKeys?: React.Key[];
+    defaultSelectedRowKeys?: React.Key[];
+    onChange?: (selectedRowKeys: React.Key[], selectedRows: RecordType[]) => void;
+    getCheckboxProps?: (record: RecordType, index: number) => {
+        disabled?: boolean;
+    };
+};
+export type TablePaginationConfig = {
+    page?: number;
+    defaultPage?: number;
+    pageSize?: number;
+    total?: number;
+    onPageChange?: (page: number, pageSize: number) => void;
+    position?: "left" | "center" | "right";
+};
+export type TableRowProps<RecordType extends object> = BoxProps<"tr"> | ((record: RecordType, index: number) => BoxProps<"tr">);
+export type TableProps<RecordType extends object = Record<string, unknown>> = Omit<BoxProps<"div">, "children"> & {
+    columns?: TableColumn<RecordType>[];
+    dataSource?: RecordType[];
+    rowKey?: keyof RecordType | (string & {}) | ((record: RecordType, index: number) => React.Key);
+    size?: TableSize;
+    variant?: TableVariant;
+    striped?: boolean;
+    bordered?: boolean;
+    hoverable?: boolean;
+    stickyHeader?: boolean;
+    loading?: boolean;
+    empty?: React.ReactNode;
+    caption?: React.ReactNode;
+    indexColumn?: boolean | {
+        title?: React.ReactNode;
+        width?: number | string;
+    };
+    rowSelection?: TableRowSelection<RecordType>;
+    pagination?: false | TablePaginationConfig;
+    tableProps?: BoxProps<"table">;
+    headProps?: BoxProps<"thead">;
+    bodyProps?: BoxProps<"tbody">;
+    rowProps?: TableRowProps<RecordType>;
+    children?: React.ReactNode;
+};
+export type TableCompound = {
+    Column: typeof TableColumnDeclaration;
+    Head: typeof TableHead;
+    Body: typeof TableBody;
+    Row: typeof TableRow;
+    Cell: typeof TableCell;
+    HeaderCell: typeof TableHeaderCell;
+};
+export type TableComponent = (<RecordType extends object = Record<string, unknown>>(props: TableProps<RecordType>) => React.ReactElement) & TableCompound;

package/components/data-display/table/utils.d.ts

@@ -0,0 +1,19 @@
+import * as React from "react";
+import type { TableColumn, TableProps } from "./types";
+export declare function normalizeCssSize(value: number | string | undefined): string | undefined;
+export declare function getValue<RecordType extends object>(record: RecordType, dataIndex: TableColumn<RecordType>["dataIndex"]): unknown;
+export declare function getColumnKey<RecordType extends object>(column: TableColumn<RecordType>, index: number): React.Key;
+export declare function getRowKey<RecordType extends object>(record: RecordType, index: number, rowKey: TableProps<RecordType>["rowKey"]): React.Key;
+export declare function getAutoColumns<RecordType extends object>(dataSource: RecordType[]): TableColumn<RecordType>[];
+export declare function resolveChildrenColumns<RecordType extends object>(children: React.ReactNode): {
+    childColumns: TableColumn<RecordType>[];
+    restChildren: React.ReactNode[];
+};
+export declare function useControllableKeys(props: {
+    selectedRowKeys?: React.Key[];
+    defaultSelectedRowKeys?: React.Key[];
+}): {
+    selectedKeys: React.Key[];
+    setSelectedKeys: React.Dispatch<React.SetStateAction<React.Key[]>>;
+    isControlled: boolean;
+};

package/components/form/checkbox/Checkbox.d.ts

@@ -0,0 +1,15 @@
+import * as React from "react";
+import * as CheckboxPrimitive from "@radix-ui/react-checkbox";
+import { type SxProps } from "@/styling";
+export type CheckboxProps = React.ComponentPropsWithoutRef<typeof CheckboxPrimitive.Root> & {
+    class?: string;
+    sx?: SxProps;
+};
+/**
+ * 基于 Radix Checkbox 的复选框组件，支持本库 `sx` 样式系统。
+ */
+declare const Checkbox: React.ForwardRefExoticComponent<Omit<CheckboxPrimitive.CheckboxProps & React.RefAttributes<HTMLButtonElement>, "ref"> & {
+    class?: string;
+    sx?: SxProps;
+} & React.RefAttributes<HTMLButtonElement>>;
+export { Checkbox };

package/components/form/checkbox/index.d.ts

@@ -0,0 +1 @@
+export * from "./Checkbox";

package/components/navigation/pagination/index.d.ts

@@ -0,0 +1 @@
+export * from "./pagination";

package/components/navigation/pagination/pagination.d.ts

@@ -0,0 +1,72 @@
+import * as React from "react";
+import { type ButtonProps } from "@/components/interact/button";
+import { type SxProps } from "@/styling";
+type StyledProps = {
+    className?: string;
+    class?: string;
+    style?: React.CSSProperties;
+    sx?: SxProps;
+};
+export type PaginationVariant = "outline" | "filled";
+type PaginationGeneratedItem = {
+    type: "page";
+    page: number;
+    selected: boolean;
+    disabled: boolean;
+} | {
+    type: "previous" | "next";
+    page: number;
+    selected: false;
+    disabled: boolean;
+} | {
+    type: "ellipsis";
+    page: null;
+    selected: false;
+    disabled: true;
+};
+export type PaginationRenderItem = PaginationGeneratedItem & {
+    href?: string;
+    onClick?: React.MouseEventHandler<HTMLAnchorElement>;
+};
+export type PaginationProps = React.ComponentPropsWithoutRef<"nav"> & StyledProps & {
+    count?: number;
+    page?: number;
+    defaultPage?: number;
+    onPageChange?: (event: React.MouseEvent<HTMLAnchorElement>, page: number) => void;
+    siblingCount?: number;
+    boundaryCount?: number;
+    variant?: PaginationVariant;
+    showPreviousNext?: boolean;
+    disabled?: boolean;
+    getItemHref?: (page: number, type: PaginationGeneratedItem["type"]) => string;
+    renderItem?: (item: PaginationRenderItem) => React.ReactNode;
+    contentProps?: React.ComponentProps<typeof PaginationContent>;
+};
+declare const Pagination: {
+    ({ count, page: pageProp, defaultPage, onPageChange, siblingCount, boundaryCount, variant, showPreviousNext, disabled, getItemHref, renderItem, contentProps, className, class: legacyClass, sx, style, children, ...props }: PaginationProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+declare const PaginationContent: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLUListElement>, HTMLUListElement>, "ref"> & StyledProps & React.RefAttributes<HTMLUListElement>>;
+declare const PaginationItem: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.LiHTMLAttributes<HTMLLIElement>, HTMLLIElement>, "ref"> & StyledProps & React.RefAttributes<HTMLLIElement>>;
+type PaginationLinkProps = {
+    isActive?: boolean;
+    disabled?: boolean;
+    variant?: PaginationVariant;
+} & Omit<ButtonProps<"a">, "component" | "variant" | "disabled">;
+declare const PaginationLink: {
+    ({ className, class: legacyClass, isActive, disabled, variant, size, tabIndex, ...props }: PaginationLinkProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+declare const PaginationPrevious: {
+    ({ className, children, ...props }: React.ComponentProps<typeof PaginationLink>): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+declare const PaginationNext: {
+    ({ className, children, ...props }: React.ComponentProps<typeof PaginationLink>): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+declare const PaginationEllipsis: {
+    ({ className, class: legacyClass, sx, style, ...props }: React.ComponentPropsWithoutRef<"span"> & StyledProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export { Pagination, PaginationContent, PaginationEllipsis, PaginationItem, PaginationLink, PaginationNext, PaginationPrevious, };