@blueking/bk-user-selector 0.0.11 → 0.0.12

package/vue3/index.es.min.js

@@ -3092,6 +3092,13 @@ const _sfc_main$4 = /* @__PURE__ */ defineComponent({
     userGroupName: {
       type: String,
       default: "用户群组"
+    },
+    /**
+     * 无匹配人员时的提示文本
+     */
+    emptyText: {
+      type: String,
+      default: "无匹配人员"
     }
   },
   emits: ["select-user"],
@@ -3141,7 +3148,7 @@ const _sfc_main$4 = /* @__PURE__ */ defineComponent({
                 createElementVNode(
                   "span",
                   null,
-                  toDisplayString(__props.searchQuery.length > 1 ? "未找到匹配用户" : "请输入关键词搜索"),
+                  toDisplayString(__props.searchQuery.length > 1 ? __props.emptyText : "请至少输入2个字符搜索"),
                   1
                   /* TEXT */
                 )
@@ -3224,7 +3231,7 @@ const _sfc_main$4 = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const SelectionPopover = /* @__PURE__ */ _export_sfc(_sfc_main$4, [["__scopeId", "data-v-01b75e6e"]]);
+const SelectionPopover = /* @__PURE__ */ _export_sfc(_sfc_main$4, [["__scopeId", "data-v-05b232a4"]]);
 const _hoisted_1$3 = { class: "tag-content" };
 const _hoisted_2$2 = { class: "user-name" };
 const _hoisted_3$2 = {
@@ -3304,7 +3311,8 @@ const _sfc_main$2 = /* @__PURE__ */ defineComponent({
     currentUserId: { default: "" },
     exactSearchKey: { default: "bk_username" },
     userGroup: { default: () => [] },
-    userGroupName: { default: "用户群组" }
+    userGroupName: { default: "用户群组" },
+    emptyText: { default: "无匹配人员" }
   },
   emits: ["update:selectedUsers", "add-user", "remove-user"],
   setup(__props, { emit: __emit }) {
@@ -3381,7 +3389,13 @@ const _sfc_main$2 = /* @__PURE__ */ defineComponent({
         }
       });
     };
-    const handleClickOutside = () => {
+    const handleClickOutside = ({ event }) => {
+      event.stopPropagation();
+      const target = event.target;
+      const container = containerRef.value;
+      if ((container == null ? void 0 : container.contains(target)) || container === target) {
+        return;
+      }
       isFocused.value = false;
       showDropdown.value = false;
       activeTagIndex.value = -1;
@@ -3490,7 +3504,14 @@ const _sfc_main$2 = /* @__PURE__ */ defineComponent({
         emit("add-user", user);
       }
       searchQuery.value = "";
-      showDropdown.value = false;
+      setTimeout(() => {
+        showDropdown.value = false;
+      }, 220);
+      nextTick(() => {
+        if (lastInputRef.value) {
+          lastInputRef.value.focus();
+        }
+      });
     };
     const removeUser = (user) => {
       if (!(user == null ? void 0 : user.id)) return;
@@ -3539,200 +3560,206 @@ const _sfc_main$2 = /* @__PURE__ */ defineComponent({
       });
     });
     return (_ctx, _cache) => {
-      return withDirectives((openBlock(), createElementBlock("div", {
-        ref_key: "containerRef",
-        ref: containerRef,
-        class: "multiple-selector"
-      }, [
-        createCommentVNode(" 聚焦状态 - 可编辑模式 "),
-        isFocused.value ? (openBlock(), createElementBlock(
-          "div",
-          {
-            key: 0,
-            ref_key: "tagsContainerRef",
-            ref: tagsContainerRef,
-            class: "tags-container focused",
-            onClick: withModifiers(handleContainerClick, ["stop"])
-          },
-          [
-            createCommentVNode(" 用户标签列表 "),
-            createElementVNode(
-              "div",
-              {
-                ref_key: "sortableContainerRef",
-                ref: sortableContainerRef,
-                class: "tag-list"
-              },
-              [
-                (openBlock(true), createElementBlock(
-                  Fragment,
-                  null,
-                  renderList(_ctx.selectedUsers, (user, index) => {
-                    return openBlock(), createElementBlock("div", {
-                      class: "tag-wrapper",
-                      key: user.id,
-                      onClick: withModifiers(($event) => handleTagClick(index), ["stop"])
-                    }, [
-                      createVNode(UserTag, {
-                        active: index === activeTagIndex.value,
+      return openBlock(), createElementBlock(
+        "div",
+        {
+          ref_key: "containerRef",
+          ref: containerRef,
+          class: "multiple-selector"
+        },
+        [
+          createCommentVNode(" 聚焦状态 - 可编辑模式 "),
+          isFocused.value ? (openBlock(), createElementBlock(
+            "div",
+            {
+              key: 0,
+              ref_key: "tagsContainerRef",
+              ref: tagsContainerRef,
+              class: "tags-container focused",
+              onClick: withModifiers(handleContainerClick, ["stop"])
+            },
+            [
+              createCommentVNode(" 用户标签列表 "),
+              createElementVNode(
+                "div",
+                {
+                  ref_key: "sortableContainerRef",
+                  ref: sortableContainerRef,
+                  class: "tag-list"
+                },
+                [
+                  (openBlock(true), createElementBlock(
+                    Fragment,
+                    null,
+                    renderList(_ctx.selectedUsers, (user, index) => {
+                      return openBlock(), createElementBlock("div", {
+                        class: "tag-wrapper",
+                        key: user.id,
+                        onClick: withModifiers(($event) => handleTagClick(index), ["stop"])
+                      }, [
+                        createVNode(UserTag, {
+                          active: index === activeTagIndex.value,
+                          "current-tenant-id": _ctx.tenantId,
+                          draggable: _ctx.draggable,
+                          tenants: _ctx.tenants,
+                          user,
+                          onClick: ($event) => handleTagClick(index),
+                          onClose: ($event) => removeUser(user)
+                        }, null, 8, ["active", "current-tenant-id", "draggable", "tenants", "user", "onClick", "onClose"]),
+                        createCommentVNode(" 在当前激活标签后插入输入框 "),
+                        index === activeTagIndex.value && activeTagIndex.value !== _ctx.selectedUsers.length - 1 ? withDirectives((openBlock(), createElementBlock(
+                          "input",
+                          {
+                            key: 0,
+                            ref_for: true,
+                            ref_key: "inlineInputRef",
+                            ref: inlineInputRef,
+                            class: "search-input inline",
+                            "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => isRef(searchQuery) ? searchQuery.value = $event : null),
+                            onFocus: handleInputFocus,
+                            onInput: handleInput,
+                            onKeydown: handleKeyDown,
+                            onPaste: handlePaste
+                          },
+                          null,
+                          544
+                          /* NEED_HYDRATION, NEED_PATCH */
+                        )), [
+                          [vModelText, unref(searchQuery)]
+                        ]) : createCommentVNode("v-if", true)
+                      ], 8, _hoisted_1$2);
+                    }),
+                    128
+                    /* KEYED_FRAGMENT */
+                  )),
+                  createCommentVNode(" 最后一个输入框 "),
+                  activeTagIndex.value === -1 || activeTagIndex.value === _ctx.selectedUsers.length - 1 ? withDirectives((openBlock(), createElementBlock("input", {
+                    key: 0,
+                    ref_key: "lastInputRef",
+                    ref: lastInputRef,
+                    class: "search-input last",
+                    "onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => isRef(searchQuery) ? searchQuery.value = $event : null),
+                    placeholder: !_ctx.selectedUsers.length ? _ctx.placeholder : "",
+                    onFocus: handleInputFocus,
+                    onInput: handleInput,
+                    onKeydown: handleKeyDown,
+                    onPaste: handlePaste
+                  }, null, 40, _hoisted_2$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),
+                    onClick: addCurrentUser
+                  }, null, 8, ["current-user-id", "is-disabled"])
+                ],
+                512
+                /* NEED_PATCH */
+              )
+            ],
+            512
+            /* NEED_PATCH */
+          )) : (openBlock(), createElementBlock(
+            Fragment,
+            { key: 1 },
+            [
+              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, {
                         "current-tenant-id": _ctx.tenantId,
-                        draggable: _ctx.draggable,
+                        key: user.id,
+                        "show-tenant": true,
                         tenants: _ctx.tenants,
                         user,
-                        onClick: ($event) => handleTagClick(index),
+                        onClick: handleFocus,
                         onClose: ($event) => removeUser(user)
-                      }, null, 8, ["active", "current-tenant-id", "draggable", "tenants", "user", "onClick", "onClose"]),
-                      createCommentVNode(" 在当前激活标签后插入输入框 "),
-                      index === activeTagIndex.value && activeTagIndex.value !== _ctx.selectedUsers.length - 1 ? withDirectives((openBlock(), createElementBlock(
-                        "input",
-                        {
-                          key: 0,
-                          ref_for: true,
-                          ref_key: "inlineInputRef",
-                          ref: inlineInputRef,
-                          class: "search-input inline",
-                          "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => isRef(searchQuery) ? searchQuery.value = $event : null),
-                          onFocus: handleInputFocus,
-                          onInput: handleInput,
-                          onKeydown: handleKeyDown,
-                          onPaste: handlePaste
-                        },
-                        null,
-                        544
-                        /* NEED_HYDRATION, NEED_PATCH */
-                      )), [
-                        [vModelText, unref(searchQuery)]
-                      ]) : createCommentVNode("v-if", true)
-                    ], 8, _hoisted_1$2);
-                  }),
-                  128
-                  /* KEYED_FRAGMENT */
-                )),
-                createCommentVNode(" 最后一个输入框 "),
-                activeTagIndex.value === -1 || activeTagIndex.value === _ctx.selectedUsers.length - 1 ? withDirectives((openBlock(), createElementBlock("input", {
-                  key: 0,
-                  ref_key: "lastInputRef",
-                  ref: lastInputRef,
-                  class: "search-input last",
-                  "onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => isRef(searchQuery) ? searchQuery.value = $event : null),
-                  placeholder: !_ctx.selectedUsers.length ? _ctx.placeholder : "",
-                  onFocus: handleInputFocus,
-                  onInput: handleInput,
-                  onKeydown: handleKeyDown,
-                  onPaste: handlePaste
-                }, null, 40, _hoisted_2$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),
-                  onClick: addCurrentUser
-                }, null, 8, ["current-user-id", "is-disabled"])
-              ],
-              512
-              /* NEED_PATCH */
-            )
-          ],
-          512
-          /* NEED_PATCH */
-        )) : (openBlock(), createElementBlock(
-          Fragment,
-          { key: 1 },
-          [
-            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, {
-                      "current-tenant-id": _ctx.tenantId,
-                      key: user.id,
-                      "show-tenant": true,
-                      tenants: _ctx.tenants,
-                      user,
-                      onClick: handleFocus,
-                      onClose: ($event) => removeUser(user)
-                    }, null, 8, ["current-tenant-id", "tenants", "user", "onClose"]);
-                  }),
-                  128
-                  /* KEYED_FRAGMENT */
-                )),
-                createCommentVNode(" 显示折叠标签数量 "),
-                hiddenCount.value > 0 ? withDirectives((openBlock(), createBlock(unref(Tag), {
-                  key: 0,
-                  onClick: withModifiers(handleFocus, ["stop"])
-                }, {
-                  default: withCtx(() => [
-                    createTextVNode(
-                      " +" + toDisplayString(hiddenCount.value),
-                      1
-                      /* TEXT */
-                    )
+                      }, null, 8, ["current-tenant-id", "tenants", "user", "onClose"]);
+                    }),
+                    128
+                    /* KEYED_FRAGMENT */
+                  )),
+                  createCommentVNode(" 显示折叠标签数量 "),
+                  hiddenCount.value > 0 ? withDirectives((openBlock(), createBlock(unref(Tag), {
+                    key: 0,
+                    onClick: withModifiers(handleFocus, ["stop"])
+                  }, {
+                    default: withCtx(() => [
+                      createTextVNode(
+                        " +" + toDisplayString(hiddenCount.value),
+                        1
+                        /* TEXT */
+                      )
+                    ]),
+                    _: 1
+                    /* STABLE */
+                  })), [
+                    [unref(bkTooltips), {
+                      content: _ctx.selectedUsers.slice(visibleUsers.value.length).map((user) => user.display_name).join(","),
+                      placement: "top"
+                    }]
+                  ]) : createCommentVNode("v-if", true),
+                  createCommentVNode(" 搜索输入框 "),
+                  withDirectives(createElementVNode("input", {
+                    ref_key: "collapsedInputRef",
+                    ref: collapsedInputRef,
+                    class: "search-input collapsed",
+                    "onUpdate:modelValue": _cache[2] || (_cache[2] = ($event) => isRef(searchQuery) ? searchQuery.value = $event : null),
+                    placeholder: !_ctx.selectedUsers.length ? _ctx.placeholder : "",
+                    onFocus: handleFocus
+                  }, null, 40, _hoisted_3$1), [
+                    [vModelText, unref(searchQuery)]
                   ]),
-                  _: 1
-                  /* STABLE */
-                })), [
-                  [unref(bkTooltips), {
-                    content: _ctx.selectedUsers.slice(visibleUsers.value.length).map((user) => user.display_name).join(","),
-                    placement: "top"
-                  }]
-                ]) : createCommentVNode("v-if", true),
-                createCommentVNode(" 搜索输入框 "),
-                withDirectives(createElementVNode("input", {
-                  ref_key: "collapsedInputRef",
-                  ref: collapsedInputRef,
-                  class: "search-input collapsed",
-                  "onUpdate:modelValue": _cache[2] || (_cache[2] = ($event) => isRef(searchQuery) ? searchQuery.value = $event : null),
-                  placeholder: !_ctx.selectedUsers.length ? _ctx.placeholder : "",
-                  onFocus: handleFocus
-                }, null, 40, _hoisted_3$1), [
-                  [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 */
-            )
-          ],
-          2112
-          /* STABLE_FRAGMENT, DEV_ROOT_FRAGMENT */
-        )),
-        createCommentVNode(" 下拉选项列表 "),
-        createVNode(SelectionPopover, {
-          "container-width": containerRef.value ? containerRef.value.offsetWidth : "auto",
-          "is-show": showDropdown.value,
-          loading: unref(searchLoading),
-          options: options.value,
-          "search-query": unref(searchQuery),
-          "tenant-id": _ctx.tenantId,
-          tenants: _ctx.tenants,
-          "user-group": _ctx.userGroup,
-          "user-group-name": _ctx.userGroupName,
-          onSelectUser: addUser
-        }, null, 8, ["container-width", "is-show", "loading", "options", "search-query", "tenant-id", "tenants", "user-group", "user-group-name"])
-      ])), [
-        [unref(clickoutside), handleClickOutside]
-      ]);
+                  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 */
+              )
+            ],
+            2112
+            /* STABLE_FRAGMENT, DEV_ROOT_FRAGMENT */
+          )),
+          createCommentVNode(" 下拉选项列表 "),
+          createVNode(SelectionPopover, {
+            "container-width": containerRef.value ? containerRef.value.offsetWidth : "auto",
+            "empty-text": _ctx.emptyText,
+            "is-show": showDropdown.value,
+            loading: unref(searchLoading),
+            options: options.value,
+            "search-query": unref(searchQuery),
+            "tenant-id": _ctx.tenantId,
+            tenants: _ctx.tenants,
+            "user-group": _ctx.userGroup,
+            "user-group-name": _ctx.userGroupName,
+            onClickoutside: handleClickOutside,
+            onSelectUser: addUser
+          }, null, 8, ["container-width", "empty-text", "is-show", "loading", "options", "search-query", "tenant-id", "tenants", "user-group", "user-group-name"])
+        ],
+        512
+        /* NEED_PATCH */
+      );
     };
   }
 });
