@rainbow-oh/yee-c 0.8.16 → 0.8.18

package/dist/cjs/Select/demo/loading.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const _default: () => React.JSX.Element;
+export default _default;

package/dist/cjs/Select/demo/loading.js

@@ -0,0 +1,61 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/Select/demo/loading.tsx
+var loading_exports = {};
+__export(loading_exports, {
+  default: () => loading_default
+});
+module.exports = __toCommonJS(loading_exports);
+var import_yee_c = require("../..");
+var import_react = __toESM(require("react"));
+var options = [
+  { label: "Apple", value: "apple" },
+  { label: "Banana", value: "banana" },
+  { label: "Orange", value: "orange" }
+];
+var loading_default = () => {
+  return /* @__PURE__ */ import_react.default.createElement(import_yee_c.Space, { direction: "vertical" }, /* @__PURE__ */ import_react.default.createElement(
+    import_yee_c.Select,
+    {
+      loading: true,
+      options,
+      style: { width: 200 },
+      placeholder: "Loading"
+    }
+  ), /* @__PURE__ */ import_react.default.createElement(
+    import_yee_c.Select,
+    {
+      loading: true,
+      disabled: true,
+      defaultValue: "apple",
+      options,
+      style: { width: 200 }
+    }
+  ));
+};

package/dist/cjs/Select/interface.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="react" />
-import type { TriggerProps } from '../Trigger';
 import type { SelectorProps } from '../Selector';
