@blueking/bk-user-selector 0.0.29-beta.6 → 0.0.29-beta.7

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@blueking/bk-user-selector",
-  "version": "0.0.29-beta.6",
+  "version": "0.0.29-beta.7",
   "description": "蓝鲸用户选择器",
   "license": "MIT",
   "author": "Tencent BlueKing",

package/vue2/index.es.min.js

@@ -14139,7 +14139,14 @@ const _sfc_main$2 = /* @__PURE__ */ defineComponent({
       return searchResults.value.filter((user) => !props2.selectedUsers.some((selectedUser) => selectedUser.id === user.id)).filter((user) => !props2.excludeUserIds.includes(user.id));
     });
     const userGroupFilter = computed(() => {
-      return props2.userGroup.filter((group) => !props2.selectedUsers.some((user) => user.id === group.id) && !group.hidden);
+      return props2.userGroup.filter((group) => {
+        var _a, _b;
+        const filtered = !props2.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 (!props2.draggable || !sortableContainerRef.value) return;
@@ -14590,7 +14597,7 @@ const _sfc_main$2 = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const MultipleSelector = /* @__PURE__ */ _export_sfc(_sfc_main$2, [["__scopeId", "data-v-7ff53892"]]);
+const MultipleSelector = /* @__PURE__ */ _export_sfc(_sfc_main$2, [["__scopeId", "data-v-1f435fc8"]]);
 const _hoisted_1 = { class: "input-container" };
 const _hoisted_2 = ["placeholder"];
 const _sfc_main$1 = /* @__PURE__ */ defineComponent({
@@ -14627,7 +14634,14 @@ const _sfc_main$1 = /* @__PURE__ */ defineComponent({
     const searchQuery = ref("");
     const showDropdown = ref(false);
     const userGroupFilter = computed(() => {
-      return props2.userGroup.filter((group) => group.id !== selectedUser.value && !group.hidden);
+      return props2.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 = (props2.userGroup || []).map((group) => ({
@@ -14810,7 +14824,7 @@ const _sfc_main$1 = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const SingleSelector = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["__scopeId", "data-v-d56195a1"]]);
+const SingleSelector = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["__scopeId", "data-v-c44a1c1d"]]);
 const _sfc_main = /* @__PURE__ */ defineComponent({
   ...{
     name: "BkUserSelector"

package/vue2/index.iife.min.js

@@ -3,7 +3,7 @@
   try {
     if (typeof document != "undefined") {
       var elementStyle = document.createElement("style");
-      elementStyle.appendChild(document.createTextNode(".scroll-bar-style::-webkit-scrollbar {\n  width: 4px;\n  height: 4px;\n}\n.scroll-bar-style::-webkit-scrollbar-thumb {\n  background: #ddd;\n  border-radius: 20px;\n  box-shadow: inset 0 0 6px rgba(204, 204, 204, 0.3);\n}\nhtml,\nbody {\n  padding: 0;\n  margin: 0;\n}\n* {\n  box-sizing: border-box;\n}\n/**\n * HTML5 display definitions\n * ==========================================================================\n *\n * Correct `block` display not defined for any HTML5 element in IE 8/9.\n * Correct `block` display not defined for `details` or `summary` in IE 10/11 and Firefox.\n * Correct `block` display not defined for `main` in IE 11.\n */\narticle,\naside,\ndetails,\nfigcaption,\nfigure,\nfooter,\nheader,\nhgroup,\nmain,\nmenu,\nnav,\nsection,\nsummary {\n  display: block;\n}\n/**\n * 1. Correct `inline-block` display not defined in IE 8/9.\n * 2. Normalize vertical alignment of `progress` in Chrome, Firefox, and Opera.\n */\naudio,\ncanvas,\nprogress,\nvideo {\n  /* 1 */\n  display: inline-block;\n  /* 2 */\n  vertical-align: baseline;\n}\n/**\n * Prevent modern browsers from displaying `audio` without controls.\n * Remove excess height in iOS 5 devices.\n */\naudio:not([controls]) {\n  display: none;\n  height: 0;\n}\n/**\n * Address `[hidden]` styling not present in IE 8/9/10.\n * Hide the `template` element in IE 8/9/10/11, Safari, and Firefox < 22.\n */\n[hidden],\ntemplate {\n  display: none;\n}\n/**\n * Links\n * ==========================================================================\n *\n * Remove the gray background color from active links in IE 10.\n */\na {\n  background-color: transparent;\n}\n/**\n * Improve readability of focused elements when they are also in an\n * active/hover state.\n */\na:active,\na:hover {\n  outline: 0;\n}\n/**\n * Text-level semantics\n * ==========================================================================\n *\n * Address styling not present in IE 8/9/10/11, Safari, and Chrome.\n */\nabbr[title] {\n  border-bottom: 1px dotted;\n}\n/**\n * Embedded content\n * ==========================================================================\n *\n * Remove border when inside `a` element in IE 8/9/10.\n */\nimg {\n  border: 0;\n}\n/**\n * Correct overflow not hidden in IE 9/10/11.\n */\nsvg:not(:root) {\n  overflow: hidden;\n}\n/**\n * Grouping content\n * ==========================================================================\n *\n * Address margin not present in IE 8/9 and Safari.\n */\nfigure {\n  margin: 1em 40px;\n}\n/**\n * Address differences between Firefox and other browsers.\n */\nhr {\n  height: 0;\n  box-sizing: content-box;\n}\n/**\n * Address odd `em`-unit font size rendering in all browsers.\n *\n * Forms\n * ==========================================================================\n *\n * Known limitation: by default, Chrome and Safari on OS X allow very limited\n * styling of `select`, unless a `border` property is set.\n *\n * 1. Correct color not being inherited.\n *    Known issue: affects color of disabled elements.\n * 2. Correct font properties not being inherited.\n * 3. Address margins set differently in Firefox 4+, Safari, and Chrome.\n */\nbutton,\ninput,\noptgroup,\nselect,\ntextarea {\n  /* 3 */\n  margin: 0;\n  /* 2 */\n  font: inherit;\n  /* 1 */\n  color: inherit;\n}\n/**\n * Address `overflow` set to `hidden` in IE 8/9/10/11.\n */\nbutton {\n  overflow: visible;\n}\n/**\n * Address inconsistent `text-transform` inheritance for `button` and `select`.\n * All other form control elements do not inherit `text-transform` values.\n * Correct `button` style inheritance in Firefox, IE 8/9/10/11, and Opera.\n * Correct `select` style inheritance in Firefox.\n */\nbutton,\nselect {\n  text-transform: none;\n}\n/**\n * 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio` and `video` controls.\n * 2. Correct inability to style clickable `input` types in iOS.\n * 3. Improve usability and consistency of cursor style between image-type `input` and others.\n */\nbutton,\nhtml input[type='button'],\ninput[type='reset'],\ninput[type='submit'] {\n  /* 3 */\n  cursor: pointer;\n  /* 2 */\n  appearance: button;\n}\n/* Re-set default cursor for disabled elements. */\nbutton[disabled],\nhtml input[disabled] {\n  cursor: default;\n}\n/* Remove inner padding and border in Firefox 4+. */\nbutton::-moz-focus-inner,\ninput::-moz-focus-inner {\n  padding: 0;\n  border: 0;\n}\n/**\n * Address Firefox 4+ setting `line-height` on `input` using `!important` in the UA stylesheet.\n */\ninput {\n  line-height: normal;\n}\n/**\n * It's recommended that you don't attempt to style these elements.\n * Firefox's implementation doesn't respect box-sizing, padding, or width.\n *\n * 1. Address box sizing set to `content-box` in IE 8/9/10.\n * 2. Remove excess padding in IE 8/9/10.\n */\ninput[type='checkbox'],\ninput[type='radio'] {\n  /* 2 */\n  padding: 0;\n  /* 1 */\n  box-sizing: border-box;\n}\n/**\n * Fix the cursor style for Chrome's increment/decrement buttons. For certain\n * `font-size` values of the `input`, it causes the cursor style of the\n * decrement button to change from `default` to `text`.\n */\ninput[type='number']::-webkit-inner-spin-button,\ninput[type='number']::-webkit-outer-spin-button {\n  height: auto;\n}\n::-ms-clear,\n::-ms-reveal {\n  display: none;\n}\ninput[type='text']::-ms-clear {\n  display: none;\n}\ninput[type='text']::-ms-reveal {\n  display: none;\n}\n/**\n * 1. Address `appearance` set to `searchfield` in Safari and Chrome.\n * 2. Address `box-sizing` set to `border-box` in Safari and Chrome.\n */\ninput[type='search'] {\n  /* 2 */\n  box-sizing: content-box;\n  /* 1 */\n  appearance: textfield;\n}\n/**\n * Remove inner padding and search cancel button in Safari and Chrome on OS X.\n * Safari (but not Chrome) clips the cancel button when the search input has\n * padding (and `textfield` appearance).\n */\ninput[type='search']::-webkit-search-cancel-button,\ninput[type='search']::-webkit-search-decoration {\n  appearance: none;\n}\n/**\n * Define consistent border, margin, and padding.\n */\nfieldset {\n  padding: 0.35em 0.625em 0.75em;\n  margin: 0 2px;\n  border: 1px solid #c0c0c0;\n}\n/**\n * 1. Correct `color` not being inherited in IE 8/9/10/11.\n * 2. Remove padding so people aren't caught out if they zero out fieldsets.\n */\nlegend {\n  /* 2 */\n  padding: 0;\n  /* 1 */\n  border: 0;\n}\n/**\n * Remove default vertical scrollbar in IE 8/9/10/11.\n */\ntextarea {\n  overflow: auto;\n}\n/**\n * Don't inherit the `font-weight` (applied by a rule above).\n * NOTE: the default cannot safely be changed in Chrome and Safari on OS X.\n */\noptgroup {\n  font-weight: bold;\n}\n/**\n* BK-Scroll-Style\n*/\n.bk-scroll-y {\n  overflow-y: auto;\n}\n.bk-scroll-y::-webkit-scrollbar {\n  width: 4px;\n  height: 4px;\n}\n.bk-scroll-y::-webkit-scrollbar-thumb {\n  background: #ddd;\n  border-radius: 20px;\n  box-shadow: inset 0 0 6px rgba(204, 204, 204, 0.3);\n}\n.bk-scroll-x {\n  overflow-x: auto;\n}\n.bk-scroll-x::-webkit-scrollbar {\n  width: 4px;\n  height: 4px;\n}\n.bk-scroll-x::-webkit-scrollbar-thumb {\n  background: #ddd;\n  border-radius: 20px;\n  box-shadow: inset 0 0 6px rgba(204, 204, 204, 0.3);\n}\n@keyframes loading-scale-animate {\n  0% {\n    transform: scale(1);\n  }\n  100% {\n    transform: scale(0.6);\n  }\n}\n@keyframes fade {\n  100% {\n    background-color: transparent;\n  }\n}\n.bk-user-selector-transition .bk-user-selector-fade-enter-active,\n.bk-user-selector-transition .bk-user-selector-fade-leave-active {\n  transition: all 0.3s cubic-bezier(0.55, 0, 0.1, 1);\n}\n.bk-user-selector-transition .bk-user-selector-fade-enter,\n.bk-user-selector-transition .bk-user-selector-fade-leave-to {\n  opacity: 0;\n}\n.clearfix-style::after {\n  display: block;\n  height: 0;\n  clear: both;\n  font-size: 0;\n  content: '';\n  visibility: hidden;\n}\n.bk-user-selector-popper {\n  display: none;\n  padding: 7px 14px;\n  font-size: 12px;\n  color: #fff;\n  background: #333;\n  border-radius: 4px;\n}\n.bk-user-selector-popper.light {\n  color: #63656e;\n  background: #fff;\n  box-shadow: #dcdee5 0 0 6px 0;\n}\n.bk-user-selector-popper .bk-user-selector-popper-arrow,\n.bk-user-selector-popper .bk-user-selector-popper-arrow::before {\n  position: absolute;\n  width: 8px;\n  height: 8px;\n  background: inherit;\n}\n.bk-user-selector-popper .bk-user-selector-popper-arrow {\n  visibility: hidden;\n}\n.bk-user-selector-popper .bk-user-selector-popper-arrow::before {\n  content: '';\n  visibility: visible;\n  transform: rotate(45deg);\n}\n.bk-user-selector-popper[data-show] {\n  display: block;\n}\n.bk-user-selector-popper[data-popper-placement^='top'] > .bk-user-selector-popper-arrow {\n  bottom: -4px;\n}\n.bk-user-selector-popper[data-popper-placement^='bottom'] > .bk-user-selector-popper-arrow {\n  top: -4px;\n}\n.bk-user-selector-popper[data-popper-placement^='left'] > .bk-user-selector-popper-arrow {\n  right: -4px;\n}\n.bk-user-selector-popper[data-popper-placement^='right'] > .bk-user-selector-popper-arrow {\n  left: -4px;\n}\n.bk-user-selector-loading-wrapper {\n  position: static;\n  vertical-align: middle;\n}\n.bk-user-selector-loading-wrapper:not(.bk-user-selector-nested-loading):not(.bk-user-selector-directive-loading) {\n  display: inline-flex;\n}\n.bk-user-selector-loading-wrapper.bk-user-selector-directive-loading {\n  width: 100%;\n  height: 100%;\n}\n.bk-user-selector-loading-wrapper.bk-user-selector-directive-loading,\n.bk-user-selector-loading-wrapper.bk-user-selector-nested-loading {\n  position: relative;\n}\n.bk-user-selector-loading-wrapper.bk-user-selector-directive-loading.is-block,\n.bk-user-selector-loading-wrapper.bk-user-selector-nested-loading.is-block {\n  display: block;\n}\n.bk-user-selector-loading-wrapper.bk-user-selector-directive-loading .bk-user-selector-loading-indicator,\n.bk-user-selector-loading-wrapper.bk-user-selector-nested-loading .bk-user-selector-loading-indicator {\n  position: absolute;\n  top: 50%;\n  left: 50%;\n  z-index: 11;\n  text-align: center;\n  transform: translate(-50%, -50%);\n}\n.bk-user-selector-loading-wrapper .dot {\n  display: inline-flex;\n  width: 14px;\n  height: 14px;\n  margin-right: 10px;\n  border-radius: 50%;\n  transform: scale(0.6);\n  animation-duration: 0.8s;\n  animation-iteration-count: infinite;\n  animation-name: loading-scale-animate;\n  animation-direction: normal;\n}\n.bk-user-selector-loading-wrapper .oval {\n  position: absolute;\n  width: 6px;\n  height: 8px;\n  background-color: #63656e;\n  border-radius: 8px;\n  animation-duration: 1.2s;\n  animation-iteration-count: infinite;\n  animation-name: fade;\n  transform-origin: center 24px;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-mask {\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator {\n  display: flex;\n  line-height: 1;\n  text-align: center;\n  flex-direction: column;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-success .oval,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-success .dot,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-success .dot-1,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-success .dot-2,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-success .dot-3,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-success .dot-4 {\n  background-color: #2dcb56;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-danger .oval,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-danger .dot,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-danger .dot-1,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-danger .dot-2,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-danger .dot-3,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-danger .dot-4 {\n  background-color: #ea3636;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-warning .oval,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-warning .dot,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-warning .dot-1,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-warning .dot-2,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-warning .dot-3,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-warning .dot-4 {\n  background-color: #ff9c01;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-primary .oval,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-primary .dot,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-primary .dot-1,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-primary .dot-2,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-primary .dot-3,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-primary .dot-4 {\n  background-color: #3a84ff;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-white .oval,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-white .dot,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-white .dot-1,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-white .dot-2,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-white .dot-3,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-white .dot-4 {\n  background-color: white;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-default .oval,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-default .dot,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-default .dot-1,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-default .dot-2,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-default .dot-3,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-default .dot-4 {\n  background-color: #c4c6cc;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator .dot-1 {\n  background-color: #ea3636;\n  animation-delay: 0.1s;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator .dot-2 {\n  background-color: #ff9c01;\n  animation-delay: 0.25s;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator .dot-3 {\n  background-color: #2dcb56;\n  animation-delay: 0.4s;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator .dot-4 {\n  background-color: #3a84ff;\n  animation-delay: 0.55s;\n  margin-right: 0px;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator .oval-1 {\n  transform: rotate(135deg);\n  animation-delay: -0.45s;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator .oval-2 {\n  transform: rotate(90deg);\n  animation-delay: -0.6s;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator .oval-3 {\n  transform: rotate(45deg);\n  animation-delay: -0.75s;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator .oval-4 {\n  transform: rotate(0deg);\n  animation-delay: -0.9s;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator .oval-5 {\n  transform: rotate(-45deg);\n  animation-delay: -1.05s;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator .oval-6 {\n  transform: rotate(-90deg);\n  animation-delay: -1.2s;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator .oval-7 {\n  transform: rotate(-135deg);\n  animation-delay: -1.35s;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator .oval-8 {\n  transform: rotate(-180deg);\n  animation-delay: -1.5s;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator .bk-user-selector-normal-indicator {\n  display: inline-flex;\n  justify-content: center;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator .bk-user-selector-spin-indicator {\n  position: relative;\n  display: inline-flex;\n  justify-content: center;\n  width: 48px;\n  height: 48px;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-size-mini .bk-user-selector-spin-indicator {\n  height: 16px;\n  width: 16px;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-size-mini .dot {\n  width: 3px;\n  height: 3px;\n  margin-right: 3px;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-size-mini .dot.dot-4 {\n  margin-right: 0;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-size-mini .oval {\n  width: 2px;\n  height: 3px;\n  border-radius: 3px;\n  transform-origin: center 8px;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-size-mini .bk-user-selector-loading-title {\n  font-size: 14px;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-size-small .bk-user-selector-spin-indicator {\n  height: 32px;\n  width: 32px;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-size-small .dot {\n  width: 6px;\n  height: 6px;\n  margin-right: 6px;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-size-small .dot.dot-4 {\n  margin-right: 0;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-size-small .oval {\n  width: 4px;\n  height: 5px;\n  border-radius: 5px;\n  transform-origin: center 16px;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-size-small .bk-user-selector-loading-title {\n  font-size: 12px;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-size-large .bk-user-selector-spin-indicator {\n  height: 68px;\n  width: 68px;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-size-large .dot {\n  width: 20px;\n  height: 20px;\n  margin-right: 12px;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-size-large .dot.dot-4 {\n  margin-right: 0;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-size-large .oval {\n  width: 8px;\n  height: 12px;\n  border-radius: 12px;\n  transform-origin: center 34px;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-size-large .bk-user-selector-loading-title {\n  font-size: 14px;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator .bk-user-selector-loading-title {\n  margin-top: 8px;\n  font-size: 14px;\n  line-height: normal;\n  color: #63656e;\n  text-align: center;\n}\n.bk-user-selector-popover.bk-user-selector-pop2-content {\n  position: absolute;\n  padding: 12px;\n  font-size: 12px;\n  color: #fff;\n  background: #26323d;\n  border-radius: 4px;\n  box-sizing: border-box;\n}\n.bk-user-selector-popover.bk-user-selector-pop2-content.hidden {\n  display: none;\n}\n.bk-user-selector-popover.bk-user-selector-pop2-content .bk-user-selector-pop2-arrow {\n  position: absolute;\n  z-index: -1;\n  width: 8px;\n  height: 8px;\n  background: #333;\n  transform: rotate(45deg);\n}\n.bk-user-selector-popover.bk-user-selector-pop2-content[data-theme^='light'] {\n  color: #26323d;\n  background-color: #fff;\n  box-shadow: 0 0 6px 0 #dcdee5;\n}\n.bk-user-selector-popover.bk-user-selector-pop2-content[data-theme^='light'] .bk-user-selector-pop2-arrow {\n  background-color: #fff;\n}\n.text-ov {\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n.position-relative {\n  position: relative;\n}\n.position-absolute {\n  position: absolute;\n}\n.overflow-popover-reference {\n  width: 100%;\n}\n.bk-user-selector-tag {\n  display: inline-flex;\n  align-items: center;\n  height: 22px;\n  padding: 0 10px;\n  font-size: 12px;\n  line-height: 22px;\n  color: #63656e;\n  cursor: default;\n  background-color: #f0f1f5;\n  border-color: rgba(151, 155, 165, 0.3);\n  box-sizing: border-box;\n}\n.bk-user-selector-tag.bk-user-selector-tag-success {\n  color: #14a568;\n  border-color: rgba(20, 165, 104, 0.3);\n  background-color: #E4FAF0;\n}\n.bk-user-selector-tag.bk-user-selector-tag-success.bk-user-selector-tag-filled {\n  background-color: #14A568;\n}\n.bk-user-selector-tag.bk-user-selector-tag-success.bk-user-selector-tag-filled:hover {\n  background-color: #42B685;\n}\n.bk-user-selector-tag.bk-user-selector-tag-success:hover:not(.bk-user-selector-tag-filled) {\n  background-color: #C9F5E2;\n}\n.bk-user-selector-tag.bk-user-selector-tag-info {\n  color: #3a84ff;\n  border-color: rgba(58, 132, 255, 0.3);\n  background-color: #EDF4FF;\n}\n.bk-user-selector-tag.bk-user-selector-tag-info.bk-user-selector-tag-filled {\n  background-color: #3A84FF;\n}\n.bk-user-selector-tag.bk-user-selector-tag-info.bk-user-selector-tag-filled:hover {\n  background-color: #609CFE;\n}\n.bk-user-selector-tag.bk-user-selector-tag-info:hover:not(.bk-user-selector-tag-filled) {\n  background-color: #E1ECFF;\n}\n.bk-user-selector-tag.bk-user-selector-tag-warning {\n  color: #fe9c00;\n  border-color: rgba(254, 165, 0, 0.3);\n  background-color: #FFF1DB;\n}\n.bk-user-selector-tag.bk-user-selector-tag-warning.bk-user-selector-tag-filled {\n  background-color: #FE9C00;\n}\n.bk-user-selector-tag.bk-user-selector-tag-warning.bk-user-selector-tag-filled:hover {\n  background-color: #FDAF32;\n}\n.bk-user-selector-tag.bk-user-selector-tag-warning:hover:not(.bk-user-selector-tag-filled) {\n  background-color: #FFE8C3;\n}\n.bk-user-selector-tag.bk-user-selector-tag-danger {\n  color: #ea3636;\n  border-color: rgba(234, 53, 54, 0.3);\n  background-color: #FEEBEA;\n}\n.bk-user-selector-tag.bk-user-selector-tag-danger.bk-user-selector-tag-filled {\n  background-color: #EA3536;\n}\n.bk-user-selector-tag.bk-user-selector-tag-danger.bk-user-selector-tag-filled:hover {\n  background-color: #ED5C5D;\n}\n.bk-user-selector-tag.bk-user-selector-tag-danger:hover:not(.bk-user-selector-tag-filled) {\n  background-color: #FEDDDC;\n}\n.bk-user-selector-tag:hover {\n  background-color: #dcdee5;\n}\n.bk-user-selector-tag.bk-user-selector-tag-filled {\n  color: #fff;\n  background-color: #979BA5;\n}\n.bk-user-selector-tag.bk-user-selector-tag-filled:hover {\n  background-color: #ACAFB6;\n}\n.bk-user-selector-tag.bk-user-selector-tag-stroke {\n  padding: 0 9px;\n  line-height: 20px;\n  border-style: solid;\n  border-width: 1px;\n}\n.bk-user-selector-tag.bk-user-selector-tag-closable {\n  padding: 0 4px 0 10px;\n}\n.bk-user-selector-tag.bk-user-selector-tag-checkable {\n  cursor: pointer;\n  background: none;\n}\n.bk-user-selector-tag.bk-user-selector-tag-checkable:hover {\n  background: #F0F1F5;\n}\n.bk-user-selector-tag.bk-user-selector-tag-check {\n  color: #fff;\n  background: #3a84ff;\n}\n.bk-user-selector-tag.bk-user-selector-tag-check:hover {\n  color: #fff;\n  background: #3a84ff;\n  opacity: 1;\n}\n.bk-user-selector-tag--default {\n  padding: 0 8px;\n}\n.bk-user-selector-tag--small {\n  height: 16px;\n  padding: 0 4px;\n  line-height: 16px;\n}\n.bk-user-selector-tag--small .bk-user-selector-tag-text {\n  font-size: 10px;\n}\n.bk-user-selector-tag-text {\n  flex: 1;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n.bk-user-selector-tag-icon {\n  flex-shrink: 0;\n  margin-right: 4px;\n  font-size: 14px;\n  line-height: 0;\n}\n.bk-user-selector-tag-close {\n  flex-shrink: 0;\n  margin-left: 4px;\n  font-size: 12px;\n  line-height: 0;\n  cursor: pointer;\n}\n.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-a4132257] {\n  min-height: 40px;\n  max-height: 300px;\n  padding: 5px 0;\n  overflow-y: auto;\n}\n.dropdown-content .no-data[data-v-a4132257] {\n  padding: 10px;\n  color: #979ba5;\n  text-align: center;\n}\n.dropdown-content .user-group .group-header[data-v-a4132257] {\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-a4132257] {\n  margin-left: 4px;\n}\n.dropdown-content .user-option[data-v-a4132257] {\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-a4132257]: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-7ff53892] {\n  position: relative;\n  width: 100%;\n}\n.multiple-selector.is-disabled[data-v-7ff53892] {\n  pointer-events: none;\n}\n.multiple-selector .tags-container[data-v-7ff53892] {\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-7ff53892] {\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-7ff53892] {\n  display: flex;\n  flex-wrap: wrap;\n  align-items: center;\n}\n.multiple-selector .tag-list[data-v-7ff53892] {\n  display: flex;\n  flex-wrap: wrap;\n  align-items: center;\n}\n.multiple-selector .tag-wrapper[data-v-7ff53892] {\n  display: inline-flex;\n  align-items: center;\n  max-width: 100%;\n}\n.multiple-selector .search-input[data-v-7ff53892] {\n  min-width: 10px;\n  height: 28px;\n  background: transparent;\n  border: none;\n  outline: none;\n}\n.multiple-selector .search-input[data-v-7ff53892]::placeholder {\n  color: #c4c6cc;\n}\n.multiple-selector .search-input.inline[data-v-7ff53892] {\n  min-width: 10px;\n}\n.multiple-selector .search-input.last[data-v-7ff53892], .multiple-selector .search-input.collapsed[data-v-7ff53892] {\n  flex: 1;\n  min-width: 60px;\n}.single-selector[data-v-d56195a1] {\n  position: relative;\n  width: 100%;\n}\n.single-selector.is-disabled[data-v-d56195a1] {\n  pointer-events: none;\n}\n.input-container[data-v-d56195a1] {\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-d56195a1]: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-d56195a1] {\n  flex: 1;\n  height: 30px;\n  background: transparent;\n  border: none;\n  outline: none;\n}\n.search-input[data-v-d56195a1]::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}"));
+      elementStyle.appendChild(document.createTextNode(".scroll-bar-style::-webkit-scrollbar {\n  width: 4px;\n  height: 4px;\n}\n.scroll-bar-style::-webkit-scrollbar-thumb {\n  background: #ddd;\n  border-radius: 20px;\n  box-shadow: inset 0 0 6px rgba(204, 204, 204, 0.3);\n}\nhtml,\nbody {\n  padding: 0;\n  margin: 0;\n}\n* {\n  box-sizing: border-box;\n}\n/**\n * HTML5 display definitions\n * ==========================================================================\n *\n * Correct `block` display not defined for any HTML5 element in IE 8/9.\n * Correct `block` display not defined for `details` or `summary` in IE 10/11 and Firefox.\n * Correct `block` display not defined for `main` in IE 11.\n */\narticle,\naside,\ndetails,\nfigcaption,\nfigure,\nfooter,\nheader,\nhgroup,\nmain,\nmenu,\nnav,\nsection,\nsummary {\n  display: block;\n}\n/**\n * 1. Correct `inline-block` display not defined in IE 8/9.\n * 2. Normalize vertical alignment of `progress` in Chrome, Firefox, and Opera.\n */\naudio,\ncanvas,\nprogress,\nvideo {\n  /* 1 */\n  display: inline-block;\n  /* 2 */\n  vertical-align: baseline;\n}\n/**\n * Prevent modern browsers from displaying `audio` without controls.\n * Remove excess height in iOS 5 devices.\n */\naudio:not([controls]) {\n  display: none;\n  height: 0;\n}\n/**\n * Address `[hidden]` styling not present in IE 8/9/10.\n * Hide the `template` element in IE 8/9/10/11, Safari, and Firefox < 22.\n */\n[hidden],\ntemplate {\n  display: none;\n}\n/**\n * Links\n * ==========================================================================\n *\n * Remove the gray background color from active links in IE 10.\n */\na {\n  background-color: transparent;\n}\n/**\n * Improve readability of focused elements when they are also in an\n * active/hover state.\n */\na:active,\na:hover {\n  outline: 0;\n}\n/**\n * Text-level semantics\n * ==========================================================================\n *\n * Address styling not present in IE 8/9/10/11, Safari, and Chrome.\n */\nabbr[title] {\n  border-bottom: 1px dotted;\n}\n/**\n * Embedded content\n * ==========================================================================\n *\n * Remove border when inside `a` element in IE 8/9/10.\n */\nimg {\n  border: 0;\n}\n/**\n * Correct overflow not hidden in IE 9/10/11.\n */\nsvg:not(:root) {\n  overflow: hidden;\n}\n/**\n * Grouping content\n * ==========================================================================\n *\n * Address margin not present in IE 8/9 and Safari.\n */\nfigure {\n  margin: 1em 40px;\n}\n/**\n * Address differences between Firefox and other browsers.\n */\nhr {\n  height: 0;\n  box-sizing: content-box;\n}\n/**\n * Address odd `em`-unit font size rendering in all browsers.\n *\n * Forms\n * ==========================================================================\n *\n * Known limitation: by default, Chrome and Safari on OS X allow very limited\n * styling of `select`, unless a `border` property is set.\n *\n * 1. Correct color not being inherited.\n *    Known issue: affects color of disabled elements.\n * 2. Correct font properties not being inherited.\n * 3. Address margins set differently in Firefox 4+, Safari, and Chrome.\n */\nbutton,\ninput,\noptgroup,\nselect,\ntextarea {\n  /* 3 */\n  margin: 0;\n  /* 2 */\n  font: inherit;\n  /* 1 */\n  color: inherit;\n}\n/**\n * Address `overflow` set to `hidden` in IE 8/9/10/11.\n */\nbutton {\n  overflow: visible;\n}\n/**\n * Address inconsistent `text-transform` inheritance for `button` and `select`.\n * All other form control elements do not inherit `text-transform` values.\n * Correct `button` style inheritance in Firefox, IE 8/9/10/11, and Opera.\n * Correct `select` style inheritance in Firefox.\n */\nbutton,\nselect {\n  text-transform: none;\n}\n/**\n * 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio` and `video` controls.\n * 2. Correct inability to style clickable `input` types in iOS.\n * 3. Improve usability and consistency of cursor style between image-type `input` and others.\n */\nbutton,\nhtml input[type='button'],\ninput[type='reset'],\ninput[type='submit'] {\n  /* 3 */\n  cursor: pointer;\n  /* 2 */\n  appearance: button;\n}\n/* Re-set default cursor for disabled elements. */\nbutton[disabled],\nhtml input[disabled] {\n  cursor: default;\n}\n/* Remove inner padding and border in Firefox 4+. */\nbutton::-moz-focus-inner,\ninput::-moz-focus-inner {\n  padding: 0;\n  border: 0;\n}\n/**\n * Address Firefox 4+ setting `line-height` on `input` using `!important` in the UA stylesheet.\n */\ninput {\n  line-height: normal;\n}\n/**\n * It's recommended that you don't attempt to style these elements.\n * Firefox's implementation doesn't respect box-sizing, padding, or width.\n *\n * 1. Address box sizing set to `content-box` in IE 8/9/10.\n * 2. Remove excess padding in IE 8/9/10.\n */\ninput[type='checkbox'],\ninput[type='radio'] {\n  /* 2 */\n  padding: 0;\n  /* 1 */\n  box-sizing: border-box;\n}\n/**\n * Fix the cursor style for Chrome's increment/decrement buttons. For certain\n * `font-size` values of the `input`, it causes the cursor style of the\n * decrement button to change from `default` to `text`.\n */\ninput[type='number']::-webkit-inner-spin-button,\ninput[type='number']::-webkit-outer-spin-button {\n  height: auto;\n}\n::-ms-clear,\n::-ms-reveal {\n  display: none;\n}\ninput[type='text']::-ms-clear {\n  display: none;\n}\ninput[type='text']::-ms-reveal {\n  display: none;\n}\n/**\n * 1. Address `appearance` set to `searchfield` in Safari and Chrome.\n * 2. Address `box-sizing` set to `border-box` in Safari and Chrome.\n */\ninput[type='search'] {\n  /* 2 */\n  box-sizing: content-box;\n  /* 1 */\n  appearance: textfield;\n}\n/**\n * Remove inner padding and search cancel button in Safari and Chrome on OS X.\n * Safari (but not Chrome) clips the cancel button when the search input has\n * padding (and `textfield` appearance).\n */\ninput[type='search']::-webkit-search-cancel-button,\ninput[type='search']::-webkit-search-decoration {\n  appearance: none;\n}\n/**\n * Define consistent border, margin, and padding.\n */\nfieldset {\n  padding: 0.35em 0.625em 0.75em;\n  margin: 0 2px;\n  border: 1px solid #c0c0c0;\n}\n/**\n * 1. Correct `color` not being inherited in IE 8/9/10/11.\n * 2. Remove padding so people aren't caught out if they zero out fieldsets.\n */\nlegend {\n  /* 2 */\n  padding: 0;\n  /* 1 */\n  border: 0;\n}\n/**\n * Remove default vertical scrollbar in IE 8/9/10/11.\n */\ntextarea {\n  overflow: auto;\n}\n/**\n * Don't inherit the `font-weight` (applied by a rule above).\n * NOTE: the default cannot safely be changed in Chrome and Safari on OS X.\n */\noptgroup {\n  font-weight: bold;\n}\n/**\n* BK-Scroll-Style\n*/\n.bk-scroll-y {\n  overflow-y: auto;\n}\n.bk-scroll-y::-webkit-scrollbar {\n  width: 4px;\n  height: 4px;\n}\n.bk-scroll-y::-webkit-scrollbar-thumb {\n  background: #ddd;\n  border-radius: 20px;\n  box-shadow: inset 0 0 6px rgba(204, 204, 204, 0.3);\n}\n.bk-scroll-x {\n  overflow-x: auto;\n}\n.bk-scroll-x::-webkit-scrollbar {\n  width: 4px;\n  height: 4px;\n}\n.bk-scroll-x::-webkit-scrollbar-thumb {\n  background: #ddd;\n  border-radius: 20px;\n  box-shadow: inset 0 0 6px rgba(204, 204, 204, 0.3);\n}\n@keyframes loading-scale-animate {\n  0% {\n    transform: scale(1);\n  }\n  100% {\n    transform: scale(0.6);\n  }\n}\n@keyframes fade {\n  100% {\n    background-color: transparent;\n  }\n}\n.bk-user-selector-transition .bk-user-selector-fade-enter-active,\n.bk-user-selector-transition .bk-user-selector-fade-leave-active {\n  transition: all 0.3s cubic-bezier(0.55, 0, 0.1, 1);\n}\n.bk-user-selector-transition .bk-user-selector-fade-enter,\n.bk-user-selector-transition .bk-user-selector-fade-leave-to {\n  opacity: 0;\n}\n.clearfix-style::after {\n  display: block;\n  height: 0;\n  clear: both;\n  font-size: 0;\n  content: '';\n  visibility: hidden;\n}\n.bk-user-selector-popper {\n  display: none;\n  padding: 7px 14px;\n  font-size: 12px;\n  color: #fff;\n  background: #333;\n  border-radius: 4px;\n}\n.bk-user-selector-popper.light {\n  color: #63656e;\n  background: #fff;\n  box-shadow: #dcdee5 0 0 6px 0;\n}\n.bk-user-selector-popper .bk-user-selector-popper-arrow,\n.bk-user-selector-popper .bk-user-selector-popper-arrow::before {\n  position: absolute;\n  width: 8px;\n  height: 8px;\n  background: inherit;\n}\n.bk-user-selector-popper .bk-user-selector-popper-arrow {\n  visibility: hidden;\n}\n.bk-user-selector-popper .bk-user-selector-popper-arrow::before {\n  content: '';\n  visibility: visible;\n  transform: rotate(45deg);\n}\n.bk-user-selector-popper[data-show] {\n  display: block;\n}\n.bk-user-selector-popper[data-popper-placement^='top'] > .bk-user-selector-popper-arrow {\n  bottom: -4px;\n}\n.bk-user-selector-popper[data-popper-placement^='bottom'] > .bk-user-selector-popper-arrow {\n  top: -4px;\n}\n.bk-user-selector-popper[data-popper-placement^='left'] > .bk-user-selector-popper-arrow {\n  right: -4px;\n}\n.bk-user-selector-popper[data-popper-placement^='right'] > .bk-user-selector-popper-arrow {\n  left: -4px;\n}\n.bk-user-selector-loading-wrapper {\n  position: static;\n  vertical-align: middle;\n}\n.bk-user-selector-loading-wrapper:not(.bk-user-selector-nested-loading):not(.bk-user-selector-directive-loading) {\n  display: inline-flex;\n}\n.bk-user-selector-loading-wrapper.bk-user-selector-directive-loading {\n  width: 100%;\n  height: 100%;\n}\n.bk-user-selector-loading-wrapper.bk-user-selector-directive-loading,\n.bk-user-selector-loading-wrapper.bk-user-selector-nested-loading {\n  position: relative;\n}\n.bk-user-selector-loading-wrapper.bk-user-selector-directive-loading.is-block,\n.bk-user-selector-loading-wrapper.bk-user-selector-nested-loading.is-block {\n  display: block;\n}\n.bk-user-selector-loading-wrapper.bk-user-selector-directive-loading .bk-user-selector-loading-indicator,\n.bk-user-selector-loading-wrapper.bk-user-selector-nested-loading .bk-user-selector-loading-indicator {\n  position: absolute;\n  top: 50%;\n  left: 50%;\n  z-index: 11;\n  text-align: center;\n  transform: translate(-50%, -50%);\n}\n.bk-user-selector-loading-wrapper .dot {\n  display: inline-flex;\n  width: 14px;\n  height: 14px;\n  margin-right: 10px;\n  border-radius: 50%;\n  transform: scale(0.6);\n  animation-duration: 0.8s;\n  animation-iteration-count: infinite;\n  animation-name: loading-scale-animate;\n  animation-direction: normal;\n}\n.bk-user-selector-loading-wrapper .oval {\n  position: absolute;\n  width: 6px;\n  height: 8px;\n  background-color: #63656e;\n  border-radius: 8px;\n  animation-duration: 1.2s;\n  animation-iteration-count: infinite;\n  animation-name: fade;\n  transform-origin: center 24px;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-mask {\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator {\n  display: flex;\n  line-height: 1;\n  text-align: center;\n  flex-direction: column;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-success .oval,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-success .dot,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-success .dot-1,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-success .dot-2,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-success .dot-3,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-success .dot-4 {\n  background-color: #2dcb56;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-danger .oval,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-danger .dot,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-danger .dot-1,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-danger .dot-2,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-danger .dot-3,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-danger .dot-4 {\n  background-color: #ea3636;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-warning .oval,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-warning .dot,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-warning .dot-1,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-warning .dot-2,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-warning .dot-3,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-warning .dot-4 {\n  background-color: #ff9c01;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-primary .oval,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-primary .dot,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-primary .dot-1,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-primary .dot-2,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-primary .dot-3,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-primary .dot-4 {\n  background-color: #3a84ff;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-white .oval,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-white .dot,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-white .dot-1,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-white .dot-2,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-white .dot-3,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-white .dot-4 {\n  background-color: white;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-default .oval,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-default .dot,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-default .dot-1,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-default .dot-2,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-default .dot-3,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-default .dot-4 {\n  background-color: #c4c6cc;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator .dot-1 {\n  background-color: #ea3636;\n  animation-delay: 0.1s;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator .dot-2 {\n  background-color: #ff9c01;\n  animation-delay: 0.25s;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator .dot-3 {\n  background-color: #2dcb56;\n  animation-delay: 0.4s;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator .dot-4 {\n  background-color: #3a84ff;\n  animation-delay: 0.55s;\n  margin-right: 0px;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator .oval-1 {\n  transform: rotate(135deg);\n  animation-delay: -0.45s;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator .oval-2 {\n  transform: rotate(90deg);\n  animation-delay: -0.6s;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator .oval-3 {\n  transform: rotate(45deg);\n  animation-delay: -0.75s;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator .oval-4 {\n  transform: rotate(0deg);\n  animation-delay: -0.9s;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator .oval-5 {\n  transform: rotate(-45deg);\n  animation-delay: -1.05s;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator .oval-6 {\n  transform: rotate(-90deg);\n  animation-delay: -1.2s;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator .oval-7 {\n  transform: rotate(-135deg);\n  animation-delay: -1.35s;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator .oval-8 {\n  transform: rotate(-180deg);\n  animation-delay: -1.5s;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator .bk-user-selector-normal-indicator {\n  display: inline-flex;\n  justify-content: center;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator .bk-user-selector-spin-indicator {\n  position: relative;\n  display: inline-flex;\n  justify-content: center;\n  width: 48px;\n  height: 48px;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-size-mini .bk-user-selector-spin-indicator {\n  height: 16px;\n  width: 16px;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-size-mini .dot {\n  width: 3px;\n  height: 3px;\n  margin-right: 3px;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-size-mini .dot.dot-4 {\n  margin-right: 0;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-size-mini .oval {\n  width: 2px;\n  height: 3px;\n  border-radius: 3px;\n  transform-origin: center 8px;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-size-mini .bk-user-selector-loading-title {\n  font-size: 14px;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-size-small .bk-user-selector-spin-indicator {\n  height: 32px;\n  width: 32px;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-size-small .dot {\n  width: 6px;\n  height: 6px;\n  margin-right: 6px;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-size-small .dot.dot-4 {\n  margin-right: 0;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-size-small .oval {\n  width: 4px;\n  height: 5px;\n  border-radius: 5px;\n  transform-origin: center 16px;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-size-small .bk-user-selector-loading-title {\n  font-size: 12px;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-size-large .bk-user-selector-spin-indicator {\n  height: 68px;\n  width: 68px;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-size-large .dot {\n  width: 20px;\n  height: 20px;\n  margin-right: 12px;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-size-large .dot.dot-4 {\n  margin-right: 0;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-size-large .oval {\n  width: 8px;\n  height: 12px;\n  border-radius: 12px;\n  transform-origin: center 34px;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-size-large .bk-user-selector-loading-title {\n  font-size: 14px;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator .bk-user-selector-loading-title {\n  margin-top: 8px;\n  font-size: 14px;\n  line-height: normal;\n  color: #63656e;\n  text-align: center;\n}\n.bk-user-selector-popover.bk-user-selector-pop2-content {\n  position: absolute;\n  padding: 12px;\n  font-size: 12px;\n  color: #fff;\n  background: #26323d;\n  border-radius: 4px;\n  box-sizing: border-box;\n}\n.bk-user-selector-popover.bk-user-selector-pop2-content.hidden {\n  display: none;\n}\n.bk-user-selector-popover.bk-user-selector-pop2-content .bk-user-selector-pop2-arrow {\n  position: absolute;\n  z-index: -1;\n  width: 8px;\n  height: 8px;\n  background: #333;\n  transform: rotate(45deg);\n}\n.bk-user-selector-popover.bk-user-selector-pop2-content[data-theme^='light'] {\n  color: #26323d;\n  background-color: #fff;\n  box-shadow: 0 0 6px 0 #dcdee5;\n}\n.bk-user-selector-popover.bk-user-selector-pop2-content[data-theme^='light'] .bk-user-selector-pop2-arrow {\n  background-color: #fff;\n}\n.text-ov {\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n.position-relative {\n  position: relative;\n}\n.position-absolute {\n  position: absolute;\n}\n.overflow-popover-reference {\n  width: 100%;\n}\n.bk-user-selector-tag {\n  display: inline-flex;\n  align-items: center;\n  height: 22px;\n  padding: 0 10px;\n  font-size: 12px;\n  line-height: 22px;\n  color: #63656e;\n  cursor: default;\n  background-color: #f0f1f5;\n  border-color: rgba(151, 155, 165, 0.3);\n  box-sizing: border-box;\n}\n.bk-user-selector-tag.bk-user-selector-tag-success {\n  color: #14a568;\n  border-color: rgba(20, 165, 104, 0.3);\n  background-color: #E4FAF0;\n}\n.bk-user-selector-tag.bk-user-selector-tag-success.bk-user-selector-tag-filled {\n  background-color: #14A568;\n}\n.bk-user-selector-tag.bk-user-selector-tag-success.bk-user-selector-tag-filled:hover {\n  background-color: #42B685;\n}\n.bk-user-selector-tag.bk-user-selector-tag-success:hover:not(.bk-user-selector-tag-filled) {\n  background-color: #C9F5E2;\n}\n.bk-user-selector-tag.bk-user-selector-tag-info {\n  color: #3a84ff;\n  border-color: rgba(58, 132, 255, 0.3);\n  background-color: #EDF4FF;\n}\n.bk-user-selector-tag.bk-user-selector-tag-info.bk-user-selector-tag-filled {\n  background-color: #3A84FF;\n}\n.bk-user-selector-tag.bk-user-selector-tag-info.bk-user-selector-tag-filled:hover {\n  background-color: #609CFE;\n}\n.bk-user-selector-tag.bk-user-selector-tag-info:hover:not(.bk-user-selector-tag-filled) {\n  background-color: #E1ECFF;\n}\n.bk-user-selector-tag.bk-user-selector-tag-warning {\n  color: #fe9c00;\n  border-color: rgba(254, 165, 0, 0.3);\n  background-color: #FFF1DB;\n}\n.bk-user-selector-tag.bk-user-selector-tag-warning.bk-user-selector-tag-filled {\n  background-color: #FE9C00;\n}\n.bk-user-selector-tag.bk-user-selector-tag-warning.bk-user-selector-tag-filled:hover {\n  background-color: #FDAF32;\n}\n.bk-user-selector-tag.bk-user-selector-tag-warning:hover:not(.bk-user-selector-tag-filled) {\n  background-color: #FFE8C3;\n}\n.bk-user-selector-tag.bk-user-selector-tag-danger {\n  color: #ea3636;\n  border-color: rgba(234, 53, 54, 0.3);\n  background-color: #FEEBEA;\n}\n.bk-user-selector-tag.bk-user-selector-tag-danger.bk-user-selector-tag-filled {\n  background-color: #EA3536;\n}\n.bk-user-selector-tag.bk-user-selector-tag-danger.bk-user-selector-tag-filled:hover {\n  background-color: #ED5C5D;\n}\n.bk-user-selector-tag.bk-user-selector-tag-danger:hover:not(.bk-user-selector-tag-filled) {\n  background-color: #FEDDDC;\n}\n.bk-user-selector-tag:hover {\n  background-color: #dcdee5;\n}\n.bk-user-selector-tag.bk-user-selector-tag-filled {\n  color: #fff;\n  background-color: #979BA5;\n}\n.bk-user-selector-tag.bk-user-selector-tag-filled:hover {\n  background-color: #ACAFB6;\n}\n.bk-user-selector-tag.bk-user-selector-tag-stroke {\n  padding: 0 9px;\n  line-height: 20px;\n  border-style: solid;\n  border-width: 1px;\n}\n.bk-user-selector-tag.bk-user-selector-tag-closable {\n  padding: 0 4px 0 10px;\n}\n.bk-user-selector-tag.bk-user-selector-tag-checkable {\n  cursor: pointer;\n  background: none;\n}\n.bk-user-selector-tag.bk-user-selector-tag-checkable:hover {\n  background: #F0F1F5;\n}\n.bk-user-selector-tag.bk-user-selector-tag-check {\n  color: #fff;\n  background: #3a84ff;\n}\n.bk-user-selector-tag.bk-user-selector-tag-check:hover {\n  color: #fff;\n  background: #3a84ff;\n  opacity: 1;\n}\n.bk-user-selector-tag--default {\n  padding: 0 8px;\n}\n.bk-user-selector-tag--small {\n  height: 16px;\n  padding: 0 4px;\n  line-height: 16px;\n}\n.bk-user-selector-tag--small .bk-user-selector-tag-text {\n  font-size: 10px;\n}\n.bk-user-selector-tag-text {\n  flex: 1;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n.bk-user-selector-tag-icon {\n  flex-shrink: 0;\n  margin-right: 4px;\n  font-size: 14px;\n  line-height: 0;\n}\n.bk-user-selector-tag-close {\n  flex-shrink: 0;\n  margin-left: 4px;\n  font-size: 12px;\n  line-height: 0;\n  cursor: pointer;\n}\n.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-a4132257] {\n  min-height: 40px;\n  max-height: 300px;\n  padding: 5px 0;\n  overflow-y: auto;\n}\n.dropdown-content .no-data[data-v-a4132257] {\n  padding: 10px;\n  color: #979ba5;\n  text-align: center;\n}\n.dropdown-content .user-group .group-header[data-v-a4132257] {\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-a4132257] {\n  margin-left: 4px;\n}\n.dropdown-content .user-option[data-v-a4132257] {\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-a4132257]: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-1f435fc8] {\n  position: relative;\n  width: 100%;\n}\n.multiple-selector.is-disabled[data-v-1f435fc8] {\n  pointer-events: none;\n}\n.multiple-selector .tags-container[data-v-1f435fc8] {\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-1f435fc8] {\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-1f435fc8] {\n  display: flex;\n  flex-wrap: wrap;\n  align-items: center;\n}\n.multiple-selector .tag-list[data-v-1f435fc8] {\n  display: flex;\n  flex-wrap: wrap;\n  align-items: center;\n}\n.multiple-selector .tag-wrapper[data-v-1f435fc8] {\n  display: inline-flex;\n  align-items: center;\n  max-width: 100%;\n}\n.multiple-selector .search-input[data-v-1f435fc8] {\n  min-width: 10px;\n  height: 28px;\n  background: transparent;\n  border: none;\n  outline: none;\n}\n.multiple-selector .search-input[data-v-1f435fc8]::placeholder {\n  color: #c4c6cc;\n}\n.multiple-selector .search-input.inline[data-v-1f435fc8] {\n  min-width: 10px;\n}\n.multiple-selector .search-input.last[data-v-1f435fc8], .multiple-selector .search-input.collapsed[data-v-1f435fc8] {\n  flex: 1;\n  min-width: 60px;\n}.single-selector[data-v-c44a1c1d] {\n  position: relative;\n  width: 100%;\n}\n.single-selector.is-disabled[data-v-c44a1c1d] {\n  pointer-events: none;\n}\n.input-container[data-v-c44a1c1d] {\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-c44a1c1d]: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-c44a1c1d] {\n  flex: 1;\n  height: 30px;\n  background: transparent;\n  border: none;\n  outline: none;\n}\n.search-input[data-v-c44a1c1d]::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}"));
       document.head.appendChild(elementStyle);
     }
   } catch (e) {
@@ -20756,7 +20756,14 @@ ${$(r2)}`), n2;
         return searchResults.value.filter((user) => !props2.selectedUsers.some((selectedUser) => selectedUser.id === user.id)).filter((user) => !props2.excludeUserIds.includes(user.id));
       });
       const userGroupFilter = computed(() => {
-        return props2.userGroup.filter((group) => !props2.selectedUsers.some((user) => user.id === group.id) && !group.hidden);
+        return props2.userGroup.filter((group) => {
+          var _a, _b;
+          const filtered = !props2.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 (!props2.draggable || !sortableContainerRef.value) return;
@@ -21207,7 +21214,7 @@ ${$(r2)}`), n2;
       };
     }
   });
-  const MultipleSelector = /* @__PURE__ */ _export_sfc(_sfc_main$2, [["__scopeId", "data-v-7ff53892"]]);
+  const MultipleSelector = /* @__PURE__ */ _export_sfc(_sfc_main$2, [["__scopeId", "data-v-1f435fc8"]]);
   const _hoisted_1 = { class: "input-container" };
   const _hoisted_2 = ["placeholder"];
   const _sfc_main$1 = /* @__PURE__ */ defineComponent({
@@ -21244,7 +21251,14 @@ ${$(r2)}`), n2;
       const searchQuery = ref("");
       const showDropdown = ref(false);
       const userGroupFilter = computed(() => {
-        return props2.userGroup.filter((group) => group.id !== selectedUser.value && !group.hidden);
+        return props2.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 = (props2.userGroup || []).map((group) => ({
@@ -21427,7 +21441,7 @@ ${$(r2)}`), n2;
       };
     }
   });
-  const SingleSelector = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["__scopeId", "data-v-d56195a1"]]);
+  const SingleSelector = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["__scopeId", "data-v-c44a1c1d"]]);
   const _sfc_main = /* @__PURE__ */ defineComponent({
     ...{
       name: "BkUserSelector"

package/vue2/index.umd.min.js

@@ -3,7 +3,7 @@
 })(this, function(exports2, __WEBPACK_EXTERNAL_MODULE_vue__) {
   "use strict";
   var __vite_style__ = document.createElement("style");
-  __vite_style__.textContent = ".scroll-bar-style::-webkit-scrollbar {\n  width: 4px;\n  height: 4px;\n}\n.scroll-bar-style::-webkit-scrollbar-thumb {\n  background: #ddd;\n  border-radius: 20px;\n  box-shadow: inset 0 0 6px rgba(204, 204, 204, 0.3);\n}\nhtml,\nbody {\n  padding: 0;\n  margin: 0;\n}\n* {\n  box-sizing: border-box;\n}\n/**\n * HTML5 display definitions\n * ==========================================================================\n *\n * Correct `block` display not defined for any HTML5 element in IE 8/9.\n * Correct `block` display not defined for `details` or `summary` in IE 10/11 and Firefox.\n * Correct `block` display not defined for `main` in IE 11.\n */\narticle,\naside,\ndetails,\nfigcaption,\nfigure,\nfooter,\nheader,\nhgroup,\nmain,\nmenu,\nnav,\nsection,\nsummary {\n  display: block;\n}\n/**\n * 1. Correct `inline-block` display not defined in IE 8/9.\n * 2. Normalize vertical alignment of `progress` in Chrome, Firefox, and Opera.\n */\naudio,\ncanvas,\nprogress,\nvideo {\n  /* 1 */\n  display: inline-block;\n  /* 2 */\n  vertical-align: baseline;\n}\n/**\n * Prevent modern browsers from displaying `audio` without controls.\n * Remove excess height in iOS 5 devices.\n */\naudio:not([controls]) {\n  display: none;\n  height: 0;\n}\n/**\n * Address `[hidden]` styling not present in IE 8/9/10.\n * Hide the `template` element in IE 8/9/10/11, Safari, and Firefox < 22.\n */\n[hidden],\ntemplate {\n  display: none;\n}\n/**\n * Links\n * ==========================================================================\n *\n * Remove the gray background color from active links in IE 10.\n */\na {\n  background-color: transparent;\n}\n/**\n * Improve readability of focused elements when they are also in an\n * active/hover state.\n */\na:active,\na:hover {\n  outline: 0;\n}\n/**\n * Text-level semantics\n * ==========================================================================\n *\n * Address styling not present in IE 8/9/10/11, Safari, and Chrome.\n */\nabbr[title] {\n  border-bottom: 1px dotted;\n}\n/**\n * Embedded content\n * ==========================================================================\n *\n * Remove border when inside `a` element in IE 8/9/10.\n */\nimg {\n  border: 0;\n}\n/**\n * Correct overflow not hidden in IE 9/10/11.\n */\nsvg:not(:root) {\n  overflow: hidden;\n}\n/**\n * Grouping content\n * ==========================================================================\n *\n * Address margin not present in IE 8/9 and Safari.\n */\nfigure {\n  margin: 1em 40px;\n}\n/**\n * Address differences between Firefox and other browsers.\n */\nhr {\n  height: 0;\n  box-sizing: content-box;\n}\n/**\n * Address odd `em`-unit font size rendering in all browsers.\n *\n * Forms\n * ==========================================================================\n *\n * Known limitation: by default, Chrome and Safari on OS X allow very limited\n * styling of `select`, unless a `border` property is set.\n *\n * 1. Correct color not being inherited.\n *    Known issue: affects color of disabled elements.\n * 2. Correct font properties not being inherited.\n * 3. Address margins set differently in Firefox 4+, Safari, and Chrome.\n */\nbutton,\ninput,\noptgroup,\nselect,\ntextarea {\n  /* 3 */\n  margin: 0;\n  /* 2 */\n  font: inherit;\n  /* 1 */\n  color: inherit;\n}\n/**\n * Address `overflow` set to `hidden` in IE 8/9/10/11.\n */\nbutton {\n  overflow: visible;\n}\n/**\n * Address inconsistent `text-transform` inheritance for `button` and `select`.\n * All other form control elements do not inherit `text-transform` values.\n * Correct `button` style inheritance in Firefox, IE 8/9/10/11, and Opera.\n * Correct `select` style inheritance in Firefox.\n */\nbutton,\nselect {\n  text-transform: none;\n}\n/**\n * 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio` and `video` controls.\n * 2. Correct inability to style clickable `input` types in iOS.\n * 3. Improve usability and consistency of cursor style between image-type `input` and others.\n */\nbutton,\nhtml input[type='button'],\ninput[type='reset'],\ninput[type='submit'] {\n  /* 3 */\n  cursor: pointer;\n  /* 2 */\n  appearance: button;\n}\n/* Re-set default cursor for disabled elements. */\nbutton[disabled],\nhtml input[disabled] {\n  cursor: default;\n}\n/* Remove inner padding and border in Firefox 4+. */\nbutton::-moz-focus-inner,\ninput::-moz-focus-inner {\n  padding: 0;\n  border: 0;\n}\n/**\n * Address Firefox 4+ setting `line-height` on `input` using `!important` in the UA stylesheet.\n */\ninput {\n  line-height: normal;\n}\n/**\n * It's recommended that you don't attempt to style these elements.\n * Firefox's implementation doesn't respect box-sizing, padding, or width.\n *\n * 1. Address box sizing set to `content-box` in IE 8/9/10.\n * 2. Remove excess padding in IE 8/9/10.\n */\ninput[type='checkbox'],\ninput[type='radio'] {\n  /* 2 */\n  padding: 0;\n  /* 1 */\n  box-sizing: border-box;\n}\n/**\n * Fix the cursor style for Chrome's increment/decrement buttons. For certain\n * `font-size` values of the `input`, it causes the cursor style of the\n * decrement button to change from `default` to `text`.\n */\ninput[type='number']::-webkit-inner-spin-button,\ninput[type='number']::-webkit-outer-spin-button {\n  height: auto;\n}\n::-ms-clear,\n::-ms-reveal {\n  display: none;\n}\ninput[type='text']::-ms-clear {\n  display: none;\n}\ninput[type='text']::-ms-reveal {\n  display: none;\n}\n/**\n * 1. Address `appearance` set to `searchfield` in Safari and Chrome.\n * 2. Address `box-sizing` set to `border-box` in Safari and Chrome.\n */\ninput[type='search'] {\n  /* 2 */\n  box-sizing: content-box;\n  /* 1 */\n  appearance: textfield;\n}\n/**\n * Remove inner padding and search cancel button in Safari and Chrome on OS X.\n * Safari (but not Chrome) clips the cancel button when the search input has\n * padding (and `textfield` appearance).\n */\ninput[type='search']::-webkit-search-cancel-button,\ninput[type='search']::-webkit-search-decoration {\n  appearance: none;\n}\n/**\n * Define consistent border, margin, and padding.\n */\nfieldset {\n  padding: 0.35em 0.625em 0.75em;\n  margin: 0 2px;\n  border: 1px solid #c0c0c0;\n}\n/**\n * 1. Correct `color` not being inherited in IE 8/9/10/11.\n * 2. Remove padding so people aren't caught out if they zero out fieldsets.\n */\nlegend {\n  /* 2 */\n  padding: 0;\n  /* 1 */\n  border: 0;\n}\n/**\n * Remove default vertical scrollbar in IE 8/9/10/11.\n */\ntextarea {\n  overflow: auto;\n}\n/**\n * Don't inherit the `font-weight` (applied by a rule above).\n * NOTE: the default cannot safely be changed in Chrome and Safari on OS X.\n */\noptgroup {\n  font-weight: bold;\n}\n/**\n* BK-Scroll-Style\n*/\n.bk-scroll-y {\n  overflow-y: auto;\n}\n.bk-scroll-y::-webkit-scrollbar {\n  width: 4px;\n  height: 4px;\n}\n.bk-scroll-y::-webkit-scrollbar-thumb {\n  background: #ddd;\n  border-radius: 20px;\n  box-shadow: inset 0 0 6px rgba(204, 204, 204, 0.3);\n}\n.bk-scroll-x {\n  overflow-x: auto;\n}\n.bk-scroll-x::-webkit-scrollbar {\n  width: 4px;\n  height: 4px;\n}\n.bk-scroll-x::-webkit-scrollbar-thumb {\n  background: #ddd;\n  border-radius: 20px;\n  box-shadow: inset 0 0 6px rgba(204, 204, 204, 0.3);\n}\n@keyframes loading-scale-animate {\n  0% {\n    transform: scale(1);\n  }\n  100% {\n    transform: scale(0.6);\n  }\n}\n@keyframes fade {\n  100% {\n    background-color: transparent;\n  }\n}\n.bk-user-selector-transition .bk-user-selector-fade-enter-active,\n.bk-user-selector-transition .bk-user-selector-fade-leave-active {\n  transition: all 0.3s cubic-bezier(0.55, 0, 0.1, 1);\n}\n.bk-user-selector-transition .bk-user-selector-fade-enter,\n.bk-user-selector-transition .bk-user-selector-fade-leave-to {\n  opacity: 0;\n}\n.clearfix-style::after {\n  display: block;\n  height: 0;\n  clear: both;\n  font-size: 0;\n  content: '';\n  visibility: hidden;\n}\n.bk-user-selector-popper {\n  display: none;\n  padding: 7px 14px;\n  font-size: 12px;\n  color: #fff;\n  background: #333;\n  border-radius: 4px;\n}\n.bk-user-selector-popper.light {\n  color: #63656e;\n  background: #fff;\n  box-shadow: #dcdee5 0 0 6px 0;\n}\n.bk-user-selector-popper .bk-user-selector-popper-arrow,\n.bk-user-selector-popper .bk-user-selector-popper-arrow::before {\n  position: absolute;\n  width: 8px;\n  height: 8px;\n  background: inherit;\n}\n.bk-user-selector-popper .bk-user-selector-popper-arrow {\n  visibility: hidden;\n}\n.bk-user-selector-popper .bk-user-selector-popper-arrow::before {\n  content: '';\n  visibility: visible;\n  transform: rotate(45deg);\n}\n.bk-user-selector-popper[data-show] {\n  display: block;\n}\n.bk-user-selector-popper[data-popper-placement^='top'] > .bk-user-selector-popper-arrow {\n  bottom: -4px;\n}\n.bk-user-selector-popper[data-popper-placement^='bottom'] > .bk-user-selector-popper-arrow {\n  top: -4px;\n}\n.bk-user-selector-popper[data-popper-placement^='left'] > .bk-user-selector-popper-arrow {\n  right: -4px;\n}\n.bk-user-selector-popper[data-popper-placement^='right'] > .bk-user-selector-popper-arrow {\n  left: -4px;\n}\n.bk-user-selector-loading-wrapper {\n  position: static;\n  vertical-align: middle;\n}\n.bk-user-selector-loading-wrapper:not(.bk-user-selector-nested-loading):not(.bk-user-selector-directive-loading) {\n  display: inline-flex;\n}\n.bk-user-selector-loading-wrapper.bk-user-selector-directive-loading {\n  width: 100%;\n  height: 100%;\n}\n.bk-user-selector-loading-wrapper.bk-user-selector-directive-loading,\n.bk-user-selector-loading-wrapper.bk-user-selector-nested-loading {\n  position: relative;\n}\n.bk-user-selector-loading-wrapper.bk-user-selector-directive-loading.is-block,\n.bk-user-selector-loading-wrapper.bk-user-selector-nested-loading.is-block {\n  display: block;\n}\n.bk-user-selector-loading-wrapper.bk-user-selector-directive-loading .bk-user-selector-loading-indicator,\n.bk-user-selector-loading-wrapper.bk-user-selector-nested-loading .bk-user-selector-loading-indicator {\n  position: absolute;\n  top: 50%;\n  left: 50%;\n  z-index: 11;\n  text-align: center;\n  transform: translate(-50%, -50%);\n}\n.bk-user-selector-loading-wrapper .dot {\n  display: inline-flex;\n  width: 14px;\n  height: 14px;\n  margin-right: 10px;\n  border-radius: 50%;\n  transform: scale(0.6);\n  animation-duration: 0.8s;\n  animation-iteration-count: infinite;\n  animation-name: loading-scale-animate;\n  animation-direction: normal;\n}\n.bk-user-selector-loading-wrapper .oval {\n  position: absolute;\n  width: 6px;\n  height: 8px;\n  background-color: #63656e;\n  border-radius: 8px;\n  animation-duration: 1.2s;\n  animation-iteration-count: infinite;\n  animation-name: fade;\n  transform-origin: center 24px;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-mask {\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator {\n  display: flex;\n  line-height: 1;\n  text-align: center;\n  flex-direction: column;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-success .oval,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-success .dot,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-success .dot-1,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-success .dot-2,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-success .dot-3,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-success .dot-4 {\n  background-color: #2dcb56;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-danger .oval,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-danger .dot,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-danger .dot-1,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-danger .dot-2,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-danger .dot-3,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-danger .dot-4 {\n  background-color: #ea3636;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-warning .oval,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-warning .dot,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-warning .dot-1,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-warning .dot-2,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-warning .dot-3,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-warning .dot-4 {\n  background-color: #ff9c01;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-primary .oval,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-primary .dot,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-primary .dot-1,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-primary .dot-2,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-primary .dot-3,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-primary .dot-4 {\n  background-color: #3a84ff;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-white .oval,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-white .dot,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-white .dot-1,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-white .dot-2,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-white .dot-3,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-white .dot-4 {\n  background-color: white;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-default .oval,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-default .dot,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-default .dot-1,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-default .dot-2,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-default .dot-3,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-default .dot-4 {\n  background-color: #c4c6cc;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator .dot-1 {\n  background-color: #ea3636;\n  animation-delay: 0.1s;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator .dot-2 {\n  background-color: #ff9c01;\n  animation-delay: 0.25s;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator .dot-3 {\n  background-color: #2dcb56;\n  animation-delay: 0.4s;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator .dot-4 {\n  background-color: #3a84ff;\n  animation-delay: 0.55s;\n  margin-right: 0px;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator .oval-1 {\n  transform: rotate(135deg);\n  animation-delay: -0.45s;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator .oval-2 {\n  transform: rotate(90deg);\n  animation-delay: -0.6s;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator .oval-3 {\n  transform: rotate(45deg);\n  animation-delay: -0.75s;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator .oval-4 {\n  transform: rotate(0deg);\n  animation-delay: -0.9s;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator .oval-5 {\n  transform: rotate(-45deg);\n  animation-delay: -1.05s;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator .oval-6 {\n  transform: rotate(-90deg);\n  animation-delay: -1.2s;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator .oval-7 {\n  transform: rotate(-135deg);\n  animation-delay: -1.35s;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator .oval-8 {\n  transform: rotate(-180deg);\n  animation-delay: -1.5s;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator .bk-user-selector-normal-indicator {\n  display: inline-flex;\n  justify-content: center;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator .bk-user-selector-spin-indicator {\n  position: relative;\n  display: inline-flex;\n  justify-content: center;\n  width: 48px;\n  height: 48px;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-size-mini .bk-user-selector-spin-indicator {\n  height: 16px;\n  width: 16px;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-size-mini .dot {\n  width: 3px;\n  height: 3px;\n  margin-right: 3px;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-size-mini .dot.dot-4 {\n  margin-right: 0;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-size-mini .oval {\n  width: 2px;\n  height: 3px;\n  border-radius: 3px;\n  transform-origin: center 8px;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-size-mini .bk-user-selector-loading-title {\n  font-size: 14px;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-size-small .bk-user-selector-spin-indicator {\n  height: 32px;\n  width: 32px;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-size-small .dot {\n  width: 6px;\n  height: 6px;\n  margin-right: 6px;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-size-small .dot.dot-4 {\n  margin-right: 0;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-size-small .oval {\n  width: 4px;\n  height: 5px;\n  border-radius: 5px;\n  transform-origin: center 16px;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-size-small .bk-user-selector-loading-title {\n  font-size: 12px;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-size-large .bk-user-selector-spin-indicator {\n  height: 68px;\n  width: 68px;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-size-large .dot {\n  width: 20px;\n  height: 20px;\n  margin-right: 12px;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-size-large .dot.dot-4 {\n  margin-right: 0;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-size-large .oval {\n  width: 8px;\n  height: 12px;\n  border-radius: 12px;\n  transform-origin: center 34px;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-size-large .bk-user-selector-loading-title {\n  font-size: 14px;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator .bk-user-selector-loading-title {\n  margin-top: 8px;\n  font-size: 14px;\n  line-height: normal;\n  color: #63656e;\n  text-align: center;\n}\n.bk-user-selector-popover.bk-user-selector-pop2-content {\n  position: absolute;\n  padding: 12px;\n  font-size: 12px;\n  color: #fff;\n  background: #26323d;\n  border-radius: 4px;\n  box-sizing: border-box;\n}\n.bk-user-selector-popover.bk-user-selector-pop2-content.hidden {\n  display: none;\n}\n.bk-user-selector-popover.bk-user-selector-pop2-content .bk-user-selector-pop2-arrow {\n  position: absolute;\n  z-index: -1;\n  width: 8px;\n  height: 8px;\n  background: #333;\n  transform: rotate(45deg);\n}\n.bk-user-selector-popover.bk-user-selector-pop2-content[data-theme^='light'] {\n  color: #26323d;\n  background-color: #fff;\n  box-shadow: 0 0 6px 0 #dcdee5;\n}\n.bk-user-selector-popover.bk-user-selector-pop2-content[data-theme^='light'] .bk-user-selector-pop2-arrow {\n  background-color: #fff;\n}\n.text-ov {\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n.position-relative {\n  position: relative;\n}\n.position-absolute {\n  position: absolute;\n}\n.overflow-popover-reference {\n  width: 100%;\n}\n.bk-user-selector-tag {\n  display: inline-flex;\n  align-items: center;\n  height: 22px;\n  padding: 0 10px;\n  font-size: 12px;\n  line-height: 22px;\n  color: #63656e;\n  cursor: default;\n  background-color: #f0f1f5;\n  border-color: rgba(151, 155, 165, 0.3);\n  box-sizing: border-box;\n}\n.bk-user-selector-tag.bk-user-selector-tag-success {\n  color: #14a568;\n  border-color: rgba(20, 165, 104, 0.3);\n  background-color: #E4FAF0;\n}\n.bk-user-selector-tag.bk-user-selector-tag-success.bk-user-selector-tag-filled {\n  background-color: #14A568;\n}\n.bk-user-selector-tag.bk-user-selector-tag-success.bk-user-selector-tag-filled:hover {\n  background-color: #42B685;\n}\n.bk-user-selector-tag.bk-user-selector-tag-success:hover:not(.bk-user-selector-tag-filled) {\n  background-color: #C9F5E2;\n}\n.bk-user-selector-tag.bk-user-selector-tag-info {\n  color: #3a84ff;\n  border-color: rgba(58, 132, 255, 0.3);\n  background-color: #EDF4FF;\n}\n.bk-user-selector-tag.bk-user-selector-tag-info.bk-user-selector-tag-filled {\n  background-color: #3A84FF;\n}\n.bk-user-selector-tag.bk-user-selector-tag-info.bk-user-selector-tag-filled:hover {\n  background-color: #609CFE;\n}\n.bk-user-selector-tag.bk-user-selector-tag-info:hover:not(.bk-user-selector-tag-filled) {\n  background-color: #E1ECFF;\n}\n.bk-user-selector-tag.bk-user-selector-tag-warning {\n  color: #fe9c00;\n  border-color: rgba(254, 165, 0, 0.3);\n  background-color: #FFF1DB;\n}\n.bk-user-selector-tag.bk-user-selector-tag-warning.bk-user-selector-tag-filled {\n  background-color: #FE9C00;\n}\n.bk-user-selector-tag.bk-user-selector-tag-warning.bk-user-selector-tag-filled:hover {\n  background-color: #FDAF32;\n}\n.bk-user-selector-tag.bk-user-selector-tag-warning:hover:not(.bk-user-selector-tag-filled) {\n  background-color: #FFE8C3;\n}\n.bk-user-selector-tag.bk-user-selector-tag-danger {\n  color: #ea3636;\n  border-color: rgba(234, 53, 54, 0.3);\n  background-color: #FEEBEA;\n}\n.bk-user-selector-tag.bk-user-selector-tag-danger.bk-user-selector-tag-filled {\n  background-color: #EA3536;\n}\n.bk-user-selector-tag.bk-user-selector-tag-danger.bk-user-selector-tag-filled:hover {\n  background-color: #ED5C5D;\n}\n.bk-user-selector-tag.bk-user-selector-tag-danger:hover:not(.bk-user-selector-tag-filled) {\n  background-color: #FEDDDC;\n}\n.bk-user-selector-tag:hover {\n  background-color: #dcdee5;\n}\n.bk-user-selector-tag.bk-user-selector-tag-filled {\n  color: #fff;\n  background-color: #979BA5;\n}\n.bk-user-selector-tag.bk-user-selector-tag-filled:hover {\n  background-color: #ACAFB6;\n}\n.bk-user-selector-tag.bk-user-selector-tag-stroke {\n  padding: 0 9px;\n  line-height: 20px;\n  border-style: solid;\n  border-width: 1px;\n}\n.bk-user-selector-tag.bk-user-selector-tag-closable {\n  padding: 0 4px 0 10px;\n}\n.bk-user-selector-tag.bk-user-selector-tag-checkable {\n  cursor: pointer;\n  background: none;\n}\n.bk-user-selector-tag.bk-user-selector-tag-checkable:hover {\n  background: #F0F1F5;\n}\n.bk-user-selector-tag.bk-user-selector-tag-check {\n  color: #fff;\n  background: #3a84ff;\n}\n.bk-user-selector-tag.bk-user-selector-tag-check:hover {\n  color: #fff;\n  background: #3a84ff;\n  opacity: 1;\n}\n.bk-user-selector-tag--default {\n  padding: 0 8px;\n}\n.bk-user-selector-tag--small {\n  height: 16px;\n  padding: 0 4px;\n  line-height: 16px;\n}\n.bk-user-selector-tag--small .bk-user-selector-tag-text {\n  font-size: 10px;\n}\n.bk-user-selector-tag-text {\n  flex: 1;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n.bk-user-selector-tag-icon {\n  flex-shrink: 0;\n  margin-right: 4px;\n  font-size: 14px;\n  line-height: 0;\n}\n.bk-user-selector-tag-close {\n  flex-shrink: 0;\n  margin-left: 4px;\n  font-size: 12px;\n  line-height: 0;\n  cursor: pointer;\n}\n.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-a4132257] {\n  min-height: 40px;\n  max-height: 300px;\n  padding: 5px 0;\n  overflow-y: auto;\n}\n.dropdown-content .no-data[data-v-a4132257] {\n  padding: 10px;\n  color: #979ba5;\n  text-align: center;\n}\n.dropdown-content .user-group .group-header[data-v-a4132257] {\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-a4132257] {\n  margin-left: 4px;\n}\n.dropdown-content .user-option[data-v-a4132257] {\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-a4132257]: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-7ff53892] {\n  position: relative;\n  width: 100%;\n}\n.multiple-selector.is-disabled[data-v-7ff53892] {\n  pointer-events: none;\n}\n.multiple-selector .tags-container[data-v-7ff53892] {\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-7ff53892] {\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-7ff53892] {\n  display: flex;\n  flex-wrap: wrap;\n  align-items: center;\n}\n.multiple-selector .tag-list[data-v-7ff53892] {\n  display: flex;\n  flex-wrap: wrap;\n  align-items: center;\n}\n.multiple-selector .tag-wrapper[data-v-7ff53892] {\n  display: inline-flex;\n  align-items: center;\n  max-width: 100%;\n}\n.multiple-selector .search-input[data-v-7ff53892] {\n  min-width: 10px;\n  height: 28px;\n  background: transparent;\n  border: none;\n  outline: none;\n}\n.multiple-selector .search-input[data-v-7ff53892]::placeholder {\n  color: #c4c6cc;\n}\n.multiple-selector .search-input.inline[data-v-7ff53892] {\n  min-width: 10px;\n}\n.multiple-selector .search-input.last[data-v-7ff53892], .multiple-selector .search-input.collapsed[data-v-7ff53892] {\n  flex: 1;\n  min-width: 60px;\n}.single-selector[data-v-d56195a1] {\n  position: relative;\n  width: 100%;\n}\n.single-selector.is-disabled[data-v-d56195a1] {\n  pointer-events: none;\n}\n.input-container[data-v-d56195a1] {\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-d56195a1]: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-d56195a1] {\n  flex: 1;\n  height: 30px;\n  background: transparent;\n  border: none;\n  outline: none;\n}\n.search-input[data-v-d56195a1]::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_style__.textContent = ".scroll-bar-style::-webkit-scrollbar {\n  width: 4px;\n  height: 4px;\n}\n.scroll-bar-style::-webkit-scrollbar-thumb {\n  background: #ddd;\n  border-radius: 20px;\n  box-shadow: inset 0 0 6px rgba(204, 204, 204, 0.3);\n}\nhtml,\nbody {\n  padding: 0;\n  margin: 0;\n}\n* {\n  box-sizing: border-box;\n}\n/**\n * HTML5 display definitions\n * ==========================================================================\n *\n * Correct `block` display not defined for any HTML5 element in IE 8/9.\n * Correct `block` display not defined for `details` or `summary` in IE 10/11 and Firefox.\n * Correct `block` display not defined for `main` in IE 11.\n */\narticle,\naside,\ndetails,\nfigcaption,\nfigure,\nfooter,\nheader,\nhgroup,\nmain,\nmenu,\nnav,\nsection,\nsummary {\n  display: block;\n}\n/**\n * 1. Correct `inline-block` display not defined in IE 8/9.\n * 2. Normalize vertical alignment of `progress` in Chrome, Firefox, and Opera.\n */\naudio,\ncanvas,\nprogress,\nvideo {\n  /* 1 */\n  display: inline-block;\n  /* 2 */\n  vertical-align: baseline;\n}\n/**\n * Prevent modern browsers from displaying `audio` without controls.\n * Remove excess height in iOS 5 devices.\n */\naudio:not([controls]) {\n  display: none;\n  height: 0;\n}\n/**\n * Address `[hidden]` styling not present in IE 8/9/10.\n * Hide the `template` element in IE 8/9/10/11, Safari, and Firefox < 22.\n */\n[hidden],\ntemplate {\n  display: none;\n}\n/**\n * Links\n * ==========================================================================\n *\n * Remove the gray background color from active links in IE 10.\n */\na {\n  background-color: transparent;\n}\n/**\n * Improve readability of focused elements when they are also in an\n * active/hover state.\n */\na:active,\na:hover {\n  outline: 0;\n}\n/**\n * Text-level semantics\n * ==========================================================================\n *\n * Address styling not present in IE 8/9/10/11, Safari, and Chrome.\n */\nabbr[title] {\n  border-bottom: 1px dotted;\n}\n/**\n * Embedded content\n * ==========================================================================\n *\n * Remove border when inside `a` element in IE 8/9/10.\n */\nimg {\n  border: 0;\n}\n/**\n * Correct overflow not hidden in IE 9/10/11.\n */\nsvg:not(:root) {\n  overflow: hidden;\n}\n/**\n * Grouping content\n * ==========================================================================\n *\n * Address margin not present in IE 8/9 and Safari.\n */\nfigure {\n  margin: 1em 40px;\n}\n/**\n * Address differences between Firefox and other browsers.\n */\nhr {\n  height: 0;\n  box-sizing: content-box;\n}\n/**\n * Address odd `em`-unit font size rendering in all browsers.\n *\n * Forms\n * ==========================================================================\n *\n * Known limitation: by default, Chrome and Safari on OS X allow very limited\n * styling of `select`, unless a `border` property is set.\n *\n * 1. Correct color not being inherited.\n *    Known issue: affects color of disabled elements.\n * 2. Correct font properties not being inherited.\n * 3. Address margins set differently in Firefox 4+, Safari, and Chrome.\n */\nbutton,\ninput,\noptgroup,\nselect,\ntextarea {\n  /* 3 */\n  margin: 0;\n  /* 2 */\n  font: inherit;\n  /* 1 */\n  color: inherit;\n}\n/**\n * Address `overflow` set to `hidden` in IE 8/9/10/11.\n */\nbutton {\n  overflow: visible;\n}\n/**\n * Address inconsistent `text-transform` inheritance for `button` and `select`.\n * All other form control elements do not inherit `text-transform` values.\n * Correct `button` style inheritance in Firefox, IE 8/9/10/11, and Opera.\n * Correct `select` style inheritance in Firefox.\n */\nbutton,\nselect {\n  text-transform: none;\n}\n/**\n * 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio` and `video` controls.\n * 2. Correct inability to style clickable `input` types in iOS.\n * 3. Improve usability and consistency of cursor style between image-type `input` and others.\n */\nbutton,\nhtml input[type='button'],\ninput[type='reset'],\ninput[type='submit'] {\n  /* 3 */\n  cursor: pointer;\n  /* 2 */\n  appearance: button;\n}\n/* Re-set default cursor for disabled elements. */\nbutton[disabled],\nhtml input[disabled] {\n  cursor: default;\n}\n/* Remove inner padding and border in Firefox 4+. */\nbutton::-moz-focus-inner,\ninput::-moz-focus-inner {\n  padding: 0;\n  border: 0;\n}\n/**\n * Address Firefox 4+ setting `line-height` on `input` using `!important` in the UA stylesheet.\n */\ninput {\n  line-height: normal;\n}\n/**\n * It's recommended that you don't attempt to style these elements.\n * Firefox's implementation doesn't respect box-sizing, padding, or width.\n *\n * 1. Address box sizing set to `content-box` in IE 8/9/10.\n * 2. Remove excess padding in IE 8/9/10.\n */\ninput[type='checkbox'],\ninput[type='radio'] {\n  /* 2 */\n  padding: 0;\n  /* 1 */\n  box-sizing: border-box;\n}\n/**\n * Fix the cursor style for Chrome's increment/decrement buttons. For certain\n * `font-size` values of the `input`, it causes the cursor style of the\n * decrement button to change from `default` to `text`.\n */\ninput[type='number']::-webkit-inner-spin-button,\ninput[type='number']::-webkit-outer-spin-button {\n  height: auto;\n}\n::-ms-clear,\n::-ms-reveal {\n  display: none;\n}\ninput[type='text']::-ms-clear {\n  display: none;\n}\ninput[type='text']::-ms-reveal {\n  display: none;\n}\n/**\n * 1. Address `appearance` set to `searchfield` in Safari and Chrome.\n * 2. Address `box-sizing` set to `border-box` in Safari and Chrome.\n */\ninput[type='search'] {\n  /* 2 */\n  box-sizing: content-box;\n  /* 1 */\n  appearance: textfield;\n}\n/**\n * Remove inner padding and search cancel button in Safari and Chrome on OS X.\n * Safari (but not Chrome) clips the cancel button when the search input has\n * padding (and `textfield` appearance).\n */\ninput[type='search']::-webkit-search-cancel-button,\ninput[type='search']::-webkit-search-decoration {\n  appearance: none;\n}\n/**\n * Define consistent border, margin, and padding.\n */\nfieldset {\n  padding: 0.35em 0.625em 0.75em;\n  margin: 0 2px;\n  border: 1px solid #c0c0c0;\n}\n/**\n * 1. Correct `color` not being inherited in IE 8/9/10/11.\n * 2. Remove padding so people aren't caught out if they zero out fieldsets.\n */\nlegend {\n  /* 2 */\n  padding: 0;\n  /* 1 */\n  border: 0;\n}\n/**\n * Remove default vertical scrollbar in IE 8/9/10/11.\n */\ntextarea {\n  overflow: auto;\n}\n/**\n * Don't inherit the `font-weight` (applied by a rule above).\n * NOTE: the default cannot safely be changed in Chrome and Safari on OS X.\n */\noptgroup {\n  font-weight: bold;\n}\n/**\n* BK-Scroll-Style\n*/\n.bk-scroll-y {\n  overflow-y: auto;\n}\n.bk-scroll-y::-webkit-scrollbar {\n  width: 4px;\n  height: 4px;\n}\n.bk-scroll-y::-webkit-scrollbar-thumb {\n  background: #ddd;\n  border-radius: 20px;\n  box-shadow: inset 0 0 6px rgba(204, 204, 204, 0.3);\n}\n.bk-scroll-x {\n  overflow-x: auto;\n}\n.bk-scroll-x::-webkit-scrollbar {\n  width: 4px;\n  height: 4px;\n}\n.bk-scroll-x::-webkit-scrollbar-thumb {\n  background: #ddd;\n  border-radius: 20px;\n  box-shadow: inset 0 0 6px rgba(204, 204, 204, 0.3);\n}\n@keyframes loading-scale-animate {\n  0% {\n    transform: scale(1);\n  }\n  100% {\n    transform: scale(0.6);\n  }\n}\n@keyframes fade {\n  100% {\n    background-color: transparent;\n  }\n}\n.bk-user-selector-transition .bk-user-selector-fade-enter-active,\n.bk-user-selector-transition .bk-user-selector-fade-leave-active {\n  transition: all 0.3s cubic-bezier(0.55, 0, 0.1, 1);\n}\n.bk-user-selector-transition .bk-user-selector-fade-enter,\n.bk-user-selector-transition .bk-user-selector-fade-leave-to {\n  opacity: 0;\n}\n.clearfix-style::after {\n  display: block;\n  height: 0;\n  clear: both;\n  font-size: 0;\n  content: '';\n  visibility: hidden;\n}\n.bk-user-selector-popper {\n  display: none;\n  padding: 7px 14px;\n  font-size: 12px;\n  color: #fff;\n  background: #333;\n  border-radius: 4px;\n}\n.bk-user-selector-popper.light {\n  color: #63656e;\n  background: #fff;\n  box-shadow: #dcdee5 0 0 6px 0;\n}\n.bk-user-selector-popper .bk-user-selector-popper-arrow,\n.bk-user-selector-popper .bk-user-selector-popper-arrow::before {\n  position: absolute;\n  width: 8px;\n  height: 8px;\n  background: inherit;\n}\n.bk-user-selector-popper .bk-user-selector-popper-arrow {\n  visibility: hidden;\n}\n.bk-user-selector-popper .bk-user-selector-popper-arrow::before {\n  content: '';\n  visibility: visible;\n  transform: rotate(45deg);\n}\n.bk-user-selector-popper[data-show] {\n  display: block;\n}\n.bk-user-selector-popper[data-popper-placement^='top'] > .bk-user-selector-popper-arrow {\n  bottom: -4px;\n}\n.bk-user-selector-popper[data-popper-placement^='bottom'] > .bk-user-selector-popper-arrow {\n  top: -4px;\n}\n.bk-user-selector-popper[data-popper-placement^='left'] > .bk-user-selector-popper-arrow {\n  right: -4px;\n}\n.bk-user-selector-popper[data-popper-placement^='right'] > .bk-user-selector-popper-arrow {\n  left: -4px;\n}\n.bk-user-selector-loading-wrapper {\n  position: static;\n  vertical-align: middle;\n}\n.bk-user-selector-loading-wrapper:not(.bk-user-selector-nested-loading):not(.bk-user-selector-directive-loading) {\n  display: inline-flex;\n}\n.bk-user-selector-loading-wrapper.bk-user-selector-directive-loading {\n  width: 100%;\n  height: 100%;\n}\n.bk-user-selector-loading-wrapper.bk-user-selector-directive-loading,\n.bk-user-selector-loading-wrapper.bk-user-selector-nested-loading {\n  position: relative;\n}\n.bk-user-selector-loading-wrapper.bk-user-selector-directive-loading.is-block,\n.bk-user-selector-loading-wrapper.bk-user-selector-nested-loading.is-block {\n  display: block;\n}\n.bk-user-selector-loading-wrapper.bk-user-selector-directive-loading .bk-user-selector-loading-indicator,\n.bk-user-selector-loading-wrapper.bk-user-selector-nested-loading .bk-user-selector-loading-indicator {\n  position: absolute;\n  top: 50%;\n  left: 50%;\n  z-index: 11;\n  text-align: center;\n  transform: translate(-50%, -50%);\n}\n.bk-user-selector-loading-wrapper .dot {\n  display: inline-flex;\n  width: 14px;\n  height: 14px;\n  margin-right: 10px;\n  border-radius: 50%;\n  transform: scale(0.6);\n  animation-duration: 0.8s;\n  animation-iteration-count: infinite;\n  animation-name: loading-scale-animate;\n  animation-direction: normal;\n}\n.bk-user-selector-loading-wrapper .oval {\n  position: absolute;\n  width: 6px;\n  height: 8px;\n  background-color: #63656e;\n  border-radius: 8px;\n  animation-duration: 1.2s;\n  animation-iteration-count: infinite;\n  animation-name: fade;\n  transform-origin: center 24px;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-mask {\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator {\n  display: flex;\n  line-height: 1;\n  text-align: center;\n  flex-direction: column;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-success .oval,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-success .dot,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-success .dot-1,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-success .dot-2,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-success .dot-3,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-success .dot-4 {\n  background-color: #2dcb56;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-danger .oval,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-danger .dot,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-danger .dot-1,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-danger .dot-2,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-danger .dot-3,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-danger .dot-4 {\n  background-color: #ea3636;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-warning .oval,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-warning .dot,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-warning .dot-1,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-warning .dot-2,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-warning .dot-3,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-warning .dot-4 {\n  background-color: #ff9c01;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-primary .oval,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-primary .dot,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-primary .dot-1,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-primary .dot-2,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-primary .dot-3,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-primary .dot-4 {\n  background-color: #3a84ff;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-white .oval,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-white .dot,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-white .dot-1,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-white .dot-2,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-white .dot-3,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-white .dot-4 {\n  background-color: white;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-default .oval,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-default .dot,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-default .dot-1,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-default .dot-2,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-default .dot-3,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-default .dot-4 {\n  background-color: #c4c6cc;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator .dot-1 {\n  background-color: #ea3636;\n  animation-delay: 0.1s;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator .dot-2 {\n  background-color: #ff9c01;\n  animation-delay: 0.25s;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator .dot-3 {\n  background-color: #2dcb56;\n  animation-delay: 0.4s;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator .dot-4 {\n  background-color: #3a84ff;\n  animation-delay: 0.55s;\n  margin-right: 0px;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator .oval-1 {\n  transform: rotate(135deg);\n  animation-delay: -0.45s;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator .oval-2 {\n  transform: rotate(90deg);\n  animation-delay: -0.6s;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator .oval-3 {\n  transform: rotate(45deg);\n  animation-delay: -0.75s;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator .oval-4 {\n  transform: rotate(0deg);\n  animation-delay: -0.9s;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator .oval-5 {\n  transform: rotate(-45deg);\n  animation-delay: -1.05s;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator .oval-6 {\n  transform: rotate(-90deg);\n  animation-delay: -1.2s;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator .oval-7 {\n  transform: rotate(-135deg);\n  animation-delay: -1.35s;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator .oval-8 {\n  transform: rotate(-180deg);\n  animation-delay: -1.5s;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator .bk-user-selector-normal-indicator {\n  display: inline-flex;\n  justify-content: center;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator .bk-user-selector-spin-indicator {\n  position: relative;\n  display: inline-flex;\n  justify-content: center;\n  width: 48px;\n  height: 48px;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-size-mini .bk-user-selector-spin-indicator {\n  height: 16px;\n  width: 16px;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-size-mini .dot {\n  width: 3px;\n  height: 3px;\n  margin-right: 3px;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-size-mini .dot.dot-4 {\n  margin-right: 0;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-size-mini .oval {\n  width: 2px;\n  height: 3px;\n  border-radius: 3px;\n  transform-origin: center 8px;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-size-mini .bk-user-selector-loading-title {\n  font-size: 14px;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-size-small .bk-user-selector-spin-indicator {\n  height: 32px;\n  width: 32px;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-size-small .dot {\n  width: 6px;\n  height: 6px;\n  margin-right: 6px;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-size-small .dot.dot-4 {\n  margin-right: 0;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-size-small .oval {\n  width: 4px;\n  height: 5px;\n  border-radius: 5px;\n  transform-origin: center 16px;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-size-small .bk-user-selector-loading-title {\n  font-size: 12px;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-size-large .bk-user-selector-spin-indicator {\n  height: 68px;\n  width: 68px;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-size-large .dot {\n  width: 20px;\n  height: 20px;\n  margin-right: 12px;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-size-large .dot.dot-4 {\n  margin-right: 0;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-size-large .oval {\n  width: 8px;\n  height: 12px;\n  border-radius: 12px;\n  transform-origin: center 34px;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-size-large .bk-user-selector-loading-title {\n  font-size: 14px;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator .bk-user-selector-loading-title {\n  margin-top: 8px;\n  font-size: 14px;\n  line-height: normal;\n  color: #63656e;\n  text-align: center;\n}\n.bk-user-selector-popover.bk-user-selector-pop2-content {\n  position: absolute;\n  padding: 12px;\n  font-size: 12px;\n  color: #fff;\n  background: #26323d;\n  border-radius: 4px;\n  box-sizing: border-box;\n}\n.bk-user-selector-popover.bk-user-selector-pop2-content.hidden {\n  display: none;\n}\n.bk-user-selector-popover.bk-user-selector-pop2-content .bk-user-selector-pop2-arrow {\n  position: absolute;\n  z-index: -1;\n  width: 8px;\n  height: 8px;\n  background: #333;\n  transform: rotate(45deg);\n}\n.bk-user-selector-popover.bk-user-selector-pop2-content[data-theme^='light'] {\n  color: #26323d;\n  background-color: #fff;\n  box-shadow: 0 0 6px 0 #dcdee5;\n}\n.bk-user-selector-popover.bk-user-selector-pop2-content[data-theme^='light'] .bk-user-selector-pop2-arrow {\n  background-color: #fff;\n}\n.text-ov {\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n.position-relative {\n  position: relative;\n}\n.position-absolute {\n  position: absolute;\n}\n.overflow-popover-reference {\n  width: 100%;\n}\n.bk-user-selector-tag {\n  display: inline-flex;\n  align-items: center;\n  height: 22px;\n  padding: 0 10px;\n  font-size: 12px;\n  line-height: 22px;\n  color: #63656e;\n  cursor: default;\n  background-color: #f0f1f5;\n  border-color: rgba(151, 155, 165, 0.3);\n  box-sizing: border-box;\n}\n.bk-user-selector-tag.bk-user-selector-tag-success {\n  color: #14a568;\n  border-color: rgba(20, 165, 104, 0.3);\n  background-color: #E4FAF0;\n}\n.bk-user-selector-tag.bk-user-selector-tag-success.bk-user-selector-tag-filled {\n  background-color: #14A568;\n}\n.bk-user-selector-tag.bk-user-selector-tag-success.bk-user-selector-tag-filled:hover {\n  background-color: #42B685;\n}\n.bk-user-selector-tag.bk-user-selector-tag-success:hover:not(.bk-user-selector-tag-filled) {\n  background-color: #C9F5E2;\n}\n.bk-user-selector-tag.bk-user-selector-tag-info {\n  color: #3a84ff;\n  border-color: rgba(58, 132, 255, 0.3);\n  background-color: #EDF4FF;\n}\n.bk-user-selector-tag.bk-user-selector-tag-info.bk-user-selector-tag-filled {\n  background-color: #3A84FF;\n}\n.bk-user-selector-tag.bk-user-selector-tag-info.bk-user-selector-tag-filled:hover {\n  background-color: #609CFE;\n}\n.bk-user-selector-tag.bk-user-selector-tag-info:hover:not(.bk-user-selector-tag-filled) {\n  background-color: #E1ECFF;\n}\n.bk-user-selector-tag.bk-user-selector-tag-warning {\n  color: #fe9c00;\n  border-color: rgba(254, 165, 0, 0.3);\n  background-color: #FFF1DB;\n}\n.bk-user-selector-tag.bk-user-selector-tag-warning.bk-user-selector-tag-filled {\n  background-color: #FE9C00;\n}\n.bk-user-selector-tag.bk-user-selector-tag-warning.bk-user-selector-tag-filled:hover {\n  background-color: #FDAF32;\n}\n.bk-user-selector-tag.bk-user-selector-tag-warning:hover:not(.bk-user-selector-tag-filled) {\n  background-color: #FFE8C3;\n}\n.bk-user-selector-tag.bk-user-selector-tag-danger {\n  color: #ea3636;\n  border-color: rgba(234, 53, 54, 0.3);\n  background-color: #FEEBEA;\n}\n.bk-user-selector-tag.bk-user-selector-tag-danger.bk-user-selector-tag-filled {\n  background-color: #EA3536;\n}\n.bk-user-selector-tag.bk-user-selector-tag-danger.bk-user-selector-tag-filled:hover {\n  background-color: #ED5C5D;\n}\n.bk-user-selector-tag.bk-user-selector-tag-danger:hover:not(.bk-user-selector-tag-filled) {\n  background-color: #FEDDDC;\n}\n.bk-user-selector-tag:hover {\n  background-color: #dcdee5;\n}\n.bk-user-selector-tag.bk-user-selector-tag-filled {\n  color: #fff;\n  background-color: #979BA5;\n}\n.bk-user-selector-tag.bk-user-selector-tag-filled:hover {\n  background-color: #ACAFB6;\n}\n.bk-user-selector-tag.bk-user-selector-tag-stroke {\n  padding: 0 9px;\n  line-height: 20px;\n  border-style: solid;\n  border-width: 1px;\n}\n.bk-user-selector-tag.bk-user-selector-tag-closable {\n  padding: 0 4px 0 10px;\n}\n.bk-user-selector-tag.bk-user-selector-tag-checkable {\n  cursor: pointer;\n  background: none;\n}\n.bk-user-selector-tag.bk-user-selector-tag-checkable:hover {\n  background: #F0F1F5;\n}\n.bk-user-selector-tag.bk-user-selector-tag-check {\n  color: #fff;\n  background: #3a84ff;\n}\n.bk-user-selector-tag.bk-user-selector-tag-check:hover {\n  color: #fff;\n  background: #3a84ff;\n  opacity: 1;\n}\n.bk-user-selector-tag--default {\n  padding: 0 8px;\n}\n.bk-user-selector-tag--small {\n  height: 16px;\n  padding: 0 4px;\n  line-height: 16px;\n}\n.bk-user-selector-tag--small .bk-user-selector-tag-text {\n  font-size: 10px;\n}\n.bk-user-selector-tag-text {\n  flex: 1;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n.bk-user-selector-tag-icon {\n  flex-shrink: 0;\n  margin-right: 4px;\n  font-size: 14px;\n  line-height: 0;\n}\n.bk-user-selector-tag-close {\n  flex-shrink: 0;\n  margin-left: 4px;\n  font-size: 12px;\n  line-height: 0;\n  cursor: pointer;\n}\n.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-a4132257] {\n  min-height: 40px;\n  max-height: 300px;\n  padding: 5px 0;\n  overflow-y: auto;\n}\n.dropdown-content .no-data[data-v-a4132257] {\n  padding: 10px;\n  color: #979ba5;\n  text-align: center;\n}\n.dropdown-content .user-group .group-header[data-v-a4132257] {\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-a4132257] {\n  margin-left: 4px;\n}\n.dropdown-content .user-option[data-v-a4132257] {\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-a4132257]: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-1f435fc8] {\n  position: relative;\n  width: 100%;\n}\n.multiple-selector.is-disabled[data-v-1f435fc8] {\n  pointer-events: none;\n}\n.multiple-selector .tags-container[data-v-1f435fc8] {\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-1f435fc8] {\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-1f435fc8] {\n  display: flex;\n  flex-wrap: wrap;\n  align-items: center;\n}\n.multiple-selector .tag-list[data-v-1f435fc8] {\n  display: flex;\n  flex-wrap: wrap;\n  align-items: center;\n}\n.multiple-selector .tag-wrapper[data-v-1f435fc8] {\n  display: inline-flex;\n  align-items: center;\n  max-width: 100%;\n}\n.multiple-selector .search-input[data-v-1f435fc8] {\n  min-width: 10px;\n  height: 28px;\n  background: transparent;\n  border: none;\n  outline: none;\n}\n.multiple-selector .search-input[data-v-1f435fc8]::placeholder {\n  color: #c4c6cc;\n}\n.multiple-selector .search-input.inline[data-v-1f435fc8] {\n  min-width: 10px;\n}\n.multiple-selector .search-input.last[data-v-1f435fc8], .multiple-selector .search-input.collapsed[data-v-1f435fc8] {\n  flex: 1;\n  min-width: 60px;\n}.single-selector[data-v-c44a1c1d] {\n  position: relative;\n  width: 100%;\n}\n.single-selector.is-disabled[data-v-c44a1c1d] {\n  pointer-events: none;\n}\n.input-container[data-v-c44a1c1d] {\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-c44a1c1d]: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-c44a1c1d] {\n  flex: 1;\n  height: 30px;\n  background: transparent;\n  border: none;\n  outline: none;\n}\n.search-input[data-v-c44a1c1d]::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}";
   document.head.appendChild(__vite_style__);
   function _interopNamespaceDefault(e) {
     const n2 = Object.create(null, { [Symbol.toStringTag]: { value: "Module" } });
@@ -14161,7 +14161,14 @@ ${$(r2)}`), n2;
         return searchResults.value.filter((user) => !props2.selectedUsers.some((selectedUser) => selectedUser.id === user.id)).filter((user) => !props2.excludeUserIds.includes(user.id));
       });
       const userGroupFilter = __WEBPACK_EXTERNAL_MODULE_vue__.computed(() => {
-        return props2.userGroup.filter((group) => !props2.selectedUsers.some((user) => user.id === group.id) && !group.hidden);
+        return props2.userGroup.filter((group) => {
+          var _a, _b;
+          const filtered = !props2.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 (!props2.draggable || !sortableContainerRef.value) return;
@@ -14612,7 +14619,7 @@ ${$(r2)}`), n2;
       };
     }
   });
-  const MultipleSelector = /* @__PURE__ */ _export_sfc(_sfc_main$2, [["__scopeId", "data-v-7ff53892"]]);
+  const MultipleSelector = /* @__PURE__ */ _export_sfc(_sfc_main$2, [["__scopeId", "data-v-1f435fc8"]]);
   const _hoisted_1 = { class: "input-container" };
   const _hoisted_2 = ["placeholder"];
   const _sfc_main$1 = /* @__PURE__ */ __WEBPACK_EXTERNAL_MODULE_vue__.defineComponent({
@@ -14649,7 +14656,14 @@ ${$(r2)}`), n2;
       const searchQuery = __WEBPACK_EXTERNAL_MODULE_vue__.ref("");
       const showDropdown = __WEBPACK_EXTERNAL_MODULE_vue__.ref(false);
       const userGroupFilter = __WEBPACK_EXTERNAL_MODULE_vue__.computed(() => {
-        return props2.userGroup.filter((group) => group.id !== selectedUser.value && !group.hidden);
+        return props2.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 = __WEBPACK_EXTERNAL_MODULE_vue__.computed(() => {
         const userGroup = (props2.userGroup || []).map((group) => ({
@@ -14832,7 +14846,7 @@ ${$(r2)}`), n2;
       };
     }
   });
