@tendaui/react 1.1.4 → 1.1.5

package/es/alert/Alert.d.ts

@@ -0,0 +1,7 @@
+import React from "react";
+import { TdAlertProps } from "./type";
+import { StyledProps } from "../common";
+export interface AlertProps extends TdAlertProps, StyledProps {
+}
+declare const Alert: React.ForwardRefExoticComponent<AlertProps & React.RefAttributes<HTMLDivElement>>;
+export default Alert;

package/es/alert/defaultProps.d.ts

@@ -0,0 +1,2 @@
+import { TdAlertProps } from "./type";
+export declare const alertDefaultProps: TdAlertProps;

package/es/alert/index.d.ts

@@ -0,0 +1,5 @@
+import "./style/index.js";
+export type { AlertProps } from "./Alert";
+export * from "./type";
+export declare const Alert: import("react").ForwardRefExoticComponent<import("./Alert").AlertProps & import("react").RefAttributes<HTMLDivElement>>;
+export default Alert;

package/es/alert/style/css.d.ts

@@ -0,0 +1 @@
+export {};

package/es/alert/style/index.d.ts

@@ -0,0 +1 @@
+export {};

package/es/alert/type.d.ts

@@ -0,0 +1,45 @@
+import { TNode, TElement } from "../common";
+import { MouseEvent } from "react";
+export interface TdAlertProps {
+    /**
+     * 关闭按钮。值为 true 则显示默认关闭按钮；值为 false 则不显示按钮；值类型为 string 则直接显示；值类型为 Function 则可以自定关闭按钮
+     * @default false
+     */
+    closeBtn?: TNode;
+    /**
+     * 图标
+     */
+    icon?: TElement;
+    /**
+     * 内容显示最大行数，超出的内容会折叠收起，用户点击后再展开。值为 0 表示不折叠
+     * @default 0
+     */
+    maxLine?: number;
+    /**
+     * 内容（子元素）
+     */
+    message?: TNode;
+    /**
+     * 跟在告警内容后面的操作区
+     */
+    operation?: TElement;
+    /**
+     * 组件风格
+     * @default info
+     */
+    theme?: "success" | "info" | "warning" | "error";
+    /**
+     * 标题
+     */
+    title?: TNode;
+    /**
+     * 关闭按钮点击时触发
+     */
+    onClose?: (context: {
+        e: MouseEvent<HTMLDivElement>;
+    }) => void;
+    /**
+     * 告警提示框关闭动画结束后触发
+     */
+    onClosed?: () => void;
+}

package/es/badge/Badge.d.ts

@@ -0,0 +1,7 @@
+import React from "react";
+import { StyledProps } from "../common";
+import { TdBadgeProps } from "./type";
+export interface BadgeProps extends TdBadgeProps, StyledProps {
+}
+declare const Badge: React.ForwardRefExoticComponent<BadgeProps & React.RefAttributes<HTMLSpanElement>>;
+export default Badge;

package/es/badge/defaultProps.d.ts

@@ -0,0 +1,2 @@
+import { TdBadgeProps } from "./type";
+export declare const badgeDefaultProps: TdBadgeProps;

package/es/badge/index.d.ts

@@ -0,0 +1,5 @@
+import "./style/index.js";
+export type { BadgeProps } from "./Badge";
+export * from "./type";
+export declare const Badge: import("react").ForwardRefExoticComponent<import("./Badge").BadgeProps & import("react").RefAttributes<HTMLSpanElement>>;
+export default Badge;

package/es/badge/style/css.d.ts

@@ -0,0 +1 @@
+export {};

package/es/badge/style/index.d.ts

@@ -0,0 +1 @@
+export {};

package/es/badge/type.d.ts

