nfx-ui 0.1.0

package/dist/components.d.ts

@@ -0,0 +1,411 @@
+import { ButtonHTMLAttributes } from 'react';
+import { ForwardRefExoticComponent } from 'react';
+import { InputHTMLAttributes } from 'react';
+import { JSX } from 'react/jsx-runtime';
+import * as LucideIcons from '@/icons/lucide';
+import { LucideProps } from 'lucide-react';
+import { MemoExoticComponent } from 'react';
+import { NamedExoticComponent } from 'react';
+import { QueryErrorResetBoundaryProps } from '@tanstack/react-query';
+import { ReactNode } from 'react';
+import { RefAttributes } from 'react';
+import { SuspenseProps as SuspenseProps_2 } from 'react';
+import { TextareaHTMLAttributes } from 'react';
+import { VirtualizerOptions } from '@tanstack/react-virtual';
+
+export declare const Button: ForwardRefExoticComponent<ButtonProps & RefAttributes<HTMLButtonElement>>;
+
+export declare interface ButtonProps extends Omit<ButtonHTMLAttributes<HTMLButtonElement>, "size"> {
+    variant?: "primary" | "secondary" | "outline" | "ghost" | "danger";
+    size?: "small" | "medium" | "large";
+    fullWidth?: boolean;
+    leftIcon?: ReactNode;
+    rightIcon?: ReactNode;
+    /** 上方图标。Top icon. */
+    topIcon?: ReactNode;
+    /** 下方图标。Bottom icon. */
+    bottomIcon?: ReactNode;
+    /** 仅图标无文案。Icon only, no text. */
+    iconOnly?: boolean;
+    /** 图标尺寸覆盖。Override icon size. */
+    iconSize?: number;
+    loading?: boolean;
+    children?: ReactNode;
+}
+
+export declare const Dropdown: NamedExoticComponent<DropdownProps>;
+
+export declare interface DropdownOption {
+    /** 选项值。Option value. */
+    value: string;
+    /** 选项展示文案。Option label. */
+    label: string;
+}
+
+export declare interface DropdownProps {
+    /** 选项列表。Options list. */
+    options: DropdownOption[];
+    /** 当前选中值。Current value. */
+    value: string;
+    /** 选中回调。Change callback. */
+    onChange: (value: string) => void;
+    /** 占位符。Placeholder. */
+    placeholder?: string;
+    /** 是否禁用。Disabled. */
+    disabled?: boolean;
+    /** 是否错误态。Error state. */
+    error?: boolean;
+    /** 容器 className。Container className. */
+    className?: string;
+}
+
+export declare const Icon: MemoExoticComponent<({ name, ...props }: IconProps) => JSX.Element | null>;
+
+export declare type IconName = keyof Omit<typeof LucideIcons, "LucideIcon">;
+
+export declare interface IconProps extends LucideProps {
+    /** 图标名（lucide 注册名）。Icon name (lucide registered name). */
+    name: IconName;
+}
+
+export declare const Input: ForwardRefExoticComponent<InputProps & RefAttributes<HTMLInputElement>>;
+
+export declare interface InputProps extends Omit<InputHTMLAttributes<HTMLInputElement>, "size"> {
+    /** 标签文案。Label text. */
+    label?: string;
+    /** 错误信息。Error message. */
+    error?: string;
+    /** 辅助说明。Helper text. */
+    helperText?: string;
+    /** 左侧图标。Left icon. */
+    leftIcon?: ReactNode;
+    /** 右侧图标。Right icon. */
+    rightIcon?: ReactNode;
+    /** 为 true 时 rightIcon 可点击（如密码切换、清除按钮）。When true, right icon is clickable (e.g. password toggle, clear). */
+    rightIconInteractive?: boolean;
+    /** 尺寸。Size. */
+    size?: "small" | "medium" | "large";
+    /** 视觉变体。Variant. */
+    variant?: "default" | "filled";
+    /** 是否占满宽度。Full width. */
+    fullWidth?: boolean;
+}
+
+export declare const KeyValueEditor: MemoExoticComponent<({ label, pairs, onChange, valueType, keyPlaceholder, valuePlaceholder, valueArrayPlaceholder, removeAriaLabel, addLabel, error, }: KeyValueEditorProps) => JSX.Element>;
+
+export declare interface KeyValueEditorProps {
+    /** 表单项标签。Field label. */
+    label: string;
+    /** 键值对列表。Key-value pairs. */
+    pairs: KeyValuePair[];
+    /** 列表变化回调。Change callback. */
+    onChange: (pairs: KeyValuePair[]) => void;
+    /** 值类型：string 或 array。Value type: string or array. */
+    valueType?: "string" | "array";
+    /** 键占位符。Key placeholder. */
+    keyPlaceholder?: string;
+    /** 值占位符（string 模式）。Value placeholder (string mode). */
+    valuePlaceholder?: string;
+    /** 值占位符（array 模式）。Value placeholder (array mode). */
+    valueArrayPlaceholder?: string;
+    /** 删除按钮 aria-label。Remove button aria-label. */
+    removeAriaLabel?: string;
+    /** 新增按钮文案。Add button label. */
+    addLabel?: string;
+    /** 错误信息。Error message. */
+    error?: string;
+}
+
+export declare interface KeyValuePair {
+    /** 键。Key. */
+    key: string;
+    /** 值（字符串或字符串数组）。Value (string or string[]). */
+    value: string | string[];
+}
+
+/**
+ * 布局模式枚举与常量。Layout mode enum and constants.
+ */
+declare enum LayoutModeEnum {
+    SHOW = "show",
+    HIDE = "hide"
+}
+
+export declare const LayoutSwitcher: MemoExoticComponent<({ status, getLayoutDisplayName, handleChangeLayoutMode }: LayoutSwitcherProps) => JSX.Element>;
+
+/** 布局切换器 props。LayoutSwitcher props. */
+export declare interface LayoutSwitcherProps {
+    /** 样式状态。Visual status. */
+    status?: "primary" | "default";
+    /** 显示模式标签（未传 getLayoutDisplayName 且无内置翻译时使用）。Show mode label. */
+    showLabel?: string;
+    /** 隐藏模式标签（未传 getLayoutDisplayName 且无内置翻译时使用）。Hide mode label. */
+    hideLabel?: string;
+    /** 根据布局模式返回展示名；未传则使用 showLabel / hideLabel。Display name for layout mode; default uses showLabel/hideLabel. */
+    getLayoutDisplayName?: (mode: LayoutModeEnum) => string;
+    /** 处理布局模式改变。Handle layout mode change. */
+    handleChangeLayoutMode?: (mode: LayoutModeEnum) => void;
+}
+
+export declare const SearchInput: MemoExoticComponent<({ value, onChange, placeholder, clearButtonAriaLabel }: SearchInputProps) => JSX.Element>;
+
+export declare interface SearchInputProps {
+    /** 当前输入值。Current value. */
+    value: string;
+    /** 值变化回调。Change callback. */
+    onChange: (value: string) => void;
+    /** 占位符，由调用方传入。Placeholder; pass from caller. */
+    placeholder?: string;
+    /** 清除按钮 aria-label；由调用方传入（可来自 i18n）。Clear button aria-label; pass from caller. */
+    clearButtonAriaLabel?: string;
+}
+
+export declare const ShowFilter: MemoExoticComponent<({ value, onChange, filterEnabled, filterDisabled, enableFilterAriaLabel, disableFilterAriaLabel, all, show, hide, }: ShowFilterProps) => JSX.Element>;
+
+export declare interface ShowFilterProps {
+    /** 当前值。Current value. */
+    value: ShowFilterValue;
+    /** 值变化回调。Change callback. */
+    onChange: (value: ShowFilterValue) => void;
+    /** 筛选开启时的按钮文案。Label when filter enabled. */
+    filterEnabled?: string;
+    /** 筛选关闭时的按钮文案。Label when filter disabled. */
+    filterDisabled?: string;
+    /** 开启筛选按钮的 aria-label。Aria-label for enable filter button. */
+    enableFilterAriaLabel?: string;
+    /** 关闭筛选按钮的 aria-label。Aria-label for disable filter button. */
+    disableFilterAriaLabel?: string;
+    /** 「全部」选项文案。Label for "all" option. */
+    all?: string;
+    /** 「显示」选项文案。Label for "show" option. */
+    show?: string;
+    /** 「隐藏」选项文案。Label for "hide" option. */
+    hide?: string;
+}
+
+export declare interface ShowFilterValue {
+    /** 筛选是否启用。Whether filter is enabled. */
+    enabled: boolean;
+    /** 显示/隐藏：null=全部，true=显示，false=隐藏。Show/hide: null=all, true=show, false=hide. */
+    value: boolean | null;
+}
+
+export declare const SlideDownSwitcher: typeof SlideDownSwitcherInner & {
+    displayName?: string;
+};
+
+declare const SlideDownSwitcherInner: <T extends string>({ value, options, getDisplayName, onChange, status }: SlideDownSwitcherProps<T>) => JSX.Element;
+
+export declare interface SlideDownSwitcherProps<T extends string> {
+    /** 当前选中的值（enum 或 string） */
+    value: T;
+    /** 可选项列表（如 Object.values(SomeEnum)） */
+    options: readonly T[];
+    /** 选项展示文案 */
+    getDisplayName: (value: T) => string;
+    /** 选中后回调 */
+    onChange: (value: T) => void;
+    status?: "primary" | "default";
+}
+
+export declare const Slider: NamedExoticComponent<SliderProps & RefAttributes<HTMLDivElement>>;
+
+export declare interface SliderProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "onChange"> {
+    /** 当前值。Current value. */
+    value: number;
+    /** 值变化回调。Change callback. */
+    onChange: (value: number) => void;
+    /** 最小值。Minimum. */
+    min?: number;
+    /** 最大值。Maximum. */
+    max?: number;
+    /** 步长。Step. */
+    step?: number;
+    /** 是否显示数值。Show value. */
+    showValue?: boolean;
+    /** 是否占满宽度。Full width. */
+    fullWidth?: boolean;
+    /** 标签文案。Label text. */
+    label?: string;
+    /** 错误信息。Error message. */
+    error?: string;
+    /** 辅助说明。Helper text. */
+    helperText?: string;
+    /** 是否必填。Required. */
+    required?: boolean;
+}
+
+export declare const Suspense: MemoExoticComponent<({ fallback, test, loadingType, loadingShape, loadingClassName, loadingText, loadingSize, loadingContainerClassName, loadingTextClassName, children, errorFallback, errorTitle, errorDescription, retryText, errorDetailsText, clearLocalDataText, onClearLocalData, errorContainerClassName, errorDetailsClassName, showErrorDetails, ...restProps }: SuspenseProps) => JSX.Element>;
+
+export declare interface SuspenseProps extends Omit<SuspenseProps_2, "fallback">, Omit<QueryErrorResetBoundaryProps, "children"> {
+    /** 自定义 fallback。Custom fallback. */
+    fallback?: ReactNode;
+    /** 测试用：始终挂起。Test: always suspend. */
+    test?: boolean;
+    /** 加载动画类型。Loading type. */
+    loadingType?: "ecg" | "truck" | "bounce";
+    /** 加载图形形状。Loading shape. */
+    loadingShape?: "square" | "circle";
+    /** 加载中文案，由调用方传入。Loading text; pass from caller (e.g. i18n). */
+    loadingText?: string;
+    /** 加载图尺寸。Loading size. */
+    loadingSize?: "small" | "medium" | "large";
+    /** 加载容器 className。Loading container className. */
+    loadingContainerClassName?: string;
+    /** 加载文案 className。Loading text className. */
+    loadingTextClassName?: string;
+    /** 加载图 className。Loading className. */
+    loadingClassName?: string;
+    /** 自定义错误 UI。Custom error fallback. */
+    errorFallback?: (args: {
+        error: Error | null;
+        retry: () => void;
+    }) => ReactNode;
+    /** 错误标题，由调用方传入。Error title; pass from caller. */
+    errorTitle?: string;
+    /** 错误描述，由调用方传入。Error description; pass from caller. */
+    errorDescription?: string;
+    /** 重试按钮文案，由调用方传入。Retry text; pass from caller. */
+    retryText?: string;
+    /** 错误详情折叠文案。Error details text. */
+    errorDetailsText?: string;
+    /** 清除本地数据按钮文案。Clear local data text. */
+    clearLocalDataText?: string;
+    /** 点击「清除本地数据」后执行（如跳转登录页），由调用方传入。Called after clear local data (e.g. navigate to login); pass from caller. */
+    onClearLocalData?: () => void;
+    /** 错误容器 className。Error container className. */
+    errorContainerClassName?: string;
+    /** 错误详情 className。Error details className. */
+    errorDetailsClassName?: string;
+    /** 是否展示错误详情。Show error details. */
+    showErrorDetails?: boolean;
+}
+
+export declare const Textarea: ForwardRefExoticComponent<TextareaProps & RefAttributes<HTMLTextAreaElement>>;
+
+export declare interface TextareaProps extends Omit<TextareaHTMLAttributes<HTMLTextAreaElement>, "size"> {
+    /** 标签文案。Label text. */
+    label?: string;
+    /** 错误信息。Error message. */
+    error?: string;
+    /** 辅助说明。Helper text. */
+    helperText?: string;
+    /** 左侧图标。Left icon. */
+    leftIcon?: ReactNode;
+    /** 右侧图标。Right icon. */
+    rightIcon?: ReactNode;
+    /** 尺寸。Size. */
+    size?: "small" | "medium" | "large";
+    /** 视觉变体。Variant. */
+    variant?: "default" | "filled";
+    /** 是否占满宽度。Full width. */
+    fullWidth?: boolean;
+}
+
+/** 颜色主题枚举 */
+declare enum ThemeEnum {
+    DEFAULT = "default",
+    LIGHT = "light",
+    CORPORATE = "corporate",
+    FOREST = "forest",
+    DARK = "dark",
+    COSMIC = "cosmic",
+    COFFEE = "coffee",
+    WINE = "wine"
+}
+
+export declare const ThemeSwitcher: MemoExoticComponent<({ status, getThemeDisplayName, handleChangeTheme }: ThemeSwitcherProps) => JSX.Element>;
+
+/** 主题切换器 props。ThemeSwitcher props. */
+export declare interface ThemeSwitcherProps {
+    /** 样式状态。Visual status. */
+    status?: "primary" | "default";
+    /** 根据 theme 返回显示名称；未传则使用 theme 原值。Display name for theme; default is theme value. */
+    getThemeDisplayName?: (theme: ThemeEnum) => string;
+    /** 处理主题改变。Handle theme change. */
+    handleChangeTheme?: (theme: ThemeEnum) => void;
+}
+
+export declare const VirtualList: typeof VirtualListComponent;
+
+declare function VirtualListComponent<T>({ data, hasNextPage, isFetchingNextPage, fetchNextPage, renderItem, estimateSize, overscan, height, getItemKey, emptyState, loadingIndicator, endOfListIndicator, emptyText, loadingMoreText, endOfListText, flexClass, outerClass, innerClass, ...virtualizerOptions }: VirtualListProps<T>): JSX.Element;
+
+export declare interface VirtualListProps<T> extends Partial<Omit<VirtualizerOptions<HTMLDivElement, Element>, "count" | "getScrollElement" | "observeElementRect" | "observeElementOffset" | "scrollToFn" | "getItemKey" | "estimateSize">> {
+    /** 数据列表。Data array. */
+    data: T[];
+    /** 是否有下一页。Has next page. */
+    hasNextPage?: boolean;
+    /** 是否正在拉取下一页。Is fetching next page. */
+    isFetchingNextPage?: boolean;
+    /** 拉取下一页。Fetch next page. */
+    fetchNextPage?: () => void;
+    /** 单项渲染。Render item. */
+    renderItem: (item: T, index: number) => ReactNode;
+    /** 单项高度估计。Estimate item size. */
+    estimateSize?: number | ((index: number) => number);
+    /** 列表高度。List height. */
+    height?: string | number;
+    /** 单项 key。Get item key. */
+    getItemKey: (item: T, index: number) => string | number;
+    /** 空状态自定义节点。Empty state node. */
+    emptyState?: ReactNode;
+    /** 加载更多指示器。Loading indicator node. */
+    loadingIndicator?: ReactNode;
+    /** 列表底指示器。End of list indicator node. */
+    endOfListIndicator?: ReactNode;
+    /** 当未提供 emptyState 时使用的文案，由调用方传入。Text when no data; used when emptyState not provided. */
+    emptyText?: string;
+    /** 当未提供 loadingIndicator 时使用的文案。Text when loading more. */
+    loadingMoreText?: string;
+    /** 当未提供 endOfListIndicator 时使用的文案。Text at end of list. */
+    endOfListText?: string;
+    /** 列表项容器 className。Flex container class. */
+    flexClass?: string;
+    /** 外层容器 className。Outer class. */
+    outerClass?: string;
+    /** 内层容器 className。Inner class. */
+    innerClass?: string;
+}
+
+export declare const VirtualWindowList: typeof VirtualWindowListComponent;
+
+declare function VirtualWindowListComponent<T>({ data, hasNextPage, isFetchingNextPage, fetchNextPage, renderItem, estimateSize, overscan, height, getItemKey, emptyState, loadingIndicator, endOfListIndicator, emptyText, loadingMoreText, endOfListText, flexClass, outerClass, innerClass, ...virtualizerOptions }: VirtualWindowListProps<T>): JSX.Element;
+
+export declare interface VirtualWindowListProps<T> extends Partial<Omit<VirtualizerOptions<Window, Element>, "count" | "getScrollElement" | "observeElementRect" | "observeElementOffset" | "scrollToFn" | "estimateSize" | "getItemKey">> {
+    /** 数据列表。Data array. */
+    data: T[];
+    /** 是否有下一页。Has next page. */
+    hasNextPage?: boolean;
+    /** 是否正在拉取下一页。Is fetching next page. */
+    isFetchingNextPage?: boolean;
+    /** 拉取下一页。Fetch next page. */
+    fetchNextPage?: () => void;
+    /** 单项渲染。Render item. */
+    renderItem: (item: T, index: number) => ReactNode;
+    /** 单项高度估计。Estimate item size. */
+    estimateSize?: number | ((index: number) => number);
+    /** 列表高度。List height. */
+    height?: string | number;
+    /** 单项 key。Get item key. */
+    getItemKey: (item: T, index: number) => string | number;
+    /** 空状态自定义节点。Empty state node. */
+    emptyState?: ReactNode;
+    /** 加载更多指示器。Loading indicator node. */
+    loadingIndicator?: ReactNode;
+    /** 列表底指示器。End of list indicator node. */
+    endOfListIndicator?: ReactNode;
+    /** 空状态文案（未提供 emptyState 时）。Empty text. */
+    emptyText?: string;
+    /** 加载更多文案。Loading more text. */
+    loadingMoreText?: string;
+    /** 列表底文案。End of list text. */
+    endOfListText?: string;
+    /** 列表项容器 className。Flex container class. */
+    flexClass?: string;
+    /** 外层容器 className。Outer class. */
+    outerClass?: string;
+    /** 内层容器 className。Inner class. */
+    innerClass?: string;
+}
+
+export { }