@nutui/nutui-react 2.0.0-beta.0 → 2.0.0-beta.2

package/dist/types/packages/elevator/elevator.d.ts

@@ -0,0 +1,59 @@
+import React, { FunctionComponent } from 'react';
+import { BasicComponent } from '../../utils/typings';
+export declare const elevatorContext: React.Context<ElevatorData>;
+export interface ElevatorProps extends BasicComponent {
+    /**
+    * 电梯区域的高度
+    * @default 200px
+    */
+    height: number | string
+    /**
+    * 索引 key 值
+    * @default title
+    */
+    floorKey: string
+    /**
+    * 索引列表
+    * @default [{id: 0, name: ''}]
+    */
+    list: any[]
+    /**
+    * 索引是否吸顶
+    * @default false
+    */
+    sticky: boolean
+    /**
+    * 右侧锚点的上下间距
+    * @default 23
+    */
+    spaceHeight: number
+    /**
+    * 左侧索引的高度
+    * @default 35
+    */
+    titleHeight: number
+    /**
+    * 展示右侧导航
+    * @default true
+    */
+    showKeys: boolean
+    /**
+    * 点击内容
+    * @default false
+    */
+    onItemClick: (key: string, item: ElevatorData) => void
+    /**
+    * 点击索引
+    * @default false
+    */
+    onIndexClick: (key: string) => void
+}
+interface ElevatorData {
+    name: string;
+    id: number | string;
+    [key: string]: string | number;
+}
+export declare const Elevator: FunctionComponent<Partial<ElevatorProps> & React.HTMLAttributes<HTMLDivElement>> & {
+    Context: typeof elevatorContext;
+};
+export {};

package/dist/types/packages/elevator/index.d.ts

@@ -0,0 +1,3 @@
+import { Elevator } from './elevator';
+export type { ElevatorProps } from './elevator';
+export default Elevator;

package/dist/types/packages/ellipsis/ellipsis.d.ts

@@ -0,0 +1,51 @@
+import React, { FunctionComponent } from 'react';
+import { BasicComponent } from '../../utils/typings';
+export type EllipsisDirection = 'start' | 'end' | 'middle';
+export interface EllipsisProps extends BasicComponent {
+    /**
+    * 文本内容
+    * @default -
+    */
+    content: string
+    /**
+    * 省略位置
+    * @default end
+    */
+    direction: EllipsisDirection
+    /**
+    * 展示几行
+    * @default 1
+    */
+    rows: number | string
+    /**
+    * 展开操作的文案
+    * @default -
+    */
+    expandText: string
+    /**
+    * 收起操作的文案
+    * @default -
+    */
+    collapseText: string
+    /**
+    * 省略的符号
+    * @default ...
+    */
+    symbol: string
+    /**
+    * 容器的行高
+    * @default 20
+    */
+    lineHeight: number | string
+    /**
+    * 文本点击是触发
+    * @default -
+    */
+    onClick: () => void
+    /**
+    * 点击展开收起时触发
+    * @default -
+    */
+    onChange: (type: string) => void
+}
+export declare const Ellipsis: FunctionComponent<Partial<EllipsisProps> & Omit<React.HTMLAttributes<HTMLDivElement>, 'onClick' | 'onChange'>>;

package/dist/types/packages/ellipsis/index.d.ts

@@ -0,0 +1,3 @@
+import { Ellipsis } from './ellipsis';
+export type { EllipsisProps, EllipsisDirection } from './ellipsis';
+export default Ellipsis;

package/dist/types/packages/empty/empty.d.ts

@@ -0,0 +1,25 @@
+import React, { FunctionComponent, ReactNode } from 'react';
+import { BasicComponent } from '../../utils/typings';
+export interface EmptyProps extends BasicComponent {
+    /**
+    * 图片,支持传入图片 URL
+    * @default -
+    */
+    image?: ReactNode
+    /**
+    * 图片大小，number 类型单位为 px
+    * @default -
+    */
+    imageSize: number | string
+    /**
+    * 图片下方的描述文字
+    * @default -
+    */
+    description: ReactNode
+    /**
+    * 默认图片错误类型
+    * @default empty
+    */
+    status: 'empty' | 'error' | 'network'
+}
+export declare const Empty: FunctionComponent<Partial<EmptyProps> & React.HTMLAttributes<HTMLDivElement>>;

