jamis/lib/r-button/DropDownButton.types.d.ts

一种支持通过JSON配置方式生成页面的组件库

import type { RendererProps, SchemaBoolean } from 'jamis-core';
import type { BaseSchema, ButtonLevel, SchemaClassName, SchemaExpression, SchemaIcon, SchemaObject, SchemaPopOverObject, SizeUnit, TooltipObject } from '../types';
export type DropdownItem = SchemaObject & {
    icon?: string;
    label?: string;
    children?: Array<DropdownItem>;
    onClick?: () => void;
};
/**
 * 下拉按钮组件。
 */
export interface DropdownButtonSchema extends BaseSchema {
    /**
     * 指定为 DropDown Button 类型
     */
    type: 'dropdown-button';
    /**
     * 是否独占一行 `display: block`
     */
    block?: boolean;
    /**
     * 弹出的menu设置
     */
    dropdown?: SchemaPopOverObject;
    /**
     * 点击外部是否关闭
     * @deprecated 请使用`dropdown.closeOnOutside`
     */
    closeOnOutside?: boolean;
    /**
     * 点击内容是否关闭
     * @deprecated 请使用`dropdown.closeOnContainer`替代
     */
    closeOnClick?: boolean;
    /** 按钮隐藏就销毁, 默认是true */
    unmountOnHide?: boolean;
    /**
     * 触发条件，默认是 click
     * @deprecated 请使用`dropdown.trigger`
     */
    trigger?: 'click' | 'hover';
    /**
     * 给 Button 配置 className。
     */
    btnClassName?: SchemaClassName;
    /**
     * 按钮文字的样式类
     */
    btnLabelClassName?: SchemaClassName;
    /**
     * icon 元素的 className
     */
    iconClassName?: SchemaClassName;
    /**
     * 按钮集合，支持分组
     * @deprecated 请使用body替代
     */
    buttons?: Array<DropdownItem>;
    body?: DropdownItem[];
    /**
     * 按钮文字
     */
    label?: string;
    /**
     * 按钮级别，样式
     */
    level?: ButtonLevel | SchemaExpression;
    /**
     * 按钮提示文字，hover focus 时显示
     */
    tooltip?: string | TooltipObject;
    tooltipContainer?: any;
    disabledTip?: string | TooltipObject;
    /**
     * 按钮大小
     */
    size?: SizeUnit;
    /**
     * 对齐方式
     */
    align?: 'left' | 'right';
    /**
     * 是否只显示图标。
     */
    iconOnly?: boolean;
    /**
     * 左侧图标
     */
    icon?: SchemaIcon;
    iconExpr?: SchemaExpression;
    /**
     * 右侧图标
     */
    rightIcon?: SchemaIcon;
    /**
     * 是否显示下拉按钮
     */
    hideCaret?: boolean;
    /**
     * 下拉菜单`.cxd-DropDown-menu` CSS 类名
     * @deprecated 请使用`slots.DropDown-menu`
     */
    menuClassName?: string;
    /**
     * `.cxd-DropDown-button`元素的样式类
     * @deprecated 请使用`slots.DropDown-button`
     */
    menuBtnClassName?: SchemaClassName;
    /**
     * 下拉打开状态, 包括初始状态, 及状态表达式
     * @deprecated 请使用`dropdown.isOpened`
     */
    isOpened?: boolean | SchemaBoolean;
    /**
     * @deprecated 使用 disabled 属性代替
     */
    btnDisabled?: boolean;
    /**
     * @deprecated 使用level属性代替
     */
    primary?: boolean;
}
export interface DropDownButtonProps extends Pick<RendererProps, 'render' | 'data' | 'dispatchEvent'>, Omit<DropdownButtonSchema, 'type'> {
    label?: SchemaExpression;
    menuClassName?: string;
    level?: ButtonLevel;
    popOverContainer?: any;
    children?: any;
}
export interface DropDownButtonRendererProps extends DropDownButtonProps, RendererProps {
}