tdesign-react 0.17.0 → 0.18.2

package/es/tree/TreeItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"TreeItem.js","sources":["../../src/tree/TreeItem.tsx"],"sourcesContent":["import React, { forwardRef, MouseEvent, ReactNode, useRef } from 'react';\nimport classNames from 'classnames';\nimport { CaretRightSmallIcon, LoadingIcon } from 'tdesign-icons-react';\nimport useRipple from '../_util/useRipple';\nimport TreeNode from '../_common/js/tree/tree-node';\nimport Checkbox from '../checkbox';\nimport { useTreeConfig } from './useTreeConfig';\nimport { TreeItemProps } from './interface';\n\n/**\n * 树节点组件\n */\nconst TreeItem = forwardRef((props: TreeItemProps, ref: React.Ref<HTMLDivElement>) => {\n  const { node, icon, label, line, expandOnClickNode, activable, checkProps, operations, onClick, onChange } = props;\n  const { level } = node;\n\n  const { treeClassNames } = useTreeConfig();\n\n  const handleClick = (evt: MouseEvent<HTMLDivElement>) => {\n    onClick?.(node, {\n      event: evt,\n      expand: expandOnClickNode,\n      active: activable,\n    });\n  };\n\n  const handleItemClick = (evt: MouseEvent<HTMLDivElement>) => {\n    if (node.loading) {\n      return;\n    }\n    onClick?.(node, {\n      event: evt,\n      expand: true,\n      active: false,\n    });\n  };\n\n  const handleIconClick = (evt: MouseEvent<HTMLDivElement>) => {\n    evt.stopPropagation();\n    handleItemClick(evt);\n  };\n\n  const stopPropagation = (e: MouseEvent) => {\n    e.stopPropagation();\n  };\n\n  /* ======== render ======= */\n  const renderIcon = () => {\n    // 这里按 vue 的逻辑定义\n    let isDefaultIcon = false;\n    const renderIconNode = () => {\n      if (icon === false) {\n        return null;\n      }\n      if (icon instanceof Function) {\n        return icon(node.getModel());\n      }\n      if (React.isValidElement(icon)) {\n        return icon;\n      }\n      if (icon && icon !== true) {\n        // 非 ReactNode、Function、Boolean 类型，抛出错误提示\n        throw new Error('invalid type of icon');\n      }\n\n      if (!node.isLeaf()) {\n        isDefaultIcon = true;\n        if (node.loading && node.expanded) {\n          return <LoadingIcon className={treeClassNames.loading} />;\n        }\n\n        return <CaretRightSmallIcon className={treeClassNames.treeIconRight} />;\n      }\n      return null;\n    };\n\n    const iconNode = renderIconNode();\n    return (\n      <span\n        className={classNames(treeClassNames.treeIcon, treeClassNames.folderIcon, {\n          [treeClassNames.treeIconDefault]: isDefaultIcon,\n        })}\n        onClick={handleIconClick}\n      >\n        {iconNode}\n      </span>\n    );\n  };\n\n  const renderLine = () => {\n    const iconVisible = icon !== false;\n\n    if (line === false) {\n      return null;\n    }\n\n    if (line instanceof Function) {\n      return line(node.getModel());\n    }\n\n    if (React.isValidElement(line)) {\n      return line;\n    }\n\n    if (node.parent && node.tree) {\n      // 如果节点的父节点，不是最后的节点\n      // 则需要绘制节点延长线\n      const shadowStyles: string[] = [];\n      const parents = node.getParents();\n      parents.pop();\n      parents.forEach((pnode: TreeNode, index: number) => {\n        if (!pnode.vmIsLast) {\n          shadowStyles.push(`calc(-${index + 1} * var(--space)) 0 var(--color)`);\n        }\n      });\n\n      const styles = {\n        '--level': level,\n        boxShadow: shadowStyles.join(','),\n      };\n\n      return (\n        <span\n          className={classNames(\n            // 每个节点绘制抵达上一层级的折线\n            treeClassNames.line,\n            {\n              // 叶子节点，折线宽度延长，因为没有 icon 呈现\n              // 任意节点，icon 不呈现时也是要延长折线宽度\n              [treeClassNames.lineIsLeaf]: node.vmIsLeaf || !iconVisible,\n              // 分支首节点，到上一节点的折线高度要缩短，让位给 icon 呈现\n              // 如果 icon 隐藏了，则不必缩短折线高度\n              [treeClassNames.lineIsFirst]: node.vmIsFirst && iconVisible,\n            },\n          )}\n          style={styles}\n          onClick={stopPropagation}\n        />\n      );\n    }\n    return null;\n  };\n\n  // 使用 斜八角动画\n  const labelRef = useRef();\n  useRipple(labelRef);\n\n  const renderLabel = () => {\n    const emptyView = '暂无数据';\n    let labelText: string | ReactNode = '';\n    if (label instanceof Function) {\n      labelText = label(node.getModel()) || emptyView;\n    } else {\n      labelText = node.label || emptyView;\n    }\n\n    const labelClasses = classNames(treeClassNames.treeLabel, treeClassNames.treeLabelStrictly, {\n      [treeClassNames.actived]: node.isActivable() ? node.actived : false,\n    });\n\n    if (node.isCheckable()) {\n      return (\n        <Checkbox\n          ref={labelRef}\n          // value={node.value}\n          checked={node.checked}\n          indeterminate={node.indeterminate}\n          disabled={node.isDisabled()}\n          name={String(node.value)}\n          onChange={() => onChange(node)}\n          className={labelClasses}\n          {...checkProps}\n        >\n          <span date-target=\"label\">{labelText}</span>\n        </Checkbox>\n      );\n    }\n    return (\n      <span ref={labelRef} date-target=\"label\" className={labelClasses}>\n        <span style={{ position: 'relative' }}>{labelText}</span>\n      </span>\n    );\n  };\n\n  const renderOperations = () => {\n    let operationsView = null;\n    if (operations) {\n      // ReactNode 类型处理\n      if (React.isValidElement(operations)) {\n        operationsView = operations;\n      } else if (operations instanceof Function) {\n        // Function 类型处理\n        const treeNodeModel = node?.getModel();\n        operationsView = operations(treeNodeModel);\n      } else {\n        // 非 ReactNode、Function 类型，抛出错误提示\n        throw new Error('invalid type of operations');\n      }\n    }\n\n    if (operationsView) {\n      return (\n        <span className={treeClassNames.treeOperations} date-target=\"operations\">\n          {operationsView}\n        </span>\n      );\n    }\n    return null;\n  };\n\n  // ？？这里写两个属性，ts 就不会报错了\n  const styles = {\n    '--level': level,\n    boxShadow: '',\n  };\n\n  return (\n    <div\n      ref={ref}\n      data-value={node.value}\n      data-level={level}\n      className={classNames(treeClassNames.treeNode, {\n        [treeClassNames.treeNodeOpen]: node.expanded,\n        [treeClassNames.actived]: node.isActivable() ? node.actived : false,\n        [treeClassNames.disabled]: node.isDisabled(),\n      })}\n      style={styles}\n      onClick={handleClick}\n    >\n      {renderLine()}\n      {renderIcon()}\n      {renderLabel()}\n      {renderOperations()}\n    </div>\n  );\n});\n\nTreeItem.displayName = 'TreeItem';\n\nexport default TreeItem;\n"],"names":["TreeItem","forwardRef","props","ref","node","icon","label","line","expandOnClickNode","activable","checkProps","operations","onClick","onChange","level","useTreeConfig","treeClassNames","handleClick","evt","event","expand","active","handleItemClick","loading","handleIconClick","stopPropagation","e","renderIcon","isDefaultIcon","renderIconNode","Function","getModel","React","isValidElement","Error","isLeaf","expanded","LoadingIcon","className","CaretRightSmallIcon","treeIconRight","iconNode","classNames","treeIcon","folderIcon","treeIconDefault","renderLine","iconVisible","parent","tree","shadowStyles","parents","getParents","pop","forEach","pnode","index","vmIsLast","push","styles2","boxShadow","join","lineIsLeaf","vmIsLeaf","lineIsFirst","vmIsFirst","style","labelRef","useRef","renderLabel","emptyView","labelText","labelClasses","treeLabel","treeLabelStrictly","actived","isActivable","isCheckable","Checkbox","checked","indeterminate","disabled","isDisabled","name","String","value","position","renderOperations","operationsView","treeNodeModel","treeOperations","styles","treeNode","treeNodeOpen","displayName"],"mappings":"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"}
+{"version":3,"file":"TreeItem.js","sources":["../../src/tree/TreeItem.tsx"],"sourcesContent":["import React, { forwardRef, MouseEvent, ReactNode, useRef } from 'react';\nimport classNames from 'classnames';\nimport { CaretRightSmallIcon } from 'tdesign-icons-react';\nimport Loading from '../loading';\nimport useRipple from '../_util/useRipple';\nimport TreeNode from '../_common/js/tree/tree-node';\nimport Checkbox from '../checkbox';\nimport { useTreeConfig } from './useTreeConfig';\nimport { TreeItemProps } from './interface';\n\n/**\n * 树节点组件\n */\nconst TreeItem = forwardRef((props: TreeItemProps, ref: React.Ref<HTMLDivElement>) => {\n  const { node, icon, label, line, expandOnClickNode, activable, checkProps, operations, onClick, onChange } = props;\n  const { level } = node;\n\n  const { treeClassNames } = useTreeConfig();\n\n  const handleClick = (evt: MouseEvent<HTMLDivElement>) => {\n    onClick?.(node, {\n      event: evt,\n      expand: expandOnClickNode,\n      active: activable,\n    });\n  };\n\n  const handleItemClick = (evt: MouseEvent<HTMLDivElement>) => {\n    if (node.loading) {\n      return;\n    }\n    onClick?.(node, {\n      event: evt,\n      expand: true,\n      active: false,\n    });\n  };\n\n  const handleIconClick = (evt: MouseEvent<HTMLDivElement>) => {\n    evt.stopPropagation();\n    handleItemClick(evt);\n  };\n\n  const stopPropagation = (e: MouseEvent) => {\n    e.stopPropagation();\n  };\n\n  /* ======== render ======= */\n  const renderIcon = () => {\n    // 这里按 vue 的逻辑定义\n    let isDefaultIcon = false;\n    const renderIconNode = () => {\n      if (icon === false) {\n        return null;\n      }\n      if (icon instanceof Function) {\n        return icon(node.getModel());\n      }\n      if (React.isValidElement(icon)) {\n        return icon;\n      }\n      if (icon && icon !== true) {\n        // 非 ReactNode、Function、Boolean 类型，抛出错误提示\n        throw new Error('invalid type of icon');\n      }\n\n      if (!node.isLeaf()) {\n        isDefaultIcon = true;\n        if (node.loading && node.expanded) {\n          return <Loading loading={true} />;\n        }\n\n        return <CaretRightSmallIcon className={treeClassNames.treeIconRight} />;\n      }\n      return null;\n    };\n\n    const iconNode = renderIconNode();\n    return (\n      <span\n        className={classNames(treeClassNames.treeIcon, treeClassNames.folderIcon, {\n          [treeClassNames.treeIconDefault]: isDefaultIcon,\n        })}\n        onClick={handleIconClick}\n      >\n        {iconNode}\n      </span>\n    );\n  };\n\n  const renderLine = () => {\n    const iconVisible = icon !== false;\n\n    if (line === false) {\n      return null;\n    }\n\n    if (line instanceof Function) {\n      return line(node.getModel());\n    }\n\n    if (React.isValidElement(line)) {\n      return line;\n    }\n\n    if (node.parent && node.tree) {\n      // 如果节点的父节点，不是最后的节点\n      // 则需要绘制节点延长线\n      const shadowStyles: string[] = [];\n      const parents = node.getParents();\n      parents.pop();\n      parents.forEach((pnode: TreeNode, index: number) => {\n        if (!pnode.vmIsLast) {\n          shadowStyles.push(`calc(-${index + 1} * var(--space)) 0 var(--color)`);\n        }\n      });\n\n      const styles = {\n        '--level': level,\n        boxShadow: shadowStyles.join(','),\n      };\n\n      return (\n        <span\n          className={classNames(\n            // 每个节点绘制抵达上一层级的折线\n            treeClassNames.line,\n            {\n              // 叶子节点，折线宽度延长，因为没有 icon 呈现\n              // 任意节点，icon 不呈现时也是要延长折线宽度\n              [treeClassNames.lineIsLeaf]: node.vmIsLeaf || !iconVisible,\n              // 分支首节点，到上一节点的折线高度要缩短，让位给 icon 呈现\n              // 如果 icon 隐藏了，则不必缩短折线高度\n              [treeClassNames.lineIsFirst]: node.vmIsFirst && iconVisible,\n            },\n          )}\n          style={styles}\n          onClick={stopPropagation}\n        />\n      );\n    }\n    return null;\n  };\n\n  // 使用 斜八角动画\n  const labelRef = useRef();\n  useRipple(labelRef);\n\n  const renderLabel = () => {\n    const emptyView = '暂无数据';\n    let labelText: string | ReactNode = '';\n    if (label instanceof Function) {\n      labelText = label(node.getModel()) || emptyView;\n    } else {\n      labelText = node.label || emptyView;\n    }\n\n    const labelClasses = classNames(treeClassNames.treeLabel, treeClassNames.treeLabelStrictly, {\n      [treeClassNames.actived]: node.isActivable() ? node.actived : false,\n    });\n\n    if (node.isCheckable()) {\n      return (\n        <Checkbox\n          ref={labelRef}\n          // value={node.value}\n          checked={node.checked}\n          indeterminate={node.indeterminate}\n          disabled={node.isDisabled()}\n          name={String(node.value)}\n          onChange={() => onChange(node)}\n          className={labelClasses}\n          {...checkProps}\n        >\n          <span date-target=\"label\">{labelText}</span>\n        </Checkbox>\n      );\n    }\n    return (\n      <span ref={labelRef} date-target=\"label\" className={labelClasses}>\n        <span style={{ position: 'relative' }}>{labelText}</span>\n      </span>\n    );\n  };\n\n  const renderOperations = () => {\n    let operationsView = null;\n    if (operations) {\n      // ReactNode 类型处理\n      if (React.isValidElement(operations)) {\n        operationsView = operations;\n      } else if (operations instanceof Function) {\n        // Function 类型处理\n        const treeNodeModel = node?.getModel();\n        operationsView = operations(treeNodeModel);\n      } else {\n        // 非 ReactNode、Function 类型，抛出错误提示\n        throw new Error('invalid type of operations');\n      }\n    }\n\n    if (operationsView) {\n      return (\n        <span className={treeClassNames.treeOperations} date-target=\"operations\">\n          {operationsView}\n        </span>\n      );\n    }\n    return null;\n  };\n\n  // ？？这里写两个属性，ts 就不会报错了\n  const styles = {\n    '--level': level,\n    boxShadow: '',\n  };\n\n  return (\n    <div\n      ref={ref}\n      data-value={node.value}\n      data-level={level}\n      className={classNames(treeClassNames.treeNode, {\n        [treeClassNames.treeNodeOpen]: node.expanded,\n        [treeClassNames.actived]: node.isActivable() ? node.actived : false,\n        [treeClassNames.disabled]: node.isDisabled(),\n      })}\n      style={styles}\n      onClick={handleClick}\n    >\n      {renderLine()}\n      {renderIcon()}\n      {renderLabel()}\n      {renderOperations()}\n    </div>\n  );\n});\n\nTreeItem.displayName = 'TreeItem';\n\nexport default TreeItem;\n"],"names":["TreeItem","forwardRef","props","ref","node","icon","label","line","expandOnClickNode","activable","checkProps","operations","onClick","onChange","level","useTreeConfig","treeClassNames","handleClick","evt","event","expand","active","handleItemClick","loading","handleIconClick","stopPropagation","e","renderIcon","isDefaultIcon","renderIconNode","Function","getModel","React","isValidElement","Error","isLeaf","expanded","Loading","CaretRightSmallIcon","className","treeIconRight","iconNode","classNames","treeIcon","folderIcon","treeIconDefault","renderLine","iconVisible","parent","tree","shadowStyles","parents","getParents","pop","forEach","pnode","index","vmIsLast","push","styles2","boxShadow","join","lineIsLeaf","vmIsLeaf","lineIsFirst","vmIsFirst","style","labelRef","useRef","renderLabel","emptyView","labelText","labelClasses","treeLabel","treeLabelStrictly","actived","isActivable","isCheckable","Checkbox","checked","indeterminate","disabled","isDisabled","name","String","value","position","renderOperations","operationsView","treeNodeModel","treeOperations","styles","treeNode","treeNodeOpen","displayName"],"mappings":"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"}