package/dist/types/packages/empty/index.d.ts

@@ -0,0 +1,3 @@
+import { Empty } from './empty';
+export type { EmptyProps } from './empty';
+export default Empty;

package/dist/types/packages/fixednav/fixednav.d.ts

@@ -0,0 +1,60 @@
+import React, { FunctionComponent, MouseEvent } from 'react';
+import { BasicComponent } from '../../utils/typings';
+export type FixedNavDirection = 'right' | 'left';
+export type FixedNavPosition = {
+    top?: string;
+    bottom?: string;
+};
+export interface FixedNavProps extends BasicComponent {
+    /**
+    * 是否打开
+    * @default false
+    */
+    visible: boolean
+    /**
+    * 展开时是否显示遮罩
+    * @default true
+    */
+    overlay: boolean
+    /**
+    * 悬浮列表内容数据
+    * @default []
+    */
+    list: Array<any>
+    /**
+    * 收起列表按钮文案
+    * @default 收起导航
+    */
+    activeText: string
+    /**
+    * 展开列表按钮文案
+    * @default 快速导航
+    */
+    inactiveText: string
+    /**
+    * fixed 垂直位置
+    * @default {top: 'auto', bottom: 'auto'}
+    */
+    position: FixedNavPosition
+    /**
+    * 导航方向
+    * @default right
+    */
+    type: FixedNavDirection
+    /**
+    * 展开收起按钮回调
+    * @default -
+    */
+    onChange: (item: any) => void
+    /**
+    * 选择之后触发
+    * @default -
+    */
+    onSelect: (item: any, event: MouseEvent) => void
+    /**
+    * 自定义按钮
+    * @default -
+    */
+    content: React.ReactNode
+}
+export declare const FixedNav: FunctionComponent<Partial<FixedNavProps> & Omit<React.HTMLAttributes<HTMLDivElement>, 'onChange' | 'onSelect' | 'content'>>;

package/dist/types/packages/fixednav/index.d.ts

@@ -0,0 +1,3 @@
+import { FixedNav } from './fixednav';
+export type { FixedNavProps, FixedNavDirection, FixedNavPosition, } from './fixednav';
+export default FixedNav;

package/dist/types/packages/form/context.d.ts

@@ -0,0 +1,4 @@
+/// <reference types="react" />
+export declare const Context: import("react").Context<{
+    [key: string]: any;
+}>;

package/dist/types/packages/form/form.d.ts

@@ -0,0 +1,51 @@
+import React, { FunctionComponent, ReactNode } from 'react';
+import { useForm } from './useform';
+import { BasicComponent } from '../../utils/typings';
+import { FormItem } from '../formitem/formitem';
+export interface FormProps extends BasicComponent {
+    /**
+    * 表单底部区域，一般放置确认和重置按钮
+    * @default null
+    */
+    footer: ReactNode
+    /**
+    * 表单初始值
+    * @default -
+    */
+    initialValues: any
+    /**
+    * 表单名称
+    * @default -
+    */
+    name: string
+    /**
+    * 经 Form.useForm() 创建的 form 控制实例，不提供时会自动创建
+    * @default -
+    */
+    form: any
+    /**
+    * 表单项 label 的位置
+    * @default right
+    */
+    labelPosition: 'top' | 'left' | 'right'
+    /**
+    * 必填表单项 label 的红色星标位置
+    * @default left
+    */
+    starPosition: 'left' | 'right'
+    /**
+    * 校验成功后触发
+    * @default -
+    */
+    onFinish: (values: any) => void
+    /**
+    * 任一表单项被校验失败后触发
+    * @default -
+    */
+    onFinishFailed: (values: any, errorFields: any) => void
+}
+export declare const Form: FunctionComponent<Partial<FormProps> & React.HTMLAttributes<HTMLFormElement>> & {
+    Item: typeof FormItem;
+} & {
+    useForm: typeof useForm;
+};

package/dist/types/packages/form/index.d.ts

