fat-design 0.0.1-beta.20250809023342 → 0.0.1-beta.20250809091225

package/types/split-button/index.d.ts

@@ -0,0 +1,134 @@
+/// <reference types="react" />
+
+import * as React from 'react';
+import { Item, Group, Divider, MenuProps } from '../menu';
+import CommonProps from '../util';
+import { ButtonProps } from '../button';
+import { PopupProps } from '../overlay';
+
+interface HTMLAttributesWeak extends ButtonProps {
+    onSelect?: any;
+}
+
+export interface SplitButtonProps extends HTMLAttributesWeak, CommonProps {
+    /**
+     * 按钮的类型
+     */
+    type?: 'normal' | 'primary' | 'secondary';
+
+    /**
+     * 按钮组的尺寸
+     */
+    size?: 'small' | 'medium' | 'large';
+
+    /**
+     * 主按钮的文案
+     */
+    label?: React.ReactNode;
+
+    /**
+     * 设置标签类型
+     */
+    component?: 'button' | 'a';
+
+    /**
+     * 是否为幽灵按钮
+     */
+    ghost?: 'light' | 'dark' | false | true;
+
+    /**
+     * 默认激活的菜单项（用法同 Menu 非受控）
+     */
+    defaultSelectedKeys?: string[];
+
+    /**
+     * 激活的菜单项（用法同 Menu 受控）
+     */
+    selectedKeys?: string[];
+
+    /**
+     * 菜单的选择模式
+     */
+    selectMode?: 'single' | 'multiple';
+
+    /**
+     * 触发按钮的属性（支持 Button 的所有属性透传）
+     */
+    triggerProps?: ButtonProps;
+
+    /**
+     * 弹层菜单的宽度是否与按钮组一致
+     */
+    autoWidth?: boolean;
+
+    /**
+     * 弹层是否显示
+     */
+    visible?: boolean;
+
+    /**
+     * 弹层默认是否显示
+     */
+    defaultVisible?: boolean;
+
+    /**
+     * 弹层显示状态变化时的回调函数
+     */
+    onVisibleChange?: (visible: boolean, reason: string) => void;
+
+    /**
+     * 弹层的触发方式
+     */
+    popupTriggerType?: 'click' | 'hover';
+
+    /**
+     * 弹层对齐方式, 详情见Overlay align
+     */
+    popupAlign?: string;
+
+    /**
+     * 弹层自定义样式
+     */
+    popupStyle?: React.CSSProperties;
+
+    /**
+     * 弹层自定义样式类
+     */
+    popupClassName?: string;
+
+    /**
+     * 透传给弹层的属性
+     */
+    popupProps?: PopupProps;
+
+    /**
+     * 点击菜单项后的回调，同 Menu
+     */
+    onItemClick?: (key: string, item: any, event: React.MouseEvent<HTMLElement>) => void;
+
+    /**
+     * 选择菜单后的回调，同 Menu
+     */
+    onSelect?: (selectedKeys: Array<any>, item: any, extra: any) => void;
+
+    /**
+     * 透传给 Menu 的属性
+     */
+    menuProps?: MenuProps;
+
+    /**
+     * 透传给 左侧按钮 的属性
+     */
+    leftButtonProps?: ButtonProps;
+
+    /**
+     * 是否跟随滚动
+     */
+    followTrigger?: boolean;
+}
+
+export default class SplitButton extends React.Component<SplitButtonProps, any> {
+    static Item: typeof Item;
+    static Group: typeof Group;
+    static Divider: typeof Divider;
+}

package/types/step/index.d.ts