package/es/tree/index.d.ts

@@ -1,4 +1,5 @@
-import type { TdTreeProps as TreeProps, TreeNodeValue, TreeNodeModel } from '../_type/components/tree';
-import Tree from './Tree';
-export type { TreeProps, TreeNodeValue, TreeNodeModel };
+/// <reference types="react" />
+export type { TreeProps } from './Tree';
+export * from '../_type/components/tree';
+export declare const Tree: import("react").ForwardRefExoticComponent<import("./Tree").TreeProps & import("react").RefAttributes<import("../_type/components/tree").TreeInstanceFunctions<import("../_type").TreeOptionData>>>;
 export default Tree;

package/es/tree/index.js

@@ -1,21 +1,21 @@
 /**
- * tdesign v0.17.0
+ * tdesign v0.18.2
  * (c) 2021 tdesign
  * @license MIT
  */
 
-import Tree from './Tree.js';
-export { default } from './Tree.js';
-import '../_chunks/dep-308ea020.js';
-import '../_chunks/dep-01d52b00.js';
-import '../_chunks/dep-65d3c0dc.js';
+import Tree$1 from './Tree.js';
+import '../_type/components/tree/index.js';
+import '../_chunks/dep-efe7433b.js';
+import '../_chunks/dep-2f008905.js';
+import '../_chunks/dep-6a5b1968.js';
 import 'react';
 import 'react-transition-group';
 import 'classnames';
 import '../locale/LocalReceiver.js';
 import '../config-provider/index.js';
 import '../config-provider/ConfigProvider.js';
-import '../_chunks/dep-34727236.js';
+import '../_chunks/dep-016d27a7.js';
 import '../config-provider/ConfigContext.js';
 import '../locale/zh_CN.js';
 import '../_util/usePersistFn.js';
@@ -26,47 +26,62 @@ import '../_util/useDefault.js';
 import '../_util/noop.js';
 import './TreeItem.js';
 import 'tdesign-icons-react';
+import '../loading/index.js';
+import '../loading/loading.js';
+import 'react-dom';
+import '../_util/dom.js';
+import 'raf';
+import '../_chunks/dep-e507e9db.js';
+import '../_chunks/dep-cb80da27.js';
+import '../_chunks/dep-b6ff8559.js';
+import '../_chunks/dep-1189939f.js';
+import '../_chunks/dep-9ad4f4b7.js';
+import '../_chunks/dep-4e491803.js';
+import '../_chunks/dep-f3eac264.js';
+import '../_util/easing.js';
+import '../common/Portal.js';
+import '../_chunks/dep-65c183dc.js';
+import './style/css.js';
+import '../_type/components/loading/index.js';
 import '../_util/useRipple.js';
 import '../_util/setStyle.js';
 import '../checkbox/index.js';
-import '../checkbox/Checkbox.js';
+import '../_chunks/dep-edb4c08f.js';
 import '../_util/forwardRefWithStatics.js';
 import 'hoist-non-react-statics';
 import '../common/Check.js';