@@ -0,0 +1,3 @@
+import { Form } from './form';
+export type { FormItemRuleWithoutValidator, StoreValue, NamePath, FormInstance, FieldEntity, } from './types';
+export default Form;

package/dist/types/packages/form/types.d.ts

@@ -0,0 +1,34 @@
+export interface FormItemRuleWithoutValidator {
+    [key: string]: any;
+    regex?: RegExp;
+    required?: boolean;
+    message?: string;
+}
+export type StoreValue = any;
+export type NamePath = string | number;
+export interface Callbacks<Values = any> {
+    onValuesChange?: (values: Values) => void;
+    onFinish?: (values: Values) => void;
+    onFinishFailed?: (values: Values, errorFields: any) => void;
+}
+export interface Store {
+    [name: string]: any;
+}
+export interface FormInstance<Values = any> {
+    registerField: (entity: FieldEntity) => () => void;
+    getFieldValue: (name: NamePath) => StoreValue;
+    setFieldsValue: (value: any) => void;
+    resetFields: (fields?: NamePath[]) => void;
+    submit: () => void;
+    setCallback: (callbacks: Callbacks) => void;
+}
+export interface FieldEntity {
+    onStoreChange: (type?: string) => void;
+    getNamePath: () => NamePath;
+    props: {
+        name: NamePath;
+        rules?: any[];
+        dependencies?: NamePath[];
+        initialValue?: any;
+    };
+}

package/dist/types/packages/form/useform.d.ts

@@ -0,0 +1,2 @@
+import { FormInstance } from './types';
+export declare const useForm: (form?: FormInstance) => any[];

package/dist/types/packages/formitem/formitem.d.ts

@@ -0,0 +1,62 @@
+import React from 'react';
+import { BaseFormField } from './types';
+import { Context } from '../form/context';
+import { BasicComponent } from '../../utils/typings';
+type TextAlign = 'start' | 'end' | 'left' | 'right' | 'center' | 'justify' | 'match-parent';
+export interface FormItemProps extends BasicComponent, BaseFormField {
+    /**
+    * 必填表单项 label 的红色星标,仅用于控制样式
+    * @default false
+    */
+    required: boolean
+    /**
+    * 设置子元素默认值
+    * @default -
+    */
+    initialValue: any
+    /**
+    * 设置收集字段值变更的时机
+    * @default -
+    */
+    trigger: string
+    /**
+    * 子节点的值的属性，如 Checkbox 的是 'checked'
+    * @default -
+    */
+    valuePropName: string
+    /**
+    * 设置如何将 event 的值转换成字段值
+    * @default -
+    */
+    getValueFromEvent: (...args: any) => any
+    /**
+    * 点击事件并收集子组件 Ref
+    * @default -
+    */
+    onClick: (event: React.MouseEvent, componentRef: React.MutableRefObject<any>) => void
+    /**
+    * 错误提示文案对齐方式
+    * @default left
+    */
+    errorMessageAlign: TextAlign
+}
+declare const defaultProps: FormItemProps;
+export type FieldProps = typeof defaultProps & Partial<BaseFormField>;
+export declare class FormItem extends React.Component<FieldProps, {
+    resetCount: number;
+}> {
+    static defaultProps: FormItemProps;
+    static contextType: any;
+    context: React.ContextType<typeof Context>;
+    private cancelRegister;
+    private componentRef;
+    constructor(props: FieldProps);
+    componentDidMount(): void;
+    componentWillUnmount(): void;
+    getControlled: (children: React.ReactElement) => any;
+    refresh: () => void;
+    onStoreChange: (type?: string) => void;
+    renderLayout: (childNode: React.ReactNode) => JSX.Element;
+    render(): JSX.Element;
+}
+export {};

package/dist/types/packages/formitem/index.d.ts

@@ -0,0 +1,3 @@
+import { FormItem } from './formitem';
+export type { FormItemRuleWithoutValidator, FormItemRule, FormInstance, } from './types';
+export default FormItem;

package/dist/types/packages/formitem/types.d.ts