@@ -0,0 +1,108 @@
+/// <reference types="react" />
+
+import * as React from 'react';
+import CommonProps from '../util';
+
+interface HTMLAttributesWeak extends React.HTMLAttributes<HTMLElement> {
+    title?: any;
+    onClick?: any;
+}
+
+export interface ItemProps extends Omit<HTMLAttributesWeak, 'content'>, CommonProps {
+    /**
+     * 步骤的状态，如不传，会根据外层的 Step 的 current 属性生成，可选值为 `wait`, `process`, `finish`
+     */
+    status?: 'wait' | 'process' | 'finish';
+
+    /**
+     * 标题
+     */
+    title?: React.ReactNode;
+
+    /**
+     * 图标
+     */
+    icon?: string;
+
+    /**
+     * 内容，用于垂直状态下的内容填充
+     */
+    content?: React.ReactNode;
+
+    /**
+     * StepItem 的自定义渲染, 会覆盖父节点设置的itemRender
+     */
+    itemRender?: (index: number, status: string) => React.ReactNode;
+
+    /**
+     * 百分比
+     */
+    percent?: number;
+
+    /**
+     * 是否禁用
+     */
+    disabled?: boolean;
+
+    /**
+     * 点击步骤时的回调
+     */
+    onClick?: (index: number) => void;
+
+    /**
+     * 自定义样式
+     */
+    className?: string;
+}
+
+export type StepShape = 'circle' | 'arrow' | 'dot';
+export type StepDirection = 'hoz' | 'ver';
+export class Item extends React.Component<ItemProps, any> {}
+export interface StepProps extends React.HTMLAttributes<HTMLElement>, CommonProps {
+    /**
+     * 当前步骤
+     */
+    current?: number;
+
+    /**
+     * 展示方向
+     */
+    direction?: StepDirection;
+    /**
+     * 宽度是否横向拉伸
+     */
+    stretch?: boolean;
+    /**
+     * 横向布局时的内容排列
+     */
+    labelPlacement?: StepDirection;
+
+    /**
+     * 类型
+     */
+    shape?: StepShape;
+
+    /**
+     * 是否只读模式
+     */
+    readOnly?: boolean;
+
+    /**
+     * 是否开启动效
+     */
+    animation?: boolean;
+
+    /**
+     * 自定义样式名
+     */
+    className?: string;
+
+    /**
+     * StepItem 的自定义渲染
+     */
+    itemRender?: (index: number, status: string) => React.ReactNode;
+}
+
+export default class Step extends React.Component<StepProps, any> {
+    static Item: typeof Item;
+}

package/types/switch/index.d.ts

@@ -0,0 +1,85 @@
+/// <reference types="react" />
+
+import * as React from 'react';
+import CommonProps from '../util';
+
+interface HTMLAttributesWeak extends React.HTMLAttributes<HTMLElement> {
+    onChange?: any;
+    onClick?: any;
+    onKeyDown?: any;
+}
+
+export interface SwitchProps extends HTMLAttributesWeak, CommonProps {
+    /**
+     * 自定义类名
+     */
+    className?: string;
+    name?: string;
+
+    /**
+     * 自定义内敛样式
+     */
+    style?: React.CSSProperties;
+
+    /**
+     * 打开时的内容
+     */
+    checkedChildren?: React.ReactNode;
+
+    /**
+     * 关闭时的内容
+     */
+    unCheckedChildren?: React.ReactNode;
+
+    /**
+     * 开关状态改变是触发此事件
+     */
+    onChange?: (checked: boolean, e: any) => void;
+
+    /**
+     * 开关当前的值(针对受控组件)
+     */
+    checked?: boolean;
+    autoWidth?: boolean;
+
+    /**
+     * 开关默认值 (针对非受控组件)
+     */
+    defaultChecked?: boolean;
+
+    /**
+     * 表示开关被禁用
+     */
+    disabled?: boolean;
+
+    /**
+     * switch的尺寸
+     */
+    size?: 'medium' | 'small';
+
+    /**
+     * 鼠标点击事件
+     */
+    onClick?: React.MouseEventHandler;
+
+    /**
+     * 键盘按键事件
+     */
+    onKeyDown?: React.KeyboardEventHandler;
+
+    /**
+     * loading
+     */
+    loading?: boolean;
+}
+
+
+export interface BoolSwitchProps extends SwitchProps {
+    value?: boolean;
+}
+
+export class BoolSwitch extends React.Component<BoolSwitchProps, any> {}
+
+export default class Switch extends React.Component<SwitchProps, any> {
+    static BoolSwitch: typeof BoolSwitch
+}

package/types/tab/index.d.ts