-import '../checkbox/CheckboxGroup.js';
-import '../_chunks/dep-8f70dd0b.js';
-import '../_chunks/dep-d77e1dab.js';
-import '../_chunks/dep-72e49bf9.js';
-import '../_chunks/dep-4f8d4a92.js';
-import '../_chunks/dep-0bebd973.js';
-import './style/css.js';
+import '../_util/helper.js';
+import '../_chunks/dep-8037ad24.js';
+import '../_chunks/dep-43869d17.js';
+import '../_chunks/dep-9d2e7b62.js';
+import '../_chunks/dep-5ec09fbd.js';
+import '../_chunks/dep-0c106052.js';
+import '../_chunks/dep-462edfd5.js';
+import '../_type/components/checkbox/index.js';
 import './useStore.js';
-import '../_chunks/dep-72f42a94.js';
-import '../_chunks/dep-50d67a9e.js';
-import '../_chunks/dep-6d4ba42b.js';
-import '../_chunks/dep-cc4fe4a7.js';
-import '../_chunks/dep-192c8209.js';
-import '../_chunks/dep-169d1f12.js';
-import '../_chunks/dep-d637b20e.js';
-import '../_chunks/dep-a80d1e95.js';
-import '../_chunks/dep-62694799.js';
-import '../_chunks/dep-860f801e.js';
-import '../_chunks/dep-e48c1464.js';
-import '../_chunks/dep-6e666254.js';
-import '../_chunks/dep-037cf0e5.js';
-import '../_chunks/dep-c8805e88.js';
-import '../_chunks/dep-8e48c9f4.js';
-import '../_chunks/dep-970e57f2.js';
-import '../_chunks/dep-cb2ab567.js';
-import '../_chunks/dep-c6be3527.js';
-import '../_chunks/dep-582e49a8.js';
-import '../_chunks/dep-c8279fb6.js';
-import '../_chunks/dep-ba094f88.js';
-import '../_chunks/dep-ef419a2e.js';
-import '../_chunks/dep-983e6e8d.js';
-import '../_chunks/dep-c7963465.js';
-import '../_chunks/dep-7145d9df.js';
-import '../_chunks/dep-37e609b3.js';
-import '../_chunks/dep-ada253d1.js';
+import '../_chunks/dep-744f52b3.js';
+import '../_chunks/dep-e83a1558.js';
+import '../_chunks/dep-83646039.js';
+import '../_chunks/dep-504203df.js';
+import '../_chunks/dep-74a044dc.js';
+import '../_chunks/dep-47afb0bc.js';
+import '../_chunks/dep-ed9505a3.js';
+import '../_chunks/dep-4e5953fc.js';
+import '../_chunks/dep-1b2238b1.js';
+import '../_chunks/dep-efa4ba54.js';
+import '../_chunks/dep-bb05ae7d.js';
+import '../_chunks/dep-32b70135.js';
+import '../_chunks/dep-8faed49a.js';
+import '../_chunks/dep-f7d3ea79.js';
+import '../_chunks/dep-039ac0dd.js';
+import '../_chunks/dep-b44aec31.js';
+import '../_chunks/dep-9c56e17c.js';
+import '../_chunks/dep-11b4e1d1.js';
+import '../_chunks/dep-2eeaa58b.js';
+import '../_chunks/dep-b6158110.js';
 import '../_util/useUpdateEffect.js';
+
+var Tree = Tree$1;
+
+export { Tree, Tree as default };
 //# sourceMappingURL=index.js.map

package/es/tree/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"index.js","sources":["../../src/tree/index.ts"],"sourcesContent":["import _Tree from './Tree';\n\nexport type { TreeProps } from './Tree';\nexport * from '../_type/components/tree';\n\nexport const Tree = _Tree;\nexport default Tree;\n"],"names":["Tree","_Tree"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAKaA,OAAOC;;;;"}

package/es/tree/interface.js

@@ -1,5 +1,5 @@
 /**
- * tdesign v0.17.0
+ * tdesign v0.18.2
  * (c) 2021 tdesign
  * @license MIT
  */

package/es/tree/style/index.css

@@ -18,58 +18,58 @@
 }
 :root,
 :root[theme-mode="light"] {
-  --td-brand-color-1: #ECF2FE;
-  --td-brand-color-2: #D4E3FC;
-  --td-brand-color-3: #BBD3FB;
-  --td-brand-color-4: #96BBF8;
-  --td-brand-color-5: #699EF5;
-  --td-brand-color-6: #4787F0;
-  --td-brand-color-7: #266FE8;
-  --td-brand-color-8: #0052D9;
-  --td-brand-color-9: #0034B5;
-  --td-brand-color-10: #001F97;
-  --td-warning-color-1: #FEF3E6;
-  --td-warning-color-2: #F9E0C7;
-  --td-warning-color-3: #F7C797;
-  --td-warning-color-4: #F2995F;
-  --td-warning-color-5: #ED7B2F;
-  --td-warning-color-6: #D35A21;
-  --td-warning-color-7: #BA431B;
-  --td-warning-color-8: #9E3610;
-  --td-warning-color-9: #842B0B;
-  --td-warning-color-10: #5A1907;
-  --td-error-color-1: #FDECEE;
-  --td-error-color-2: #F9D7D9;
-  --td-error-color-3: #F8B9BE;
-  --td-error-color-4: #F78D94;
-  --td-error-color-5: #F36D78;
-  --td-error-color-6: #E34D59;
-  --td-error-color-7: #C9353F;
-  --td-error-color-8: #B11F26;
+  --td-brand-color-1: #ecf2fe;
+  --td-brand-color-2: #d4e3fc;
+  --td-brand-color-3: #bbd3fb;
+  --td-brand-color-4: #96bbf8;
+  --td-brand-color-5: #699ef5;
+  --td-brand-color-6: #4787f0;
+  --td-brand-color-7: #266fe8;
+  --td-brand-color-8: #0052d9;
+  --td-brand-color-9: #0034b5;
+  --td-brand-color-10: #001f97;
+  --td-warning-color-1: #fef3e6;
+  --td-warning-color-2: #f9e0c7;
+  --td-warning-color-3: #f7c797;
+  --td-warning-color-4: #f2995f;
+  --td-warning-color-5: #ed7b2f;
+  --td-warning-color-6: #d35a21;
+  --td-warning-color-7: #ba431b;
+  --td-warning-color-8: #9e3610;
+  --td-warning-color-9: #842b0b;
+  --td-warning-color-10: #5a1907;
+  --td-error-color-1: #fdecee;
+  --td-error-color-2: #f9d7d9;
+  --td-error-color-3: #f8b9be;
+  --td-error-color-4: #f78d94;
+  --td-error-color-5: #f36d78;
+  --td-error-color-6: #e34d59;
+  --td-error-color-7: #c9353f;
+  --td-error-color-8: #b11f26;
   --td-error-color-9: #951114;
   --td-error-color-10: #680506;
-  --td-success-color-1: #E8F8F2;
-  --td-success-color-2: #BCEBDC;
-  --td-success-color-3: #85DBBE;
-  --td-success-color-4: #48C79C;
-  --td-success-color-5: #00A870;
-  --td-success-color-6: #078D5C;
+  --td-success-color-1: #e8f8f2;
+  --td-success-color-2: #bcebdc;
+  --td-success-color-3: #85dbbe;
+  --td-success-color-4: #48c79c;
+  --td-success-color-5: #00a870;
+  --td-success-color-6: #078d5c;
   --td-success-color-7: #067945;
   --td-success-color-8: #056334;
-  --td-success-color-9: #044F2A;
+  --td-success-color-9: #044f2a;
   --td-success-color-10: #033017;
-  --td-gray-color-1: #F3F3F3;
-  --td-gray-color-2: #EEEEEE;
-  --td-gray-color-3: #E7E7E7;
-  --td-gray-color-4: #DCDCDC;
-  --td-gray-color-5: #C5C5C5;
-  --td-gray-color-6: #A6A6A6;
-  --td-gray-color-7: #8B8B8B;
-  --td-gray-color-8: #777777;
-  --td-gray-color-9: #5E5E5E;
-  --td-gray-color-10: #4B4B4B;
+  --td-gray-color-1: #f3f3f3;
+  --td-gray-color-2: #eee;
+  --td-gray-color-3: #e7e7e7;
+  --td-gray-color-4: #dcdcdc;
+  --td-gray-color-5: #c5c5c5;
+  --td-gray-color-6: #a6a6a6;
+  --td-gray-color-7: #8b8b8b;
+  --td-gray-color-8: #777;
+  --td-gray-color-9: #5e5e5e;
+  --td-gray-color-10: #4b4b4b;
   --td-gray-color-11: #383838;
-  --td-gray-color-12: #2C2C2C;
+  --td-gray-color-12: #2c2c2c;
   --td-gray-color-13: #242424;
   --td-gray-color-14: #181818;
   --td-font-white-1: #ffffff;
@@ -130,69 +130,69 @@
   --td-component-stroke: var(--td-gray-color-3);
   --td-border-level-2-color: var(--td-gray-color-4);
   --td-component-border: var(--td-gray-color-4);
-  --td-shadow-1: 0px 1px 10px rgba(0, 0, 0, 0.05), 0px 4px 5px rgba(0, 0, 0, .08), 0px 2px 4px -1px rgba(0, 0, 0, .12);
-  --td-shadow-2: 0px 3px 14px 2px rgba(0, 0, 0, 0.05), 0px 8px 10px 1px rgba(0, 0, 0, .06), 0px 5px 5px -3px rgba(0, 0, 0, .1);
-  --td-shadow-3: 0px 6px 30px 5px rgba(0, 0, 0, 0.05), 0px 16px 24px 2px rgba(0, 0, 0, .04), 0px 8px 10px -5px rgba(0, 0, 0, .08);
-  --td-shadow-inset-top: inset 0px 0.5px 0px #DCDCDC;
-  --td-shadow-inset-right: inset 0.5px 0px 0px #DCDCDC;
-  --td-shadow-inset-bottom: inset 0px -0.5px 0px #DCDCDC;
-  --td-shadow-inset-left: inset -0.5px 0px 0px #DCDCDC;
+  --td-shadow-1: 0 1px 10px rgba(0, 0, 0, 0.05), 0 4px 5px rgba(0, 0, 0, 8%), 0 2px 4px -1px rgba(0, 0, 0, 12%);
+  --td-shadow-2: 0 3px 14px 2px rgba(0, 0, 0, 0.05), 0 8px 10px 1px rgba(0, 0, 0, 6%), 0 5px 5px -3px rgba(0, 0, 0, 10%);
+  --td-shadow-3: 0 6px 30px 5px rgba(0, 0, 0, 0.05), 0 16px 24px 2px rgba(0, 0, 0, 4%), 0 8px 10px -5px rgba(0, 0, 0, 8%);
+  --td-shadow-inset-top: inset 0 0.5px 0 #dcdcdc;
+  --td-shadow-inset-right: inset 0.5px 0 0 #dcdcdc;
+  --td-shadow-inset-bottom: inset 0 -0.5px 0 #dcdcdc;
+  --td-shadow-inset-left: inset -0.5px 0 0 #dcdcdc;
   --td-table-shadow-color: rgba(0, 0, 0, 0.08);
   --td-scrollbar-color: rgba(0, 0, 0, 0.1);
 }
 :root[theme-mode="dark"] {
-  --td-brand-color-1: #1B2F51;
+  --td-brand-color-1: #1b2f51;
   --td-brand-color-2: #173463;
   --td-brand-color-3: #143975;
-  --td-brand-color-4: #103D88;
-  --td-brand-color-5: #0D429A;
-  --td-brand-color-6: #054BBE;
-  --td-brand-color-7: #2667D4;
-  --td-brand-color-8: #4582E6;
-  --td-brand-color-9: #699EF5;
-  --td-brand-color-10: #96BBF8;
-  --td-warning-color-1: #4F2A1D;
-  --td-warning-color-2: #582F21;
-  --td-warning-color-3: #733C23;
-  --td-warning-color-4: #A75D2B;
-  --td-warning-color-5: #CF6E2D;
-  --td-warning-color-6: #DC7633;
-  --td-warning-color-7: #E8935C;
-  --td-warning-color-8: #ECBF91;
-  --td-warning-color-9: #EED7BF;
-  --td-warning-color-10: #F3E9DC;
+  --td-brand-color-4: #103d88;
+  --td-brand-color-5: #0d429a;
+  --td-brand-color-6: #054bbe;
+  --td-brand-color-7: #2667d4;
+  --td-brand-color-8: #4582e6;
+  --td-brand-color-9: #699ef5;
+  --td-brand-color-10: #96bbf8;
+  --td-warning-color-1: #4f2a1d;
+  --td-warning-color-2: #582f21;
+  --td-warning-color-3: #733c23;
+  --td-warning-color-4: #a75d2b;
+  --td-warning-color-5: #cf6e2d;
+  --td-warning-color-6: #dc7633;
+  --td-warning-color-7: #e8935c;
+  --td-warning-color-8: #ecbf91;
+  --td-warning-color-9: #eed7bf;
+  --td-warning-color-10: #f3e9dc;
   --td-error-color-1: #472324;
-  --td-error-color-2: #5E2A2D;
+  --td-error-color-2: #5e2a2d;
   --td-error-color-3: #703439;
-  --td-error-color-4: #83383E;
-  --td-error-color-5: #A03F46;
-  --td-error-color-6: #C64751;
-  --td-error-color-7: #DE6670;
-  --td-error-color-8: #EC888E;
-  --td-error-color-9: #EDB1B6;
-  --td-error-color-10: #EECED0;
-  --td-success-color-1: #193A2A;
-  --td-success-color-2: #1A4230;
-  --td-success-color-3: #17533D;
-  --td-success-color-4: #0D7A55;
+  --td-error-color-4: #83383e;
+  --td-error-color-5: #a03f46;
+  --td-error-color-6: #c64751;
+  --td-error-color-7: #de6670;
+  --td-error-color-8: #ec888e;
+  --td-error-color-9: #edb1b6;
+  --td-error-color-10: #eeced0;
+  --td-success-color-1: #193a2a;
+  --td-success-color-2: #1a4230;
+  --td-success-color-3: #17533d;
+  --td-success-color-4: #0d7a55;
   --td-success-color-5: #059465;
-  --td-success-color-6: #43AF8A;
-  --td-success-color-7: #46BF96;
-  --td-success-color-8: #80D2B6;
-  --td-success-color-9: #B4E1D3;
-  --td-success-color-10: #DEEDE8;
-  --td-gray-color-1: #F3F3F3;
-  --td-gray-color-2: #EEEEEE;
-  --td-gray-color-3: #E7E7E7;
-  --td-gray-color-4: #DCDCDC;
-  --td-gray-color-5: #C5C5C5;
-  --td-gray-color-6: #A6A6A6;
-  --td-gray-color-7: #8B8B8B;
-  --td-gray-color-8: #777777;
-  --td-gray-color-9: #5E5E5E;
-  --td-gray-color-10: #4B4B4B;
+  --td-success-color-6: #43af8a;
+  --td-success-color-7: #46bf96;
+  --td-success-color-8: #80d2b6;
+  --td-success-color-9: #b4e1d3;
+  --td-success-color-10: #deede8;
+  --td-gray-color-1: #f3f3f3;
+  --td-gray-color-2: #eee;
+  --td-gray-color-3: #e7e7e7;
+  --td-gray-color-4: #dcdcdc;
+  --td-gray-color-5: #c5c5c5;
+  --td-gray-color-6: #a6a6a6;
+  --td-gray-color-7: #8b8b8b;
+  --td-gray-color-8: #777;
+  --td-gray-color-9: #5e5e5e;
+  --td-gray-color-10: #4b4b4b;
   --td-gray-color-11: #383838;
-  --td-gray-color-12: #2C2C2C;
+  --td-gray-color-12: #2c2c2c;
   --td-gray-color-13: #242424;
   --td-gray-color-14: #181818;
   --td-font-white-1: rgba(255, 255, 255, 0.9);
@@ -253,13 +253,13 @@
   --td-component-stroke: var(--td-gray-color-11);
   --td-border-level-2-color: var(--td-gray-color-9);
   --td-component-border: var(--td-gray-color-9);
-  --td-shadow-1: 0px 4px 6px rgba(0, 0, 0, 0.06), 0px 1px 10px rgba(0, 0, 0, .08), 0px 2px 4px rgba(0, 0, 0, .12);
-  --td-shadow-2: 0px 8px 10px rgba(0, 0, 0, 0.12), 0px 3px 14px rgba(0, 0, 0, .1), 0px 5px 5px rgba(0, 0, 0, .16);
-  --td-shadow-3: 0px 16px 24px rgba(0, 0, 0, 0.14), 0px 6px 30px rgba(0, 0, 0, .12), 0px 8px 10px rgba(0, 0, 0, .2);
-  --td-shadow-inset-top: inset 0px 0.5px 0px #5E5E5E;
-  --td-shadow-inset-right: inset 0.5px 0px 0px #5E5E5E;
-  --td-shadow-inset-bottom: inset 0px -0.5px 0px #5E5E5E;
-  --td-shadow-inset-left: inset -0.5px 0px 0px #5E5E5E;
+  --td-shadow-1: 0 4px 6px rgba(0, 0, 0, 0.06), 0 1px 10px rgba(0, 0, 0, 8%), 0 2px 4px rgba(0, 0, 0, 12%);
+  --td-shadow-2: 0 8px 10px rgba(0, 0, 0, 0.12), 0 3px 14px rgba(0, 0, 0, 10%), 0 5px 5px rgba(0, 0, 0, 16%);
+  --td-shadow-3: 0 16px 24px rgba(0, 0, 0, 0.14), 0 6px 30px rgba(0, 0, 0, 12%), 0 8px 10px rgba(0, 0, 0, 20%);
+  --td-shadow-inset-top: inset 0 0.5px 0 #5e5e5e;
+  --td-shadow-inset-right: inset 0.5px 0 0 #5e5e5e;
+  --td-shadow-inset-bottom: inset 0 -0.5px 0 #5e5e5e;
+  --td-shadow-inset-left: inset -0.5px 0 0 #5e5e5e;
   --td-table-shadow-color: rgba(0, 0, 0, 0.55);
   --td-scrollbar-color: rgba(255, 255, 255, 0.1);
 }
@@ -286,7 +286,6 @@
   color: var(--td-text-color-disabled);
 }
 .t-tree__item {
-  --level: 0;
   position: relative;
   display: -webkit-box;
   display: -ms-flexbox;
@@ -306,25 +305,29 @@
           backface-visibility: hidden;
   -webkit-perspective: 1000;
           perspective: 1000;
+  --level: 0;
 }
 .t-tree__item + .t-tree__item {
   margin-top: 4px;
 }
-.t-tree__item .t-icon {
+.t-tree__item .t-icon,
+.t-tree__item .t-loading {
   display: inline-block;
   position: relative;
-  color: var(--td-text-color-secondary);
   z-index: 2;
   font-size: 16px;
 }
+.t-tree__item .t-icon {
+  color: var(--td-text-color-secondary);
+}
 .t-tree__item .t-checkbox {
   font-size: 0;
 }
 .t-tree__item .t-tree__icon--default .t-icon {
-  -webkit-transition: -webkit-transform cubic-bezier(0.38, 0, 0.24, 1) 0.2s;
-  transition: -webkit-transform cubic-bezier(0.38, 0, 0.24, 1) 0.2s;
-  transition: transform cubic-bezier(0.38, 0, 0.24, 1) 0.2s;
-  transition: transform cubic-bezier(0.38, 0, 0.24, 1) 0.2s, -webkit-transform cubic-bezier(0.38, 0, 0.24, 1) 0.2s;
+  -webkit-transition: color, -webkit-transform cubic-bezier(0.38, 0, 0.24, 1) 0.2s;
+  transition: color, -webkit-transform cubic-bezier(0.38, 0, 0.24, 1) 0.2s;
+  transition: color, transform cubic-bezier(0.38, 0, 0.24, 1) 0.2s;
+  transition: color, transform cubic-bezier(0.38, 0, 0.24, 1) 0.2s, -webkit-transform cubic-bezier(0.38, 0, 0.24, 1) 0.2s;
   -webkit-transform: rotate(0);
           transform: rotate(0);
 }
@@ -347,16 +350,16 @@
   background-color: var(--td-bg-color-container-hover);
 }
 .t-tree__line {
-  --level: 0;
-  --color: var(--td-border-level-1-color);
-  --space: 24px;
-  --iconSize: 16px;
   position: absolute;
   left: calc(24px * var(--level) - 10px);
   bottom: 15px;
   width: 1px;
   height: 40px;
   pointer-events: none;
+  --level: 0;
+  --color: var(--td-border-level-1-color);
+  --space: 24px;
+  --iconSize: 16px;
 }
 .t-tree__line::before {
   content: "";
@@ -393,8 +396,10 @@
           user-select: none;
   cursor: pointer;
   border-radius: 3px;
-  -webkit-transition: all 0.24s cubic-bezier(0.38, 0, 0.24, 1);
-  transition: all 0.24s cubic-bezier(0.38, 0, 0.24, 1);
+  -webkit-transition: color, -webkit-transform 0.24s cubic-bezier(0.38, 0, 0.24, 1);
+  transition: color, -webkit-transform 0.24s cubic-bezier(0.38, 0, 0.24, 1);
+  transition: color, transform 0.24s cubic-bezier(0.38, 0, 0.24, 1);
+  transition: color, transform 0.24s cubic-bezier(0.38, 0, 0.24, 1), -webkit-transform 0.24s cubic-bezier(0.38, 0, 0.24, 1);
 }
 .t-tree__icon:not(:empty):hover {
   background-color: var(--td-bg-color-container-hover);
@@ -416,9 +421,9 @@
   padding: 0 4px;
   border-radius: 3px;
   cursor: pointer;
-  --ripple-color: var(--td-bg-color-container-active);
   -webkit-transition: background-color 0.24s cubic-bezier(0.38, 0, 0.24, 1);
   transition: background-color 0.24s cubic-bezier(0.38, 0, 0.24, 1);
+  --ripple-color: var(--td-bg-color-container-active);
 }
 .t-tree__label.t-is-checked,
 .t-tree__label.t-is-active {

package/es/tree/style/index.js

@@ -1,5 +1,5 @@
 /**
- * tdesign v0.17.0
+ * tdesign v0.18.2
  * (c) 2021 tdesign
  * @license MIT
  */

package/es/tree/useControllable.js

@@ -1,12 +1,12 @@
 /**
- * tdesign v0.17.0
+ * tdesign v0.18.2
  * (c) 2021 tdesign
  * @license MIT
  */
 
-import { _ as _slicedToArray } from '../_chunks/dep-01d52b00.js';
+import { _ as _slicedToArray } from '../_chunks/dep-2f008905.js';
 import useDefault from '../_util/useDefault.js';
-import '../_chunks/dep-65d3c0dc.js';
+import '../_chunks/dep-6a5b1968.js';
 import 'react';
 import '../_util/noop.js';