@blueking/bk-user-selector 0.0.39-beta.3 → 0.1.1-beta.1

package/vue3/index.umd.min.js

@@ -3,589 +3,228 @@
 })(this, function(exports2, vue, bkuiVue) {
   "use strict";
   var __vite_style__ = document.createElement("style");
-  __vite_style__.textContent = ".me-tag[data-v-ef4a05c4] {\n  position: absolute;\n  top: 50%;\n  right: 8px;\n  z-index: 1;\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  width: 24px;\n  height: 24px;\n  padding: 0 8px;\n  font-size: 12px;\n  color: #4d4f56;\n  white-space: nowrap;\n  cursor: pointer;\n  background-color: #e1ecff;\n  border-radius: 50%;\n  transform: translateY(-50%);\n}\n.me-tag[data-v-ef4a05c4]:hover {\n  color: #3a84ff;\n  background-color: #cddffe;\n}\n.me-tag.disabled[data-v-ef4a05c4] {\n  color: #c4c6cc;\n  cursor: not-allowed;\n  background-color: #f0f1f5;\n}.dropdown-content[data-v-78875ea6] {\n  min-height: 40px;\n  max-height: 300px;\n  padding: 5px 0;\n  overflow-y: auto;\n}\n.dropdown-content .no-data[data-v-78875ea6] {\n  padding: 10px;\n  color: #979ba5;\n  text-align: center;\n}\n.dropdown-content .user-group .group-header[data-v-78875ea6] {\n  display: flex;\n  align-items: center;\n  padding: 8px 12px;\n  color: #979ba5;\n}\n.dropdown-content .user-group .group-header .group-count[data-v-78875ea6] {\n  margin-left: 4px;\n}\n.dropdown-content .user-option[data-v-78875ea6] {\n  display: flex;\n  align-items: center;\n  height: 32px;\n  padding: 8px 12px;\n  cursor: pointer;\n}\n.dropdown-content .user-option[data-v-78875ea6]:hover {\n  background-color: #f5f7fa;\n}.user-tag[data-v-48ac8fc1] {\n  margin-right: 4px;\n  margin-left: 0;\n}\n.user-tag.draggable[data-v-48ac8fc1] {\n  cursor: move;\n}\n.user-tag.active[data-v-48ac8fc1] {\n  background-color: #e1ecff;\n  border-color: #3a84ff;\n}\n.user-tag.is-custom[data-v-48ac8fc1] {\n  color: #ea3636;\n  background-color: #feebea;\n  border-color: rgba(234, 53, 54, 0.3019607843);\n}\n.user-tag.is-custom[data-v-48ac8fc1]:hover {\n  background-color: #fedddc;\n}\n.user-tag .tag-content .user-name[data-v-48ac8fc1] {\n  overflow: hidden;\n  text-overflow: ellipsis;\n  font-size: 12px;\n  white-space: nowrap;\n}.multiple-selector[data-v-2a532f24] {\n  position: relative;\n  width: 100%;\n}\n.multiple-selector.is-disabled[data-v-2a532f24] {\n  pointer-events: none;\n}\n.multiple-selector .tags-container[data-v-2a532f24] {\n  min-height: 32px;\n  padding: 1px 10px 1px 8px;\n  background-color: #fff;\n  border: 1px solid #c4c6cc;\n  border-radius: 2px;\n  transition: all 0.2s ease;\n}\n.multiple-selector .tags-container.focused[data-v-2a532f24] {\n  border-color: #3a84ff;\n  box-shadow: 0 0 0 2px rgba(58, 132, 255, 0.1);\n}\n.multiple-selector .tags-container.collapsed[data-v-2a532f24] {\n  display: flex;\n  flex-wrap: wrap;\n  align-items: center;\n}\n.multiple-selector .tag-list[data-v-2a532f24] {\n  display: flex;\n  flex-wrap: wrap;\n  align-items: center;\n}\n.multiple-selector .tag-wrapper[data-v-2a532f24] {\n  display: inline-flex;\n  align-items: center;\n  max-width: 100%;\n}\n.multiple-selector .search-input[data-v-2a532f24] {\n  min-width: 10px;\n  height: 28px;\n  outline: none;\n  background: transparent;\n  border: none;\n}\n.multiple-selector .search-input[data-v-2a532f24]::placeholder {\n  color: #c4c6cc;\n}\n.multiple-selector .search-input.inline[data-v-2a532f24] {\n  min-width: 10px;\n}\n.multiple-selector .search-input.last[data-v-2a532f24], .multiple-selector .search-input.collapsed[data-v-2a532f24] {\n  flex: 1;\n}\n.hidden-users[data-v-2a532f24] {\n  padding: 6px 10px;\n}.single-selector[data-v-cbe352a6] {\n  position: relative;\n  width: 100%;\n}\n.single-selector.is-disabled[data-v-cbe352a6] {\n  pointer-events: none;\n}\n.input-container[data-v-cbe352a6] {\n  position: relative;\n  display: flex;\n  align-items: center;\n  min-height: 32px;\n  padding: 0 8px;\n  background-color: #fff;\n  border: 1px solid #c4c6cc;\n  border-radius: 2px;\n}\n.input-container[data-v-cbe352a6]:focus-within {\n  border-color: #3a84ff;\n  box-shadow: 0 0 0 2px rgba(58, 132, 255, 0.1);\n}\n.search-input[data-v-cbe352a6] {\n  flex: 1;\n  height: 30px;\n  outline: none;\n  background: transparent;\n  border: none;\n}\n.search-input[data-v-cbe352a6]::placeholder {\n  color: #c4c6cc;\n}.bk-user-selector[data-v-9c628c83] {\n  position: relative;\n  width: 100%;\n  font-size: 12px;\n}\n.bk-user-selector.is-disabled[data-v-9c628c83] {\n  cursor: not-allowed;\n  background-color: #dcdee5;\n}.bk-user-selector-popover {\n  padding: 0 !important;\n}";
+  __vite_style__.textContent = ".me-tag[data-v-4f251ce1] {\n  position: absolute;\n  top: 50%;\n  right: 8px;\n  z-index: 1;\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  width: 24px;\n  height: 24px;\n  padding: 0 8px;\n  font-size: 12px;\n  color: #4d4f56;\n  white-space: nowrap;\n  cursor: pointer;\n  background-color: #e1ecff;\n  border-radius: 50%;\n  transform: translateY(-50%);\n}\n.me-tag[data-v-4f251ce1]:hover {\n  color: #3a84ff;\n  background-color: #cddffe;\n}\n.me-tag.disabled[data-v-4f251ce1] {\n  color: #c4c6cc;\n  cursor: not-allowed;\n  background-color: #f0f1f5;\n}.dropdown-content[data-v-d5a338f0] {\n  min-height: 40px;\n  max-height: 300px;\n  padding: 5px 0;\n  overflow-y: auto;\n}\n.dropdown-content .no-data[data-v-d5a338f0] {\n  padding: 10px;\n  color: #979ba5;\n  text-align: center;\n}\n.dropdown-content .user-group .group-header[data-v-d5a338f0] {\n  display: flex;\n  align-items: center;\n  padding: 8px 12px;\n  color: #979ba5;\n}\n.dropdown-content .user-group .group-header .group-count[data-v-d5a338f0] {\n  margin-left: 4px;\n}\n.dropdown-content .user-option[data-v-d5a338f0] {\n  display: flex;\n  align-items: center;\n  height: 32px;\n  padding: 8px 12px;\n  cursor: pointer;\n}\n.dropdown-content .user-option[data-v-d5a338f0]:hover {\n  background-color: #f5f7fa;\n}.user-tag[data-v-1f2e0737] {\n  margin-right: 4px;\n  margin-left: 0;\n}\n.user-tag.draggable[data-v-1f2e0737] {\n  cursor: move;\n}\n.user-tag.active[data-v-1f2e0737] {\n  background-color: #e1ecff;\n  border-color: #3a84ff;\n}\n.user-tag.is-custom[data-v-1f2e0737] {\n  color: #ea3636;\n  background-color: #feebea;\n  border-color: rgba(234, 53, 54, 0.3019607843);\n}\n.user-tag.is-custom[data-v-1f2e0737]:hover {\n  background-color: #fedddc;\n}\n.user-tag .tag-content .user-name[data-v-1f2e0737] {\n  overflow: hidden;\n  text-overflow: ellipsis;\n  font-size: 12px;\n  white-space: nowrap;\n}.bk-user-selector[data-v-9975c7e1] {\n  position: relative;\n  width: 100%;\n  height: 32px;\n  font-size: 12px;\n}\n.bk-user-selector.is-disabled[data-v-9975c7e1] {\n  pointer-events: none;\n  cursor: not-allowed;\n  background-color: #dcdee5;\n}\n.bk-user-selector .tags-container[data-v-9975c7e1] {\n  position: relative;\n  min-height: 32px;\n  padding: 1px 10px 1px 8px;\n  background-color: #fff;\n  border: 1px solid #c4c6cc;\n  border-radius: 2px;\n  transition: all 0.2s ease;\n}\n.bk-user-selector .tags-container.focused[data-v-9975c7e1] {\n  border-color: #3a84ff;\n  box-shadow: 0 0 0 2px rgba(58, 132, 255, 0.1);\n}\n.bk-user-selector .tags-container.tags-container-collapsed[data-v-9975c7e1] {\n  display: flex;\n  flex-wrap: wrap;\n  align-items: center;\n}\n.bk-user-selector .tag-list[data-v-9975c7e1] {\n  display: flex;\n  flex-wrap: wrap;\n  align-items: center;\n}\n.bk-user-selector .tag-wrapper[data-v-9975c7e1] {\n  display: inline-flex;\n  align-items: center;\n  max-width: 100%;\n}\n.bk-user-selector .search-input[data-v-9975c7e1] {\n  min-width: 20px;\n  height: 28px;\n  outline: none;\n  background: transparent;\n  border: none;\n}\n.bk-user-selector .search-input[data-v-9975c7e1]::placeholder {\n  color: #c4c6cc;\n}\n.bk-user-selector .search-input.input-inline[data-v-9975c7e1] {\n  min-width: 20px;\n}\n.bk-user-selector .search-input.input-last[data-v-9975c7e1], .bk-user-selector .search-input.search-input-collapsed[data-v-9975c7e1] {\n  flex: 1;\n}\n.hidden-users[data-v-9975c7e1] {\n  padding: 6px 10px;\n}.bk-user-selector-popover {\n  padding: 0 !important;\n}";
   document.head.appendChild(__vite_style__);
-  const generateCallbackName = () => {
-    const timestamp = Date.now();
-    const random = Math.random().toString(36).slice(2, 9);
-    return `__jsonp_callback_${timestamp}_${random}`;
-  };
-  const jsonpRequest = (requestUrl, options = {}) => {
-    return new Promise((resolve, reject) => {
-      const url = vue.unref(requestUrl);
-      const { timeout = 1e3 * 60 * 2, params } = options;
-      const callbackName = generateCallbackName();
-      const script = document.createElement("script");
-      let timeoutId = null;
-      script.setAttribute("type", "text/javascript");
-      const cleanup = () => {
-        if (timeoutId) {
-          clearTimeout(timeoutId);
+  var commonjsGlobal = typeof globalThis !== "undefined" ? globalThis : typeof window !== "undefined" ? window : typeof global !== "undefined" ? global : typeof self !== "undefined" ? self : {};
+  function getDefaultExportFromCjs(x) {
+    return x && x.__esModule && Object.prototype.hasOwnProperty.call(x, "default") ? x["default"] : x;
+  }
+  var Sortable$1 = { exports: {} };
+  /**!
+   * Sortable 1.15.6
+   * @author	RubaXa   <trash@rubaxa.org>
+   * @author	owenm    <owen23355@gmail.com>
+   * @license MIT
+   */
+  (function(module2, exports3) {
+    (function(global2, factory) {
+      module2.exports = factory();
+    })(commonjsGlobal, function() {
+      function ownKeys(object, enumerableOnly) {
+        var keys = Object.keys(object);
+        if (Object.getOwnPropertySymbols) {
+          var symbols = Object.getOwnPropertySymbols(object);
+          if (enumerableOnly) {
+            symbols = symbols.filter(function(sym) {
+              return Object.getOwnPropertyDescriptor(object, sym).enumerable;
+            });
+          }
+          keys.push.apply(keys, symbols);
         }
-        if (script.parentNode) {
-          script.parentNode.removeChild(script);
+        return keys;
+      }
+      function _objectSpread2(target) {
+        for (var i = 1; i < arguments.length; i++) {
+          var source = arguments[i] != null ? arguments[i] : {};
+          if (i % 2) {
+            ownKeys(Object(source), true).forEach(function(key) {
+              _defineProperty(target, key, source[key]);
+            });
+          } else if (Object.getOwnPropertyDescriptors) {
+            Object.defineProperties(target, Object.getOwnPropertyDescriptors(source));
+          } else {
+            ownKeys(Object(source)).forEach(function(key) {
+              Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
+            });
+          }
         }
-        if (window[callbackName]) {
-          delete window[callbackName];
+        return target;
+      }
+      function _typeof(obj) {
+        "@babel/helpers - typeof";
+        if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") {
+          _typeof = function(obj2) {
+            return typeof obj2;
+          };
+        } else {
+          _typeof = function(obj2) {
+            return obj2 && typeof Symbol === "function" && obj2.constructor === Symbol && obj2 !== Symbol.prototype ? "symbol" : typeof obj2;
+          };
         }
-      };
-      window[callbackName] = (data) => {
-        cleanup();
-        resolve(data.data || data);
-      };
-      timeoutId = setTimeout(() => {
-        cleanup();
-        reject(new Error(`JSONP request timeout: ${url}`));
-      }, timeout);
-      script.onerror = () => {
-        cleanup();
-        reject(new Error(`JSONP request failed: ${url}`));
-      };
-      const separator = url.includes("?") ? "&" : "?";
-      const paramsStr = params ? `&${Object.entries(params).map(([key, value]) => value ? `${key}=${value}` : "").filter(Boolean).join("&")}` : "";
-      script.src = `${url}${separator}callback=${callbackName}${paramsStr}`;
-      document.head.appendChild(script);
-    });
-  };
-  const getTenants = async (apiBaseUrl, tenantId) => {
-    if (!apiBaseUrl || !tenantId) {
-      console.warn("获取租户信息需要提供有效的apiBaseUrl和租户ID");
-      return [];
-    }
-    try {
-      const url = `${apiBaseUrl}/api/v3/open-web/tenant/data-source-owner-tenants/`;
-      const response = await fetch(url, {
-        method: "GET",
-        headers: {
-          "x-bk-tenant-id": tenantId
-        },
-        credentials: "include"
-      });
-      if (!response.ok) {
-        throw new Error(`获取租户信息失败: ${response.status} ${response.statusText}`);
+        return _typeof(obj);
       }
-      const data = await response.json();
-      return data.data || [];
-    } catch (error) {
-      console.error("获取租户信息失败:", error);
-      return [];
-    }
-  };
-  const searchUsers = async (params) => {
-    const { apiBaseUrl, tenantId, keyword, enableMultiTenantMode = true } = params;
-    if (!enableMultiTenantMode) {
-      const userList = await getUserList(apiBaseUrl, {
-        keyword,
-        pageSize: 100,
-        page: 1
-      }).catch(() => {
-        return [];
-      });
-      return userList;
-    }
-    if (!keyword || !apiBaseUrl || !tenantId) {
-      console.warn("搜索用户需要提供有效的apiBaseUrl、租户ID和关键词");
-      return [];
-    }
-    try {
-      const url = `${apiBaseUrl}/api/v3/open-web/tenant/users/-/search/?keyword=${encodeURIComponent(keyword)}`;
-      const response = await fetch(url, {
-        method: "GET",
-        headers: {
-          "x-bk-tenant-id": tenantId
-        },
-        credentials: "include"
-      });
-      if (!response.ok) {
-        throw new Error(`搜索用户失败: ${response.status} ${response.statusText}`);
+      function _defineProperty(obj, key, value) {
+        if (key in obj) {
+          Object.defineProperty(obj, key, {
+            value,
+            enumerable: true,
+            configurable: true,
+            writable: true
+          });
+        } else {
+          obj[key] = value;
+        }
+        return obj;
       }
-      const data = await response.json();
-      return data.data || [];
-    } catch (error) {
-      console.error("搜索用户失败:", error);
-      return [];
-    }
-  };
-  const lookupUsers = async (params) => {
-    const { apiBaseUrl, tenantId, exactSearchKey = "bk_username", usersList = [], enableMultiTenantMode = true } = params;
-    const users = usersList.filter((user) => user).map((user) => user.trim());
-    if (!enableMultiTenantMode) {
-      const userList = await getUserList(apiBaseUrl, {
-        userIds: users
-      }).catch(() => {
-        return [];
-      });
-      return users.map((user) => userList.find((u) => u.username === user)).filter(Boolean);
-    }
-    if (users.length === 0 || !apiBaseUrl || !tenantId) {
-      console.warn("批量查找用户需要提供有效的apiBaseUrl、租户ID和至少一个用户名");
-      return [];
-    }
-    try {
-      const url = `${apiBaseUrl}/api/v3/open-web/tenant/users/-/lookup/?lookups=${users.join(",")}&lookup_fields=${exactSearchKey}`;
-      const response = await fetch(url, {
-        method: "GET",
-        headers: {
-          "x-bk-tenant-id": tenantId
-        },
-        credentials: "include"
-      });
-      if (!response.ok) {
-        throw new Error(`批量查找用户失败: ${response.status} ${response.statusText}`);
+      function _extends() {
+        _extends = Object.assign || 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);
       }
-      const data = await response.json();
-      return data.data || [];
-    } catch (error) {
-      console.error("批量查找用户失败:", error);
-      return [];
-    }
-  };
-  const formatUsers = (users, enableMultiTenantMode = true) => {
-    if (!users || !Array.isArray(users)) return [];
-    if (!enableMultiTenantMode) {
-      return users.map((user) => ({
-        ...user,
-        id: user.username,
-        name: `${user.display_name}(${user.username})`,
-        tenantId: user.owner_tenant_id
-      }));
-    }
-    return users.map((user) => ({
-      id: user.bk_username,
-      name: user.display_name,
-      tenantId: user.owner_tenant_id,
-      ...user
-    }));
-  };
-  const getUserList = async (url, params) => {
-    const { userIds, keyword, pageSize = 20, page, appCode } = params;
-    const data = await jsonpRequest(url, {
-      params: {
-        exact_lookups: (userIds == null ? void 0 : userIds.join(",")) || void 0,
-        fuzzy_lookups: keyword || void 0,
-        page_size: Math.max((userIds == null ? void 0 : userIds.length) || 0, 20, Number(pageSize)).toString(),
-        page: (page == null ? void 0 : page.toString()) || "1",
-        app_code: appCode || "bk-magicbox"
+      function _objectWithoutPropertiesLoose(source, excluded) {
+        if (source == null) return {};
+        var target = {};
+        var sourceKeys = Object.keys(source);
+        var key, i;
+        for (i = 0; i < sourceKeys.length; i++) {
+          key = sourceKeys[i];
+          if (excluded.indexOf(key) >= 0) continue;
+          target[key] = source[key];
+        }
+        return target;
       }
-    });
-    return (data == null ? void 0 : data.results) || [];
-  };
-  /*! js-cookie v3.0.5 | MIT */
-  function assign(target) {
-    for (var i = 1; i < arguments.length; i++) {
-      var source = arguments[i];
-      for (var key in source) {
-        target[key] = source[key];
+      function _objectWithoutProperties(source, excluded) {
+        if (source == null) return {};
+        var target = _objectWithoutPropertiesLoose(source, excluded);
+        var key, i;
+        if (Object.getOwnPropertySymbols) {
+          var sourceSymbolKeys = Object.getOwnPropertySymbols(source);
+          for (i = 0; i < sourceSymbolKeys.length; i++) {
+            key = sourceSymbolKeys[i];
+            if (excluded.indexOf(key) >= 0) continue;
+            if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue;
+            target[key] = source[key];
+          }
+        }
+        return target;
       }
-    }
-    return target;
-  }
-  var defaultConverter = {
-    read: function(value) {
-      if (value[0] === '"') {
-        value = value.slice(1, -1);
+      function _toConsumableArray(arr) {
+        return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread();
       }
-      return value.replace(/(%[\dA-F]{2})+/gi, decodeURIComponent);
-    },
-    write: function(value) {
-      return encodeURIComponent(value).replace(
-        /%(2[346BF]|3[AC-F]|40|5[BDE]|60|7[BCD])/g,
-        decodeURIComponent
-      );
-    }
-  };
-  function init(converter, defaultAttributes) {
-    function set(name, value, attributes) {
-      if (typeof document === "undefined") {
-        return;
-      }
-      attributes = assign({}, defaultAttributes, attributes);
-      if (typeof attributes.expires === "number") {
-        attributes.expires = new Date(Date.now() + attributes.expires * 864e5);
+      function _arrayWithoutHoles(arr) {
+        if (Array.isArray(arr)) return _arrayLikeToArray(arr);
       }
-      if (attributes.expires) {
-        attributes.expires = attributes.expires.toUTCString();
+      function _iterableToArray(iter) {
+        if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter);
       }
-      name = encodeURIComponent(name).replace(/%(2[346B]|5E|60|7C)/g, decodeURIComponent).replace(/[()]/g, escape);
-      var stringifiedAttributes = "";
-      for (var attributeName in attributes) {
-        if (!attributes[attributeName]) {
-          continue;
-        }
-        stringifiedAttributes += "; " + attributeName;
-        if (attributes[attributeName] === true) {
-          continue;
-        }
-        stringifiedAttributes += "=" + attributes[attributeName].split(";")[0];
+      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);
       }
-      return document.cookie = name + "=" + converter.write(value, name) + stringifiedAttributes;
-    }
-    function get(name) {
-      if (typeof document === "undefined" || arguments.length && !name) {
-        return;
+      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;
       }
-      var cookies = document.cookie ? document.cookie.split("; ") : [];
-      var jar = {};
-      for (var i = 0; i < cookies.length; i++) {
-        var parts = cookies[i].split("=");
-        var value = parts.slice(1).join("=");
-        try {
-          var found = decodeURIComponent(parts[0]);
-          jar[found] = converter.read(value, found);
-          if (name === found) {
-            break;
-          }
-        } catch (e) {
-        }
+      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.");
       }
-      return name ? jar[name] : jar;
-    }
-    return Object.create(
-      {
-        set,
-        get,
-        remove: function(name, attributes) {
-          set(
-            name,
-            "",
-            assign({}, attributes, {
-              expires: -1
-            })
-          );
-        },
-        withAttributes: function(attributes) {
-          return init(this.converter, assign({}, this.attributes, attributes));
-        },
-        withConverter: function(converter2) {
-          return init(assign({}, this.converter, converter2), this.attributes);
+      var version = "1.15.6";
+      function userAgent(pattern) {
+        if (typeof window !== "undefined" && window.navigator) {
+          return !!/* @__PURE__ */ navigator.userAgent.match(pattern);
         }
-      },
-      {
-        attributes: { value: Object.freeze(defaultAttributes) },
-        converter: { value: Object.freeze(converter) }
       }
-    );
-  }
-  var api = init(defaultConverter, { path: "/" });
-  const enUS = {
-    我: "Me",
-    请输入人员名称搜索: "Please enter the name of the user to search",
-    用户群组: "User Group",
-    无匹配人员: "No matching users",
-    虚拟账号: "Virtual Account",
-    用户: "User"
-  };
-  const zhCN = {
-    我: "我",
-    请输入人员名称搜索: "请输入人员名称搜索",
-    用户群组: "用户群组",
-    无匹配人员: "无匹配人员",
-    虚拟账号: "虚拟账号",
-    用户: "用户"
-  };
-  const BLUEKINNG_LANGUAGE = "blueking_language";
-  const languageMap = {
-    "en-US": enUS,
-    "zh-CN": zhCN
-  };
-  const getPath = (obj, path, variables) => {
-    const pathStack = /^\w/.test(path) ? path.split(".") : [path];
-    const { length } = pathStack;
-    let target = obj;
-    let i = 0;
-    while (i <= length && target) {
-      if (typeof target === "string") {
-        return target;
+      var IE11OrLess = userAgent(/(?:Trident.*rv[ :]?11\.|msie|iemobile|Windows Phone)/i);
+      var Edge = userAgent(/Edge/i);
+      var FireFox = userAgent(/firefox/i);
+      var Safari = userAgent(/safari/i) && !userAgent(/chrome/i) && !userAgent(/android/i);
+      var IOS = userAgent(/iP(ad|od|hone)/i);
+      var ChromeForAndroid = userAgent(/chrome/i) && userAgent(/android/i);
+      var captureMode = {
+        capture: false,
+        passive: false
+      };
+      function on(el, event, fn) {
+        el.addEventListener(event, fn, !IE11OrLess && captureMode);
       }
-      if (variables) {
-        target = target[pathStack[i]];
-        Object.keys(variables).forEach((key) => {
-          target = target.replace(`{${key}}`, variables[key]);
-        });
-      } else {
-        target = target[pathStack[i]];
+      function off(el, event, fn) {
+        el.removeEventListener(event, fn, !IE11OrLess && captureMode);
       }
-      i = i + 1;
-      if (!target) {
-        return target;
+      function matches(el, selector) {
+        if (!selector) return;
+        selector[0] === ">" && (selector = selector.substring(1));
+        if (el) {
+          try {
+            if (el.matches) {
+              return el.matches(selector);
+            } else if (el.msMatchesSelector) {
+              return el.msMatchesSelector(selector);
+            } else if (el.webkitMatchesSelector) {
+              return el.webkitMatchesSelector(selector);
+            }
+          } catch (_) {
+            return false;
+          }
+        }
+        return false;
       }
-    }
-    return target;
-  };
-  const useI18n = () => {
-    let localeLanguage = "zh-CN";
-    const bluekingLanguage = api.get(BLUEKINNG_LANGUAGE);
-    if (bluekingLanguage && bluekingLanguage.toLowerCase() === "en") {
-      localeLanguage = "en-US";
-    }
-    const languagePackage = languageMap[localeLanguage];
-    const t = (path, variable) => {
-      const value = getPath(languagePackage, path, variable);
-      if (value === void 0) {
-        console.warn(`缺少索引 * ${path} *`);
+      function getParentOrHost(el) {
+        return el.host && el !== document && el.host.nodeType ? el.host : el.parentNode;
       }
-      return value;
-    };
-    return {
-      local: localeLanguage,
-      t
-    };
-  };
-  const useTenantData = (apiBaseUrl, tenantId, enableMultiTenantMode = true) => {
-    const tenants = vue.ref({});
-    const loading = vue.ref(false);
-    const fetchTenants = async () => {
-      if (!apiBaseUrl || !tenantId) {
-        console.warn("获取租户需要提供有效的API基础URL和租户ID");
-        return;
+      function closest(el, selector, ctx, includeCTX) {
+        if (el) {
+          ctx = ctx || document;
+          do {
+            if (selector != null && (selector[0] === ">" ? el.parentNode === ctx && matches(el, selector) : matches(el, selector)) || includeCTX && el === ctx) {
+              return el;
+            }
+            if (el === ctx) break;
+          } while (el = getParentOrHost(el));
+        }
+        return null;
       }
-      loading.value = true;
-      try {
-        const result = await getTenants(apiBaseUrl, tenantId);
-        const tenantMap = {};
-        result.forEach((item) => {
-          if (item.id && item.name) {
-            tenantMap[item.id] = item.name;
+      var R_SPACE = /\s+/g;
+      function toggleClass(el, name, state) {
+        if (el && name) {
+          if (el.classList) {
+            el.classList[state ? "add" : "remove"](name);
+          } else {
+            var className = (" " + el.className + " ").replace(R_SPACE, " ").replace(" " + name + " ", " ");
+            el.className = (className + (state ? " " + name : "")).replace(R_SPACE, " ");
           }
-        });
-        tenants.value = tenantMap;
-      } catch (error) {
-        console.error("获取租户数据失败:", error);
-      } finally {
-        loading.value = false;
+        }
       }
-    };
-    vue.onBeforeMount(() => {
-      if (enableMultiTenantMode) {
-        fetchTenants();
-      }
-    });
-    return {
-      tenants,
-      loading,
-      fetchTenants
-    };
-  };
-  var commonjsGlobal = typeof globalThis !== "undefined" ? globalThis : typeof window !== "undefined" ? window : typeof global !== "undefined" ? global : typeof self !== "undefined" ? self : {};
-  function getDefaultExportFromCjs(x) {
-    return x && x.__esModule && Object.prototype.hasOwnProperty.call(x, "default") ? x["default"] : x;
-  }
-  var Sortable$1 = { exports: {} };
-  /**!
-   * Sortable 1.15.6
-   * @author	RubaXa   <trash@rubaxa.org>
-   * @author	owenm    <owen23355@gmail.com>
-   * @license MIT
-   */
-  (function(module2, exports3) {
-    (function(global2, factory) {
-      module2.exports = factory();
-    })(commonjsGlobal, function() {
-      function ownKeys(object, enumerableOnly) {
-        var keys = Object.keys(object);
-        if (Object.getOwnPropertySymbols) {
-          var symbols = Object.getOwnPropertySymbols(object);
-          if (enumerableOnly) {
-            symbols = symbols.filter(function(sym) {
-              return Object.getOwnPropertyDescriptor(object, sym).enumerable;
-            });
-          }
-          keys.push.apply(keys, symbols);
-        }
-        return keys;
-      }
-      function _objectSpread2(target) {
-        for (var i = 1; i < arguments.length; i++) {
-          var source = arguments[i] != null ? arguments[i] : {};
-          if (i % 2) {
-            ownKeys(Object(source), true).forEach(function(key) {
-              _defineProperty(target, key, source[key]);
-            });
-          } else if (Object.getOwnPropertyDescriptors) {
-            Object.defineProperties(target, Object.getOwnPropertyDescriptors(source));
-          } else {
-            ownKeys(Object(source)).forEach(function(key) {
-              Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
-            });
-          }
-        }
-        return target;
-      }
-      function _typeof(obj) {
-        "@babel/helpers - typeof";
-        if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") {
-          _typeof = function(obj2) {
-            return typeof obj2;
-          };
-        } else {
-          _typeof = function(obj2) {
-            return obj2 && typeof Symbol === "function" && obj2.constructor === Symbol && obj2 !== Symbol.prototype ? "symbol" : typeof obj2;
-          };
-        }
-        return _typeof(obj);
-      }
-      function _defineProperty(obj, key, value) {
-        if (key in obj) {
-          Object.defineProperty(obj, key, {
-            value,
-            enumerable: true,
-            configurable: true,
-            writable: true
-          });
-        } else {
-          obj[key] = value;
-        }
-        return obj;
-      }
-      function _extends() {
-        _extends = Object.assign || 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 _objectWithoutPropertiesLoose(source, excluded) {
-        if (source == null) return {};
-        var target = {};
-        var sourceKeys = Object.keys(source);
-        var key, i;
-        for (i = 0; i < sourceKeys.length; i++) {
-          key = sourceKeys[i];
-          if (excluded.indexOf(key) >= 0) continue;
-          target[key] = source[key];
-        }
-        return target;
-      }
-      function _objectWithoutProperties(source, excluded) {
-        if (source == null) return {};
-        var target = _objectWithoutPropertiesLoose(source, excluded);
-        var key, i;
-        if (Object.getOwnPropertySymbols) {
-          var sourceSymbolKeys = Object.getOwnPropertySymbols(source);
-          for (i = 0; i < sourceSymbolKeys.length; i++) {
-            key = sourceSymbolKeys[i];
-            if (excluded.indexOf(key) >= 0) continue;
-            if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue;
-            target[key] = source[key];
-          }
-        }
-        return target;
-      }
-      function _toConsumableArray(arr) {
-        return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread();
-      }
-      function _arrayWithoutHoles(arr) {
-        if (Array.isArray(arr)) return _arrayLikeToArray(arr);
-      }
-      function _iterableToArray(iter) {
-        if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter);
-      }
-      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 _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 _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.");
-      }
-      var version = "1.15.6";
-      function userAgent(pattern) {
-        if (typeof window !== "undefined" && window.navigator) {
-          return !!/* @__PURE__ */ navigator.userAgent.match(pattern);
-        }
-      }
-      var IE11OrLess = userAgent(/(?:Trident.*rv[ :]?11\.|msie|iemobile|Windows Phone)/i);
-      var Edge = userAgent(/Edge/i);
-      var FireFox = userAgent(/firefox/i);
-      var Safari = userAgent(/safari/i) && !userAgent(/chrome/i) && !userAgent(/android/i);
-      var IOS = userAgent(/iP(ad|od|hone)/i);
-      var ChromeForAndroid = userAgent(/chrome/i) && userAgent(/android/i);
-      var captureMode = {
-        capture: false,
-        passive: false
-      };
-      function on(el, event, fn) {
-        el.addEventListener(event, fn, !IE11OrLess && captureMode);
-      }
-      function off(el, event, fn) {
-        el.removeEventListener(event, fn, !IE11OrLess && captureMode);
-      }
-      function matches(el, selector) {
-        if (!selector) return;
-        selector[0] === ">" && (selector = selector.substring(1));
-        if (el) {
-          try {
-            if (el.matches) {
-              return el.matches(selector);
-            } else if (el.msMatchesSelector) {
-              return el.msMatchesSelector(selector);
-            } else if (el.webkitMatchesSelector) {
-              return el.webkitMatchesSelector(selector);
-            }
-          } catch (_) {
-            return false;
-          }
-        }
-        return false;
-      }
-      function getParentOrHost(el) {
-        return el.host && el !== document && el.host.nodeType ? el.host : el.parentNode;
-      }
-      function closest(el, selector, ctx, includeCTX) {
-        if (el) {
-          ctx = ctx || document;
-          do {
-            if (selector != null && (selector[0] === ">" ? el.parentNode === ctx && matches(el, selector) : matches(el, selector)) || includeCTX && el === ctx) {
-              return el;
-            }
-            if (el === ctx) break;
-          } while (el = getParentOrHost(el));
-        }
-        return null;
-      }
-      var R_SPACE = /\s+/g;
-      function toggleClass(el, name, state) {
-        if (el && name) {
-          if (el.classList) {
-            el.classList[state ? "add" : "remove"](name);
-          } else {
-            var className = (" " + el.className + " ").replace(R_SPACE, " ").replace(" " + name + " ", " ");
-            el.className = (className + (state ? " " + name : "")).replace(R_SPACE, " ");
-          }
-        }
-      }
-      function css(el, prop, val) {
-        var style = el && el.style;
-        if (style) {
-          if (val === void 0) {
-            if (document.defaultView && document.defaultView.getComputedStyle) {
-              val = document.defaultView.getComputedStyle(el, "");
-            } else if (el.currentStyle) {
-              val = el.currentStyle;
-            }
-            return prop === void 0 ? val : val[prop];
-          } else {
-            if (!(prop in style) && prop.indexOf("webkit") === -1) {
-              prop = "-webkit-" + prop;
-            }
-            style[prop] = val + (typeof val === "string" ? "" : "px");
-          }
-        }
+      function css(el, prop, val) {
+        var style = el && el.style;
+        if (style) {
+          if (val === void 0) {
+            if (document.defaultView && document.defaultView.getComputedStyle) {
+              val = document.defaultView.getComputedStyle(el, "");
+            } else if (el.currentStyle) {
+              val = el.currentStyle;
+            }
+            return prop === void 0 ? val : val[prop];
+          } else {
+            if (!(prop in style) && prop.indexOf("webkit") === -1) {
+              prop = "-webkit-" + prop;
+            }
+            style[prop] = val + (typeof val === "string" ? "" : "px");
+          }
+        }
       }
       function matrix(el, selfOnly) {
         var appliedTransforms = "";
@@ -3124,15 +2763,583 @@
           multiDragElement.parentNode && multiDragElement.parentNode.removeChild(multiDragElement);
         });
       }
-      Sortable2.mount(new AutoScrollPlugin());
-      Sortable2.mount(Remove, Revert);
-      Sortable2.mount(new SwapPlugin());
-      Sortable2.mount(new MultiDragPlugin());
-      return Sortable2;
+      Sortable2.mount(new AutoScrollPlugin());
+      Sortable2.mount(Remove, Revert);
+      Sortable2.mount(new SwapPlugin());
+      Sortable2.mount(new MultiDragPlugin());
+      return Sortable2;
+    });
+  })(Sortable$1);
+  var SortableExports = Sortable$1.exports;
+  const Sortable = /* @__PURE__ */ getDefaultExportFromCjs(SortableExports);
+  const RESERVED_SPACE_FOR_INPUT = 100;
+  const SEARCH_DEBOUNCE_DELAY = 300;
+  const DEFAULT_EXACT_SEARCH_KEY = "bk_username";
+  const USER_TYPE = {
+    /** 普通用户 */
+    USER: "user",
+    /** 虚拟账号 */
+    VIRTUAL: "virtual",
+    /** 自定义用户 */
+    CUSTOM: "custom",
+    /** 用户群组 */
+    USER_GROUP: "userGroup"
+  };
+  const DEFAULT_PAGE_SIZE = 100;
+  const generateCallbackName = () => {
+    const timestamp = Date.now();
+    const random = Math.random().toString(36).slice(2, 9);
+    return `__jsonp_callback_${timestamp}_${random}`;
+  };
+  const jsonpRequest = (requestUrl, options = {}) => {
+    return new Promise((resolve, reject) => {
+      const url = vue.unref(requestUrl);
+      const { timeout = 1e3 * 60 * 2, params } = options;
+      const callbackName = generateCallbackName();
+      const script = document.createElement("script");
+      let timeoutId = null;
+      script.setAttribute("type", "text/javascript");
+      const cleanup = () => {
+        if (timeoutId) {
+          clearTimeout(timeoutId);
+        }
+        if (script.parentNode) {
+          script.parentNode.removeChild(script);
+        }
+        if (window[callbackName]) {
+          delete window[callbackName];
+        }
+      };
+      window[callbackName] = (data) => {
+        cleanup();
+        resolve(data.data || data);
+      };
+      timeoutId = setTimeout(() => {
+        cleanup();
+        reject(new Error(`JSONP request timeout: ${url}`));
+      }, timeout);
+      script.onerror = () => {
+        cleanup();
+        reject(new Error(`JSONP request failed: ${url}`));
+      };
+      const separator = url.includes("?") ? "&" : "?";
+      const paramsStr = params ? `&${Object.entries(params).map(([key, value]) => value ? `${key}=${value}` : "").filter(Boolean).join("&")}` : "";
+      script.src = `${url}${separator}callback=${callbackName}${paramsStr}`;
+      document.head.appendChild(script);
+    });
+  };
+  const logger = {
+    /**
+     * 调试日志
+     */
+    debug: (message, ...args) => {
+    },
+    /**
+     * 信息日志
+     */
+    info: (message, ...args) => {
+    },
+    /**
+     * 警告日志
+     */
+    warn: (message, ...args) => {
+    },
+    /**
+     * 错误日志
+     */
+    error: (message, error) => {
+    }
+  };
+  const warnMissingParams = (operation, params) => {
+    logger.warn(`${operation}需要提供有效的参数: ${params.join(", ")}`);
+  };
+  const getTenants = async (apiBaseUrl, tenantId) => {
+    if (!apiBaseUrl || !tenantId) {
+      warnMissingParams("获取租户信息", ["apiBaseUrl", "tenantId"]);
+      return [];
+    }
+    try {
+      const url = `${apiBaseUrl}/api/v3/open-web/tenant/data-source-owner-tenants/`;
+      const response = await fetch(url, {
+        method: "GET",
+        headers: {
+          "x-bk-tenant-id": tenantId
+        },
+        credentials: "include"
+      });
+      if (!response.ok) {
+        throw new Error(`${response.status} ${response.statusText}`);
+      }
+      const data = await response.json();
+      return data.data || [];
+    } catch (error) {
+      return [];
+    }
+  };
+  const searchUsers = async (params) => {
+    const { apiBaseUrl, tenantId, keyword, enableMultiTenantMode = true } = params;
+    if (!enableMultiTenantMode) {
+      try {
+        return await getUserList(apiBaseUrl, {
+          keyword,
+          pageSize: DEFAULT_PAGE_SIZE,
+          page: 1
+        });
+      } catch {
+        return [];
+      }
+    }
+    if (!keyword || !apiBaseUrl || !tenantId) {
+      warnMissingParams("搜索用户", ["apiBaseUrl", "tenantId", "keyword"]);
+      return [];
+    }
+    try {
+      const url = `${apiBaseUrl}/api/v3/open-web/tenant/users/-/search/?keyword=${encodeURIComponent(keyword)}`;
+      const response = await fetch(url, {
+        method: "GET",
+        headers: {
+          "x-bk-tenant-id": tenantId
+        },
+        credentials: "include"
+      });
+      if (!response.ok) {
+        throw new Error(`${response.status} ${response.statusText}`);
+      }
+      const data = await response.json();
+      return data.data || [];
+    } catch (error) {
+      return [];
+    }
+  };
+  const lookupUsers = async (params) => {
+    const { apiBaseUrl, tenantId, exactSearchKey = "bk_username", usersList = [], enableMultiTenantMode = true } = params;
+    const users = usersList.filter(Boolean).map((user) => typeof user === "string" ? user.trim() : String(user).trim());
+    if (!enableMultiTenantMode) {
+      try {
+        const userList = await getUserList(apiBaseUrl, { userIds: users });
+        return users.map((user) => userList.find((u) => u.username === user)).filter(Boolean);
+      } catch {
+        return [];
+      }
+    }
+    if (users.length === 0 || !apiBaseUrl || !tenantId) {
+      warnMissingParams("批量查找用户", ["apiBaseUrl", "tenantId", "usersList"]);
+      return [];
+    }
+    try {
+      const url = `${apiBaseUrl}/api/v3/open-web/tenant/users/-/lookup/?lookups=${users.join(",")}&lookup_fields=${exactSearchKey}`;
+      const response = await fetch(url, {
+        method: "GET",
+        headers: {
+          "x-bk-tenant-id": tenantId
+        },
+        credentials: "include"
+      });
+      if (!response.ok) {
+        throw new Error(`${response.status} ${response.statusText}`);
+      }
+      const data = await response.json();
+      return data.data || [];
+    } catch (error) {
+      return [];
+    }
+  };
+  const formatUsers = (users, enableMultiTenantMode = true) => {
+    if (!users || !Array.isArray(users)) return [];
+    if (!enableMultiTenantMode) {
+      return users.map((user) => ({
+        ...user,
+        id: user.username,
+        name: `${user.display_name}(${user.username})`,
+        type: user.data_source_type,
+        tenantId: user.owner_tenant_id
+      }));
+    }
+    return users.map((user) => ({
+      id: user.bk_username,
+      name: user.display_name,
+      type: user.data_source_type,
+      tenantId: user.owner_tenant_id,
+      ...user
+    }));
+  };
+  const getUserList = async (url, params) => {
+    const { userIds, keyword, pageSize = 20, page = 1, appCode = "bk-magicbox" } = params;
+    const data = await jsonpRequest(url, {
+      params: {
+        exact_lookups: (userIds == null ? void 0 : userIds.join(",")) || void 0,
+        fuzzy_lookups: keyword || void 0,
+        page_size: Math.max((userIds == null ? void 0 : userIds.length) || 0, 20, Number(pageSize)).toString(),
+        page: page.toString(),
+        app_code: appCode
+      }
+    });
+    return (data == null ? void 0 : data.results) || [];
+  };
+  const useCurrentUser = (options) => {
+    const {
+      apiBaseUrl,
+      tenantId,
+      currentUserId,
+      exactSearchKey = DEFAULT_EXACT_SEARCH_KEY,
+      enableMultiTenantMode = true
+    } = options;
+    const loading = vue.ref(false);
+    const fetchCurrentUser = async () => {
+      if (!currentUserId) {
+        return null;
+      }
+      loading.value = true;
+      try {
+        const result = await lookupUsers({
+          apiBaseUrl,
+          tenantId,
+          exactSearchKey,
+          usersList: [currentUserId],
+          enableMultiTenantMode
+        });
+        const formattedUsers = formatUsers(result, enableMultiTenantMode);
+        return formattedUsers.length > 0 ? formattedUsers[0] : null;
+      } catch (error) {
+        console.error("获取当前用户信息失败:", error);
+        return null;
+      } finally {
+        loading.value = false;
+      }
+    };
+    return {
+      loading,
+      fetchCurrentUser
+    };
+  };
+  /*! js-cookie v3.0.5 | MIT */
+  function assign(target) {
+    for (var i = 1; i < arguments.length; i++) {
+      var source = arguments[i];
+      for (var key in source) {
+        target[key] = source[key];
+      }
+    }
+    return target;
+  }
+  var defaultConverter = {
+    read: function(value) {
+      if (value[0] === '"') {
+        value = value.slice(1, -1);
+      }
+      return value.replace(/(%[\dA-F]{2})+/gi, decodeURIComponent);
+    },
+    write: function(value) {
+      return encodeURIComponent(value).replace(
+        /%(2[346BF]|3[AC-F]|40|5[BDE]|60|7[BCD])/g,
+        decodeURIComponent
+      );
+    }
+  };
+  function init(converter, defaultAttributes) {
+    function set(name, value, attributes) {
+      if (typeof document === "undefined") {
+        return;
+      }
+      attributes = assign({}, defaultAttributes, attributes);
+      if (typeof attributes.expires === "number") {
+        attributes.expires = new Date(Date.now() + attributes.expires * 864e5);
+      }
+      if (attributes.expires) {
+        attributes.expires = attributes.expires.toUTCString();
+      }
+      name = encodeURIComponent(name).replace(/%(2[346B]|5E|60|7C)/g, decodeURIComponent).replace(/[()]/g, escape);
+      var stringifiedAttributes = "";
+      for (var attributeName in attributes) {
+        if (!attributes[attributeName]) {
+          continue;
+        }
+        stringifiedAttributes += "; " + attributeName;
+        if (attributes[attributeName] === true) {
+          continue;
+        }
+        stringifiedAttributes += "=" + attributes[attributeName].split(";")[0];
+      }
+      return document.cookie = name + "=" + converter.write(value, name) + stringifiedAttributes;
+    }
+    function get(name) {
+      if (typeof document === "undefined" || arguments.length && !name) {
+        return;
+      }
+      var cookies = document.cookie ? document.cookie.split("; ") : [];
+      var jar = {};
+      for (var i = 0; i < cookies.length; i++) {
+        var parts = cookies[i].split("=");
+        var value = parts.slice(1).join("=");
+        try {
+          var found = decodeURIComponent(parts[0]);
+          jar[found] = converter.read(value, found);
+          if (name === found) {
+            break;
+          }
+        } catch (e) {
+        }
+      }
+      return name ? jar[name] : jar;
+    }
+    return Object.create(
+      {
+        set,
+        get,
+        remove: function(name, attributes) {
+          set(
+            name,
+            "",
+            assign({}, attributes, {
+              expires: -1
+            })
+          );
+        },
+        withAttributes: function(attributes) {
+          return init(this.converter, assign({}, this.attributes, attributes));
+        },
+        withConverter: function(converter2) {
+          return init(assign({}, this.converter, converter2), this.attributes);
+        }
+      },
+      {
+        attributes: { value: Object.freeze(defaultAttributes) },
+        converter: { value: Object.freeze(converter) }
+      }
+    );
+  }
+  var api = init(defaultConverter, { path: "/" });
+  const enUS = {
+    我: "Me",
+    请输入人员名称搜索: "Please enter the name of the user to search",
+    用户群组: "User Group",
+    无匹配人员: "No matching users",
+    虚拟账号: "Virtual Account",
+    用户: "User"
+  };
+  const zhCN = {
+    我: "我",
+    请输入人员名称搜索: "请输入人员名称搜索",
+    用户群组: "用户群组",
+    无匹配人员: "无匹配人员",
+    虚拟账号: "虚拟账号",
+    用户: "用户"
+  };
+  const BLUEKINNG_LANGUAGE = "blueking_language";
+  const languageMap = {
+    "en-US": enUS,
+    "zh-CN": zhCN
+  };
+  const getPath = (obj, path, variables) => {
+    const safePath = typeof path === "string" ? path : String(path ?? "");
+    const pathStack = /^\w/.test(safePath) ? safePath.split(".") : [safePath];
+    const { length } = pathStack;
+    let target = obj;
+    let i = 0;
+    while (i <= length && target) {
+      if (typeof target === "string") {
+        return target;
+      }
+      if (variables) {
+        target = target[pathStack[i]];
+        if (typeof target === "string") {
+          Object.keys(variables).forEach((key) => {
+            target = target.replace(`{${key}}`, variables[key]);
+          });
+        }
+      } else {
+        target = target[pathStack[i]];
+      }
+      i = i + 1;
+      if (!target) {
+        return target;
+      }
+    }
+    return target;
+  };
+  const useI18n = () => {
+    let localeLanguage = "zh-CN";
+    const bluekingLanguage = api.get(BLUEKINNG_LANGUAGE);
+    if (bluekingLanguage && bluekingLanguage.toLowerCase() === "en") {
+      localeLanguage = "en-US";
+    }
+    const languagePackage = languageMap[localeLanguage];
+    const t = (path, variable) => {
+      const value = getPath(languagePackage, path, variable);
+      if (value === void 0) {
+        console.warn(`缺少索引 * ${path} *`);
+      }
+      return value;
+    };
+    return {
+      local: localeLanguage,
+      t
+    };
+  };
+  const useInputHandler = (options) => {
+    const {
+      apiBaseUrl,
+      tenantId,
+      searchQuery,
+      selectedUsers,
+      allowCreate = false,
+      freePaste = false,
+      enableMultiTenantMode = true,
+      maxCount = 0,
+      onAddUser,
+      onBatchAddUsers
+    } = options;
+    const isPasting = vue.ref(false);
+    const createCustomUser = (loginName) => ({
+      id: loginName,
+      name: loginName,
+      type: USER_TYPE.CUSTOM,
+      tenantId: "",
+      login_name: loginName
+    });
+    const parsePastedText = (text) => {
+      const usersList = text.split(/[,，;\n\s]+/).filter(Boolean);
+      return usersList.map((user) => user.trim().replace(/\s*\(.*?\)\s*/, "")).filter(Boolean);
+    };
+    const mergeUsers = (existingUsers, newUsers) => {
+      const userMap = /* @__PURE__ */ new Map();
+      for (const user of [...existingUsers, ...newUsers]) {
+        if (!userMap.has(user.id)) {
+          userMap.set(user.id, user);
+        }
+      }
+      return Array.from(userMap.values());
+    };
+    const handleEnterCreate = (event) => {
+      if (event.key !== "Enter" || !allowCreate || !searchQuery.value.trim()) {
+        return;
+      }
+      const customUser = createCustomUser(searchQuery.value.trim());
+      const isDuplicate = selectedUsers.value.some((user) => user.id === customUser.id);
+      if (!isDuplicate) {
+        onAddUser(customUser);
+      }
+    };
+    const handlePaste = async (event) => {
+      var _a, _b;
+      event.preventDefault();
+      const pastedText = (_b = (_a = event.clipboardData) == null ? void 0 : _a.getData("text")) == null ? void 0 : _b.trim();
+      if (!pastedText) return;
+      isPasting.value = true;
+      try {
+        const usersList = parsePastedText(pastedText);
+        if (usersList.length === 0) return;
+        const result = await lookupUsers({
+          apiBaseUrl,
+          tenantId,
+          exactSearchKey: "login_name",
+          usersList,
+          enableMultiTenantMode
+        });
+        const formattedUsers = formatUsers(result, enableMultiTenantMode);
+        if (onBatchAddUsers) {
+          let mergedUsers = mergeUsers(selectedUsers.value, formattedUsers);
+          if (freePaste) {
+            for (const loginName of usersList) {
+              const isDuplicate = mergedUsers.some((item) => item.login_name === loginName || item.id === loginName);
+              if (!isDuplicate) {
+                mergedUsers.push(createCustomUser(loginName));
+              }
+            }
+          }
+          if (maxCount > 0 && mergedUsers.length > maxCount) {
+            mergedUsers = mergedUsers.slice(0, maxCount);
+          }
+          onBatchAddUsers(mergedUsers);
+        } else {
+          if (formattedUsers.length > 0) {
+            onAddUser(formattedUsers[0]);
+          } else if (freePaste && usersList.length > 0) {
+            onAddUser(createCustomUser(usersList[0]));
+          }
+        }
+      } catch (error) {
+        console.error("精准查找用户失败:", error);
+      } finally {
+        isPasting.value = false;
+      }
+    };
+    return {
+      isPasting,
+      parsePastedText,
+      handleEnterCreate,
+      handlePaste
+    };
+  };
+  const useResizeObserver = (target, callback, options = {}) => {
+    const { immediate = true } = options;
+    let observer = null;
+    const cleanup = () => {
+      if (observer) {
+        observer.disconnect();
+        observer = null;
+      }
+    };
+    const observe = () => {
+      cleanup();
+      if (!target.value) return;
+      observer = new ResizeObserver((entries) => {
+        for (const entry of entries) {
+          callback(entry);
+        }
+      });
+      observer.observe(target.value);
+      if (immediate && target.value) {
+        const rect = target.value.getBoundingClientRect();
+        const entry = {
+          target: target.value,
+          contentRect: rect,
+          borderBoxSize: [{ blockSize: rect.height, inlineSize: rect.width }],
+          contentBoxSize: [{ blockSize: rect.height, inlineSize: rect.width }],
+          devicePixelContentBoxSize: [{ blockSize: rect.height, inlineSize: rect.width }]
+        };
+        callback(entry);
+      }
+    };
+    vue.watch(target, observe, { immediate: true });
+    vue.onUnmounted(cleanup);
+    return cleanup;
+  };
+  const useTenantData = (apiBaseUrl, tenantId, enableMultiTenantMode = true) => {
+    const tenants = vue.ref({});
+    const loading = vue.ref(false);
+    const fetchTenants = async () => {
+      if (!apiBaseUrl || !tenantId) {
+        console.warn("获取租户需要提供有效的API基础URL和租户ID");
+        return;
+      }
+      loading.value = true;
+      try {
+        const result = await getTenants(apiBaseUrl, tenantId);
+        const tenantMap = {};
+        result.forEach((item) => {
+          if (item.id && item.name) {
+            tenantMap[item.id] = item.name;
+          }
+        });
+        tenants.value = tenantMap;
+      } catch (error) {
+        console.error("获取租户数据失败:", error);
+      } finally {
+        loading.value = false;
+      }
+    };
+    vue.onBeforeMount(() => {
+      if (enableMultiTenantMode) {
+        fetchTenants();
+      }
     });
-  })(Sortable$1);
-  var SortableExports = Sortable$1.exports;
-  const Sortable = /* @__PURE__ */ getDefaultExportFromCjs(SortableExports);
+    return {
+      tenants,
+      loading,
+      fetchTenants
+    };
+  };
   const debounce = (fn, delay) => {
     let timer = null;
     return function(...args) {
@@ -3171,10 +3378,12 @@
     const performSearch = async (keyword) => {
       if (!(keyword == null ? void 0 : keyword.length)) {
         searchResults.value = [];
+        loading.value = false;
         return;
       }
       if (enableMultiTenantMode && (!apiBaseUrl || !tenantId)) {
         console.warn("执行用户搜索需要提供有效的API基础URL和租户ID");
+        loading.value = false;
         return;
       }
       loading.value = true;
@@ -3193,14 +3402,16 @@
         loading.value = false;
       }
     };
-    const debouncedSearch = debounce(performSearch, 300);
+    const debouncedSearch = debounce(performSearch, SEARCH_DEBOUNCE_DELAY);
     const handleSearchInput = (value) => {
-      searchQuery.value = value;
-      debouncedSearch(value);
+      loading.value = true;
+      searchQuery.value = typeof value === "string" ? value.trim() : String(value ?? "").trim();
+      debouncedSearch(searchQuery.value);
     };
     const clearSearch = () => {
       searchQuery.value = "";
       searchResults.value = [];
+      loading.value = false;
     };
     return {
       searchResults,
@@ -3211,26 +3422,57 @@
       clearSearch
     };
   };
-  const _sfc_main$5 = /* @__PURE__ */ vue.defineComponent({
+  const useUserSelection = (options) => {
+    const { selectedUserIds, excludeUserIds, userGroup, searchQuery } = options;
+    const createCustomUser = (loginName) => ({
+      id: loginName,
+      name: loginName,
+      type: USER_TYPE.CUSTOM,
+      tenantId: "",
+      login_name: loginName
+    });
+    const isUserSelected = (userId) => {
+      return selectedUserIds.value.includes(userId);
+    };
+    const filterOptions = (options2) => {
+      return options2.filter((user) => !isUserSelected(user.id)).filter((user) => {
+        var _a;
+        return !((_a = excludeUserIds == null ? void 0 : excludeUserIds.value) == null ? void 0 : _a.includes(user.id));
+      });
+    };
+    const filteredUserGroup = vue.computed(() => {
+      var _a;
+      if (!((_a = userGroup == null ? void 0 : userGroup.value) == null ? void 0 : _a.length)) {
+        return [];
+      }
+      return userGroup.value.filter((group) => {
+        var _a2, _b;
+        const isNotSelectedAndVisible = !isUserSelected(group.id) && !group.hidden;
+        if (!isNotSelectedAndVisible) {
+          return false;
+        }
+        const query = searchQuery.value.trim();
+        if (!query) {
+          return true;
+        }
+        return ((_a2 = group.id) == null ? void 0 : _a2.includes(query)) || ((_b = group.name) == null ? void 0 : _b.includes(query));
+      });
+    });
+    return {
+      createCustomUser,
+      isUserSelected,
+      filterOptions,
+      filteredUserGroup
+    };
+  };
+  const _sfc_main$3 = /* @__PURE__ */ vue.defineComponent({
     ...{
       name: "MeTag"
     },
     __name: "me-tag",
     props: {
-      /**
-       * 当前用户ID
-       */
-      currentUserId: {
-        type: String,
-        default: ""
-      },
-      /**
-       * 是否禁用
-       */
-      isDisabled: {
-        type: Boolean,
-        default: false
-      }
+      currentUserId: { default: "" },
+      isDisabled: { type: Boolean, default: false }
     },
     emits: ["click"],
     setup(__props, { emit: __emit }) {
@@ -3242,11 +3484,11 @@
         emit("click");
       };
       return (_ctx, _cache) => {
-        return __props.currentUserId ? (vue.openBlock(), vue.createElementBlock(
+        return _ctx.currentUserId ? (vue.openBlock(), vue.createElementBlock(
           "div",
           {
             key: 0,
-            class: vue.normalizeClass(["me-tag", { disabled: __props.isDisabled }]),
+            class: vue.normalizeClass(["me-tag", { disabled: _ctx.isDisabled }]),
             onClick: vue.withModifiers(handleClick, ["stop"])
           },
           vue.toDisplayString(vue.unref(t)("我")),
@@ -3263,7 +3505,10 @@
     }
     return target;
   };
-  const MeTag = /* @__PURE__ */ _export_sfc(_sfc_main$5, [["__scopeId", "data-v-ef4a05c4"]]);
+  const MeTag = /* @__PURE__ */ _export_sfc(_sfc_main$3, [["__scopeId", "data-v-4f251ce1"]]);
+  const UserGroupAvatar = "data:image/svg+xml,%3csvg%20viewBox='0%200%201024%201024'%20version='1.1'%20xmlns='http://www.w3.org/2000/svg'%20style='fill:%20%23A3C5FD;'%3e%3cpath%20fill-rule='evenodd'%20d='M405.7858816%20162.66256256C416.4461344%20160.6535248%20439.8986944%20159.44810208%20457.3815104%20160.25171712%20484.2453504%20161.05533248%20494.052784%20163.4661776%20516.226112%20174.7167888%20567.8217376%20200.43247136%20597.670448%20242.22045568%20606.6250624%20301.28616416%20617.711728%20374.415136%20593.4063488%20443.5260352%20535.8409792%20500.180896%20509.8299584%20525.8965792%20505.565856%20537.5489984%20514.0940608%20557.237568%20521.3430336%20572.9080608%20546.0748224%20586.5695168%20629.2248%20620.3213504%20691.054272%20645.2334208%20760.985536%20687.4232096%20767.8080992%20703.8973216%20774.6306624%20720.3714304%20784.8645056%20752.114224%20791.6870688%20777.4280992%20799.7888608%20807.1618592%20793.3927072%20818.8142784%20761.8383584%20832.4757344%20720.4765728%20850.155264%20669.3073536%20857.3878016%20546.9276416%20862.2094912%20392.9935776%20868.2366048%20227.12002944%20858.5932224%20162.30568672%20840.1100768%20134.5890272%20832.4757344%20108.15159776%20815.1980096%20100.47621504%20799.5275136%2093.6536528%20786.2678656%2094.08006304%20784.2588288%20105.59313696%20746.4889184%20116.67980096%20709.924432%20119.23826176%20705.5045504%20141.41158944%20685.4141728%20143.84821888%20683.2001312%20146.05397248%20681.2036448%20148.2232096%20679.3252416L152.13038144%20676.0501632C159.5946992%20670.0236288%20167.98497088%20664.6722176%20184.94031712%20656.0863296L191.29263904%20652.915344C215.97973152%20640.7492736%20256.51622304%20622.3959904%20329.458464%20589.3821696%20359.7335872%20575.3189056%20371.2466592%20563.6664896%20375.084352%20542.772496%20377.2164032%20530.316464%20374.6579424%20526.7001952%20345.2356416%20496.9664352%20295.34565344%20446.338688%20274.02514592%20396.9163584%20273.59873568%20331.0199232%20273.59873568%20291.24097568%20282.12693888%20265.52529312%20307.71154784%20228.15719168%20332.8697472%20191.19089792%20365.703328%20169.49329056%20405.7858816%20162.66256256ZM668.7713728%20226.60405184C756.683056%20211.50282816%20820.4190272%20263.09867616%20827.0124032%20354.9644544%20831.8475456%20416.6277856%20815.1443264%20461.931456%20770.3093664%20510.1714752%20752.287472%20529.4674848%20747.891888%20536.5986176%20748.3314464%20548.344016%20748.7710048%20555.8946272%20751.4083552%20565.123152%20754.485264%20568.8984576%20757.5621728%20572.2542848%20788.331264%20588.1944672%20823.0563776%20604.1346464%20944.3745024%20659.92528%20966.791984%20682.996592%20958.4403712%20744.6599232%20954.923904%20771.9260224%20956.6821376%20771.0870656%20890.308816%20787.0272448%20867.4517792%20792.8999456%20845.0343008%20798.3531648%20841.0782752%20799.6116%20835.3640128%20801.2895136%20833.1662208%20797.9336864%20830.5288704%20781.5740256%20824.3750528%20739.6261824%20812.0674176%20710.6821696%20790.0894976%20687.6108576%20752.287472%20647.3409248%20703.9360448%20619.6553504%20624.3759712%20593.6476864%20597.5629088%20584.4191616%20560.64%20550.8608864%20560.64%20534.920704%20560.64%20527.7895712%20569.8707264%20514.7857408%20589.6508544%20494.6507744%20620.859504%20461.931456%20639.7605152%20429.631616%20648.5516832%20394.8149056%20655.5846208%20366.7098496%20652.0681504%20283.23364096%20642.837424%20254.7091072%20635.3649312%20231.63779328%20634.4858144%20232.47675008%20668.7713728%20226.60405184Z'%3e%3c/path%3e%3c/svg%3e";
+  const UserAvatar = "data:image/svg+xml,%3c?xml%20version='1.0'%20encoding='UTF-8'?%3e%3csvg%20width='32px'%20height='32px'%20viewBox='0%200%2032%2032'%20version='1.1'%20xmlns='http://www.w3.org/2000/svg'%20xmlns:xlink='http://www.w3.org/1999/xlink'%3e%3ctitle%3eIcon/用户%3c/title%3e%3cg%20id='Icon/用户'%20stroke='none'%20stroke-width='1'%20fill='none'%20fill-rule='evenodd'%3e%3cg%20id='user-(1)'%20transform='translate(3,%202)'%20fill='%23A3C5FD'%20fill-rule='nonzero'%3e%3cpath%20d='M13.0077612,27.9989067%20C10.3002732,27.9989067%207.59285518,28.0018792%204.88515705,27.997455%20C3.95018807,27.9959342%203.05044678,27.8282323%202.22816433,27.3628696%20C0.998627601,26.6672451%200.29953695,25.6114692%200.0864200465,24.2387462%20C-0.0656962495,23.259079%200.0147040645,22.4675755%200.0874005263,21.4879775%20C0.187970957,20.13461%200.423078914,19.3321844%200.863249688,18.0430358%20C1.22365046,16.9873982%201.73014453,16.0067633%202.49702917,15.175719%20C3.42254341,14.1726178%204.6014447,13.7297906%205.9255989,13.6440041%20C6.33292322,13.6073668%206.66741099,13.712025%206.9979768,13.9263185%20C7.58886318,14.3094892%208.17393665,14.7060014%208.79220674,15.0421658%20C10.1097776,15.758321%2011.5447274,16.1099698%2013.0616182,16.0930337%20C14.6806203,16.0750607%2016.2142496,15.63963%2017.592821,14.8169502%20C18.0555431,14.5407189%2018.5150436,14.256538%2018.9569652,13.9491996%20C19.3610679,13.6681294%2019.7808585,13.5749462%2020.274326,13.6337733%20C21.462472,13.7340074%2022.3872158,14.1103345%2023.2340106,14.8851094%20C23.902636,15.496952%2024.3685096,16.2520257%2024.7518119,17.0611566%20C25.272453,18.1598604%2025.5462904,18.7976948%2025.7441396,19.9861253%20C25.9499728,21.2233595%2026.0256808,22.2792045%2025.9924842,23.5308171%20C25.9627193,24.6543374%2025.6405577,25.6840525%2024.8535729,26.5307194%20C24.1686994,27.2671979%2023.3129402,27.7090574%2022.3211027,27.8808379%20C21.9232331,27.9495501%2021.5154185,27.9922014%2021.1120162,27.9935148%20C18.4104811,28.0036073%2015.7090862,27.9989067%2013.0077612,27.9989067%20L13.0077612,27.9989067%20Z%20M5.91775495,6.98479749%20C5.84814002,3.25685016%209.08684454,-0.00255470186%2013.0162355,1.5025268e-06%20C16.9117994,0.00256071584%2020.1304739,3.23452217%2020.1095656,7.04113598%20C20.0884528,10.8082092%2016.8998935,14.015354%2013.0058002,14.0149393%20C9.10134181,14.0145245%205.83322254,10.7695672%205.91775495,6.98479749%20Z'%20id='形状'%3e%3c/path%3e%3c/g%3e%3c/g%3e%3c/svg%3e";
+  const VirtualAvatar = "data:image/svg+xml,%3c?xml%20version='1.0'%20encoding='UTF-8'?%3e%3csvg%20width='32px'%20height='32px'%20viewBox='0%200%2032%2032'%20version='1.1'%20xmlns='http://www.w3.org/2000/svg'%20xmlns:xlink='http://www.w3.org/1999/xlink'%3e%3ctitle%3eIcon/虚拟icon%3c/title%3e%3cg%20id='Icon/虚拟icon'%20stroke='none'%20stroke-width='1'%20fill='none'%20fill-rule='evenodd'%3e%3cpath%20d='M27.4705882,3%20C28.315259,3%2029,3.68474098%2029,4.52941178%20L29,22.4623054%20C29,23.3069762%2028.315259,23.9917172%2027.4705882,23.9917172%20L20.5882353,23.9917172%20L20.5882353,27.0244081%20L24.0294118,27.0244081%20C24.2405794,27.0244081%2024.4117647,27.1955933%2024.4117647,27.406761%20L24.4117647,28.617647%20C24.4117647,28.8288148%2024.2405795,29%2024.0294118,29%20L7.97058824,29%20C7.75942054,29%207.58823529,28.8288148%207.58823529,28.617647%20L7.58823529,27.406761%20C7.58823531,27.1955933%207.75942055,27.0244081%207.97058824,27.0244081%20L11.4117647,27.0244081%20L11.4117647,23.9917172%20L4.52941178,23.9917172%20C3.68474098,23.9917172%203,23.3069762%203,22.4623054%20L3,4.52941178%20C3,3.68474098%203.68474098,3%204.52941178,3%20L27.4705882,3%20Z%20M19,24%20L13,24%20L13,27%20L19,27%20L19,24%20Z%20M23.4117647,7%20L8.58823529,7%20C8.03595054,7%207.58823529,7.44771525%207.58823529,8%20L7.58823529,19%20C7.58823529,19.5522847%208.03595054,20%208.58823529,20%20L23.4117647,20%20C23.9640495,20%2024.4117647,19.5522847%2024.4117647,19%20L24.4117647,8%20C24.4117647,7.44771525%2023.9640495,7%2023.4117647,7%20Z%20M12,10%20C12.5522847,10%2013,10.4477153%2013,11%20L13,13%20C13,13.5522847%2012.5522847,14%2012,14%20C11.4477153,14%2011,13.5522847%2011,13%20L11,11%20C11,10.4477153%2011.4477153,10%2012,10%20Z%20M20,10%20C20.5522847,10%2021,10.4477153%2021,11%20L21,13%20C21,13.5522847%2020.5522847,14%2020,14%20C19.4477153,14%2019,13.5522847%2019,13%20L19,11%20C19,10.4477153%2019.4477153,10%2020,10%20Z%20M26,5%20C25.4477153,5%2025,5.44771525%2025,6%20C25,6.55228475%2025.4477153,7%2026,7%20C26.5522847,7%2027,6.55228475%2027,6%20C27,5.44771525%2026.5522847,5%2026,5%20Z'%20id='蒙版'%20fill='%23A3C5FD'%20fill-rule='nonzero'%3e%3c/path%3e%3c/g%3e%3c/svg%3e";
   const UserRender = vue.defineComponent({
     name: "UserRender",
     props: {
@@ -3282,23 +3527,63 @@
       render: {
         type: Function,
         required: false
+      },
+      hasAvatar: {
+        type: Boolean,
+        default: false
+      },
+      avatarBaseUrl: {
+        type: String,
+        default: ""
       }
     },
     setup(props) {
+      const getAvatarUrl = (user) => {
+        if (user.type === "virtual") {
+          return VirtualAvatar;
+        }
+        if (user.type === "userGroup") {
+          return UserGroupAvatar;
+        }
+        if (!props.avatarBaseUrl) {
+          return UserAvatar;
+        }
+        const loginName = user.login_name || user.bk_username || user.id;
+        return `${props.avatarBaseUrl}${loginName}.png?default_when_absent=true`;
+      };
       const defaultRender = (h2, props2) => {
-        return h2("div", [
-          h2("span", props2.user.name),
-          props2.user.tenantId !== props2.tenantId && props2.user.tenantId ? h2(
-            "span",
-            {
+        return h2(
+          "div",
+          {
+            style: {
+              display: "flex",
+              alignItems: "center"
+            }
+          },
+          [
+            props2.hasAvatar ? h2("img", {
+              src: getAvatarUrl(props2.user),
               style: {
-                color: "#f59500",
-                marginLeft: "4px"
+                width: "20px",
+                height: "20px",
+                borderRadius: "50%",
+                marginRight: "6px",
+                flexShrink: 0
               }
-            },
-            `@${props2.tenants[props2.user.tenantId] || props2.user.tenantId}`
-          ) : null
-        ]);
+            }) : null,
+            h2("span", props2.user.name),
+            props2.user.tenantId !== props2.tenantId && props2.user.tenantId ? h2(
+              "span",
+              {
+                style: {
+                  color: "#f59500",
+                  marginLeft: "4px"
+                }
+              },
+              `@${props2.tenants[props2.user.tenantId] || props2.user.tenantId}`
+            ) : null
+          ]
+        );
       };
       return () => {
         try {
@@ -3310,106 +3595,38 @@
       };
     }
   });
-  const _hoisted_1$2 = {
+  const _hoisted_1$1 = {
     key: 0,
     class: "no-data"
   };
-  const _hoisted_2$2 = { class: "group-name" };
+  const _hoisted_2$1 = { class: "group-name" };
   const _hoisted_3$1 = { class: "group-count" };
-  const _hoisted_4$1 = ["onClick"];
-  const _sfc_main$4 = /* @__PURE__ */ vue.defineComponent({
+  const _hoisted_4 = ["onClick"];
+  const _sfc_main$2 = /* @__PURE__ */ vue.defineComponent({
     ...{
       name: "SelectionPopover"
     },
     __name: "selection-popover",
     props: {
-      /**
-       * 是否显示下拉菜单
-       */
-      isShow: {
-        type: Boolean,
-        default: false
-      },
-      /**
-       * 容器宽度
-       */
-      containerWidth: {
-        type: [Number, String],
-        default: "auto"
-      },
-      /**
-       * popover crossAxis 偏移量
-       */
-      crossAxisOffset: {
-        type: Number,
-        default: 0
-      },
-      /**
-       * 是否加载中
-       */
-      loading: {
-        type: Boolean,
-        default: false
-      },
-      /**
-       * 搜索结果选项
-       */
-      options: {
-        type: Array,
-        default: () => []
-      },
-      /**
-       * 搜索关键词
-       */
-      searchQuery: {
-        type: String,
-        default: ""
-      },
-      /**
-       * 当前租户ID
-       */
-      tenantId: {
-        type: String,
-        default: ""
-      },
-      /**
-       * 租户信息映射
-       */
-      tenants: {
-        type: Object,
-        default: () => ({})
-      },
-      /**
-       * 用户组
-       */
-      userGroup: {
-        type: Array,
-        default: () => []
-      },
-      /**
-       * 用户组名称
-       */
-      userGroupName: {
-        type: String,
-        default: ""
-      },
-      /**
-       * 无匹配人员时的提示文本
-       */
-      emptyText: {
-        type: String,
-        default: ""
-      },
-      /**
-       * 渲染列表项
-       */
-      renderListItem: {
-        type: Function
-      }
+      avatarBaseUrl: { default: "" },
+      containerWidth: { default: "auto" },
+      emptyText: { default: "" },
+      hasAvatar: { type: Boolean, default: false },
+      isShow: { type: Boolean, default: false },
+      loading: { type: Boolean, default: false },
+      options: { default: () => [] },
+      renderListItem: {},
+      searchQuery: { default: "" },
+      tenantId: { default: "" },
+      tenants: { default: () => ({}) },
+      userGroup: { default: () => [] },
+      userGroupName: { default: "" }
     },
-    emits: ["select-user", "click-outside"],
+    emits: ["click-outside", "select-user"],
     setup(__props, { emit: __emit }) {
       const { t } = useI18n();
+      const slotContainerRef = vue.ref(null);
+      const contentContainerRef = vue.ref(null);
       const props = __props;
       const emit = __emit;
       const groupedUsers = vue.computed(() => {
@@ -3418,11 +3635,11 @@
           groups[props.userGroupName] = props.userGroup.map((group) => ({
             ...group,
             tenantId: "",
-            type: "userGroup"
+            type: USER_TYPE.USER_GROUP
           }));
         }
         props.options.forEach((user) => {
-          const groupName = user.data_source_type === "virtual" ? t("虚拟账号") : t("用户");
+          const groupName = user.data_source_type === USER_TYPE.VIRTUAL ? t("虚拟账号") : t("用户");
           if (!groups[groupName]) {
             groups[groupName] = [];
           }
@@ -3434,114 +3651,150 @@
         emit("select-user", user);
       };
       const handleClickOutside = ({ event }) => {
+        var _a, _b;
+        const target = event.target;
+        if ((_a = slotContainerRef.value) == null ? void 0 : _a.contains(target)) {
+          return;
+        }
+        if ((_b = contentContainerRef.value) == null ? void 0 : _b.contains(target)) {
+          return;
+        }
         emit("click-outside", event);
       };
       return (_ctx, _cache) => {
         return vue.openBlock(), vue.createBlock(vue.unref(bkuiVue.Popover), {
           arrow: false,
           "ext-cls": "bk-user-selector-popover",
-          "is-show": __props.isShow,
-          offset: { mainAxis: 4, crossAxis: __props.crossAxisOffset },
+          "is-show": _ctx.isShow,
+          offset: { mainAxis: 4 },
           placement: "bottom-start",
           theme: "light",
           trigger: "manual",
-          width: __props.containerWidth,
+          width: _ctx.containerWidth,
           onClickoutside: handleClickOutside
         }, {
           content: vue.withCtx(() => [
-            vue.createVNode(vue.unref(bkuiVue.Loading), {
-              class: "dropdown-content",
-              loading: __props.loading,
-              mode: "spin",
-              size: "mini"
-            }, {
-              default: vue.withCtx(() => [
-                __props.options.length === 0 && __props.userGroup.length === 0 ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_1$2, [
-                  vue.createElementVNode(
-                    "span",
-                    null,
-                    vue.toDisplayString(__props.emptyText),
-                    1
-                    /* TEXT */
-                  )
-                ])) : (vue.openBlock(true), vue.createElementBlock(
-                  vue.Fragment,
-                  { key: 1 },
-                  vue.renderList(groupedUsers.value, (group, groupName) => {
-                    return vue.openBlock(), vue.createElementBlock("div", {
-                      key: groupName,
-                      class: "user-group"
-                    }, [
-                      Object.keys(groupedUsers.value).length > 1 || group.some((user) => user.type === "userGroup") ? (vue.openBlock(), vue.createElementBlock("div", {
-                        key: 0,
-                        class: "group-header",
-                        onClick: _cache[0] || (_cache[0] = vue.withModifiers(() => {
-                        }, ["prevent"]))
-                      }, [
-                        vue.createElementVNode(
-                          "span",
-                          _hoisted_2$2,
-                          vue.toDisplayString(groupName),
-                          1
-                          /* TEXT */
-                        ),
-                        vue.createElementVNode(
-                          "span",
-                          _hoisted_3$1,
-                          "(" + vue.toDisplayString(group.length) + ")",
-                          1
-                          /* TEXT */
-                        )
-                      ])) : vue.createCommentVNode("v-if", true),
-                      (vue.openBlock(true), vue.createElementBlock(
-                        vue.Fragment,
+            vue.createElementVNode(
+              "div",
+              {
+                ref_key: "contentContainerRef",
+                ref: contentContainerRef
+              },
+              [
+                vue.createVNode(vue.unref(bkuiVue.Loading), {
+                  class: "dropdown-content",
+                  loading: _ctx.loading,
+                  mode: "spin",
+                  size: "mini"
+                }, {
+                  default: vue.withCtx(() => [
+                    _ctx.options.length === 0 && _ctx.userGroup.length === 0 ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_1$1, [
+                      vue.createElementVNode(
+                        "span",
                         null,
-                        vue.renderList(group, (user) => {
-                          return vue.openBlock(), vue.createElementBlock("div", {
-                            key: user.id,
-                            class: "user-option",
-                            onClick: vue.withModifiers(($event) => selectUser(user), ["prevent"])
+                        vue.toDisplayString(_ctx.emptyText),
+                        1
+                        /* TEXT */
+                      )
+                    ])) : (vue.openBlock(true), vue.createElementBlock(
+                      vue.Fragment,
+                      { key: 1 },
+                      vue.renderList(groupedUsers.value, (group, groupName) => {
+                        return vue.openBlock(), vue.createElementBlock("div", {
+                          key: groupName,
+                          class: "user-group"
+                        }, [
+                          Object.keys(groupedUsers.value).length > 1 || group.some((user) => user.type === "userGroup") ? (vue.openBlock(), vue.createElementBlock("div", {
+                            key: 0,
+                            class: "group-header",
+                            onClick: _cache[0] || (_cache[0] = vue.withModifiers(() => {
+                            }, ["prevent"]))
                           }, [
-                            vue.createVNode(vue.unref(UserRender), {
-                              render: __props.renderListItem,
-                              "tenant-id": __props.tenantId,
-                              tenants: __props.tenants,
-                              user
-                            }, null, 8, ["render", "tenant-id", "tenants", "user"])
-                          ], 8, _hoisted_4$1);
-                        }),
-                        128
-                        /* KEYED_FRAGMENT */
-                      ))
-                    ]);
-                  }),
-                  128
-                  /* KEYED_FRAGMENT */
-                ))
-              ]),
-              _: 1
-              /* STABLE */
-            }, 8, ["loading"])
+                            vue.createElementVNode(
+                              "span",
+                              _hoisted_2$1,
+                              vue.toDisplayString(groupName),
+                              1
+                              /* TEXT */
+                            ),
+                            vue.createElementVNode(
+                              "span",
+                              _hoisted_3$1,
+                              "(" + vue.toDisplayString(group.length) + ")",
+                              1
+                              /* TEXT */
+                            )
+                          ])) : vue.createCommentVNode("v-if", true),
+                          (vue.openBlock(true), vue.createElementBlock(
+                            vue.Fragment,
+                            null,
+                            vue.renderList(group, (user) => {
+                              return vue.openBlock(), vue.createElementBlock("div", {
+                                key: user.id,
+                                class: "user-option",
+                                onClick: vue.withModifiers(($event) => selectUser(user), ["prevent"]),
+                                onMousedown: _cache[1] || (_cache[1] = vue.withModifiers(() => {
+                                }, ["prevent"]))
+                              }, [
+                                vue.createVNode(vue.unref(UserRender), {
+                                  "avatar-base-url": _ctx.avatarBaseUrl,
+                                  "has-avatar": _ctx.hasAvatar,
+                                  render: _ctx.renderListItem,
+                                  "tenant-id": _ctx.tenantId,
+                                  tenants: _ctx.tenants,
+                                  user
+                                }, null, 8, ["avatar-base-url", "has-avatar", "render", "tenant-id", "tenants", "user"])
+                              ], 40, _hoisted_4);
+                            }),
+                            128
+                            /* KEYED_FRAGMENT */
+                          ))
+                        ]);
+                      }),
+                      128
+                      /* KEYED_FRAGMENT */
+                    ))
+                  ]),
+                  _: 1
+                  /* STABLE */
+                }, 8, ["loading"])
+              ],
+              512
+              /* NEED_PATCH */
+            )
           ]),
           default: vue.withCtx(() => [
-            vue.renderSlot(_ctx.$slots, "default", {}, void 0, true)
+            vue.createElementVNode(
+              "div",
+              {
+                ref_key: "slotContainerRef",
+                ref: slotContainerRef
+              },
+              [
+                vue.renderSlot(_ctx.$slots, "default", {}, void 0, true)
+              ],
+              512
+              /* NEED_PATCH */
+            )
           ]),
           _: 3
           /* FORWARDED */
-        }, 8, ["is-show", "offset", "width"]);
+        }, 8, ["is-show", "width"]);
       };
     }
   });
-  const SelectionPopover = /* @__PURE__ */ _export_sfc(_sfc_main$4, [["__scopeId", "data-v-78875ea6"]]);
-  const _sfc_main$3 = /* @__PURE__ */ vue.defineComponent({
+  const SelectionPopover = /* @__PURE__ */ _export_sfc(_sfc_main$2, [["__scopeId", "data-v-d5a338f0"]]);
+  const _sfc_main$1 = /* @__PURE__ */ vue.defineComponent({
     ...{
       name: "UserTag"
     },
     __name: "user-tag",
     props: {
       active: { type: Boolean },
+      avatarBaseUrl: {},
       currentTenantId: {},
       draggable: { type: Boolean },
+      hasAvatar: { type: Boolean },
       renderTag: { type: Function },
       showTenant: { type: Boolean },
       tenants: {},
@@ -3566,11 +3819,13 @@
         }, {
           default: vue.withCtx(() => [
             vue.createVNode(vue.unref(UserRender), {
+              "avatar-base-url": _ctx.avatarBaseUrl,
+              "has-avatar": _ctx.hasAvatar,
               render: _ctx.renderTag,
               "tenant-id": _ctx.currentTenantId,
               tenants: _ctx.tenants,
               user: _ctx.user
-            }, null, 8, ["render", "tenant-id", "tenants", "user"])
+            }, null, 8, ["avatar-base-url", "has-avatar", "render", "tenant-id", "tenants", "user"])
           ]),
           _: 1
           /* STABLE */
@@ -3578,84 +3833,176 @@
       };
     }
   });
-  const UserTag = /* @__PURE__ */ _export_sfc(_sfc_main$3, [["__scopeId", "data-v-48ac8fc1"]]);
-  const _hoisted_1$1 = ["onClick"];
-  const _hoisted_2$1 = ["placeholder"];
-  const _hoisted_3 = { class: "hidden-users" };
-  const _hoisted_4 = ["placeholder"];
-  const _sfc_main$2 = /* @__PURE__ */ vue.defineComponent({
+  const UserTag = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["__scopeId", "data-v-1f2e0737"]]);
+  const _hoisted_1 = ["placeholder"];
+  const _hoisted_2 = { class: "hidden-users" };
+  const _hoisted_3 = ["placeholder"];
+  const _sfc_main = /* @__PURE__ */ vue.defineComponent({
     ...{
-      name: "BkUserSelectorMultiple"
+      name: "BkUserSelector"
     },
-    __name: "multiple-selector",
+    __name: "user-selector",
     props: {
       draggable: { type: Boolean, default: false },
-      freePaste: { type: Boolean, default: false },
-      modelValue: { default: () => [] },
-      selectedUsers: { default: () => [] },
-      tenants: { default: () => ({}) },
+      maxCount: { default: 0 },
+      modelValue: { default: "" },
+      multiple: { type: Boolean, default: false },
       allowCreate: { type: Boolean, default: false },
       apiBaseUrl: { default: "" },
+      avatarBaseUrl: { default: "" },
       currentUserId: { default: "" },
-      disabled: { type: Boolean },
+      disabled: { type: Boolean, default: false },
       emptyText: { default: "" },
-      enableMultiTenantMode: { type: Boolean },
-      exactSearchKey: { default: "bk_username" },
+      enableMultiTenantMode: { type: Boolean, default: true },
+      exactSearchKey: { default: DEFAULT_EXACT_SEARCH_KEY },
       excludeUserIds: { default: () => [] },
+      freePaste: { type: Boolean, default: false },
+      hasAvatar: { type: Boolean, default: false },
       placeholder: { default: "" },
-      tenantId: { default: "" },
-      userGroupName: { default: "" },
       renderListItem: {},
       renderTag: {},
-      userGroup: { default: () => [] }
+      tenantId: { default: "" },
+      userGroup: { default: () => [] },
+      userGroupName: { default: "" }
     },
-    emits: [
-      "update:selectedUsers",
-      "add-user",
-      "remove-user",
-      "dragStart",
-      "dragEnd",
-      "focus",
-      "blur"
-    ],
+    emits: ["blur", "change", "dragEnd", "dragStart", "focus", "update:modelValue"],
     setup(__props, { emit: __emit }) {
+      const { t } = useI18n();
+      bkuiVue.provideGlobalConfig({
+        prefix: "bk"
+      });
       const props = __props;
       const emit = __emit;
+      const { tenants = {} } = useTenantData(props.apiBaseUrl, props.tenantId, props.enableMultiTenantMode);
       const {
         searchResults,
         loading: searchLoading,
         searchQuery,
-        // clearSearch,
+        clearSearch,
         handleSearchInput
       } = useUserSearch(props.apiBaseUrl, props.tenantId, props.enableMultiTenantMode);
+      const { fetchCurrentUser } = useCurrentUser({
+        apiBaseUrl: props.apiBaseUrl,
+        tenantId: props.tenantId,
+        currentUserId: props.currentUserId || "",
+        exactSearchKey: props.exactSearchKey,
+        enableMultiTenantMode: props.enableMultiTenantMode
+      });
       const containerRef = vue.ref(null);
-      const tagsContainerRef = vue.ref(null);
       const sortableContainerRef = vue.ref(null);
       const collapsedContainerRef = vue.ref(null);
       const inlineInputRef = vue.ref(null);
       const lastInputRef = vue.ref(null);
-      const collapsedInputRef = vue.ref(null);
       const isFocused = vue.ref(false);
-      const showDropdown = vue.ref(false);
       const activeTagIndex = vue.ref(-1);
       const sortableInstance = vue.ref(null);
       const visibleUsers = vue.ref([]);
       const hiddenCount = vue.ref(0);
-      const options = vue.computed(() => {
-        return searchResults.value.filter((user) => !props.selectedUsers.some((selectedUser) => selectedUser.id === user.id)).filter((user) => !props.excludeUserIds.includes(user.id));
+      const selectedUsers = vue.ref([]);
+      const showDropdown = vue.computed(() => {
+        return isFocused.value && (props.userGroup.length > 0 || searchQuery.value.trim() !== "");
       });
-      const userGroupFilter = vue.computed(() => {
-        return props.userGroup.filter((group) => {
-          var _a, _b;
-          const filtered = !props.selectedUsers.some((user) => user.id === group.id) && !group.hidden;
-          if (filtered) {
-            return ((_a = group.id) == null ? void 0 : _a.includes(searchQuery.value)) || ((_b = group.name) == null ? void 0 : _b.includes(searchQuery.value));
-          }
-          return false;
-        });
+      const modelValueIds = vue.computed(() => {
+        if (props.multiple) {
+          return Array.isArray(props.modelValue) ? props.modelValue : [];
+        }
+        return props.modelValue ? [props.modelValue] : [];
+      });
+      const computedPlaceholder = vue.computed(() => props.placeholder || t("请输入人员名称搜索"));
+      const computedUserGroupName = vue.computed(() => props.userGroupName || t("用户群组"));
+      const computedEmptyText = vue.computed(() => props.emptyText || t("无匹配人员"));
+      const selectedUserIds = vue.computed(() => selectedUsers.value.map((user) => user.id));
+      const isMaxCountReached = vue.computed(() => {
+        if (!props.maxCount || props.maxCount <= 0) return false;
+        return selectedUsers.value.length >= props.maxCount;
+      });
+      const isMeTagDisabled = vue.computed(
+        () => isMaxCountReached.value || !!props.currentUserId && selectedUsers.value.some((user) => user[props.exactSearchKey] === props.currentUserId)
+      );
+      const userTagCommonProps = vue.computed(() => ({
+        avatarBaseUrl: props.avatarBaseUrl,
+        currentTenantId: props.tenantId,
+        hasAvatar: props.hasAvatar,
+        renderTag: props.renderTag,
+        tenants
+      }));
+      const { filteredUserGroup, filterOptions, createCustomUser } = useUserSelection({
+        selectedUserIds,
+        excludeUserIds: vue.toRef(props, "excludeUserIds"),
+        userGroup: vue.toRef(props, "userGroup"),
+        searchQuery
+      });
+      const { handlePaste } = useInputHandler({
+        apiBaseUrl: props.apiBaseUrl,
+        tenantId: props.tenantId,
+        searchQuery,
+        selectedUsers,
+        allowCreate: props.allowCreate,
+        freePaste: props.freePaste,
+        enableMultiTenantMode: props.enableMultiTenantMode,
+        maxCount: props.maxCount,
+        onAddUser: addUser,
+        onBatchAddUsers: props.multiple ? updateSelectedUsers : void 0
+      });
+      const displayOptions = vue.computed(() => filterOptions(searchResults.value));
+      const inputWidth = vue.computed(() => {
+        const query = searchQuery.value;
+        if (!query) return "20px";
+        const charWidth = query.split("").reduce((acc, char) => {
+          return acc + (/[\u4e00-\u9fa5]/.test(char) ? 12 : 8);
+        }, 0);
+        return `${Math.max(20, charWidth + 4)}px`;
       });
+      const initSelectedUsers = async () => {
+        const ids = modelValueIds.value;
+        if (ids.length === 0) {
+          selectedUsers.value = [];
+          return;
+        }
+        let userGroupSelected = [];
+        if (props.userGroup.length > 0) {
+          const result = props.userGroup.filter((group) => ids.includes(group.id));
+          userGroupSelected = result.map((group) => ({
+            ...group,
+            tenantId: "",
+            type: USER_TYPE.USER_GROUP
+          }));
+        }
+        try {
+          const result = await lookupUsers({
+            apiBaseUrl: props.apiBaseUrl,
+            tenantId: props.tenantId,
+            exactSearchKey: "bk_username",
+            usersList: ids,
+            enableMultiTenantMode: props.enableMultiTenantMode
+          });
+          const selectedList = [...userGroupSelected, ...formatUsers(result, props.enableMultiTenantMode)];
+          if (props.allowCreate) {
+            selectedList.push(
+              ...ids.filter((id) => !selectedList.some((user) => user.id === id)).map((id) => ({ id, name: id, type: USER_TYPE.CUSTOM, tenantId: "" }))
+            );
+          }
+          selectedUsers.value = ids.map((id) => selectedList.find((user) => user.id === id)).filter(Boolean);
+        } catch (error) {
+          console.error("获取选中用户信息失败:", error);
+          selectedUsers.value = [];
+        }
+      };
+      function updateSelectedUsers(users) {
+        selectedUsers.value = users;
+        if (props.multiple) {
+          const ids = users.map((user) => user.id);
+          emit("update:modelValue", ids);
+          emit("change", users);
+        } else {
+          const user = users.length > 0 ? users[0] : null;
+          const id = user ? user.id : "";
+          emit("update:modelValue", id);
+          emit("change", user);
+        }
+      }
       const initSortable = () => {
-        if (!props.draggable || !sortableContainerRef.value) return;
+        if (!props.draggable || !props.multiple || !sortableContainerRef.value) return;
         if (sortableInstance.value) {
           sortableInstance.value.destroy();
         }
@@ -3668,276 +4015,206 @@
           onEnd: (evt) => {
             const { oldIndex, newIndex } = evt;
             if (oldIndex === newIndex || oldIndex === void 0 || newIndex === void 0) return;
-            const updatedUsers = [...props.selectedUsers];
+            const updatedUsers = [...selectedUsers.value];
             const [movedUser] = updatedUsers.splice(oldIndex, 1);
             updatedUsers.splice(newIndex, 0, movedUser);
-            emit("update:selectedUsers", updatedUsers);
+            updateSelectedUsers(updatedUsers);
             emit("dragEnd", evt);
           }
         });
       };
       const calculateVisibleUsers = () => {
-        if (!collapsedContainerRef.value || !props.selectedUsers.length) {
+        if (!selectedUsers.value.length) {
           visibleUsers.value = [];
           hiddenCount.value = 0;
           return;
         }
+        if (!collapsedContainerRef.value) {
+          visibleUsers.value = [...selectedUsers.value];
+          hiddenCount.value = 0;
+          return;
+        }
         const containerWidth = collapsedContainerRef.value.offsetWidth;
         const tagElements = collapsedContainerRef.value.querySelectorAll(".user-tag");
+        if (tagElements.length !== selectedUsers.value.length) {
+          visibleUsers.value = [...selectedUsers.value];
+          hiddenCount.value = 0;
+          vue.nextTick(calculateVisibleUsers);
+          return;
+        }
         const visibleCount = calculateVisibleTags(
           collapsedContainerRef.value,
           tagElements,
-          containerWidth - 100
-          // 为输入框和更多标签预留空间
+          containerWidth - RESERVED_SPACE_FOR_INPUT
         );
-        visibleUsers.value = props.selectedUsers.slice(0, visibleCount);
-        hiddenCount.value = Math.max(0, props.selectedUsers.length - visibleCount);
+        visibleUsers.value = selectedUsers.value.slice(0, visibleCount);
+        hiddenCount.value = Math.max(0, selectedUsers.value.length - visibleCount);
       };
       const handleFocus = () => {
         isFocused.value = true;
-        if (props.userGroup.length > 0) {
-          showDropdown.value = true;
-        } else {
-          showDropdown.value = false;
-        }
         activeTagIndex.value = -1;
         vue.nextTick(() => {
-          if (lastInputRef.value) {
-            lastInputRef.value.focus();
-          }
+          var _a;
+          return (_a = lastInputRef.value) == null ? void 0 : _a.focus();
         });
       };
+      const scheduleVisibleUsersCalculation = () => {
+        if (!isFocused.value) {
+          vue.nextTick(calculateVisibleUsers);
+        }
+      };
       const handleClickOutside = (event) => {
         const target = event.target;
         const container = containerRef.value;
-        if ((container == null ? void 0 : container.contains(target)) || container === target) {
-          return;
-        }
-        if (isFocused.value) {
-          emit("blur");
-        }
+        if ((container == null ? void 0 : container.contains(target)) || container === target) return;
+        if (isFocused.value) emit("blur");
         isFocused.value = false;
-        showDropdown.value = false;
         activeTagIndex.value = -1;
-        searchQuery.value = "";
-        vue.nextTick(() => {
-          calculateVisibleUsers();
-        });
+        clearSearch();
+        scheduleVisibleUsersCalculation();
       };
       const handleContainerClick = () => {
         activeTagIndex.value = -1;
         vue.nextTick(() => {
-          if (lastInputRef.value) {
-            lastInputRef.value.focus();
-          }
+          var _a;
+          return (_a = lastInputRef.value) == null ? void 0 : _a.focus();
         });
       };
       const handleTagClick = (index) => {
         activeTagIndex.value = index;
         vue.nextTick(() => {
           var _a;
-          if (activeTagIndex.value === props.selectedUsers.length - 1) {
-            if (lastInputRef.value) {
-              lastInputRef.value.focus();
-            }
-          } else if ((_a = inlineInputRef.value) == null ? void 0 : _a[0]) {
-            inlineInputRef.value[0].focus();
-          }
+          const isLastTag = index === selectedUsers.value.length - 1;
+          const targetInput = isLastTag ? lastInputRef.value : (_a = inlineInputRef.value) == null ? void 0 : _a[0];
+          targetInput == null ? void 0 : targetInput.focus();
         });
       };
       const handleInputFocus = () => {
         emit("focus");
-        if (!isFocused.value) {
-          isFocused.value = true;
-        }
-        if (searchQuery.value.length >= 1) {
-          showDropdown.value = true;
-        }
+        isFocused.value = true;
       };
       const handleInput = () => {
         handleSearchInput(searchQuery.value);
-        if (searchQuery.value.length >= 1) {
-          showDropdown.value = true;
-        } else {
-          showDropdown.value = false;
-        }
       };
       const addCurrentUser = async () => {
-        if (!props.currentUserId || props.selectedUsers.some((user) => user.id === props.currentUserId)) return;
-        try {
-          const result = await lookupUsers({
-            apiBaseUrl: props.apiBaseUrl,
-            tenantId: props.tenantId,
-            exactSearchKey: props.exactSearchKey,
-            usersList: [props.currentUserId],
-            enableMultiTenantMode: props.enableMultiTenantMode
-          });
-          const formattedUsers = formatUsers(result, props.enableMultiTenantMode);
-          if (formattedUsers.length > 0) {
-            if (!props.selectedUsers.some((item) => item.id === formattedUsers[0].id)) {
-              emit("update:selectedUsers", [...props.selectedUsers, formattedUsers[0]]);
-              emit("add-user", formattedUsers[0]);
-            }
-            searchQuery.value = "";
-            showDropdown.value = false;
-          }
-        } catch (error) {
-          console.error("获取当前用户信息失败:", error);
+        if (!props.currentUserId || selectedUsers.value.some((user) => user[props.exactSearchKey] === props.currentUserId))
+          return;
+        if (props.multiple && isMaxCountReached.value) {
+          return;
         }
-      };
-      const handlePaste = async (event) => {
-        var _a;
-        event.preventDefault();
-        const pastedText = ((_a = event.clipboardData) == null ? void 0 : _a.getData("text")) || "";
-        if (pastedText.trim()) {
-          try {
-            const usersList = pastedText.trim().split(/[,，;\n\s]+/).filter(Boolean);
-            const users = usersList.map((user) => user.trim().replace(/\s*\(.*?\)\s*/, "")).filter((user) => user);
-            const result = await lookupUsers({
-              apiBaseUrl: props.apiBaseUrl,
-              tenantId: props.tenantId,
-              exactSearchKey: "login_name",
-              usersList: users,
-              enableMultiTenantMode: props.enableMultiTenantMode
-            });
-            const formattedUsers = formatUsers(result, props.enableMultiTenantMode);
-            if (formattedUsers.length > 0) {
-              const userMap = /* @__PURE__ */ new Map();
-              [...props.selectedUsers, ...formattedUsers].forEach((user) => {
-                if (!userMap.has(user.id)) {
-                  userMap.set(user.id, user);
-                }
-              });
-              const updatedUsers = Array.from(userMap.values());
-              if (props.freePaste) {
-                const pastedUsers = usersList.map((user) => ({
-                  id: user,
-                  name: user,
-                  type: "custom",
-                  tenantId: "",
-                  login_name: user
-                }));
-                pastedUsers.forEach((user) => {
-                  if (!updatedUsers.some((item) => item.login_name === user.login_name)) {
-                    addUser(user);
-                  }
-                });
-              } else {
-                emit("update:selectedUsers", updatedUsers);
-              }
-            } else {
-              if (props.freePaste) {
-                const pastedUsers = usersList.map((user) => ({
-                  id: user,
-                  name: user,
-                  type: "custom",
-                  tenantId: "",
-                  login_name: user
-                }));
-                pastedUsers.forEach((user) => {
-                  if (!props.selectedUsers.some((item) => item.login_name === user.login_name)) {
-                    addUser(user);
-                  }
-                });
-              }
-            }
-          } catch (error) {
-            console.error("精准查找用户失败:", error);
+        const currentUser = await fetchCurrentUser();
+        if (currentUser) {
+          if (!props.multiple) {
+            updateSelectedUsers([currentUser]);
+          } else if (!selectedUsers.value.some((item) => item.id === currentUser.id)) {
+            updateSelectedUsers([...selectedUsers.value, currentUser]);
           }
+          clearSearch();
+          isFocused.value = true;
+          vue.nextTick(() => {
+            var _a;
+            return (_a = lastInputRef.value) == null ? void 0 : _a.focus();
+          });
         }
       };
+      const onPaste = (event) => {
+        handlePaste(event);
+      };
       const handleKeyDown = (event) => {
-        if (event.key === "Backspace" && !searchQuery.value && props.selectedUsers.length > 0) {
+        if (event.key === "Backspace" && !searchQuery.value && selectedUsers.value.length > 0) {
           if (activeTagIndex.value >= 0) {
-            const userToRemove = props.selectedUsers[activeTagIndex.value];
+            const userToRemove = selectedUsers.value[activeTagIndex.value];
             removeUser(userToRemove);
-            if (activeTagIndex.value > 0) {
-              activeTagIndex.value = activeTagIndex.value - 1;
-            } else {
-              activeTagIndex.value = -1;
-            }
+            activeTagIndex.value = activeTagIndex.value > 0 ? activeTagIndex.value - 1 : -1;
           } else {
-            const lastUser = props.selectedUsers[props.selectedUsers.length - 1];
+            const lastUser = selectedUsers.value[selectedUsers.value.length - 1];
             removeUser(lastUser);
           }
-        } else if (event.key === "Enter" && props.allowCreate) {
-          addUser({
-            id: searchQuery.value,
-            name: searchQuery.value,
-            type: "custom",
-            tenantId: "",
-            login_name: searchQuery.value
-          });
+        } else if (event.key === "Enter" && props.allowCreate && searchQuery.value) {
+          addUser(createCustomUser(searchQuery.value));
         }
       };
-      const addUser = (user) => {
+      function addUser(user) {
         if (!(user == null ? void 0 : user.id)) return;
-        if (!props.selectedUsers.some((item) => item.id === user.id)) {
+        if (props.multiple && isMaxCountReached.value) {
+          clearSearch();
+          return;
+        }
+        if (!props.multiple) {
+          updateSelectedUsers([user]);
+        } else if (!selectedUsers.value.some((item) => item.id === user.id)) {
+          const updatedUsers = activeTagIndex.value !== -1 ? [
+            ...selectedUsers.value.slice(0, activeTagIndex.value + 1),
+            user,
+            ...selectedUsers.value.slice(activeTagIndex.value + 1)
+          ] : [...selectedUsers.value, user];
+          updateSelectedUsers(updatedUsers);
+        }
+        if (activeTagIndex.value !== -1) {
+          activeTagIndex.value = activeTagIndex.value + 1;
+        }
+        clearSearch();
+        isFocused.value = true;
+        vue.nextTick(() => {
+          var _a, _b, _c;
           if (activeTagIndex.value !== -1) {
-            const updatedUsers = [
-              ...props.selectedUsers.slice(0, activeTagIndex.value + 1),
-              user,
-              ...props.selectedUsers.slice(activeTagIndex.value + 1)
-            ];
-            emit("update:selectedUsers", updatedUsers);
+            (_b = (_a = inlineInputRef.value) == null ? void 0 : _a[0]) == null ? void 0 : _b.focus();
           } else {
-            emit("update:selectedUsers", [...props.selectedUsers, user]);
+            (_c = lastInputRef.value) == null ? void 0 : _c.focus();
           }
-          emit("add-user", user);
-        }
-        searchQuery.value = "";
-        showDropdown.value = false;
-        vue.nextTick(() => {
-          var _a;
-          (_a = lastInputRef.value) == null ? void 0 : _a.focus();
         });
-      };
+      }
       const removeUser = (user) => {
         if (!(user == null ? void 0 : user.id)) return;
-        const updatedUsers = props.selectedUsers.filter((item) => item.id !== user.id);
-        emit("update:selectedUsers", updatedUsers);
-        emit("remove-user", user);
+        const updatedUsers = selectedUsers.value.filter((item) => item.id !== user.id);
+        updateSelectedUsers(updatedUsers);
         if (activeTagIndex.value >= updatedUsers.length) {
-          activeTagIndex.value = updatedUsers.length - 1;
-        }
-        if (!isFocused.value) {
-          vue.nextTick(() => {
-            calculateVisibleUsers();
-          });
+          activeTagIndex.value = updatedUsers.length - 1;
         }
+        scheduleVisibleUsersCalculation();
       };
-      const crossAxisOffset = vue.ref(0);
       vue.watch(
-        () => props.selectedUsers,
+        selectedUsers,
         () => {
-          visibleUsers.value = [...props.selectedUsers];
-          if (!isFocused.value) {
-            vue.nextTick(() => {
-              calculateVisibleUsers();
-            });
-          }
+          scheduleVisibleUsersCalculation();
         },
         { deep: true }
       );
       vue.watch(isFocused, (newVal) => {
         if (newVal) {
-          vue.nextTick(() => {
-            initSortable();
-          });
+          vue.nextTick(() => initSortable());
         }
       });
-      const handleResize = () => {
-        if (!isFocused.value) {
-          calculateVisibleUsers();
+      vue.watch(
+        () => props.userGroup,
+        () => {
+          initSelectedUsers();
         }
-      };
+      );
+      vue.watch(
+        () => props.modelValue,
+        () => {
+          const currentIds = selectedUsers.value.map((u) => u.id);
+          const newIds = modelValueIds.value;
+          if (currentIds.length !== newIds.length || !currentIds.every((id, index) => id === newIds[index])) {
+            initSelectedUsers();
+          }
+        },
+        { deep: true }
+      );
+      useResizeObserver(containerRef, () => {
+        scheduleVisibleUsersCalculation();
+      });
+      vue.onBeforeMount(() => {
+        initSelectedUsers();
+      });
       vue.onMounted(() => {
         initSortable();
-        calculateVisibleUsers();
-        window.addEventListener("resize", handleResize);
-        vue.nextTick(() => {
-          calculateVisibleUsers();
-        });
+        vue.nextTick(calculateVisibleUsers);
+      });
+      vue.onUnmounted(() => {
+        var _a;
+        (_a = sortableInstance.value) == null ? void 0 : _a.destroy();
       });
       return (_ctx, _cache) => {
         return vue.openBlock(), vue.createElementBlock(
@@ -3945,34 +4222,32 @@
           {
             ref_key: "containerRef",
             ref: containerRef,
-            class: vue.normalizeClass(["multiple-selector", { "is-disabled": _ctx.disabled }])
+            class: vue.normalizeClass(["bk-user-selector", { "is-disabled": _ctx.disabled }])
           },
           [
             vue.createCommentVNode(" 下拉选项列表 "),
             vue.createVNode(SelectionPopover, {
+              "avatar-base-url": _ctx.avatarBaseUrl,
               "container-width": containerRef.value ? containerRef.value.offsetWidth : "auto",
-              "cross-axis-offset": crossAxisOffset.value,
-              "empty-text": _ctx.emptyText,
+              "empty-text": computedEmptyText.value,
+              "has-avatar": _ctx.hasAvatar,
               "is-show": showDropdown.value,
               loading: vue.unref(searchLoading),
-              options: options.value,
+              options: displayOptions.value,
               "render-list-item": _ctx.renderListItem,
               "search-query": vue.unref(searchQuery),
               "tenant-id": _ctx.tenantId,
-              tenants: _ctx.tenants,
-              "user-group": userGroupFilter.value,
-              "user-group-name": _ctx.userGroupName,
+              tenants: vue.unref(tenants),
+              "user-group": vue.unref(filteredUserGroup),
+              "user-group-name": computedUserGroupName.value,
               onClickOutside: handleClickOutside,
               onSelectUser: addUser
             }, {
               default: vue.withCtx(() => [
                 vue.createCommentVNode(" 聚焦状态 - 可编辑模式 "),
-                isFocused.value ? (vue.openBlock(), vue.createElementBlock(
+                vue.withDirectives(vue.createElementVNode(
                   "div",
                   {
-                    key: 0,
-                    ref_key: "tagsContainerRef",
-                    ref: tagsContainerRef,
                     class: "tags-container focused",
                     onClick: vue.withModifiers(handleContainerClick, ["stop"])
                   },
@@ -3989,24 +4264,20 @@
                         (vue.openBlock(true), vue.createElementBlock(
                           vue.Fragment,
                           null,
-                          vue.renderList(_ctx.selectedUsers, (user, index) => {
+                          vue.renderList(selectedUsers.value, (user, index) => {
                             return vue.openBlock(), vue.createElementBlock("div", {
                               key: user.id,
-                              class: "tag-wrapper",
-                              onClick: vue.withModifiers(($event) => handleTagClick(index), ["stop"])
+                              class: "tag-wrapper"
                             }, [
-                              vue.createVNode(UserTag, {
+                              vue.createVNode(UserTag, vue.mergeProps({ ref_for: true }, userTagCommonProps.value, {
                                 active: index === activeTagIndex.value,
-                                "current-tenant-id": _ctx.tenantId,
-                                draggable: _ctx.draggable,
-                                "render-tag": _ctx.renderTag,
-                                tenants: _ctx.tenants,
+                                draggable: _ctx.draggable && _ctx.multiple,
                                 user,
                                 onClick: ($event) => handleTagClick(index),
                                 onClose: ($event) => removeUser(user)
-                              }, null, 8, ["active", "current-tenant-id", "draggable", "render-tag", "tenants", "user", "onClick", "onClose"]),
+                              }), null, 16, ["active", "draggable", "user", "onClick", "onClose"]),
                               vue.createCommentVNode(" 在当前激活标签后插入输入框 "),
-                              index === activeTagIndex.value && activeTagIndex.value !== _ctx.selectedUsers.length - 1 ? vue.withDirectives((vue.openBlock(), vue.createElementBlock(
+                              index === activeTagIndex.value && activeTagIndex.value !== selectedUsers.value.length - 1 ? vue.withDirectives((vue.openBlock(), vue.createElementBlock(
                                 "input",
                                 {
                                   key: 0,
@@ -4014,42 +4285,45 @@
                                   ref_key: "inlineInputRef",
                                   ref: inlineInputRef,
                                   "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => vue.isRef(searchQuery) ? searchQuery.value = $event : null),
-                                  class: "search-input inline",
+                                  autofocus: "",
+                                  class: "search-input input-inline",
+                                  style: vue.normalizeStyle({ width: inputWidth.value }),
                                   onFocus: handleInputFocus,
                                   onInput: handleInput,
                                   onKeydown: handleKeyDown,
-                                  onPaste: handlePaste
+                                  onPaste
                                 },
                                 null,
-                                544
-                                /* NEED_HYDRATION, NEED_PATCH */
+                                36
+                                /* STYLE, NEED_HYDRATION */
                               )), [
                                 [vue.vModelText, vue.unref(searchQuery)]
                               ]) : vue.createCommentVNode("v-if", true)
-                            ], 8, _hoisted_1$1);
+                            ]);
                           }),
                           128
                           /* KEYED_FRAGMENT */
                         )),
                         vue.createCommentVNode(" 最后一个输入框 "),
-                        activeTagIndex.value === -1 || activeTagIndex.value === _ctx.selectedUsers.length - 1 ? vue.withDirectives((vue.openBlock(), vue.createElementBlock("input", {
+                        activeTagIndex.value === -1 || activeTagIndex.value === selectedUsers.value.length - 1 ? vue.withDirectives((vue.openBlock(), vue.createElementBlock("input", {
                           key: 0,
                           ref_key: "lastInputRef",
                           ref: lastInputRef,
                           "onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => vue.isRef(searchQuery) ? searchQuery.value = $event : null),
-                          class: "search-input last",
-                          placeholder: !_ctx.selectedUsers.length ? _ctx.placeholder : "",
+                          autofocus: "",
+                          class: "search-input input-last",
+                          placeholder: !selectedUsers.value.length ? computedPlaceholder.value : "",
                           onFocus: handleInputFocus,
                           onInput: handleInput,
                           onKeydown: handleKeyDown,
-                          onPaste: handlePaste
-                        }, null, 40, _hoisted_2$1)), [
+                          onPaste
+                        }, null, 40, _hoisted_1)), [
                           [vue.vModelText, vue.unref(searchQuery)]
                         ]) : vue.createCommentVNode("v-if", true),
                         vue.createCommentVNode(' "我"标签 '),
                         vue.createVNode(MeTag, {
                           "current-user-id": _ctx.currentUserId,
-                          "is-disabled": !!_ctx.currentUserId && _ctx.selectedUsers.some((user) => user.id === _ctx.currentUserId),
+                          "is-disabled": isMeTagDisabled.value,
                           onClick: addCurrentUser
                         }, null, 8, ["current-user-id", "is-disabled"])
                       ],
@@ -4059,580 +4333,102 @@
                   ],
                   512
                   /* NEED_PATCH */
-                )) : (vue.openBlock(), vue.createElementBlock(
-                  vue.Fragment,
-                  { key: 1 },
+                ), [
+                  [vue.vShow, isFocused.value]
+                ]),
+                vue.createCommentVNode(" 未聚焦状态 - 只读展示模式 "),
+                vue.withDirectives(vue.createElementVNode(
+                  "div",
+                  {
+                    ref_key: "collapsedContainerRef",
+                    ref: collapsedContainerRef,
+                    class: "tags-container tags-container-collapsed",
+                    onClick: vue.withModifiers(handleFocus, ["stop"])
+                  },
                   [
-                    vue.createCommentVNode(" 未聚焦状态 - 只读展示模式 "),
-                    vue.createElementVNode(
-                      "div",
-                      {
-                        ref_key: "collapsedContainerRef",
-                        ref: collapsedContainerRef,
-                        class: "tags-container collapsed",
-                        onClick: vue.withModifiers(handleFocus, ["stop"])
-                      },
-                      [
-                        (vue.openBlock(true), vue.createElementBlock(
-                          vue.Fragment,
-                          null,
-                          vue.renderList(visibleUsers.value, (user) => {
-                            return vue.openBlock(), vue.createBlock(UserTag, {
-                              key: user.id,
-                              "current-tenant-id": _ctx.tenantId,
-                              "render-tag": _ctx.renderTag,
-                              "show-tenant": true,
-                              tenants: _ctx.tenants,
-                              user,
-                              onClick: handleFocus,
-                              onClose: ($event) => removeUser(user)
-                            }, null, 8, ["current-tenant-id", "render-tag", "tenants", "user", "onClose"]);
-                          }),
-                          128
-                          /* KEYED_FRAGMENT */
-                        )),
-                        vue.createCommentVNode(" 显示折叠标签数量 "),
-                        hiddenCount.value > 0 ? (vue.openBlock(), vue.createBlock(vue.unref(bkuiVue.Popover), {
-                          key: 0,
-                          placement: "top"
-                        }, {
-                          content: vue.withCtx(() => [
-                            vue.createElementVNode("div", _hoisted_3, [
-                              (vue.openBlock(true), vue.createElementBlock(
-                                vue.Fragment,
-                                null,
-                                vue.renderList(_ctx.selectedUsers.slice(visibleUsers.value.length), (user) => {
-                                  return vue.openBlock(), vue.createBlock(vue.unref(UserRender), {
-                                    key: user.id,
-                                    "tenant-id": _ctx.tenantId,
-                                    tenants: _ctx.tenants,
-                                    user
-                                  }, null, 8, ["tenant-id", "tenants", "user"]);
-                                }),
-                                128
-                                /* KEYED_FRAGMENT */
-                              ))
-                            ])
-                          ]),
+                    (vue.openBlock(true), vue.createElementBlock(
+                      vue.Fragment,
+                      null,
+                      vue.renderList(visibleUsers.value, (user) => {
+                        return vue.openBlock(), vue.createBlock(UserTag, vue.mergeProps({
+                          key: user.id,
+                          ref_for: true
+                        }, userTagCommonProps.value, {
+                          "show-tenant": true,
+                          user,
+                          onClick: handleFocus,
+                          onClose: ($event) => removeUser(user)
+                        }), null, 16, ["user", "onClose"]);
+                      }),
+                      128
+                      /* KEYED_FRAGMENT */
+                    )),
+                    vue.createCommentVNode(" 显示折叠标签数量 "),
+                    hiddenCount.value > 0 ? (vue.openBlock(), vue.createBlock(vue.unref(bkuiVue.Popover), {
+                      key: 0,
+                      placement: "top"
+                    }, {
+                      content: vue.withCtx(() => [
+                        vue.createElementVNode("div", _hoisted_2, [
+                          (vue.openBlock(true), vue.createElementBlock(
+                            vue.Fragment,
+                            null,
+                            vue.renderList(selectedUsers.value.slice(visibleUsers.value.length), (user) => {
+                              return vue.openBlock(), vue.createBlock(vue.unref(UserRender), {
+                                key: user.id,
+                                "avatar-base-url": _ctx.avatarBaseUrl,
+                                "has-avatar": _ctx.hasAvatar,
+                                "tenant-id": _ctx.tenantId,
+                                tenants: vue.unref(tenants),
+                                user
+                              }, null, 8, ["avatar-base-url", "has-avatar", "tenant-id", "tenants", "user"]);
+                            }),
+                            128
+                            /* KEYED_FRAGMENT */
+                          ))
+                        ])
+                      ]),
+                      default: vue.withCtx(() => [
+                        vue.createVNode(vue.unref(bkuiVue.Tag), null, {
                           default: vue.withCtx(() => [
-                            vue.createVNode(vue.unref(bkuiVue.Tag), null, {
-                              default: vue.withCtx(() => [
-                                vue.createTextVNode(
-                                  " +" + vue.toDisplayString(hiddenCount.value),
-                                  1
-                                  /* TEXT */
-                                )
-                              ]),
-                              _: 1
-                              /* STABLE */
-                            })
+                            vue.createTextVNode(
+                              " +" + vue.toDisplayString(hiddenCount.value),
+                              1
+                              /* TEXT */
+                            )
                           ]),
                           _: 1
                           /* STABLE */
-                        })) : vue.createCommentVNode("v-if", true),
-                        vue.createCommentVNode(" 搜索输入框 "),
-                        vue.withDirectives(vue.createElementVNode("input", {
-                          ref_key: "collapsedInputRef",
-                          ref: collapsedInputRef,
-                          "onUpdate:modelValue": _cache[2] || (_cache[2] = ($event) => vue.isRef(searchQuery) ? searchQuery.value = $event : null),
-                          class: "search-input collapsed",
-                          placeholder: !_ctx.selectedUsers.length ? _ctx.placeholder : "",
-                          onFocus: handleFocus
-                        }, null, 40, _hoisted_4), [
-                          [vue.vModelText, vue.unref(searchQuery)]
-                        ]),
-                        vue.createCommentVNode(' 未聚焦状态下的"我"标签 '),
-                        vue.createVNode(MeTag, {
-                          "current-user-id": _ctx.currentUserId,
-                          "is-disabled": !!_ctx.currentUserId && _ctx.selectedUsers.some((user) => user[props.exactSearchKey] === _ctx.currentUserId),
-                          onClick: addCurrentUser
-                        }, null, 8, ["current-user-id", "is-disabled"])
-                      ],
-                      512
-                      /* NEED_PATCH */
-                    )
+                        })
+                      ]),
+                      _: 1
+                      /* STABLE */
+                    })) : vue.createCommentVNode("v-if", true),
+                    vue.createCommentVNode(" 搜索输入框 "),
+                    vue.withDirectives(vue.createElementVNode("input", {
+                      "onUpdate:modelValue": _cache[2] || (_cache[2] = ($event) => vue.isRef(searchQuery) ? searchQuery.value = $event : null),
+                      class: "search-input search-input-collapsed",
+                      placeholder: !selectedUsers.value.length ? computedPlaceholder.value : "",
+                      onFocus: handleFocus
+                    }, null, 40, _hoisted_3), [
+                      [vue.vModelText, vue.unref(searchQuery)]
+                    ]),
+                    vue.createCommentVNode(' 未聚焦状态下的"我"标签 '),
+                    vue.createVNode(MeTag, {
+                      "current-user-id": _ctx.currentUserId,
+                      "is-disabled": isMeTagDisabled.value,
+                      onClick: addCurrentUser
+                    }, null, 8, ["current-user-id", "is-disabled"])
                   ],
-                  2112
-                  /* STABLE_FRAGMENT, DEV_ROOT_FRAGMENT */
-                ))
-              ]),
-              _: 1
-              /* STABLE */
-            }, 8, ["container-width", "cross-axis-offset", "empty-text", "is-show", "loading", "options", "render-list-item", "search-query", "tenant-id", "tenants", "user-group", "user-group-name"])
-          ],
-          2
-          /* CLASS */
-        );
-      };
-    }
-  });
-  const MultipleSelector = /* @__PURE__ */ _export_sfc(_sfc_main$2, [["__scopeId", "data-v-2a532f24"]]);
-  const _hoisted_1 = { class: "input-container" };
-  const _hoisted_2 = ["placeholder"];
-  const _sfc_main$1 = /* @__PURE__ */ vue.defineComponent({
-    ...{
-      name: "BkUserSelectorSingle"
-    },
-    __name: "single-selector",
-    props: {
-      modelValue: { default: "" },
-      tenants: {},
-      allowCreate: { type: Boolean },
-      apiBaseUrl: { default: "" },
-      currentUserId: { default: "" },
-      disabled: { type: Boolean },
-      emptyText: { default: "" },
-      enableMultiTenantMode: { type: Boolean },
-      exactSearchKey: { default: "bk_username" },
-      excludeUserIds: { default: () => [] },
-      freePaste: { type: Boolean },
-      placeholder: { default: "" },
-      tenantId: { default: "" },
-      userGroupName: { default: "" },
-      renderListItem: {},
-      renderTag: {},
-      userGroup: { default: () => [] }
-    },
-    emits: ["update:modelValue", "change", "focus", "blur"],
-    setup(__props, { emit: __emit }) {
-      const props = __props;
-      const emit = __emit;
-      const containerRef = vue.ref(null);
-      const inputRef = vue.ref(null);
-      const options = vue.ref([]);
-      const isLoading = vue.ref(false);
-      const selectedUser = vue.ref(props.modelValue || "");
-      const searchQuery = vue.ref("");
-      const showDropdown = vue.ref(false);
-      const userGroupFilter = vue.computed(() => {
-        return props.userGroup.filter((group) => {
-          var _a, _b;
-          const filtered = group.id !== selectedUser.value && !group.hidden;
-          if (filtered) {
-            return ((_a = group.id) == null ? void 0 : _a.includes(searchQuery.value)) || ((_b = group.name) == null ? void 0 : _b.includes(searchQuery.value));
-          }
-          return false;
-        });
-      });
-      const selectedUserInfo = vue.computed(() => {
-        const userGroup = (props.userGroup || []).map((group) => ({
-          ...group,
-          tenantId: "",
-          type: "userGroup"
-        }));
-        const list = [...options.value, ...userGroup];
-        const selectedUserInfo2 = list.find((user) => user.id === selectedUser.value);
-        emit("change", selectedUserInfo2 || null);
-        return selectedUserInfo2;
-      });
-      const initSelectedUser = async () => {
-        if (typeof props.modelValue === "string" && props.modelValue) {
-          try {
-            isLoading.value = true;
-            const result = await lookupUsers({
-              apiBaseUrl: props.apiBaseUrl,
-              tenantId: props.tenantId,
-              exactSearchKey: props.exactSearchKey,
-              usersList: [props.modelValue],
-              enableMultiTenantMode: props.enableMultiTenantMode
-            });
-            options.value = formatUsers(result, props.enableMultiTenantMode).filter(
-              (user) => !props.excludeUserIds.includes(user.id)
-            );
-            if (props.userGroup.length > 0) {
-              const groupResult = props.userGroup.filter((group) => group.id == props.modelValue);
-              options.value = groupResult.map((group) => ({
-                ...group,
-                tenantId: "",
-                type: "userGroup"
-              }));
-            }
-            if (props.allowCreate && options.value.length === 0) {
-              options.value.push({
-                id: props.modelValue,
-                name: props.modelValue,
-                type: "custom",
-                tenantId: ""
-              });
-            }
-          } catch (error) {
-            console.error("获取用户信息失败:", error);
-          } finally {
-            isLoading.value = false;
-          }
-        } else {
-          options.value = [];
-        }
-      };
-      vue.onBeforeMount(async () => {
-        initSelectedUser();
-      });
-      const addCurrentUser = async () => {
-        if (!props.currentUserId || selectedUser.value === props.currentUserId) return;
-        try {
-          const result = await lookupUsers({
-            apiBaseUrl: props.apiBaseUrl,
-            tenantId: props.tenantId,
-            exactSearchKey: props.exactSearchKey,
-            usersList: [props.currentUserId],
-            enableMultiTenantMode: props.enableMultiTenantMode
-          });
-          const formattedResults = formatUsers(result, props.enableMultiTenantMode);
-          if (formattedResults.length > 0) {
-            options.value = formattedResults.filter((user) => !props.excludeUserIds.includes(user.id));
-            addUser(formattedResults[0]);
-          }
-        } catch (error) {
-          console.error("获取当前用户信息失败:", error);
-        }
-      };
-      const fetchUsers = async (keyword = "") => {
-        if (!(keyword == null ? void 0 : keyword.length)) {
-          options.value = [];
-          isLoading.value = false;
-          return;
-        }
-        isLoading.value = true;
-        try {
-          const result = await searchUsers({
-            apiBaseUrl: props.apiBaseUrl,
-            tenantId: props.tenantId,
-            keyword,
-            enableMultiTenantMode: props.enableMultiTenantMode
-          });
-          options.value = formatUsers(result, props.enableMultiTenantMode).filter((user) => !selectedUser.value || user.id !== selectedUser.value).filter((user) => !props.excludeUserIds.includes(user.id));
-        } catch (error) {
-          console.error("获取用户列表失败:", error);
-          options.value = [];
-        } finally {
-          isLoading.value = false;
-        }
-      };
-      const handleKeyDown = (event) => {
-        if (event.key === "Enter") {
-          if (props.allowCreate) {
-            const customUser = {
-              id: searchQuery.value,
-              name: searchQuery.value,
-              tenantId: "",
-              type: "custom"
-            };
-            options.value.push(customUser);
-            addUser(customUser);
-          }
-        }
-      };
-      const handlePaste = (event) => {
-        var _a;
-        event.preventDefault();
-        const pastedText = ((_a = event.clipboardData) == null ? void 0 : _a.getData("text").trim()) || "";
-        if (props.freePaste) {
-          const customUser = { id: pastedText, name: pastedText, type: "custom", tenantId: "", login_name: pastedText };
-          if (!options.value.some((item) => item.login_name === customUser.login_name)) {
-            options.value.push(customUser);
-          }
-          addUser(customUser);
-        }
-      };
-      const addUser = (user) => {
-        selectedUser.value = user.id;
-        searchQuery.value = "";
-        showDropdown.value = false;
-      };
-      const removeSelectedUser = () => {
-        selectedUser.value = "";
-        searchQuery.value = "";
-      };
-      const handleInputFocus = () => {
-        if (searchQuery.value.length >= 1 || Array.isArray(props.userGroup) && props.userGroup.length > 0) {
-          showDropdown.value = true;
-        }
-        emit("focus");
-      };
-      let timer = null;
-      const handleInput = () => {
-        showDropdown.value = searchQuery.value.length >= 1;
-        isLoading.value = true;
-        clearTimeout(timer);
-        timer = setTimeout(() => {
-          fetchUsers(searchQuery.value);
-        }, 300);
-      };
-      const handleClickOutside = () => {
-        setTimeout(() => {
-          showDropdown.value = false;
-        }, 0);
-      };
-      vue.watch(
-        () => props.modelValue,
-        (newVal) => {
-          selectedUser.value = newVal;
-        }
-      );
-      vue.watch(selectedUser, (newVal) => {
-        emit("update:modelValue", newVal);
-      });
-      return (_ctx, _cache) => {
-        return vue.withDirectives((vue.openBlock(), vue.createElementBlock(
-          "div",
-          {
-            ref_key: "containerRef",
-            ref: containerRef,
-            class: vue.normalizeClass(["single-selector", { "is-disabled": _ctx.disabled }])
-          },
-          [
-            vue.createCommentVNode(" 使用新的公共下拉选项组件 "),
-            vue.createVNode(SelectionPopover, {
-              "container-width": containerRef.value ? containerRef.value.offsetWidth : "auto",
-              "empty-text": _ctx.emptyText,
-              "is-show": showDropdown.value,
-              loading: isLoading.value,
-              options: options.value,
-              "render-list-item": _ctx.renderListItem,
-              "search-query": searchQuery.value,
-              "tenant-id": _ctx.tenantId,
-              tenants: _ctx.tenants,
-              "user-group": userGroupFilter.value,
-              "user-group-name": _ctx.userGroupName,
-              onSelectUser: addUser
-            }, {
-              default: vue.withCtx(() => [
-                vue.createCommentVNode(" 输入框 "),
-                vue.createElementVNode("div", _hoisted_1, [
-                  vue.createCommentVNode(" 用户标签显示 "),
-                  selectedUserInfo.value ? (vue.openBlock(), vue.createElementBlock("div", {
-                    key: 0,
-                    onClick: vue.withModifiers(removeSelectedUser, ["stop"])
-                  }, [
-                    vue.createVNode(UserTag, {
-                      "current-tenant-id": _ctx.tenantId,
-                      "render-tag": _ctx.renderTag,
-                      tenants: _ctx.tenants,
-                      user: selectedUserInfo.value,
-                      onClose: removeSelectedUser
-                    }, null, 8, ["current-tenant-id", "render-tag", "tenants", "user"])
-                  ])) : vue.createCommentVNode("v-if", true),
-                  vue.withDirectives(vue.createElementVNode("input", {
-                    ref_key: "inputRef",
-                    ref: inputRef,
-                    "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => searchQuery.value = $event),
-                    class: "search-input",
-                    placeholder: selectedUserInfo.value ? "" : _ctx.placeholder,
-                    onBlur: _cache[1] || (_cache[1] = ($event) => emit("blur")),
-                    onFocus: handleInputFocus,
-                    onInput: handleInput,
-                    onKeydown: handleKeyDown,
-                    onPaste: handlePaste
-                  }, null, 40, _hoisted_2), [
-                    [vue.vModelText, searchQuery.value]
-                  ]),
-                  vue.createCommentVNode(' "我"标签 '),
-                  vue.createVNode(MeTag, {
-                    "current-user-id": _ctx.currentUserId,
-                    "is-disabled": !!_ctx.currentUserId && !!selectedUserInfo.value && selectedUserInfo.value[_ctx.exactSearchKey] === _ctx.currentUserId,
-                    onClick: addCurrentUser
-                  }, null, 8, ["current-user-id", "is-disabled"])
+                  512
+                  /* NEED_PATCH */
+                ), [
+                  [vue.vShow, !isFocused.value]
                 ])
               ]),
               _: 1
               /* STABLE */
-            }, 8, ["container-width", "empty-text", "is-show", "loading", "options", "render-list-item", "search-query", "tenant-id", "tenants", "user-group", "user-group-name"])
-          ],
-          2
-          /* CLASS */
-        )), [
-          [vue.unref(bkuiVue.clickoutside), handleClickOutside]
-        ]);
-      };
-    }
-  });
-  const SingleSelector = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["__scopeId", "data-v-cbe352a6"]]);
-  const _sfc_main = /* @__PURE__ */ vue.defineComponent({
-    ...{
-      name: "BkUserSelector"
-    },
-    __name: "user-selector",
-    props: {
-      draggable: { type: Boolean, default: false },
-      modelValue: { default: "" },
-      multiple: { type: Boolean, default: false },
-      allowCreate: { type: Boolean, default: false },
-      apiBaseUrl: { default: "" },
-      currentUserId: { default: "" },
-      disabled: { type: Boolean, default: false },
-      emptyText: { default: "" },
-      enableMultiTenantMode: { type: Boolean, default: true },
-      exactSearchKey: { default: "bk_username" },
-      excludeUserIds: { default: () => [] },
-      freePaste: { type: Boolean, default: false },
-      placeholder: { default: "" },
-      tenantId: { default: "" },
-      userGroupName: { default: "" },
-      renderListItem: {},
-      renderTag: {},
-      userGroup: { default: () => [] }
-    },
-    emits: ["update:modelValue", "change", "dragStart", "dragEnd", "focus", "blur"],
-    setup(__props, { emit: __emit }) {
-      const { t } = useI18n();
-      bkuiVue.provideGlobalConfig({
-        prefix: "bk"
-      });
-      const props = __props;
-      const emit = __emit;
-      const { tenants = {} } = useTenantData(props.apiBaseUrl, props.tenantId, props.enableMultiTenantMode);
-      const selectedUsers = vue.ref([]);
-      const selectedUser = vue.ref(props.multiple ? "" : props.modelValue);
-      const selectedUserIds = vue.computed(() => {
-        return props.multiple ? selectedUsers.value.map((user) => user.id) : [];
-      });
-      const placeholder = vue.computed(() => props.placeholder || t("请输入人员名称搜索"));
-      const userGroupName = vue.computed(() => props.userGroupName || t("用户群组"));
-      const emptyText = vue.computed(() => props.emptyText || t("无匹配人员"));
-      const initSelectedUsers = async () => {
-        if (props.multiple) {
-          const ids = Array.isArray(props.modelValue) ? props.modelValue : [];
-          let userGroupSelected = [];
-          if (props.userGroup.length > 0) {
-            const result = props.userGroup.filter((group) => ids.includes(group.id));
-            userGroupSelected = result.map((group) => ({
-              ...group,
-              tenantId: "",
-              type: "userGroup"
-            }));
-          }
-          if (ids.length > 0) {
-            try {
-              const result = await lookupUsers({
-                apiBaseUrl: props.apiBaseUrl,
-                tenantId: props.tenantId,
-                exactSearchKey: "bk_username",
-                usersList: ids,
-                enableMultiTenantMode: props.enableMultiTenantMode
-              });
-              const selectedList = [...userGroupSelected, ...formatUsers(result, props.enableMultiTenantMode)];
-              if (props.allowCreate) {
-                selectedList.push(
-                  ...ids.filter((id) => !selectedList.some((user) => user.id === id)).map((id) => ({ id, name: id, type: "custom", tenantId: "" }))
-                );
-              }
-              selectedUsers.value = ids.map((id) => selectedList.find((user) => user.id === id)).filter(Boolean);
-            } catch (error) {
-              console.error("获取选中用户信息失败:", error);
-            }
-          } else {
-            selectedUsers.value = [];
-          }
-        } else {
-          selectedUser.value = props.modelValue;
-        }
-      };
-      const handleUpdateUser = (user) => {
-        emit("change", user);
-      };
-      const handleUpdateSelectedUsers = (users) => {
-        selectedUsers.value = users;
-        emit(
-          "update:modelValue",
-          users.map((user) => user.id)
-        );
-        emit("change", users);
-      };
-      const handleFocus = () => {
-        emit("focus");
-      };
-      const handleBlur = () => {
-        emit("blur");
-      };
-      vue.watch(selectedUser, (newVal) => {
-        if (!props.multiple) {
-          emit("update:modelValue", newVal);
-        }
-      });
-      vue.watch(
-        () => props.userGroup,
-        () => {
-          initSelectedUsers();
-        }
-      );
-      vue.watch(
-        () => props.modelValue,
-        () => {
-          initSelectedUsers();
-        },
-        { deep: true }
-      );
-      vue.onBeforeMount(() => {
-        initSelectedUsers();
-      });
-      return (_ctx, _cache) => {
-        return vue.openBlock(), vue.createElementBlock(
-          "section",
-          {
-            ref: "containerRef",
-            class: vue.normalizeClass(["bk-user-selector", { "is-disabled": _ctx.disabled }])
-          },
-          [
-            vue.createCommentVNode(" 单选模式 "),
-            !_ctx.multiple ? (vue.openBlock(), vue.createBlock(SingleSelector, {
-              key: 0,
-              modelValue: selectedUser.value,
-              "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => selectedUser.value = $event),
-              "allow-create": _ctx.allowCreate,
-              "api-base-url": _ctx.apiBaseUrl,
-              "current-user-id": _ctx.currentUserId,
-              disabled: _ctx.disabled,
-              "empty-text": emptyText.value,
-              "enable-multi-tenant-mode": _ctx.enableMultiTenantMode,
-              "exact-search-key": _ctx.exactSearchKey,
-              "exclude-user-ids": _ctx.excludeUserIds,
-              placeholder: placeholder.value,
-              "render-list-item": _ctx.renderListItem,
-              "render-tag": _ctx.renderTag,
-              "tenant-id": _ctx.tenantId,
-              tenants: vue.unref(tenants),
-              "user-group": _ctx.userGroup,
-              "user-group-name": userGroupName.value,
-              "free-paste": _ctx.freePaste,
-              onBlur: handleBlur,
-              onChange: handleUpdateUser,
-              onFocus: handleFocus
-            }, null, 8, ["modelValue", "allow-create", "api-base-url", "current-user-id", "disabled", "empty-text", "enable-multi-tenant-mode", "exact-search-key", "exclude-user-ids", "placeholder", "render-list-item", "render-tag", "tenant-id", "tenants", "user-group", "user-group-name", "free-paste"])) : (vue.openBlock(), vue.createElementBlock(
-              vue.Fragment,
-              { key: 1 },
-              [
-                vue.createCommentVNode(" 多选模式 "),
-                vue.createVNode(MultipleSelector, {
-                  modelValue: selectedUserIds.value,
-                  "onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => selectedUserIds.value = $event),
-                  "allow-create": _ctx.allowCreate,
-                  "api-base-url": _ctx.apiBaseUrl,
-                  "current-user-id": _ctx.currentUserId,
-                  disabled: _ctx.disabled,
-                  draggable: _ctx.draggable,
-                  "empty-text": emptyText.value,
-                  "enable-multi-tenant-mode": _ctx.enableMultiTenantMode,
-                  "exact-search-key": _ctx.exactSearchKey,
-                  "exclude-user-ids": _ctx.excludeUserIds,
-                  placeholder: placeholder.value,
-                  "render-list-item": _ctx.renderListItem,
-                  "render-tag": _ctx.renderTag,
-                  "selected-users": selectedUsers.value,
-                  "tenant-id": _ctx.tenantId,
-                  tenants: vue.unref(tenants),
-                  "user-group": _ctx.userGroup,
-                  "user-group-name": userGroupName.value,
-                  "free-paste": _ctx.freePaste,
-                  onBlur: handleBlur,
-                  onDragEnd: _cache[2] || (_cache[2] = ($event) => _ctx.$emit("dragEnd", $event)),
-                  onDragStart: _cache[3] || (_cache[3] = ($event) => _ctx.$emit("dragStart", $event)),
-                  onFocus: handleFocus,
-                  "onUpdate:selectedUsers": handleUpdateSelectedUsers
-                }, null, 8, ["modelValue", "allow-create", "api-base-url", "current-user-id", "disabled", "draggable", "empty-text", "enable-multi-tenant-mode", "exact-search-key", "exclude-user-ids", "placeholder", "render-list-item", "render-tag", "selected-users", "tenant-id", "tenants", "user-group", "user-group-name", "free-paste"])
-              ],
-              2112
-              /* STABLE_FRAGMENT, DEV_ROOT_FRAGMENT */
-            ))
+            }, 8, ["avatar-base-url", "container-width", "empty-text", "has-avatar", "is-show", "loading", "options", "render-list-item", "search-query", "tenant-id", "tenants", "user-group", "user-group-name"])
           ],
           2
           /* CLASS */
@@ -4640,7 +4436,7 @@
       };
     }
   });
-  const BkUserSelector = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-9c628c83"]]);
+  const BkUserSelector = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-9975c7e1"]]);
   exports2.BkUserSelector = BkUserSelector;
   exports2.default = BkUserSelector;
   Object.defineProperties(exports2, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });