@deskhero/dh_ui 1.29.2 → 1.29.3

package/dist/dh_ui.es.js

@@ -70,7 +70,7 @@ const _sfc_main$i = defineComponent({
 });
 const _hoisted_1$h = { class: "dh-advanced-filter-container" };
 const _hoisted_2$d = { class: "advance_section" };
-const _hoisted_3$a = {
+const _hoisted_3$9 = {
   key: 0,
   class: "list-none"
 };
@@ -91,7 +91,7 @@ function _sfc_render$8(_ctx, _cache, $props, $setup, $data, $options) {
           size: 20
         }, null, 8, ["icon-name"])
       ]),
-      _ctx.activeFilter ? (openBlock(), createElementBlock("ul", _hoisted_3$a, [
+      _ctx.activeFilter ? (openBlock(), createElementBlock("ul", _hoisted_3$9, [
         createElementVNode("li", null, [
           createElementVNode("label", null, [
             createElementVNode("input", {
@@ -10949,7 +10949,7 @@ const _hoisted_2$c = /* @__PURE__ */ createElementVNode("label", { for: "upload_
   /* @__PURE__ */ createTextVNode(" Drag and drop file or "),
   /* @__PURE__ */ createElementVNode("span", { id: "upload" }, "browse")
 ], -1);
-const _hoisted_3$9 = {
+const _hoisted_3$8 = {
   key: 0,
   class: "file__upload_items"
 };
@@ -11055,7 +11055,7 @@ const _sfc_main$e = {
             onInput: _cache[0] || (_cache[0] = ($event) => uploadFile($event))
           }, null, 544)
         ], 32),
-        fileSelected.value ? (openBlock(), createElementBlock("div", _hoisted_3$9, [
+        fileSelected.value ? (openBlock(), createElementBlock("div", _hoisted_3$8, [
           (openBlock(true), createElementBlock(Fragment, null, renderList(files.value, (file, id) => {
             return openBlock(), createElementBlock("div", {
               key: id,
@@ -11162,7 +11162,7 @@ const _hoisted_2$b = {
   id: "modalTitle",
   class: "modal-header"
 };
-const _hoisted_3$8 = { class: "modal-footer" };
+const _hoisted_3$7 = { class: "modal-footer" };
 function _sfc_render$6(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_dh_icon = resolveComponent("dh-icon");
   return openBlock(), createBlock(Transition, { name: "modal-fade" }, {
@@ -11208,7 +11208,7 @@ function _sfc_render$6(_ctx, _cache, $props, $setup, $data, $options) {
             }, [
               renderSlot(_ctx.$slots, "body")
             ], 2),
-            createElementVNode("footer", _hoisted_3$8, [
+            createElementVNode("footer", _hoisted_3$7, [
               _ctx.hasFooter ? renderSlot(_ctx.$slots, "footer", { key: 0 }) : createCommentVNode("", true),
               _ctx.hasFooterButtonRight ? renderSlot(_ctx.$slots, "footer-button-right", { key: 1 }) : createCommentVNode("", true)
             ])
@@ -11303,7 +11303,7 @@ const _hoisted_1$b = /* @__PURE__ */ createElementVNode("img", {
 const _hoisted_2$a = [
   _hoisted_1$b
 ];
-const _hoisted_3$7 = ["src"];
+const _hoisted_3$6 = ["src"];
 const _hoisted_4$4 = { class: "additional-text" };
 const _hoisted_5$2 = {
   key: 0,
@@ -11332,7 +11332,7 @@ function _sfc_render$5(_ctx, _cache, $props, $setup, $data, $options) {
           createElementVNode("img", {
             class: normalizeClass(`icons icons-${_ctx.status} icons-${_ctx.status}-${_ctx.notificationType}`),
             src: _ctx.getIconUrl()
-          }, null, 10, _hoisted_3$7)
+          }, null, 10, _hoisted_3$6)
         ], 2),
         createElementVNode("div", _hoisted_4$4, [
           createElementVNode("div", {
@@ -23556,7 +23556,7 @@ const _sfc_main$b = {
 };
 const _hoisted_1$a = { class: "bar" };
 const _hoisted_2$9 = ["min", "max", "step", "value"];
-const _hoisted_3$6 = { class: "caption" };
+const _hoisted_3$5 = { class: "caption" };
 const _hoisted_4$3 = { class: "min-caption" };
 const _hoisted_5$1 = { class: "bar-inner" };
 const _hoisted_6$1 = ["min", "max", "step", "value"];
@@ -23599,7 +23599,7 @@ function _sfc_render$4(_ctx, _cache, $props, $setup, $data, $options) {
         onMousedown: _cache[2] || (_cache[2] = (...args) => $options.onLeftThumbMousedown && $options.onLeftThumbMousedown(...args)),
         onTouchstart: _cache[3] || (_cache[3] = (...args) => $options.onLeftThumbMousedown && $options.onLeftThumbMousedown(...args))
       }, [
-        createElementVNode("div", _hoisted_3$6, [
+        createElementVNode("div", _hoisted_3$5, [
           createElementVNode("span", _hoisted_4$3, toDisplayString($props.minCaption || $options.barMinVal), 1)
         ])
       ], 32),
@@ -23916,7 +23916,7 @@ const _sfc_main$a = defineComponent({
 });
 const _hoisted_1$9 = { class: "dh-range-container" };
 const _hoisted_2$8 = { class: "bar-chart" };
-const _hoisted_3$5 = { class: "input-group-section" };
+const _hoisted_3$4 = { class: "input-group-section" };
 const _hoisted_4$2 = { class: "input-group sb-input" };
 const _hoisted_5 = ["disabled", "max", "value"];
 const _hoisted_6 = { class: "input-group sb-input" };
@@ -23973,7 +23973,7 @@ function _sfc_render$3(_ctx, _cache, $props, $setup, $data, $options) {
         onInput: _ctx.updateBarChart
       }, null, 8, ["base-class-name", "max", "max-caption", "max-value", "min-caption", "min-value", "step", "onInput"])
     ]),
-    createElementVNode("div", _hoisted_3$5, [
+    createElementVNode("div", _hoisted_3$4, [
       createElementVNode("div", _hoisted_4$2, [
         createElementVNode("label", {
           class: normalizeClass(`text-2 input-to ${_ctx.validated ? "disable" : ""}`)
@@ -24055,7 +24055,7 @@ var NumberRange = /* @__PURE__ */ _export_sfc(_sfc_main$a, [["render", _sfc_rend
 var PasswordField_vue_vue_type_style_index_0_scoped_true_lang = "";
 const _hoisted_1$8 = { class: "password__panel" };
 const _hoisted_2$7 = ["placeholder", "type"];
-const _hoisted_3$4 = { class: "icon is-right" };
+const _hoisted_3$3 = { class: "icon is-right" };
 const _hoisted_4$1 = {
   key: 0,
   class: "password__tooltip"
@@ -24134,7 +24134,7 @@ const _sfc_main$9 = /* @__PURE__ */ defineComponent({
           type: "button",
           onClick: toggleShow
         }, [
-          createElementVNode("span", _hoisted_3$4, [
+          createElementVNode("span", _hoisted_3$3, [
             createVNode(DhIcon, {
               active: isActive.value,
               "icon-name": showPassword.value ? "invisible" : "visible",
@@ -24182,7 +24182,7 @@ var PasswordField = /* @__PURE__ */ _export_sfc(_sfc_main$9, [["__scopeId", "dat
 var RadioBox_vue_vue_type_style_index_0_scoped_true_lang = "";
 const _hoisted_1$7 = { class: "radio" };
 const _hoisted_2$6 = ["for"];
-const _hoisted_3$3 = ["id", "type", "value"];
+const _hoisted_3$2 = ["id", "type", "value"];
 const _hoisted_4 = { class: "radio__label_txt" };
 const _sfc_main$8 = {
   __name: "RadioBox",
@@ -24215,7 +24215,7 @@ const _sfc_main$8 = {
             type: __props.type,
             value: __props.value,
             onClick: _cache[0] || (_cache[0] = ($event) => emit("clickBox"))
-          }, null, 8, _hoisted_3$3),
+          }, null, 8, _hoisted_3$2),
           createElementVNode("span", _hoisted_4, toDisplayString(__props.label), 1)
         ], 8, _hoisted_2$6)
       ]);
@@ -24416,7 +24416,7 @@ const _sfc_main$4 = defineComponent({
 });
 const _hoisted_1$4 = { class: "dp__options" };
 const _hoisted_2$3 = { class: "dp__options_switch" };
-const _hoisted_3$2 = /* @__PURE__ */ createElementVNode("span", { class: "dp__options_slider" }, null, -1);
+const _hoisted_3$1 = /* @__PURE__ */ createElementVNode("span", { class: "dp__options_slider" }, null, -1);
 function _sfc_render$2(_ctx, _cache, $props, $setup, $data, $options) {
   return openBlock(), createElementBlock("div", _hoisted_1$4, [
     createElementVNode("span", null, toDisplayString(_ctx.label), 1),
@@ -24428,7 +24428,7 @@ function _sfc_render$2(_ctx, _cache, $props, $setup, $data, $options) {
       }, null, 512), [
         [vModelCheckbox, _ctx.checkedValue]
       ]),
-      _hoisted_3$2
+      _hoisted_3$1
     ])
   ]);
 }
@@ -24464,7 +24464,7 @@ const _sfc_main$3 = defineComponent({
 });
 const _hoisted_1$3 = ["placement", "target", "tooltipText", "trigger"];
 const _hoisted_2$2 = ["id"];
-const _hoisted_3$1 = { class: "text" };
+const _hoisted_3 = { class: "text" };
 function _sfc_render$1(_ctx, _cache, $props, $setup, $data, $options) {
   return openBlock(), createElementBlock("div", {
     id: "main-contain",
@@ -24483,7 +24483,7 @@ function _sfc_render$1(_ctx, _cache, $props, $setup, $data, $options) {
       ref: _ctx.target,
       class: normalizeClass(`tooltiptext ${_ctx.show}`)
     }, [
-      createElementVNode("span", _hoisted_3$1, toDisplayString(_ctx.tooltipText), 1)
+      createElementVNode("span", _hoisted_3, toDisplayString(_ctx.tooltipText), 1)
     ], 10, _hoisted_2$2)
   ], 40, _hoisted_1$3);
 }
@@ -24758,12 +24758,8 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
 }
 var ExpansionPanel = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["render", _sfc_render]]);
 var DropdownMenu_vue_vue_type_style_index_0_scoped_true_lang = "";
-const _hoisted_1 = {
-  class: "dropdown-menu",
-  "data-id": "dropdown-menu"
-};
-const _hoisted_2 = ["src"];
-const _hoisted_3 = {
+const _hoisted_1 = ["src"];
+const _hoisted_2 = {
   key: 3,
   class: "menu-item-text-wrapper"
 };
@@ -24783,6 +24779,21 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       type: Number,
       required: false,
       default: 24
+    },
+    closeOnClickOutside: {
+      type: Boolean,
+      required: false,
+      default: true
+    },
+    zIndex: {
+      type: Number,
+      required: false,
+      default: 100
+    },
+    closeOnItemSelected: {
+      type: Boolean,
+      required: false,
+      default: true
     }
   },
   emits: ["itemSelected", "close"],
@@ -24790,25 +24801,34 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     const props = __props;
     onMounted(() => {
       document.addEventListener("click", (event) => {
-        const dropdownMenu = document.querySelector("[data-id='dropdown-menu']");
-        const dropdownToggle = document.querySelector(".dropdown-toggle");
-        if (dropdownMenu && !dropdownMenu.contains(event.target) && !dropdownToggle.contains(event.target)) {
-          emit("close");
-        }
+        closeOnClickOutside(event);
       });
     });
+    function closeOnClickOutside(event) {
+      const target = event.target;
+      const dropdownMenu = document.querySelector("[data-id='dropdown-menu']");
+      if (dropdownMenu && !dropdownMenu.contains(event.target) && !target.classList.contains("dropdown-toggle") && props.closeOnClickOutside) {
+        emit("close");
+      }
+    }
     function itemSelected(item) {
       emit("itemSelected", item);
-      emit("close");
+      if (props.closeOnItemSelected) {
+        emit("close");
+      }
     }
     return (_ctx, _cache) => {
       const _component_router_link = resolveComponent("router-link");
-      return openBlock(), createElementBlock("div", _hoisted_1, [
+      return openBlock(), createElementBlock("div", {
+        class: "dropdown-menu",
+        "data-id": "dropdown-menu",
+        style: normalizeStyle({ "z-index": props.zIndex })
+      }, [
         (openBlock(true), createElementBlock(Fragment, null, renderList(__props.items, (item) => {
           return openBlock(), createBlock(_component_router_link, {
             key: item.iconName,
             class: "menu-item",
-            "data-e2e": "{{ item.dataE2eTag }}",
+            "data-e2e": item.dataE2eTag,
             to: { path: item.url },
             onClick: ($event) => itemSelected(item)
           }, {
@@ -24818,7 +24838,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
                 alt: "icon image",
                 class: "icon icon-url",
                 src: item.iconUrl
-              }, null, 8, _hoisted_2)) : createCommentVNode("", true),
+              }, null, 8, _hoisted_1)) : createCommentVNode("", true),
               !item.iconUrl ? (openBlock(), createBlock(DhIcon, mergeProps({
                 key: 1,
                 class: "icon"
@@ -24827,7 +24847,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
                 key: 2,
                 class: normalizeClass(["text-2", { "text-ellipsis": props.textEllipsis }])
               }, toDisplayString(item.text), 3)) : createCommentVNode("", true),
-              item.subText ? (openBlock(), createElementBlock("div", _hoisted_3, [
+              item.subText ? (openBlock(), createElementBlock("div", _hoisted_2, [
                 createElementVNode("span", {
                   class: normalizeClass(["text-4", { "text-ellipsis": props.textEllipsis }])
                 }, toDisplayString(item.text), 3),
@@ -24843,11 +24863,11 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
               })) : createCommentVNode("", true)
             ]),
             _: 2
-          }, 1032, ["to", "onClick"]);
+          }, 1032, ["data-e2e", "to", "onClick"]);
         }), 128))
-      ]);
+      ], 4);
     };
   }
 });
-var DropdownMenu = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-03e3c350"]]);
+var DropdownMenu = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-3f98d032"]]);
 export { AdvancedFilter as DhAdvancedFilter, _sfc_main$g as DhDatePicker, DropdownMenu as DhDropdownMenu, _sfc_main$f as DhError, ExpansionPanel as DhExpansionPanel, _sfc_main$e as DhFileUpload, DhIcon, Modal as DhModal, Notification as DhNotification, NumberRange as DhNumberRange, PasswordField as DhPasswordField, DhRadioBox, _sfc_main$7 as DhRadioBoxGroup, SearchInput as DhSearchInput, Stepper as DhStepper, Switch as DhSwitch, Tooltip as DhTooltip, VerificationCode as DhVerificationCode };