@@ -0,0 +1,170 @@
+/// <reference types="react" />
+
+import * as React from 'react';
+import CommonProps from '../util';
+import { PopupProps } from '../overlay';
+
+interface HTMLAttributesWeak extends React.HTMLAttributes<HTMLElement> {
+    title?: any;
+}
+
+export interface ItemProps extends HTMLAttributesWeak, CommonProps {
+    /**
+     * 选项卡标题
+     */
+    title?: React.ReactNode;
+
+    /**
+     * 单个选项卡是否可关闭
+     */
+    closeable?: boolean;
+
+    /**
+     * 选项卡是否被禁用
+     */
+    disabled?: boolean;
+}
+
+export class Item extends React.Component<ItemProps, any> {}
+interface HTMLAttributesWeak extends React.HTMLAttributes<HTMLElement> {
+    onClick?: any;
+    onChange?: any;
+}
+
+export interface TabProps extends HTMLAttributesWeak, CommonProps {
+    /**
+     * 被激活的选项卡的 key, 赋值则tab为受控组件, 用户无法切换
+     */
+    activeKey?: string;
+
+    /**
+     * 初始化时被激活的选项卡的 key
+     */
+    defaultActiveKey?: string;
+
+    /**
+     * 外观形态
+     */
+    shape?: 'pure' | 'wrapped' | 'text' | 'capsule';
+
+    /**
+     * 是否开启动效
+     */
+    animation?: boolean;
+
+    /**
+     * 选项卡过多时的滑动模式
+     */
+    excessMode?: 'slide' | 'dropdown';
+
+    /**
+     * 导航选项卡的位置，只适用于包裹型（wrapped）选项卡
+     */
+    tabPosition?: 'top' | 'bottom' | 'left' | 'right';
+
+    /**
+     * 尺寸
+     */
+    size?: 'small' | 'medium';
+
+    /**
+     * 激活选项卡的触发方式
+     */
+    triggerType?: 'hover' | 'click';
+
+    /**
+     * 是否延迟加载 TabPane 的内容, 默认开启, 即不提前渲染
+     */
+    lazyLoad?: boolean;
+
+    /**
+     * 是否自动卸载未处于激活状态的选项卡
+     */
+    unmountInactiveTabs?: boolean;
+
+    /**
+     * 切换选项卡时，使用display：none/block控制是否显示。 避免因为高度变化引起页面闪烁
+     */
+    displayMode?: boolean;
+
+    /**
+     * 导航条的自定义样式
+     */
+    navStyle?: React.CSSProperties;
+
+    /**
+     * 导航条的自定义样式类
+     */
+    navClassName?: string;
+
+    /**
+     * 内容区容器的自定义样式
+     */
+    contentStyle?: React.CSSProperties;
+
+    /**
+     * 内容区容器的自定义样式类
+     */
+    contentClassName?: string;
+
+    /**
+     * 导航栏附加内容
+     */
+    extra?: React.ReactNode;
+
+    /**
+     * 禁用键盘事件
+     */
+    disableKeyboard?: boolean;
+
+    /**
+     * 点击单个选项卡时触发的回调
+     */
+    onClick?: (key: string) => void;
+
+    /**
+     * 选项卡发生切换时的事件回调
+     */
+    onChange?: (key: string) => void;
+
+    /**
+     * 选项卡被关闭时的事件回调
+     */
+    onClose?: (key: string) => void;
+
+    /**
+     * 自定义选项卡模板渲染函数
+     */
+    tabRender?: (key: string, props: any) => React.ReactNode;
+
+    /**
+     * 弹层属性透传, 只有当 excessMode 为 dropdown 时生效
+     */
+    popupProps?: PopupProps;
+
+    /**
+     * 自定义 icon
+     */
+    icons?: {
+        dropdown?: string | React.ReactNode;
+        prev?: string | React.ReactNode;
+        next?: string | React.ReactNode;
+    };
+    /**
+     * 展示新增按钮
+     */
+    showAdd?: boolean;
+    /**
+     * 新增的事件回调
+     */
+    onAdd?: () => void;
+
+    /**
+     * 自定义添加按钮
+     */
+    addIcon?: React.ReactNode;
+}
+
+export default class Tab extends React.Component<TabProps, any> {
+    static Item: typeof Item;
+}