@@ -0,0 +1,50 @@
+import { TNode } from "../common";
+export interface TdBadgeProps {
+    /**
+     * 徽标内容，同 content
+     */
+    children?: TNode;
+    /**
+     * 颜色
+     * @default ''
+     */
+    color?: string;
+    /**
+     * 徽标内容
+     */
+    content?: TNode;
+    /**
+     * 徽标右上角内容。可以是数字，也可以是文字。如：'new'/3/99+
+     * @default 0
+     */
+    count?: TNode;
+    /**
+     * 是否为红点
+     * @default false
+     */
+    dot?: boolean;
+    /**
+     * 封顶的数字值
+     * @default 99
+     */
+    maxCount?: number;
+    /**
+     * 设置状态点的位置偏移，示例：[-10, 20] 或 ['10em', '8rem']
+     */
+    offset?: Array<string | number>;
+    /**
+     * 形状
+     * @default circle
+     */
+    shape?: "circle" | "round";
+    /**
+     * 当数值为 0 时，是否展示徽标
+     * @default false
+     */
+    showZero?: boolean;
+    /**
+     * 尺寸
+     * @default medium
+     */
+    size?: "small" | "medium";
+}

package/es/button/Button.d.ts

@@ -0,0 +1,6 @@
+import React from "react";
+import { TdButtonProps } from "./type";
+export interface ButtonProps extends Omit<React.AllHTMLAttributes<HTMLElement>, "content" | "shape" | "size" | "type" | "children">, TdButtonProps {
+}
+declare const Button: React.ForwardRefExoticComponent<ButtonProps & React.RefAttributes<HTMLElement>>;
+export default Button;

package/es/button/_example/base.js

@@ -156,7 +156,7 @@ import '../../color-picker/components/panel/saturation.js';
 import '../../color-picker/components/panel/swatches.js';
 import '../../color-picker/ColorPicker.js';
 import '../../color-picker/components/trigger.js';