@@ -0,0 +1,52 @@
+export interface FormItemRuleWithoutValidator {
+    [key: string]: any;
+    regex?: RegExp;
+    required?: boolean;
+    message?: string;
+}
+export interface FormItemRule extends FormItemRuleWithoutValidator {
+    validator?: (ruleCfg: FormItemRuleWithoutValidator, value: string) => boolean | string | Promise<boolean | string>;
+}
+export interface BaseFormField {
+    /**
+     * 字段名
+     */
+    name: string;
+    /**
+     * label 标签的文本
+     */
+    label: string;
+    /**
+     * 校验规则，设置字段的校验逻辑
+     */
+    rules: FormItemRule[];
+    /**
+     * 是否禁用表单项
+     */
+    disabled: boolean;
+}
+export type StoreValue = any;
+export type NamePath = string | number;
+export interface Callbacks<Values = any> {
+    onValuesChange?: (values: Values) => void;
+    onFinish?: (values: Values) => void;
+    onFinishFailed?: (Values: Values) => void;
+}
+export interface FormInstance<Values = any> {
+    registerField: (entity: FieldEntity) => () => void;
+    getFieldValue: (name: NamePath) => StoreValue;
+    setFieldsValue: (value: any) => void;
+    resetFields: (fields?: NamePath[]) => void;
+    submit: () => void;
+    setCallback: (callbacks: Callbacks) => void;
+}
+export interface FieldEntity {
+    onStoreChange: () => void;
+    getNamePath: () => NamePath;
+    props: {
+        name: NamePath;
+        rules?: any[];
+        dependencies?: NamePath[];
+        initialValue?: any;
+    };
+}

package/dist/types/packages/grid/grid.context.d.ts

@@ -0,0 +1,6 @@
+import React from 'react';
+import { GridItemProps } from '../griditem/griditem';
+declare const _default: React.Context<{
+    onClick: (item: GridItemProps, index: number) => void;
+}>;
+export default _default;

package/dist/types/packages/grid/grid.d.ts

@@ -0,0 +1,45 @@
+import React, { CSSProperties, FunctionComponent } from 'react';
+import { GridItem, GridItemProps } from '../griditem/griditem';
+export type GridDirection = 'horizontal' | 'vertical';
+export interface GridProps {
+    /**
+    * 列数
+    * @default 4
+    */
+    columns: string | number
+    /**
+    * 格子之间的间距，默认单位为px
+    * @default 0
+    */
+    gap: string | number
+    /**
+    * 是否将格子内容居中显示
+    * @default true
+    */
+    center: boolean
+    /**
+    * 是否将格子固定为正方形
+    * @default false
+    */
+    square: boolean
+    /**
+    * 内容翻转
+    * @default false
+    */
+    reverse: boolean
+    /**
+    * 格子内容排列的方向
+    * @default vertical
+    */
+    direction: GridDirection
+    className?: string;
+    style?: CSSProperties;
+    /**
+    * 宫格子项点击事件
+    * @default -
+    */
+    onClick: (item: GridItemProps, index: number) => void
+}
+export declare const Grid: FunctionComponent<Partial<GridProps> & Omit<React.HTMLAttributes<HTMLDivElement>, 'onClick'>> & {
+    Item: typeof GridItem;
+};

package/dist/types/packages/grid/index.d.ts

@@ -0,0 +1,3 @@
+import { Grid } from './grid';
+export type { GridDirection, GridProps } from './grid';
+export default Grid;

package/dist/types/packages/griditem/griditem.d.ts

@@ -0,0 +1,19 @@
+import React, { FunctionComponent, ReactNode } from 'react';
+import { BasicComponent } from '../../utils/typings';
+type GridDirection = 'horizontal' | 'vertical';
+export interface GridItemProps extends BasicComponent {
+    /**
+    * 文字
+    * @default -
+    */
+    text: string | ReactNode
+    index: number;
+    columns: string | number;
+    gap: string | number;
+    center: boolean;
+    square: boolean;
+    reverse: boolean;
+    direction: GridDirection;
+}
+export declare const GridItem: FunctionComponent<Partial<GridItemProps> & React.HTMLAttributes<HTMLDivElement>>;
+export {};

package/dist/types/packages/griditem/index.d.ts

@@ -0,0 +1,3 @@
+import { GridItem } from './griditem';
+export type { GridItemProps } from './griditem';
+export default GridItem;

package/dist/types/packages/image/image.d.ts

