@unicom-cloud/ui 0.8.82 → 0.8.84

package/types/{input-number → pc/input-number}/decimal.d.ts

@@ -13,4 +13,9 @@ export interface Decimal {
     add: (target: string | number) => Decimal;
 }
 export declare function getDecimal(value: string | number): Decimal;
+/**
+ * Replace String.prototype.toFixed like Math.round
+ * If cutOnly is true, just slice the tail
+ * e.g. Decimal.toFixed(0.15) will return 0.2, not 0.1
+ */
 export declare function toFixed(numStr: string, precision?: number, cutOnly?: boolean): string;

package/types/pc/input-number/interface.d.ts

@@ -0,0 +1,141 @@
+import { CSSProperties, InputHTMLAttributes, ReactNode } from 'react';
+export type InputNumberValueChangeReason = 'manual' | 'increase' | 'decrease' | 'outOfRange';
+/**
+ * @title InputNumber
+ */
+export interface InputNumberProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'prefix' | 'className' | 'size' | 'onChange' | 'onKeyDown'> {
+    style?: CSSProperties;
+    className?: string | string[];
+    /**
+     * @zh 数字变化步长
+     * @en The value of each step. It can be an integer or decimal
+     * @defaultValue 1
+     */
+    step?: number;
+    /**
+     * @zh 数字精度。设置精度小于`step`的小数位时，取`step`的小数个数。
+     * @en The precision of input value
+     */
+    precision?: number;
+    /**
+     * @zh 最小值
+     * @en The min value
+     * @defaultValue -Infinity
+     */
+    min?: number;
+    /**
+     * @zh 最大值
+     * @en The max value
+     * @defaultValue Infinity
+     */
+    max?: number;
+    /**
+     * @zh 是否禁用
+     * @en Whether input is disabled
+     */
+    disabled?: boolean;
+    /**
+     * @zh 错误状态
+     * @en Whether input has error status
+     */
+    error?: boolean;
+    /**
+     * @zh 是否只读
+     * @en Whether input is readonly
+     * @version 2.17.0
+     */
+    readOnly?: boolean;
+    /**
+     * @zh 严格模式下，`onChange` 回调将返回字符串类型
+     * @en `onChange` will return a string in strict mode
+     * @version 2.42.0
+     */
+    strictMode?: boolean;
+    /**
+     * @zh 初始值
+     * @en To set default value
+     */
+    defaultValue?: number | string;
+    /**
+     * @zh 当前值
+     * @en To set value
+     */
+    value?: undefined | number | string;
+    /**
+     * @zh 默认显示文案
+     * @en Placeholder of input element
+     */
+    placeholder?: string;
+    /**
+     * @zh `embed` - 按钮内嵌模式，`button` - 左右按钮模式
+     * @en `embed`: Button embedded, `button`: Buttons on both sides
+     * @defaultValue embed
+     */
+    mode?: 'embed' | 'button';
+    /**
+     * @zh 不同尺寸的数字输入框。分别对应 `24px`, `28px`, `32px`, `36px`
+     * @en Different sizes
+     */
+    size?: 'mini' | 'small' | 'default' | 'large';
+    /**
+     * @zh 显示前缀
+     * @en The prefix for the InputNumber
+     */
+    prefix?: ReactNode;
+    /**
+     * @zh 显示后缀
+     * @en The suffix for the InputNumber
+     */
+    suffix?: ReactNode;
+    /**
+     * @zh 定义输入框展示值
+     * @en Specifies the format of the value presented
+     * @version Param `info` in `2.41.0`
+     */
+    formatter?: (value: number | string, info: {
+        userTyping: boolean;
+        input: string;
+    }) => string;
+    /**
+     * @zh 从 formatter 转换为数字，和 formatter 搭配使用。
+     * @en Specifies the value extracted from formatter
+     * @defaultValue (input) => input.replace(/[^\w\.-]+/g, '')
+     */
+    parser?: (value: string) => number | string;
+    /**
+     * @zh 变化回调
+     * @en Callback when the value changes
+     * @version `reason` in 2.61.0
+     */
+    onChange?: (value: number, reason?: InputNumberValueChangeReason) => void;
+    /**
+     * @zh 输入框聚焦事件的回调
+     * @en Callback when the input is focused
+     */
+    onFocus?: (e: any) => void;
+    /**
+     * @zh 输入框失去聚焦事件的回调
+     * @en Callback when the input is blurred
+     */
+    onBlur?: (e: any) => void;
+    /**
+     * @zh 键盘事件回调
+     * @en Callback when the keyboard is pressed
+     */
+    onKeyDown?: (e: Event) => void;
+    /**
+     * @zh 隐藏右侧按钮
+     * @en Whether to hide the control buttons
+     */
+    hideControl?: boolean;
+    /**
+     * @zh 配置图标
+     * @en Customize icons
+     */
+    icons?: {
+        up?: ReactNode;
+        down?: ReactNode;
+        plus?: ReactNode;
+        minus?: ReactNode;
+    };
+}

