@blueking/bk-user-selector 0.0.29-beta.8 → 0.0.30

package/vue3/index.umd.min.js

@@ -3,7 +3,7 @@
 })(this, function(exports2, vue, bkuiVue) {
   "use strict";
   var __vite_style__ = document.createElement("style");
-  __vite_style__.textContent = ".me-tag[data-v-9ccd9029] {\n  position: absolute;\n  top: 50%;\n  right: 8px;\n  z-index: 1;\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  width: 24px;\n  height: 24px;\n  padding: 0 8px;\n  font-size: 12px;\n  color: #4d4f56;\n  cursor: pointer;\n  background-color: #e1ecff;\n  border-radius: 50%;\n  transform: translateY(-50%);\n}\n.me-tag[data-v-9ccd9029]:hover {\n  color: #3a84ff;\n  background-color: #cddffe;\n}\n.me-tag.disabled[data-v-9ccd9029] {\n  color: #c4c6cc;\n  cursor: not-allowed;\n  background-color: #f0f1f5;\n}.dropdown-content[data-v-6380faf5] {\n  min-height: 40px;\n  max-height: 300px;\n  padding: 5px 0;\n  overflow-y: auto;\n}\n.dropdown-content .no-data[data-v-6380faf5] {\n  padding: 10px;\n  color: #979ba5;\n  text-align: center;\n}\n.dropdown-content .user-group .group-header[data-v-6380faf5] {\n  display: flex;\n  align-items: center;\n  padding: 8px 12px;\n  color: #979ba5;\n}\n.dropdown-content .user-group .group-header .group-count[data-v-6380faf5] {\n  margin-left: 4px;\n}\n.dropdown-content .user-option[data-v-6380faf5] {\n  display: flex;\n  align-items: center;\n  height: 32px;\n  padding: 8px 12px;\n  cursor: pointer;\n}\n.dropdown-content .user-option[data-v-6380faf5]:hover {\n  background-color: #f5f7fa;\n}.bk-user-selector-popover.bk-user-selector-pop2-content {\n  padding: 0;\n}.user-tag[data-v-51944a49] {\n  margin-right: 4px;\n  margin-left: 0;\n}\n.user-tag.draggable[data-v-51944a49] {\n  cursor: move;\n}\n.user-tag.active[data-v-51944a49] {\n  background-color: #e1ecff;\n  border-color: #3a84ff;\n}\n.user-tag .tag-content .user-name[data-v-51944a49] {\n  overflow: hidden;\n  font-size: 12px;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}.multiple-selector[data-v-bbacd5b7] {\n  position: relative;\n  width: 100%;\n}\n.multiple-selector.is-disabled[data-v-bbacd5b7] {\n  pointer-events: none;\n}\n.multiple-selector .tags-container[data-v-bbacd5b7] {\n  min-height: 32px;\n  padding: 1px 10px 1px 8px;\n  background-color: #fff;\n  border: 1px solid #c4c6cc;\n  border-radius: 2px;\n  transition: all 0.2s ease;\n}\n.multiple-selector .tags-container.focused[data-v-bbacd5b7] {\n  border-color: #3a84ff;\n  box-shadow: 0 0 0 2px rgba(58, 132, 255, 0.1);\n}\n.multiple-selector .tags-container.collapsed[data-v-bbacd5b7] {\n  display: flex;\n  flex-wrap: wrap;\n  align-items: center;\n}\n.multiple-selector .tag-list[data-v-bbacd5b7] {\n  display: flex;\n  flex-wrap: wrap;\n  align-items: center;\n}\n.multiple-selector .tag-wrapper[data-v-bbacd5b7] {\n  display: inline-flex;\n  align-items: center;\n  max-width: 100%;\n}\n.multiple-selector .search-input[data-v-bbacd5b7] {\n  min-width: 10px;\n  height: 28px;\n  background: transparent;\n  border: none;\n  outline: none;\n}\n.multiple-selector .search-input[data-v-bbacd5b7]::placeholder {\n  color: #c4c6cc;\n}\n.multiple-selector .search-input.inline[data-v-bbacd5b7] {\n  min-width: 10px;\n}\n.multiple-selector .search-input.last[data-v-bbacd5b7], .multiple-selector .search-input.collapsed[data-v-bbacd5b7] {\n  flex: 1;\n  min-width: 60px;\n}.single-selector[data-v-48822637] {\n  position: relative;\n  width: 100%;\n}\n.single-selector.is-disabled[data-v-48822637] {\n  pointer-events: none;\n}\n.input-container[data-v-48822637] {\n  position: relative;\n  display: flex;\n  align-items: center;\n  min-height: 32px;\n  padding: 0 8px;\n  background-color: #fff;\n  border: 1px solid #c4c6cc;\n  border-radius: 2px;\n}\n.input-container[data-v-48822637]:focus-within {\n  border-color: #3a84ff;\n  box-shadow: 0 0 0 2px rgba(58, 132, 255, 0.1);\n}\n.search-input[data-v-48822637] {\n  flex: 1;\n  height: 30px;\n  background: transparent;\n  border: none;\n  outline: none;\n}\n.search-input[data-v-48822637]::placeholder {\n  color: #c4c6cc;\n}.bk-user-selector[data-v-7ce51f9c] {\n  position: relative;\n  width: 100%;\n  font-size: 12px;\n}\n.bk-user-selector.is-disabled[data-v-7ce51f9c] {\n  cursor: not-allowed;\n  background-color: #dcdee5;\n}/*$vite$:1*/";
+  __vite_style__.textContent = ".me-tag[data-v-ce388fae] {\n  position: absolute;\n  top: 50%;\n  right: 8px;\n  z-index: 1;\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  width: 24px;\n  height: 24px;\n  padding: 0 8px;\n  font-size: 12px;\n  color: #4d4f56;\n  cursor: pointer;\n  background-color: #e1ecff;\n  border-radius: 50%;\n  transform: translateY(-50%);\n}\n.me-tag[data-v-ce388fae]:hover {\n  color: #3a84ff;\n  background-color: #cddffe;\n}\n.me-tag.disabled[data-v-ce388fae] {\n  color: #c4c6cc;\n  cursor: not-allowed;\n  background-color: #f0f1f5;\n}.dropdown-content[data-v-61e98a47] {\n  min-height: 40px;\n  max-height: 300px;\n  padding: 5px 0;\n  overflow-y: auto;\n}\n.dropdown-content .no-data[data-v-61e98a47] {\n  padding: 10px;\n  color: #979ba5;\n  text-align: center;\n}\n.dropdown-content .user-group .group-header[data-v-61e98a47] {\n  display: flex;\n  align-items: center;\n  padding: 8px 12px;\n  color: #979ba5;\n}\n.dropdown-content .user-group .group-header .group-count[data-v-61e98a47] {\n  margin-left: 4px;\n}\n.dropdown-content .user-option[data-v-61e98a47] {\n  display: flex;\n  align-items: center;\n  height: 32px;\n  padding: 8px 12px;\n  cursor: pointer;\n}\n.dropdown-content .user-option[data-v-61e98a47]:hover {\n  background-color: #f5f7fa;\n}.bk-user-selector-popover.bk-user-selector-pop2-content {\n  padding: 0;\n}.user-tag[data-v-51944a49] {\n  margin-right: 4px;\n  margin-left: 0;\n}\n.user-tag.draggable[data-v-51944a49] {\n  cursor: move;\n}\n.user-tag.active[data-v-51944a49] {\n  background-color: #e1ecff;\n  border-color: #3a84ff;\n}\n.user-tag .tag-content .user-name[data-v-51944a49] {\n  overflow: hidden;\n  font-size: 12px;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}.multiple-selector[data-v-1c358144] {\n  position: relative;\n  width: 100%;\n}\n.multiple-selector.is-disabled[data-v-1c358144] {\n  pointer-events: none;\n}\n.multiple-selector .tags-container[data-v-1c358144] {\n  min-height: 32px;\n  padding: 1px 10px 1px 8px;\n  background-color: #fff;\n  border: 1px solid #c4c6cc;\n  border-radius: 2px;\n  transition: all 0.2s ease;\n}\n.multiple-selector .tags-container.focused[data-v-1c358144] {\n  border-color: #3a84ff;\n  box-shadow: 0 0 0 2px rgba(58, 132, 255, 0.1);\n}\n.multiple-selector .tags-container.collapsed[data-v-1c358144] {\n  display: flex;\n  flex-wrap: wrap;\n  align-items: center;\n}\n.multiple-selector .tag-list[data-v-1c358144] {\n  display: flex;\n  flex-wrap: wrap;\n  align-items: center;\n}\n.multiple-selector .tag-wrapper[data-v-1c358144] {\n  display: inline-flex;\n  align-items: center;\n  max-width: 100%;\n}\n.multiple-selector .search-input[data-v-1c358144] {\n  min-width: 10px;\n  height: 28px;\n  background: transparent;\n  border: none;\n  outline: none;\n}\n.multiple-selector .search-input[data-v-1c358144]::placeholder {\n  color: #c4c6cc;\n}\n.multiple-selector .search-input.inline[data-v-1c358144] {\n  min-width: 10px;\n}\n.multiple-selector .search-input.last[data-v-1c358144], .multiple-selector .search-input.collapsed[data-v-1c358144] {\n  flex: 1;\n  min-width: 60px;\n}.single-selector[data-v-7080eb2b] {\n  position: relative;\n  width: 100%;\n}\n.single-selector.is-disabled[data-v-7080eb2b] {\n  pointer-events: none;\n}\n.input-container[data-v-7080eb2b] {\n  position: relative;\n  display: flex;\n  align-items: center;\n  min-height: 32px;\n  padding: 0 8px;\n  background-color: #fff;\n  border: 1px solid #c4c6cc;\n  border-radius: 2px;\n}\n.input-container[data-v-7080eb2b]:focus-within {\n  border-color: #3a84ff;\n  box-shadow: 0 0 0 2px rgba(58, 132, 255, 0.1);\n}\n.search-input[data-v-7080eb2b] {\n  flex: 1;\n  height: 30px;\n  background: transparent;\n  border: none;\n  outline: none;\n}\n.search-input[data-v-7080eb2b]::placeholder {\n  color: #c4c6cc;\n}.bk-user-selector[data-v-c4574ead] {\n  position: relative;\n  width: 100%;\n  font-size: 12px;\n}\n.bk-user-selector.is-disabled[data-v-c4574ead] {\n  cursor: not-allowed;\n  background-color: #dcdee5;\n}/*$vite$:1*/";
   document.head.appendChild(__vite_style__);
   const generateCallbackName = () => {
     const timestamp = Date.now();
@@ -119,7 +119,7 @@
       }).catch(() => {
         return [];
       });
-      return userList;
+      return users.map((user) => userList.find((u) => u.username === user)).filter(Boolean);
     }
     if (users.length === 0 || !apiBaseUrl || !tenantId) {
       console.warn("批量查找用户需要提供有效的apiBaseUrl、租户ID和至少一个用户名");
@@ -174,6 +174,163 @@
     });
     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];
