shineout/lib/Card/Props.d.ts

Shein 前端组件库

import { ReactNode, Component } from 'react';
import { ButtonProps } from '../Button/Props';
import { RegularAttributes, StandardProps } from '../@types/common';
import { ResizableType, MovableType } from '../hoc/Props';
export interface OriginCardProps extends StandardProps {
    /**
     * @en Whether can be collapsed，'bottom' can collaps on bottom
     * @cn 是否可折叠，'bottom' 表示从下方点击折叠
     * @default false
     */
    collapsible?: boolean | 'bottom';
    /**
     * @en Whether to be collapsed.
     * @cn 是否折叠，用于受控状态
     */
    collapsed?: boolean;
    /**
     * @en Initial collapsed state
     * @cn 初始折叠状态（仅在 collapsible 为 true 时有效）
     * @default true
     */
    defaultCollapsed?: boolean;
    /**
     * @en Callback when collapsed state changed
     * @cn 折叠状态改变时回调事件
     */
    onCollapse?: (collapsed: boolean) => void;
    /**
     * @en Whether to show the shadow.'hover' - Display it when the mouse is over the element.true - Always show, false - Never show
     * @cn 是否显示阴影\n 'hover' - 鼠标移到元素上显示;\n true - 总是显示;\n false - 从不显示
     * @default false
     */
    shadow?: Boolean | 'hover';
    /**
     * @en Card.Accordion expand controlled key
     * @cn 手风琴下控制展开的值
     */
    id?: any;
    /**
     * @en children
     * @cn 子元素
     */
    children?: ReactNode;
    /**
     * @en get Card dom
     * @cn 获取 Card dom
     */
    forwardedRef?: (el: HTMLDivElement) => void;
}
/**
 * @title Card
 */
export declare type CardProps = MovableType<ResizableType<OriginCardProps>>;
export declare type CardContextValueType = {
    collapsed?: boolean;
    onCollapse: () => void;
    collapsible: 'bottom' | boolean;
    formStatus: string;
    onSubmit: (value: EventTarget) => void;
    setFormStatus?: (status: string) => void;
};
export declare type CardHeaderUseContext = 'collapsed' | 'onCollapse';
export declare type CardBodyUseContext = 'collapsed' | 'collapsible' | 'onCollapse';
export declare type CardSubmitUseContext = 'onSubmit' | 'formStatus';
export declare type CardConsumerType<U, key extends string> = Omit<U, key>;
export interface OriginCardHeaderProps extends StandardProps, Pick<CardContextValueType, CardHeaderUseContext> {
    /**
     * @en align
     * @cn 对齐方式
     * @override union
     */
    align?: RegularAttributes.Align;
    /**
     * @en children
     * @cn 子元素
     */
    children?: ReactNode;
    /**
     * @inner 内部属性由 Card 透传
     */
    collapsed?: boolean;
}
/**
 * @title Card.Header
 */
export declare type CardHeaderProps = CardConsumerType<OriginCardHeaderProps, CardHeaderUseContext>;
export interface OriginCardBodyProps extends StandardProps, Pick<CardContextValueType, CardBodyUseContext> {
    /**
     * @en children
     * @cn 子元素
     */
    children?: ReactNode;
}
/**
 * @title Card.Body
 */
export declare type CardBodyProps = CardConsumerType<OriginCardBodyProps, CardBodyUseContext>;
/**
 * @title Card.Footer
 */
export interface CardFooterProps extends StandardProps {
    /**
     * @en align
     * @cn 对齐方式
     * @override union
     */
    align?: RegularAttributes.Align;
    /**
     * @cn children
     * @en 子元素
     */
    children?: ReactNode;
}
/**
 * @title Card.Accordion
 */
export interface CardAccordionProps<T> {
    /**
     * @en Active value. It is -1 when fully closed. Used in controlled state. be id while Card.id setted
     * @cn 打开的值，全关闭时为 null，用于受控状态。默认为索引，若 Card 设置 id 后则为 id。
     * @override any
     */
    active?: T | null;
    /**
     * @en The default active value for uncontrolled state, be id while Card.id setted
     * @cn 默认打开的值，用于非受控状态。默认为索引，若 Card 设置 id 后则为 id。
     * @default 0
     * @override any
     */
    defaultActive?: T | null;
    /**
     * @en The callback function when the panel is opened
     * @cn 面板打开回调
     * @override (active: any) => void
     */
    onChange?: (active: T | null) => void;
    /**
     * @en children
     * @cn 子元素
     */
    children?: ReactNode;
}
export interface OriginCardSubmitProps extends ButtonProps, Pick<CardContextValueType, CardSubmitUseContext> {
}
export declare type CardSubmitProps = CardConsumerType<OriginCardSubmitProps, CardSubmitUseContext>;
export declare class Header extends Component<CardHeaderProps, {}> {
    render(): JSX.Element;
}
export declare class Body extends Component<CardBodyProps, {}> {
    render(): JSX.Element;
}
export declare class Footer extends Component<CardFooterProps, {}> {
    render(): JSX.Element;
}
export declare class Submit extends Component<CardSubmitProps, {}> {
    render(): JSX.Element;
}
export declare class Accordion<T> extends Component<CardAccordionProps<T>, {}> {
    render(): JSX.Element;
}
export declare class Card extends Component<CardProps, {}> {
    static Header: typeof Header;
    static Body: typeof Body;
    static Footer: typeof Footer;
    static Submit: typeof Submit;
    static Accordion: typeof Accordion;
    render(): JSX.Element;
}
export declare type CardType = typeof Card;