package/types/{input-number → pc/input-number}/util.d.ts

@@ -1,7 +1,22 @@
+/**
+ * Judge whether a number is scientific notation
+ */
 export declare function isE(number: string | number): boolean;
+/**
+ * Judge whether BigInt is supported by current env
+ */
 export declare function supportBigInt(): boolean;
+/**
+ * Get precision of a number, include scientific notation like 1e-10
+ */
 export declare function getNumberPrecision(number: string | number): number;
+/**
+ * Convert number to non-scientific notation
+ */
 export declare function toSafeString(number: number | string): string;
+/**
+ * Judge whether a number is valid
+ */
 export declare function validateNumber(num: string | number): boolean;
 export declare function trimNumber(numStr: string): {
     negative: boolean;

package/types/pc/input-tag/interface.d.ts

@@ -0,0 +1,215 @@
+import { CSSProperties, ReactNode } from 'react';
+import { PopoverProps } from '../popover';
+export type ObjectValueType = {
+    value?: any;
+    label?: ReactNode;
+    closable?: boolean;
+};
+export type ValueChangeReason = 'add' | 'remove' | 'clear' | 'sort';
+/**
+ * @title InputTag
+ */
+export interface InputTagProps<T = any> {
+    className?: string | string[];
+    style?: CSSProperties;
+    /**
+     * @zh 不同尺寸
+     * @en Different sizes
+     */
+    size?: 'mini' | 'small' | 'default' | 'large';
+    /**
+     * @zh 预设文案
+     * @en Placeholder of input element
+     */
+    placeholder?: string;
+    /**
+     * @zh 是否是错误状态.(废弃，下个大版本移除，使用 status='error' 替代)
+     * @en Whether the input is error.(Deprecated, removed in the next major version, use status='error' instead)
+     * @deprecated status="error"
+     */
+    error?: boolean;
+    /**
+     * @zh 状态
+     * @en Status
+     * @version 2.45.0
+     */
+    status?: 'error' | 'warning';
+    /**
+     * @zh 是否禁用
+     * @en Whether the input is disabled
+     */
+    disabled?: boolean;
+    /**
+     * @zh 自动聚焦
+     * @en Whether the input is focused by default
+     */
+    autoFocus?: boolean;
+    /**
+     * @zh 是否只读
+     * @en Whether the input is read only
+     */
+    readOnly?: boolean;
+    /**
+     * @zh 是否允许清除
+     * @en Whether to allow clear input value
+     */
+    allowClear?: boolean;
+    /**
+     * @zh 是否为内部标签变化添加动画。
+     * @en Whether to add animation for internal label changes
+     * @version 2.15.0
+     * @defaultValue true
+     */
+    animation?: boolean;
+    /**
+     * @zh 是否在失焦时自动存储正在输入的文本
+     * @en Whether to automatically store the text entering when blur InputTag
+     * @version 2.25.0
+     */
+    saveOnBlur?: boolean;
+    /**
+     * @zh 默认值
+     * @en To set default value
+     */
+    defaultValue?: T[];
+    /**
+     * @zh 控件值
+     * @en To set value
+     */
+    value?: T[];
+    /**
+     * @zh 控件的输入框内的值
+     * @en To set input value
+     */
+    inputValue?: string;
+    /**
+     * @zh 设置传入和回调出的值均为 `{ label: '', value: ''}` 格式。
+     * @en If true, the incoming and callback values will be `{label: '', value: '')` format
+     */
+    labelInValue?: boolean;
+    /**
+     * @zh 是否可以通过拖拽为 Tag 排序
+     * @en Weather it is possible to sort tags by drag
+     * @version 2.27.0
+     */
+    dragToSort?: boolean;
+    /**
+     * @zh 最多显示多少个 `tag`
+     * @en The maximum number of `tags` is displayed
+     * @version 2.59.0. `responsive ` in `2.62.0`
+     */
+    maxTagCount?: number | 'responsive' | {
+        count: number | 'responsive';
+        render?: (invisibleTagCount: number, value: T[]) => ReactNode;
+        popoverProps?: Partial<PopoverProps>;
+    };
+    /**
+     * @zh 添加前缀文字或者图标
+     * @en The prefix icon or text for the input-tag
+     * @version 2.47.0
+     */
+    prefix?: ReactNode;
+    /**
+     * @zh 后缀
+     * @en The suffix for the InputTag
+     */
+    suffix?: ReactNode;
+    /**
+     * @zh 输入框前添加元素
+     * @en The label text displayed before (on the left side of) the input-tag field
+     * @version 2.47.0
+     */
+    addBefore?: ReactNode;
+    /**
+     * @zh 输入框后添加元素
+     * @en The label text displayed after (on the right side of) the input-tag field
+     * @version 2.47.0
+     */
+    addAfter?: ReactNode;
+    /**
+     * @zh 自定义图标
+     * @en Custom icons
+     */
+    icon?: {
+        removeIcon?: ReactNode;
+        clearIcon?: ReactNode;
+    };
+    /**
+     * @zh 触发自动分词的分隔符
+     * @en Separator used to tokenize
+     * @version 2.44.0
+     */
+    tokenSeparators?: string[];
+    /**
+     * @zh 校验函数，默认在 按下enter时候触发。
+     * @en Function to check user's input, which is triggered when `Enter` is pressed
+     * @defaultValue (inputValue, values) => inputValue && values.every((item) => item !== inputValue)
+     * @version return type T and `Promise<T>` in 2.37.0
+     */
+    validate?: (inputValue: string, values: T[]) => boolean | Promise<boolean> | T | Promise<T>;
+    /**
+     * @zh 自定义标签渲染，`props` 为当前标签属性，`index` 为当前标签的顺序，`values` 为所有标签的值.
+     * @en Custom tag rendering, `props` is the current tag attribute, `index` is the order of the current tag, `values` is the value of all tags
+     * @version index、values added in 2.15.0
+     */
+    renderTag?: (props: {
+        value: any;
+        label: ReactNode;
+        closable: boolean;
+        onClose: (event: any) => void;
+    }, index: number, values: ObjectValueType[]) => ReactNode;
+    /**
+     * @zh 移除某一个标签时改变时触发
+     * @en Callback when a tag is removed
+     */
+    onRemove?: (value: T, index: number, event: any) => void;
+    /**
+     * @zh 控件值改变时触发
+     * @en Callback when value changes
+     * @version `reason` in 2.27.0
+     */
+    onChange?: (value: T[], reason: ValueChangeReason) => void;
+    /**
+     * @zh 失去焦点时候触发
+     * @en Callback when input is blurred
+     */
+    onBlur?: (e: any) => void;
+    /**
+     * @zh 聚焦时触发
+     * @en Callback when input is focused
+     */
+    onFocus?: (e: any) => void;
+    /**
+     * @zh 按 enter 键触发
+     * @en Callback when `Enter` key is pressed
+     */
+    onPressEnter?: (e: any) => void;
+    /**
+     * @zh 输入框文本改变的回调。
+     * @en Callback when the value of input changes
+     */
+    onInputChange?: (inputValue: string, event?: any) => void;
+    /**
+     * @zh 键盘事件回调
+     * @en Callback when the keyboard is pressed
+     */
+    onKeyDown?: (e: any) => void;
+    /**
+     * @zh 输入框文本粘贴的回调。
+     * @en Callback when you paste text in input box
+     */
+    onPaste?: (e: any) => void;
+    /**
+     * @zh 点击清除按钮的回调
+     * @en Callback when clear button is clicked
+     * @version 2.20.0
+     */
+    onClear?: () => void;
+    /**
+     * @zh 单击组件的回调。
+     * @en Callback when the component is clicked
+     */
+    onClick?: (e: any) => void;
+    tagClassName?: string;
+    disableInput?: boolean;
+}

package/types/pc/layout/interface.d.ts

@@ -0,0 +1,121 @@
+import { CSSProperties, DetailedHTMLProps, HTMLAttributes, ReactNode } from 'react';
+import { GridResponsiveBreakpoint } from '../grid/interface';
+import { ResizeBoxProps } from '../resize-box';
+import { Omit } from '../utils/type';
+/**
+ * @title Layout
+ */
+export interface LayoutProps extends Omit<DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>, 'className' | 'ref'> {
+    style?: CSSProperties;
+    className?: string | string[];
+    /**
+     * @zh
+     * 表示子元素里有 Sider，一般不用指定。可用于服务端渲染时避免样式闪动
+     * @en
+     * Indicates that there is a `Sider` in the children. Generally no need to specify.
+     * It's used to avoid flicker during server-side rendering
+     */
+    hasSider?: boolean;
+}
+/**
+ * @title Layout.Header
+ */
+export interface HeaderProps extends Omit<DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>, 'className' | 'ref'> {
+    className?: string | string[];
+}
+/**
+ * @title Layout.Footer
+ */
+export interface FooterProps extends Omit<DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>, 'className' | 'ref'> {
+    className?: string | string[];
+}
+/**
+ * @title Layout.Content
+ */
+export interface ContentProps extends Omit<DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>, 'className' | 'ref'> {
+    className?: string | string[];
+}
+/**
+ * @title Layout.Sider
+ */
+export interface SiderProps {
+    children?: ReactNode;
+    style?: CSSProperties;
+    className?: string | string[];
+    sign?: 'sider';
+    /**
+     * @zh 主题颜色
+     * @en Theme of layout
+     * @defaultValue light
+     */
+    theme?: 'dark' | 'light';
+    /**
+     * @zh 当前收起状态
+     * @en Whether sider is collapsed
+     */
+    collapsed?: boolean;
+    /**
+     * @zh 是否可收起
+     * @en Whether sider can be collapsed
+     */
+    collapsible?: boolean;
+    /**
+     * @zh 收缩宽度
+     * @en Width of collapsed sider
+     * @defaultValue 48
+     */
+    collapsedWidth?: number;
+    /**
+     * @zh 是否默认收起
+     * @en Whether sider is collapsed by default
+     */
+    defaultCollapsed?: boolean;
+    /**
+     * @zh 翻转折叠提示箭头的方向，当 Sider 在右边时可以使用
+     * @en Reverse the direction of the fold arrow, can be used when sider is on the right
+     */
+    reverseArrow?: boolean;
+    /**
+     * @zh 自定义底部折叠触发器，设置为 null 时隐藏 trigger
+     * @en Customize the trigger element to collapse sider at bottom. Set it to `null` to hide the trigger
+     */
+    trigger?: string | ReactNode;
+    /**
+     * @zh 宽度
+     * @en Width of sider
+     * @defaultValue 200
+     */
+    width?: number | string;
+    /**
+     * @zh 触发响应式布局的断点, 详见[响应式栅格](/react/component/Grid)
+     * @en Breakpoint in responsive layout. See details [Grid](/react/component/Grid)
+     */
+    breakpoint?: GridResponsiveBreakpoint;
+    /**
+     * @zh 触发响应式布局断点时的回调
+     * @en Callback when responsive layout breakpoint is triggered
+     */
+    onBreakpoint?: (broken: boolean) => void;
+    /**
+     * @zh 展开-收起时的回调函数，有点击 trigger 以及响应式反馈两种方式可以触发
+     * @en Callback when sider collapse state changes
+     */
+    onCollapse?: (collapse: boolean, type: 'clickTrigger' | 'responsive') => void;
+    /**
+     * @zh
+     * 可以用 ResizeBox 替换原生的 `aside` 标签，这个参数即 ResizeBox的 `directions` 参数。
+     * 详情请看 [ResizeBox](/react/component/resize-box)。
+     * @en
+     * You can replace the native `aside` tag with `ResizeBox`, under which case this param will be the `directions` property of `ResizeBox`.
+     * See details [ResizeBox](/react/component/resize-box).
+     */
+    resizeDirections?: string[];
+    /**
+     * @zh 可以接受 `ResizeBox` 所有参数，在伸缩开启时，可以通过 `resizeBoxProps` 对菜单栏的 `width` 进行受控展示或者与 `collapsed` 联动
+     * @en All props of `ResizeBox` can be accepted. The `width` of the menu bar can be displayed in a controlled manner through `resizeBoxProps` or linked with `collapsed`
+     * @version 2.34.0
+     */
+    resizeBoxProps?: ResizeBoxProps;
+    onSiderMount?: (id: string) => void;
+    onSiderUnmount?: (id: string) => void;
+}

package/types/pc/link/interface.d.ts

@@ -0,0 +1,30 @@
+import { AnchorHTMLAttributes, CSSProperties, ReactNode } from 'react';
+/**
+ * @title Link
+ */
+export interface LinkProps extends Omit<AnchorHTMLAttributes<HTMLAnchorElement>, 'className'> {
+    className?: string | string[];
+    style?: CSSProperties;
+    /**
+     * @zh 显示图标，设置为 `true` 时展示默认图标。
+     * @en Custom Icon, Display the default icon when set to `true`.
+     */
+    icon?: ReactNode | boolean;
+    /**
+     * @zh 不同状态
+     * @en The status of `Link`
+     */
+    status?: 'error' | 'success' | 'warning';
+    /**
+     * @zh 是否禁用
+     * @en Whether to disable
+     */
+    disabled?: boolean;
+    /**
+     * @zh 悬浮状态是否有底色
+     * @en Whether to hide background when hover
+     * @defaultValue true
+     * @version 2.23.0
+     */
+    hoverable?: boolean;
+}