@@ -0,0 +1,72 @@
+import React, { FunctionComponent, ReactNode } from 'react';
+import { BasicComponent } from '../../utils/typings';
+export interface ImageProps extends BasicComponent {
+    /**
+    * 图片链接
+    * @default -
+    */
+    src: string
+    /**
+    * 图片填充模式，等同于原生的 object-fit 属性
+    * @default fill
+    */
+    fit: ImageFit
+    /**
+    * 图片位置，等同于原生的 object-position 属性
+    * @default center
+    */
+    position: ImagePosition
+    /**
+    * 替代文本
+    * @default -
+    */
+    alt: string
+    /**
+    * 宽度，默认单位px
+    * @default -
+    */
+    width: string
+    /**
+    * 高度，默认单位px
+    * @default -
+    */
+    height: string
+    /**
+    * 圆角大小
+    * @default -
+    */
+    radius: string | number
+    /**
+    * 是否展示图片加载失败
+    * @default true
+    */
+    error: boolean | ReactNode
+    /**
+    * 是否展示加载中图片
+    * @default true
+    */
+    loading: boolean | ReactNode
+    /**
+    * 是否为懒加载图片
+    * @default false
+    */
+    lazy: boolean
+    /**
+    * 点击图片时触发
+    * @default -
+    */
+    onClick: (e: MouseEvent) => void
+    /**
+    * 图片加载完后触发
+    * @default -
+    */
+    onLoad: () => void
+    /**
+    * 图片加载失败后触发
+    * @default -
+    */
+    onError: () => void
+}
+export type ImageFit = 'contain' | 'cover' | 'fill' | 'none' | 'scale-down' | string;
+export type ImagePosition = 'center' | 'top' | 'right' | 'bottom' | 'left' | string;
+export declare const Image: FunctionComponent<Partial<ImageProps> & Omit<React.HTMLAttributes<HTMLDivElement>, 'onClick' | 'onLoad' | 'onError'>>;

package/dist/types/packages/image/index.d.ts

@@ -0,0 +1,3 @@
+import { Image } from './image';
+export type { ImageProps } from './image';
+export default Image;

package/dist/types/packages/imagepreview/imagepreview.d.ts

@@ -0,0 +1,67 @@
+import { FunctionComponent } from 'react';
+import { BasicComponent } from '../../utils/typings';
+export interface ImagePreviewProps extends BasicComponent {
+    /**
+    * 预览图片数组
+    * @default []
+    */
+    images: Array<{
+        src: string;
+    }>
+    /**
+    * 预览的视频数组（视频自动放到图片之前）
+    * @default []
+    */
+    videos: Array<{
+        source: {
+            src: string;
+            type: string;
+        };
+        options: {
+            muted: boolean;
+            controls: boolean;
+        };
+    }>
+    /**
+    * 是否展示预览图片
+    * @default false
+    */
+    visible: boolean
+    /**
+    * 自动轮播时长，0表示不会自动轮播
+    * @default 3000
+    */
+    autoPlay: number | string
+    /**
+    * 页码，受控
+    * @default 1
+    */
+    value?: number
+    /**
+    * 初始页码
+    * @default 1
+    */
+    defaultValue: number
+    /**
+    * 点击图片可以退出预览
+    * @default false
+    */
+    closeOnContentClick: boolean
+    /**
+    * 分页指示器是否展示
+    * @default false
+    */
+    indicator: boolean
+    /**
+    * 分页指示器选中的颜色
+    * @default #fff
+    */
+    indicatorColor: string
+    onChange: (value: number) => void;
+    /**
+    * 点击遮罩关闭图片预览时触发
+    * @default -
+    */
+    onClose: () => void
+}
+export declare const ImagePreview: FunctionComponent<Partial<ImagePreviewProps>>;

package/dist/types/packages/imagepreview/index.d.ts

@@ -0,0 +1,3 @@
+import { ImagePreview } from './imagepreview';
+export type { ImagePreviewProps } from './imagepreview';
+export default ImagePreview;

package/dist/types/packages/indicator/index.d.ts

@@ -0,0 +1,3 @@
+import { Indicator } from './indicator';
+export type { IndicatorProps } from './indicator';
+export default Indicator;