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

package/vue3/index.es.min.js

@@ -1,586 +1,225 @@
-import { unref, ref, onBeforeMount, defineComponent, openBlock, createElementBlock, normalizeClass, withModifiers, toDisplayString, createCommentVNode, h, computed, createBlock, withCtx, createVNode, createElementVNode, Fragment, renderList, renderSlot, watch, nextTick, onMounted, withDirectives, isRef, vModelText, createTextVNode } from "vue";
-import { Popover, Loading, Tag, clickoutside, provideGlobalConfig } from "bkui-vue";
-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 = 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);
+import { unref, ref, watch, onUnmounted, onBeforeMount, computed, defineComponent, openBlock, createElementBlock, normalizeClass, withModifiers, toDisplayString, createCommentVNode, h, createBlock, withCtx, createElementVNode, createVNode, Fragment, renderList, renderSlot, toRef, nextTick, onMounted, withDirectives, mergeProps, isRef, normalizeStyle, vModelText, vShow, createTextVNode } from "vue";
+import { Popover, Loading, Tag, provideGlobalConfig } from "bkui-vue";
+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(module, exports) {
+  (function(global2, factory) {
+    module.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 = ref({});
-  const loading = 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;
+      }
     }
-  };
-  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(module, exports) {
-  (function(global2, factory) {
-    module.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 = "";
@@ -3119,15 +2758,583 @@ var Sortable$1 = { exports: {} };
         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 = 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 = 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 = 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);
+    }
+  };
+  watch(target, observe, { immediate: true });
+  onUnmounted(cleanup);
+  return cleanup;
+};
+const useTenantData = (apiBaseUrl, tenantId, enableMultiTenantMode = true) => {
+  const tenants = ref({});
+  const loading = 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;
+    }
+  };
+  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) {
@@ -3166,10 +3373,12 @@ const useUserSearch = (apiBaseUrl, tenantId, enableMultiTenantMode = true) => {
   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;
@@ -3188,14 +3397,16 @@ const useUserSearch = (apiBaseUrl, tenantId, enableMultiTenantMode = true) => {
       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,
@@ -3206,26 +3417,57 @@ const useUserSearch = (apiBaseUrl, tenantId, enableMultiTenantMode = true) => {
     clearSearch
   };
 };
-const _sfc_main$5 = /* @__PURE__ */ 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 = 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__ */ 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 }) {
@@ -3237,11 +3479,11 @@ const _sfc_main$5 = /* @__PURE__ */ defineComponent({
       emit("click");
     };
     return (_ctx, _cache) => {
-      return __props.currentUserId ? (openBlock(), createElementBlock(
+      return _ctx.currentUserId ? (openBlock(), createElementBlock(
         "div",
         {
           key: 0,
-          class: normalizeClass(["me-tag", { disabled: __props.isDisabled }]),
+          class: normalizeClass(["me-tag", { disabled: _ctx.isDisabled }]),
           onClick: withModifiers(handleClick, ["stop"])
         },
         toDisplayString(unref(t)("我")),
@@ -3258,7 +3500,10 @@ const _export_sfc = (sfc, props) => {
   }
   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 = defineComponent({
   name: "UserRender",
   props: {
@@ -3277,23 +3522,63 @@ const UserRender = defineComponent({
     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 {
@@ -3305,106 +3590,38 @@ const UserRender = defineComponent({
     };
   }
 });
-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__ */ defineComponent({
+const _hoisted_4 = ["onClick"];
+const _sfc_main$2 = /* @__PURE__ */ 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 = ref(null);
+    const contentContainerRef = ref(null);
     const props = __props;
     const emit = __emit;
     const groupedUsers = computed(() => {
@@ -3413,11 +3630,11 @@ const _sfc_main$4 = /* @__PURE__ */ defineComponent({
         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] = [];
         }
@@ -3429,114 +3646,150 @@ const _sfc_main$4 = /* @__PURE__ */ defineComponent({
       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 openBlock(), createBlock(unref(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: withCtx(() => [
-          createVNode(unref(Loading), {
-            class: "dropdown-content",
-            loading: __props.loading,
-            mode: "spin",
-            size: "mini"
-          }, {
-            default: withCtx(() => [
-              __props.options.length === 0 && __props.userGroup.length === 0 ? (openBlock(), createElementBlock("div", _hoisted_1$2, [
-                createElementVNode(
-                  "span",
-                  null,
-                  toDisplayString(__props.emptyText),
-                  1
-                  /* TEXT */
-                )
-              ])) : (openBlock(true), createElementBlock(
-                Fragment,
-                { key: 1 },
-                renderList(groupedUsers.value, (group, groupName) => {
-                  return openBlock(), createElementBlock("div", {
-                    key: groupName,
-                    class: "user-group"
-                  }, [
-                    Object.keys(groupedUsers.value).length > 1 || group.some((user) => user.type === "userGroup") ? (openBlock(), createElementBlock("div", {
-                      key: 0,
-                      class: "group-header",
-                      onClick: _cache[0] || (_cache[0] = withModifiers(() => {
-                      }, ["prevent"]))
-                    }, [
-                      createElementVNode(
-                        "span",
-                        _hoisted_2$2,
-                        toDisplayString(groupName),
-                        1
-                        /* TEXT */
-                      ),
-                      createElementVNode(
-                        "span",
-                        _hoisted_3$1,
-                        "(" + toDisplayString(group.length) + ")",
-                        1
-                        /* TEXT */
-                      )
-                    ])) : createCommentVNode("v-if", true),
-                    (openBlock(true), createElementBlock(
-                      Fragment,
+          createElementVNode(
+            "div",
+            {
+              ref_key: "contentContainerRef",
+              ref: contentContainerRef
+            },
+            [
+              createVNode(unref(Loading), {
+                class: "dropdown-content",
+                loading: _ctx.loading,
+                mode: "spin",
+                size: "mini"
+              }, {
+                default: withCtx(() => [
+                  _ctx.options.length === 0 && _ctx.userGroup.length === 0 ? (openBlock(), createElementBlock("div", _hoisted_1$1, [
+                    createElementVNode(
+                      "span",
                       null,
-                      renderList(group, (user) => {
-                        return openBlock(), createElementBlock("div", {
-                          key: user.id,
-                          class: "user-option",
-                          onClick: withModifiers(($event) => selectUser(user), ["prevent"])
+                      toDisplayString(_ctx.emptyText),
+                      1
+                      /* TEXT */
+                    )
+                  ])) : (openBlock(true), createElementBlock(
+                    Fragment,
+                    { key: 1 },
+                    renderList(groupedUsers.value, (group, groupName) => {
+                      return openBlock(), createElementBlock("div", {
+                        key: groupName,
+                        class: "user-group"
+                      }, [
+                        Object.keys(groupedUsers.value).length > 1 || group.some((user) => user.type === "userGroup") ? (openBlock(), createElementBlock("div", {
+                          key: 0,
+                          class: "group-header",
+                          onClick: _cache[0] || (_cache[0] = withModifiers(() => {
+                          }, ["prevent"]))
                         }, [
-                          createVNode(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"])
+                          createElementVNode(
+                            "span",
+                            _hoisted_2$1,
+                            toDisplayString(groupName),
+                            1
+                            /* TEXT */
+                          ),
+                          createElementVNode(
+                            "span",
+                            _hoisted_3$1,
+                            "(" + toDisplayString(group.length) + ")",
+                            1
+                            /* TEXT */
+                          )
+                        ])) : createCommentVNode("v-if", true),
+                        (openBlock(true), createElementBlock(
+                          Fragment,
+                          null,
+                          renderList(group, (user) => {
+                            return openBlock(), createElementBlock("div", {
+                              key: user.id,
+                              class: "user-option",
+                              onClick: withModifiers(($event) => selectUser(user), ["prevent"]),
+                              onMousedown: _cache[1] || (_cache[1] = withModifiers(() => {
+                              }, ["prevent"]))
+                            }, [
+                              createVNode(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: withCtx(() => [
-          renderSlot(_ctx.$slots, "default", {}, void 0, true)
+          createElementVNode(
+            "div",
+            {
+              ref_key: "slotContainerRef",
+              ref: slotContainerRef
+            },
+            [
+              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__ */ defineComponent({
+const SelectionPopover = /* @__PURE__ */ _export_sfc(_sfc_main$2, [["__scopeId", "data-v-d5a338f0"]]);
+const _sfc_main$1 = /* @__PURE__ */ 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: {},
@@ -3561,11 +3814,13 @@ const _sfc_main$3 = /* @__PURE__ */ defineComponent({
       }, {
         default: withCtx(() => [
           createVNode(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 */
@@ -3573,84 +3828,176 @@ const _sfc_main$3 = /* @__PURE__ */ defineComponent({
     };
   }
 });
-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__ */ 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__ */ 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();
+    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 = ref(null);
-    const tagsContainerRef = ref(null);
     const sortableContainerRef = ref(null);
     const collapsedContainerRef = ref(null);
     const inlineInputRef = ref(null);
     const lastInputRef = ref(null);
-    const collapsedInputRef = ref(null);
     const isFocused = ref(false);
-    const showDropdown = ref(false);
     const activeTagIndex = ref(-1);
     const sortableInstance = ref(null);
     const visibleUsers = ref([]);
     const hiddenCount = ref(0);
-    const options = computed(() => {
-      return searchResults.value.filter((user) => !props.selectedUsers.some((selectedUser) => selectedUser.id === user.id)).filter((user) => !props.excludeUserIds.includes(user.id));
+    const selectedUsers = ref([]);
+    const showDropdown = computed(() => {
+      return isFocused.value && (props.userGroup.length > 0 || searchQuery.value.trim() !== "");
     });
-    const userGroupFilter = 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 = computed(() => {
+      if (props.multiple) {
+        return Array.isArray(props.modelValue) ? props.modelValue : [];
+      }
+      return props.modelValue ? [props.modelValue] : [];
+    });
+    const computedPlaceholder = computed(() => props.placeholder || t("请输入人员名称搜索"));
+    const computedUserGroupName = computed(() => props.userGroupName || t("用户群组"));
+    const computedEmptyText = computed(() => props.emptyText || t("无匹配人员"));
+    const selectedUserIds = computed(() => selectedUsers.value.map((user) => user.id));
+    const isMaxCountReached = computed(() => {
+      if (!props.maxCount || props.maxCount <= 0) return false;
+      return selectedUsers.value.length >= props.maxCount;
+    });
+    const isMeTagDisabled = computed(
+      () => isMaxCountReached.value || !!props.currentUserId && selectedUsers.value.some((user) => user[props.exactSearchKey] === props.currentUserId)
+    );
+    const userTagCommonProps = computed(() => ({
+      avatarBaseUrl: props.avatarBaseUrl,
+      currentTenantId: props.tenantId,
+      hasAvatar: props.hasAvatar,
+      renderTag: props.renderTag,
+      tenants
+    }));
+    const { filteredUserGroup, filterOptions, createCustomUser } = useUserSelection({
+      selectedUserIds,
+      excludeUserIds: toRef(props, "excludeUserIds"),
+      userGroup: 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 = computed(() => filterOptions(searchResults.value));
+    const inputWidth = 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();
       }
@@ -3663,276 +4010,206 @@ const _sfc_main$2 = /* @__PURE__ */ defineComponent({
         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;
+        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;
       nextTick(() => {
-        if (lastInputRef.value) {
-          lastInputRef.value.focus();
-        }
+        var _a;
+        return (_a = lastInputRef.value) == null ? void 0 : _a.focus();
       });
     };
+    const scheduleVisibleUsersCalculation = () => {
+      if (!isFocused.value) {
+        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 = "";
-      nextTick(() => {
-        calculateVisibleUsers();
-      });
+      clearSearch();
+      scheduleVisibleUsersCalculation();
     };
     const handleContainerClick = () => {
       activeTagIndex.value = -1;
       nextTick(() => {
-        if (lastInputRef.value) {
-          lastInputRef.value.focus();
-        }
+        var _a;
+        return (_a = lastInputRef.value) == null ? void 0 : _a.focus();
       });
     };
     const handleTagClick = (index) => {
       activeTagIndex.value = index;
       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;
+        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;
+      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;
-      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) {
-        nextTick(() => {
-          calculateVisibleUsers();
-        });
+        activeTagIndex.value = updatedUsers.length - 1;
       }
+      scheduleVisibleUsersCalculation();
     };
-    const crossAxisOffset = ref(0);
     watch(
-      () => props.selectedUsers,
+      selectedUsers,
       () => {
-        visibleUsers.value = [...props.selectedUsers];
-        if (!isFocused.value) {
-          nextTick(() => {
-            calculateVisibleUsers();
-          });
-        }
+        scheduleVisibleUsersCalculation();
       },
       { deep: true }
     );
     watch(isFocused, (newVal) => {
       if (newVal) {
-        nextTick(() => {
-          initSortable();
-        });
+        nextTick(() => initSortable());
       }
     });
-    const handleResize = () => {
-      if (!isFocused.value) {
-        calculateVisibleUsers();
+    watch(
+      () => props.userGroup,
+      () => {
+        initSelectedUsers();
       }
-    };
+    );
+    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();
+    });
+    onBeforeMount(() => {
+      initSelectedUsers();
+    });
     onMounted(() => {
       initSortable();
-      calculateVisibleUsers();
-      window.addEventListener("resize", handleResize);
-      nextTick(() => {
-        calculateVisibleUsers();
-      });
+      nextTick(calculateVisibleUsers);
+    });
+    onUnmounted(() => {
+      var _a;
+      (_a = sortableInstance.value) == null ? void 0 : _a.destroy();
     });
     return (_ctx, _cache) => {
       return openBlock(), createElementBlock(
@@ -3940,34 +4217,32 @@ const _sfc_main$2 = /* @__PURE__ */ defineComponent({
         {
           ref_key: "containerRef",
           ref: containerRef,
-          class: normalizeClass(["multiple-selector", { "is-disabled": _ctx.disabled }])
+          class: normalizeClass(["bk-user-selector", { "is-disabled": _ctx.disabled }])
         },
         [
           createCommentVNode(" 下拉选项列表 "),
           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: unref(searchLoading),
-            options: options.value,
+            options: displayOptions.value,
             "render-list-item": _ctx.renderListItem,
             "search-query": unref(searchQuery),
             "tenant-id": _ctx.tenantId,
-            tenants: _ctx.tenants,
-            "user-group": userGroupFilter.value,
-            "user-group-name": _ctx.userGroupName,
+            tenants: unref(tenants),
+            "user-group": unref(filteredUserGroup),
+            "user-group-name": computedUserGroupName.value,
             onClickOutside: handleClickOutside,
             onSelectUser: addUser
           }, {
             default: withCtx(() => [
               createCommentVNode(" 聚焦状态 - 可编辑模式 "),
-              isFocused.value ? (openBlock(), createElementBlock(
+              withDirectives(createElementVNode(
                 "div",
                 {
-                  key: 0,
-                  ref_key: "tagsContainerRef",
-                  ref: tagsContainerRef,
                   class: "tags-container focused",
                   onClick: withModifiers(handleContainerClick, ["stop"])
                 },
@@ -3984,24 +4259,20 @@ const _sfc_main$2 = /* @__PURE__ */ defineComponent({
                       (openBlock(true), createElementBlock(
                         Fragment,
                         null,
-                        renderList(_ctx.selectedUsers, (user, index) => {
+                        renderList(selectedUsers.value, (user, index) => {
                           return openBlock(), createElementBlock("div", {
                             key: user.id,
-                            class: "tag-wrapper",
-                            onClick: withModifiers(($event) => handleTagClick(index), ["stop"])
+                            class: "tag-wrapper"
                           }, [
-                            createVNode(UserTag, {
+                            createVNode(UserTag, 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"]),
                             createCommentVNode(" 在当前激活标签后插入输入框 "),
-                            index === activeTagIndex.value && activeTagIndex.value !== _ctx.selectedUsers.length - 1 ? withDirectives((openBlock(), createElementBlock(
+                            index === activeTagIndex.value && activeTagIndex.value !== selectedUsers.value.length - 1 ? withDirectives((openBlock(), createElementBlock(
                               "input",
                               {
                                 key: 0,
@@ -4009,42 +4280,45 @@ const _sfc_main$2 = /* @__PURE__ */ defineComponent({
                                 ref_key: "inlineInputRef",
                                 ref: inlineInputRef,
                                 "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => isRef(searchQuery) ? searchQuery.value = $event : null),
-                                class: "search-input inline",
+                                autofocus: "",
+                                class: "search-input input-inline",
+                                style: normalizeStyle({ width: inputWidth.value }),
                                 onFocus: handleInputFocus,
                                 onInput: handleInput,
                                 onKeydown: handleKeyDown,
-                                onPaste: handlePaste
+                                onPaste
                               },
                               null,
-                              544
-                              /* NEED_HYDRATION, NEED_PATCH */
+                              36
+                              /* STYLE, NEED_HYDRATION */
                             )), [
                               [vModelText, unref(searchQuery)]
                             ]) : createCommentVNode("v-if", true)
-                          ], 8, _hoisted_1$1);
+                          ]);
                         }),
                         128
                         /* KEYED_FRAGMENT */
                       )),
                       createCommentVNode(" 最后一个输入框 "),
-                      activeTagIndex.value === -1 || activeTagIndex.value === _ctx.selectedUsers.length - 1 ? withDirectives((openBlock(), createElementBlock("input", {
+                      activeTagIndex.value === -1 || activeTagIndex.value === selectedUsers.value.length - 1 ? withDirectives((openBlock(), createElementBlock("input", {
                         key: 0,
                         ref_key: "lastInputRef",
                         ref: lastInputRef,
                         "onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => 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)), [
                         [vModelText, unref(searchQuery)]
                       ]) : createCommentVNode("v-if", true),
                       createCommentVNode(' "我"标签 '),
                       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"])
                     ],
@@ -4054,580 +4328,102 @@ const _sfc_main$2 = /* @__PURE__ */ defineComponent({
                 ],
                 512
                 /* NEED_PATCH */
-              )) : (openBlock(), createElementBlock(
-                Fragment,
-                { key: 1 },
+              ), [
+                [vShow, isFocused.value]
+              ]),
+              createCommentVNode(" 未聚焦状态 - 只读展示模式 "),
+              withDirectives(createElementVNode(
+                "div",
+                {
+                  ref_key: "collapsedContainerRef",
+                  ref: collapsedContainerRef,
+                  class: "tags-container tags-container-collapsed",
+                  onClick: withModifiers(handleFocus, ["stop"])
+                },
                 [
-                  createCommentVNode(" 未聚焦状态 - 只读展示模式 "),
-                  createElementVNode(
-                    "div",
-                    {
-                      ref_key: "collapsedContainerRef",
-                      ref: collapsedContainerRef,
-                      class: "tags-container collapsed",
-                      onClick: withModifiers(handleFocus, ["stop"])
-                    },
-                    [
-                      (openBlock(true), createElementBlock(
-                        Fragment,
-                        null,
-                        renderList(visibleUsers.value, (user) => {
-                          return openBlock(), 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 */
-                      )),
-                      createCommentVNode(" 显示折叠标签数量 "),
-                      hiddenCount.value > 0 ? (openBlock(), createBlock(unref(Popover), {
-                        key: 0,
-                        placement: "top"
-                      }, {
-                        content: withCtx(() => [
-                          createElementVNode("div", _hoisted_3, [
-                            (openBlock(true), createElementBlock(
-                              Fragment,
-                              null,
-                              renderList(_ctx.selectedUsers.slice(visibleUsers.value.length), (user) => {
-                                return openBlock(), createBlock(unref(UserRender), {
-                                  key: user.id,
-                                  "tenant-id": _ctx.tenantId,
-                                  tenants: _ctx.tenants,
-                                  user
-                                }, null, 8, ["tenant-id", "tenants", "user"]);
-                              }),
-                              128
-                              /* KEYED_FRAGMENT */
-                            ))
-                          ])
-                        ]),
+                  (openBlock(true), createElementBlock(
+                    Fragment,
+                    null,
+                    renderList(visibleUsers.value, (user) => {
+                      return openBlock(), createBlock(UserTag, 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 */
+                  )),
+                  createCommentVNode(" 显示折叠标签数量 "),
+                  hiddenCount.value > 0 ? (openBlock(), createBlock(unref(Popover), {
+                    key: 0,
+                    placement: "top"
+                  }, {
+                    content: withCtx(() => [
+                      createElementVNode("div", _hoisted_2, [
+                        (openBlock(true), createElementBlock(
+                          Fragment,
+                          null,
+                          renderList(selectedUsers.value.slice(visibleUsers.value.length), (user) => {
+                            return openBlock(), createBlock(unref(UserRender), {
+                              key: user.id,
+                              "avatar-base-url": _ctx.avatarBaseUrl,
+                              "has-avatar": _ctx.hasAvatar,
+                              "tenant-id": _ctx.tenantId,
+                              tenants: unref(tenants),
+                              user
+                            }, null, 8, ["avatar-base-url", "has-avatar", "tenant-id", "tenants", "user"]);
+                          }),
+                          128
+                          /* KEYED_FRAGMENT */
+                        ))
+                      ])
+                    ]),
+                    default: withCtx(() => [
+                      createVNode(unref(Tag), null, {
                         default: withCtx(() => [
-                          createVNode(unref(Tag), null, {
-                            default: withCtx(() => [
-                              createTextVNode(
-                                " +" + toDisplayString(hiddenCount.value),
-                                1
-                                /* TEXT */
-                              )
-                            ]),
-                            _: 1
-                            /* STABLE */
-                          })
+                          createTextVNode(
+                            " +" + toDisplayString(hiddenCount.value),
+                            1
+                            /* TEXT */
+                          )
                         ]),
                         _: 1
                         /* STABLE */
-                      })) : createCommentVNode("v-if", true),
-                      createCommentVNode(" 搜索输入框 "),
-                      withDirectives(createElementVNode("input", {
-                        ref_key: "collapsedInputRef",
-                        ref: collapsedInputRef,
-                        "onUpdate:modelValue": _cache[2] || (_cache[2] = ($event) => isRef(searchQuery) ? searchQuery.value = $event : null),
-                        class: "search-input collapsed",
-                        placeholder: !_ctx.selectedUsers.length ? _ctx.placeholder : "",
-                        onFocus: handleFocus
-                      }, null, 40, _hoisted_4), [
-                        [vModelText, unref(searchQuery)]
-                      ]),
-                      createCommentVNode(' 未聚焦状态下的"我"标签 '),
-                      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 */
+                  })) : createCommentVNode("v-if", true),
+                  createCommentVNode(" 搜索输入框 "),
+                  withDirectives(createElementVNode("input", {
+                    "onUpdate:modelValue": _cache[2] || (_cache[2] = ($event) => isRef(searchQuery) ? searchQuery.value = $event : null),
+                    class: "search-input search-input-collapsed",
+                    placeholder: !selectedUsers.value.length ? computedPlaceholder.value : "",
+                    onFocus: handleFocus
+                  }, null, 40, _hoisted_3), [
+                    [vModelText, unref(searchQuery)]
+                  ]),
+                  createCommentVNode(' 未聚焦状态下的"我"标签 '),
+                  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__ */ 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 = ref(null);
-    const inputRef = ref(null);
-    const options = ref([]);
-    const isLoading = ref(false);
-    const selectedUser = ref(props.modelValue || "");
-    const searchQuery = ref("");
-    const showDropdown = ref(false);
-    const userGroupFilter = 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 = 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 = [];
-      }
-    };
-    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);
-    };
-    watch(
-      () => props.modelValue,
-      (newVal) => {
-        selectedUser.value = newVal;
-      }
-    );
-    watch(selectedUser, (newVal) => {
-      emit("update:modelValue", newVal);
-    });
-    return (_ctx, _cache) => {
-      return withDirectives((openBlock(), createElementBlock(
-        "div",
-        {
-          ref_key: "containerRef",
-          ref: containerRef,
-          class: normalizeClass(["single-selector", { "is-disabled": _ctx.disabled }])
-        },
-        [
-          createCommentVNode(" 使用新的公共下拉选项组件 "),
-          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: withCtx(() => [
-              createCommentVNode(" 输入框 "),
-              createElementVNode("div", _hoisted_1, [
-                createCommentVNode(" 用户标签显示 "),
-                selectedUserInfo.value ? (openBlock(), createElementBlock("div", {
-                  key: 0,
-                  onClick: withModifiers(removeSelectedUser, ["stop"])
-                }, [
-                  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"])
-                ])) : createCommentVNode("v-if", true),
-                withDirectives(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), [
-                  [vModelText, searchQuery.value]
-                ]),
-                createCommentVNode(' "我"标签 '),
-                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 */
+              ), [
+                [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 */
-      )), [
-        [unref(clickoutside), handleClickOutside]
-      ]);
-    };
-  }
-});
-const SingleSelector = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["__scopeId", "data-v-cbe352a6"]]);
-const _sfc_main = /* @__PURE__ */ 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();
-    provideGlobalConfig({
-      prefix: "bk"
-    });
-    const props = __props;
-    const emit = __emit;
-    const { tenants = {} } = useTenantData(props.apiBaseUrl, props.tenantId, props.enableMultiTenantMode);
-    const selectedUsers = ref([]);
-    const selectedUser = ref(props.multiple ? "" : props.modelValue);
-    const selectedUserIds = computed(() => {
-      return props.multiple ? selectedUsers.value.map((user) => user.id) : [];
-    });
-    const placeholder = computed(() => props.placeholder || t("请输入人员名称搜索"));
-    const userGroupName = computed(() => props.userGroupName || t("用户群组"));
-    const emptyText = 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");
-    };
-    watch(selectedUser, (newVal) => {
-      if (!props.multiple) {
-        emit("update:modelValue", newVal);
-      }
-    });
-    watch(
-      () => props.userGroup,
-      () => {
-        initSelectedUsers();
-      }
-    );
-    watch(
-      () => props.modelValue,
-      () => {
-        initSelectedUsers();
-      },
-      { deep: true }
-    );
-    onBeforeMount(() => {
-      initSelectedUsers();
-    });
-    return (_ctx, _cache) => {
-      return openBlock(), createElementBlock(
-        "section",
-        {
-          ref: "containerRef",
-          class: normalizeClass(["bk-user-selector", { "is-disabled": _ctx.disabled }])
-        },
-        [
-          createCommentVNode(" 单选模式 "),
-          !_ctx.multiple ? (openBlock(), 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: 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"])) : (openBlock(), createElementBlock(
-            Fragment,
-            { key: 1 },
-            [
-              createCommentVNode(" 多选模式 "),
-              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: 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 */
@@ -4635,7 +4431,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const BkUserSelector = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-9c628c83"]]);
+const BkUserSelector = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-9975c7e1"]]);
 export {
   BkUserSelector,
   BkUserSelector as default