@hanwenbo/x-taro-ui 0.0.1

package/es/components/treeSelect/treeSelect.js

@@ -0,0 +1,842 @@
+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); }
+function _regeneratorRuntime() { "use strict"; /*! regenerator-runtime -- Copyright (c) 2014-present, Facebook, Inc. -- license (MIT): https://github.com/facebook/regenerator/blob/main/LICENSE */ _regeneratorRuntime = function _regeneratorRuntime() { return e; }; var t, e = {}, r = Object.prototype, n = r.hasOwnProperty, o = Object.defineProperty || function (t, e, r) { t[e] = r.value; }, i = "function" == typeof Symbol ? Symbol : {}, a = i.iterator || "@@iterator", c = i.asyncIterator || "@@asyncIterator", u = i.toStringTag || "@@toStringTag"; function define(t, e, r) { return Object.defineProperty(t, e, { value: r, enumerable: !0, configurable: !0, writable: !0 }), t[e]; } try { define({}, ""); } catch (t) { define = function define(t, e, r) { return t[e] = r; }; } function wrap(t, e, r, n) { var i = e && e.prototype instanceof Generator ? e : Generator, a = Object.create(i.prototype), c = new Context(n || []); return o(a, "_invoke", { value: makeInvokeMethod(t, r, c) }), a; } function tryCatch(t, e, r) { try { return { type: "normal", arg: t.call(e, r) }; } catch (t) { return { type: "throw", arg: t }; } } e.wrap = wrap; var h = "suspendedStart", l = "suspendedYield", f = "executing", s = "completed", y = {}; function Generator() {} function GeneratorFunction() {} function GeneratorFunctionPrototype() {} var p = {}; define(p, a, function () { return this; }); var d = Object.getPrototypeOf, v = d && d(d(values([]))); v && v !== r && n.call(v, a) && (p = v); var g = GeneratorFunctionPrototype.prototype = Generator.prototype = Object.create(p); function defineIteratorMethods(t) { ["next", "throw", "return"].forEach(function (e) { define(t, e, function (t) { return this._invoke(e, t); }); }); } function AsyncIterator(t, e) { function invoke(r, o, i, a) { var c = tryCatch(t[r], t, o); if ("throw" !== c.type) { var u = c.arg, h = u.value; return h && "object" == _typeof(h) && n.call(h, "__await") ? e.resolve(h.__await).then(function (t) { invoke("next", t, i, a); }, function (t) { invoke("throw", t, i, a); }) : e.resolve(h).then(function (t) { u.value = t, i(u); }, function (t) { return invoke("throw", t, i, a); }); } a(c.arg); } var r; o(this, "_invoke", { value: function value(t, n) { function callInvokeWithMethodAndArg() { return new e(function (e, r) { invoke(t, n, e, r); }); } return r = r ? r.then(callInvokeWithMethodAndArg, callInvokeWithMethodAndArg) : callInvokeWithMethodAndArg(); } }); } function makeInvokeMethod(e, r, n) { var o = h; return function (i, a) { if (o === f) throw new Error("Generator is already running"); if (o === s) { if ("throw" === i) throw a; return { value: t, done: !0 }; } for (n.method = i, n.arg = a;;) { var c = n.delegate; if (c) { var u = maybeInvokeDelegate(c, n); if (u) { if (u === y) continue; return u; } } if ("next" === n.method) n.sent = n._sent = n.arg;else if ("throw" === n.method) { if (o === h) throw o = s, n.arg; n.dispatchException(n.arg); } else "return" === n.method && n.abrupt("return", n.arg); o = f; var p = tryCatch(e, r, n); if ("normal" === p.type) { if (o = n.done ? s : l, p.arg === y) continue; return { value: p.arg, done: n.done }; } "throw" === p.type && (o = s, n.method = "throw", n.arg = p.arg); } }; } function maybeInvokeDelegate(e, r) { var n = r.method, o = e.iterator[n]; if (o === t) return r.delegate = null, "throw" === n && e.iterator.return && (r.method = "return", r.arg = t, maybeInvokeDelegate(e, r), "throw" === r.method) || "return" !== n && (r.method = "throw", r.arg = new TypeError("The iterator does not provide a '" + n + "' method")), y; var i = tryCatch(o, e.iterator, r.arg); if ("throw" === i.type) return r.method = "throw", r.arg = i.arg, r.delegate = null, y; var a = i.arg; return a ? a.done ? (r[e.resultName] = a.value, r.next = e.nextLoc, "return" !== r.method && (r.method = "next", r.arg = t), r.delegate = null, y) : a : (r.method = "throw", r.arg = new TypeError("iterator result is not an object"), r.delegate = null, y); } function pushTryEntry(t) { var e = { tryLoc: t[0] }; 1 in t && (e.catchLoc = t[1]), 2 in t && (e.finallyLoc = t[2], e.afterLoc = t[3]), this.tryEntries.push(e); } function resetTryEntry(t) { var e = t.completion || {}; e.type = "normal", delete e.arg, t.completion = e; } function Context(t) { this.tryEntries = [{ tryLoc: "root" }], t.forEach(pushTryEntry, this), this.reset(!0); } function values(e) { if (e || "" === e) { var r = e[a]; if (r) return r.call(e); if ("function" == typeof e.next) return e; if (!isNaN(e.length)) { var o = -1, i = function next() { for (; ++o < e.length;) if (n.call(e, o)) return next.value = e[o], next.done = !1, next; return next.value = t, next.done = !0, next; }; return i.next = i; } } throw new TypeError(_typeof(e) + " is not iterable"); } return GeneratorFunction.prototype = GeneratorFunctionPrototype, o(g, "constructor", { value: GeneratorFunctionPrototype, configurable: !0 }), o(GeneratorFunctionPrototype, "constructor", { value: GeneratorFunction, configurable: !0 }), GeneratorFunction.displayName = define(GeneratorFunctionPrototype, u, "GeneratorFunction"), e.isGeneratorFunction = function (t) { var e = "function" == typeof t && t.constructor; return !!e && (e === GeneratorFunction || "GeneratorFunction" === (e.displayName || e.name)); }, e.mark = function (t) { return Object.setPrototypeOf ? Object.setPrototypeOf(t, GeneratorFunctionPrototype) : (t.__proto__ = GeneratorFunctionPrototype, define(t, u, "GeneratorFunction")), t.prototype = Object.create(g), t; }, e.awrap = function (t) { return { __await: t }; }, defineIteratorMethods(AsyncIterator.prototype), define(AsyncIterator.prototype, c, function () { return this; }), e.AsyncIterator = AsyncIterator, e.async = function (t, r, n, o, i) { void 0 === i && (i = Promise); var a = new AsyncIterator(wrap(t, r, n, o), i); return e.isGeneratorFunction(r) ? a : a.next().then(function (t) { return t.done ? t.value : a.next(); }); }, defineIteratorMethods(g), define(g, u, "Generator"), define(g, a, function () { return this; }), define(g, "toString", function () { return "[object Generator]"; }), e.keys = function (t) { var e = Object(t), r = []; for (var n in e) r.push(n); return r.reverse(), function next() { for (; r.length;) { var t = r.pop(); if (t in e) return next.value = t, next.done = !1, next; } return next.done = !0, next; }; }, e.values = values, Context.prototype = { constructor: Context, reset: function reset(e) { if (this.prev = 0, this.next = 0, this.sent = this._sent = t, this.done = !1, this.delegate = null, this.method = "next", this.arg = t, this.tryEntries.forEach(resetTryEntry), !e) for (var r in this) "t" === r.charAt(0) && n.call(this, r) && !isNaN(+r.slice(1)) && (this[r] = t); }, stop: function stop() { this.done = !0; var t = this.tryEntries[0].completion; if ("throw" === t.type) throw t.arg; return this.rval; }, dispatchException: function dispatchException(e) { if (this.done) throw e; var r = this; function handle(n, o) { return a.type = "throw", a.arg = e, r.next = n, o && (r.method = "next", r.arg = t), !!o; } for (var o = this.tryEntries.length - 1; o >= 0; --o) { var i = this.tryEntries[o], a = i.completion; if ("root" === i.tryLoc) return handle("end"); if (i.tryLoc <= this.prev) { var c = n.call(i, "catchLoc"), u = n.call(i, "finallyLoc"); if (c && u) { if (this.prev < i.catchLoc) return handle(i.catchLoc, !0); if (this.prev < i.finallyLoc) return handle(i.finallyLoc); } else if (c) { if (this.prev < i.catchLoc) return handle(i.catchLoc, !0); } else { if (!u) throw new Error("try statement without catch or finally"); if (this.prev < i.finallyLoc) return handle(i.finallyLoc); } } } }, abrupt: function abrupt(t, e) { for (var r = this.tryEntries.length - 1; r >= 0; --r) { var o = this.tryEntries[r]; if (o.tryLoc <= this.prev && n.call(o, "finallyLoc") && this.prev < o.finallyLoc) { var i = o; break; } } i && ("break" === t || "continue" === t) && i.tryLoc <= e && e <= i.finallyLoc && (i = null); var a = i ? i.completion : {}; return a.type = t, a.arg = e, i ? (this.method = "next", this.next = i.finallyLoc, y) : this.complete(a); }, complete: function complete(t, e) { if ("throw" === t.type) throw t.arg; return "break" === t.type || "continue" === t.type ? this.next = t.arg : "return" === t.type ? (this.rval = this.arg = t.arg, this.method = "return", this.next = "end") : "normal" === t.type && e && (this.next = e), y; }, finish: function finish(t) { for (var e = this.tryEntries.length - 1; e >= 0; --e) { var r = this.tryEntries[e]; if (r.finallyLoc === t) return this.complete(r.completion, r.afterLoc), resetTryEntry(r), y; } }, catch: function _catch(t) { for (var e = this.tryEntries.length - 1; e >= 0; --e) { var r = this.tryEntries[e]; if (r.tryLoc === t) { var n = r.completion; if ("throw" === n.type) { var o = n.arg; resetTryEntry(r); } return o; } } throw new Error("illegal catch attempt"); }, delegateYield: function delegateYield(e, r, n) { return this.delegate = { iterator: values(e), resultName: r, nextLoc: n }, "next" === this.method && (this.arg = t), y; } }, e; }
+function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) { try { var info = gen[key](arg); var value = info.value; } catch (error) { reject(error); return; } if (info.done) { resolve(value); } else { Promise.resolve(value).then(_next, _throw); } }
+function _asyncToGenerator(fn) { return function () { var self = this, args = arguments; return new Promise(function (resolve, reject) { var gen = fn.apply(self, args); function _next(value) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "next", value); } function _throw(err) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "throw", err); } _next(undefined); }); }; }
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+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."); }
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
+function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
+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; }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+import React, { useCallback, useEffect, useId, useMemo, useRef, useState } from 'react';
+import { Input as TaroInput, ScrollView, Text, View } from '@tarojs/components';
+import { getViewport, measureNode, subscribeViewportChange } from "../../adapters/miniapp";
+import { buildThemeVariables, getFormControlTokens, useTokens, withOpacity } from "../../theme";
+import { classNames } from "../../utils";
+import { resolveLocaleText } from "../../utils/locale";
+import { useConfigProvider } from "../configProvider";
+import { Icon } from "../icon";
+import { Portal } from "../portal";
+import { useTreeSelectTokens } from "./tokens";
+import "./style.css";
+
+/**
+ * TreeSelect Component
+ *
+ * @description
+ * Design system aligned treeSelect component
+ */
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+function renderNode(node, style) {
+  if (typeof node === 'string' || typeof node === 'number') {
+    return /*#__PURE__*/_jsx(Text, {
+      style: style,
+      children: node
+    });
+  }
+  return node;
+}
+function getNodeLabel(node) {
+  var _ref, _node$title;
+  return (_ref = (_node$title = node.title) !== null && _node$title !== void 0 ? _node$title : node.label) !== null && _ref !== void 0 ? _ref : node.key;
+}
+function getNodeValue(node) {
+  var _node$value;
+  return (_node$value = node.value) !== null && _node$value !== void 0 ? _node$value : node.key;
+}
+function isActivationKey(event) {
+  return event.key === 'Enter' || event.key === ' ';
+}
+function nodeText(node) {
+  if (typeof node === 'string' || typeof node === 'number') return String(node);
+  if (Array.isArray(node)) return node.map(nodeText).join('');
+  if ( /*#__PURE__*/React.isValidElement(node)) {
+    return nodeText(node.props.children);
+  }
+  return '';
+}
+function filterTree(nodes, query) {
+  if (!query.trim()) {
+    return nodes;
+  }
+  var lowered = query.toLowerCase();
+  return nodes.map(function (node) {
+    var matched = nodeText(getNodeLabel(node)).toLowerCase().includes(lowered) || nodeText(node.description).toLowerCase().includes(lowered);
+    var children = node.children ? filterTree(node.children, query) : undefined;
+    if (matched || children && children.length > 0) {
+      return _objectSpread(_objectSpread({}, node), {}, {
+        children: children
+      });
+    }
+    return null;
+  }).filter(Boolean);
+}
+function getBranchKeys(nodes) {
+  return nodes.flatMap(function (node) {
+    var _node$children;
+    return (_node$children = node.children) !== null && _node$children !== void 0 && _node$children.length ? [node.key].concat(_toConsumableArray(getBranchKeys(node.children))) : [];
+  });
+}
+function findSelectedNodes(nodes, selectedKeys) {
+  var result = [];
+  var visit = function visit(items) {
+    items.forEach(function (item) {
+      var _item$children;
+      if (selectedKeys.includes(getNodeValue(item))) {
+        result.push(item);
+      }
+      if ((_item$children = item.children) !== null && _item$children !== void 0 && _item$children.length) {
+        visit(item.children);
+      }
+    });
+  };
+  visit(nodes);
+  return result;
+}
+var TreeSelect = function TreeSelect(props) {
+  var _dropdownPosition$max, _selectedNodes$;
+  var hasValueProp = Object.prototype.hasOwnProperty.call(props, 'value');
+  var _props$treeData = props.treeData,
+    treeData = _props$treeData === void 0 ? [] : _props$treeData,
+    value = props.value,
+    defaultValue = props.defaultValue,
+    _props$multiple = props.multiple,
+    multiple = _props$multiple === void 0 ? false : _props$multiple,
+    _props$checkable = props.checkable,
+    legacyCheckable = _props$checkable === void 0 ? false : _props$checkable,
+    _props$searchable = props.searchable,
+    searchable = _props$searchable === void 0 ? false : _props$searchable,
+    showSearch = props.showSearch,
+    treeCheckable = props.treeCheckable,
+    _props$allowClear = props.allowClear,
+    allowClear = _props$allowClear === void 0 ? false : _props$allowClear,
+    _props$variant = props.variant,
+    variantProp = _props$variant === void 0 ? 'default' : _props$variant,
+    placeholderProp = props.placeholder,
+    propSize = props.size,
+    _props$disabled = props.disabled,
+    propDisabled = _props$disabled === void 0 ? false : _props$disabled,
+    defaultExpandedKeys = props.defaultExpandedKeys,
+    emptyTextProp = props.emptyText,
+    onChange = props.onChange,
+    onOpenChange = props.onOpenChange,
+    className = props.className,
+    style = props.style,
+    getPopupContainer = props.getPopupContainer;
+  var config = useConfigProvider();
+  var _useTokens = useTokens(),
+    colors = _useTokens.colors,
+    motion = _useTokens.motion,
+    radius = _useTokens.radius,
+    theme = _useTokens.theme;
+  var size = propSize !== null && propSize !== void 0 ? propSize : config.size;
+  var disabled = Boolean(propDisabled || config.disabled);
+  var variant = variantProp === 'outlined' ? 'outline' : variantProp;
+  var isSearchable = showSearch !== null && showSearch !== void 0 ? showSearch : searchable;
+  var isCheckable = treeCheckable !== null && treeCheckable !== void 0 ? treeCheckable : legacyCheckable;
+  var multiMode = multiple || isCheckable;
+  var placeholder = placeholderProp !== null && placeholderProp !== void 0 ? placeholderProp : resolveLocaleText(config.locale, 'picker.placeholder', '请选择');
+  var searchPlaceholder = resolveLocaleText(config.locale, 'common.search', '搜索');
+  var emptyText = emptyTextProp !== null && emptyTextProp !== void 0 ? emptyTextProp : resolveLocaleText(config.locale, 'common.empty', '暂无数据');
+  var clearLabel = resolveLocaleText(config.locale, 'select.clear', '清除选择');
+  var _useState = useState(defaultValue !== null && defaultValue !== void 0 ? defaultValue : multiMode ? [] : undefined),
+    _useState2 = _slicedToArray(_useState, 2),
+    innerValue = _useState2[0],
+    setInnerValue = _useState2[1];
+  var _useState3 = useState(function () {
+      return defaultExpandedKeys === undefined ? getBranchKeys(treeData) : defaultExpandedKeys;
+    }),
+    _useState4 = _slicedToArray(_useState3, 2),
+    expandedKeys = _useState4[0],
+    setExpandedKeys = _useState4[1];
+  var _useState5 = useState(''),
+    _useState6 = _slicedToArray(_useState5, 2),
+    query = _useState6[0],
+    setQuery = _useState6[1];
+  var _useState7 = useState(false),
+    _useState8 = _slicedToArray(_useState7, 2),
+    open = _useState8[0],
+    setOpen = _useState8[1];
+  var _useState9 = useState(false),
+    _useState10 = _slicedToArray(_useState9, 2),
+    triggerPressed = _useState10[0],
+    setTriggerPressed = _useState10[1];
+  var _useState11 = useState(null),
+    _useState12 = _slicedToArray(_useState11, 2),
+    pressedNodeKey = _useState12[0],
+    setPressedNodeKey = _useState12[1];
+  var _useState13 = useState(null),
+    _useState14 = _slicedToArray(_useState13, 2),
+    dropdownPosition = _useState14[0],
+    setDropdownPosition = _useState14[1];
+  var positionRequestIdRef = useRef(0);
+  var disabledRef = useRef(disabled);
+  disabledRef.current = disabled;
+  var reactId = useId();
+  var triggerId = useMemo(function () {
+    return "x-tree-select-".concat(reactId.replace(/[^a-zA-Z0-9_-]/g, ''));
+  }, [reactId]);
+  var dropdownId = "".concat(triggerId, "-dropdown");
+  var currentValue = hasValueProp ? value : innerValue;
+  var selectedKeys = Array.isArray(currentValue) ? currentValue : currentValue ? [currentValue] : [];
+  var filteredTree = useMemo(function () {
+    return filterTree(treeData, query);
+  }, [query, treeData]);
+  var selectedNodes = useMemo(function () {
+    return findSelectedNodes(treeData, selectedKeys);
+  }, [selectedKeys, treeData]);
+  var tokens = useTreeSelectTokens(size);
+  var controlTokens = getFormControlTokens(size);
+  var portalThemeStyle = useMemo(function () {
+    return buildThemeVariables(theme);
+  }, [theme]);
+  var resolvePopupContainer = useCallback(function () {
+    return getPopupContainer();
+  }, [getPopupContainer]);
+  var setDropdownOpen = useCallback(function (nextOpen) {
+    if (disabledRef.current && nextOpen) return;
+    setOpen(nextOpen);
+    if (!nextOpen) {
+      setTriggerPressed(false);
+      setPressedNodeKey(null);
+    }
+    onOpenChange === null || onOpenChange === void 0 || onOpenChange(nextOpen);
+  }, [onOpenChange]);
+  var updateDropdownPosition = useCallback( /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee() {
+    var requestId, rect, viewport, belowSpace, aboveSpace, openAbove, availableSpace;
+    return _regeneratorRuntime().wrap(function _callee$(_context) {
+      while (1) switch (_context.prev = _context.next) {
+        case 0:
+          requestId = positionRequestIdRef.current + 1;
+          positionRequestIdRef.current = requestId;
+          _context.next = 4;
+          return measureNode("#".concat(triggerId));
+        case 4:
+          rect = _context.sent;
+          if (!(positionRequestIdRef.current !== requestId)) {
+            _context.next = 7;
+            break;
+          }
+          return _context.abrupt("return", false);
+        case 7:
+          if (!(!rect || rect.width <= 0)) {
+            _context.next = 10;
+            break;
+          }
+          setDropdownPosition(null);
+          return _context.abrupt("return", true);
+        case 10:
+          viewport = getViewport();
+          belowSpace = Math.max(0, viewport.height - rect.bottom - 8);
+          aboveSpace = Math.max(0, rect.top - 8);
+          openAbove = belowSpace < 180 && aboveSpace > belowSpace;
+          availableSpace = openAbove ? aboveSpace : belowSpace;
+          setDropdownPosition({
+            top: openAbove ? undefined : rect.bottom + 4,
+            bottom: openAbove ? viewport.height - rect.top + 4 : undefined,
+            left: rect.left,
+            width: rect.width,
+            maxHeight: Math.max(0, Math.min(256, availableSpace))
+          });
+          return _context.abrupt("return", true);
+        case 17:
+        case "end":
+          return _context.stop();
+      }
+    }, _callee);
+  })), [triggerId]);
+  var handleTriggerClick = useCallback( /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee2() {
+    return _regeneratorRuntime().wrap(function _callee2$(_context2) {
+      while (1) switch (_context2.prev = _context2.next) {
+        case 0:
+          if (!disabled) {
+            _context2.next = 2;
+            break;
+          }
+          return _context2.abrupt("return");
+        case 2:
+          if (!open) {
+            _context2.next = 5;
+            break;
+          }
+          setDropdownOpen(false);
+          return _context2.abrupt("return");
+        case 5:
+          _context2.next = 7;
+          return updateDropdownPosition();
+        case 7:
+          if (!_context2.sent) {
+            _context2.next = 9;
+            break;
+          }
+          setDropdownOpen(true);
+        case 9:
+        case "end":
+          return _context2.stop();
+      }
+    }, _callee2);
+  })), [disabled, open, setDropdownOpen, updateDropdownPosition]);
+  useEffect(function () {
+    if (!open) return undefined;
+    var handleViewportChange = function handleViewportChange() {
+      void updateDropdownPosition();
+    };
+    var unsubscribe = subscribeViewportChange(handleViewportChange);
+    return function () {
+      positionRequestIdRef.current += 1;
+      unsubscribe();
+    };
+  }, [open, updateDropdownPosition]);
+  useEffect(function () {
+    if (disabled && open) {
+      setDropdownOpen(false);
+    }
+  }, [disabled, open, setDropdownOpen]);
+  useEffect(function () {
+    return function () {
+      positionRequestIdRef.current += 1;
+    };
+  }, []);
+  var updateValue = function updateValue(nextKeys) {
+    var nextValue = multiMode ? nextKeys : nextKeys[0];
+    if (!hasValueProp) {
+      setInnerValue(nextValue);
+    }
+    onChange === null || onChange === void 0 || onChange(nextValue, findSelectedNodes(treeData, nextKeys));
+  };
+  var toggleNode = function toggleNode(node) {
+    if (disabled || node.disabled || isCheckable && node.disableCheckbox) {
+      return;
+    }
+    var nodeValue = getNodeValue(node);
+    if (multiMode) {
+      var nextKeys = selectedKeys.includes(nodeValue) ? selectedKeys.filter(function (key) {
+        return key !== nodeValue;
+      }) : [].concat(_toConsumableArray(selectedKeys), [nodeValue]);
+      updateValue(nextKeys);
+      return;
+    }
+    updateValue([nodeValue]);
+    setDropdownOpen(false);
+  };
+  var toggleExpandedNode = function toggleExpandedNode(nodeKey) {
+    setExpandedKeys(function (current) {
+      return current.includes(nodeKey) ? current.filter(function (key) {
+        return key !== nodeKey;
+      }) : [].concat(_toConsumableArray(current), [nodeKey]);
+    });
+  };
+  var renderTree = function renderTree(nodes) {
+    var depth = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
+    return nodes.map(function (node) {
+      var _node$children2;
+      var expanded = expandedKeys.includes(node.key);
+      var nodeValue = getNodeValue(node);
+      var selected = selectedKeys.includes(nodeValue);
+      var hasChildren = Boolean((_node$children2 = node.children) === null || _node$children2 === void 0 ? void 0 : _node$children2.length);
+      var isExpanded = Boolean(hasChildren && (query.trim() || expanded));
+      var label = getNodeLabel(node);
+      var labelText = nodeText(label) || nodeValue;
+      var nodeInteractionDisabled = Boolean(disabled || node.disabled || isCheckable && node.disableCheckbox);
+      var nodePressed = pressedNodeKey === node.key && !nodeInteractionDisabled;
+      return /*#__PURE__*/_jsxs(View, {
+        "data-slot": "tree-select-node-wrapper",
+        children: [/*#__PURE__*/_jsxs(View, {
+          role: "option",
+          ariaLabel: "".concat(labelText).concat(selected ? '，已选中' : '').concat(node.disabled ? '，已禁用' : '').concat(isCheckable && node.disableCheckbox ? '，复选框已禁用' : ''),
+          "aria-selected": selected,
+          "aria-disabled": nodeInteractionDisabled,
+          tabIndex: nodeInteractionDisabled ? -1 : 0,
+          "data-slot": "tree-select-node",
+          "data-key": node.key,
+          "data-depth": depth,
+          "data-selected": selected ? 'true' : 'false',
+          "data-disabled": nodeInteractionDisabled ? 'true' : 'false',
+          className: classNames("".concat(config.prefixCls, "-tree-select__node"), selected && "".concat(config.prefixCls, "-tree-select__node--selected"), nodeInteractionDisabled && "".concat(config.prefixCls, "-tree-select__node--disabled")),
+          onClick: function onClick() {
+            return toggleNode(node);
+          },
+          onKeyDown: function onKeyDown(event) {
+            var _event$preventDefault;
+            if (!isActivationKey(event) || nodeInteractionDisabled) return;
+            (_event$preventDefault = event.preventDefault) === null || _event$preventDefault === void 0 || _event$preventDefault.call(event);
+            toggleNode(node);
+          },
+          onMouseDown: function onMouseDown() {
+            return !nodeInteractionDisabled && setPressedNodeKey(node.key);
+          },
+          onMouseUp: function onMouseUp() {
+            return setPressedNodeKey(null);
+          },
+          onMouseLeave: function onMouseLeave() {
+            return setPressedNodeKey(null);
+          },
+          onTouchStart: function onTouchStart() {
+            return !nodeInteractionDisabled && setPressedNodeKey(node.key);
+          },
+          onTouchEnd: function onTouchEnd() {
+            return setPressedNodeKey(null);
+          },
+          onTouchCancel: function onTouchCancel() {
+            return setPressedNodeKey(null);
+          },
+          style: {
+            boxSizing: 'border-box',
+            minHeight: controlTokens.height,
+            display: 'flex',
+            flexDirection: 'row',
+            alignItems: 'center',
+            gap: controlTokens.gap,
+            paddingTop: tokens.nodePaddingY,
+            paddingBottom: tokens.nodePaddingY,
+            paddingRight: tokens.nodePaddingX,
+            paddingLeft: tokens.nodePaddingX + depth * 16,
+            borderRadius: radius.sm,
+            backgroundColor: selected ? colors.accent : nodePressed ? withOpacity(colors.accent, 0.55) : 'transparent',
+            opacity: disabled || node.disabled ? 0.45 : 1,
+            cursor: nodeInteractionDisabled ? 'not-allowed' : 'pointer',
+            transition: "background-color ".concat(motion.durationsMs.emphasis, "ms ").concat(motion.easing.standard, ", opacity ").concat(motion.durationsMs.emphasis, "ms ").concat(motion.easing.standard)
+          },
+          children: [hasChildren ? /*#__PURE__*/_jsx(View, {
+            role: "button",
+            ariaLabel: "".concat(isExpanded ? '收起' : '展开').concat(labelText),
+            "aria-expanded": isExpanded,
+            "aria-disabled": disabled,
+            tabIndex: disabled ? -1 : 0,
+            "data-slot": "tree-select-expand",
+            className: "".concat(config.prefixCls, "-tree-select__expand"),
+            onClick: function onClick(event) {
+              var _event$stopPropagatio;
+              (_event$stopPropagatio = event.stopPropagation) === null || _event$stopPropagatio === void 0 || _event$stopPropagatio.call(event);
+              toggleExpandedNode(node.key);
+            },
+            onKeyDown: function onKeyDown(event) {
+              var _event$preventDefault2, _event$stopPropagatio2;
+              if (!isActivationKey(event) || disabled) return;
+              (_event$preventDefault2 = event.preventDefault) === null || _event$preventDefault2 === void 0 || _event$preventDefault2.call(event);
+              (_event$stopPropagatio2 = event.stopPropagation) === null || _event$stopPropagatio2 === void 0 || _event$stopPropagatio2.call(event);
+              toggleExpandedNode(node.key);
+            },
+            style: {
+              width: 16,
+              height: 16,
+              display: 'flex',
+              alignItems: 'center',
+              justifyContent: 'center',
+              cursor: disabled ? 'not-allowed' : 'pointer'
+            },
+            children: /*#__PURE__*/_jsx(Icon, {
+              name: isExpanded ? 'ChevronDown' : 'ChevronRight',
+              size: 14,
+              color: colors['muted-foreground']
+            })
+          }) : /*#__PURE__*/_jsx(View, {
+            "data-slot": "tree-select-indent",
+            style: {
+              width: 16,
+              height: 16
+            }
+          }), isCheckable ? /*#__PURE__*/_jsx(View, {
+            role: "checkbox",
+            ariaLabel: "".concat(selected ? '取消选择' : '选择').concat(labelText),
+            "aria-checked": selected,
+            "aria-disabled": nodeInteractionDisabled,
+            tabIndex: -1,
+            "data-slot": "tree-select-checkbox",
+            className: "".concat(config.prefixCls, "-tree-select__checkbox"),
+            style: {
+              width: 16,
+              height: 16,
+              boxSizing: 'border-box',
+              display: 'flex',
+              alignItems: 'center',
+              justifyContent: 'center',
+              borderWidth: 1,
+              borderStyle: 'solid',
+              borderColor: selected ? colors.primary : colors.border,
+              borderRadius: radius.sm,
+              backgroundColor: selected ? colors.primary : colors.background,
+              opacity: node.disableCheckbox ? 0.45 : 1
+            },
+            children: selected ? /*#__PURE__*/_jsx(Icon, {
+              name: "Check",
+              size: 11,
+              color: colors['primary-foreground']
+            }) : null
+          }) : null, /*#__PURE__*/_jsxs(View, {
+            "data-slot": "tree-select-node-content",
+            style: {
+              flex: 1,
+              minWidth: 0
+            },
+            children: [renderNode(label, {
+              fontSize: tokens.itemFontSize,
+              fontWeight: tokens.itemFontWeight,
+              color: selected ? colors['accent-foreground'] : colors['popover-foreground'],
+              lineHeight: 1.4
+            }), node.description ? /*#__PURE__*/_jsx(View, {
+              style: {
+                marginTop: 2
+              },
+              children: renderNode(node.description, {
+                fontSize: tokens.descriptionFontSize,
+                fontWeight: 400,
+                color: selected ? withOpacity(colors['accent-foreground'], 0.75) : colors['muted-foreground'],
+                lineHeight: 1.4
+              })
+            }) : null]
+          })]
+        }), isExpanded && renderTree(node.children, depth + 1)]
+      }, node.key);
+    });
+  };
+  var hasSelection = selectedKeys.length > 0;
+  var showClear = allowClear && hasSelection && !disabled;
+  var triggerBorderWidth = variant === 'outline' || variant === 'underlined' ? 2 : 1;
+  var isUnderlined = variant === 'underlined';
+  var triggerBackground = variant === 'filled' ? colors.muted : variant === 'borderless' || isUnderlined ? 'transparent' : colors.background;
+  var triggerBorder = variant === 'borderless' ? 'transparent' : open || triggerPressed ? colors.primary : colors.border;
+  var maxPanelHeight = (_dropdownPosition$max = dropdownPosition === null || dropdownPosition === void 0 ? void 0 : dropdownPosition.maxHeight) !== null && _dropdownPosition$max !== void 0 ? _dropdownPosition$max : 256;
+  var searchHeight = isSearchable ? controlTokens.height + 8 : 0;
+  var dropdownStyle = dropdownPosition ? {
+    position: 'fixed',
+    top: dropdownPosition.top,
+    bottom: dropdownPosition.bottom,
+    left: dropdownPosition.left,
+    width: dropdownPosition.width
+  } : {
+    position: 'absolute',
+    top: 'calc(100% + 4px)',
+    left: 0,
+    right: 0,
+    width: '100%'
+  };
+  return /*#__PURE__*/_jsxs(View, {
+    "data-slot": "tree-select",
+    "data-size": size,
+    "data-variant": variant,
+    "data-disabled": disabled ? 'true' : 'false',
+    className: classNames("".concat(config.prefixCls, "-tree-select"), "".concat(config.prefixCls, "-tree-select--").concat(size), "".concat(config.prefixCls, "-tree-select--").concat(variant), className),
+    style: _objectSpread({
+      position: 'relative',
+      width: '100%',
+      minWidth: 0
+    }, style),
+    onKeyDown: function onKeyDown(event) {
+      var key = event.key;
+      if (key === 'Escape' && open) setDropdownOpen(false);
+    },
+    children: [/*#__PURE__*/_jsxs(View, {
+      id: triggerId,
+      role: "combobox",
+      ariaLabel: nodeText(placeholder) || '请选择',
+      "aria-expanded": open,
+      "aria-controls": dropdownId,
+      "aria-haspopup": "listbox",
+      "aria-disabled": disabled,
+      "data-slot": "tree-select-trigger",
+      "data-open": open ? 'true' : 'false',
+      className: classNames("".concat(config.prefixCls, "-tree-select__trigger"), "".concat(config.prefixCls, "-tree-select__trigger--").concat(size), "".concat(config.prefixCls, "-tree-select__trigger--").concat(variant), open && "".concat(config.prefixCls, "-tree-select__trigger--open"), disabled && "".concat(config.prefixCls, "-tree-select__trigger--disabled")),
+      style: {
+        boxSizing: 'border-box',
+        display: 'flex',
+        flexDirection: 'row',
+        alignItems: 'center',
+        width: '100%',
+        minWidth: 0,
+        minHeight: multiMode && hasSelection ? controlTokens.minHeight : controlTokens.height,
+        paddingTop: multiMode && hasSelection ? 4 : 0,
+        paddingBottom: multiMode && hasSelection ? 4 : 0,
+        paddingLeft: isUnderlined ? 0 : controlTokens.inlinePadding,
+        paddingRight: isUnderlined ? 0 : controlTokens.inlinePadding,
+        gap: controlTokens.gap,
+        borderTopWidth: isUnderlined ? 0 : triggerBorderWidth,
+        borderRightWidth: isUnderlined ? 0 : triggerBorderWidth,
+        borderBottomWidth: triggerBorderWidth,
+        borderLeftWidth: isUnderlined ? 0 : triggerBorderWidth,
+        borderStyle: 'solid',
+        borderColor: triggerBorder,
+        borderRadius: isUnderlined ? 0 : radius.md,
+        backgroundColor: triggerPressed && variant === 'filled' ? colors.accent : triggerBackground,
+        boxShadow: open ? "0 0 0 1px ".concat(withOpacity(colors.ring, 0.18)) : 'none',
+        opacity: disabled ? 0.5 : 1,
+        cursor: disabled ? 'not-allowed' : 'pointer',
+        transition: "background-color ".concat(motion.durationsMs.emphasis, "ms ").concat(motion.easing.standard, ", border-color ").concat(motion.durationsMs.emphasis, "ms ").concat(motion.easing.standard, ", box-shadow ").concat(motion.durationsMs.emphasis, "ms ").concat(motion.easing.standard, ", opacity ").concat(motion.durationsMs.emphasis, "ms ").concat(motion.easing.standard)
+      },
+      onClick: function onClick() {
+        return void handleTriggerClick();
+      },
+      onMouseDown: function onMouseDown() {
+        return !disabled && setTriggerPressed(true);
+      },
+      onMouseUp: function onMouseUp() {
+        return setTriggerPressed(false);
+      },
+      onMouseLeave: function onMouseLeave() {
+        return setTriggerPressed(false);
+      },
+      onTouchStart: function onTouchStart() {
+        return !disabled && setTriggerPressed(true);
+      },
+      onTouchEnd: function onTouchEnd() {
+        return setTriggerPressed(false);
+      },
+      onTouchCancel: function onTouchCancel() {
+        return setTriggerPressed(false);
+      },
+      tabIndex: disabled ? -1 : 0,
+      onKeyDown: function onKeyDown(event) {
+        if (isActivationKey(event)) {
+          var _preventDefault, _ref4;
+          (_preventDefault = (_ref4 = event).preventDefault) === null || _preventDefault === void 0 || _preventDefault.call(_ref4);
+          void handleTriggerClick();
+        }
+      },
+      children: [/*#__PURE__*/_jsx(View, {
+        "data-slot": "tree-select-value",
+        className: "".concat(config.prefixCls, "-tree-select__value"),
+        style: {
+          flex: 1,
+          minWidth: 0,
+          display: 'flex',
+          flexDirection: 'row',
+          flexWrap: 'wrap',
+          alignItems: 'center',
+          gap: 4,
+          overflow: 'hidden'
+        },
+        children: !hasSelection ? renderNode(placeholder, {
+          minWidth: 0,
+          fontSize: controlTokens.textSize,
+          color: colors['muted-foreground'],
+          overflow: 'hidden',
+          textOverflow: 'ellipsis',
+          whiteSpace: 'nowrap'
+        }) : multiMode ? selectedKeys.map(function (selectedKey) {
+          var node = selectedNodes.find(function (item) {
+            return getNodeValue(item) === selectedKey;
+          });
+          var nodeValue = selectedKey;
+          var nodeLabel = node ? getNodeLabel(node) : selectedKey;
+          return /*#__PURE__*/_jsxs(View, {
+            "data-slot": "tree-select-tag",
+            className: "".concat(config.prefixCls, "-tree-select__tag"),
+            style: {
+              display: 'inline-flex',
+              flexDirection: 'row',
+              alignItems: 'center',
+              maxWidth: '100%',
+              gap: 4,
+              padding: size === 'mini' ? '2px 6px' : size === 'small' ? '2px 8px' : size === 'large' ? '4px 10px' : '4px 8px',
+              borderRadius: radius.sm,
+              backgroundColor: colors.accent,
+              color: colors['accent-foreground']
+            },
+            children: [renderNode(nodeLabel, {
+              fontSize: tokens.tagFontSize,
+              fontWeight: 500,
+              color: colors['accent-foreground'],
+              overflow: 'hidden',
+              textOverflow: 'ellipsis',
+              whiteSpace: 'nowrap'
+            }), !disabled ? /*#__PURE__*/_jsx(View, {
+              role: "button",
+              ariaLabel: "\u79FB\u9664".concat(nodeText(nodeLabel) || nodeValue),
+              tabIndex: 0,
+              "data-slot": "tree-select-tag-remove",
+              className: "".concat(config.prefixCls, "-tree-select__tag-remove"),
+              onClick: function onClick(event) {
+                var _event$stopPropagatio3;
+                (_event$stopPropagatio3 = event.stopPropagation) === null || _event$stopPropagatio3 === void 0 || _event$stopPropagatio3.call(event);
+                updateValue(selectedKeys.filter(function (key) {
+                  return key !== nodeValue;
+                }));
+              },
+              onKeyDown: function onKeyDown(event) {
+                var _event$preventDefault3, _event$stopPropagatio4;
+                if (!isActivationKey(event)) return;
+                (_event$preventDefault3 = event.preventDefault) === null || _event$preventDefault3 === void 0 || _event$preventDefault3.call(event);
+                (_event$stopPropagatio4 = event.stopPropagation) === null || _event$stopPropagatio4 === void 0 || _event$stopPropagatio4.call(event);
+                updateValue(selectedKeys.filter(function (key) {
+                  return key !== nodeValue;
+                }));
+              },
+              children: /*#__PURE__*/_jsx(Icon, {
+                name: "X",
+                size: Math.max(10, tokens.tagFontSize),
+                color: colors['muted-foreground']
+              })
+            }) : null]
+          }, nodeValue);
+        }) : renderNode(getNodeLabel((_selectedNodes$ = selectedNodes[0]) !== null && _selectedNodes$ !== void 0 ? _selectedNodes$ : {
+          key: selectedKeys[0]
+        }), {
+          minWidth: 0,
+          fontSize: controlTokens.textSize,
+          color: colors.foreground,
+          overflow: 'hidden',
+          textOverflow: 'ellipsis',
+          whiteSpace: 'nowrap'
+        })
+      }), /*#__PURE__*/_jsxs(View, {
+        "data-slot": "tree-select-actions",
+        style: {
+          display: 'flex',
+          flexDirection: 'row',
+          alignItems: 'center',
+          gap: 4
+        },
+        children: [showClear ? /*#__PURE__*/_jsx(View, {
+          role: "button",
+          ariaLabel: nodeText(clearLabel),
+          tabIndex: 0,
+          "data-slot": "tree-select-clear",
+          className: "".concat(config.prefixCls, "-tree-select__clear"),
+          onClick: function onClick(event) {
+            var _event$stopPropagatio5;
+            (_event$stopPropagatio5 = event.stopPropagation) === null || _event$stopPropagatio5 === void 0 || _event$stopPropagatio5.call(event);
+            updateValue([]);
+          },
+          onKeyDown: function onKeyDown(event) {
+            var _event$preventDefault4, _event$stopPropagatio6;
+            if (!isActivationKey(event)) return;
+            (_event$preventDefault4 = event.preventDefault) === null || _event$preventDefault4 === void 0 || _event$preventDefault4.call(event);
+            (_event$stopPropagatio6 = event.stopPropagation) === null || _event$stopPropagatio6 === void 0 || _event$stopPropagatio6.call(event);
+            updateValue([]);
+          },
+          children: /*#__PURE__*/_jsx(Icon, {
+            name: "X",
+            size: Math.max(12, controlTokens.iconSize - 2),
+            color: colors['muted-foreground']
+          })
+        }) : null, /*#__PURE__*/_jsx(View, {
+          "data-slot": "tree-select-arrow",
+          className: "".concat(config.prefixCls, "-tree-select__arrow"),
+          style: {
+            display: 'flex',
+            alignItems: 'center',
+            justifyContent: 'center',
+            width: controlTokens.iconSize,
+            height: controlTokens.iconSize,
+            transform: open ? 'rotate(180deg)' : 'rotate(0deg)',
+            transition: 'transform var(--x-duration-emphasis) var(--x-easing-standard)'
+          },
+          children: /*#__PURE__*/_jsx(Icon, {
+            name: "ChevronDown",
+            size: Math.max(12, controlTokens.iconSize - 2),
+            color: colors['muted-foreground']
+          })
+        })]
+      })]
+    }), open ? /*#__PURE__*/_jsxs(Portal, {
+      root: Boolean(dropdownPosition),
+      container: getPopupContainer ? resolvePopupContainer : undefined,
+      className: "".concat(config.prefixCls, "-tree-select__portal"),
+      hostStyle: portalThemeStyle,
+      children: [/*#__PURE__*/_jsx(View, {
+        "data-slot": "tree-select-backdrop",
+        "aria-hidden": true,
+        className: "".concat(config.prefixCls, "-tree-select__backdrop"),
+        catchMove: true,
+        onClick: function onClick() {
+          return setDropdownOpen(false);
+        },
+        style: {
+          position: 'fixed',
+          top: 0,
+          right: 0,
+          bottom: 0,
+          left: 0,
+          zIndex: 1099,
+          backgroundColor: 'transparent'
+        }
+      }), /*#__PURE__*/_jsxs(View, {
+        id: dropdownId,
+        "data-slot": "tree-select-dropdown",
+        "data-position": (dropdownPosition === null || dropdownPosition === void 0 ? void 0 : dropdownPosition.top) === undefined ? 'top' : 'bottom',
+        className: "".concat(config.prefixCls, "-tree-select__dropdown"),
+        role: "listbox",
+        ariaLabel: "".concat(nodeText(placeholder) || '请选择', "\u9009\u9879"),
+        style: _objectSpread(_objectSpread({}, dropdownStyle), {}, {
+          boxSizing: 'border-box',
+          zIndex: 1100,
+          maxHeight: maxPanelHeight,
+          overflow: 'hidden',
+          padding: size === 'mini' ? 4 : size === 'small' ? 6 : size === 'large' ? 10 : 8,
+          borderWidth: 1,
+          borderStyle: 'solid',
+          borderColor: colors.border,
+          borderRadius: radius.lg,
+          backgroundColor: colors.popover,
+          boxShadow: 'var(--x-shadow-lg)',
+          animation: "x-tree-select-dropdown-enter ".concat(motion.durationsMs.emphasis, "ms ").concat(motion.easing.standard)
+        }),
+        children: [isSearchable ? /*#__PURE__*/_jsx(View, {
+          "data-slot": "tree-select-search",
+          className: "".concat(config.prefixCls, "-tree-select__search"),
+          style: {
+            paddingBottom: 8
+          },
+          children: /*#__PURE__*/_jsx(TaroInput, {
+            "data-slot": "tree-select-search-input",
+            className: "".concat(config.prefixCls, "-tree-select__search-input"),
+            value: query,
+            ariaLabel: nodeText(searchPlaceholder),
+            placeholder: "".concat(nodeText(searchPlaceholder), "..."),
+            onInput: function onInput(event) {
+              return setQuery(event.detail.value);
+            },
+            style: {
+              boxSizing: 'border-box',
+              width: '100%',
+              height: controlTokens.height,
+              paddingLeft: controlTokens.inlinePadding,
+              paddingRight: controlTokens.inlinePadding,
+              fontSize: controlTokens.textSize,
+              color: colors.foreground,
+              borderWidth: 1,
+              borderStyle: 'solid',
+              borderColor: colors.input,
+              borderRadius: radius.md,
+              backgroundColor: colors.background
+            }
+          })
+        }) : null, /*#__PURE__*/_jsx(ScrollView, {
+          scrollY: true,
+          "data-slot": "tree-select-tree",
+          className: "".concat(config.prefixCls, "-tree-select__tree"),
+          style: {
+            maxHeight: Math.max(0, maxPanelHeight - searchHeight)
+          },
+          children: filteredTree.length > 0 ? renderTree(filteredTree) : /*#__PURE__*/_jsx(View, {
+            "data-slot": "tree-select-empty",
+            className: "".concat(config.prefixCls, "-tree-select__empty"),
+            style: {
+              padding: 20,
+              display: 'flex',
+              alignItems: 'center',
+              justifyContent: 'center'
+            },
+            children: renderNode(emptyText, {
+              fontSize: tokens.itemFontSize,
+              color: colors['muted-foreground'],
+              textAlign: 'center'
+            })
+          })
+        })]
+      })]
+    }) : null]
+  });
+};
+TreeSelect.displayName = 'TreeSelect';
+export default TreeSelect;