+      }
+    }
+    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"
+  };
+  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;
+      }
+      if (variables) {
+        target = target[pathStack[i]];
+        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 useTenantData = (apiBaseUrl, tenantId, enableMultiTenantMode = true) => {
     const tenants = vue.ref({});
     const loading = vue.ref(false);
@@ -3083,6 +3240,7 @@
     },
     emits: ["click"],
     setup(__props, { emit: __emit }) {
+      const { t } = useI18n();
       const props = __props;
       const emit = __emit;
       const handleClick = () => {
@@ -3097,9 +3255,9 @@
             class: vue.normalizeClass(["me-tag", { disabled: __props.isDisabled }]),
             onClick: vue.withModifiers(handleClick, ["stop"])
           },
-          " 我 ",
-          2
-          /* CLASS */
+          vue.toDisplayString(vue.unref(t)("我")),
+          3
+          /* TEXT, CLASS */
         )) : vue.createCommentVNode("v-if", true);
       };
     }
@@ -3111,7 +3269,7 @@
     }
     return target;
   };
-  const MeTag = /* @__PURE__ */ _export_sfc(_sfc_main$5, [["__scopeId", "data-v-9ccd9029"]]);
+  const MeTag = /* @__PURE__ */ _export_sfc(_sfc_main$5, [["__scopeId", "data-v-ce388fae"]]);
   const UserRender = vue.defineComponent({
     name: "UserRender",
     props: {
@@ -3239,14 +3397,14 @@
        */
       userGroupName: {
         type: String,
-        default: "用户群组"
+        default: ""
       },
       /**
        * 无匹配人员时的提示文本
        */
       emptyText: {
         type: String,
-        default: "无匹配人员"
+        default: ""
       },
       /**
        * 渲染列表项
@@ -3385,7 +3543,7 @@
       };
     }
   });
-  const SelectionPopover = /* @__PURE__ */ _export_sfc(_sfc_main$4, [["__scopeId", "data-v-6380faf5"]]);
+  const SelectionPopover = /* @__PURE__ */ _export_sfc(_sfc_main$4, [["__scopeId", "data-v-61e98a47"]]);
   const _sfc_main$3 = /* @__PURE__ */ vue.defineComponent({
     ...{
       name: "UserTag"
@@ -3447,12 +3605,12 @@
       tenants: { default: () => ({}) },
       apiBaseUrl: { default: "" },
       tenantId: { default: "" },
-      placeholder: { default: "请输入人员名称搜索" },
+      placeholder: { default: "" },
       currentUserId: { default: "" },
       exactSearchKey: { default: "bk_username" },
       userGroup: { default: () => [] },
-      userGroupName: { default: "用户群组" },
-      emptyText: { default: "无匹配人员" },
+      userGroupName: { default: "" },
+      emptyText: { default: "" },
       disabled: { type: Boolean },
       renderListItem: {},
       renderTag: {},
@@ -3487,7 +3645,14 @@
         return searchResults.value.filter((user) => !props.selectedUsers.some((selectedUser) => selectedUser.id === user.id)).filter((user) => !props.excludeUserIds.includes(user.id));
       });
       const userGroupFilter = vue.computed(() => {
-        return props.userGroup.filter((group) => !props.selectedUsers.some((user) => user.id === group.id) && !group.hidden);
+        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 initSortable = () => {
         if (!props.draggable || !sortableContainerRef.value) return;
@@ -3943,7 +4108,7 @@
       };
     }
   });
-  const MultipleSelector = /* @__PURE__ */ _export_sfc(_sfc_main$2, [["__scopeId", "data-v-bbacd5b7"]]);
+  const MultipleSelector = /* @__PURE__ */ _export_sfc(_sfc_main$2, [["__scopeId", "data-v-1c358144"]]);
   const _hoisted_1 = { class: "input-container" };
   const _hoisted_2 = ["placeholder"];
   const _sfc_main$1 = /* @__PURE__ */ vue.defineComponent({
@@ -3956,12 +4121,12 @@
       tenants: {},
       apiBaseUrl: { default: "" },
       tenantId: { default: "" },
-      placeholder: { default: "请输入人员名称搜索" },
+      placeholder: { default: "" },
       currentUserId: { default: "" },
       exactSearchKey: { default: "bk_username" },
       userGroup: { default: () => [] },
-      userGroupName: { default: "用户群组" },
-      emptyText: { default: "无匹配人员" },
+      userGroupName: { default: "" },
+      emptyText: { default: "" },
       disabled: { type: Boolean },
       renderListItem: {},
       renderTag: {},
@@ -3980,7 +4145,14 @@
       const searchQuery = vue.ref("");
       const showDropdown = vue.ref(false);
       const userGroupFilter = vue.computed(() => {
-        return props.userGroup.filter((group) => group.id !== selectedUser.value && !group.hidden);
+        return props.userGroup.filter((group) => {
+          var _a, _b;
+          const filtered = group.id !== selectedUser.value && !group.hidden;
+          if (filtered) {
+            return ((_a = group.id) == null ? void 0 : _a.includes(searchQuery.value)) || ((_b = group.name) == null ? void 0 : _b.includes(searchQuery.value));
+          }
+          return false;
+        });
       });
       const selectedUserInfo = vue.computed(() => {
         const userGroup = (props.userGroup || []).map((group) => ({
@@ -4168,7 +4340,7 @@
       };
     }
   });
-  const SingleSelector = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["__scopeId", "data-v-48822637"]]);
+  const SingleSelector = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["__scopeId", "data-v-7080eb2b"]]);
   const _sfc_main = /* @__PURE__ */ vue.defineComponent({
     ...{
       name: "BkUserSelector"
@@ -4180,12 +4352,12 @@
       multiple: { type: Boolean, default: false },
       apiBaseUrl: { default: "" },
       tenantId: { default: "" },
-      placeholder: { default: "请输入人员名称搜索" },
+      placeholder: { default: "" },
       currentUserId: { default: "" },
       exactSearchKey: { default: "bk_username" },
       userGroup: { default: () => [] },
-      userGroupName: { default: "用户群组" },
-      emptyText: { default: "无匹配人员" },
+      userGroupName: { default: "" },
+      emptyText: { default: "" },
       disabled: { type: Boolean, default: false },
       renderListItem: {},
       renderTag: {},
@@ -4194,6 +4366,7 @@
     },
     emits: ["update:modelValue", "change"],
     setup(__props, { emit: __emit }) {
+      const { t } = useI18n();
       bkuiVue.provideGlobalConfig({
         prefix: "bk"
       });
@@ -4205,6 +4378,9 @@
       const selectedUserIds = vue.computed(() => {
         return props.multiple ? selectedUsers.value.map((user) => user.id) : [];
       });
+      const placeholder = vue.computed(() => props.placeholder || t("请输入人员名称搜索"));
+      const userGroupName = vue.computed(() => props.userGroupName || t("用户群组"));
+      const emptyText = vue.computed(() => props.emptyText || t("无匹配人员"));
       const initSelectedUsers = async () => {
         if (props.multiple) {
           const ids = Array.isArray(props.modelValue) ? props.modelValue : [];
@@ -4226,7 +4402,8 @@
                 usersList: ids,
                 enableMultiTenantMode: props.enableMultiTenantMode
               });
-              selectedUsers.value = [...selected, ...formatUsers(result, props.enableMultiTenantMode)];
+              const selectedList = [...selected, ...formatUsers(result, props.enableMultiTenantMode)];
+              selectedUsers.value = ids.map((id) => selectedList.find((user) => user.id === id)).filter(Boolean);
             } catch (error) {
               console.error("获取选中用户信息失败:", error);
             }
@@ -4284,17 +4461,17 @@
               "api-base-url": _ctx.apiBaseUrl,
               "current-user-id": _ctx.currentUserId,
               disabled: _ctx.disabled,
-              "empty-text": _ctx.emptyText,
+              "empty-text": emptyText.value,
               "enable-multi-tenant-mode": _ctx.enableMultiTenantMode,
               "exact-search-key": _ctx.exactSearchKey,
               "exclude-user-ids": _ctx.excludeUserIds,
-              placeholder: _ctx.placeholder,
+              placeholder: placeholder.value,
               "render-list-item": _ctx.renderListItem,
               "render-tag": _ctx.renderTag,
               "tenant-id": _ctx.tenantId,
               tenants: vue.unref(tenants),
               "user-group": _ctx.userGroup,
-              "user-group-name": _ctx.userGroupName,
+              "user-group-name": userGroupName.value,
               onChange: handleUpdateUser
             }, null, 8, ["modelValue", "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"])) : (vue.openBlock(), vue.createElementBlock(
               vue.Fragment,
@@ -4308,18 +4485,18 @@
                   "current-user-id": _ctx.currentUserId,
                   disabled: _ctx.disabled,
                   draggable: _ctx.draggable,
-                  "empty-text": _ctx.emptyText,
+                  "empty-text": emptyText.value,
                   "enable-multi-tenant-mode": _ctx.enableMultiTenantMode,
                   "exact-search-key": _ctx.exactSearchKey,
                   "exclude-user-ids": _ctx.excludeUserIds,
-                  placeholder: _ctx.placeholder,
+                  placeholder: placeholder.value,
                   "render-list-item": _ctx.renderListItem,
                   "render-tag": _ctx.renderTag,
                   "selected-users": selectedUsers.value,
                   "tenant-id": _ctx.tenantId,
                   tenants: vue.unref(tenants),
                   "user-group": _ctx.userGroup,
-                  "user-group-name": _ctx.userGroupName,
+                  "user-group-name": userGroupName.value,
                   "onUpdate:selectedUsers": handleUpdateSelectedUsers
                 }, null, 8, ["modelValue", "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"])
               ],