-const MultipleSelector = /* @__PURE__ */ _export_sfc(_sfc_main$2, [["__scopeId", "data-v-1a376d26"]]);
-const _withScopeId = (n) => (pushScopeId("data-v-22d9b76f"), n = n(), popScopeId(), n);
+const MultipleSelector = /* @__PURE__ */ _export_sfc(_sfc_main$2, [["__scopeId", "data-v-a884849e"]]);
+const _withScopeId = (n) => (pushScopeId("data-v-ad0d9e2e"), n = n(), popScopeId(), n);
 const _hoisted_1$1 = { class: "input-container" };
 const _hoisted_2 = {
   key: 0,
@@ -3760,7 +3787,8 @@ const _sfc_main$1 = /* @__PURE__ */ defineComponent({
     currentUserId: { default: "" },
     exactSearchKey: { default: "bk_username" },
     userGroup: { default: () => [] },
-    userGroupName: { default: "用户群组" }
+    userGroupName: { default: "用户群组" },
+    emptyText: { default: "无匹配人员" }
   },
   emits: ["update:modelValue", "change"],
   setup(__props, { emit: __emit }) {
@@ -3903,6 +3931,7 @@ const _sfc_main$1 = /* @__PURE__ */ defineComponent({
         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,
@@ -3912,14 +3941,14 @@ const _sfc_main$1 = /* @__PURE__ */ defineComponent({
           "user-group": _ctx.userGroup,
           "user-group-name": _ctx.userGroupName,
           onSelectUser: addUser
-        }, null, 8, ["container-width", "is-show", "loading", "options", "search-query", "tenant-id", "tenants", "user-group", "user-group-name"])
+        }, null, 8, ["container-width", "empty-text", "is-show", "loading", "options", "search-query", "tenant-id", "tenants", "user-group", "user-group-name"])
       ])), [
         [unref(clickoutside), handleClickOutside]
       ]);
     };
   }
 });