+import type { TriggerProps } from '../Trigger';
 import type { DataAttributeProps } from '../utils/types';
 export type Option = {
     /**
@@ -58,6 +58,11 @@ export interface SelectProps extends DataAttributeProps, Pick<SelectorProps, 'si
      * Whether disabled
      */
     disabled?: boolean;
+    /**
+     * Whether data is loading
+     * @default false
+     */
+    loading?: boolean;
     /**
      * Placeholder text for the select box
      */

package/dist/cjs/Select/select.js

@@ -92,6 +92,7 @@ var Select = (baseprops) => {
     defaultValue,
     optionFilterProp = "label",
     disabled,
+    loading,
     onChange,
     onFilter,
     virtual,
@@ -111,6 +112,7 @@ var Select = (baseprops) => {
     "defaultValue",
     "optionFilterProp",
     "disabled",
+    "loading",
     "onChange",
     "onFilter",
     "virtual",
@@ -267,6 +269,7 @@ var Select = (baseprops) => {
         value: searchValue,
         options,
         disabled,
+        loading,
         selectedKeys: mergedValue,
         onOpenChange: handleOpenChange,
         onClear: handleClear,

package/dist/cjs/Selector/selector.js

@@ -265,7 +265,16 @@ var Selector = import_react.default.forwardRef(
       ));
     };
     const renderSuffix = () => {
-      return /* @__PURE__ */ import_react.default.createElement("span", { className: `${prefixCls}-arrow` }, loading ? /* @__PURE__ */ import_react.default.createElement(import_Spin.default, { size: "small" }) : suffix ? typeof suffix === "function" ? suffix() : suffix : /* @__PURE__ */ import_react.default.createElement(import_lucide_react.ChevronDown, { size: 16, strokeWidth: 1.5 }));
+      return /* @__PURE__ */ import_react.default.createElement("span", { className: `${prefixCls}-arrow` }, loading ? /* @__PURE__ */ import_react.default.createElement(
+        import_Spin.default,
+        {
+          variant: "ring",
+          size: "small",
+          style: {
+            "--m-indicator-dot-bg-color": "var(--yee-text-color-secondary)"
+          }
+        }
+      ) : suffix ? typeof suffix === "function" ? suffix() : suffix : /* @__PURE__ */ import_react.default.createElement(import_lucide_react.ChevronDown, { size: 16, strokeWidth: 1.5 }));
     };
     const renderClear = () => {
       if (!allowClear || disabled) {

package/dist/cjs/TableSelect/interface.d.ts

@@ -112,6 +112,11 @@ export interface TableSelectProps extends Omit<InternalTableProps, 'value' | 'on
      * Whether disabled
      */
     disabled?: boolean;
+    /**
+     * Whether data is loading
+     * @default false
+     */
+    loading?: boolean;
     /**
      * Input direction (for special scenarios)
      */

package/dist/cjs/TableSelect/table-select.js

@@ -90,6 +90,7 @@ var TableSelect = (baseprops) => {
     defaultValue,
     placement = "bottomLeft",
     disabled,
+    loading,
     rowSelection,
     dataSource,
     rowKey = "id",
@@ -108,6 +109,7 @@ var TableSelect = (baseprops) => {
     "defaultValue",
     "placement",
     "disabled",
+    "loading",
     "rowSelection",
     "dataSource",
     "rowKey",
@@ -205,6 +207,7 @@ var TableSelect = (baseprops) => {
     options: selectorOptions,
     open,
     disabled,
+    loading,
     value: searchValue,
     selectedKeys: mergedValue,
     onSearch: handleSearch,

package/dist/cjs/Tree/interface.d.ts

@@ -61,6 +61,13 @@ export type TreeNode<T> = {
      * All descendant uids (collected bottom-up). Used for check/uncheck propagation.
      */
     childUids?: Array<string>;
+    /**
+     * Extra content rendered after the label (e.g. tags, badges, action buttons).
+     * Only takes effect when `labelRender` is NOT provided at the Tree level.
+     * When `labelRender` is present, access this value via `node.extra` in your
+     * custom render function.
+     */
+    extra?: React.ReactNode | ((node: T) => React.ReactNode);
     /**
      * Original data
      */
@@ -157,6 +164,14 @@ export interface TreeProps<T> extends DataAttributeProps {
      *  @default false
      */
     multiple?: boolean;
+    /**
+     * Custom render function for node label.
+     * When provided, takes full control of the label area rendering.
+     * The node's `extra` will NOT be appended automatically in this case;
+     * access it via `node.extra` if you need it in your custom render.
+     * The original `label` string is still used for `title` attribute fallback.
+     */
+    labelRender?: (node: TreeNode<T>) => React.ReactNode;
     /**
      * Customize node key, title, children field names
      */
@@ -164,6 +179,7 @@ export interface TreeProps<T> extends DataAttributeProps {
         key?: keyof T;
         label?: keyof T;
         children?: keyof T;
+        extra?: keyof T;
     };
     /**
      * Asynchronous data loading

package/dist/cjs/Tree/tree-node.js

@@ -64,6 +64,7 @@ var Node = (props) => {
     disabled,
     depth,
     icon,
+    extra,
     original,
     lines
   } = node;
@@ -78,6 +79,7 @@ var Node = (props) => {
     indeterminateUids,
     expandedUids,
     switcherIcon,
+    labelRender,
     draggable,
     draggingUid,
     dropState,
@@ -132,6 +134,8 @@ var Node = (props) => {
     const _title = title || (typeof label === "string" ? label : void 0);
     const mergedIcon = icon || contextIcon;
     const _icon = typeof mergedIcon === "function" ? mergedIcon(original) : mergedIcon;
+    const content = labelRender ? labelRender(node) : label;
+    const _extra = !labelRender && extra ? typeof extra === "function" ? extra(original) : extra : null;
     return /* @__PURE__ */ import_react.default.createElement(
       import_Button.default,
       {
@@ -144,7 +148,8 @@ var Node = (props) => {
         icon: showIcon ? _icon : void 0,
         onClick: disabled ? void 0 : () => onSelect(uid)
       },
-      label
+      content,
+      _extra && /* @__PURE__ */ import_react.default.createElement("span", { className: `${prefixCls}-node-extra` }, _extra)
     );
   };
   const renderEmptyNodes = (depth2) => {
@@ -166,7 +171,7 @@ var Node = (props) => {
       {
         "aria-hidden": "true",
         className: `${prefixCls}-node-indent`,
-        key: index
+        key: `node-empty-${index}`
       }
     ));
   };

package/dist/cjs/Tree/tree.d.ts

@@ -1,5 +1,5 @@
 import React, { ChangeEvent } from 'react';
-import type { DragPosition, TreeProps } from './interface';
+import type { DragPosition, TreeNode, TreeProps } from './interface';
 import './style/index.less';
 type DropState = {
     uid: string;
@@ -12,6 +12,7 @@ export declare const TreeContext: React.Context<{
     icon?: React.ReactNode | ((props: any) => React.ReactNode);
     showLine?: boolean | undefined;
     switcherIcon?: [React.ReactNode, React.ReactNode] | undefined;
+    labelRender?: ((node: TreeNode<any>) => React.ReactNode) | undefined;
     selectedUids: Set<string>;
     checkedUids: Set<string>;
     indeterminateUids: Set<string>;

package/dist/cjs/Tree/tree.js

@@ -184,6 +184,7 @@ var Tree = (baseprops) => {
     onSelect,
     onCheck,
     onExpand,
+    labelRender,
     virtual = false,
     height,
     itemHeight = 28
@@ -212,6 +213,7 @@ var Tree = (baseprops) => {
     "onSelect",
     "onCheck",
     "onExpand",
+    "labelRender",
     "virtual",
     "height",
     "itemHeight"
@@ -498,6 +500,7 @@ var Tree = (baseprops) => {
       icon,
       showLine,
       switcherIcon,
+      labelRender,
       selectedUids: selectedUidSet,
       checkedUids: checkedUidSet,
       indeterminateUids: indeterminateUidSet,
@@ -520,6 +523,7 @@ var Tree = (baseprops) => {
       icon,
       showLine,
       switcherIcon,
+      labelRender,
       selectedUidSet,
       checkedUidSet,
       indeterminateUidSet,
@@ -609,14 +613,14 @@ var Tree = (baseprops) => {
       role: "tree",
       onDragEnd: handleDragEnd
     }, dataAttrs),
-    /* @__PURE__ */ import_react2.default.createElement(TreeContext.Provider, { value: contextValue }, /* @__PURE__ */ import_react2.default.createElement(import_react.AnimatePresence, { initial: false }, segments.map((segment) => {
+    /* @__PURE__ */ import_react2.default.createElement(TreeContext.Provider, { value: contextValue }, /* @__PURE__ */ import_react2.default.createElement(import_react.AnimatePresence, { initial: false }, segments.map((segment, index) => {
       if (segment.type === "node") {
         return /* @__PURE__ */ import_react2.default.createElement(import_tree_node.default, { node: segment.node, key: segment.node.uid });
       }
       return /* @__PURE__ */ import_react2.default.createElement(
         import_react.motion.div,
         {
-          key: segment.pUid + "
children",
+          key: segment.pUid + index + "
children",
           initial: { height: 0, opacity: 0 },
           animate: { height: "auto", opacity: 1 },
           exit: { height: 0, opacity: 0 },

package/dist/cjs/Tree/utils/tree-tools.d.ts

@@ -49,6 +49,7 @@ export declare function tree2array<T extends Record<string, unknown>>(tree: T |
     key: keyof T;
     label: keyof T;
     children: keyof T;
+    extra?: keyof T;
 }): [TreeNode<T>[], Map<string, TreeNode<T>>];
 /**
  * Check whether array `a` contains every element in `b`.

package/dist/cjs/Tree/utils/tree-tools.js

@@ -135,7 +135,7 @@ function tree2array(tree, fieldNames) {
   const data = Array.isArray(tree) ? tree : [tree];
   const res = [];
   const map = /* @__PURE__ */ new Map();
-  const { key, label, children } = fieldNames;
+  const { key, label, children, extra } = fieldNames;
   function walk({
     data: node,
     pUid,
@@ -147,6 +147,7 @@ function tree2array(tree, fieldNames) {
     const rawKey = node[key];
     const _label = node[label];
     const _children = node[children];
+    const _extra = extra ? node[extra] : node.extra;
     const nextPath = [...path, rawKey];
     const uid = pUid ? `${pUid}\0${String(rawKey)}` : String(rawKey);
     const isParent = Array.isArray(_children) && _children.length > 0;
@@ -155,6 +156,7 @@ function tree2array(tree, fieldNames) {
       key: rawKey,
       label: _label,
       title: node.title,
+      extra: _extra,
       path,
       pUid,
       depth,

package/dist/cjs/TreeSelect/interface.d.ts

@@ -34,6 +34,11 @@ export interface TreeSelectProps<T = any> extends Omit<TreeProps<T>, 'onSelect'
      * Whether disabled
      */
     disabled?: boolean;
+    /**
+     * Whether data is loading
+     * @default false
+     */
+    loading?: boolean;
     /**
      * Placeholder text for the select box
      */

package/dist/cjs/TreeSelect/tree-select.js

@@ -89,7 +89,8 @@ var TreeSelect = (baseprops) => {
     defaultValue,
     checkable = false,
     multiple = false,
-    optionLabelProp: optionLabelProp = "label",
+    loading: loading,
+    optionLabelProp = "label",
     onChange,
     onFilter
   } = _a, rest = __objRest(_a, [
@@ -103,6 +104,7 @@ var TreeSelect = (baseprops) => {
     "checkable",
     "multiple",
     // eslint-disable-line @typescript-eslint/no-unused-vars
+    "loading",
     "optionLabelProp",
     "onChange",
     "onFilter"
@@ -267,6 +269,7 @@ var TreeSelect = (baseprops) => {
         mode,
         value: searchValue,
         options: selectedOptions,
+        loading,
         selectedKeys: mergedValue,
         onOpenChange: handleOpenChange,
         onClear: handleClear,

package/dist/cjs/style/themes.css

@@ -1,7 +1,7 @@
 /*!
  * @rainbow-oh/yee-c CSS Variables
  * Auto-generated, do not edit manually
- * Generated on 2026-08-03T08:40:43.552Z
+ * Generated on 2026-08-11T09:02:55.587Z
  */
 
 /* ========== color.blue.css ========== */

package/dist/cjs/style/variables.css

@@ -1,7 +1,7 @@
 /*!
  * @rainbow-oh/yee-c CSS Variables
  * Auto-generated, do not edit manually
- * Generated on 2026-08-03T08:40:43.552Z
+ * Generated on 2026-08-11T09:02:55.587Z
  */
 
 /* ========== color.css ========== */

package/dist/cjs/version.d.ts

@@ -3,4 +3,4 @@ declare global {
         __yee_c_version__: string;
     }
 }
-export declare const version = "0.8.16";
+export declare const version = "0.8.18";

package/dist/cjs/version.js

@@ -22,7 +22,7 @@ __export(version_exports, {
   version: () => version
 });
 module.exports = __toCommonJS(version_exports);
-var version = "0.8.16";
+var version = "0.8.18";
 if (typeof window !== "undefined") {
   window.__yee_c_version__ = version;
 }

package/dist/esm/Select/demo/loading.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const _default: () => React.JSX.Element;
+export default _default;

package/dist/esm/Select/demo/loading.js

@@ -0,0 +1,32 @@
+import { Select, Space } from "../..";
+import React from 'react';
+var options = [{
+  label: 'Apple',
+  value: 'apple'
+}, {
+  label: 'Banana',
+  value: 'banana'
+}, {
+  label: 'Orange',
+  value: 'orange'
+}];
+export default (function () {
+  return /*#__PURE__*/React.createElement(Space, {
+    direction: "vertical"
+  }, /*#__PURE__*/React.createElement(Select, {
+    loading: true,
+    options: options,
+    style: {
+      width: 200
+    },
+    placeholder: "Loading"
+  }), /*#__PURE__*/React.createElement(Select, {
+    loading: true,
+    disabled: true,
+    defaultValue: "apple",
+    options: options,
+    style: {
+      width: 200
+    }
+  }));
+});

package/dist/esm/Select/interface.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="react" />
-import type { TriggerProps } from '../Trigger';
 import type { SelectorProps } from '../Selector';
+import type { TriggerProps } from '../Trigger';
 import type { DataAttributeProps } from '../utils/types';
 export type Option = {
     /**
@@ -58,6 +58,11 @@ export interface SelectProps extends DataAttributeProps, Pick<SelectorProps, 'si
      * Whether disabled
      */
     disabled?: boolean;
+    /**
+     * Whether data is loading
+     * @default false
+     */
+    loading?: boolean;
     /**
      * Placeholder text for the select box
      */

package/dist/esm/Select/select.js

@@ -1,4 +1,4 @@
-var _excluded = ["prefixCls", "options", "placement", "mode", "value", "defaultValue", "optionFilterProp", "disabled", "onChange", "onFilter", "virtual", "itemHeight", "listHeight", "columns", "popupWidth", "looseMatch", "orphanClassName", "orphanStyle"];
+var _excluded = ["prefixCls", "options", "placement", "mode", "value", "defaultValue", "optionFilterProp", "disabled", "loading", "onChange", "onFilter", "virtual", "itemHeight", "listHeight", "columns", "popupWidth", "looseMatch", "orphanClassName", "orphanStyle"];
 function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
 function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
@@ -56,6 +56,7 @@ var Select = function Select(baseprops) {
     _props$optionFilterPr = props.optionFilterProp,
     optionFilterProp = _props$optionFilterPr === void 0 ? 'label' : _props$optionFilterPr,
     disabled = props.disabled,
+    loading = props.loading,
     onChange = props.onChange,
     onFilter = props.onFilter,
     virtual = props.virtual,
@@ -232,6 +233,7 @@ var Select = function Select(baseprops) {
     value: searchValue,
     options: options,
     disabled: disabled,
+    loading: loading,
     selectedKeys: mergedValue,
     onOpenChange: handleOpenChange,
     onClear: handleClear,

package/dist/esm/Selector/selector.js

@@ -177,7 +177,11 @@ var Selector = /*#__PURE__*/React.forwardRef(function (props, ref) {
     return /*#__PURE__*/React.createElement("span", {
       className: "".concat(prefixCls, "-arrow")
     }, loading ? /*#__PURE__*/React.createElement(Spin, {
-      size: "small"
+      variant: "ring",
+      size: "small",
+      style: {
+        '--m-indicator-dot-bg-color': 'var(--yee-text-color-secondary)'
+      }
     }) : suffix ? typeof suffix === 'function' ? suffix() : suffix : /*#__PURE__*/React.createElement(ChevronDown, {
       size: 16,
       strokeWidth: 1.5

package/dist/esm/TableSelect/interface.d.ts

@@ -112,6 +112,11 @@ export interface TableSelectProps extends Omit<InternalTableProps, 'value' | 'on
      * Whether disabled
      */
     disabled?: boolean;
+    /**
+     * Whether data is loading
+     * @default false
+     */
+    loading?: boolean;
     /**
      * Input direction (for special scenarios)
      */

package/dist/esm/TableSelect/table-select.js

@@ -1,5 +1,5 @@
 function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
-var _excluded = ["prefixCls", "value", "defaultValue", "placement", "disabled", "rowSelection", "dataSource", "rowKey", "optionLabelProp", "allowClear", "closable", "searchable", "searchOnInput", "placeholder", "onChange", "onSearch", "onOpenChange"];
+var _excluded = ["prefixCls", "value", "defaultValue", "placement", "disabled", "loading", "rowSelection", "dataSource", "rowKey", "optionLabelProp", "allowClear", "closable", "searchable", "searchOnInput", "placeholder", "onChange", "onSearch", "onOpenChange"];
 function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
@@ -51,6 +51,7 @@ var TableSelect = function TableSelect(baseprops) {
     _props$placement = props.placement,
     placement = _props$placement === void 0 ? 'bottomLeft' : _props$placement,
     disabled = props.disabled,
+    loading = props.loading,
     rowSelection = props.rowSelection,
     dataSource = props.dataSource,
     _props$rowKey = props.rowKey,
@@ -152,6 +153,7 @@ var TableSelect = function TableSelect(baseprops) {
     options: selectorOptions,
     open: open,
     disabled: disabled,
+    loading: loading,
     value: searchValue,
     selectedKeys: mergedValue,
     onSearch: handleSearch,

package/dist/esm/Tree/interface.d.ts

@@ -61,6 +61,13 @@ export type TreeNode<T> = {
      * All descendant uids (collected bottom-up). Used for check/uncheck propagation.
      */
     childUids?: Array<string>;
+    /**
+     * Extra content rendered after the label (e.g. tags, badges, action buttons).
+     * Only takes effect when `labelRender` is NOT provided at the Tree level.
+     * When `labelRender` is present, access this value via `node.extra` in your
+     * custom render function.
+     */
+    extra?: React.ReactNode | ((node: T) => React.ReactNode);
     /**
      * Original data
      */
@@ -157,6 +164,14 @@ export interface TreeProps<T> extends DataAttributeProps {
      *  @default false
      */
     multiple?: boolean;
+    /**
+     * Custom render function for node label.
+     * When provided, takes full control of the label area rendering.
+     * The node's `extra` will NOT be appended automatically in this case;
+     * access it via `node.extra` if you need it in your custom render.
+     * The original `label` string is still used for `title` attribute fallback.
+     */
+    labelRender?: (node: TreeNode<T>) => React.ReactNode;
     /**
      * Customize node key, title, children field names
      */
@@ -164,6 +179,7 @@ export interface TreeProps<T> extends DataAttributeProps {
         key?: keyof T;
         label?: keyof T;
         children?: keyof T;
+        extra?: keyof T;
     };
     /**
      * Asynchronous data loading

package/dist/esm/Tree/tree-node.js

@@ -21,6 +21,7 @@ var Node = function Node(props) {
     disabled = node.disabled,
     depth = node.depth,
     icon = node.icon,
+    extra = node.extra,
     original = node.original,
     lines = node.lines;
   var _useContext = useContext(TreeContext),
@@ -34,6 +35,7 @@ var Node = function Node(props) {
     indeterminateUids = _useContext.indeterminateUids,
     expandedUids = _useContext.expandedUids,
     switcherIcon = _useContext.switcherIcon,
+    labelRender = _useContext.labelRender,
     draggable = _useContext.draggable,
     draggingUid = _useContext.draggingUid,
     dropState = _useContext.dropState,
@@ -86,6 +88,12 @@ var Node = function Node(props) {
     var _title = title || (typeof label === 'string' ? label : undefined);
     var mergedIcon = icon || contextIcon;
     var _icon = typeof mergedIcon === 'function' ? mergedIcon(original) : mergedIcon;
+
+    // labelRender takes full control of the label content when provided
+    var content = labelRender ? labelRender(node) : label;
+
+    // extra: appended after the label content (only when labelRender is NOT used)
+    var _extra = !labelRender && extra ? typeof extra === 'function' ? extra(original) : extra : null;
     return /*#__PURE__*/React.createElement(Button, {
       className: clsx("".concat(prefixCls, "-node-label"), _defineProperty({}, "".concat(prefixCls, "-node-label-selected"), selected)),
       size: "small",
@@ -95,7 +103,9 @@ var Node = function Node(props) {
       onClick: disabled ? undefined : function () {
         return onSelect(uid);
       }
-    }, label);
+    }, content, _extra && /*#__PURE__*/React.createElement("span", {
+      className: "".concat(prefixCls, "-node-extra")
+    }, _extra));
   };
   var renderEmptyNodes = function renderEmptyNodes(depth) {
     var temp = new Array(depth).fill(0);
@@ -111,7 +121,7 @@ var Node = function Node(props) {
       return /*#__PURE__*/React.createElement("span", {
         "aria-hidden": "true",
         className: "".concat(prefixCls, "-node-indent"),
-        key: index
+        key: "node-empty-".concat(index)
       });
     });
   };

package/dist/esm/Tree/tree.d.ts

@@ -1,5 +1,5 @@
 import React, { ChangeEvent } from 'react';
-import type { DragPosition, TreeProps } from './interface';
+import type { DragPosition, TreeNode, TreeProps } from './interface';
 import './style/index.less';
 type DropState = {
     uid: string;
@@ -12,6 +12,7 @@ export declare const TreeContext: React.Context<{
     icon?: React.ReactNode | ((props: any) => React.ReactNode);
     showLine?: boolean | undefined;
     switcherIcon?: [React.ReactNode, React.ReactNode] | undefined;
+    labelRender?: ((node: TreeNode<any>) => React.ReactNode) | undefined;
     selectedUids: Set<string>;
     checkedUids: Set<string>;
     indeterminateUids: Set<string>;