@@ -4333,7 +4510,7 @@
       };
     }
   });
-  const BkUserSelector = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-7ce51f9c"]]);
+  const BkUserSelector = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-c4574ead"]]);
   exports2.BkUserSelector = BkUserSelector;
   exports2.default = BkUserSelector;
   Object.defineProperties(exports2, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });

package/vue3/vue3.css

@@ -1,4 +1,4 @@
-.me-tag[data-v-9ccd9029] {
+.me-tag[data-v-ce388fae] {
   position: absolute;
   top: 50%;
   right: 8px;
@@ -16,42 +16,42 @@
   border-radius: 50%;
   transform: translateY(-50%);
 }
-.me-tag[data-v-9ccd9029]:hover {
+.me-tag[data-v-ce388fae]:hover {
   color: #3a84ff;
   background-color: #cddffe;
 }
-.me-tag.disabled[data-v-9ccd9029] {
+.me-tag.disabled[data-v-ce388fae] {
   color: #c4c6cc;
   cursor: not-allowed;
   background-color: #f0f1f5;
-}.dropdown-content[data-v-6380faf5] {
+}.dropdown-content[data-v-61e98a47] {
   min-height: 40px;
   max-height: 300px;
   padding: 5px 0;
   overflow-y: auto;
 }
-.dropdown-content .no-data[data-v-6380faf5] {
+.dropdown-content .no-data[data-v-61e98a47] {
   padding: 10px;
   color: #979ba5;
   text-align: center;
 }
-.dropdown-content .user-group .group-header[data-v-6380faf5] {
+.dropdown-content .user-group .group-header[data-v-61e98a47] {
   display: flex;
   align-items: center;
   padding: 8px 12px;
   color: #979ba5;
 }
-.dropdown-content .user-group .group-header .group-count[data-v-6380faf5] {
+.dropdown-content .user-group .group-header .group-count[data-v-61e98a47] {
   margin-left: 4px;
 }
-.dropdown-content .user-option[data-v-6380faf5] {
+.dropdown-content .user-option[data-v-61e98a47] {
   display: flex;
   align-items: center;
   height: 32px;
   padding: 8px 12px;
   cursor: pointer;
 }
-.dropdown-content .user-option[data-v-6380faf5]:hover {
+.dropdown-content .user-option[data-v-61e98a47]:hover {
   background-color: #f5f7fa;
 }.bk-user-selector-popover.bk-user-selector-pop2-content {
   padding: 0;
@@ -71,14 +71,14 @@
   font-size: 12px;
   text-overflow: ellipsis;
   white-space: nowrap;
-}.multiple-selector[data-v-bbacd5b7] {
+}.multiple-selector[data-v-1c358144] {
   position: relative;
   width: 100%;
 }
-.multiple-selector.is-disabled[data-v-bbacd5b7] {
+.multiple-selector.is-disabled[data-v-1c358144] {
   pointer-events: none;
 }
-.multiple-selector .tags-container[data-v-bbacd5b7] {
+.multiple-selector .tags-container[data-v-1c358144] {
   min-height: 32px;
   padding: 1px 10px 1px 8px;
   background-color: #fff;
@@ -86,49 +86,49 @@
   border-radius: 2px;
   transition: all 0.2s ease;
 }
-.multiple-selector .tags-container.focused[data-v-bbacd5b7] {
+.multiple-selector .tags-container.focused[data-v-1c358144] {
   border-color: #3a84ff;
   box-shadow: 0 0 0 2px rgba(58, 132, 255, 0.1);
 }
-.multiple-selector .tags-container.collapsed[data-v-bbacd5b7] {
+.multiple-selector .tags-container.collapsed[data-v-1c358144] {
   display: flex;
   flex-wrap: wrap;
   align-items: center;
 }
-.multiple-selector .tag-list[data-v-bbacd5b7] {
+.multiple-selector .tag-list[data-v-1c358144] {
   display: flex;
   flex-wrap: wrap;
   align-items: center;
 }
-.multiple-selector .tag-wrapper[data-v-bbacd5b7] {
+.multiple-selector .tag-wrapper[data-v-1c358144] {
   display: inline-flex;
   align-items: center;
   max-width: 100%;
 }
-.multiple-selector .search-input[data-v-bbacd5b7] {
+.multiple-selector .search-input[data-v-1c358144] {
   min-width: 10px;
   height: 28px;
   background: transparent;
   border: none;
   outline: none;
 }
-.multiple-selector .search-input[data-v-bbacd5b7]::placeholder {
+.multiple-selector .search-input[data-v-1c358144]::placeholder {
   color: #c4c6cc;
 }
-.multiple-selector .search-input.inline[data-v-bbacd5b7] {
+.multiple-selector .search-input.inline[data-v-1c358144] {
   min-width: 10px;
 }
-.multiple-selector .search-input.last[data-v-bbacd5b7], .multiple-selector .search-input.collapsed[data-v-bbacd5b7] {
+.multiple-selector .search-input.last[data-v-1c358144], .multiple-selector .search-input.collapsed[data-v-1c358144] {
   flex: 1;
   min-width: 60px;
-}.single-selector[data-v-48822637] {
+}.single-selector[data-v-7080eb2b] {
   position: relative;
   width: 100%;
 }
-.single-selector.is-disabled[data-v-48822637] {
+.single-selector.is-disabled[data-v-7080eb2b] {
   pointer-events: none;
 }
-.input-container[data-v-48822637] {
+.input-container[data-v-7080eb2b] {
   position: relative;
   display: flex;
   align-items: center;
@@ -138,25 +138,25 @@
   border: 1px solid #c4c6cc;
   border-radius: 2px;
 }
-.input-container[data-v-48822637]:focus-within {
+.input-container[data-v-7080eb2b]:focus-within {
   border-color: #3a84ff;
   box-shadow: 0 0 0 2px rgba(58, 132, 255, 0.1);
 }
-.search-input[data-v-48822637] {
+.search-input[data-v-7080eb2b] {
   flex: 1;
   height: 30px;
   background: transparent;
   border: none;
   outline: none;
 }
-.search-input[data-v-48822637]::placeholder {
+.search-input[data-v-7080eb2b]::placeholder {
   color: #c4c6cc;
-}.bk-user-selector[data-v-7ce51f9c] {
+}.bk-user-selector[data-v-c4574ead] {
   position: relative;
   width: 100%;
   font-size: 12px;
 }
-.bk-user-selector.is-disabled[data-v-7ce51f9c] {
+.bk-user-selector.is-disabled[data-v-c4574ead] {
   cursor: not-allowed;
   background-color: #dcdee5;
 }