-const SingleSelector = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["__scopeId", "data-v-22d9b76f"]]);
+const SingleSelector = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["__scopeId", "data-v-ad0d9e2e"]]);
 const _hoisted_1 = {
   ref: "containerRef",
   class: "bk-user-selector"
@@ -3939,7 +3968,8 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     currentUserId: { default: "" },
     exactSearchKey: { default: "bk_username" },
     userGroup: { default: () => [] },
-    userGroupName: { default: "用户群组" }
+    userGroupName: { default: "用户群组" },
+    emptyText: { default: "无匹配人员" }
   },
   emits: ["update:modelValue", "change"],
   setup(__props, { emit: __emit }) {
@@ -3997,6 +4027,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
             "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => selectedUser.value = $event),
             "api-base-url": _ctx.apiBaseUrl,
             "current-user-id": _ctx.currentUserId,
+            "empty-text": _ctx.emptyText,
             "exact-search-key": _ctx.exactSearchKey,
             placeholder: _ctx.placeholder,
             "tenant-id": _ctx.tenantId,
@@ -4004,7 +4035,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
             "user-group": _ctx.userGroup,
             "user-group-name": _ctx.userGroupName,
             onChange: handleUpdateUser
-          }, null, 8, ["modelValue", "api-base-url", "current-user-id", "exact-search-key", "placeholder", "tenant-id", "tenants", "user-group", "user-group-name"])) : (openBlock(), createElementBlock(
+          }, null, 8, ["modelValue", "api-base-url", "current-user-id", "empty-text", "exact-search-key", "placeholder", "tenant-id", "tenants", "user-group", "user-group-name"])) : (openBlock(), createElementBlock(
             Fragment,
             { key: 1 },
             [
@@ -4015,6 +4046,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
                 "api-base-url": _ctx.apiBaseUrl,
                 "current-user-id": _ctx.currentUserId,
                 draggable: _ctx.draggable,
+                "empty-text": _ctx.emptyText,
                 "exact-search-key": _ctx.exactSearchKey,
                 placeholder: _ctx.placeholder,
                 "selected-users": selectedUsers.value,
@@ -4023,7 +4055,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
                 "user-group": _ctx.userGroup,
                 "user-group-name": _ctx.userGroupName,
                 "onUpdate:selectedUsers": handleUpdateSelectedUsers
-              }, null, 8, ["modelValue", "api-base-url", "current-user-id", "draggable", "exact-search-key", "placeholder", "selected-users", "tenant-id", "tenants", "user-group", "user-group-name"])
+              }, null, 8, ["modelValue", "api-base-url", "current-user-id", "draggable", "empty-text", "exact-search-key", "placeholder", "selected-users", "tenant-id", "tenants", "user-group", "user-group-name"])
             ],
             2112
             /* STABLE_FRAGMENT, DEV_ROOT_FRAGMENT */
@@ -4035,7 +4067,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const BkUserSelector = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-84252deb"]]);
+const BkUserSelector = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-6fd92757"]]);
 export {
   BkUserSelector,
   BkUserSelector as default