lingee-ui 0.0.21 → 0.0.22

package/dist/index-Dmm11UAd.d.ts

@@ -0,0 +1,318 @@
+import React__default, { HTMLAttributes, ReactNode, MouseEvent, Key, CSSProperties } from 'react';
+import { L as LgSize } from './index-B5SLxsZP.js';
+
+/** 预设语义色 */
+type TagPresetColor = "primary" | "info" | "success" | "warning" | "danger" | "amber" | "yellow" | "cyan" | "purple";
+/**
+ * 视觉变体
+ * - text：纯文字，无底色
+ * - tint：纯色浅底，通用标记场景
+ * - filled：实色底 + 反白文字
+ * - line：透明底 + 同色描边
+ * - gradient：渐变浅底，用于提示类徽标（警告 / 建议 / 提示）
+ * - glow：渐变底 + 光斑装饰，用于等级类徽标（钻石 / 黄金 / 铂金）
+ *
+ * text / filled / line 的配色取自组件层 Token，其中没有 yellow，该组合降级为 tint 渲染
+ */
+type TagVariant = "text" | "tint" | "filled" | "line" | "gradient" | "glow";
+/** 标签尺寸 */
+type TagSize = LgSize;
+/** 标签圆角形状（仅 text / tint / filled / line 生效，gradient / glow 圆角由变体规范决定） */
+type TagShape = "pill" | "rounded";
+interface TagProps extends Omit<HTMLAttributes<HTMLSpanElement>, "color"> {
+    /** 色彩：预设语义色 或 任意 CSS 色值字符串，默认 "info" */
+    color?: TagPresetColor | (string & {});
+    /** 视觉变体，默认 "tint" */
+    variant?: TagVariant;
+    /** 尺寸，默认 "md"（sm: 20px, md: 24px, lg: 32px） */
+    size?: TagSize;
+    /** 圆角形状，默认 "pill"（pill: 999px, rounded: 8px） */
+    shape?: TagShape;
+    /** 前缀图标（尺寸由组件统一控制，无需自行设置宽高） */
+    icon?: ReactNode;
+    /** 自定义背景（覆盖默认背景，支持渐变等任意 CSS background 值） */
+    background?: string;
+    /** 是否可关闭（显示关闭按钮） */
+    closable?: boolean;
+    /** 关闭回调 */
+    onClose?: (e: MouseEvent<HTMLSpanElement>) => void;
+    /** 子内容（文字、图标自由组合） */
+    children?: ReactNode;
+}
+
+/**
+ * 树节点尺寸
+ * - sm: 行高 28px
+ * - md: 行高 32px（设计稿基准）
+ * - lg: 行高 36px
+ */
+type TreeSize = "sm" | "md" | "lg";
+/**
+ * 缩进引导线形态
+ * - none: 不显示引导线，仅靠缩进区分层级
+ * - line: 显示纵向引导线（设计稿默认形态）
+ */
+type TreeIndentGuide = "none" | "line";
+/** 触发展开的交互方式，false 表示仅能点击箭头展开 */
+type TreeExpandAction = false | "click" | "doubleClick";
+/** 节点状态标签 */
+interface TreeNodeTag {
+    /** 标签内容 */
+    content: ReactNode;
+    /** Tag 预设语义色，默认 "primary"（与 Tree Item 设计规范一致） */
+    color?: TagPresetColor;
+}
+/** 节点尾部的标准图标操作 */
+interface TreeNodeAction {
+    /** 图标内容 */
+    icon: ReactNode;
+    /** 无障碍名称，同时作为默认 Tooltip 文案 */
+    ariaLabel: string;
+    /** 自定义 Tooltip 文案，缺省时使用 ariaLabel */
+    tooltip?: string;
+    /** 是否禁用；Tree 或节点禁用时同样禁用 */
+    disabled?: boolean;
+    /** 点击回调，接收当前节点与按钮的原始点击事件 */
+    onClick?: (node: TreeNodeData, event: MouseEvent<HTMLButtonElement>) => void;
+}
+/** 自定义尾部内容的渲染上下文 */
+interface TreeNodeExtraRenderContext {
+    /** 当前节点 */
+    node: TreeNodeData;
+    /** Tree 或当前节点是否禁用 */
+    disabled: boolean;
+}
+/** 节点尾部内容，回调形式可感知禁用状态 */
+type TreeNodeExtra = ReactNode | ((context: TreeNodeExtraRenderContext) => ReactNode);
+/** 节点附加内容：紧随标题的标签、尾部内容与标准操作 */
+interface TreeNodeItemPresentation {
+    /** 紧随标题的紧凑状态标签 */
+    tag?: TreeNodeTag;
+    /** 尾部的标准图标操作，点击与拖拽不会作用到节点上 */
+    action?: TreeNodeAction;
+    /** 额外尾部内容；含可交互控件时请用回调形式接收 disabled */
+    extra?: TreeNodeExtra;
+}
+/**
+ * 树节点数据
+ *
+ * 字段名可通过 fieldNames 改写，以适配后端已有的数据结构，
+ * 避免消费方为了对齐组件而额外做一次全量数据转换。
+ */
+interface TreeNodeData {
+    /** 节点唯一标识 */
+    key: Key;
+    /** 节点标题 */
+    title?: ReactNode;
+    /** 子节点 */
+    children?: TreeNodeData[];
+    /**
+     * 节点前置图标，覆盖 Tree 上的全局 icon。
+     * 静态值，不随展开态变化；需要区分开合请用 Tree 的 icon 函数形式
+     */
+    icon?: ReactNode;
+    /** 是否禁用（不可选中、不可高亮） */
+    disabled?: boolean;
+    /** 是否禁用勾选框 */
+    disableCheckbox?: boolean;
+    /** 是否可勾选，checkable 开启时生效 */
+    checkable?: boolean;
+    /** 是否强制视作叶子节点（不显示展开箭头） */
+    isLeaf?: boolean;
+    /** 是否可选中，未设置时沿用 Tree 的 selectable */
+    selectable?: boolean;
+    /** 节点行（lg-tree-treenode）的额外 className */
+    className?: string;
+    /** 节点行（lg-tree-treenode）的行内样式 */
+    style?: CSSProperties;
+    /**
+     * 节点附加内容：状态标签、尾部内容与标准操作。
+     * title 为函数时底层不经过标题渲染流程，该配置不生效
+     */
+    treeItem?: TreeNodeItemPresentation;
+    /** 允许透传业务字段 */
+    [key: string]: any;
+}
+/** 渲染回调中透出的节点状态，用于按状态切换图标 */
+interface TreeNodeState {
+    /** 是否已展开（叶子节点恒为 false） */
+    expanded: boolean;
+    /** 是否为叶子节点 */
+    isLeaf: boolean;
+}
+/** 字段名映射，用于适配非标准数据结构 */
+interface TreeFieldNames {
+    key?: string;
+    title?: string;
+    children?: string;
+}
+/** 勾选回调信息 */
+interface TreeCheckInfo {
+    /** 触发勾选的节点 */
+    node: TreeNodeData;
+    /** 变更后是否勾选 */
+    checked: boolean;
+    /** 全部勾选节点 */
+    checkedNodes: TreeNodeData[];
+    /** 半勾选节点 key（checkStrictly 关闭时有值） */
+    halfCheckedKeys?: Key[];
+}
+/** 选中回调信息 */
+interface TreeSelectInfo {
+    /** 触发选中的节点 */
+    node: TreeNodeData;
+    /** 变更后是否选中 */
+    selected: boolean;
+    /** 全部选中节点 */
+    selectedNodes: TreeNodeData[];
+}
+/** 展开回调信息 */
+interface TreeExpandInfo {
+    /** 触发展开的节点 */
+    node: TreeNodeData;
+    /** 变更后是否展开 */
+    expanded: boolean;
+}
+/** 拖拽放置回调信息 */
+interface TreeDropInfo {
+    /** 被拖拽节点 */
+    dragNode: TreeNodeData;
+    /** 放置目标节点 */
+    node: TreeNodeData;
+    /**
+     * 相对目标节点的插入位置：-1 上方、0 内部、1 下方
+     * dropToGap 为 false 时该值无意义（落在节点内部）
+     */
+    dropPosition: number;
+    /** 是否落在节点之间的空隙（而非节点内部） */
+    dropToGap: boolean;
+}
+/** 拖拽落点校验参数 */
+interface TreeAllowDropOptions {
+    dragNode: TreeNodeData;
+    dropNode: TreeNodeData;
+    dropPosition: -1 | 0 | 1;
+}
+/**
+ * Tree 组件 Props
+ */
+interface TreeProps {
+    /** 节点数据 */
+    treeData?: TreeNodeData[];
+    /** 字段名映射 */
+    fieldNames?: TreeFieldNames;
+    /** 行高尺寸 */
+    size?: TreeSize;
+    /** 展开的节点 key（受控） */
+    expandedKeys?: Key[];
+    /** 默认展开的节点 key */
+    defaultExpandedKeys?: Key[];
+    /** 默认展开全部节点 */
+    defaultExpandAll?: boolean;
+    /** 展开子节点时自动展开其父节点 */
+    autoExpandParent?: boolean;
+    /** 触发展开的交互方式 */
+    expandAction?: TreeExpandAction;
+    /** 展开状态变化回调 */
+    onExpand?: (expandedKeys: Key[], info: TreeExpandInfo) => void;
+    /** 是否可选中 */
+    selectable?: boolean;
+    /** 是否支持多选 */
+    multiple?: boolean;
+    /** 选中的节点 key（受控） */
+    selectedKeys?: Key[];
+    /** 默认选中的节点 key */
+    defaultSelectedKeys?: Key[];
+    /** 选中状态变化回调 */
+    onSelect?: (selectedKeys: Key[], info: TreeSelectInfo) => void;
+    /** 是否显示勾选框 */
+    checkable?: boolean;
+    /** 父子节点勾选状态不再联动 */
+    checkStrictly?: boolean;
+    /** 勾选的节点 key（受控） */
+    checkedKeys?: Key[] | {
+        checked: Key[];
+        halfChecked: Key[];
+    };
+    /** 默认勾选的节点 key */
+    defaultCheckedKeys?: Key[];
+    /** 勾选状态变化回调 */
+    onCheck?: (checkedKeys: Key[] | {
+        checked: Key[];
+        halfChecked: Key[];
+    }, info: TreeCheckInfo) => void;
+    /** 是否显示节点图标 */
+    showIcon?: boolean;
+    /**
+     * 全局节点图标。
+     *
+     * 传函数时可按展开态返回不同图标（如文件夹的开 / 合两态）；
+     * 节点数据上的 `icon` 字段是静态值，做不到随状态切换，
+     * 需要区分开合时应在此处以函数形式提供。
+     */
+    icon?: ReactNode | ((node: TreeNodeData, state: TreeNodeState) => ReactNode);
+    /** 自定义展开箭头，可为函数按节点状态返回 */
+    switcherIcon?: ReactNode | ((state: TreeNodeState) => ReactNode);
+    /** 缩进引导线形态 */
+    indentGuide?: TreeIndentGuide;
+    /**
+     * 自定义单行内容
+     *
+     * 行内 hover 才出现的操作区靠它实现：操作区需 stopPropagation，
+     * 否则点击操作按钮会连带触发节点选中。
+     *
+     * 节点配置了 treeItem 时，返回值作为标题部分，附加内容追加在其后。
+     */
+    titleRender?: (node: TreeNodeData) => ReactNode;
+    /** 异步加载子节点，resolve 后由消费方更新 treeData */
+    loadData?: (node: TreeNodeData) => Promise<unknown>;
+    /** 已加载完成的节点 key（受控） */
+    loadedKeys?: Key[];
+    /** 是否可拖拽排序 */
+    draggable?: boolean | ((node: TreeNodeData) => boolean);
+    /** 校验能否放置到目标位置 */
+    allowDrop?: (options: TreeAllowDropOptions) => boolean;
+    /** 拖拽放置回调 */
+    onDrop?: (info: TreeDropInfo) => void;
+    /** 可视区高度，设置后启用虚拟滚动 */
+    height?: number;
+    /** 虚拟滚动的单项高度，缺省时按 size 推导 */
+    itemHeight?: number;
+    /** 关闭虚拟滚动 */
+    virtual?: boolean;
+    /** 整体禁用 */
+    disabled?: boolean;
+    /** 加载状态，展示遮罩 */
+    loading?: boolean;
+    /** 无数据时的展示内容 */
+    empty?: ReactNode;
+    /** 节点右键回调 */
+    onRightClick?: (info: {
+        event: React.MouseEvent;
+        node: TreeNodeData;
+    }) => void;
+    /**
+     * 展开 / 折叠是否启用高度过渡动效，默认开启
+     *
+     * 虚拟滚动（设置 height）场景下底层不走动效，此项无效
+     */
+    animated?: boolean;
+    /** 额外 className */
+    className?: string;
+    /** 行内样式 */
+    style?: CSSProperties;
+}
+
+/**
+ * Tree 树形控件
+ *
+ * 基于 @rc-component/tree 封装，仅接管视觉与常用能力；
+ * 键盘导航、虚拟滚动、父子勾选联动等由底层提供。
+ *
+ * 类名说明：容器与自定义结构走 BEM（lg-tree__xxx），
+ * 节点内部结构由底层按 prefixCls 生成单横线类名（lg-tree-treenode 等），
+ * 无法改写，故样式表中两种风格并存。
+ */
+declare const Tree: React__default.ForwardRefExoticComponent<TreeProps & React__default.RefAttributes<HTMLDivElement>>;
+
+export { type TagProps as T, type TagPresetColor as a, type TagShape as b, type TagSize as c, type TagVariant as d, Tree as e, type TreeAllowDropOptions as f, type TreeCheckInfo as g, type TreeDropInfo as h, type TreeExpandAction as i, type TreeExpandInfo as j, type TreeFieldNames as k, type TreeIndentGuide as l, type TreeNodeAction as m, type TreeNodeData as n, type TreeNodeExtra as o, type TreeNodeExtraRenderContext as p, type TreeNodeItemPresentation as q, type TreeNodeState as r, type TreeNodeTag as s, type TreeProps as t, type TreeSelectInfo as u, type TreeSize as v };