-  const SingleSelector = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["__scopeId", "data-v-d56195a1"]]);
+  const SingleSelector = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["__scopeId", "data-v-c44a1c1d"]]);
   const _sfc_main = /* @__PURE__ */ __WEBPACK_EXTERNAL_MODULE_vue__.defineComponent({
     ...{
       name: "BkUserSelector"

package/vue2/vue2.css

@@ -870,14 +870,14 @@ optgroup {
   font-size: 12px;
   text-overflow: ellipsis;
   white-space: nowrap;
-}.multiple-selector[data-v-7ff53892] {
+}.multiple-selector[data-v-1f435fc8] {
   position: relative;
   width: 100%;
 }
-.multiple-selector.is-disabled[data-v-7ff53892] {
+.multiple-selector.is-disabled[data-v-1f435fc8] {
   pointer-events: none;
 }
-.multiple-selector .tags-container[data-v-7ff53892] {
+.multiple-selector .tags-container[data-v-1f435fc8] {
   min-height: 32px;
   padding: 1px 10px 1px 8px;
   background-color: #fff;
@@ -885,49 +885,49 @@ optgroup {
   border-radius: 2px;
   transition: all 0.2s ease;
 }
-.multiple-selector .tags-container.focused[data-v-7ff53892] {
+.multiple-selector .tags-container.focused[data-v-1f435fc8] {
   border-color: #3a84ff;
   box-shadow: 0 0 0 2px rgba(58, 132, 255, 0.1);
 }
-.multiple-selector .tags-container.collapsed[data-v-7ff53892] {
+.multiple-selector .tags-container.collapsed[data-v-1f435fc8] {
   display: flex;
   flex-wrap: wrap;
   align-items: center;
 }
-.multiple-selector .tag-list[data-v-7ff53892] {
+.multiple-selector .tag-list[data-v-1f435fc8] {
   display: flex;
   flex-wrap: wrap;
   align-items: center;
 }
-.multiple-selector .tag-wrapper[data-v-7ff53892] {
+.multiple-selector .tag-wrapper[data-v-1f435fc8] {
   display: inline-flex;
   align-items: center;
   max-width: 100%;
 }
-.multiple-selector .search-input[data-v-7ff53892] {
+.multiple-selector .search-input[data-v-1f435fc8] {
   min-width: 10px;
   height: 28px;
   background: transparent;
   border: none;
   outline: none;
 }
-.multiple-selector .search-input[data-v-7ff53892]::placeholder {
+.multiple-selector .search-input[data-v-1f435fc8]::placeholder {
   color: #c4c6cc;
 }
-.multiple-selector .search-input.inline[data-v-7ff53892] {
+.multiple-selector .search-input.inline[data-v-1f435fc8] {
   min-width: 10px;
 }
-.multiple-selector .search-input.last[data-v-7ff53892], .multiple-selector .search-input.collapsed[data-v-7ff53892] {
+.multiple-selector .search-input.last[data-v-1f435fc8], .multiple-selector .search-input.collapsed[data-v-1f435fc8] {
   flex: 1;
   min-width: 60px;
-}.single-selector[data-v-d56195a1] {
+}.single-selector[data-v-c44a1c1d] {
   position: relative;
   width: 100%;
 }
-.single-selector.is-disabled[data-v-d56195a1] {
+.single-selector.is-disabled[data-v-c44a1c1d] {
   pointer-events: none;
 }
-.input-container[data-v-d56195a1] {
+.input-container[data-v-c44a1c1d] {
   position: relative;
   display: flex;
   align-items: center;
@@ -937,18 +937,18 @@ optgroup {
   border: 1px solid #c4c6cc;
   border-radius: 2px;
 }
-.input-container[data-v-d56195a1]:focus-within {
+.input-container[data-v-c44a1c1d]:focus-within {
   border-color: #3a84ff;
   box-shadow: 0 0 0 2px rgba(58, 132, 255, 0.1);
 }
-.search-input[data-v-d56195a1] {
+.search-input[data-v-c44a1c1d] {
   flex: 1;
   height: 30px;
   background: transparent;
   border: none;
   outline: none;
 }
-.search-input[data-v-d56195a1]::placeholder {
+.search-input[data-v-c44a1c1d]::placeholder {
   color: #c4c6cc;
 }.bk-user-selector[data-v-7ce51f9c] {
   position: relative;

package/vue3/index.es.min.js

@@ -3473,7 +3473,14 @@ const _sfc_main$2 = /* @__PURE__ */ defineComponent({
       return searchResults.value.filter((user) => !props.selectedUsers.some((selectedUser) => selectedUser.id === user.id)).filter((user) => !props.excludeUserIds.includes(user.id));
     });
     const userGroupFilter = 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;
@@ -3924,7 +3931,7 @@ const _sfc_main$2 = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const MultipleSelector = /* @__PURE__ */ _export_sfc(_sfc_main$2, [["__scopeId", "data-v-7ff53892"]]);
+const MultipleSelector = /* @__PURE__ */ _export_sfc(_sfc_main$2, [["__scopeId", "data-v-1f435fc8"]]);
 const _hoisted_1 = { class: "input-container" };
 const _hoisted_2 = ["placeholder"];
 const _sfc_main$1 = /* @__PURE__ */ defineComponent({
@@ -3961,7 +3968,14 @@ const _sfc_main$1 = /* @__PURE__ */ defineComponent({
     const searchQuery = ref("");
     const showDropdown = ref(false);
     const userGroupFilter = 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 = computed(() => {
       const userGroup = (props.userGroup || []).map((group) => ({
@@ -4144,7 +4158,7 @@ const _sfc_main$1 = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const SingleSelector = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["__scopeId", "data-v-d56195a1"]]);
+const SingleSelector = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["__scopeId", "data-v-c44a1c1d"]]);
 const _sfc_main = /* @__PURE__ */ defineComponent({
   ...{
     name: "BkUserSelector"

package/vue3/index.iife.min.js

@@ -3,7 +3,7 @@
   try {
     if (typeof document != "undefined") {
       var elementStyle = document.createElement("style");
-      elementStyle.appendChild(document.createTextNode(".scroll-bar-style::-webkit-scrollbar {\n  width: 4px;\n  height: 4px;\n}\n.scroll-bar-style::-webkit-scrollbar-thumb {\n  background: #ddd;\n  border-radius: 20px;\n  box-shadow: inset 0 0 6px rgba(204, 204, 204, 0.3);\n}\nhtml,\nbody {\n  padding: 0;\n  margin: 0;\n}\n* {\n  box-sizing: border-box;\n}\n/**\n * HTML5 display definitions\n * ==========================================================================\n *\n * Correct `block` display not defined for any HTML5 element in IE 8/9.\n * Correct `block` display not defined for `details` or `summary` in IE 10/11 and Firefox.\n * Correct `block` display not defined for `main` in IE 11.\n */\narticle,\naside,\ndetails,\nfigcaption,\nfigure,\nfooter,\nheader,\nhgroup,\nmain,\nmenu,\nnav,\nsection,\nsummary {\n  display: block;\n}\n/**\n * 1. Correct `inline-block` display not defined in IE 8/9.\n * 2. Normalize vertical alignment of `progress` in Chrome, Firefox, and Opera.\n */\naudio,\ncanvas,\nprogress,\nvideo {\n  /* 1 */\n  display: inline-block;\n  /* 2 */\n  vertical-align: baseline;\n}\n/**\n * Prevent modern browsers from displaying `audio` without controls.\n * Remove excess height in iOS 5 devices.\n */\naudio:not([controls]) {\n  display: none;\n  height: 0;\n}\n/**\n * Address `[hidden]` styling not present in IE 8/9/10.\n * Hide the `template` element in IE 8/9/10/11, Safari, and Firefox < 22.\n */\n[hidden],\ntemplate {\n  display: none;\n}\n/**\n * Links\n * ==========================================================================\n *\n * Remove the gray background color from active links in IE 10.\n */\na {\n  background-color: transparent;\n}\n/**\n * Improve readability of focused elements when they are also in an\n * active/hover state.\n */\na:active,\na:hover {\n  outline: 0;\n}\n/**\n * Text-level semantics\n * ==========================================================================\n *\n * Address styling not present in IE 8/9/10/11, Safari, and Chrome.\n */\nabbr[title] {\n  border-bottom: 1px dotted;\n}\n/**\n * Embedded content\n * ==========================================================================\n *\n * Remove border when inside `a` element in IE 8/9/10.\n */\nimg {\n  border: 0;\n}\n/**\n * Correct overflow not hidden in IE 9/10/11.\n */\nsvg:not(:root) {\n  overflow: hidden;\n}\n/**\n * Grouping content\n * ==========================================================================\n *\n * Address margin not present in IE 8/9 and Safari.\n */\nfigure {\n  margin: 1em 40px;\n}\n/**\n * Address differences between Firefox and other browsers.\n */\nhr {\n  height: 0;\n  box-sizing: content-box;\n}\n/**\n * Address odd `em`-unit font size rendering in all browsers.\n *\n * Forms\n * ==========================================================================\n *\n * Known limitation: by default, Chrome and Safari on OS X allow very limited\n * styling of `select`, unless a `border` property is set.\n *\n * 1. Correct color not being inherited.\n *    Known issue: affects color of disabled elements.\n * 2. Correct font properties not being inherited.\n * 3. Address margins set differently in Firefox 4+, Safari, and Chrome.\n */\nbutton,\ninput,\noptgroup,\nselect,\ntextarea {\n  /* 3 */\n  margin: 0;\n  /* 2 */\n  font: inherit;\n  /* 1 */\n  color: inherit;\n}\n/**\n * Address `overflow` set to `hidden` in IE 8/9/10/11.\n */\nbutton {\n  overflow: visible;\n}\n/**\n * Address inconsistent `text-transform` inheritance for `button` and `select`.\n * All other form control elements do not inherit `text-transform` values.\n * Correct `button` style inheritance in Firefox, IE 8/9/10/11, and Opera.\n * Correct `select` style inheritance in Firefox.\n */\nbutton,\nselect {\n  text-transform: none;\n}\n/**\n * 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio` and `video` controls.\n * 2. Correct inability to style clickable `input` types in iOS.\n * 3. Improve usability and consistency of cursor style between image-type `input` and others.\n */\nbutton,\nhtml input[type='button'],\ninput[type='reset'],\ninput[type='submit'] {\n  /* 3 */\n  cursor: pointer;\n  /* 2 */\n  appearance: button;\n}\n/* Re-set default cursor for disabled elements. */\nbutton[disabled],\nhtml input[disabled] {\n  cursor: default;\n}\n/* Remove inner padding and border in Firefox 4+. */\nbutton::-moz-focus-inner,\ninput::-moz-focus-inner {\n  padding: 0;\n  border: 0;\n}\n/**\n * Address Firefox 4+ setting `line-height` on `input` using `!important` in the UA stylesheet.\n */\ninput {\n  line-height: normal;\n}\n/**\n * It's recommended that you don't attempt to style these elements.\n * Firefox's implementation doesn't respect box-sizing, padding, or width.\n *\n * 1. Address box sizing set to `content-box` in IE 8/9/10.\n * 2. Remove excess padding in IE 8/9/10.\n */\ninput[type='checkbox'],\ninput[type='radio'] {\n  /* 2 */\n  padding: 0;\n  /* 1 */\n  box-sizing: border-box;\n}\n/**\n * Fix the cursor style for Chrome's increment/decrement buttons. For certain\n * `font-size` values of the `input`, it causes the cursor style of the\n * decrement button to change from `default` to `text`.\n */\ninput[type='number']::-webkit-inner-spin-button,\ninput[type='number']::-webkit-outer-spin-button {\n  height: auto;\n}\n::-ms-clear,\n::-ms-reveal {\n  display: none;\n}\ninput[type='text']::-ms-clear {\n  display: none;\n}\ninput[type='text']::-ms-reveal {\n  display: none;\n}\n/**\n * 1. Address `appearance` set to `searchfield` in Safari and Chrome.\n * 2. Address `box-sizing` set to `border-box` in Safari and Chrome.\n */\ninput[type='search'] {\n  /* 2 */\n  box-sizing: content-box;\n  /* 1 */\n  appearance: textfield;\n}\n/**\n * Remove inner padding and search cancel button in Safari and Chrome on OS X.\n * Safari (but not Chrome) clips the cancel button when the search input has\n * padding (and `textfield` appearance).\n */\ninput[type='search']::-webkit-search-cancel-button,\ninput[type='search']::-webkit-search-decoration {\n  appearance: none;\n}\n/**\n * Define consistent border, margin, and padding.\n */\nfieldset {\n  padding: 0.35em 0.625em 0.75em;\n  margin: 0 2px;\n  border: 1px solid #c0c0c0;\n}\n/**\n * 1. Correct `color` not being inherited in IE 8/9/10/11.\n * 2. Remove padding so people aren't caught out if they zero out fieldsets.\n */\nlegend {\n  /* 2 */\n  padding: 0;\n  /* 1 */\n  border: 0;\n}\n/**\n * Remove default vertical scrollbar in IE 8/9/10/11.\n */\ntextarea {\n  overflow: auto;\n}\n/**\n * Don't inherit the `font-weight` (applied by a rule above).\n * NOTE: the default cannot safely be changed in Chrome and Safari on OS X.\n */\noptgroup {\n  font-weight: bold;\n}\n/**\n* BK-Scroll-Style\n*/\n.bk-scroll-y {\n  overflow-y: auto;\n}\n.bk-scroll-y::-webkit-scrollbar {\n  width: 4px;\n  height: 4px;\n}\n.bk-scroll-y::-webkit-scrollbar-thumb {\n  background: #ddd;\n  border-radius: 20px;\n  box-shadow: inset 0 0 6px rgba(204, 204, 204, 0.3);\n}\n.bk-scroll-x {\n  overflow-x: auto;\n}\n.bk-scroll-x::-webkit-scrollbar {\n  width: 4px;\n  height: 4px;\n}\n.bk-scroll-x::-webkit-scrollbar-thumb {\n  background: #ddd;\n  border-radius: 20px;\n  box-shadow: inset 0 0 6px rgba(204, 204, 204, 0.3);\n}\n@keyframes loading-scale-animate {\n  0% {\n    transform: scale(1);\n  }\n  100% {\n    transform: scale(0.6);\n  }\n}\n@keyframes fade {\n  100% {\n    background-color: transparent;\n  }\n}\n.bk-user-selector-transition .bk-user-selector-fade-enter-active,\n.bk-user-selector-transition .bk-user-selector-fade-leave-active {\n  transition: all 0.3s cubic-bezier(0.55, 0, 0.1, 1);\n}\n.bk-user-selector-transition .bk-user-selector-fade-enter,\n.bk-user-selector-transition .bk-user-selector-fade-leave-to {\n  opacity: 0;\n}\n.clearfix-style::after {\n  display: block;\n  height: 0;\n  clear: both;\n  font-size: 0;\n  content: '';\n  visibility: hidden;\n}\n.bk-user-selector-popper {\n  display: none;\n  padding: 7px 14px;\n  font-size: 12px;\n  color: #fff;\n  background: #333;\n  border-radius: 4px;\n}\n.bk-user-selector-popper.light {\n  color: #63656e;\n  background: #fff;\n  box-shadow: #dcdee5 0 0 6px 0;\n}\n.bk-user-selector-popper .bk-user-selector-popper-arrow,\n.bk-user-selector-popper .bk-user-selector-popper-arrow::before {\n  position: absolute;\n  width: 8px;\n  height: 8px;\n  background: inherit;\n}\n.bk-user-selector-popper .bk-user-selector-popper-arrow {\n  visibility: hidden;\n}\n.bk-user-selector-popper .bk-user-selector-popper-arrow::before {\n  content: '';\n  visibility: visible;\n  transform: rotate(45deg);\n}\n.bk-user-selector-popper[data-show] {\n  display: block;\n}\n.bk-user-selector-popper[data-popper-placement^='top'] > .bk-user-selector-popper-arrow {\n  bottom: -4px;\n}\n.bk-user-selector-popper[data-popper-placement^='bottom'] > .bk-user-selector-popper-arrow {\n  top: -4px;\n}\n.bk-user-selector-popper[data-popper-placement^='left'] > .bk-user-selector-popper-arrow {\n  right: -4px;\n}\n.bk-user-selector-popper[data-popper-placement^='right'] > .bk-user-selector-popper-arrow {\n  left: -4px;\n}\n.bk-user-selector-loading-wrapper {\n  position: static;\n  vertical-align: middle;\n}\n.bk-user-selector-loading-wrapper:not(.bk-user-selector-nested-loading):not(.bk-user-selector-directive-loading) {\n  display: inline-flex;\n}\n.bk-user-selector-loading-wrapper.bk-user-selector-directive-loading {\n  width: 100%;\n  height: 100%;\n}\n.bk-user-selector-loading-wrapper.bk-user-selector-directive-loading,\n.bk-user-selector-loading-wrapper.bk-user-selector-nested-loading {\n  position: relative;\n}\n.bk-user-selector-loading-wrapper.bk-user-selector-directive-loading.is-block,\n.bk-user-selector-loading-wrapper.bk-user-selector-nested-loading.is-block {\n  display: block;\n}\n.bk-user-selector-loading-wrapper.bk-user-selector-directive-loading .bk-user-selector-loading-indicator,\n.bk-user-selector-loading-wrapper.bk-user-selector-nested-loading .bk-user-selector-loading-indicator {\n  position: absolute;\n  top: 50%;\n  left: 50%;\n  z-index: 11;\n  text-align: center;\n  transform: translate(-50%, -50%);\n}\n.bk-user-selector-loading-wrapper .dot {\n  display: inline-flex;\n  width: 14px;\n  height: 14px;\n  margin-right: 10px;\n  border-radius: 50%;\n  transform: scale(0.6);\n  animation-duration: 0.8s;\n  animation-iteration-count: infinite;\n  animation-name: loading-scale-animate;\n  animation-direction: normal;\n}\n.bk-user-selector-loading-wrapper .oval {\n  position: absolute;\n  width: 6px;\n  height: 8px;\n  background-color: #63656e;\n  border-radius: 8px;\n  animation-duration: 1.2s;\n  animation-iteration-count: infinite;\n  animation-name: fade;\n  transform-origin: center 24px;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-mask {\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator {\n  display: flex;\n  line-height: 1;\n  text-align: center;\n  flex-direction: column;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-success .oval,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-success .dot,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-success .dot-1,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-success .dot-2,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-success .dot-3,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-success .dot-4 {\n  background-color: #2dcb56;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-danger .oval,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-danger .dot,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-danger .dot-1,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-danger .dot-2,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-danger .dot-3,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-danger .dot-4 {\n  background-color: #ea3636;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-warning .oval,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-warning .dot,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-warning .dot-1,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-warning .dot-2,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-warning .dot-3,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-warning .dot-4 {\n  background-color: #ff9c01;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-primary .oval,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-primary .dot,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-primary .dot-1,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-primary .dot-2,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-primary .dot-3,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-primary .dot-4 {\n  background-color: #3a84ff;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-white .oval,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-white .dot,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-white .dot-1,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-white .dot-2,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-white .dot-3,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-white .dot-4 {\n  background-color: white;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-default .oval,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-default .dot,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-default .dot-1,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-default .dot-2,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-default .dot-3,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-default .dot-4 {\n  background-color: #c4c6cc;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator .dot-1 {\n  background-color: #ea3636;\n  animation-delay: 0.1s;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator .dot-2 {\n  background-color: #ff9c01;\n  animation-delay: 0.25s;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator .dot-3 {\n  background-color: #2dcb56;\n  animation-delay: 0.4s;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator .dot-4 {\n  background-color: #3a84ff;\n  animation-delay: 0.55s;\n  margin-right: 0px;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator .oval-1 {\n  transform: rotate(135deg);\n  animation-delay: -0.45s;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator .oval-2 {\n  transform: rotate(90deg);\n  animation-delay: -0.6s;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator .oval-3 {\n  transform: rotate(45deg);\n  animation-delay: -0.75s;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator .oval-4 {\n  transform: rotate(0deg);\n  animation-delay: -0.9s;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator .oval-5 {\n  transform: rotate(-45deg);\n  animation-delay: -1.05s;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator .oval-6 {\n  transform: rotate(-90deg);\n  animation-delay: -1.2s;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator .oval-7 {\n  transform: rotate(-135deg);\n  animation-delay: -1.35s;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator .oval-8 {\n  transform: rotate(-180deg);\n  animation-delay: -1.5s;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator .bk-user-selector-normal-indicator {\n  display: inline-flex;\n  justify-content: center;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator .bk-user-selector-spin-indicator {\n  position: relative;\n  display: inline-flex;\n  justify-content: center;\n  width: 48px;\n  height: 48px;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-size-mini .bk-user-selector-spin-indicator {\n  height: 16px;\n  width: 16px;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-size-mini .dot {\n  width: 3px;\n  height: 3px;\n  margin-right: 3px;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-size-mini .dot.dot-4 {\n  margin-right: 0;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-size-mini .oval {\n  width: 2px;\n  height: 3px;\n  border-radius: 3px;\n  transform-origin: center 8px;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-size-mini .bk-user-selector-loading-title {\n  font-size: 14px;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-size-small .bk-user-selector-spin-indicator {\n  height: 32px;\n  width: 32px;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-size-small .dot {\n  width: 6px;\n  height: 6px;\n  margin-right: 6px;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-size-small .dot.dot-4 {\n  margin-right: 0;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-size-small .oval {\n  width: 4px;\n  height: 5px;\n  border-radius: 5px;\n  transform-origin: center 16px;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-size-small .bk-user-selector-loading-title {\n  font-size: 12px;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-size-large .bk-user-selector-spin-indicator {\n  height: 68px;\n  width: 68px;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-size-large .dot {\n  width: 20px;\n  height: 20px;\n  margin-right: 12px;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-size-large .dot.dot-4 {\n  margin-right: 0;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-size-large .oval {\n  width: 8px;\n  height: 12px;\n  border-radius: 12px;\n  transform-origin: center 34px;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-size-large .bk-user-selector-loading-title {\n  font-size: 14px;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator .bk-user-selector-loading-title {\n  margin-top: 8px;\n  font-size: 14px;\n  line-height: normal;\n  color: #63656e;\n  text-align: center;\n}\n.bk-user-selector-popover.bk-user-selector-pop2-content {\n  position: absolute;\n  padding: 12px;\n  font-size: 12px;\n  color: #fff;\n  background: #26323d;\n  border-radius: 4px;\n  box-sizing: border-box;\n}\n.bk-user-selector-popover.bk-user-selector-pop2-content.hidden {\n  display: none;\n}\n.bk-user-selector-popover.bk-user-selector-pop2-content .bk-user-selector-pop2-arrow {\n  position: absolute;\n  z-index: -1;\n  width: 8px;\n  height: 8px;\n  background: #333;\n  transform: rotate(45deg);\n}\n.bk-user-selector-popover.bk-user-selector-pop2-content[data-theme^='light'] {\n  color: #26323d;\n  background-color: #fff;\n  box-shadow: 0 0 6px 0 #dcdee5;\n}\n.bk-user-selector-popover.bk-user-selector-pop2-content[data-theme^='light'] .bk-user-selector-pop2-arrow {\n  background-color: #fff;\n}\n.text-ov {\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n.position-relative {\n  position: relative;\n}\n.position-absolute {\n  position: absolute;\n}\n.overflow-popover-reference {\n  width: 100%;\n}\n.bk-user-selector-tag {\n  display: inline-flex;\n  align-items: center;\n  height: 22px;\n  padding: 0 10px;\n  font-size: 12px;\n  line-height: 22px;\n  color: #63656e;\n  cursor: default;\n  background-color: #f0f1f5;\n  border-color: rgba(151, 155, 165, 0.3);\n  box-sizing: border-box;\n}\n.bk-user-selector-tag.bk-user-selector-tag-success {\n  color: #14a568;\n  border-color: rgba(20, 165, 104, 0.3);\n  background-color: #E4FAF0;\n}\n.bk-user-selector-tag.bk-user-selector-tag-success.bk-user-selector-tag-filled {\n  background-color: #14A568;\n}\n.bk-user-selector-tag.bk-user-selector-tag-success.bk-user-selector-tag-filled:hover {\n  background-color: #42B685;\n}\n.bk-user-selector-tag.bk-user-selector-tag-success:hover:not(.bk-user-selector-tag-filled) {\n  background-color: #C9F5E2;\n}\n.bk-user-selector-tag.bk-user-selector-tag-info {\n  color: #3a84ff;\n  border-color: rgba(58, 132, 255, 0.3);\n  background-color: #EDF4FF;\n}\n.bk-user-selector-tag.bk-user-selector-tag-info.bk-user-selector-tag-filled {\n  background-color: #3A84FF;\n}\n.bk-user-selector-tag.bk-user-selector-tag-info.bk-user-selector-tag-filled:hover {\n  background-color: #609CFE;\n}\n.bk-user-selector-tag.bk-user-selector-tag-info:hover:not(.bk-user-selector-tag-filled) {\n  background-color: #E1ECFF;\n}\n.bk-user-selector-tag.bk-user-selector-tag-warning {\n  color: #fe9c00;\n  border-color: rgba(254, 165, 0, 0.3);\n  background-color: #FFF1DB;\n}\n.bk-user-selector-tag.bk-user-selector-tag-warning.bk-user-selector-tag-filled {\n  background-color: #FE9C00;\n}\n.bk-user-selector-tag.bk-user-selector-tag-warning.bk-user-selector-tag-filled:hover {\n  background-color: #FDAF32;\n}\n.bk-user-selector-tag.bk-user-selector-tag-warning:hover:not(.bk-user-selector-tag-filled) {\n  background-color: #FFE8C3;\n}\n.bk-user-selector-tag.bk-user-selector-tag-danger {\n  color: #ea3636;\n  border-color: rgba(234, 53, 54, 0.3);\n  background-color: #FEEBEA;\n}\n.bk-user-selector-tag.bk-user-selector-tag-danger.bk-user-selector-tag-filled {\n  background-color: #EA3536;\n}\n.bk-user-selector-tag.bk-user-selector-tag-danger.bk-user-selector-tag-filled:hover {\n  background-color: #ED5C5D;\n}\n.bk-user-selector-tag.bk-user-selector-tag-danger:hover:not(.bk-user-selector-tag-filled) {\n  background-color: #FEDDDC;\n}\n.bk-user-selector-tag:hover {\n  background-color: #dcdee5;\n}\n.bk-user-selector-tag.bk-user-selector-tag-filled {\n  color: #fff;\n  background-color: #979BA5;\n}\n.bk-user-selector-tag.bk-user-selector-tag-filled:hover {\n  background-color: #ACAFB6;\n}\n.bk-user-selector-tag.bk-user-selector-tag-stroke {\n  padding: 0 9px;\n  line-height: 20px;\n  border-style: solid;\n  border-width: 1px;\n}\n.bk-user-selector-tag.bk-user-selector-tag-closable {\n  padding: 0 4px 0 10px;\n}\n.bk-user-selector-tag.bk-user-selector-tag-checkable {\n  cursor: pointer;\n  background: none;\n}\n.bk-user-selector-tag.bk-user-selector-tag-checkable:hover {\n  background: #F0F1F5;\n}\n.bk-user-selector-tag.bk-user-selector-tag-check {\n  color: #fff;\n  background: #3a84ff;\n}\n.bk-user-selector-tag.bk-user-selector-tag-check:hover {\n  color: #fff;\n  background: #3a84ff;\n  opacity: 1;\n}\n.bk-user-selector-tag--default {\n  padding: 0 8px;\n}\n.bk-user-selector-tag--small {\n  height: 16px;\n  padding: 0 4px;\n  line-height: 16px;\n}\n.bk-user-selector-tag--small .bk-user-selector-tag-text {\n  font-size: 10px;\n}\n.bk-user-selector-tag-text {\n  flex: 1;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n.bk-user-selector-tag-icon {\n  flex-shrink: 0;\n  margin-right: 4px;\n  font-size: 14px;\n  line-height: 0;\n}\n.bk-user-selector-tag-close {\n  flex-shrink: 0;\n  margin-left: 4px;\n  font-size: 12px;\n  line-height: 0;\n  cursor: pointer;\n}\n.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-a4132257] {\n  min-height: 40px;\n  max-height: 300px;\n  padding: 5px 0;\n  overflow-y: auto;\n}\n.dropdown-content .no-data[data-v-a4132257] {\n  padding: 10px;\n  color: #979ba5;\n  text-align: center;\n}\n.dropdown-content .user-group .group-header[data-v-a4132257] {\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-a4132257] {\n  margin-left: 4px;\n}\n.dropdown-content .user-option[data-v-a4132257] {\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-a4132257]: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-7ff53892] {\n  position: relative;\n  width: 100%;\n}\n.multiple-selector.is-disabled[data-v-7ff53892] {\n  pointer-events: none;\n}\n.multiple-selector .tags-container[data-v-7ff53892] {\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-7ff53892] {\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-7ff53892] {\n  display: flex;\n  flex-wrap: wrap;\n  align-items: center;\n}\n.multiple-selector .tag-list[data-v-7ff53892] {\n  display: flex;\n  flex-wrap: wrap;\n  align-items: center;\n}\n.multiple-selector .tag-wrapper[data-v-7ff53892] {\n  display: inline-flex;\n  align-items: center;\n  max-width: 100%;\n}\n.multiple-selector .search-input[data-v-7ff53892] {\n  min-width: 10px;\n  height: 28px;\n  background: transparent;\n  border: none;\n  outline: none;\n}\n.multiple-selector .search-input[data-v-7ff53892]::placeholder {\n  color: #c4c6cc;\n}\n.multiple-selector .search-input.inline[data-v-7ff53892] {\n  min-width: 10px;\n}\n.multiple-selector .search-input.last[data-v-7ff53892], .multiple-selector .search-input.collapsed[data-v-7ff53892] {\n  flex: 1;\n  min-width: 60px;\n}.single-selector[data-v-d56195a1] {\n  position: relative;\n  width: 100%;\n}\n.single-selector.is-disabled[data-v-d56195a1] {\n  pointer-events: none;\n}\n.input-container[data-v-d56195a1] {\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-d56195a1]: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-d56195a1] {\n  flex: 1;\n  height: 30px;\n  background: transparent;\n  border: none;\n  outline: none;\n}\n.search-input[data-v-d56195a1]::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}"));
+      elementStyle.appendChild(document.createTextNode(".scroll-bar-style::-webkit-scrollbar {\n  width: 4px;\n  height: 4px;\n}\n.scroll-bar-style::-webkit-scrollbar-thumb {\n  background: #ddd;\n  border-radius: 20px;\n  box-shadow: inset 0 0 6px rgba(204, 204, 204, 0.3);\n}\nhtml,\nbody {\n  padding: 0;\n  margin: 0;\n}\n* {\n  box-sizing: border-box;\n}\n/**\n * HTML5 display definitions\n * ==========================================================================\n *\n * Correct `block` display not defined for any HTML5 element in IE 8/9.\n * Correct `block` display not defined for `details` or `summary` in IE 10/11 and Firefox.\n * Correct `block` display not defined for `main` in IE 11.\n */\narticle,\naside,\ndetails,\nfigcaption,\nfigure,\nfooter,\nheader,\nhgroup,\nmain,\nmenu,\nnav,\nsection,\nsummary {\n  display: block;\n}\n/**\n * 1. Correct `inline-block` display not defined in IE 8/9.\n * 2. Normalize vertical alignment of `progress` in Chrome, Firefox, and Opera.\n */\naudio,\ncanvas,\nprogress,\nvideo {\n  /* 1 */\n  display: inline-block;\n  /* 2 */\n  vertical-align: baseline;\n}\n/**\n * Prevent modern browsers from displaying `audio` without controls.\n * Remove excess height in iOS 5 devices.\n */\naudio:not([controls]) {\n  display: none;\n  height: 0;\n}\n/**\n * Address `[hidden]` styling not present in IE 8/9/10.\n * Hide the `template` element in IE 8/9/10/11, Safari, and Firefox < 22.\n */\n[hidden],\ntemplate {\n  display: none;\n}\n/**\n * Links\n * ==========================================================================\n *\n * Remove the gray background color from active links in IE 10.\n */\na {\n  background-color: transparent;\n}\n/**\n * Improve readability of focused elements when they are also in an\n * active/hover state.\n */\na:active,\na:hover {\n  outline: 0;\n}\n/**\n * Text-level semantics\n * ==========================================================================\n *\n * Address styling not present in IE 8/9/10/11, Safari, and Chrome.\n */\nabbr[title] {\n  border-bottom: 1px dotted;\n}\n/**\n * Embedded content\n * ==========================================================================\n *\n * Remove border when inside `a` element in IE 8/9/10.\n */\nimg {\n  border: 0;\n}\n/**\n * Correct overflow not hidden in IE 9/10/11.\n */\nsvg:not(:root) {\n  overflow: hidden;\n}\n/**\n * Grouping content\n * ==========================================================================\n *\n * Address margin not present in IE 8/9 and Safari.\n */\nfigure {\n  margin: 1em 40px;\n}\n/**\n * Address differences between Firefox and other browsers.\n */\nhr {\n  height: 0;\n  box-sizing: content-box;\n}\n/**\n * Address odd `em`-unit font size rendering in all browsers.\n *\n * Forms\n * ==========================================================================\n *\n * Known limitation: by default, Chrome and Safari on OS X allow very limited\n * styling of `select`, unless a `border` property is set.\n *\n * 1. Correct color not being inherited.\n *    Known issue: affects color of disabled elements.\n * 2. Correct font properties not being inherited.\n * 3. Address margins set differently in Firefox 4+, Safari, and Chrome.\n */\nbutton,\ninput,\noptgroup,\nselect,\ntextarea {\n  /* 3 */\n  margin: 0;\n  /* 2 */\n  font: inherit;\n  /* 1 */\n  color: inherit;\n}\n/**\n * Address `overflow` set to `hidden` in IE 8/9/10/11.\n */\nbutton {\n  overflow: visible;\n}\n/**\n * Address inconsistent `text-transform` inheritance for `button` and `select`.\n * All other form control elements do not inherit `text-transform` values.\n * Correct `button` style inheritance in Firefox, IE 8/9/10/11, and Opera.\n * Correct `select` style inheritance in Firefox.\n */\nbutton,\nselect {\n  text-transform: none;\n}\n/**\n * 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio` and `video` controls.\n * 2. Correct inability to style clickable `input` types in iOS.\n * 3. Improve usability and consistency of cursor style between image-type `input` and others.\n */\nbutton,\nhtml input[type='button'],\ninput[type='reset'],\ninput[type='submit'] {\n  /* 3 */\n  cursor: pointer;\n  /* 2 */\n  appearance: button;\n}\n/* Re-set default cursor for disabled elements. */\nbutton[disabled],\nhtml input[disabled] {\n  cursor: default;\n}\n/* Remove inner padding and border in Firefox 4+. */\nbutton::-moz-focus-inner,\ninput::-moz-focus-inner {\n  padding: 0;\n  border: 0;\n}\n/**\n * Address Firefox 4+ setting `line-height` on `input` using `!important` in the UA stylesheet.\n */\ninput {\n  line-height: normal;\n}\n/**\n * It's recommended that you don't attempt to style these elements.\n * Firefox's implementation doesn't respect box-sizing, padding, or width.\n *\n * 1. Address box sizing set to `content-box` in IE 8/9/10.\n * 2. Remove excess padding in IE 8/9/10.\n */\ninput[type='checkbox'],\ninput[type='radio'] {\n  /* 2 */\n  padding: 0;\n  /* 1 */\n  box-sizing: border-box;\n}\n/**\n * Fix the cursor style for Chrome's increment/decrement buttons. For certain\n * `font-size` values of the `input`, it causes the cursor style of the\n * decrement button to change from `default` to `text`.\n */\ninput[type='number']::-webkit-inner-spin-button,\ninput[type='number']::-webkit-outer-spin-button {\n  height: auto;\n}\n::-ms-clear,\n::-ms-reveal {\n  display: none;\n}\ninput[type='text']::-ms-clear {\n  display: none;\n}\ninput[type='text']::-ms-reveal {\n  display: none;\n}\n/**\n * 1. Address `appearance` set to `searchfield` in Safari and Chrome.\n * 2. Address `box-sizing` set to `border-box` in Safari and Chrome.\n */\ninput[type='search'] {\n  /* 2 */\n  box-sizing: content-box;\n  /* 1 */\n  appearance: textfield;\n}\n/**\n * Remove inner padding and search cancel button in Safari and Chrome on OS X.\n * Safari (but not Chrome) clips the cancel button when the search input has\n * padding (and `textfield` appearance).\n */\ninput[type='search']::-webkit-search-cancel-button,\ninput[type='search']::-webkit-search-decoration {\n  appearance: none;\n}\n/**\n * Define consistent border, margin, and padding.\n */\nfieldset {\n  padding: 0.35em 0.625em 0.75em;\n  margin: 0 2px;\n  border: 1px solid #c0c0c0;\n}\n/**\n * 1. Correct `color` not being inherited in IE 8/9/10/11.\n * 2. Remove padding so people aren't caught out if they zero out fieldsets.\n */\nlegend {\n  /* 2 */\n  padding: 0;\n  /* 1 */\n  border: 0;\n}\n/**\n * Remove default vertical scrollbar in IE 8/9/10/11.\n */\ntextarea {\n  overflow: auto;\n}\n/**\n * Don't inherit the `font-weight` (applied by a rule above).\n * NOTE: the default cannot safely be changed in Chrome and Safari on OS X.\n */\noptgroup {\n  font-weight: bold;\n}\n/**\n* BK-Scroll-Style\n*/\n.bk-scroll-y {\n  overflow-y: auto;\n}\n.bk-scroll-y::-webkit-scrollbar {\n  width: 4px;\n  height: 4px;\n}\n.bk-scroll-y::-webkit-scrollbar-thumb {\n  background: #ddd;\n  border-radius: 20px;\n  box-shadow: inset 0 0 6px rgba(204, 204, 204, 0.3);\n}\n.bk-scroll-x {\n  overflow-x: auto;\n}\n.bk-scroll-x::-webkit-scrollbar {\n  width: 4px;\n  height: 4px;\n}\n.bk-scroll-x::-webkit-scrollbar-thumb {\n  background: #ddd;\n  border-radius: 20px;\n  box-shadow: inset 0 0 6px rgba(204, 204, 204, 0.3);\n}\n@keyframes loading-scale-animate {\n  0% {\n    transform: scale(1);\n  }\n  100% {\n    transform: scale(0.6);\n  }\n}\n@keyframes fade {\n  100% {\n    background-color: transparent;\n  }\n}\n.bk-user-selector-transition .bk-user-selector-fade-enter-active,\n.bk-user-selector-transition .bk-user-selector-fade-leave-active {\n  transition: all 0.3s cubic-bezier(0.55, 0, 0.1, 1);\n}\n.bk-user-selector-transition .bk-user-selector-fade-enter,\n.bk-user-selector-transition .bk-user-selector-fade-leave-to {\n  opacity: 0;\n}\n.clearfix-style::after {\n  display: block;\n  height: 0;\n  clear: both;\n  font-size: 0;\n  content: '';\n  visibility: hidden;\n}\n.bk-user-selector-popper {\n  display: none;\n  padding: 7px 14px;\n  font-size: 12px;\n  color: #fff;\n  background: #333;\n  border-radius: 4px;\n}\n.bk-user-selector-popper.light {\n  color: #63656e;\n  background: #fff;\n  box-shadow: #dcdee5 0 0 6px 0;\n}\n.bk-user-selector-popper .bk-user-selector-popper-arrow,\n.bk-user-selector-popper .bk-user-selector-popper-arrow::before {\n  position: absolute;\n  width: 8px;\n  height: 8px;\n  background: inherit;\n}\n.bk-user-selector-popper .bk-user-selector-popper-arrow {\n  visibility: hidden;\n}\n.bk-user-selector-popper .bk-user-selector-popper-arrow::before {\n  content: '';\n  visibility: visible;\n  transform: rotate(45deg);\n}\n.bk-user-selector-popper[data-show] {\n  display: block;\n}\n.bk-user-selector-popper[data-popper-placement^='top'] > .bk-user-selector-popper-arrow {\n  bottom: -4px;\n}\n.bk-user-selector-popper[data-popper-placement^='bottom'] > .bk-user-selector-popper-arrow {\n  top: -4px;\n}\n.bk-user-selector-popper[data-popper-placement^='left'] > .bk-user-selector-popper-arrow {\n  right: -4px;\n}\n.bk-user-selector-popper[data-popper-placement^='right'] > .bk-user-selector-popper-arrow {\n  left: -4px;\n}\n.bk-user-selector-loading-wrapper {\n  position: static;\n  vertical-align: middle;\n}\n.bk-user-selector-loading-wrapper:not(.bk-user-selector-nested-loading):not(.bk-user-selector-directive-loading) {\n  display: inline-flex;\n}\n.bk-user-selector-loading-wrapper.bk-user-selector-directive-loading {\n  width: 100%;\n  height: 100%;\n}\n.bk-user-selector-loading-wrapper.bk-user-selector-directive-loading,\n.bk-user-selector-loading-wrapper.bk-user-selector-nested-loading {\n  position: relative;\n}\n.bk-user-selector-loading-wrapper.bk-user-selector-directive-loading.is-block,\n.bk-user-selector-loading-wrapper.bk-user-selector-nested-loading.is-block {\n  display: block;\n}\n.bk-user-selector-loading-wrapper.bk-user-selector-directive-loading .bk-user-selector-loading-indicator,\n.bk-user-selector-loading-wrapper.bk-user-selector-nested-loading .bk-user-selector-loading-indicator {\n  position: absolute;\n  top: 50%;\n  left: 50%;\n  z-index: 11;\n  text-align: center;\n  transform: translate(-50%, -50%);\n}\n.bk-user-selector-loading-wrapper .dot {\n  display: inline-flex;\n  width: 14px;\n  height: 14px;\n  margin-right: 10px;\n  border-radius: 50%;\n  transform: scale(0.6);\n  animation-duration: 0.8s;\n  animation-iteration-count: infinite;\n  animation-name: loading-scale-animate;\n  animation-direction: normal;\n}\n.bk-user-selector-loading-wrapper .oval {\n  position: absolute;\n  width: 6px;\n  height: 8px;\n  background-color: #63656e;\n  border-radius: 8px;\n  animation-duration: 1.2s;\n  animation-iteration-count: infinite;\n  animation-name: fade;\n  transform-origin: center 24px;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-mask {\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator {\n  display: flex;\n  line-height: 1;\n  text-align: center;\n  flex-direction: column;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-success .oval,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-success .dot,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-success .dot-1,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-success .dot-2,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-success .dot-3,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-success .dot-4 {\n  background-color: #2dcb56;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-danger .oval,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-danger .dot,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-danger .dot-1,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-danger .dot-2,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-danger .dot-3,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-danger .dot-4 {\n  background-color: #ea3636;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-warning .oval,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-warning .dot,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-warning .dot-1,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-warning .dot-2,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-warning .dot-3,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-warning .dot-4 {\n  background-color: #ff9c01;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-primary .oval,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-primary .dot,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-primary .dot-1,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-primary .dot-2,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-primary .dot-3,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-primary .dot-4 {\n  background-color: #3a84ff;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-white .oval,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-white .dot,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-white .dot-1,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-white .dot-2,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-white .dot-3,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-white .dot-4 {\n  background-color: white;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-default .oval,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-default .dot,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-default .dot-1,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-default .dot-2,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-default .dot-3,\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-default .dot-4 {\n  background-color: #c4c6cc;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator .dot-1 {\n  background-color: #ea3636;\n  animation-delay: 0.1s;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator .dot-2 {\n  background-color: #ff9c01;\n  animation-delay: 0.25s;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator .dot-3 {\n  background-color: #2dcb56;\n  animation-delay: 0.4s;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator .dot-4 {\n  background-color: #3a84ff;\n  animation-delay: 0.55s;\n  margin-right: 0px;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator .oval-1 {\n  transform: rotate(135deg);\n  animation-delay: -0.45s;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator .oval-2 {\n  transform: rotate(90deg);\n  animation-delay: -0.6s;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator .oval-3 {\n  transform: rotate(45deg);\n  animation-delay: -0.75s;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator .oval-4 {\n  transform: rotate(0deg);\n  animation-delay: -0.9s;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator .oval-5 {\n  transform: rotate(-45deg);\n  animation-delay: -1.05s;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator .oval-6 {\n  transform: rotate(-90deg);\n  animation-delay: -1.2s;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator .oval-7 {\n  transform: rotate(-135deg);\n  animation-delay: -1.35s;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator .oval-8 {\n  transform: rotate(-180deg);\n  animation-delay: -1.5s;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator .bk-user-selector-normal-indicator {\n  display: inline-flex;\n  justify-content: center;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator .bk-user-selector-spin-indicator {\n  position: relative;\n  display: inline-flex;\n  justify-content: center;\n  width: 48px;\n  height: 48px;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-size-mini .bk-user-selector-spin-indicator {\n  height: 16px;\n  width: 16px;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-size-mini .dot {\n  width: 3px;\n  height: 3px;\n  margin-right: 3px;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-size-mini .dot.dot-4 {\n  margin-right: 0;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-size-mini .oval {\n  width: 2px;\n  height: 3px;\n  border-radius: 3px;\n  transform-origin: center 8px;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-size-mini .bk-user-selector-loading-title {\n  font-size: 14px;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-size-small .bk-user-selector-spin-indicator {\n  height: 32px;\n  width: 32px;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-size-small .dot {\n  width: 6px;\n  height: 6px;\n  margin-right: 6px;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-size-small .dot.dot-4 {\n  margin-right: 0;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-size-small .oval {\n  width: 4px;\n  height: 5px;\n  border-radius: 5px;\n  transform-origin: center 16px;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-size-small .bk-user-selector-loading-title {\n  font-size: 12px;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-size-large .bk-user-selector-spin-indicator {\n  height: 68px;\n  width: 68px;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-size-large .dot {\n  width: 20px;\n  height: 20px;\n  margin-right: 12px;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-size-large .dot.dot-4 {\n  margin-right: 0;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-size-large .oval {\n  width: 8px;\n  height: 12px;\n  border-radius: 12px;\n  transform-origin: center 34px;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-size-large .bk-user-selector-loading-title {\n  font-size: 14px;\n}\n.bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator .bk-user-selector-loading-title {\n  margin-top: 8px;\n  font-size: 14px;\n  line-height: normal;\n  color: #63656e;\n  text-align: center;\n}\n.bk-user-selector-popover.bk-user-selector-pop2-content {\n  position: absolute;\n  padding: 12px;\n  font-size: 12px;\n  color: #fff;\n  background: #26323d;\n  border-radius: 4px;\n  box-sizing: border-box;\n}\n.bk-user-selector-popover.bk-user-selector-pop2-content.hidden {\n  display: none;\n}\n.bk-user-selector-popover.bk-user-selector-pop2-content .bk-user-selector-pop2-arrow {\n  position: absolute;\n  z-index: -1;\n  width: 8px;\n  height: 8px;\n  background: #333;\n  transform: rotate(45deg);\n}\n.bk-user-selector-popover.bk-user-selector-pop2-content[data-theme^='light'] {\n  color: #26323d;\n  background-color: #fff;\n  box-shadow: 0 0 6px 0 #dcdee5;\n}\n.bk-user-selector-popover.bk-user-selector-pop2-content[data-theme^='light'] .bk-user-selector-pop2-arrow {\n  background-color: #fff;\n}\n.text-ov {\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n.position-relative {\n  position: relative;\n}\n.position-absolute {\n  position: absolute;\n}\n.overflow-popover-reference {\n  width: 100%;\n}\n.bk-user-selector-tag {\n  display: inline-flex;\n  align-items: center;\n  height: 22px;\n  padding: 0 10px;\n  font-size: 12px;\n  line-height: 22px;\n  color: #63656e;\n  cursor: default;\n  background-color: #f0f1f5;\n  border-color: rgba(151, 155, 165, 0.3);\n  box-sizing: border-box;\n}\n.bk-user-selector-tag.bk-user-selector-tag-success {\n  color: #14a568;\n  border-color: rgba(20, 165, 104, 0.3);\n  background-color: #E4FAF0;\n}\n.bk-user-selector-tag.bk-user-selector-tag-success.bk-user-selector-tag-filled {\n  background-color: #14A568;\n}\n.bk-user-selector-tag.bk-user-selector-tag-success.bk-user-selector-tag-filled:hover {\n  background-color: #42B685;\n}\n.bk-user-selector-tag.bk-user-selector-tag-success:hover:not(.bk-user-selector-tag-filled) {\n  background-color: #C9F5E2;\n}\n.bk-user-selector-tag.bk-user-selector-tag-info {\n  color: #3a84ff;\n  border-color: rgba(58, 132, 255, 0.3);\n  background-color: #EDF4FF;\n}\n.bk-user-selector-tag.bk-user-selector-tag-info.bk-user-selector-tag-filled {\n  background-color: #3A84FF;\n}\n.bk-user-selector-tag.bk-user-selector-tag-info.bk-user-selector-tag-filled:hover {\n  background-color: #609CFE;\n}\n.bk-user-selector-tag.bk-user-selector-tag-info:hover:not(.bk-user-selector-tag-filled) {\n  background-color: #E1ECFF;\n}\n.bk-user-selector-tag.bk-user-selector-tag-warning {\n  color: #fe9c00;\n  border-color: rgba(254, 165, 0, 0.3);\n  background-color: #FFF1DB;\n}\n.bk-user-selector-tag.bk-user-selector-tag-warning.bk-user-selector-tag-filled {\n  background-color: #FE9C00;\n}\n.bk-user-selector-tag.bk-user-selector-tag-warning.bk-user-selector-tag-filled:hover {\n  background-color: #FDAF32;\n}\n.bk-user-selector-tag.bk-user-selector-tag-warning:hover:not(.bk-user-selector-tag-filled) {\n  background-color: #FFE8C3;\n}\n.bk-user-selector-tag.bk-user-selector-tag-danger {\n  color: #ea3636;\n  border-color: rgba(234, 53, 54, 0.3);\n  background-color: #FEEBEA;\n}\n.bk-user-selector-tag.bk-user-selector-tag-danger.bk-user-selector-tag-filled {\n  background-color: #EA3536;\n}\n.bk-user-selector-tag.bk-user-selector-tag-danger.bk-user-selector-tag-filled:hover {\n  background-color: #ED5C5D;\n}\n.bk-user-selector-tag.bk-user-selector-tag-danger:hover:not(.bk-user-selector-tag-filled) {\n  background-color: #FEDDDC;\n}\n.bk-user-selector-tag:hover {\n  background-color: #dcdee5;\n}\n.bk-user-selector-tag.bk-user-selector-tag-filled {\n  color: #fff;\n  background-color: #979BA5;\n}\n.bk-user-selector-tag.bk-user-selector-tag-filled:hover {\n  background-color: #ACAFB6;\n}\n.bk-user-selector-tag.bk-user-selector-tag-stroke {\n  padding: 0 9px;\n  line-height: 20px;\n  border-style: solid;\n  border-width: 1px;\n}\n.bk-user-selector-tag.bk-user-selector-tag-closable {\n  padding: 0 4px 0 10px;\n}\n.bk-user-selector-tag.bk-user-selector-tag-checkable {\n  cursor: pointer;\n  background: none;\n}\n.bk-user-selector-tag.bk-user-selector-tag-checkable:hover {\n  background: #F0F1F5;\n}\n.bk-user-selector-tag.bk-user-selector-tag-check {\n  color: #fff;\n  background: #3a84ff;\n}\n.bk-user-selector-tag.bk-user-selector-tag-check:hover {\n  color: #fff;\n  background: #3a84ff;\n  opacity: 1;\n}\n.bk-user-selector-tag--default {\n  padding: 0 8px;\n}\n.bk-user-selector-tag--small {\n  height: 16px;\n  padding: 0 4px;\n  line-height: 16px;\n}\n.bk-user-selector-tag--small .bk-user-selector-tag-text {\n  font-size: 10px;\n}\n.bk-user-selector-tag-text {\n  flex: 1;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n.bk-user-selector-tag-icon {\n  flex-shrink: 0;\n  margin-right: 4px;\n  font-size: 14px;\n  line-height: 0;\n}\n.bk-user-selector-tag-close {\n  flex-shrink: 0;\n  margin-left: 4px;\n  font-size: 12px;\n  line-height: 0;\n  cursor: pointer;\n}\n.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-a4132257] {\n  min-height: 40px;\n  max-height: 300px;\n  padding: 5px 0;\n  overflow-y: auto;\n}\n.dropdown-content .no-data[data-v-a4132257] {\n  padding: 10px;\n  color: #979ba5;\n  text-align: center;\n}\n.dropdown-content .user-group .group-header[data-v-a4132257] {\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-a4132257] {\n  margin-left: 4px;\n}\n.dropdown-content .user-option[data-v-a4132257] {\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-a4132257]: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-1f435fc8] {\n  position: relative;\n  width: 100%;\n}\n.multiple-selector.is-disabled[data-v-1f435fc8] {\n  pointer-events: none;\n}\n.multiple-selector .tags-container[data-v-1f435fc8] {\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-1f435fc8] {\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-1f435fc8] {\n  display: flex;\n  flex-wrap: wrap;\n  align-items: center;\n}\n.multiple-selector .tag-list[data-v-1f435fc8] {\n  display: flex;\n  flex-wrap: wrap;\n  align-items: center;\n}\n.multiple-selector .tag-wrapper[data-v-1f435fc8] {\n  display: inline-flex;\n  align-items: center;\n  max-width: 100%;\n}\n.multiple-selector .search-input[data-v-1f435fc8] {\n  min-width: 10px;\n  height: 28px;\n  background: transparent;\n  border: none;\n  outline: none;\n}\n.multiple-selector .search-input[data-v-1f435fc8]::placeholder {\n  color: #c4c6cc;\n}\n.multiple-selector .search-input.inline[data-v-1f435fc8] {\n  min-width: 10px;\n}\n.multiple-selector .search-input.last[data-v-1f435fc8], .multiple-selector .search-input.collapsed[data-v-1f435fc8] {\n  flex: 1;\n  min-width: 60px;\n}.single-selector[data-v-c44a1c1d] {\n  position: relative;\n  width: 100%;\n}\n.single-selector.is-disabled[data-v-c44a1c1d] {\n  pointer-events: none;\n}\n.input-container[data-v-c44a1c1d] {\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-c44a1c1d]: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-c44a1c1d] {\n  flex: 1;\n  height: 30px;\n  background: transparent;\n  border: none;\n  outline: none;\n}\n.search-input[data-v-c44a1c1d]::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}"));
       document.head.appendChild(elementStyle);
     }
   } catch (e) {
@@ -14168,7 +14168,14 @@ ${$(r2)}`), n2;
         return searchResults.value.filter((user) => !props2.selectedUsers.some((selectedUser) => selectedUser.id === user.id)).filter((user) => !props2.excludeUserIds.includes(user.id));
       });
       const userGroupFilter = __WEBPACK_EXTERNAL_MODULE_vue__.computed(() => {
-        return props2.userGroup.filter((group) => !props2.selectedUsers.some((user) => user.id === group.id) && !group.hidden);
+        return props2.userGroup.filter((group) => {
+          var _a, _b;
+          const filtered = !props2.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 (!props2.draggable || !sortableContainerRef.value) return;
@@ -14619,7 +14626,7 @@ ${$(r2)}`), n2;
       };
     }
   });
-  const MultipleSelector = /* @__PURE__ */ _export_sfc(_sfc_main$2, [["__scopeId", "data-v-7ff53892"]]);
+  const MultipleSelector = /* @__PURE__ */ _export_sfc(_sfc_main$2, [["__scopeId", "data-v-1f435fc8"]]);
   const _hoisted_1 = { class: "input-container" };
   const _hoisted_2 = ["placeholder"];
   const _sfc_main$1 = /* @__PURE__ */ __WEBPACK_EXTERNAL_MODULE_vue__.defineComponent({
@@ -14656,7 +14663,14 @@ ${$(r2)}`), n2;
       const searchQuery = __WEBPACK_EXTERNAL_MODULE_vue__.ref("");
       const showDropdown = __WEBPACK_EXTERNAL_MODULE_vue__.ref(false);
       const userGroupFilter = __WEBPACK_EXTERNAL_MODULE_vue__.computed(() => {
-        return props2.userGroup.filter((group) => group.id !== selectedUser.value && !group.hidden);
+        return props2.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 = __WEBPACK_EXTERNAL_MODULE_vue__.computed(() => {
         const userGroup = (props2.userGroup || []).map((group) => ({
@@ -14839,7 +14853,7 @@ ${$(r2)}`), n2;
       };
     }
   });
-  const SingleSelector = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["__scopeId", "data-v-d56195a1"]]);
+  const SingleSelector = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["__scopeId", "data-v-c44a1c1d"]]);
   const _sfc_main = /* @__PURE__ */ __WEBPACK_EXTERNAL_MODULE_vue__.defineComponent({
     ...{
       name: "BkUserSelector"

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-a4132257] {\n  min-height: 40px;\n  max-height: 300px;\n  padding: 5px 0;\n  overflow-y: auto;\n}\n.dropdown-content .no-data[data-v-a4132257] {\n  padding: 10px;\n  color: #979ba5;\n  text-align: center;\n}\n.dropdown-content .user-group .group-header[data-v-a4132257] {\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-a4132257] {\n  margin-left: 4px;\n}\n.dropdown-content .user-option[data-v-a4132257] {\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-a4132257]: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-7ff53892] {\n  position: relative;\n  width: 100%;\n}\n.multiple-selector.is-disabled[data-v-7ff53892] {\n  pointer-events: none;\n}\n.multiple-selector .tags-container[data-v-7ff53892] {\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-7ff53892] {\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-7ff53892] {\n  display: flex;\n  flex-wrap: wrap;\n  align-items: center;\n}\n.multiple-selector .tag-list[data-v-7ff53892] {\n  display: flex;\n  flex-wrap: wrap;\n  align-items: center;\n}\n.multiple-selector .tag-wrapper[data-v-7ff53892] {\n  display: inline-flex;\n  align-items: center;\n  max-width: 100%;\n}\n.multiple-selector .search-input[data-v-7ff53892] {\n  min-width: 10px;\n  height: 28px;\n  background: transparent;\n  border: none;\n  outline: none;\n}\n.multiple-selector .search-input[data-v-7ff53892]::placeholder {\n  color: #c4c6cc;\n}\n.multiple-selector .search-input.inline[data-v-7ff53892] {\n  min-width: 10px;\n}\n.multiple-selector .search-input.last[data-v-7ff53892], .multiple-selector .search-input.collapsed[data-v-7ff53892] {\n  flex: 1;\n  min-width: 60px;\n}.single-selector[data-v-d56195a1] {\n  position: relative;\n  width: 100%;\n}\n.single-selector.is-disabled[data-v-d56195a1] {\n  pointer-events: none;\n}\n.input-container[data-v-d56195a1] {\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-d56195a1]: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-d56195a1] {\n  flex: 1;\n  height: 30px;\n  background: transparent;\n  border: none;\n  outline: none;\n}\n.search-input[data-v-d56195a1]::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_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-a4132257] {\n  min-height: 40px;\n  max-height: 300px;\n  padding: 5px 0;\n  overflow-y: auto;\n}\n.dropdown-content .no-data[data-v-a4132257] {\n  padding: 10px;\n  color: #979ba5;\n  text-align: center;\n}\n.dropdown-content .user-group .group-header[data-v-a4132257] {\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-a4132257] {\n  margin-left: 4px;\n}\n.dropdown-content .user-option[data-v-a4132257] {\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-a4132257]: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-1f435fc8] {\n  position: relative;\n  width: 100%;\n}\n.multiple-selector.is-disabled[data-v-1f435fc8] {\n  pointer-events: none;\n}\n.multiple-selector .tags-container[data-v-1f435fc8] {\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-1f435fc8] {\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-1f435fc8] {\n  display: flex;\n  flex-wrap: wrap;\n  align-items: center;\n}\n.multiple-selector .tag-list[data-v-1f435fc8] {\n  display: flex;\n  flex-wrap: wrap;\n  align-items: center;\n}\n.multiple-selector .tag-wrapper[data-v-1f435fc8] {\n  display: inline-flex;\n  align-items: center;\n  max-width: 100%;\n}\n.multiple-selector .search-input[data-v-1f435fc8] {\n  min-width: 10px;\n  height: 28px;\n  background: transparent;\n  border: none;\n  outline: none;\n}\n.multiple-selector .search-input[data-v-1f435fc8]::placeholder {\n  color: #c4c6cc;\n}\n.multiple-selector .search-input.inline[data-v-1f435fc8] {\n  min-width: 10px;\n}\n.multiple-selector .search-input.last[data-v-1f435fc8], .multiple-selector .search-input.collapsed[data-v-1f435fc8] {\n  flex: 1;\n  min-width: 60px;\n}.single-selector[data-v-c44a1c1d] {\n  position: relative;\n  width: 100%;\n}\n.single-selector.is-disabled[data-v-c44a1c1d] {\n  pointer-events: none;\n}\n.input-container[data-v-c44a1c1d] {\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-c44a1c1d]: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-c44a1c1d] {\n  flex: 1;\n  height: 30px;\n  background: transparent;\n  border: none;\n  outline: none;\n}\n.search-input[data-v-c44a1c1d]::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}";
   document.head.appendChild(__vite_style__);
   const generateCallbackName = () => {
     const timestamp = Date.now();
@@ -3478,7 +3478,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;
@@ -3929,7 +3936,7 @@
       };
     }
   });
-  const MultipleSelector = /* @__PURE__ */ _export_sfc(_sfc_main$2, [["__scopeId", "data-v-7ff53892"]]);
+  const MultipleSelector = /* @__PURE__ */ _export_sfc(_sfc_main$2, [["__scopeId", "data-v-1f435fc8"]]);
   const _hoisted_1 = { class: "input-container" };
   const _hoisted_2 = ["placeholder"];
   const _sfc_main$1 = /* @__PURE__ */ vue.defineComponent({
@@ -3966,7 +3973,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) => ({
@@ -4149,7 +4163,7 @@
       };
     }
   });
-  const SingleSelector = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["__scopeId", "data-v-d56195a1"]]);
+  const SingleSelector = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["__scopeId", "data-v-c44a1c1d"]]);
   const _sfc_main = /* @__PURE__ */ vue.defineComponent({
     ...{
       name: "BkUserSelector"

package/vue3/vue3.css

@@ -71,14 +71,14 @@
   font-size: 12px;
   text-overflow: ellipsis;
   white-space: nowrap;
-}.multiple-selector[data-v-7ff53892] {
+}.multiple-selector[data-v-1f435fc8] {
   position: relative;
   width: 100%;
 }
-.multiple-selector.is-disabled[data-v-7ff53892] {
+.multiple-selector.is-disabled[data-v-1f435fc8] {
   pointer-events: none;
 }
-.multiple-selector .tags-container[data-v-7ff53892] {
+.multiple-selector .tags-container[data-v-1f435fc8] {
   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-7ff53892] {
+.multiple-selector .tags-container.focused[data-v-1f435fc8] {
   border-color: #3a84ff;
   box-shadow: 0 0 0 2px rgba(58, 132, 255, 0.1);
 }
-.multiple-selector .tags-container.collapsed[data-v-7ff53892] {
+.multiple-selector .tags-container.collapsed[data-v-1f435fc8] {
   display: flex;
   flex-wrap: wrap;
   align-items: center;
 }
-.multiple-selector .tag-list[data-v-7ff53892] {
+.multiple-selector .tag-list[data-v-1f435fc8] {
   display: flex;
   flex-wrap: wrap;
   align-items: center;
 }
-.multiple-selector .tag-wrapper[data-v-7ff53892] {
+.multiple-selector .tag-wrapper[data-v-1f435fc8] {
   display: inline-flex;
   align-items: center;
   max-width: 100%;
 }
-.multiple-selector .search-input[data-v-7ff53892] {
+.multiple-selector .search-input[data-v-1f435fc8] {
   min-width: 10px;
   height: 28px;
   background: transparent;
   border: none;
   outline: none;
 }
-.multiple-selector .search-input[data-v-7ff53892]::placeholder {
+.multiple-selector .search-input[data-v-1f435fc8]::placeholder {
   color: #c4c6cc;
 }
-.multiple-selector .search-input.inline[data-v-7ff53892] {
+.multiple-selector .search-input.inline[data-v-1f435fc8] {
   min-width: 10px;
 }
-.multiple-selector .search-input.last[data-v-7ff53892], .multiple-selector .search-input.collapsed[data-v-7ff53892] {
+.multiple-selector .search-input.last[data-v-1f435fc8], .multiple-selector .search-input.collapsed[data-v-1f435fc8] {
   flex: 1;
   min-width: 60px;
-}.single-selector[data-v-d56195a1] {
+}.single-selector[data-v-c44a1c1d] {
   position: relative;
   width: 100%;
 }
-.single-selector.is-disabled[data-v-d56195a1] {
+.single-selector.is-disabled[data-v-c44a1c1d] {
   pointer-events: none;
 }
-.input-container[data-v-d56195a1] {
+.input-container[data-v-c44a1c1d] {
   position: relative;
   display: flex;
   align-items: center;
@@ -138,18 +138,18 @@
   border: 1px solid #c4c6cc;
   border-radius: 2px;
 }
-.input-container[data-v-d56195a1]:focus-within {
+.input-container[data-v-c44a1c1d]:focus-within {
   border-color: #3a84ff;
   box-shadow: 0 0 0 2px rgba(58, 132, 255, 0.1);
 }
-.search-input[data-v-d56195a1] {
+.search-input[data-v-c44a1c1d] {
   flex: 1;
   height: 30px;
   background: transparent;
   border: none;
   outline: none;
 }
-.search-input[data-v-d56195a1]::placeholder {
+.search-input[data-v-c44a1c1d]::placeholder {
   color: #c4c6cc;
 }.bk-user-selector[data-v-7ce51f9c] {
   position: relative;