-import './css.js';
+import '../../color-picker/style/css.js';
 
 function Base() {
   return /* @__PURE__ */React.createElement("div", {

package/es/button/_example/icon.js

@@ -156,7 +156,7 @@ import '../../color-picker/components/panel/saturation.js';
 import '../../color-picker/components/panel/swatches.js';
 import '../../color-picker/ColorPicker.js';
 import '../../color-picker/components/trigger.js';
-import './css.js';
+import '../../color-picker/style/css.js';
 
 function Icon() {
   return /* @__PURE__ */React.createElement("div", {

package/es/button/defaultProps.d.ts

@@ -0,0 +1,2 @@
+import { TdButtonProps } from "./type";
+export declare const buttonDefaultProps: TdButtonProps;

package/es/button/index.d.ts

@@ -0,0 +1,5 @@
+import "./style/index";
+export type { ButtonProps } from "./Button";
+export declare const Button: import("react").ForwardRefExoticComponent<import("./Button").ButtonProps & import("react").RefAttributes<HTMLElement>>;
+export * from "./type";
+export default Button;

package/es/button/style/css.d.ts

@@ -0,0 +1 @@
+export {};

package/es/button/style/index.d.ts

@@ -0,0 +1 @@
+export {};

package/es/button/type.d.ts

@@ -0,0 +1,81 @@
+import { TNode, TElement, SizeEnum } from "../common";
+import { MouseEvent } from "react";
+export interface TdButtonProps {
+    /**
+     * 是否为块级元素
+     * @default false
+     */
+    block?: boolean;
+    /**
+     * 按钮内容，同 content
+     */
+    children?: TNode;
+    /**
+     * 按钮内容
+     */
+    content?: TNode;
+    /**
+     * 禁用状态
+     * @default false
+     */
+    disabled?: boolean;
+    /**
+     * 原生的form属性，支持用于通过 form 属性触发对应 id 的 form 的表单事件
+     */
+    form?: string;
+    /**
+     * 是否为幽灵按钮（镂空按钮）
+     * @default false
+     */
+    ghost?: boolean;
+    /**
+     * 跳转地址。href 存在时，按钮标签默认使用 `<a>` 渲染；如果指定了 `tag` 则使用指定的标签渲染
+     * @default ''
+     */
+    href?: string;
+    /**
+     * 按钮内部图标，可完全自定义
+     */
+    icon?: TElement;
+    /**
+     * 是否显示为加载状态
+     * @default false
+     */
+    loading?: boolean;
+    /**
+     * 按钮形状，有 4 种：长方形、正方形、圆角长方形、圆形
+     * @default rectangle
+     */
+    shape?: "rectangle" | "square" | "round" | "circle";
+    /**
+     * 组件尺寸
+     * @default medium
+     */
+    size?: SizeEnum;
+    /**
+     * 右侧内容，可用于定义右侧图标
+     */
+    suffix?: TElement;
+    /**
+     * 渲染按钮的 HTML 标签，默认使用标签 `<button>` 渲染，可以自定义为 `<a>` `<div>` 等。透传全部 HTML 属性，如：`href/target/data-*` 等。⚠️ 禁用按钮 `<button disabled>`无法显示 Popup 浮层信息，可通过修改 `tag=div` 解决这个问题
+     */
+    tag?: "button" | "a" | "div";
+    /**
+     * 组件风格，依次为默认色、品牌色、危险色、警告色、成功色
+     */
+    theme?: "default" | "primary" | "danger" | "warning" | "success";
+    /**
+     * 按钮类型
+     * @default button
+     */
+    type?: "submit" | "reset" | "button";
+    /**
+     * 按钮形式，基础、线框、虚线、文字
+     * @default base
+     */
+    variant?: "base" | "outline" | "dashed" | "text";
+    /**
+     * 点击时触发
+     */
+    onClick?: (e: MouseEvent<HTMLElement>) => void;
+}

package/es/checkbox/Checkbox.d.ts

@@ -0,0 +1,10 @@
+import React from "react";
+import { CheckProps } from "../common/Check";
+export type CheckboxProps = Omit<CheckProps, "type">;
+declare const Checkbox: React.FunctionComponent<CheckboxProps & React.RefAttributes<HTMLLabelElement>> & {
+    Group: {
+        <T extends import("./type").CheckboxGroupValue = import("./type").CheckboxGroupValue>(props: import("./CheckboxGroup").CheckboxGroupProps<T>): React.JSX.Element;
+        displayName: string;
+    };
+};
+export default Checkbox;

package/es/checkbox/CheckboxGroup.d.ts

@@ -0,0 +1,14 @@
+import React from "react";
+import { CheckboxGroupValue, TdCheckboxGroupProps } from "./type";
+import { StyledProps } from "../common";
+export interface CheckboxGroupProps<T extends CheckboxGroupValue = CheckboxGroupValue> extends TdCheckboxGroupProps<T>, StyledProps {
+    children?: React.ReactNode;
+}
+/**
+ * 多选选项组，里面可以嵌套 <Checkbox />
+ */
+declare const CheckboxGroup: {
+    <T extends CheckboxGroupValue = CheckboxGroupValue>(props: CheckboxGroupProps<T>): React.JSX.Element;
+    displayName: string;
+};
+export default CheckboxGroup;

package/es/checkbox/defaultProps.d.ts

@@ -0,0 +1,3 @@
+import { TdCheckboxProps, TdCheckboxGroupProps } from "./type";
+export declare const checkboxDefaultProps: TdCheckboxProps;
+export declare const checkboxGroupDefaultProps: Partial<TdCheckboxGroupProps>;

package/es/checkbox/index.d.ts

@@ -0,0 +1,11 @@
+import "./style/index.js";
+export type { CheckboxProps } from "./Checkbox";
+export type { CheckboxGroupProps } from "./CheckboxGroup";
+export * from "./type";
+export declare const Checkbox: import("react").FunctionComponent<import("./Checkbox").CheckboxProps & import("react").RefAttributes<HTMLLabelElement>> & {
+    Group: {
+        <T extends import("./type").CheckboxGroupValue = import("./type").CheckboxGroupValue>(props: import("./CheckboxGroup").CheckboxGroupProps<T>): import("react").JSX.Element;
+        displayName: string;
+    };
+};
+export default Checkbox;

package/es/checkbox/style/css.d.ts

@@ -0,0 +1 @@
+export {};

package/es/checkbox/style/index.d.ts

@@ -0,0 +1 @@
+export {};

package/es/checkbox/type.d.ts

@@ -0,0 +1,115 @@
+import { TNode } from "../common";
+import { MouseEvent, ChangeEvent } from "react";
+export interface TdCheckboxProps {
+    /**
+     * 用于标识是否为「全选选项」。单独使用无效，需在 CheckboxGroup 中使用
+     * @default false
+     */
+    checkAll?: boolean;
+    /**
+     * 是否选中
+     * @default false
+     */
+    checked?: boolean;
+    /**
+     * 是否选中，非受控属性
+     * @default false
+     */
+    defaultChecked?: boolean;
+    /**
+     * 多选框内容，同 label
+     */
+    children?: TNode;
+    /**
+     * 是否禁用组件。如果父组件存在 CheckboxGroup，默认值由 CheckboxGroup.disabled 控制。Checkbox.disabled 优先级高于 CheckboxGroup.disabled
+     */
+    disabled?: boolean;
+    /**
+     * 是否为半选
+     * @default false
+     */
+    indeterminate?: boolean;
+    /**
+     * 主文案
+     */
+    label?: TNode;
+    /**
+     * HTML 元素原生属性
+     * @default ''
+     */
+    name?: string;
+    /**
+     * 只读状态
+     * @default false
+     */
+    readonly?: boolean;
+    /**
+     * HTML 原生属性
+     * @default ''
+     */
+    title?: string;
+    /**
+     * 多选框的值
+     */
+    value?: string | number | boolean;
+    /**
+     * 值变化时触发
+     */
+    onChange?: (checked: boolean, context: {
+        e: ChangeEvent<HTMLInputElement>;
+    }) => void;
+    /**
+     * 点击时触发，一般用于外层阻止冒泡场景
+     */
+    onClick?: (context: {
+        e: MouseEvent<HTMLLabelElement>;
+    }) => void;
+}
+export interface TdCheckboxGroupProps<T = CheckboxGroupValue> {
+    /**
+     * 是否禁用组件，默认为 false。CheckboxGroup.disabled 优先级低于 Checkbox.disabled
+     */
+    disabled?: boolean;
+    /**
+     * 支持最多选中的数量
+     */
+    max?: number;
+    /**
+     * 统一设置内部复选框 HTML 属性
+     * @default ''
+     */
+    name?: string;
+    /**
+     * 以配置形式设置子元素。示例1：`['北京', '上海']` ，示例2: `[{ label: '全选', checkAll: true }, { label: '上海', value: 'shanghai' }]`。checkAll 值为 true 表示当前选项为「全选选项」
+     */
+    options?: Array<CheckboxOption>;
+    /**
+     * 选中值
+     * @default []
+     */
+    value?: T;
+    /**
+     * 选中值，非受控属性
+     * @default []
+     */
+    defaultValue?: T;
+    /**
+     * 值变化时触发，`context.current` 表示当前变化的数据值，如果是全选则为空；`context.type` 表示引起选中数据变化的是选中或是取消选中；`context.option` 表示当前变化的数据项
+     */
+    onChange?: (value: T, context: CheckboxGroupChangeContext) => void;
+}
+export type CheckboxOption = string | number | CheckboxOptionObj;
+export interface CheckboxOptionObj {
+    label?: string | TNode;
+    value?: string | number;
+    disabled?: boolean;
+    name?: string;
+    checkAll?: true;
+}
+export type CheckboxGroupValue = Array<string | number | boolean>;
+export interface CheckboxGroupChangeContext {
+    e: ChangeEvent<HTMLDivElement>;
+    current: CheckboxOption | TdCheckboxProps;
+    option: CheckboxOption | TdCheckboxProps;
+    type: "check" | "uncheck";
+}

package/es/color-picker/ColorPickPanel.d.ts

@@ -0,0 +1,4 @@
+import React from "react";
+import { ColorPickerProps } from "./type";
+declare const _default: React.NamedExoticComponent<ColorPickerProps>;
+export default _default;

package/es/color-picker/ColorPicker.d.ts

@@ -0,0 +1,4 @@
+import React from "react";
+import { ColorPickerProps } from "./type";
+declare const _default: React.NamedExoticComponent<ColorPickerProps>;
+export default _default;

package/es/color-picker/components/panel/alpha.d.ts

@@ -0,0 +1,4 @@
+import React from "react";
+import type { TdColorBaseProps } from "../../type";
+declare const _default: React.MemoExoticComponent<(props: TdColorBaseProps) => React.JSX.Element>;
+export default _default;

package/es/color-picker/components/panel/format/index.d.ts

@@ -0,0 +1,10 @@
+import React from "react";
+import { Color } from "../../../utils/color-picker";
+import type { TdColorPickerProps } from "../../../type";
+export interface TdColorFormatProps extends TdColorPickerProps {
+    onInputChange: () => void;
+    baseClassName: string;
+    color: Color;
+}
+declare const _default: React.MemoExoticComponent<(props: TdColorFormatProps) => React.JSX.Element>;
+export default _default;

package/es/color-picker/components/panel/format/inputs.d.ts

@@ -0,0 +1,4 @@
+import React from "react";
+import type { TdColorFormatProps } from ".";
+declare const _default: React.MemoExoticComponent<(props: TdColorFormatProps) => React.JSX.Element>;
+export default _default;

package/es/color-picker/components/panel/header.d.ts

@@ -0,0 +1,13 @@
+import React from "react";
+import { RadioValue } from "../../../radio";
+import { TdColorModes, TdColorPickerProps } from "../../type";
+export interface ColorPanelHeaderProps extends TdColorPickerProps {
+    mode?: TdColorModes;
+    colorModes?: Array<TdColorModes>;
+    onModeChange?: (value: RadioValue, context: {
+        e: React.ChangeEvent<HTMLInputElement>;
+    }) => void;
+    baseClassName?: string;
+}
+declare const _default: React.MemoExoticComponent<(props: ColorPanelHeaderProps) => React.JSX.Element>;
+export default _default;

package/es/color-picker/components/panel/hue.d.ts

@@ -0,0 +1,4 @@
+import React from "react";
+import type { TdColorBaseProps } from "../../type";
+declare const _default: React.MemoExoticComponent<(props: TdColorBaseProps) => React.JSX.Element>;
+export default _default;

package/es/color-picker/components/panel/index.d.ts

@@ -0,0 +1,4 @@
+import React from "react";
+import type { ColorPickerProps } from "../../type";
+declare const _default: React.MemoExoticComponent<React.ForwardRefExoticComponent<ColorPickerProps & React.RefAttributes<HTMLDivElement>>>;
+export default _default;

package/es/color-picker/components/panel/saturation.d.ts

@@ -0,0 +1,4 @@
+import React from "react";
+import type { TdColorBaseProps } from "../../type";
+declare const _default: React.MemoExoticComponent<(props: TdColorBaseProps) => React.JSX.Element>;
+export default _default;

package/es/color-picker/components/panel/slider.d.ts

@@ -0,0 +1,11 @@
+import React, { CSSProperties } from "react";
+import type { TdColorBaseProps } from "../../type";
+export interface TdColorSliderProps extends TdColorBaseProps {
+    className?: string;
+    value?: number;
+    maxValue?: number;
+    railStyle?: CSSProperties;
+    type: "hue" | "alpha";
+}
+declare const _default: React.MemoExoticComponent<(props: TdColorSliderProps) => React.JSX.Element>;
+export default _default;

package/es/color-picker/components/panel/swatches.d.ts

@@ -0,0 +1,11 @@
+import React from "react";
+import { TdColorBaseProps } from "../../type";
+export interface TdColorSwatchesProps extends TdColorBaseProps {
+    colors?: string[];
+    title?: string;
+    editable?: boolean;
+    onSetColor?: (color: string) => void;
+    handleAddColor?: () => void;
+}
+declare const _default: React.MemoExoticComponent<(props: TdColorSwatchesProps) => React.JSX.Element>;
+export default _default;

package/es/color-picker/components/trigger.d.ts

@@ -0,0 +1,9 @@
+import React from "react";
+import { TdColorPickerProps } from "../type";
+import { TdColorContext } from "../type";
+export interface ColorTriggerProps extends Pick<TdColorPickerProps, "disabled" | "inputProps" | "borderless" | "clearable" | "onClear"> {
+    value?: string;
+    onChange?: (v?: string, context?: TdColorContext) => void;
+}
+declare const _default: React.MemoExoticComponent<(props: ColorTriggerProps) => React.JSX.Element>;
+export default _default;

package/es/color-picker/defaultProps.d.ts

@@ -0,0 +1,2 @@
+import { TdColorPickerProps } from "./type";
+export declare const colorPickerDefaultProps: TdColorPickerProps;

package/es/color-picker/helpers.d.ts

@@ -0,0 +1,5 @@
+import { ColorObject, ColorPickerChangeTrigger, TdColorContext } from "./type";
+export declare const DEFAULT_COLOR = "#0052D9";
+export declare const normalizeColorValue: (value?: string | null) => string;
+export declare const buildColorObject: (value: string) => ColorObject;
+export declare const buildChangeContext: (value: string, trigger: ColorPickerChangeTrigger) => TdColorContext;

package/es/color-picker/hooks/useClassNames.d.ts

@@ -0,0 +1,2 @@
+declare const useClassNames: () => string;
+export default useClassNames;

package/es/color-picker/hooks/useStyles.d.ts

@@ -0,0 +1,14 @@
+import { CSSProperties, MutableRefObject } from "react";
+import type { Color } from "../utils/color-picker/color";
+export interface TdColorSliderStyleParams {
+    color: Color;
+    value: number;
+    maxValue: number;
+    type: "hue" | "alpha";
+}
+declare const useStyles: (params: TdColorSliderStyleParams, panelRectRef: MutableRefObject<{
+    width: number;
+}>) => {
+    styles: CSSProperties;
+};
+export default useStyles;

package/es/color-picker/index.d.ts

@@ -0,0 +1,6 @@
+import "./style";
+export type { ColorPickerProps } from "./type";
+export * from "./type";
+export declare const ColorPickerPanel: import("react").NamedExoticComponent<import("./type").ColorPickerProps>;
+export declare const ColorPicker: import("react").NamedExoticComponent<import("./type").ColorPickerProps>;
+export default ColorPicker;

package/es/color-picker/index.js

@@ -1,6 +1,6 @@
 import _ColorPickPanel from './ColorPickPanel.js';
 import _ColorPicker from './ColorPicker.js';
-import './css.js';
+import './style/css.js';
 import '../_chunks/dep-Cwish4GD.js';
 import '../_chunks/dep-D-UKOauR.js';
 import 'react';

package/es/color-picker/style/css.d.ts

@@ -0,0 +1 @@
+export {};

package/es/color-picker/style/css.js

@@ -0,0 +1 @@
+import "./index.css";

package/es/color-picker/style/index.d.ts

@@ -0,0 +1 @@
+export {};