@deskhero/dh_ui 1.33.1 → 1.34.0

package/dist/dh_ui.es.js

@@ -1,129 +1,5 @@
-import { defineComponent, resolveComponent, openBlock, createElementBlock, createElementVNode, createTextVNode, toDisplayString, createVNode, createCommentVNode, reactive, ref, useSlots, toRef, provide, computed, onMounted, onUnmounted, watch, normalizeClass, unref, mergeProps, isRef, createSlots, renderList, withCtx, renderSlot, normalizeProps, guardReactiveProps, createBlock, Teleport, inject, withKeys, withModifiers, Transition, Fragment, normalizeStyle, resolveDynamicComponent, nextTick, withDirectives, vShow, onBeforeUpdate, getCurrentScope, onScopeDispose, shallowRef, onBeforeUnmount, toRaw, h, isProxy, vModelDynamic, vModelText, pushScopeId, popScopeId, vModelCheckbox, toRefs, getCurrentInstance } from "vue";
+import { reactive, ref, defineComponent, useSlots, toRef, provide, computed, onMounted, onUnmounted, watch, openBlock, createElementBlock, normalizeClass, unref, createVNode, mergeProps, isRef, createSlots, renderList, withCtx, renderSlot, normalizeProps, guardReactiveProps, createBlock, Teleport, createCommentVNode, inject, withKeys, withModifiers, Transition, createElementVNode, Fragment, normalizeStyle, createTextVNode, toDisplayString, resolveDynamicComponent, nextTick, withDirectives, vShow, onBeforeUpdate, getCurrentScope, onScopeDispose, vModelCheckbox, shallowRef, onBeforeUnmount, toRaw, h, isProxy, resolveComponent, vModelDynamic, vModelText, pushScopeId, popScopeId, toRefs, getCurrentInstance } from "vue";
 var main$1 = "";
-var _export_sfc = (sfc, props) => {
-  const target = sfc.__vccOpts || sfc;
-  for (const [key, val] of props) {
-    target[key] = val;
-  }
-  return target;
-};
-const _sfc_main$k = defineComponent({
-  components: { DhIcon },
-  props: {
-    mainText: {
-      type: String,
-      default: "Advanced"
-    },
-    filterMissingText: {
-      type: String,
-      default: "Filter Missing"
-    },
-    matchText: {
-      type: String,
-      default: "Match"
-    },
-    excludeText: {
-      type: String,
-      default: "Exclude"
-    }
-  },
-  data() {
-    return {
-      activeFilter: false,
-      isFilterMissing: false,
-      isMatch: false,
-      isExclude: false
-    };
-  },
-  emits: ["match", "exclude", "filter_missing"],
-  mounted() {
-    this.isMatch = true;
-  },
-  methods: {
-    toggleFilter() {
-      this.activeFilter = !this.activeFilter;
-    },
-    matchFilter() {
-      this.isMatch = true;
-      this.isExclude = false;
-      this.$emit("match", this.isMatch);
-    },
-    excludeFilter() {
-      this.isMatch = false;
-      this.isExclude = true;
-      this.$emit("exclude", this.isExclude);
-    },
-    missingFilter() {
-      this.isFilterMissing = !this.isFilterMissing;
-      this.$emit("filter_missing", this.isFilterMissing);
-      if (this.isFilterMissing && this.isMatch) {
-        this.matchFilter();
-      } else if (this.isFilterMissing && this.isExclude) {
-        this.excludeFilter();
-      }
-    }
-  }
-});
-const _hoisted_1$k = { class: "dh-advanced-filter-container" };
-const _hoisted_2$h = { class: "advance_section" };
-const _hoisted_3$c = {
-  key: 0,
-  class: "list-none"
-};
-const _hoisted_4$8 = ["checked"];
-const _hoisted_5$5 = ["checked"];
-const _hoisted_6$5 = ["checked"];
-function _sfc_render$8(_ctx, _cache, $props, $setup, $data, $options) {
-  const _component_dh_icon = resolveComponent("dh-icon");
-  return openBlock(), createElementBlock("div", _hoisted_1$k, [
-    createElementVNode("div", _hoisted_2$h, [
-      createElementVNode("span", {
-        class: "toggle-icon",
-        onClick: _cache[0] || (_cache[0] = ($event) => _ctx.toggleFilter())
-      }, [
-        createTextVNode(toDisplayString(_ctx.mainText) + " ", 1),
-        createVNode(_component_dh_icon, {
-          "icon-name": _ctx.activeFilter ? "arrow-up" : "arrow-down",
-          size: 20
-        }, null, 8, ["icon-name"])
-      ]),
-      _ctx.activeFilter ? (openBlock(), createElementBlock("ul", _hoisted_3$c, [
-        createElementVNode("li", null, [
-          createElementVNode("label", null, [
-            createElementVNode("input", {
-              checked: _ctx.isFilterMissing,
-              name: "number_filter",
-              type: "checkbox",
-              onChange: _cache[1] || (_cache[1] = ($event) => _ctx.missingFilter())
-            }, null, 40, _hoisted_4$8),
-            createTextVNode(" " + toDisplayString(_ctx.filterMissingText), 1)
-          ])
-        ]),
-        createElementVNode("li", null, [
-          createElementVNode("label", null, [
-            createElementVNode("input", {
-              checked: _ctx.isMatch,
-              name: "number_filter",
-              type: "radio",
-              onChange: _cache[2] || (_cache[2] = ($event) => _ctx.matchFilter())
-            }, null, 40, _hoisted_5$5),
-            createTextVNode(" " + toDisplayString(_ctx.matchText), 1)
-          ]),
-          createElementVNode("label", null, [
-            createElementVNode("input", {
-              checked: _ctx.isExclude,
-              name: "number_filter",
-              type: "radio",
-              onChange: _cache[3] || (_cache[3] = ($event) => _ctx.excludeFilter())
-            }, null, 40, _hoisted_6$5),
-            createTextVNode(" " + toDisplayString(_ctx.excludeText), 1)
-          ])
-        ])
-      ])) : createCommentVNode("", true)
-    ])
-  ]);
-}
-var DhAdvancedFilter = /* @__PURE__ */ _export_sfc(_sfc_main$k, [["render", _sfc_render$8]]);
 function toInteger(dirtyNumber) {
   if (dirtyNumber === null || dirtyNumber === true || dirtyNumber === false) {
     return NaN;
@@ -347,6 +223,14 @@ function isValid(dirtyDate) {
   var date = toDate(dirtyDate);
   return !isNaN(Number(date));
 }
+function endOfMonth(dirtyDate) {
+  requiredArgs(1, arguments);
+  var date = toDate(dirtyDate);
+  var month = date.getMonth();
+  date.setFullYear(date.getFullYear(), month + 1, 0);
+  date.setHours(23, 59, 59, 999);
+  return date;
+}
 function eachDayOfInterval(dirtyInterval, options) {
   var _options$step;
   requiredArgs(1, arguments);
@@ -370,6 +254,29 @@ function eachDayOfInterval(dirtyInterval, options) {
   }
   return dates;
 }
+function startOfMonth(dirtyDate) {
+  requiredArgs(1, arguments);
+  var date = toDate(dirtyDate);
+  date.setDate(1);
+  date.setHours(0, 0, 0, 0);
+  return date;
+}
+function endOfYear(dirtyDate) {
+  requiredArgs(1, arguments);
+  var date = toDate(dirtyDate);
+  var year = date.getFullYear();
+  date.setFullYear(year + 1, 0, 0);
+  date.setHours(23, 59, 59, 999);
+  return date;
+}
+function startOfYear(dirtyDate) {
+  requiredArgs(1, arguments);
+  var cleanDate = toDate(dirtyDate);
+  var date = new Date(0);
+  date.setFullYear(cleanDate.getFullYear(), 0, 1);
+  date.setHours(0, 0, 0, 0);
+  return date;
+}
 function endOfWeek(dirtyDate, options) {
   var _ref, _ref2, _ref3, _options$weekStartsOn, _options$locale, _options$locale$optio, _defaultOptions$local, _defaultOptions$local2;
   requiredArgs(1, arguments);
@@ -7394,6 +7301,36 @@ function subDays(dirtyDate, dirtyAmount) {
   var amount = toInteger(dirtyAmount);
   return addDays(dirtyDate, -amount);
 }
+function lastDayOfWeek(dirtyDate, options) {
+  var _ref, _ref2, _ref3, _options$weekStartsOn, _options$locale, _options$locale$optio, _defaultOptions$local, _defaultOptions$local2;
+  requiredArgs(1, arguments);
+  var defaultOptions2 = getDefaultOptions();
+  var weekStartsOn = toInteger((_ref = (_ref2 = (_ref3 = (_options$weekStartsOn = options === null || options === void 0 ? void 0 : options.weekStartsOn) !== null && _options$weekStartsOn !== void 0 ? _options$weekStartsOn : options === null || options === void 0 ? void 0 : (_options$locale = options.locale) === null || _options$locale === void 0 ? void 0 : (_options$locale$optio = _options$locale.options) === null || _options$locale$optio === void 0 ? void 0 : _options$locale$optio.weekStartsOn) !== null && _ref3 !== void 0 ? _ref3 : defaultOptions2.weekStartsOn) !== null && _ref2 !== void 0 ? _ref2 : (_defaultOptions$local = defaultOptions2.locale) === null || _defaultOptions$local === void 0 ? void 0 : (_defaultOptions$local2 = _defaultOptions$local.options) === null || _defaultOptions$local2 === void 0 ? void 0 : _defaultOptions$local2.weekStartsOn) !== null && _ref !== void 0 ? _ref : 0);
+  if (!(weekStartsOn >= 0 && weekStartsOn <= 6)) {
+    throw new RangeError("weekStartsOn must be between 0 and 6");
+  }
+  var date = toDate(dirtyDate);
+  var day = date.getDay();
+  var diff = (day < weekStartsOn ? -7 : 0) + 6 - (day - weekStartsOn);
+  date.setHours(0, 0, 0, 0);
+  date.setDate(date.getDate() + diff);
+  return date;
+}
+function nextDay(date, day) {
+  requiredArgs(2, arguments);
+  var delta = day - getDay(date);
+  if (delta <= 0)
+    delta += 7;
+  return addDays(date, delta);
+}
+function nextSaturday(date) {
+  requiredArgs(1, arguments);
+  return nextDay(date, 6);
+}
+function nextSunday(date) {
+  requiredArgs(1, arguments);
+  return nextDay(date, 0);
+}
 function parseISO(argument, options) {
   var _options$additionalDi;
   requiredArgs(1, arguments);
@@ -7575,6 +7512,21 @@ function validateTime(hours, minutes, seconds) {
 function validateTimezone(_hours, minutes) {
   return minutes >= 0 && minutes <= 59;
 }
+function previousDay(date, day) {
+  requiredArgs(2, arguments);
+  var delta = getDay(date) - day;
+  if (delta <= 0)
+    delta += 7;
+  return subDays(date, delta);
+}
+function previousSaturday(date) {
+  requiredArgs(1, arguments);
+  return previousDay(date, 6);
+}
+function previousSunday(date) {
+  requiredArgs(1, arguments);
+  return previousDay(date, 0);
+}
 function setMonth(dirtyDate, dirtyMonth) {
   requiredArgs(2, arguments);
   var date = toDate(dirtyDate);
@@ -10816,7 +10768,14 @@ var __glob_1_87 = "data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQ
 var __glob_1_88 = "data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTEwLjI2NzkgM0MxMS4wMzc3IDEuNjY2NjcgMTIuOTYyMiAxLjY2NjY3IDEzLjczMiAzTDIyLjM5MjMgMThDMjMuMTYyMSAxOS4zMzMzIDIyLjE5OTkgMjEgMjAuNjYwMyAyMUgzLjMzOTc1QzEuODAwMTQgMjEgMC44Mzc4OTQgMTkuMzMzMyAxLjYwNzY5IDE4TDEwLjI2NzkgM1oiIGZpbGw9IiNGM0NDQTgiLz4KPHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0xMiA4QzExLjQ0NzcgOCAxMSA4LjQ0NzcyIDExIDlWMTNDMTEgMTMuNTUyMyAxMS40NDc3IDE0IDEyIDE0QzEyLjU1MjMgMTQgMTMgMTMuNTUyMyAxMyAxM1Y5QzEzIDguNDQ3NzIgMTIuNTUyMyA4IDEyIDhaTTEyIDE1Ljc1QzExLjMwOTYgMTUuNzUgMTAuNzUgMTYuMzA5NiAxMC43NSAxN0MxMC43NSAxNy42OTA0IDExLjMwOTYgMTguMjUgMTIgMTguMjVIMTIuMDFDMTIuNzAwNCAxOC4yNSAxMy4yNiAxNy42OTA0IDEzLjI2IDE3QzEzLjI2IDE2LjMwOTYgMTIuNzAwNCAxNS43NSAxMi4wMSAxNS43NUgxMloiIGZpbGw9IndoaXRlIi8+Cjwvc3ZnPgo=";
 var __glob_1_89 = "data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIHZpZXdCb3g9IjAgMCAyMCAyMCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICAgIDxwYXRoIGQ9Ik04Ljc0OSA0LjAzOCAyLjU1MSAxNC4zODZhMS40NjQgMS40NjQgMCAwIDAgMS4yNTEgMi4xOTVoMTIuMzk3YTEuNDYzIDEuNDYzIDAgMCAwIDEuMjUxLTIuMTk1TDExLjI1MiA0LjAzOGExLjQ2NCAxLjQ2NCAwIDAgMC0yLjUwMyAwdjB6TTEwIDcuOHYyLjkyNiIgc3Ryb2tlPSIjRjI5OTRBIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz4KICAgIDxwYXRoIGQ9Ik0xMCAxMy42NTRoLjAwNyIgc3Ryb2tlPSIjRjI5OTRBIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIvPgo8L3N2Zz4K";
 var Icon_vue_vue_type_style_index_0_scoped_true_lang = "";
-const _sfc_main$j = defineComponent({
+var _export_sfc = (sfc, props) => {
+  const target = sfc.__vccOpts || sfc;
+  for (const [key, val] of props) {
+    target[key] = val;
+  }
+  return target;
+};
+const _sfc_main$l = defineComponent({
   props: {
     iconName: {
       type: String,
@@ -10845,8 +10804,8 @@ const _sfc_main$j = defineComponent({
     }
   }
 });
-const _hoisted_1$j = ["height", "src", "width"];
-function _sfc_render$7(_ctx, _cache, $props, $setup, $data, $options) {
+const _hoisted_1$l = ["height", "src", "width"];
+function _sfc_render$8(_ctx, _cache, $props, $setup, $data, $options) {
   return openBlock(), createElementBlock("img", {
     alt: "icon",
     class: normalizeClass({
@@ -10856,879 +10815,257 @@ function _sfc_render$7(_ctx, _cache, $props, $setup, $data, $options) {
     height: _ctx.size,
     src: _ctx.getIconUrl(),
     width: _ctx.size
-  }, null, 10, _hoisted_1$j);
+  }, null, 10, _hoisted_1$l);
 }
-var DhIcon = /* @__PURE__ */ _export_sfc(_sfc_main$j, [["render", _sfc_render$7], ["__scopeId", "data-v-201309a0"]]);
-var main = "";
-var DatePicker_vue_vue_type_style_index_0_lang = "";
-const _hoisted_1$i = /* @__PURE__ */ createTextVNode(" Back ");
-const _hoisted_2$g = /* @__PURE__ */ createElementVNode("div", null, "today", -1);
-const _sfc_main$i = {
-  __name: "DatePicker",
+var DhIcon = /* @__PURE__ */ _export_sfc(_sfc_main$l, [["render", _sfc_render$8], ["__scopeId", "data-v-201309a0"]]);
+const _sfc_main$k = defineComponent({
   props: {
-    inline: {
+    data: {
       type: Boolean,
-      default: true
+      required: true,
+      default: false
+    },
+    label: {
+      type: String,
+      default: "Label"
     }
   },
-  emits: ["update"],
-  setup(__props, { emit }) {
-    const date = ref();
-    const datePicker = ref(null);
-    const handleDate = (modelData) => {
-      date.value = modelData;
-      emit("update", date.value);
+  data() {
+    return {
+      active: this.data
     };
-    const markers = ref([
-      {
-        date: addDays(new Date(), 0),
-        type: "dot",
-        tooltip: [{ text: "Dot with tooltip", color: "blue" }]
+  },
+  emits: ["change"],
+  computed: {
+    checkedValue: {
+      get() {
+        return this.data;
+      },
+      set(newValue) {
+        this.active = newValue;
+        this.$emit("change", newValue);
       }
-    ]);
-    return (_ctx, _cache) => {
-      return openBlock(), createElementBlock("div", null, [
-        createVNode(unref(ca), {
-          ref_key: "datePicker",
-          ref: datePicker,
-          modelValue: date.value,
-          "onUpdate:modelValue": [
-            _cache[0] || (_cache[0] = ($event) => date.value = $event),
-            handleDate
-          ],
-          "arrow-navigation": "",
-          "day-names": ["Mon", "Tue", "Wed", "Thu", "Fri", "Sat", "Sun"],
-          "enable-time-picker": false,
-          inline: __props.inline,
-          markers: markers.value,
-          "month-name-format": "short",
-          offset: 12,
-          placeholder: "MM/DD/YYYY",
-          "select-text": "Apply",
-          "text-input": "",
-          uid: "base"
-        }, {
-          "arrow-left": withCtx(() => [
-            createVNode(DhIcon, {
-              "icon-name": "previous",
-              size: 20
-            })
-          ]),
-          "arrow-right": withCtx(() => [
-            createVNode(DhIcon, {
-              "icon-name": "next",
-              size: 20
-            })
-          ]),
-          "calendar-icon": withCtx(() => [
-            _hoisted_1$i
-          ]),
-          "clear-icon": withCtx(() => []),
-          "action-preview": withCtx(() => []),
-          "marker-tooltip": withCtx(() => [
-            _hoisted_2$g
-          ]),
-          _: 1
-        }, 8, ["modelValue", "inline", "markers"])
-      ]);
-    };
-  }
-};
-var Error_vue_vue_type_style_index_0_lang = "";
-const _hoisted_1$h = {
-  key: 0,
-  class: "invalid-feedback"
-};
-const _sfc_main$h = /* @__PURE__ */ defineComponent({
-  __name: "Error",
-  props: {
-    errors: {
-      type: Object,
-      required: false,
-      default: void 0
     }
-  },
-  setup(__props) {
-    const props = __props;
-    return (_ctx, _cache) => {
-      var _a;
-      return unref(props).errors && ((_a = unref(props).errors) == null ? void 0 : _a.length) > 0 ? (openBlock(), createElementBlock("div", _hoisted_1$h, [
-        (openBlock(true), createElementBlock(Fragment, null, renderList(__props.errors, (error) => {
-          return openBlock(), createElementBlock("span", { key: error }, toDisplayString(error), 1);
-        }), 128))
-      ])) : createCommentVNode("", true);
-    };
   }
 });
-var FileUpload_vue_vue_type_style_index_0_lang = "";
-const _hoisted_1$g = /* @__PURE__ */ createElementVNode("label", { for: "upload_pdf" }, [
-  /* @__PURE__ */ createTextVNode(" Drag and drop file or "),
-  /* @__PURE__ */ createElementVNode("span", { id: "upload" }, "browse")
-], -1);
-const _hoisted_2$f = {
-  key: 1,
-  class: "file__upload_items"
-};
-const _hoisted_3$b = { class: "file__upload_list_item" };
-const _hoisted_4$7 = { class: "file__upload_list_item_label" };
-const _hoisted_5$4 = ["title"];
-const _hoisted_6$4 = {
-  key: 0,
-  class: "label__antivirus"
-};
-const _hoisted_7$3 = {
-  key: 1,
-  class: "label__antivirus label__antivirus--failed"
-};
-const _hoisted_8$2 = {
-  key: 2,
-  class: "label__antivirus label__antivirus--detected"
-};
-const _hoisted_9$2 = /* @__PURE__ */ createElementVNode("br", null, null, -1);
-const _hoisted_10$2 = { key: 3 };
-const _hoisted_11$2 = { key: 4 };
-const _hoisted_12$1 = { key: 0 };
-const _hoisted_13$1 = ["value"];
-const _hoisted_14$1 = ["href"];
-const _hoisted_15$1 = {
-  key: 2,
-  class: "file__upload_placeholder"
-};
-const _hoisted_16$1 = {
-  key: 3,
-  class: "file__upload_action"
-};
-const _hoisted_17$1 = /* @__PURE__ */ createElementVNode("button", { class: "file__upload_action_cancel" }, "Cancel", -1);
-const _sfc_main$g = {
-  __name: "FileUpload",
-  props: {
-    uploadProgress: {
-      type: Array,
-      required: true
-    },
-    modelValue: {
-      type: FileList,
-      required: true
-    },
-    inline: {
-      type: Boolean,
-      default: false
-    },
-    errorOccured: {
-      type: Array,
-      required: true
-    },
-    errorMessage: {
-      type: String,
-      default: "an error occured while uploading"
-    },
-    fileSaved: {
-      type: Boolean,
-      default: false
-    },
-    virusCheck: {
-      type: Array,
-      required: true
-    },
-    virusCheckText: {
-      type: String,
-      default: "Antivirus check ..."
-    },
-    virusCheckFailedText: {
-      type: String,
-      default: "Antivirus check failed"
-    },
-    virusDetectedText: {
-      type: String,
-      default: "Virus detected"
-    },
-    deleteConfirmationText: {
-      type: String,
-      default: "Are you sure you want to delete it permanently? this action will be irreversible"
-    },
-    zIndex: {
-      type: Number,
-      default: 99
-    }
-  },
-  emits: ["update:modelValue", "save:modelValue", "reload"],
-  setup(__props, { emit }) {
-    const props = __props;
-    const upload = ref(null);
-    const fileSelected = ref(false);
-    const files = ref([]);
-    const standardFormats = ref([
-      ".pdf",
-      ".csv",
-      ".doc",
-      ".jpeg",
-      ".mp4",
-      ".png",
-      ".txt",
-      ".xls"
-    ]);
-    function formatBytes(bytes, decimals = 2) {
-      if (!+bytes)
-        return "0 Bytes";
-      const k2 = 1024;
-      const dm = decimals < 0 ? 0 : decimals;
-      const sizes = ["Bytes", "KB", "MB", "GB", "TB", "PB", "EB", "ZB", "YB"];
-      const i2 = Math.floor(Math.log(bytes) / Math.log(k2));
-      return `${parseFloat((bytes / Math.pow(k2, i2)).toFixed(dm))} ${sizes[i2]}`;
-    }
-    function iconName(x2) {
-      return standardFormats.value.includes(getExtension(x2)) ? getExtension(x2).slice(1) : "unknown";
-    }
-    function getName(n) {
-      const index = n.lastIndexOf(".");
-      let str = n.slice(0, index);
-      return str.length <= 15 ? str : str.slice(0, 15) + `... `;
-    }
-    function getExtension(s3) {
-      return s3.replace(/.*(?=\.)/g, "");
-    }
-    function uploadFile(e2) {
-      e2.stopPropagation();
-      files.value = upload.value.files;
-      if (files.value) {
-        fileSelected.value = true;
-      }
-      emit("update:modelValue", files.value);
-    }
-    function dragFile(e2) {
-      e2.stopPropagation();
-      e2.dataTransfer.dropEffect = "copy";
-    }
-    function dropFile(e2) {
-      e2.stopPropagation();
-      fileSelected.value = true;
-      files.value = e2.dataTransfer.files;
-      emit("update:modelValue", files.value);
-    }
-    function deleteFile(index) {
-      if (window.confirm(props.deleteConfirmationText)) {
-        removeFile(index);
-      }
-    }
-    function removeFile(index) {
-      const dt = new DataTransfer();
-      for (let i2 = 0; i2 < files.value.length; i2++) {
-        const file = files.value[i2];
-        if (index !== i2)
-          dt.items.add(file);
+const _hoisted_1$k = { class: "dp__options" };
+const _hoisted_2$i = { class: "dp__options_switch" };
+const _hoisted_3$d = /* @__PURE__ */ createElementVNode("span", { class: "dp__options_slider" }, null, -1);
+function _sfc_render$7(_ctx, _cache, $props, $setup, $data, $options) {
+  return openBlock(), createElementBlock("label", _hoisted_1$k, [
+    createElementVNode("span", null, toDisplayString(_ctx.label), 1),
+    createElementVNode("div", _hoisted_2$i, [
+      withDirectives(createElementVNode("input", {
+        "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => _ctx.checkedValue = $event),
+        name: "switch",
+        type: "checkbox"
+      }, null, 512), [
+        [vModelCheckbox, _ctx.checkedValue]
+      ]),
+      _hoisted_3$d
+    ])
+  ]);
+}
+var DhSwitch = /* @__PURE__ */ _export_sfc(_sfc_main$k, [["render", _sfc_render$7]]);
+/*!
+ * Chart.js v3.9.1
+ * https://www.chartjs.org
+ * (c) 2022 Chart.js Contributors
+ * Released under the MIT License
+ */
+function noop() {
+}
+const uid = function() {
+  let id = 0;
+  return function() {
+    return id++;
+  };
+}();
+function isNullOrUndef(value) {
+  return value === null || typeof value === "undefined";
+}
+function isArray(value) {
+  if (Array.isArray && Array.isArray(value)) {
+    return true;
+  }
+  const type = Object.prototype.toString.call(value);
+  if (type.slice(0, 7) === "[object" && type.slice(-6) === "Array]") {
+    return true;
+  }
+  return false;
+}
+function isObject$1(value) {
+  return value !== null && Object.prototype.toString.call(value) === "[object Object]";
+}
+const isNumberFinite = (value) => (typeof value === "number" || value instanceof Number) && isFinite(+value);
+function finiteOrDefault(value, defaultValue) {
+  return isNumberFinite(value) ? value : defaultValue;
+}
+function valueOrDefault(value, defaultValue) {
+  return typeof value === "undefined" ? defaultValue : value;
+}
+const toPercentage = (value, dimension) => typeof value === "string" && value.endsWith("%") ? parseFloat(value) / 100 : value / dimension;
+const toDimension = (value, dimension) => typeof value === "string" && value.endsWith("%") ? parseFloat(value) / 100 * dimension : +value;
+function callback(fn, args, thisArg) {
+  if (fn && typeof fn.call === "function") {
+    return fn.apply(thisArg, args);
+  }
+}
+function each(loopable, fn, thisArg, reverse) {
+  let i2, len, keys;
+  if (isArray(loopable)) {
+    len = loopable.length;
+    if (reverse) {
+      for (i2 = len - 1; i2 >= 0; i2--) {
+        fn.call(thisArg, loopable[i2], i2);
       }
-      files.value = dt.files;
-      if (files.value.length == 0) {
-        fileSelected.value = false;
+    } else {
+      for (i2 = 0; i2 < len; i2++) {
+        fn.call(thisArg, loopable[i2], i2);
       }
     }
-    function saveFile() {
-      emit("save:modelValue", files.value);
+  } else if (isObject$1(loopable)) {
+    keys = Object.keys(loopable);
+    len = keys.length;
+    for (i2 = 0; i2 < len; i2++) {
+      fn.call(thisArg, loopable[keys[i2]], keys[i2]);
     }
-    function generateLink(file) {
-      return URL.createObjectURL(file);
+  }
+}
+function _elementsEqual(a0, a1) {
+  let i2, ilen, v0, v1;
+  if (!a0 || !a1 || a0.length !== a1.length) {
+    return false;
+  }
+  for (i2 = 0, ilen = a0.length; i2 < ilen; ++i2) {
+    v0 = a0[i2];
+    v1 = a1[i2];
+    if (v0.datasetIndex !== v1.datasetIndex || v0.index !== v1.index) {
+      return false;
     }
-    function reload(e2) {
-      e2.preventDefault();
-      emit("reload");
+  }
+  return true;
+}
+function clone$1(source) {
+  if (isArray(source)) {
+    return source.map(clone$1);
+  }
+  if (isObject$1(source)) {
+    const target = /* @__PURE__ */ Object.create(null);
+    const keys = Object.keys(source);
+    const klen = keys.length;
+    let k2 = 0;
+    for (; k2 < klen; ++k2) {
+      target[keys[k2]] = clone$1(source[keys[k2]]);
     }
-    return (_ctx, _cache) => {
-      return openBlock(), createElementBlock("div", {
-        class: normalizeClass(["file__upload", __props.inline ? "" : "file__upload_box"])
-      }, [
-        !__props.fileSaved ? (openBlock(), createElementBlock("div", {
-          key: 0,
-          class: "file__upload_btn",
-          onDragover: _cache[1] || (_cache[1] = withModifiers(($event) => dragFile($event), ["prevent"])),
-          onDrop: _cache[2] || (_cache[2] = withModifiers(($event) => dropFile($event), ["prevent"]))
-        }, [
-          createVNode(DhIcon, {
-            class: "file__upload_btn_icon",
-            "icon-name": "upload",
-            size: 24
-          }),
-          _hoisted_1$g,
-          createElementVNode("input", {
-            id: "upload_pdf",
-            ref_key: "upload",
-            ref: upload,
-            multiple: "",
-            name: "file",
-            type: "file",
-            onInput: _cache[0] || (_cache[0] = ($event) => uploadFile($event))
-          }, null, 544)
-        ], 32)) : createCommentVNode("", true),
-        fileSelected.value ? (openBlock(), createElementBlock("div", _hoisted_2$f, [
-          (openBlock(true), createElementBlock(Fragment, null, renderList(files.value, (file, id) => {
-            return openBlock(), createElementBlock("div", {
-              key: id,
-              class: normalizeClass(["file__upload_list", __props.inline ? "" : "file__upload_list_box"])
-            }, [
-              createVNode(DhIcon, {
-                class: normalizeClass(__props.errorOccured[id] ? "file__upload_list_icon" : ""),
-                "icon-name": `file-` + iconName(file.name),
-                size: 40
-              }, null, 8, ["class", "icon-name"]),
-              props.uploadProgress[id] == 100 && __props.fileSaved && !__props.errorOccured[id] && __props.virusCheck[id] == "loading" ? (openBlock(), createBlock(DhIcon, {
-                key: 0,
-                class: "file__upload_list_icon_sub file__upload_list_icon_sub--loading",
-                "icon-name": "states",
-                size: 20,
-                style: normalizeStyle({ "z-index": props.zIndex })
-              }, null, 8, ["style"])) : createCommentVNode("", true),
-              props.uploadProgress[id] == 100 && __props.fileSaved && __props.virusCheck[id] == "failed" ? (openBlock(), createBlock(DhIcon, {
-                key: 1,
-                class: "file__upload_list_icon_sub",
-                "icon-name": "warning-filled",
-                size: 20,
-                style: normalizeStyle({ "z-index": props.zIndex })
-              }, null, 8, ["style"])) : createCommentVNode("", true),
-              props.uploadProgress[id] == 100 && __props.fileSaved && __props.virusCheck[id] == "detected" ? (openBlock(), createBlock(DhIcon, {
-                key: 2,
-                class: "file__upload_list_icon_sub",
-                "icon-name": "danger",
-                size: 20,
-                style: normalizeStyle({ "z-index": props.zIndex })
-              }, null, 8, ["style"])) : createCommentVNode("", true),
-              __props.fileSaved && __props.errorOccured[id] ? (openBlock(), createBlock(DhIcon, {
-                key: 3,
-                class: "file__upload_list_icon_sub",
-                "icon-name": "error",
-                size: 20,
-                style: normalizeStyle({ "z-index": props.zIndex })
-              }, null, 8, ["style"])) : createCommentVNode("", true),
-              createElementVNode("div", _hoisted_3$b, [
-                createElementVNode("div", _hoisted_4$7, [
-                  createElementVNode("div", null, [
-                    createElementVNode("span", {
-                      title: file.name
-                    }, toDisplayString(getName(file.name)) + toDisplayString(getExtension(file.name)), 9, _hoisted_5$4),
-                    props.uploadProgress[id] == 100 && __props.fileSaved && !__props.errorOccured[id] && __props.virusCheck[id] == "loading" ? (openBlock(), createElementBlock("span", _hoisted_6$4, [
-                      createTextVNode(toDisplayString(__props.virusCheckText) + " ", 1),
-                      createVNode(DhIcon, {
-                        class: "file__upload_list_icon_sub--loading",
-                        "icon-name": "processing",
-                        size: 18
-                      })
-                    ])) : createCommentVNode("", true),
-                    props.uploadProgress[id] == 100 && __props.fileSaved && __props.virusCheck[id] == "failed" ? (openBlock(), createElementBlock("span", _hoisted_7$3, toDisplayString(__props.virusCheckFailedText), 1)) : createCommentVNode("", true),
-                    props.uploadProgress[id] == 100 && __props.fileSaved && __props.virusCheck[id] == "detected" ? (openBlock(), createElementBlock("span", _hoisted_8$2, toDisplayString(__props.virusDetectedText), 1)) : createCommentVNode("", true),
-                    _hoisted_9$2,
-                    __props.fileSaved && !__props.errorOccured[id] || !__props.errorOccured[id] && __props.virusCheck[id] ? (openBlock(), createElementBlock("span", _hoisted_10$2, toDisplayString(formatBytes(file.size)), 1)) : createCommentVNode("", true),
-                    __props.fileSaved && __props.errorOccured[id] ? (openBlock(), createElementBlock("span", _hoisted_11$2, toDisplayString(__props.errorMessage), 1)) : createCommentVNode("", true)
-                  ]),
-                  !__props.fileSaved ? (openBlock(), createElementBlock("span", _hoisted_12$1, toDisplayString(props.uploadProgress[id]) + "%", 1)) : createCommentVNode("", true)
-                ]),
-                !__props.fileSaved ? (openBlock(), createElementBlock("progress", {
-                  key: 0,
-                  id: "file",
-                  max: "100",
-                  value: props.uploadProgress[id]
-                }, toDisplayString(props.uploadProgress[id]) + "% ", 9, _hoisted_13$1)) : createCommentVNode("", true)
-              ]),
-              __props.fileSaved && !__props.virusCheck[id] && !__props.errorOccured[id] ? (openBlock(), createElementBlock("a", {
-                key: 4,
-                class: "file__upload_list_download",
-                download: "",
-                href: generateLink(file)
-              }, [
-                createVNode(DhIcon, {
-                  class: "file__upload_list_download_icon",
-                  "icon-name": "download",
-                  size: 24
-                })
-              ], 8, _hoisted_14$1)) : createCommentVNode("", true),
-              __props.fileSaved && __props.errorOccured[id] ? (openBlock(), createElementBlock("a", {
-                key: 5,
-                class: "file__upload_list_retry",
-                onClick: _cache[3] || (_cache[3] = ($event) => reload($event))
-              }, [
-                createVNode(DhIcon, {
-                  class: "file__upload_list_retry_icon",
-                  "icon-name": "retry",
-                  size: 24
-                })
-              ])) : createCommentVNode("", true),
-              props.uploadProgress[id] !== 100 ? (openBlock(), createBlock(DhIcon, {
-                key: 6,
-                class: "file__upload_list_delete",
-                "icon-name": "close",
-                size: 24,
-                onClick: ($event) => removeFile(id)
-              }, null, 8, ["onClick"])) : (openBlock(), createBlock(DhIcon, {
-                key: 7,
-                class: "file__upload_list_delete",
-                "icon-name": "delete",
-                size: 24,
-                onClick: ($event) => deleteFile(id)
-              }, null, 8, ["onClick"]))
-            ], 2);
-          }), 128))
-        ])) : createCommentVNode("", true),
-        !fileSelected.value && !__props.inline ? (openBlock(), createElementBlock("div", _hoisted_15$1, " No file selected ")) : createCommentVNode("", true),
-        !__props.inline && !__props.fileSaved ? (openBlock(), createElementBlock("div", _hoisted_16$1, [
-          _hoisted_17$1,
-          createElementVNode("button", {
-            class: normalizeClass([
-              "file__upload_action_done",
-              fileSelected.value && !__props.fileSaved ? "file__upload_action_done--active" : ""
-            ]),
-            onClick: saveFile
-          }, " Done ", 2)
-        ])) : createCommentVNode("", true)
-      ], 2);
-    };
+    return target;
   }
-};
-const _sfc_main$f = defineComponent({
-  components: { DhIcon },
-  props: {
-    hasCloseButton: {
-      type: Boolean,
-      default: true
-    },
-    hasSideBar: {
-      type: Boolean,
-      default: true
-    },
-    hasSideBarButtonBottom: {
-      type: Boolean,
-      default: true
-    },
-    hasHeader: {
-      type: Boolean,
-      default: true
-    },
-    hasFooter: {
-      type: Boolean,
-      default: true
-    },
-    hasFooterButtonRight: {
-      type: Boolean,
-      default: true
-    },
-    sideBarPosition: {
-      type: String,
-      default: "left"
-    },
-    hasCloseConfirmation: {
-      type: Boolean,
-      default: false
-    },
-    bodyClass: {
-      type: String,
-      default: ""
+  return source;
+}
+function isValidKey(key) {
+  return ["__proto__", "prototype", "constructor"].indexOf(key) === -1;
+}
+function _merger(key, target, source, options) {
+  if (!isValidKey(key)) {
+    return;
+  }
+  const tval = target[key];
+  const sval = source[key];
+  if (isObject$1(tval) && isObject$1(sval)) {
+    merge(tval, sval, options);
+  } else {
+    target[key] = clone$1(sval);
+  }
+}
+function merge(target, source, options) {
+  const sources = isArray(source) ? source : [source];
+  const ilen = sources.length;
+  if (!isObject$1(target)) {
+    return target;
+  }
+  options = options || {};
+  const merger = options.merger || _merger;
+  for (let i2 = 0; i2 < ilen; ++i2) {
+    source = sources[i2];
+    if (!isObject$1(source)) {
+      continue;
     }
-  },
-  emits: ["close"],
-  methods: {
-    closed() {
-      this.$emit("close", this.hasCloseConfirmation);
+    const keys = Object.keys(source);
+    for (let k2 = 0, klen = keys.length; k2 < klen; ++k2) {
+      merger(keys[k2], target, source, options);
     }
   }
-});
-const _hoisted_1$f = {
-  key: 1,
-  id: "modal-sidebar",
-  class: "modal-sidebar"
-};
-const _hoisted_2$e = {
-  key: 0,
-  id: "modalTitle",
-  class: "modal-header"
+  return target;
+}
+function mergeIf(target, source) {
+  return merge(target, source, { merger: _mergerIf });
+}
+function _mergerIf(key, target, source) {
+  if (!isValidKey(key)) {
+    return;
+  }
+  const tval = target[key];
+  const sval = source[key];
+  if (isObject$1(tval) && isObject$1(sval)) {
+    mergeIf(tval, sval);
+  } else if (!Object.prototype.hasOwnProperty.call(target, key)) {
+    target[key] = clone$1(sval);
+  }
+}
+const keyResolvers = {
+  "": (v) => v,
+  x: (o) => o.x,
+  y: (o) => o.y
 };
-const _hoisted_3$a = { 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" }, {
-    default: withCtx(() => [
-      createElementVNode("div", {
-        class: "modal-backdrop",
-        onClick: _cache[2] || (_cache[2] = (...args) => _ctx.closed && _ctx.closed(...args))
-      }, [
-        createElementVNode("div", {
-          "aria-describedby": "modalDescription",
-          "aria-labelledby": "modalTitle",
-          class: normalizeClass(`modal ${_ctx.hasSideBar ? _ctx.sideBarPosition : ""}`),
-          role: "dialog",
-          onClick: _cache[1] || (_cache[1] = withModifiers(() => {
-          }, ["stop"]))
-        }, [
-          _ctx.hasCloseButton ? (openBlock(), createElementBlock("button", {
-            key: 0,
-            "aria-label": "Close modal",
-            class: "btn-close",
-            type: "button",
-            onClick: _cache[0] || (_cache[0] = (...args) => _ctx.closed && _ctx.closed(...args))
-          }, [
-            createVNode(_component_dh_icon, {
-              class: "icon",
-              "icon-name": "close",
-              size: 24
-            })
-          ])) : createCommentVNode("", true),
-          _ctx.hasSideBar ? (openBlock(), createElementBlock("aside", _hoisted_1$f, [
-            renderSlot(_ctx.$slots, "sidebar"),
-            _ctx.hasSideBarButtonBottom ? renderSlot(_ctx.$slots, "sidebar-button-bottom", { key: 0 }) : createCommentVNode("", true)
-          ])) : createCommentVNode("", true),
-          createElementVNode("section", {
-            class: normalizeClass(`right-section ${_ctx.hasSideBar ? "" : "full"}`)
-          }, [
-            _ctx.hasHeader ? (openBlock(), createElementBlock("header", _hoisted_2$e, [
-              renderSlot(_ctx.$slots, "header")
-            ])) : createCommentVNode("", true),
-            createElementVNode("section", {
-              id: "modalDescription",
-              class: normalizeClass(["modal-body", _ctx.bodyClass])
-            }, [
-              renderSlot(_ctx.$slots, "body")
-            ], 2),
-            createElementVNode("footer", _hoisted_3$a, [
-              _ctx.hasFooter ? renderSlot(_ctx.$slots, "footer", { key: 0 }) : createCommentVNode("", true),
-              _ctx.hasFooterButtonRight ? renderSlot(_ctx.$slots, "footer-button-right", { key: 1 }) : createCommentVNode("", true)
-            ])
-          ], 2)
-        ], 2)
-      ])
-    ]),
-    _: 3
-  });
+function resolveObjectKey(obj, key) {
+  const resolver = keyResolvers[key] || (keyResolvers[key] = _getKeyResolver(key));
+  return resolver(obj);
 }
-var Modal = /* @__PURE__ */ _export_sfc(_sfc_main$f, [["render", _sfc_render$6]]);
-var __glob_1_0 = "data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICAgIDxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgY2xpcC1ydWxlPSJldmVub2RkIiBkPSJNMTIgMy41YTguNSA4LjUgMCAxIDAgMCAxNyA4LjUgOC41IDAgMCAwIDAtMTd6TTIuNSAxMmE5LjUgOS41IDAgMSAxIDE5IDAgOS41IDkuNSAwIDAgMS0xOSAweiIgZmlsbD0iI0MzMkYyNyIvPgogICAgPHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0xMiA3LjVhLjUuNSAwIDAgMSAuNS41djRhLjUuNSAwIDAgMS0xIDBWOGEuNS41IDAgMCAxIC41LS41ek0xMS4yNSAxNmEuNzUuNzUgMCAwIDEgLjc1LS43NWguMDFhLjc1Ljc1IDAgMCAxIDAgMS41SDEyYS43NS43NSAwIDAgMS0uNzUtLjc1eiIgZmlsbD0iI0MzMkYyNyIvPgo8L3N2Zz4K";
-var __glob_1_1 = "data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICAgIDxwYXRoIGQ9Ik0xNy40NTIgMTkuMTg5SDYuNTU4QTIuNTYgMi41NiAwIDAgMSA0IDE2LjYzMVYxNmMwLTEgLjQxNS0xLjk1OSAxLjEzOC0yLjY0NS40MzMtLjQxLjY3OC0uOTc3LjY3OC0xLjU3MlY5LjE4NEE2LjE5MSA2LjE5MSAwIDAgMSAxMiAzYTYuMTkxIDYuMTkxIDAgMCAxIDYuMTg0IDYuMTg0djIuNmMwIC41OTQuMjQ1IDEuMTY1LjY3OCAxLjU3QTMuNjM2IDMuNjM2IDAgMCAxIDIwIDE2di42MzFhMi41NDcgMi41NDcgMCAwIDEtMi41NDkgMi41NTh6bS01LjQ0Ny0xNC43MmE0LjcxOCA0LjcxOCAwIDAgMC00LjcxIDQuNzF2Mi42YzAgMS0uNDE0IDEuOTU4LTEuMTM4IDIuNjQ1LS40MzMuNDEtLjY3Ny45NzctLjY3NyAxLjU3MXYuNjMyYzAgLjU5OS40ODQgMS4wNzggMS4wODMgMS4wODJoMTAuODk0Yy41OTQgMCAxLjA3OC0uNDgzIDEuMDgzLTEuMDgydi0uNjMyYzAtLjU5NC0uMjQ0LTEuMTY2LS42NzgtMS41NzFhMy42MzYgMy42MzYgMCAwIDEtMS4xMzgtMi42NDZWOS4xNzVhNC43MjUgNC43MjUgMCAwIDAtNC43MTktNC43MDV6TTEzLjkwNCAyMS40NjZoLTMuNzk4YS43NC43NCAwIDAgMS0uNzM3LS43MzguNzQuNzQgMCAwIDEgLjczNy0uNzM3aDMuNzk4YS43MzcuNzM3IDAgMSAxIDAgMS40NzV6IiBmaWxsPSIjQkZCRkJGIi8+Cjwvc3ZnPgo=";
-var __glob_1_2 = "data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICAgIDxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgY2xpcC1ydWxlPSJldmVub2RkIiBkPSJNMTkuNDI3IDYuMjUzYTEgMSAwIDAgMSAwIDEuNDE0bC05LjI0IDkuMjRhMSAxIDAgMCAxLTEuNDE0IDBsLTQuMi00LjJhMSAxIDAgMSAxIDEuNDE0LTEuNDE0bDMuNDkzIDMuNDkzIDguNTMzLTguNTMzYTEgMSAwIDAgMSAxLjQxNCAweiIgZmlsbD0iIzNDQTA2NCIvPgo8L3N2Zz4K";
-var __glob_1_3 = "data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICAgIDxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgY2xpcC1ydWxlPSJldmVub2RkIiBkPSJNMTAuODkzIDMuNzlhMi4yNTYgMi4yNTYgMCAwIDEgMy4wMzYuNzk2bC4wMDIuMDAzIDcuNDQyIDEyLjQyNGEyLjI1NyAyLjI1NyAwIDAgMS0xLjkzIDMuMzg0SDQuNTU3YTIuMjU3IDIuMjU3IDAgMCAxLTEuOTI5LTMuMzg0bC4wMDQtLjAwN0wxMC4wNyA0LjU4OWwuMDAyLS4wMDNjLjIwMS0uMzMxLjQ4NC0uNjA2LjgyMi0uNzk2ek0xMiA0LjVhMS4yNTYgMS4yNTYgMCAwIDAtMS4wNzMuNjA0aC0uMDAxTDMuNDkgMTcuNTE3YTEuMjU2IDEuMjU2IDAgMCAwIDEuMDc0IDEuODgxaDE0Ljg3YTEuMjU2IDEuMjU2IDAgMCAwIDEuMDc0LTEuODgxTDEzLjA3NCA1LjEwNXYtLjAwMUExLjI1NyAxLjI1NyAwIDAgMCAxMiA0LjV6IiBmaWxsPSIjRjI5OTRBIi8+CiAgICA8cGF0aCBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGNsaXAtcnVsZT0iZXZlbm9kZCIgZD0iTTEyIDguODZhLjUuNSAwIDAgMSAuNS41djMuNTEyYS41LjUgMCAxIDEtMSAwVjkuMzU5YS41LjUgMCAwIDEgLjUtLjV6TTExLjI1IDE2LjM4NWEuNzUuNzUgMCAwIDEgLjc1LS43NWguMDA5YS43NS43NSAwIDEgMSAwIDEuNUgxMmEuNzUuNzUgMCAwIDEtLjc1LS43NXoiIGZpbGw9IiNGMjk5NEEiLz4KPC9zdmc+Cg==";
-const _sfc_main$e = defineComponent({
-  props: {
-    notificationType: {
-      type: String,
-      required: true,
-      default: "toast"
-    },
-    status: {
-      type: String,
-      required: true,
-      default: "info"
-    },
-    title: {
-      type: String,
-      required: false,
-      default: ""
-    },
-    message: {
-      type: String,
-      required: false,
-      default: ""
-    },
-    dismissible: {
-      type: Boolean,
-      required: false,
-      default: true
-    },
-    notificationButton: {
-      type: String,
-      default: "Action"
-    },
-    buttonAction: {
-      type: String,
-      default: "void"
-    },
-    buttonDismiss: {
-      type: String,
-      default: "Dismiss"
-    }
-  },
-  data() {
-    return {
-      show: true
-    };
-  },
-  mounted() {
-    if (this.dismissible && ["toast", "bottom-message"].includes(this.notificationType)) {
-      setTimeout(() => {
-        this.close();
-      }, 3e3);
-    }
-  },
-  methods: {
-    getIconUrl() {
-      return new URL({ "../assets/icon-danger.svg": __glob_1_0, "../assets/icon-info.svg": __glob_1_1, "../assets/icon-success.svg": __glob_1_2, "../assets/icon-warning.svg": __glob_1_3 }[`../assets/icon-${this.status}.svg`], self.location).href;
-    },
-    close() {
-      this.show = false;
-    },
-    limitTitle(_title, _type) {
-      if (["toast", "actionable"].includes(_type) && _title.length >= 60) {
-        return `${_title.substring(0, 60)}..`;
-      } else if (["bottom-message"].includes(_type) && _title.length >= 40) {
-        return `${_title.substring(0, 40)}..`;
-      } else if (["modal"].includes(_type) && _title.length >= 80) {
-        return `${_title.substring(0, 80)}..`;
+function _getKeyResolver(key) {
+  const keys = _splitKey(key);
+  return (obj) => {
+    for (const k2 of keys) {
+      if (k2 === "") {
+        break;
       }
-      return _title;
+      obj = obj && obj[k2];
     }
-  }
-});
-const _hoisted_1$e = /* @__PURE__ */ createElementVNode("img", {
-  alt: "icon",
-  class: "close-icon",
-  src: _imports_0$1
-}, null, -1);
-const _hoisted_2$d = [
-  _hoisted_1$e
-];
-const _hoisted_3$9 = ["src"];
-const _hoisted_4$6 = { class: "additional-text" };
-const _hoisted_5$3 = {
-  key: 0,
-  class: "descriptions"
-};
-const _hoisted_6$3 = { class: "btn btn-normal btn-primary" };
-function _sfc_render$5(_ctx, _cache, $props, $setup, $data, $options) {
-  return openBlock(), createElementBlock("div", {
-    class: normalizeClass(`dh-notification-container ${_ctx.notificationType}`)
-  }, [
-    _ctx.show ? (openBlock(), createElementBlock("div", {
-      key: 0,
-      class: normalizeClass(["bottom-message"].includes(_ctx.notificationType) ? `notification-up status status-${_ctx.notificationType}` : `notification-enter status status-${_ctx.notificationType}`)
-    }, [
-      !["modal", "bottom-message"].includes(_ctx.notificationType) ? (openBlock(), createElementBlock("button", {
-        key: 0,
-        class: "close-notification",
-        onClick: _cache[0] || (_cache[0] = withModifiers((...args) => _ctx.close && _ctx.close(...args), ["prevent"]))
-      }, _hoisted_2$d)) : createCommentVNode("", true),
-      createElementVNode("div", {
-        class: normalizeClass(`content content- ${_ctx.notificationType}`)
-      }, [
-        createElementVNode("div", {
-          class: normalizeClass(`ellipse ellipse-${_ctx.status} ellipse-${_ctx.notificationType}`)
-        }, [
-          createElementVNode("img", {
-            class: normalizeClass(`icons icons-${_ctx.status} icons-${_ctx.status}-${_ctx.notificationType}`),
-            src: _ctx.getIconUrl()
-          }, null, 10, _hoisted_3$9)
-        ], 2),
-        createElementVNode("div", _hoisted_4$6, [
-          createElementVNode("div", {
-            class: normalizeClass(`title title-${_ctx.notificationType}`)
-          }, toDisplayString(_ctx.limitTitle(_ctx.title, _ctx.notificationType)), 3),
-          !["bottom-message"].includes(_ctx.notificationType) ? (openBlock(), createElementBlock("div", _hoisted_5$3, toDisplayString(_ctx.message.length >= 280 ? `${_ctx.message.substring(0, 280)}..` : _ctx.message), 1)) : createCommentVNode("", true)
-        ]),
-        !["toast", "bottom-message"].includes(_ctx.notificationType) ? (openBlock(), createElementBlock("div", {
-          key: 0,
-          class: normalizeClass(`buttons ${_ctx.notificationType}`)
-        }, [
-          createElementVNode("button", _hoisted_6$3, toDisplayString(_ctx.notificationButton), 1),
-          createElementVNode("button", {
-            class: "btn btn-normal btn-secondary dismiss",
-            onClick: _cache[1] || (_cache[1] = withModifiers((...args) => _ctx.close && _ctx.close(...args), ["prevent"]))
-          }, toDisplayString(_ctx.buttonDismiss), 1)
-        ], 2)) : createCommentVNode("", true)
-      ], 2)
-    ], 2)) : createCommentVNode("", true)
-  ], 2);
-}
-var Notification = /* @__PURE__ */ _export_sfc(_sfc_main$e, [["render", _sfc_render$5]]);
-/*!
- * Chart.js v3.9.1
- * https://www.chartjs.org
- * (c) 2022 Chart.js Contributors
- * Released under the MIT License
- */
-function noop() {
-}
-const uid = function() {
-  let id = 0;
-  return function() {
-    return id++;
+    return obj;
   };
-}();
-function isNullOrUndef(value) {
-  return value === null || typeof value === "undefined";
-}
-function isArray(value) {
-  if (Array.isArray && Array.isArray(value)) {
-    return true;
-  }
-  const type = Object.prototype.toString.call(value);
-  if (type.slice(0, 7) === "[object" && type.slice(-6) === "Array]") {
-    return true;
-  }
-  return false;
-}
-function isObject$1(value) {
-  return value !== null && Object.prototype.toString.call(value) === "[object Object]";
-}
-const isNumberFinite = (value) => (typeof value === "number" || value instanceof Number) && isFinite(+value);
-function finiteOrDefault(value, defaultValue) {
-  return isNumberFinite(value) ? value : defaultValue;
-}
-function valueOrDefault(value, defaultValue) {
-  return typeof value === "undefined" ? defaultValue : value;
-}
-const toPercentage = (value, dimension) => typeof value === "string" && value.endsWith("%") ? parseFloat(value) / 100 : value / dimension;
-const toDimension = (value, dimension) => typeof value === "string" && value.endsWith("%") ? parseFloat(value) / 100 * dimension : +value;
-function callback(fn, args, thisArg) {
-  if (fn && typeof fn.call === "function") {
-    return fn.apply(thisArg, args);
-  }
 }
-function each(loopable, fn, thisArg, reverse) {
-  let i2, len, keys;
-  if (isArray(loopable)) {
-    len = loopable.length;
-    if (reverse) {
-      for (i2 = len - 1; i2 >= 0; i2--) {
-        fn.call(thisArg, loopable[i2], i2);
-      }
+function _splitKey(key) {
+  const parts = key.split(".");
+  const keys = [];
+  let tmp = "";
+  for (const part of parts) {
+    tmp += part;
+    if (tmp.endsWith("\\")) {
+      tmp = tmp.slice(0, -1) + ".";
     } else {
-      for (i2 = 0; i2 < len; i2++) {
-        fn.call(thisArg, loopable[i2], i2);
-      }
-    }
-  } else if (isObject$1(loopable)) {
-    keys = Object.keys(loopable);
-    len = keys.length;
-    for (i2 = 0; i2 < len; i2++) {
-      fn.call(thisArg, loopable[keys[i2]], keys[i2]);
+      keys.push(tmp);
+      tmp = "";
     }
   }
+  return keys;
 }
-function _elementsEqual(a0, a1) {
-  let i2, ilen, v0, v1;
-  if (!a0 || !a1 || a0.length !== a1.length) {
+function _capitalize(str) {
+  return str.charAt(0).toUpperCase() + str.slice(1);
+}
+const defined = (value) => typeof value !== "undefined";
+const isFunction = (value) => typeof value === "function";
+const setsEqual = (a3, b2) => {
+  if (a3.size !== b2.size) {
     return false;
   }
-  for (i2 = 0, ilen = a0.length; i2 < ilen; ++i2) {
-    v0 = a0[i2];
-    v1 = a1[i2];
-    if (v0.datasetIndex !== v1.datasetIndex || v0.index !== v1.index) {
+  for (const item of a3) {
+    if (!b2.has(item)) {
       return false;
     }
   }
   return true;
-}
-function clone$1(source) {
-  if (isArray(source)) {
-    return source.map(clone$1);
-  }
-  if (isObject$1(source)) {
-    const target = /* @__PURE__ */ Object.create(null);
-    const keys = Object.keys(source);
-    const klen = keys.length;
-    let k2 = 0;
-    for (; k2 < klen; ++k2) {
-      target[keys[k2]] = clone$1(source[keys[k2]]);
-    }
-    return target;
-  }
-  return source;
-}
-function isValidKey(key) {
-  return ["__proto__", "prototype", "constructor"].indexOf(key) === -1;
-}
-function _merger(key, target, source, options) {
-  if (!isValidKey(key)) {
-    return;
-  }
-  const tval = target[key];
-  const sval = source[key];
-  if (isObject$1(tval) && isObject$1(sval)) {
-    merge(tval, sval, options);
-  } else {
-    target[key] = clone$1(sval);
-  }
-}
-function merge(target, source, options) {
-  const sources = isArray(source) ? source : [source];
-  const ilen = sources.length;
-  if (!isObject$1(target)) {
-    return target;
-  }
-  options = options || {};
-  const merger = options.merger || _merger;
-  for (let i2 = 0; i2 < ilen; ++i2) {
-    source = sources[i2];
-    if (!isObject$1(source)) {
-      continue;
-    }
-    const keys = Object.keys(source);
-    for (let k2 = 0, klen = keys.length; k2 < klen; ++k2) {
-      merger(keys[k2], target, source, options);
-    }
-  }
-  return target;
-}
-function mergeIf(target, source) {
-  return merge(target, source, { merger: _mergerIf });
-}
-function _mergerIf(key, target, source) {
-  if (!isValidKey(key)) {
-    return;
-  }
-  const tval = target[key];
-  const sval = source[key];
-  if (isObject$1(tval) && isObject$1(sval)) {
-    mergeIf(tval, sval);
-  } else if (!Object.prototype.hasOwnProperty.call(target, key)) {
-    target[key] = clone$1(sval);
-  }
-}
-const keyResolvers = {
-  "": (v) => v,
-  x: (o) => o.x,
-  y: (o) => o.y
-};
-function resolveObjectKey(obj, key) {
-  const resolver = keyResolvers[key] || (keyResolvers[key] = _getKeyResolver(key));
-  return resolver(obj);
-}
-function _getKeyResolver(key) {
-  const keys = _splitKey(key);
-  return (obj) => {
-    for (const k2 of keys) {
-      if (k2 === "") {
-        break;
-      }
-      obj = obj && obj[k2];
-    }
-    return obj;
-  };
-}
-function _splitKey(key) {
-  const parts = key.split(".");
-  const keys = [];
-  let tmp = "";
-  for (const part of parts) {
-    tmp += part;
-    if (tmp.endsWith("\\")) {
-      tmp = tmp.slice(0, -1) + ".";
-    } else {
-      keys.push(tmp);
-      tmp = "";
-    }
-  }
-  return keys;
-}
-function _capitalize(str) {
-  return str.charAt(0).toUpperCase() + str.slice(1);
-}
-const defined = (value) => typeof value !== "undefined";
-const isFunction = (value) => typeof value === "function";
-const setsEqual = (a3, b2) => {
-  if (a3.size !== b2.size) {
-    return false;
-  }
-  for (const item of a3) {
-    if (!b2.has(item)) {
-      return false;
-    }
-  }
-  return true;
-};
-function _isClickEvent(e2) {
-  return e2.type === "mouseup" || e2.type === "click" || e2.type === "contextmenu";
+};
+function _isClickEvent(e2) {
+  return e2.type === "mouseup" || e2.type === "click" || e2.type === "contextmenu";
 }
 const PI = Math.PI;
 const TAU = 2 * PI;
@@ -23248,940 +22585,1991 @@ function getChartData(data, datasetIdKey) {
   }, datasetIdKey);
   return nextData;
 }
-function setChartDatasets(oldData, newData, datasetIdKey) {
-  const addedDatasets = [];
-  oldData.datasets = newData.datasets.map((nextDataset) => {
-    const currentDataset = oldData.datasets.find((dataset) => dataset[datasetIdKey] === nextDataset[datasetIdKey]);
-    if (!currentDataset || !nextDataset.data || addedDatasets.includes(currentDataset)) {
-      return {
-        ...nextDataset
-      };
+function setChartDatasets(oldData, newData, datasetIdKey) {
+  const addedDatasets = [];
+  oldData.datasets = newData.datasets.map((nextDataset) => {
+    const currentDataset = oldData.datasets.find((dataset) => dataset[datasetIdKey] === nextDataset[datasetIdKey]);
+    if (!currentDataset || !nextDataset.data || addedDatasets.includes(currentDataset)) {
+      return {
+        ...nextDataset
+      };
+    }
+    addedDatasets.push(currentDataset);
+    Object.assign(currentDataset, nextDataset);
+    return currentDataset;
+  });
+}
+function setChartLabels(chart, labels, context) {
+  chart.data.labels = labels;
+  if (context !== void 0) {
+    context.emit(ChartEmits.LabelsUpdated);
+  }
+}
+function setChartOptions(chart, options) {
+  chart.options = {
+    ...options
+  };
+}
+function compareData(newData, oldData) {
+  const newDatasetLabels = newData.datasets.map((dataset) => {
+    return dataset.label;
+  });
+  const oldDatasetLabels = oldData.datasets.map((dataset) => {
+    return dataset.label;
+  });
+  return oldData.datasets.length === newData.datasets.length && newDatasetLabels.every((value, index) => value === oldDatasetLabels[index]);
+}
+const templateError = "Please remove the <template></template> tags from your chart component. See https://vue-chartjs.org/guide/#vue-single-file-components";
+const chartUpdateError = "Update ERROR: chart instance not found";
+const generateChart = (chartId, chartType, chartController) => {
+  return defineComponent({
+    props: {
+      chartData: {
+        type: Object,
+        required: true
+      },
+      chartOptions: {
+        type: Object,
+        default: () => {
+        }
+      },
+      datasetIdKey: {
+        type: String,
+        default: "label"
+      },
+      chartId: {
+        type: String,
+        default: chartId
+      },
+      width: {
+        type: Number,
+        default: 400
+      },
+      height: {
+        type: Number,
+        default: 400
+      },
+      cssClasses: {
+        type: String,
+        default: ""
+      },
+      styles: {
+        type: Object,
+        default: () => {
+        }
+      },
+      plugins: {
+        type: Array,
+        default: () => []
+      }
+    },
+    setup(props, context) {
+      Chart.register(chartController);
+      const _chart = shallowRef(null);
+      const canvasEl = ref(null);
+      function renderChart(data, options) {
+        if (_chart.value !== null) {
+          chartDestroy(toRaw(_chart.value), context);
+        }
+        if (canvasEl.value === null) {
+          throw new Error(templateError);
+        } else {
+          const chartData = getChartData(data, props.datasetIdKey);
+          const canvasEl2DContext = canvasEl.value.getContext("2d");
+          if (canvasEl2DContext !== null) {
+            _chart.value = new Chart(canvasEl2DContext, {
+              type: chartType,
+              data: isProxy(data) ? new Proxy(chartData, {}) : chartData,
+              options,
+              plugins: props.plugins
+            });
+          }
+        }
+      }
+      function chartDataHandler(newValue, oldValue) {
+        const newData = isProxy(newValue) ? toRaw(newValue) : {
+          ...newValue
+        };
+        const oldData = isProxy(oldValue) ? toRaw(oldValue) : {
+          ...oldValue
+        };
+        if (Object.keys(oldData).length > 0) {
+          const chart = toRaw(_chart.value);
+          const isEqualLabelsAndDatasetsLength = compareData(newData, oldData);
+          if (isEqualLabelsAndDatasetsLength && chart !== null) {
+            setChartDatasets(chart === null || chart === void 0 ? void 0 : chart.data, newData, props.datasetIdKey);
+            if (newData.labels !== void 0) {
+              setChartLabels(chart, newData.labels, context);
+            }
+            updateChart();
+          } else {
+            if (chart !== null) {
+              chartDestroy(chart, context);
+            }
+            chartCreate(renderChart, props.chartData, props.chartOptions, context);
+          }
+        } else {
+          if (_chart.value !== null) {
+            chartDestroy(toRaw(_chart.value), context);
+          }
+          chartCreate(renderChart, props.chartData, props.chartOptions, context);
+        }
+      }
+      function chartOptionsHandler(options) {
+        const chart = toRaw(_chart.value);
+        if (chart !== null) {
+          setChartOptions(chart, options);
+          updateChart();
+        } else {
+          chartCreate(renderChart, props.chartData, props.chartOptions, context);
+        }
+      }
+      function updateChart() {
+        const chart = toRaw(_chart.value);
+        if (chart !== null) {
+          chartUpdate(chart, context);
+        } else {
+          console.error(chartUpdateError);
+        }
+      }
+      watch(() => props.chartData, (newValue, oldValue) => chartDataHandler(newValue, oldValue), {
+        deep: true
+      });
+      watch(() => props.chartOptions, (newValue) => chartOptionsHandler(newValue), {
+        deep: true
+      });
+      onMounted(() => {
+        if ("datasets" in props.chartData && props.chartData.datasets.length > 0) {
+          chartCreate(renderChart, props.chartData, props.chartOptions, context);
+        }
+      });
+      onBeforeUnmount(() => {
+        if (_chart.value !== null) {
+          chartDestroy(toRaw(_chart.value), context);
+        }
+      });
+      context.expose({
+        chart: _chart,
+        updateChart
+      });
+      return () => h("div", {
+        style: props.styles,
+        class: props.cssClasses
+      }, [
+        h("canvas", {
+          id: props.chartId,
+          width: props.width,
+          height: props.height,
+          ref: canvasEl
+        })
+      ]);
+    }
+  });
+};
+const Bar = /* @__PURE__ */ generateChart("bar-chart", "bar", BarController);
+var MultiRangeSlider_vue_vue_type_style_index_0_lang = "";
+const _sfc_main$j = {
+  name: "MultiRangeSlider",
+  props: {
+    baseClassName: {
+      type: String,
+      default: "multi-range-slider"
+    },
+    min: { type: Number },
+    max: { type: Number },
+    minValue: { type: Number },
+    maxValue: { type: Number },
+    step: { type: Number, default: 1 },
+    preventWheel: { type: Boolean, default: false },
+    ruler: { type: Boolean, default: true },
+    label: { type: Boolean, default: true },
+    labels: { type: Array },
+    minCaption: { type: String },
+    maxCaption: { type: String },
+    rangeMargin: { type: Number }
+  },
+  data() {
+    let _labels = this.labels || [];
+    let _minimum = this.min === void 0 ? 0 : this.min;
+    let max = _labels.length ? _labels.length - 1 : 100;
+    let _maximum = this.max === void 0 ? max : this.max;
+    let _minValue = this.minValue === void 0 ? 25 : this.minValue;
+    if (_labels.length && this.minValue === void 0) {
+      _minValue = 1;
+    }
+    let _maxValue = this.maxValue || 75;
+    if (_labels.length && this.maxValue === void 0) {
+      _maxValue = _labels.length - 2;
+    }
+    if (_maximum <= _minimum) {
+      throw new Error("Invalid props min or max");
+    }
+    if (_minValue > _maxValue) {
+      throw new Error("Invalid props minValue or maxValue");
+    }
+    let _rangeMargin = this.rangeMargin === void 0 ? this.step : this.rangeMargin;
+    let m3 = _rangeMargin % this.step;
+    m3 && (_rangeMargin = _rangeMargin + this.step - m3);
+    return {
+      valueMin: _minValue < _minimum ? _minimum : _minValue,
+      valueMax: _maxValue > _maximum ? _maximum : _maxValue,
+      interVal: null,
+      startX: null,
+      mouseMoveCounter: null,
+      barBox: null,
+      barValue: 0,
+      rangeMarginValue: _rangeMargin
+    };
+  },
+  methods: {
+    onBarLeftClick() {
+      if (this.valueMin - this.step >= this.minimum) {
+        this.valueMin -= this.step;
+      } else {
+        this.valueMin = this.minimum;
+      }
+    },
+    onInnerBarLeftClick() {
+      if (this.valueMin + this.rangeMarginValue < this.valueMax) {
+        this.valueMin += this.step;
+      }
+    },
+    onBarRightClick() {
+      if (this.valueMax + this.step <= this.maximum) {
+        this.valueMax += this.step;
+      } else {
+        this.valueMax = this.maximum;
+      }
+    },
+    onInnerBarRightClick() {
+      if (this.valueMax - this.rangeMarginValue > this.valueMin) {
+        this.valueMax -= this.step;
+      }
+    },
+    onInputMinChange(e2) {
+      let val = parseFloat(e2.target.value);
+      if (val <= this.valueMax - this.rangeMarginValue && val >= this.minimum) {
+        this.valueMin = val;
+      } else {
+        e2.target.value = this.valueMin;
+      }
+    },
+    onInputMaxChange(e2) {
+      let val = parseFloat(e2.target.value);
+      if (val >= this.valueMin + this.rangeMarginValue && val <= this.maximum) {
+        this.valueMax = val;
+      } else {
+        e2.target.value = this.valueMax;
+      }
+    },
+    onLeftThumbMousedown(e2) {
+      e2.preventDefault();
+      this.startX = e2.clientX;
+      if (e2.type === "touchstart") {
+        if (e2.touches.length === 1) {
+          this.startX = e2.touches[0].clientX;
+        } else {
+          return;
+        }
+      }
+      this.mouseMoveCounter = 0;
+      this.barValue = this.valueMin;
+      this.barBox = e2.target.parentNode.getBoundingClientRect();
+      document.addEventListener("mousemove", this.onLeftThumbMousemove);
+      document.addEventListener("mouseup", this.onLeftThumbMouseup);
+      document.addEventListener("touchmove", this.onLeftThumbMousemove);
+      document.addEventListener("touchend", this.onLeftThumbMouseup);
+    },
+    onLeftThumbMousemove(e2) {
+      this.mouseMoveCounter++;
+      let clientX = e2.clientX;
+      if (e2.type === "touchmove") {
+        clientX = e2.touches[0].clientX;
+      }
+      let dx = clientX - this.startX;
+      let per = dx / this.barBox.width;
+      let val = this.barValue + (this.maximum - this.minimum) * per;
+      let mod = val % this.step;
+      val -= mod;
+      if (val < this.minimum) {
+        val = this.minimum;
+      } else if (val > this.valueMax - this.rangeMarginValue) {
+        val = this.valueMax - this.rangeMarginValue;
+      }
+      this.valueMin = val;
+    },
+    onLeftThumbMouseup() {
+      document.removeEventListener("mousemove", this.onLeftThumbMousemove);
+      document.removeEventListener("mouseup", this.onLeftThumbMouseup);
+      document.removeEventListener("touchmove", this.onLeftThumbMousemove);
+      document.removeEventListener("touchend", this.onLeftThumbMouseup);
+    },
+    onRightThumbMousedown(e2) {
+      e2.preventDefault();
+      this.startX = e2.clientX;
+      if (e2.type === "touchstart") {
+        if (e2.touches.length === 1) {
+          this.startX = e2.touches[0].clientX;
+        } else {
+          return;
+        }
+      }
+      this.mouseMoveCounter = 0;
+      this.barValue = this.valueMax;
+      this.barBox = e2.target.parentNode.getBoundingClientRect();
+      document.addEventListener("mousemove", this.onRightThumbMousemove);
+      document.addEventListener("mouseup", this.onRightThumbMouseup);
+      document.addEventListener("touchmove", this.onRightThumbMousemove);
+      document.addEventListener("touchend", this.onRightThumbMouseup);
+    },
+    onRightThumbMousemove(e2) {
+      this.mouseMoveCounter++;
+      let clientX = e2.clientX;
+      if (e2.type === "touchmove") {
+        clientX = e2.touches[0].clientX;
+      }
+      let dx = clientX - this.startX;
+      let per = dx / this.barBox.width;
+      let val = this.barValue + (this.maximum - this.minimum) * per;
+      let mod = val % this.step;
+      val -= mod;
+      if (val < this.valueMin + this.rangeMarginValue) {
+        val = this.valueMin + this.rangeMarginValue;
+      } else if (val > this.maximum) {
+        val = this.maximum;
+      }
+      this.valueMax = val;
+    },
+    onRightThumbMouseup() {
+      document.removeEventListener("mousemove", this.onRightThumbMousemove);
+      document.removeEventListener("mouseup", this.onRightThumbMouseup);
+      document.removeEventListener("touchmove", this.onRightThumbMousemove);
+      document.removeEventListener("touchend", this.onRightThumbMouseup);
+    },
+    onMouseWheel(e2) {
+      if (this.preventWheel === true) {
+        return;
+      }
+      if (!e2.shiftKey && !e2.ctrlKey) {
+        return;
+      }
+      let val = this.step;
+      if (e2.deltaY < 0) {
+        val = -val;
+      }
+      if (e2.shiftKey && e2.ctrlKey) {
+        if (this.valueMin + val >= this.minimum && this.valueMax + val <= this.maximum) {
+          this.valueMin = this.valueMin + val;
+          this.valueMax = this.valueMax + val;
+        }
+      } else if (e2.ctrlKey) {
+        val = this.valueMax + val;
+        if (val < this.valueMin + this.rangeMarginValue) {
+          val = this.valueMin + this.rangeMarginValue;
+        } else if (val > this.maximum) {
+          val = this.maximum;
+        }
+        this.valueMax = val;
+      } else if (e2.shiftKey) {
+        val = this.valueMin + val;
+        if (val < this.minimum) {
+          val = this.minimum;
+        } else if (val > this.valueMax - this.rangeMarginValue) {
+          val = this.valueMax - this.rangeMarginValue;
+        }
+        this.valueMin = val;
+      }
+    },
+    triggerInput() {
+      let fixed = 0;
+      if (this.step.toString().includes(".")) {
+        fixed = 2;
+      }
+      let retObj = {
+        min: this.minimum,
+        max: this.maximum,
+        minValue: parseFloat(this.valueMin.toFixed(fixed)),
+        maxValue: parseFloat(this.valueMax.toFixed(fixed))
+      };
+      this.$emit("input", retObj);
+    }
+  },
+  computed: {
+    minimum() {
+      return this.min === void 0 ? 0 : this.min;
+    },
+    maximum() {
+      let _labels = this.labels || [];
+      let max = _labels.length ? _labels.length - 1 : 100;
+      return this.max === void 0 ? max : this.max;
+    },
+    stepCount() {
+      let _labels = this.labels || [];
+      if (_labels.length) {
+        return _labels.length - 1;
+      }
+      return Math.floor((this.maximum - this.minimum) / this.step);
+    },
+    subStepCount() {
+      let _labels = this.labels || [];
+      if (_labels.length && this.step > 1) {
+        return (this.maximum - this.minimum) / this.step;
+      }
+      return 0;
+    },
+    barMin() {
+      let per = (this.valueMin - this.minimum) / (this.maximum - this.minimum) * 100;
+      return per;
+    },
+    barMax() {
+      let per = 100 - (this.valueMax - this.minimum) / (this.maximum - this.minimum) * 100;
+      return per;
+    },
+    barMinVal() {
+      let fixed = 0;
+      if (this.step.toString().includes(".")) {
+        fixed = 2;
+      }
+      return (this.valueMin || 0).toFixed(fixed);
+    },
+    barMaxVal() {
+      let fixed = 0;
+      if (this.step.toString().includes(".")) {
+        fixed = 2;
+      }
+      return (this.valueMax || 100).toFixed(fixed);
+    },
+    scaleLabels() {
+      let _labels = this.labels || [];
+      if (_labels.length === 0) {
+        _labels = [];
+        _labels.push(this.minimum);
+        _labels.push(this.maximum);
+      }
+      return _labels;
+    }
+  },
+  watch: {
+    valueMin() {
+      this.triggerInput();
+    },
+    valueMax() {
+      this.triggerInput();
+    },
+    minValue(newValue) {
+      this.valueMin = newValue < this.minimum ? this.minimum : newValue;
+    },
+    maxValue(newValue) {
+      this.valueMax = newValue > this.maximum ? this.maximum : newValue;
+    }
+  },
+  mounted() {
+  }
+};
+const _hoisted_1$j = { class: "bar" };
+const _hoisted_2$h = ["min", "max", "step", "value"];
+const _hoisted_3$c = { class: "caption" };
+const _hoisted_4$9 = { class: "min-caption" };
+const _hoisted_5$6 = { class: "bar-inner" };
+const _hoisted_6$6 = ["min", "max", "step", "value"];
+const _hoisted_7$5 = { class: "caption" };
+const _hoisted_8$3 = { class: "max-caption" };
+const _hoisted_9$3 = {
+  key: 0,
+  class: "ruler"
+};
+const _hoisted_10$3 = {
+  key: 1,
+  class: "sub-ruler"
+};
+const _hoisted_11$3 = {
+  key: 2,
+  class: "labels"
+};
+function _sfc_render$6(_ctx, _cache, $props, $setup, $data, $options) {
+  return openBlock(), createElementBlock("div", {
+    class: normalizeClass([$props.baseClassName, $data.rangeMarginValue === 0 ? "zero-ranage-margin" : ""]),
+    onMousewheel: _cache[10] || (_cache[10] = withModifiers((...args) => $options.onMouseWheel && $options.onMouseWheel(...args), ["prevent", "stop"]))
+  }, [
+    createElementVNode("div", _hoisted_1$j, [
+      createElementVNode("div", {
+        class: "bar-left",
+        style: normalizeStyle({ width: $options.barMin + "%" }),
+        onClick: _cache[0] || (_cache[0] = (...args) => $options.onBarLeftClick && $options.onBarLeftClick(...args))
+      }, null, 4),
+      createElementVNode("input", {
+        class: "input-type-range input-type-range-min",
+        type: "range",
+        min: $options.minimum,
+        max: $options.maximum,
+        step: $props.step,
+        value: $data.valueMin,
+        onInput: _cache[1] || (_cache[1] = withModifiers((...args) => $options.onInputMinChange && $options.onInputMinChange(...args), ["stop", "prevent"]))
+      }, null, 40, _hoisted_2$h),
+      createElementVNode("div", {
+        class: "thumb thumb-left",
+        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$c, [
+          createElementVNode("span", _hoisted_4$9, toDisplayString($props.minCaption || $options.barMinVal), 1)
+        ])
+      ], 32),
+      createElementVNode("div", _hoisted_5$6, [
+        createElementVNode("div", {
+          class: "bar-inner-left",
+          onClick: _cache[4] || (_cache[4] = (...args) => $options.onInnerBarLeftClick && $options.onInnerBarLeftClick(...args))
+        }),
+        createElementVNode("div", {
+          class: "bar-inner-right",
+          onClick: _cache[5] || (_cache[5] = (...args) => $options.onInnerBarRightClick && $options.onInnerBarRightClick(...args))
+        })
+      ]),
+      createElementVNode("input", {
+        class: "input-type-range input-type-range-max",
+        type: "range",
+        min: $options.minimum,
+        max: $options.maximum,
+        step: $props.step,
+        value: $data.valueMax,
+        onInput: _cache[6] || (_cache[6] = withModifiers((...args) => $options.onInputMaxChange && $options.onInputMaxChange(...args), ["stop", "prevent"]))
+      }, null, 40, _hoisted_6$6),
+      createElementVNode("div", {
+        class: "thumb thumb-right",
+        onMousedown: _cache[7] || (_cache[7] = (...args) => $options.onRightThumbMousedown && $options.onRightThumbMousedown(...args)),
+        onTouchstart: _cache[8] || (_cache[8] = (...args) => $options.onRightThumbMousedown && $options.onRightThumbMousedown(...args))
+      }, [
+        createElementVNode("div", _hoisted_7$5, [
+          createElementVNode("span", _hoisted_8$3, toDisplayString($props.maxCaption || $options.barMaxVal), 1)
+        ])
+      ], 32),
+      createElementVNode("div", {
+        class: "bar-right",
+        style: normalizeStyle({ width: $options.barMax + "%" }),
+        onClick: _cache[9] || (_cache[9] = (...args) => $options.onBarRightClick && $options.onBarRightClick(...args))
+      }, null, 4)
+    ]),
+    $props.ruler ? (openBlock(), createElementBlock("div", _hoisted_9$3, [
+      (openBlock(true), createElementBlock(Fragment, null, renderList($options.stepCount, (n) => {
+        return openBlock(), createElementBlock("div", {
+          key: n,
+          class: "ruler-rule"
+        });
+      }), 128))
+    ])) : createCommentVNode("", true),
+    $options.subStepCount ? (openBlock(), createElementBlock("div", _hoisted_10$3, [
+      (openBlock(true), createElementBlock(Fragment, null, renderList($options.subStepCount, (n) => {
+        return openBlock(), createElementBlock("div", {
+          key: n,
+          class: "ruler-sub-rule"
+        });
+      }), 128))
+    ])) : createCommentVNode("", true),
+    $props.label ? (openBlock(), createElementBlock("div", _hoisted_11$3, [
+      (openBlock(true), createElementBlock(Fragment, null, renderList($options.scaleLabels, (label) => {
+        return openBlock(), createElementBlock("div", {
+          class: "label",
+          key: label
+        }, toDisplayString(label), 1);
+      }), 128))
+    ])) : createCommentVNode("", true)
+  ], 34);
+}
+var MultiRangeSlider = /* @__PURE__ */ _export_sfc(_sfc_main$j, [["render", _sfc_render$6]]);
+const _sfc_main$i = defineComponent({
+  components: { DhIcon },
+  props: {
+    mainText: {
+      type: String,
+      default: "Advanced"
+    },
+    filterMissingText: {
+      type: String,
+      default: "Filter Missing"
+    },
+    matchText: {
+      type: String,
+      default: "Match"
+    },
+    excludeText: {
+      type: String,
+      default: "Exclude"
+    }
+  },
+  data() {
+    return {
+      activeFilter: false,
+      isFilterMissing: false,
+      isMatch: false,
+      isExclude: false
+    };
+  },
+  emits: ["match", "exclude", "filter_missing"],
+  mounted() {
+    this.isMatch = true;
+  },
+  methods: {
+    toggleFilter() {
+      this.activeFilter = !this.activeFilter;
+    },
+    matchFilter() {
+      this.isMatch = true;
+      this.isExclude = false;
+      this.$emit("match", this.isMatch);
+    },
+    excludeFilter() {
+      this.isMatch = false;
+      this.isExclude = true;
+      this.$emit("exclude", this.isExclude);
+    },
+    missingFilter() {
+      this.isFilterMissing = !this.isFilterMissing;
+      this.$emit("filter_missing", this.isFilterMissing);
+      if (this.isFilterMissing && this.isMatch) {
+        this.matchFilter();
+      } else if (this.isFilterMissing && this.isExclude) {
+        this.excludeFilter();
+      }
+    }
+  }
+});
+const _hoisted_1$i = { class: "dh-advanced-filter-container" };
+const _hoisted_2$g = { class: "advance_section" };
+const _hoisted_3$b = { key: 0 };
+const _hoisted_4$8 = { class: "list-none" };
+const _hoisted_5$5 = ["checked"];
+const _hoisted_6$5 = ["checked"];
+const _hoisted_7$4 = ["checked"];
+function _sfc_render$5(_ctx, _cache, $props, $setup, $data, $options) {
+  const _component_dh_icon = resolveComponent("dh-icon");
+  return openBlock(), createElementBlock("div", _hoisted_1$i, [
+    createElementVNode("div", _hoisted_2$g, [
+      createElementVNode("span", {
+        class: "toggle-icon",
+        onClick: _cache[0] || (_cache[0] = ($event) => _ctx.toggleFilter())
+      }, [
+        createTextVNode(toDisplayString(_ctx.mainText) + " ", 1),
+        createVNode(_component_dh_icon, {
+          "icon-name": _ctx.activeFilter ? "arrow-up" : "arrow-down",
+          size: 20
+        }, null, 8, ["icon-name"])
+      ]),
+      _ctx.activeFilter ? (openBlock(), createElementBlock("div", _hoisted_3$b, [
+        renderSlot(_ctx.$slots, "default"),
+        createElementVNode("ul", _hoisted_4$8, [
+          createElementVNode("li", null, [
+            createElementVNode("label", null, [
+              createElementVNode("input", {
+                checked: _ctx.isFilterMissing,
+                name: "number_filter",
+                type: "checkbox",
+                onChange: _cache[1] || (_cache[1] = ($event) => _ctx.missingFilter())
+              }, null, 40, _hoisted_5$5),
+              createTextVNode(" " + toDisplayString(_ctx.filterMissingText), 1)
+            ])
+          ]),
+          createElementVNode("li", null, [
+            createElementVNode("label", null, [
+              createElementVNode("input", {
+                checked: _ctx.isMatch,
+                name: "number_filter",
+                type: "radio",
+                onChange: _cache[2] || (_cache[2] = ($event) => _ctx.matchFilter())
+              }, null, 40, _hoisted_6$5),
+              createTextVNode(" " + toDisplayString(_ctx.matchText), 1)
+            ]),
+            createElementVNode("label", null, [
+              createElementVNode("input", {
+                checked: _ctx.isExclude,
+                name: "number_filter",
+                type: "radio",
+                onChange: _cache[3] || (_cache[3] = ($event) => _ctx.excludeFilter())
+              }, null, 40, _hoisted_7$4),
+              createTextVNode(" " + toDisplayString(_ctx.excludeText), 1)
+            ])
+          ])
+        ])
+      ])) : createCommentVNode("", true)
+    ])
+  ]);
+}
+var DhAdvancedFilter = /* @__PURE__ */ _export_sfc(_sfc_main$i, [["render", _sfc_render$5]]);
+var MultiRangeSliderBarOnly = "";
+Chart.register(plugin_tooltip, BarElement, CategoryScale, LinearScale);
+const _sfc_main$h = defineComponent({
+  components: { Bar, MultiRangeSlider, DhAdvancedFilter },
+  props: {
+    numberRange: {
+      type: Array,
+      default: () => [{ key: 1, count: 10 }]
+    },
+    width: {
+      type: Number,
+      default: 200
+    },
+    height: {
+      type: Number,
+      default: 50
+    },
+    chartId: {
+      type: String,
+      default: "bar-chart"
+    },
+    datasetIdKey: {
+      type: String,
+      default: "label"
+    },
+    steps: {
+      type: Number,
+      default: 1
+    },
+    includeForm: {
+      type: Boolean,
+      default: false
+    }
+  },
+  data() {
+    return {
+      chartData: {
+        labels: [],
+        datasets: [
+          {
+            labels: "",
+            data: [],
+            backgroundColor: ["#5ea9e5"],
+            borderRadius: 1,
+            hoverBackgroundColor: "#e0e0e0"
+          }
+        ]
+      },
+      chartOptions: {
+        responsive: true,
+        plugins: {
+          legend: {
+            display: false
+          },
+          tooltip: {
+            enabled: false
+          }
+        },
+        scales: {
+          x: {
+            display: false,
+            grid: {
+              display: false
+            },
+            ticks: {
+              display: true
+            }
+          },
+          y: {
+            display: false,
+            grid: {
+              display: false
+            },
+            ticks: {
+              display: false
+            }
+          }
+        }
+      },
+      chartLines: {},
+      min: "1",
+      max: this.maxNumber(this.numberRange),
+      rangeMax: this.numberRange.length,
+      chart_dta: [],
+      BarMinValue: 1,
+      BarMaxValue: this.numberRange.length,
+      activeFilter: false,
+      validated: false,
+      isMatch: false,
+      isExclude: false,
+      isDisable: false,
+      labels: []
+    };
+  },
+  mounted() {
+    this.isMatch = true;
+    this.setChartData(this.numberRange);
+    this.highlightChart();
+    this.labels = [this.BarMinValue, this.max];
+  },
+  methods: {
+    matchFilter() {
+      if (!this.isDisable) {
+        this.isMatch = true;
+        this.isExclude = false;
+        var data = this.chartData.datasets[0].data;
+        this.chartLines = this.chartData.datasets[0];
+        this.chartData.datasets[0].backgroundColor = [];
+        for (let i2 = 0; i2 <= data.length; i2++) {
+          if (data[i2] >= this.min && data[i2] <= this.max) {
+            this.chartData.datasets[0].backgroundColor.push("#5ea9e5");
+          } else {
+            this.chartData.datasets[0].backgroundColor.push("#e0e0e0");
+          }
+        }
+      }
+    },
+    excludeFilter() {
+      if (!this.isDisable) {
+        this.isMatch = false;
+        this.isExclude = true;
+        var data = this.chartData.datasets[0].data;
+        this.chartLines = this.chartData.datasets[0];
+        this.chartData.datasets[0].backgroundColor = [];
+        for (let i2 = 0; i2 < data.length; i2++) {
+          if (data[i2] >= this.min && data[i2] <= this.max) {
+            this.chartData.datasets[0].backgroundColor.push("#e0e0e0");
+          } else {
+            this.chartData.datasets[0].backgroundColor.push("#5ea9e5");
+          }
+        }
+      }
+    },
+    missingFilter() {
+      this.isDisable = !this.isDisable;
+      this.validated = !this.validated;
+      var data = this.chartData.datasets[0].data;
+      this.chartLines = this.chartData.datasets[0];
+      this.chartData.datasets[0].backgroundColor = [];
+      if (this.validated) {
+        for (let i2 = 1; i2 <= data.length; i2++) {
+          this.chartData.datasets[0].backgroundColor.push("#e0e0e0");
+        }
+      } else {
+        if (this.isMatch) {
+          this.matchFilter();
+        }
+        if (this.isExclude) {
+          this.excludeFilter();
+        }
+      }
+    },
+    changeMin(e2) {
+      let minValue = e2.target.value;
+      this.min = minValue ? minValue : "1";
+      this.BarMinValue = minValue ? this.getFirstIndex(parseInt(minValue)) : 1;
+      if (this.isMatch && !this.isDisable) {
+        this.matchFilter();
+      }
+      if (this.isExclude && !this.isDisable) {
+        this.excludeFilter();
+      }
+    },
+    changeMax(e2) {
+      let maxValue = e2.target.value;
+      this.BarMaxValue = maxValue && maxValue > this.maxNumber(this.numberRange) ? this.numberRange.length : this.getLastIndex(parseInt(maxValue));
+      this.max = maxValue && maxValue > this.maxNumber(this.numberRange) ? this.maxNumber(this.numberRange) : maxValue;
+      if (this.isMatch && !this.isDisable) {
+        this.matchFilter();
+      }
+      if (this.isExclude && !this.isDisable) {
+        this.excludeFilter();
+      }
+    },
+    setChartData(chart_data) {
+      chart_data = this.sortData(chart_data);
+      this.removeChartData();
+      let key = this.chartData.labels;
+      for (let j = 0; j < chart_data.length; j++) {
+        key.push(chart_data[j].key);
+        this.chart_dta.push(chart_data[j].count);
+      }
+      this.chartData.datasets[0].data = this.chart_dta;
+    },
+    highlightChart() {
+      var data = this.chartData.datasets[0].data;
+      this.chartLines = this.chartData.datasets[0];
+      this.chartData.datasets[0].backgroundColor = [];
+      for (let i2 = 0; i2 <= data.length; i2++) {
+        if (data[i2] >= this.min && data[i2] <= this.max) {
+          this.chartData.datasets[0].backgroundColor.push("#5ea9e5");
+        } else {
+          this.chartData.datasets[0].backgroundColor.push("#e0e0e0");
+        }
+      }
+    },
+    updateBarChart(e2) {
+      const { minValue, maxValue } = e2;
+      this.BarMinValue = minValue;
+      this.BarMaxValue = maxValue;
+      var data = this.chartData.datasets[0].data;
+      this.min = data[this.BarMinValue] ? data[this.BarMinValue] : "1";
+      this.max = data[this.BarMaxValue] ? data[this.BarMaxValue] : this.max;
+      if (this.isMatch && !this.isDisable) {
+        this.matchFilter();
+      }
+      if (this.isExclude && !this.isDisable) {
+        this.excludeFilter();
+      }
+    },
+    toggleFilter() {
+      this.activeFilter = !this.activeFilter;
+    },
+    removeChartData() {
+      this.chartData.labels = [];
+      this.chartData.datasets[0].data = [];
+      this.chart_dta = [];
+    },
+    sortData(arr) {
+      return arr.slice().sort(function(a3, b2) {
+        return a3.count - b2.count;
+      });
+    },
+    maxNumber(arr) {
+      if (arr.length == 0)
+        return;
+      return arr.reduce((acc, shot) => acc = acc > shot.count ? acc : shot.count, 0);
+    },
+    getLastIndex(index) {
+      let data = this.chartData.datasets[0].data;
+      let indexVal = 0;
+      for (let i2 = index; i2 >= 0; i2--) {
+        if (data.lastIndexOf(i2) !== -1) {
+          indexVal = data.lastIndexOf(i2);
+          break;
+        } else {
+          continue;
+        }
+      }
+      return indexVal;
+    },
+    getFirstIndex(index) {
+      let data = this.chartData.datasets[0].data;
+      let indexVal = 0;
+      for (let i2 = index; i2 <= this.max; i2++) {
+        if (data.lastIndexOf(i2) !== -1) {
+          indexVal = data.lastIndexOf(i2);
+          break;
+        } else {
+          continue;
+        }
+      }
+      return indexVal;
+    }
+  }
+});
+const _hoisted_1$h = { class: "dh-range-container" };
+const _hoisted_2$f = { class: "bar-chart" };
+const _hoisted_3$a = {
+  key: 0,
+  class: "input-group-section"
+};
+const _hoisted_4$7 = { class: "input-group sb-input" };
+const _hoisted_5$4 = ["disabled", "max", "value"];
+const _hoisted_6$4 = { class: "input-group sb-input" };
+const _hoisted_7$3 = ["disabled", "max", "min", "value"];
+function _sfc_render$4(_ctx, _cache, $props, $setup, $data, $options) {
+  const _component_Bar = resolveComponent("Bar");
+  const _component_MultiRangeSlider = resolveComponent("MultiRangeSlider");
+  const _component_dh_advanced_filter = resolveComponent("dh-advanced-filter");
+  return openBlock(), createElementBlock("div", _hoisted_1$h, [
+    createElementVNode("div", _hoisted_2$f, [
+      createVNode(_component_Bar, {
+        "chart-data": _ctx.chartData,
+        "chart-id": _ctx.chartId,
+        "chart-options": _ctx.chartOptions,
+        "dataset-id-key": _ctx.datasetIdKey,
+        height: _ctx.height,
+        width: _ctx.width
+      }, null, 8, ["chart-data", "chart-id", "chart-options", "dataset-id-key", "height", "width"]),
+      createVNode(_component_MultiRangeSlider, {
+        "base-class-name": `multi-range-slider range-slider ${_ctx.isDisable}`,
+        label: true,
+        labels: _ctx.labels,
+        max: _ctx.rangeMax,
+        "max-caption": `${_ctx.max}`,
+        "max-value": _ctx.BarMaxValue,
+        min: 1,
+        "min-caption": `${_ctx.min}`,
+        "min-value": _ctx.BarMinValue,
+        "range-margin": 0,
+        ruler: false,
+        step: _ctx.steps,
+        onInput: _ctx.updateBarChart
+      }, null, 8, ["base-class-name", "labels", "max", "max-caption", "max-value", "min-caption", "min-value", "step", "onInput"])
+    ]),
+    _ctx.includeForm ? (openBlock(), createElementBlock("div", _hoisted_3$a, [
+      createElementVNode("div", _hoisted_4$7, [
+        createElementVNode("label", {
+          class: normalizeClass(`text-2 input-to ${_ctx.validated ? "disable" : ""}`)
+        }, " From ", 2),
+        createElementVNode("input", {
+          class: "form-input text",
+          disabled: _ctx.validated ? true : false,
+          max: `${_ctx.max}`,
+          min: "1",
+          placeholder: "From",
+          type: "number",
+          value: `${_ctx.min}`,
+          onInput: _cache[0] || (_cache[0] = ($event) => _ctx.changeMin($event))
+        }, null, 40, _hoisted_5$4)
+      ]),
+      createElementVNode("div", _hoisted_6$4, [
+        createElementVNode("label", {
+          class: normalizeClass(`text-2 input-to ${_ctx.validated ? "disable" : ""}`)
+        }, " To ", 2),
+        createElementVNode("input", {
+          class: "form-input text",
+          disabled: _ctx.validated ? true : false,
+          max: `${_ctx.maxNumber(_ctx.numberRange)}`,
+          min: `${_ctx.min}`,
+          placeholder: "To",
+          type: "number",
+          value: `${_ctx.max}`,
+          onInput: _cache[1] || (_cache[1] = ($event) => _ctx.changeMax($event))
+        }, null, 40, _hoisted_7$3)
+      ])
+    ])) : createCommentVNode("", true),
+    renderSlot(_ctx.$slots, "input"),
+    createVNode(_component_dh_advanced_filter, {
+      onExclude: _ctx.excludeFilter,
+      onFilter_missing: _ctx.missingFilter,
+      onMatch: _ctx.matchFilter
+    }, {
+      default: withCtx(() => [
+        renderSlot(_ctx.$slots, "filter")
+      ]),
+      _: 3
+    }, 8, ["onExclude", "onFilter_missing", "onMatch"])
+  ]);
+}
+var DhNumberRange = /* @__PURE__ */ _export_sfc(_sfc_main$h, [["render", _sfc_render$4]]);
+var main = "";
+var AdvancedDatePicker_vue_vue_type_style_index_0_lang = "";
+const _hoisted_1$g = { id: "dp-container" };
+const _hoisted_2$e = /* @__PURE__ */ createElementVNode("div", { class: "dp__calendar_range" }, [
+  /* @__PURE__ */ createElementVNode("p", null, "From"),
+  /* @__PURE__ */ createElementVNode("p", null, "To")
+], -1);
+const _hoisted_3$9 = { class: "dp__multi" };
+const _hoisted_4$6 = ["value"];
+const _hoisted_5$3 = ["value"];
+const _hoisted_6$3 = /* @__PURE__ */ createTextVNode(" Back ");
+const _hoisted_7$2 = ["onClick"];
+const _hoisted_8$2 = ["onClick"];
+const _hoisted_9$2 = ["onClick"];
+const _hoisted_10$2 = ["onClick"];
+const _hoisted_11$2 = ["onClick"];
+const _hoisted_12$2 = ["onClick"];
+const _hoisted_13$2 = ["onClick"];
+const _hoisted_14$2 = ["onClick"];
+const _hoisted_15$2 = /* @__PURE__ */ createElementVNode("div", {
+  id: "tags",
+  class: "dp__calendar_tags"
+}, null, -1);
+const _sfc_main$g = {
+  __name: "AdvancedDatePicker",
+  props: {
+    numberRange: {
+      type: Array,
+      required: true
     }
-    addedDatasets.push(currentDataset);
-    Object.assign(currentDataset, nextDataset);
-    return currentDataset;
-  });
-}
-function setChartLabels(chart, labels, context) {
-  chart.data.labels = labels;
-  if (context !== void 0) {
-    context.emit(ChartEmits.LabelsUpdated);
-  }
-}
-function setChartOptions(chart, options) {
-  chart.options = {
-    ...options
-  };
-}
-function compareData(newData, oldData) {
-  const newDatasetLabels = newData.datasets.map((dataset) => {
-    return dataset.label;
-  });
-  const oldDatasetLabels = oldData.datasets.map((dataset) => {
-    return dataset.label;
-  });
-  return oldData.datasets.length === newData.datasets.length && newDatasetLabels.every((value, index) => value === oldDatasetLabels[index]);
-}
-const templateError = "Please remove the <template></template> tags from your chart component. See https://vue-chartjs.org/guide/#vue-single-file-components";
-const chartUpdateError = "Update ERROR: chart instance not found";
-const generateChart = (chartId, chartType, chartController) => {
-  return defineComponent({
-    props: {
-      chartData: {
-        type: Object,
-        required: true
-      },
-      chartOptions: {
-        type: Object,
-        default: () => {
-        }
+  },
+  emits: ["update"],
+  setup(__props, { emit }) {
+    const date = ref(["", ""]);
+    const maxDate = ref(null);
+    const minDate = ref(null);
+    const datePicker = ref(null);
+    const time = ref(false);
+    const presetRanges = ref([
+      { label: "Today", range: [new Date(), new Date()], slot: "today" },
+      {
+        label: "Previous week",
+        range: [
+          previousSunday(previousSaturday(new Date())),
+          previousSaturday(new Date())
+        ],
+        slot: "previousWeek"
       },
-      datasetIdKey: {
-        type: String,
-        default: "label"
+      {
+        label: "This week",
+        range: [previousSunday(new Date()), lastDayOfWeek(new Date())],
+        slot: "week"
       },
-      chartId: {
-        type: String,
-        default: chartId
+      {
+        label: "Next week",
+        range: [
+          nextSunday(new Date()),
+          nextSaturday(new Date().setDate(new Date().getDate() + 7))
+        ],
+        slot: "nextWeek"
       },
-      width: {
-        type: Number,
-        default: 400
+      {
+        label: "This month",
+        range: [startOfMonth(new Date()), endOfMonth(new Date())],
+        slot: "currentMonth"
       },
-      height: {
-        type: Number,
-        default: 400
+      {
+        label: "Previous month",
+        range: [
+          startOfMonth(subMonths(new Date(), 1)),
+          endOfMonth(subMonths(new Date(), 1))
+        ],
+        slot: "previousMonth"
       },
-      cssClasses: {
-        type: String,
-        default: ""
+      {
+        label: "Last 3 months",
+        range: [
+          startOfMonth(subMonths(new Date(), 3)),
+          endOfMonth(subMonths(new Date(), 1))
+        ],
+        slot: "threeMonths"
       },
-      styles: {
-        type: Object,
-        default: () => {
-        }
+      {
+        label: "Last 6 months",
+        range: [
+          startOfMonth(subMonths(new Date(), 6)),
+          endOfMonth(subMonths(new Date(), 1))
+        ],
+        slot: "sixMonths"
       },
-      plugins: {
-        type: Array,
-        default: () => []
-      }
-    },
-    setup(props, context) {
-      Chart.register(chartController);
-      const _chart = shallowRef(null);
-      const canvasEl = ref(null);
-      function renderChart(data, options) {
-        if (_chart.value !== null) {
-          chartDestroy(toRaw(_chart.value), context);
-        }
-        if (canvasEl.value === null) {
-          throw new Error(templateError);
-        } else {
-          const chartData = getChartData(data, props.datasetIdKey);
-          const canvasEl2DContext = canvasEl.value.getContext("2d");
-          if (canvasEl2DContext !== null) {
-            _chart.value = new Chart(canvasEl2DContext, {
-              type: chartType,
-              data: isProxy(data) ? new Proxy(chartData, {}) : chartData,
-              options,
-              plugins: props.plugins
-            });
-          }
-        }
-      }
-      function chartDataHandler(newValue, oldValue) {
-        const newData = isProxy(newValue) ? toRaw(newValue) : {
-          ...newValue
-        };
-        const oldData = isProxy(oldValue) ? toRaw(oldValue) : {
-          ...oldValue
-        };
-        if (Object.keys(oldData).length > 0) {
-          const chart = toRaw(_chart.value);
-          const isEqualLabelsAndDatasetsLength = compareData(newData, oldData);
-          if (isEqualLabelsAndDatasetsLength && chart !== null) {
-            setChartDatasets(chart === null || chart === void 0 ? void 0 : chart.data, newData, props.datasetIdKey);
-            if (newData.labels !== void 0) {
-              setChartLabels(chart, newData.labels, context);
-            }
-            updateChart();
-          } else {
-            if (chart !== null) {
-              chartDestroy(chart, context);
-            }
-            chartCreate(renderChart, props.chartData, props.chartOptions, context);
-          }
-        } else {
-          if (_chart.value !== null) {
-            chartDestroy(toRaw(_chart.value), context);
-          }
-          chartCreate(renderChart, props.chartData, props.chartOptions, context);
-        }
-      }
-      function chartOptionsHandler(options) {
-        const chart = toRaw(_chart.value);
-        if (chart !== null) {
-          setChartOptions(chart, options);
-          updateChart();
-        } else {
-          chartCreate(renderChart, props.chartData, props.chartOptions, context);
-        }
-      }
-      function updateChart() {
-        const chart = toRaw(_chart.value);
-        if (chart !== null) {
-          chartUpdate(chart, context);
-        } else {
-          console.error(chartUpdateError);
-        }
+      {
+        label: "Last year",
+        range: [startOfYear(new Date()), endOfYear(new Date())],
+        slot: "yearly"
       }
-      watch(() => props.chartData, (newValue, oldValue) => chartDataHandler(newValue, oldValue), {
-        deep: true
-      });
-      watch(() => props.chartOptions, (newValue) => chartOptionsHandler(newValue), {
-        deep: true
-      });
-      onMounted(() => {
-        if ("datasets" in props.chartData && props.chartData.datasets.length > 0) {
-          chartCreate(renderChart, props.chartData, props.chartOptions, context);
-        }
-      });
-      onBeforeUnmount(() => {
-        if (_chart.value !== null) {
-          chartDestroy(toRaw(_chart.value), context);
-        }
-      });
-      context.expose({
-        chart: _chart,
-        updateChart
-      });
-      return () => h("div", {
-        style: props.styles,
-        class: props.cssClasses
-      }, [
-        h("canvas", {
-          id: props.chartId,
-          width: props.width,
-          height: props.height,
-          ref: canvasEl
-        })
+    ]);
+    const handleDate = (modelData) => {
+      date.value = modelData;
+      console.log(date.value);
+      emit("update", date.value);
+    };
+    function changeFirstDate(e2) {
+      minDate.value = e2.target.value;
+      date.value = [e2.target.value, maxDate.value];
+    }
+    function changeSecondDate(e2) {
+      maxDate.value = e2.target.value;
+      date.value = [minDate.value, e2.target.value];
+    }
+    onMounted(() => {
+      datePicker.value.openMenu();
+    });
+    function reOpen() {
+      datePicker.value.openMenu();
+    }
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", _hoisted_1$g, [
+        _hoisted_2$e,
+        createVNode(unref(ca), {
+          ref_key: "datePicker",
+          ref: datePicker,
+          modelValue: date.value,
+          "onUpdate:modelValue": [
+            _cache[2] || (_cache[2] = ($event) => date.value = $event),
+            handleDate
+          ],
+          "auto-apply": "",
+          "day-names": ["Mon", "Tue", "Wed", "Thu", "Fri", "Sat", "Sun"],
+          "enable-time-picker": false,
+          "multi-calendars": "",
+          "multi-calendars-solo": "",
+          "multi-static": false,
+          offset: 12,
+          position: "left",
+          "preset-ranges": presetRanges.value,
+          range: "",
+          "select-text": "Apply",
+          "text-input": "",
+          uid: "advanced",
+          onClosed: reOpen
+        }, {
+          "dp-input": withCtx(() => [
+            createElementVNode("div", _hoisted_3$9, [
+              createElementVNode("input", {
+                class: "dp__input dp__multi_input",
+                placeholder: "MM/DD/YYYY",
+                type: "text",
+                value: minDate.value ? minDate.value : date.value[0],
+                onInput: _cache[0] || (_cache[0] = ($event) => changeFirstDate($event))
+              }, null, 40, _hoisted_4$6),
+              createElementVNode("input", {
+                class: "dp__input dp__multi_input",
+                placeholder: "MM/DD/YYYY",
+                type: "text",
+                value: maxDate.value ? maxDate.value : date.value[1],
+                onInput: _cache[1] || (_cache[1] = ($event) => changeSecondDate($event))
+              }, null, 40, _hoisted_5$3)
+            ])
+          ]),
+          "arrow-left": withCtx(() => [
+            createVNode(DhIcon, {
+              "icon-name": "previous",
+              size: 20
+            })
+          ]),
+          "arrow-right": withCtx(() => [
+            createVNode(DhIcon, {
+              "icon-name": "next",
+              size: 20
+            })
+          ]),
+          "calendar-icon": withCtx(() => [
+            _hoisted_6$3
+          ]),
+          "clear-icon": withCtx(() => []),
+          "action-preview": withCtx(() => []),
+          "action-select": withCtx(() => []),
+          previousWeek: withCtx(({ label, range, presetDateRange }) => [
+            (openBlock(), createBlock(Teleport, { to: "#tags" }, [
+              createElementVNode("span", {
+                onClick: ($event) => presetDateRange(range)
+              }, toDisplayString(label), 9, _hoisted_7$2)
+            ]))
+          ]),
+          week: withCtx(({ label, range, presetDateRange }) => [
+            (openBlock(), createBlock(Teleport, { to: "#tags" }, [
+              createElementVNode("span", {
+                onClick: ($event) => presetDateRange(range)
+              }, toDisplayString(label), 9, _hoisted_8$2)
+            ]))
+          ]),
+          nextWeek: withCtx(({ label, range, presetDateRange }) => [
+            (openBlock(), createBlock(Teleport, { to: "#tags" }, [
+              createElementVNode("span", {
+                onClick: ($event) => presetDateRange(range)
+              }, toDisplayString(label), 9, _hoisted_9$2)
+            ]))
+          ]),
+          currentMonth: withCtx(({ label, range, presetDateRange }) => [
+            (openBlock(), createBlock(Teleport, { to: "#tags" }, [
+              createElementVNode("span", {
+                onClick: ($event) => presetDateRange(range)
+              }, toDisplayString(label), 9, _hoisted_10$2)
+            ]))
+          ]),
+          previousMonth: withCtx(({ label, range, presetDateRange }) => [
+            (openBlock(), createBlock(Teleport, { to: "#tags" }, [
+              createElementVNode("span", {
+                onClick: ($event) => presetDateRange(range)
+              }, toDisplayString(label), 9, _hoisted_11$2)
+            ]))
+          ]),
+          threeMonths: withCtx(({ label, range, presetDateRange }) => [
+            (openBlock(), createBlock(Teleport, { to: "#tags" }, [
+              createElementVNode("span", {
+                onClick: ($event) => presetDateRange(range)
+              }, toDisplayString(label), 9, _hoisted_12$2)
+            ]))
+          ]),
+          sixMonths: withCtx(({ label, range, presetDateRange }) => [
+            (openBlock(), createBlock(Teleport, { to: "#tags" }, [
+              createElementVNode("span", {
+                onClick: ($event) => presetDateRange(range)
+              }, toDisplayString(label), 9, _hoisted_13$2)
+            ]))
+          ]),
+          yearly: withCtx(({ label, range, presetDateRange }) => [
+            (openBlock(), createBlock(Teleport, { to: "#tags" }, [
+              createElementVNode("span", {
+                onClick: ($event) => presetDateRange(range)
+              }, toDisplayString(label), 9, _hoisted_14$2)
+            ]))
+          ]),
+          _: 1
+        }, 8, ["modelValue", "preset-ranges"]),
+        createVNode(DhNumberRange, {
+          class: "dp__calendar_range_number",
+          "number-range": __props.numberRange,
+          steps: 1
+        }, {
+          input: withCtx(() => [
+            _hoisted_15$2
+          ]),
+          filter: withCtx(() => [
+            createVNode(DhSwitch, {
+              data: time.value,
+              label: "Include time",
+              onChange: _cache[3] || (_cache[3] = (val) => time.value = val)
+            }, null, 8, ["data"])
+          ]),
+          _: 1
+        }, 8, ["number-range"])
       ]);
-    }
-  });
+    };
+  }
 };
-const Bar = /* @__PURE__ */ generateChart("bar-chart", "bar", BarController);
-var MultiRangeSlider_vue_vue_type_style_index_0_lang = "";
-const _sfc_main$d = {
-  name: "MultiRangeSlider",
+var DatePicker_vue_vue_type_style_index_0_lang = "";
+const _hoisted_1$f = /* @__PURE__ */ createTextVNode(" Back ");
+const _hoisted_2$d = /* @__PURE__ */ createElementVNode("div", null, "today", -1);
+const _sfc_main$f = {
+  __name: "DatePicker",
   props: {
-    baseClassName: {
-      type: String,
-      default: "multi-range-slider"
-    },
-    min: { type: Number },
-    max: { type: Number },
-    minValue: { type: Number },
-    maxValue: { type: Number },
-    step: { type: Number, default: 1 },
-    preventWheel: { type: Boolean, default: false },
-    ruler: { type: Boolean, default: true },
-    label: { type: Boolean, default: true },
-    labels: { type: Array },
-    minCaption: { type: String },
-    maxCaption: { type: String },
-    rangeMargin: { type: Number }
-  },
-  data() {
-    let _labels = this.labels || [];
-    let _minimum = this.min === void 0 ? 0 : this.min;
-    let max = _labels.length ? _labels.length - 1 : 100;
-    let _maximum = this.max === void 0 ? max : this.max;
-    let _minValue = this.minValue === void 0 ? 25 : this.minValue;
-    if (_labels.length && this.minValue === void 0) {
-      _minValue = 1;
-    }
-    let _maxValue = this.maxValue || 75;
-    if (_labels.length && this.maxValue === void 0) {
-      _maxValue = _labels.length - 2;
-    }
-    if (_maximum <= _minimum) {
-      throw new Error("Invalid props min or max");
-    }
-    if (_minValue > _maxValue) {
-      throw new Error("Invalid props minValue or maxValue");
+    inline: {
+      type: Boolean,
+      default: true
     }
-    let _rangeMargin = this.rangeMargin === void 0 ? this.step : this.rangeMargin;
-    let m3 = _rangeMargin % this.step;
-    m3 && (_rangeMargin = _rangeMargin + this.step - m3);
-    return {
-      valueMin: _minValue < _minimum ? _minimum : _minValue,
-      valueMax: _maxValue > _maximum ? _maximum : _maxValue,
-      interVal: null,
-      startX: null,
-      mouseMoveCounter: null,
-      barBox: null,
-      barValue: 0,
-      rangeMarginValue: _rangeMargin
-    };
   },
-  methods: {
-    onBarLeftClick() {
-      if (this.valueMin - this.step >= this.minimum) {
-        this.valueMin -= this.step;
-      } else {
-        this.valueMin = this.minimum;
-      }
-    },
-    onInnerBarLeftClick() {
-      if (this.valueMin + this.rangeMarginValue < this.valueMax) {
-        this.valueMin += this.step;
-      }
-    },
-    onBarRightClick() {
-      if (this.valueMax + this.step <= this.maximum) {
-        this.valueMax += this.step;
-      } else {
-        this.valueMax = this.maximum;
-      }
-    },
-    onInnerBarRightClick() {
-      if (this.valueMax - this.rangeMarginValue > this.valueMin) {
-        this.valueMax -= this.step;
-      }
-    },
-    onInputMinChange(e2) {
-      let val = parseFloat(e2.target.value);
-      if (val <= this.valueMax - this.rangeMarginValue && val >= this.minimum) {
-        this.valueMin = val;
-      } else {
-        e2.target.value = this.valueMin;
-      }
-    },
-    onInputMaxChange(e2) {
-      let val = parseFloat(e2.target.value);
-      if (val >= this.valueMin + this.rangeMarginValue && val <= this.maximum) {
-        this.valueMax = val;
-      } else {
-        e2.target.value = this.valueMax;
-      }
-    },
-    onLeftThumbMousedown(e2) {
-      e2.preventDefault();
-      this.startX = e2.clientX;
-      if (e2.type === "touchstart") {
-        if (e2.touches.length === 1) {
-          this.startX = e2.touches[0].clientX;
-        } else {
-          return;
-        }
-      }
-      this.mouseMoveCounter = 0;
-      this.barValue = this.valueMin;
-      this.barBox = e2.target.parentNode.getBoundingClientRect();
-      document.addEventListener("mousemove", this.onLeftThumbMousemove);
-      document.addEventListener("mouseup", this.onLeftThumbMouseup);
-      document.addEventListener("touchmove", this.onLeftThumbMousemove);
-      document.addEventListener("touchend", this.onLeftThumbMouseup);
-    },
-    onLeftThumbMousemove(e2) {
-      this.mouseMoveCounter++;
-      let clientX = e2.clientX;
-      if (e2.type === "touchmove") {
-        clientX = e2.touches[0].clientX;
-      }
-      let dx = clientX - this.startX;
-      let per = dx / this.barBox.width;
-      let val = this.barValue + (this.maximum - this.minimum) * per;
-      let mod = val % this.step;
-      val -= mod;
-      if (val < this.minimum) {
-        val = this.minimum;
-      } else if (val > this.valueMax - this.rangeMarginValue) {
-        val = this.valueMax - this.rangeMarginValue;
+  emits: ["update"],
+  setup(__props, { emit }) {
+    const date = ref();
+    const datePicker = ref(null);
+    const handleDate = (modelData) => {
+      date.value = modelData;
+      emit("update", date.value);
+    };
+    const markers = ref([
+      {
+        date: addDays(new Date(), 0),
+        type: "dot",
+        tooltip: [{ text: "Dot with tooltip", color: "blue" }]
       }
-      this.valueMin = val;
-    },
-    onLeftThumbMouseup() {
-      document.removeEventListener("mousemove", this.onLeftThumbMousemove);
-      document.removeEventListener("mouseup", this.onLeftThumbMouseup);
-      document.removeEventListener("touchmove", this.onLeftThumbMousemove);
-      document.removeEventListener("touchend", this.onLeftThumbMouseup);
+    ]);
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", null, [
+        createVNode(unref(ca), {
+          ref_key: "datePicker",
+          ref: datePicker,
+          modelValue: date.value,
+          "onUpdate:modelValue": [
+            _cache[0] || (_cache[0] = ($event) => date.value = $event),
+            handleDate
+          ],
+          "day-names": ["Mon", "Tue", "Wed", "Thu", "Fri", "Sat", "Sun"],
+          "enable-time-picker": false,
+          inline: __props.inline,
+          markers: markers.value,
+          "month-name-format": "short",
+          offset: 12,
+          placeholder: "MM/DD/YYYY",
+          "select-text": "Apply",
+          "text-input": "",
+          uid: "base"
+        }, {
+          "arrow-left": withCtx(() => [
+            createVNode(DhIcon, {
+              "icon-name": "previous",
+              size: 20
+            })
+          ]),
+          "arrow-right": withCtx(() => [
+            createVNode(DhIcon, {
+              "icon-name": "next",
+              size: 20
+            })
+          ]),
+          "calendar-icon": withCtx(() => [
+            _hoisted_1$f
+          ]),
+          "clear-icon": withCtx(() => []),
+          "action-preview": withCtx(() => []),
+          "marker-tooltip": withCtx(() => [
+            _hoisted_2$d
+          ]),
+          _: 1
+        }, 8, ["modelValue", "inline", "markers"])
+      ]);
+    };
+  }
+};
+var Error_vue_vue_type_style_index_0_lang = "";
+const _hoisted_1$e = {
+  key: 0,
+  class: "invalid-feedback"
+};
+const _sfc_main$e = /* @__PURE__ */ defineComponent({
+  __name: "Error",
+  props: {
+    errors: {
+      type: Object,
+      required: false,
+      default: void 0
+    }
+  },
+  setup(__props) {
+    const props = __props;
+    return (_ctx, _cache) => {
+      var _a;
+      return unref(props).errors && ((_a = unref(props).errors) == null ? void 0 : _a.length) > 0 ? (openBlock(), createElementBlock("div", _hoisted_1$e, [
+        (openBlock(true), createElementBlock(Fragment, null, renderList(__props.errors, (error) => {
+          return openBlock(), createElementBlock("span", { key: error }, toDisplayString(error), 1);
+        }), 128))
+      ])) : createCommentVNode("", true);
+    };
+  }
+});
+var FileUpload_vue_vue_type_style_index_0_lang = "";
+const _hoisted_1$d = /* @__PURE__ */ createElementVNode("label", { for: "upload_pdf" }, [
+  /* @__PURE__ */ createTextVNode(" Drag and drop file or "),
+  /* @__PURE__ */ createElementVNode("span", { id: "upload" }, "browse")
+], -1);
+const _hoisted_2$c = {
+  key: 1,
+  class: "file__upload_items"
+};
+const _hoisted_3$8 = { class: "file__upload_list_item" };
+const _hoisted_4$5 = { class: "file__upload_list_item_label" };
+const _hoisted_5$2 = ["title"];
+const _hoisted_6$2 = {
+  key: 0,
+  class: "label__antivirus"
+};
+const _hoisted_7$1 = {
+  key: 1,
+  class: "label__antivirus label__antivirus--failed"
+};
+const _hoisted_8$1 = {
+  key: 2,
+  class: "label__antivirus label__antivirus--detected"
+};
+const _hoisted_9$1 = /* @__PURE__ */ createElementVNode("br", null, null, -1);
+const _hoisted_10$1 = { key: 3 };
+const _hoisted_11$1 = { key: 4 };
+const _hoisted_12$1 = { key: 0 };
+const _hoisted_13$1 = ["value"];
+const _hoisted_14$1 = ["href"];
+const _hoisted_15$1 = {
+  key: 2,
+  class: "file__upload_placeholder"
+};
+const _hoisted_16$1 = {
+  key: 3,
+  class: "file__upload_action"
+};
+const _hoisted_17$1 = /* @__PURE__ */ createElementVNode("button", { class: "file__upload_action_cancel" }, "Cancel", -1);
+const _sfc_main$d = {
+  __name: "FileUpload",
+  props: {
+    uploadProgress: {
+      type: Array,
+      required: true
     },
-    onRightThumbMousedown(e2) {
-      e2.preventDefault();
-      this.startX = e2.clientX;
-      if (e2.type === "touchstart") {
-        if (e2.touches.length === 1) {
-          this.startX = e2.touches[0].clientX;
-        } else {
-          return;
-        }
-      }
-      this.mouseMoveCounter = 0;
-      this.barValue = this.valueMax;
-      this.barBox = e2.target.parentNode.getBoundingClientRect();
-      document.addEventListener("mousemove", this.onRightThumbMousemove);
-      document.addEventListener("mouseup", this.onRightThumbMouseup);
-      document.addEventListener("touchmove", this.onRightThumbMousemove);
-      document.addEventListener("touchend", this.onRightThumbMouseup);
+    modelValue: {
+      type: FileList,
+      required: true
     },
-    onRightThumbMousemove(e2) {
-      this.mouseMoveCounter++;
-      let clientX = e2.clientX;
-      if (e2.type === "touchmove") {
-        clientX = e2.touches[0].clientX;
-      }
-      let dx = clientX - this.startX;
-      let per = dx / this.barBox.width;
-      let val = this.barValue + (this.maximum - this.minimum) * per;
-      let mod = val % this.step;
-      val -= mod;
-      if (val < this.valueMin + this.rangeMarginValue) {
-        val = this.valueMin + this.rangeMarginValue;
-      } else if (val > this.maximum) {
-        val = this.maximum;
-      }
-      this.valueMax = val;
+    inline: {
+      type: Boolean,
+      default: false
     },
-    onRightThumbMouseup() {
-      document.removeEventListener("mousemove", this.onRightThumbMousemove);
-      document.removeEventListener("mouseup", this.onRightThumbMouseup);
-      document.removeEventListener("touchmove", this.onRightThumbMousemove);
-      document.removeEventListener("touchend", this.onRightThumbMouseup);
+    errorOccured: {
+      type: Array,
+      required: true
     },
-    onMouseWheel(e2) {
-      if (this.preventWheel === true) {
-        return;
-      }
-      if (!e2.shiftKey && !e2.ctrlKey) {
-        return;
-      }
-      let val = this.step;
-      if (e2.deltaY < 0) {
-        val = -val;
-      }
-      if (e2.shiftKey && e2.ctrlKey) {
-        if (this.valueMin + val >= this.minimum && this.valueMax + val <= this.maximum) {
-          this.valueMin = this.valueMin + val;
-          this.valueMax = this.valueMax + val;
-        }
-      } else if (e2.ctrlKey) {
-        val = this.valueMax + val;
-        if (val < this.valueMin + this.rangeMarginValue) {
-          val = this.valueMin + this.rangeMarginValue;
-        } else if (val > this.maximum) {
-          val = this.maximum;
-        }
-        this.valueMax = val;
-      } else if (e2.shiftKey) {
-        val = this.valueMin + val;
-        if (val < this.minimum) {
-          val = this.minimum;
-        } else if (val > this.valueMax - this.rangeMarginValue) {
-          val = this.valueMax - this.rangeMarginValue;
-        }
-        this.valueMin = val;
-      }
+    errorMessage: {
+      type: String,
+      default: "an error occured while uploading"
     },
-    triggerInput() {
-      let fixed = 0;
-      if (this.step.toString().includes(".")) {
-        fixed = 2;
-      }
-      let retObj = {
-        min: this.minimum,
-        max: this.maximum,
-        minValue: parseFloat(this.valueMin.toFixed(fixed)),
-        maxValue: parseFloat(this.valueMax.toFixed(fixed))
-      };
-      this.$emit("input", retObj);
-    }
-  },
-  computed: {
-    minimum() {
-      return this.min === void 0 ? 0 : this.min;
+    fileSaved: {
+      type: Boolean,
+      default: false
     },
-    maximum() {
-      let _labels = this.labels || [];
-      let max = _labels.length ? _labels.length - 1 : 100;
-      return this.max === void 0 ? max : this.max;
+    virusCheck: {
+      type: Array,
+      required: true
     },
-    stepCount() {
-      let _labels = this.labels || [];
-      if (_labels.length) {
-        return _labels.length - 1;
-      }
-      return Math.floor((this.maximum - this.minimum) / this.step);
+    virusCheckText: {
+      type: String,
+      default: "Antivirus check ..."
     },
-    subStepCount() {
-      let _labels = this.labels || [];
-      if (_labels.length && this.step > 1) {
-        return (this.maximum - this.minimum) / this.step;
-      }
-      return 0;
+    virusCheckFailedText: {
+      type: String,
+      default: "Antivirus check failed"
     },
-    barMin() {
-      let per = (this.valueMin - this.minimum) / (this.maximum - this.minimum) * 100;
-      return per;
+    virusDetectedText: {
+      type: String,
+      default: "Virus detected"
     },
-    barMax() {
-      let per = 100 - (this.valueMax - this.minimum) / (this.maximum - this.minimum) * 100;
-      return per;
+    deleteConfirmationText: {
+      type: String,
+      default: "Are you sure you want to delete it permanently? this action will be irreversible"
     },
-    barMinVal() {
-      let fixed = 0;
-      if (this.step.toString().includes(".")) {
-        fixed = 2;
+    zIndex: {
+      type: Number,
+      default: 99
+    }
+  },
+  emits: ["update:modelValue", "save:modelValue", "reload"],
+  setup(__props, { emit }) {
+    const props = __props;
+    const upload = ref(null);
+    const fileSelected = ref(false);
+    const files = ref([]);
+    const standardFormats = ref([
+      ".pdf",
+      ".csv",
+      ".doc",
+      ".jpeg",
+      ".mp4",
+      ".png",
+      ".txt",
+      ".xls"
+    ]);
+    function formatBytes(bytes, decimals = 2) {
+      if (!+bytes)
+        return "0 Bytes";
+      const k2 = 1024;
+      const dm = decimals < 0 ? 0 : decimals;
+      const sizes = ["Bytes", "KB", "MB", "GB", "TB", "PB", "EB", "ZB", "YB"];
+      const i2 = Math.floor(Math.log(bytes) / Math.log(k2));
+      return `${parseFloat((bytes / Math.pow(k2, i2)).toFixed(dm))} ${sizes[i2]}`;
+    }
+    function iconName(x2) {
+      return standardFormats.value.includes(getExtension(x2)) ? getExtension(x2).slice(1) : "unknown";
+    }
+    function getName(n) {
+      const index = n.lastIndexOf(".");
+      let str = n.slice(0, index);
+      return str.length <= 15 ? str : str.slice(0, 15) + `... `;
+    }
+    function getExtension(s3) {
+      return s3.replace(/.*(?=\.)/g, "");
+    }
+    function uploadFile(e2) {
+      e2.stopPropagation();
+      files.value = upload.value.files;
+      if (files.value) {
+        fileSelected.value = true;
       }
-      return (this.valueMin || 0).toFixed(fixed);
-    },
-    barMaxVal() {
-      let fixed = 0;
-      if (this.step.toString().includes(".")) {
-        fixed = 2;
+      emit("update:modelValue", files.value);
+    }
+    function dragFile(e2) {
+      e2.stopPropagation();
+      e2.dataTransfer.dropEffect = "copy";
+    }
+    function dropFile(e2) {
+      e2.stopPropagation();
+      fileSelected.value = true;
+      files.value = e2.dataTransfer.files;
+      emit("update:modelValue", files.value);
+    }
+    function deleteFile(index) {
+      if (window.confirm(props.deleteConfirmationText)) {
+        removeFile(index);
       }
-      return (this.valueMax || 100).toFixed(fixed);
-    },
-    scaleLabels() {
-      let _labels = this.labels || [];
-      if (_labels.length === 0) {
-        _labels = [];
-        _labels.push(this.minimum);
-        _labels.push(this.maximum);
+    }
+    function removeFile(index) {
+      const dt = new DataTransfer();
+      for (let i2 = 0; i2 < files.value.length; i2++) {
+        const file = files.value[i2];
+        if (index !== i2)
+          dt.items.add(file);
+      }
+      files.value = dt.files;
+      if (files.value.length == 0) {
+        fileSelected.value = false;
       }
-      return _labels;
     }
-  },
-  watch: {
-    valueMin() {
-      this.triggerInput();
-    },
-    valueMax() {
-      this.triggerInput();
-    },
-    minValue(newValue) {
-      this.valueMin = newValue < this.minimum ? this.minimum : newValue;
-    },
-    maxValue(newValue) {
-      this.valueMax = newValue > this.maximum ? this.maximum : newValue;
+    function saveFile() {
+      emit("save:modelValue", files.value);
+    }
+    function generateLink(file) {
+      return URL.createObjectURL(file);
     }
-  },
-  mounted() {
+    function reload(e2) {
+      e2.preventDefault();
+      emit("reload");
+    }
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", {
+        class: normalizeClass(["file__upload", __props.inline ? "" : "file__upload_box"])
+      }, [
+        !__props.fileSaved ? (openBlock(), createElementBlock("div", {
+          key: 0,
+          class: "file__upload_btn",
+          onDragover: _cache[1] || (_cache[1] = withModifiers(($event) => dragFile($event), ["prevent"])),
+          onDrop: _cache[2] || (_cache[2] = withModifiers(($event) => dropFile($event), ["prevent"]))
+        }, [
+          createVNode(DhIcon, {
+            class: "file__upload_btn_icon",
+            "icon-name": "upload",
+            size: 24
+          }),
+          _hoisted_1$d,
+          createElementVNode("input", {
+            id: "upload_pdf",
+            ref_key: "upload",
+            ref: upload,
+            multiple: "",
+            name: "file",
+            type: "file",
+            onInput: _cache[0] || (_cache[0] = ($event) => uploadFile($event))
+          }, null, 544)
+        ], 32)) : createCommentVNode("", true),
+        fileSelected.value ? (openBlock(), createElementBlock("div", _hoisted_2$c, [
+          (openBlock(true), createElementBlock(Fragment, null, renderList(files.value, (file, id) => {
+            return openBlock(), createElementBlock("div", {
+              key: id,
+              class: normalizeClass(["file__upload_list", __props.inline ? "" : "file__upload_list_box"])
+            }, [
+              createVNode(DhIcon, {
+                class: normalizeClass(__props.errorOccured[id] ? "file__upload_list_icon" : ""),
+                "icon-name": `file-` + iconName(file.name),
+                size: 40
+              }, null, 8, ["class", "icon-name"]),
+              props.uploadProgress[id] == 100 && __props.fileSaved && !__props.errorOccured[id] && __props.virusCheck[id] == "loading" ? (openBlock(), createBlock(DhIcon, {
+                key: 0,
+                class: "file__upload_list_icon_sub file__upload_list_icon_sub--loading",
+                "icon-name": "states",
+                size: 20,
+                style: normalizeStyle({ "z-index": props.zIndex })
+              }, null, 8, ["style"])) : createCommentVNode("", true),
+              props.uploadProgress[id] == 100 && __props.fileSaved && __props.virusCheck[id] == "failed" ? (openBlock(), createBlock(DhIcon, {
+                key: 1,
+                class: "file__upload_list_icon_sub",
+                "icon-name": "warning-filled",
+                size: 20,
+                style: normalizeStyle({ "z-index": props.zIndex })
+              }, null, 8, ["style"])) : createCommentVNode("", true),
+              props.uploadProgress[id] == 100 && __props.fileSaved && __props.virusCheck[id] == "detected" ? (openBlock(), createBlock(DhIcon, {
+                key: 2,
+                class: "file__upload_list_icon_sub",
+                "icon-name": "danger",
+                size: 20,
+                style: normalizeStyle({ "z-index": props.zIndex })
+              }, null, 8, ["style"])) : createCommentVNode("", true),
+              __props.fileSaved && __props.errorOccured[id] ? (openBlock(), createBlock(DhIcon, {
+                key: 3,
+                class: "file__upload_list_icon_sub",
+                "icon-name": "error",
+                size: 20,
+                style: normalizeStyle({ "z-index": props.zIndex })
+              }, null, 8, ["style"])) : createCommentVNode("", true),
+              createElementVNode("div", _hoisted_3$8, [
+                createElementVNode("div", _hoisted_4$5, [
+                  createElementVNode("div", null, [
+                    createElementVNode("span", {
+                      title: file.name
+                    }, toDisplayString(getName(file.name)) + toDisplayString(getExtension(file.name)), 9, _hoisted_5$2),
+                    props.uploadProgress[id] == 100 && __props.fileSaved && !__props.errorOccured[id] && __props.virusCheck[id] == "loading" ? (openBlock(), createElementBlock("span", _hoisted_6$2, [
+                      createTextVNode(toDisplayString(__props.virusCheckText) + " ", 1),
+                      createVNode(DhIcon, {
+                        class: "file__upload_list_icon_sub--loading",
+                        "icon-name": "processing",
+                        size: 18
+                      })
+                    ])) : createCommentVNode("", true),
+                    props.uploadProgress[id] == 100 && __props.fileSaved && __props.virusCheck[id] == "failed" ? (openBlock(), createElementBlock("span", _hoisted_7$1, toDisplayString(__props.virusCheckFailedText), 1)) : createCommentVNode("", true),
+                    props.uploadProgress[id] == 100 && __props.fileSaved && __props.virusCheck[id] == "detected" ? (openBlock(), createElementBlock("span", _hoisted_8$1, toDisplayString(__props.virusDetectedText), 1)) : createCommentVNode("", true),
+                    _hoisted_9$1,
+                    __props.fileSaved && !__props.errorOccured[id] || !__props.errorOccured[id] && __props.virusCheck[id] ? (openBlock(), createElementBlock("span", _hoisted_10$1, toDisplayString(formatBytes(file.size)), 1)) : createCommentVNode("", true),
+                    __props.fileSaved && __props.errorOccured[id] ? (openBlock(), createElementBlock("span", _hoisted_11$1, toDisplayString(__props.errorMessage), 1)) : createCommentVNode("", true)
+                  ]),
+                  !__props.fileSaved ? (openBlock(), createElementBlock("span", _hoisted_12$1, toDisplayString(props.uploadProgress[id]) + "%", 1)) : createCommentVNode("", true)
+                ]),
+                !__props.fileSaved ? (openBlock(), createElementBlock("progress", {
+                  key: 0,
+                  id: "file",
+                  max: "100",
+                  value: props.uploadProgress[id]
+                }, toDisplayString(props.uploadProgress[id]) + "% ", 9, _hoisted_13$1)) : createCommentVNode("", true)
+              ]),
+              __props.fileSaved && !__props.virusCheck[id] && !__props.errorOccured[id] ? (openBlock(), createElementBlock("a", {
+                key: 4,
+                class: "file__upload_list_download",
+                download: "",
+                href: generateLink(file)
+              }, [
+                createVNode(DhIcon, {
+                  class: "file__upload_list_download_icon",
+                  "icon-name": "download",
+                  size: 24
+                })
+              ], 8, _hoisted_14$1)) : createCommentVNode("", true),
+              __props.fileSaved && __props.errorOccured[id] ? (openBlock(), createElementBlock("a", {
+                key: 5,
+                class: "file__upload_list_retry",
+                onClick: _cache[3] || (_cache[3] = ($event) => reload($event))
+              }, [
+                createVNode(DhIcon, {
+                  class: "file__upload_list_retry_icon",
+                  "icon-name": "retry",
+                  size: 24
+                })
+              ])) : createCommentVNode("", true),
+              props.uploadProgress[id] !== 100 ? (openBlock(), createBlock(DhIcon, {
+                key: 6,
+                class: "file__upload_list_delete",
+                "icon-name": "close",
+                size: 24,
+                onClick: ($event) => removeFile(id)
+              }, null, 8, ["onClick"])) : (openBlock(), createBlock(DhIcon, {
+                key: 7,
+                class: "file__upload_list_delete",
+                "icon-name": "delete",
+                size: 24,
+                onClick: ($event) => deleteFile(id)
+              }, null, 8, ["onClick"]))
+            ], 2);
+          }), 128))
+        ])) : createCommentVNode("", true),
+        !fileSelected.value && !__props.inline ? (openBlock(), createElementBlock("div", _hoisted_15$1, " No file selected ")) : createCommentVNode("", true),
+        !__props.inline && !__props.fileSaved ? (openBlock(), createElementBlock("div", _hoisted_16$1, [
+          _hoisted_17$1,
+          createElementVNode("button", {
+            class: normalizeClass([
+              "file__upload_action_done",
+              fileSelected.value && !__props.fileSaved ? "file__upload_action_done--active" : ""
+            ]),
+            onClick: saveFile
+          }, " Done ", 2)
+        ])) : createCommentVNode("", true)
+      ], 2);
+    };
   }
 };
-const _hoisted_1$d = { class: "bar" };
-const _hoisted_2$c = ["min", "max", "step", "value"];
-const _hoisted_3$8 = { class: "caption" };
-const _hoisted_4$5 = { class: "min-caption" };
-const _hoisted_5$2 = { class: "bar-inner" };
-const _hoisted_6$2 = ["min", "max", "step", "value"];
-const _hoisted_7$2 = { class: "caption" };
-const _hoisted_8$1 = { class: "max-caption" };
-const _hoisted_9$1 = {
-  key: 0,
-  class: "ruler"
-};
-const _hoisted_10$1 = {
-  key: 1,
-  class: "sub-ruler"
-};
-const _hoisted_11$1 = {
-  key: 2,
-  class: "labels"
-};
-function _sfc_render$4(_ctx, _cache, $props, $setup, $data, $options) {
-  return openBlock(), createElementBlock("div", {
-    class: normalizeClass([$props.baseClassName, $data.rangeMarginValue === 0 ? "zero-ranage-margin" : ""]),
-    onMousewheel: _cache[10] || (_cache[10] = withModifiers((...args) => $options.onMouseWheel && $options.onMouseWheel(...args), ["prevent", "stop"]))
-  }, [
-    createElementVNode("div", _hoisted_1$d, [
-      createElementVNode("div", {
-        class: "bar-left",
-        style: normalizeStyle({ width: $options.barMin + "%" }),
-        onClick: _cache[0] || (_cache[0] = (...args) => $options.onBarLeftClick && $options.onBarLeftClick(...args))
-      }, null, 4),
-      createElementVNode("input", {
-        class: "input-type-range input-type-range-min",
-        type: "range",
-        min: $options.minimum,
-        max: $options.maximum,
-        step: $props.step,
-        value: $data.valueMin,
-        onInput: _cache[1] || (_cache[1] = withModifiers((...args) => $options.onInputMinChange && $options.onInputMinChange(...args), ["stop", "prevent"]))
-      }, null, 40, _hoisted_2$c),
-      createElementVNode("div", {
-        class: "thumb thumb-left",
-        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$8, [
-          createElementVNode("span", _hoisted_4$5, toDisplayString($props.minCaption || $options.barMinVal), 1)
-        ])
-      ], 32),
-      createElementVNode("div", _hoisted_5$2, [
-        createElementVNode("div", {
-          class: "bar-inner-left",
-          onClick: _cache[4] || (_cache[4] = (...args) => $options.onInnerBarLeftClick && $options.onInnerBarLeftClick(...args))
-        }),
-        createElementVNode("div", {
-          class: "bar-inner-right",
-          onClick: _cache[5] || (_cache[5] = (...args) => $options.onInnerBarRightClick && $options.onInnerBarRightClick(...args))
-        })
-      ]),
-      createElementVNode("input", {
-        class: "input-type-range input-type-range-max",
-        type: "range",
-        min: $options.minimum,
-        max: $options.maximum,
-        step: $props.step,
-        value: $data.valueMax,
-        onInput: _cache[6] || (_cache[6] = withModifiers((...args) => $options.onInputMaxChange && $options.onInputMaxChange(...args), ["stop", "prevent"]))
-      }, null, 40, _hoisted_6$2),
-      createElementVNode("div", {
-        class: "thumb thumb-right",
-        onMousedown: _cache[7] || (_cache[7] = (...args) => $options.onRightThumbMousedown && $options.onRightThumbMousedown(...args)),
-        onTouchstart: _cache[8] || (_cache[8] = (...args) => $options.onRightThumbMousedown && $options.onRightThumbMousedown(...args))
-      }, [
-        createElementVNode("div", _hoisted_7$2, [
-          createElementVNode("span", _hoisted_8$1, toDisplayString($props.maxCaption || $options.barMaxVal), 1)
-        ])
-      ], 32),
-      createElementVNode("div", {
-        class: "bar-right",
-        style: normalizeStyle({ width: $options.barMax + "%" }),
-        onClick: _cache[9] || (_cache[9] = (...args) => $options.onBarRightClick && $options.onBarRightClick(...args))
-      }, null, 4)
-    ]),
-    $props.ruler ? (openBlock(), createElementBlock("div", _hoisted_9$1, [
-      (openBlock(true), createElementBlock(Fragment, null, renderList($options.stepCount, (n) => {
-        return openBlock(), createElementBlock("div", {
-          key: n,
-          class: "ruler-rule"
-        });
-      }), 128))
-    ])) : createCommentVNode("", true),
-    $options.subStepCount ? (openBlock(), createElementBlock("div", _hoisted_10$1, [
-      (openBlock(true), createElementBlock(Fragment, null, renderList($options.subStepCount, (n) => {
-        return openBlock(), createElementBlock("div", {
-          key: n,
-          class: "ruler-sub-rule"
-        });
-      }), 128))
-    ])) : createCommentVNode("", true),
-    $props.label ? (openBlock(), createElementBlock("div", _hoisted_11$1, [
-      (openBlock(true), createElementBlock(Fragment, null, renderList($options.scaleLabels, (label) => {
-        return openBlock(), createElementBlock("div", {
-          class: "label",
-          key: label
-        }, toDisplayString(label), 1);
-      }), 128))
-    ])) : createCommentVNode("", true)
-  ], 34);
-}
-var MultiRangeSlider = /* @__PURE__ */ _export_sfc(_sfc_main$d, [["render", _sfc_render$4]]);
-var MultiRangeSliderBarOnly = "";
-Chart.register(plugin_tooltip, BarElement, CategoryScale, LinearScale);
 const _sfc_main$c = defineComponent({
-  components: { Bar, MultiRangeSlider, DhAdvancedFilter },
+  components: { DhIcon },
   props: {
-    numberRange: {
-      type: Array,
-      default: () => [{ key: 1, count: 10 }]
+    hasCloseButton: {
+      type: Boolean,
+      default: true
     },
-    width: {
-      type: Number,
-      default: 200
+    hasSideBar: {
+      type: Boolean,
+      default: true
     },
-    height: {
-      type: Number,
-      default: 50
+    hasSideBarButtonBottom: {
+      type: Boolean,
+      default: true
+    },
+    hasHeader: {
+      type: Boolean,
+      default: true
+    },
+    hasFooter: {
+      type: Boolean,
+      default: true
     },
-    chartId: {
-      type: String,
-      default: "bar-chart"
+    hasFooterButtonRight: {
+      type: Boolean,
+      default: true
     },
-    datasetIdKey: {
+    sideBarPosition: {
       type: String,
-      default: "label"
-    },
-    steps: {
-      type: Number,
-      default: 1
+      default: "left"
     },
-    includeForm: {
+    hasCloseConfirmation: {
       type: Boolean,
       default: false
+    },
+    bodyClass: {
+      type: String,
+      default: ""
     }
   },
-  data() {
-    return {
-      chartData: {
-        labels: [],
-        datasets: [
-          {
-            labels: "",
-            data: [],
-            backgroundColor: ["#5ea9e5"],
-            borderRadius: 1,
-            hoverBackgroundColor: "#e0e0e0"
-          }
-        ]
-      },
-      chartOptions: {
-        responsive: true,
-        plugins: {
-          legend: {
-            display: false
-          },
-          tooltip: {
-            enabled: false
-          }
-        },
-        scales: {
-          x: {
-            display: false,
-            grid: {
-              display: false
-            },
-            ticks: {
-              display: true
-            }
-          },
-          y: {
-            display: false,
-            grid: {
-              display: false
-            },
-            ticks: {
-              display: false
-            }
-          }
-        }
-      },
-      chartLines: {},
-      min: "1",
-      max: this.maxNumber(this.numberRange),
-      rangeMax: this.numberRange.length,
-      chart_dta: [],
-      BarMinValue: 1,
-      BarMaxValue: this.numberRange.length,
-      activeFilter: false,
-      validated: false,
-      isMatch: false,
-      isExclude: false,
-      isDisable: false
-    };
-  },
-  mounted() {
-    this.isMatch = true;
-    this.setChartData(this.numberRange);
-    this.highlightChart();
-  },
+  emits: ["close"],
   methods: {
-    matchFilter() {
-      if (!this.isDisable) {
-        this.isMatch = true;
-        this.isExclude = false;
-        var data = this.chartData.datasets[0].data;
-        this.chartLines = this.chartData.datasets[0];
-        this.chartData.datasets[0].backgroundColor = [];
-        for (let i2 = 0; i2 <= data.length; i2++) {
-          if (data[i2] >= this.min && data[i2] <= this.max) {
-            this.chartData.datasets[0].backgroundColor.push("#5ea9e5");
-          } else {
-            this.chartData.datasets[0].backgroundColor.push("#e0e0e0");
-          }
-        }
-      }
-    },
-    excludeFilter() {
-      if (!this.isDisable) {
-        this.isMatch = false;
-        this.isExclude = true;
-        var data = this.chartData.datasets[0].data;
-        this.chartLines = this.chartData.datasets[0];
-        this.chartData.datasets[0].backgroundColor = [];
-        for (let i2 = 0; i2 < data.length; i2++) {
-          if (data[i2] >= this.min && data[i2] <= this.max) {
-            this.chartData.datasets[0].backgroundColor.push("#e0e0e0");
-          } else {
-            this.chartData.datasets[0].backgroundColor.push("#5ea9e5");
-          }
-        }
-      }
-    },
-    missingFilter() {
-      this.isDisable = !this.isDisable;
-      this.validated = !this.validated;
-      var data = this.chartData.datasets[0].data;
-      this.chartLines = this.chartData.datasets[0];
-      this.chartData.datasets[0].backgroundColor = [];
-      if (this.validated) {
-        for (let i2 = 1; i2 <= data.length; i2++) {
-          this.chartData.datasets[0].backgroundColor.push("#e0e0e0");
-        }
-      } else {
-        if (this.isMatch) {
-          this.matchFilter();
-        }
-        if (this.isExclude) {
-          this.excludeFilter();
-        }
-      }
-    },
-    changeMin(e2) {
-      let minValue = e2.target.value;
-      this.min = minValue ? minValue : "1";
-      this.BarMinValue = minValue ? this.getFirstIndex(parseInt(minValue)) : 1;
-      if (this.isMatch && !this.isDisable) {
-        this.matchFilter();
-      }
-      if (this.isExclude && !this.isDisable) {
-        this.excludeFilter();
-      }
-    },
-    changeMax(e2) {
-      let maxValue = e2.target.value;
-      this.BarMaxValue = maxValue && maxValue > this.maxNumber(this.numberRange) ? this.numberRange.length : this.getLastIndex(parseInt(maxValue));
-      this.max = maxValue && maxValue > this.maxNumber(this.numberRange) ? this.maxNumber(this.numberRange) : maxValue;
-      if (this.isMatch && !this.isDisable) {
-        this.matchFilter();
-      }
-      if (this.isExclude && !this.isDisable) {
-        this.excludeFilter();
-      }
-    },
-    setChartData(chart_data) {
-      chart_data = this.sortData(chart_data);
-      this.removeChartData();
-      let key = this.chartData.labels;
-      for (let j = 0; j < chart_data.length; j++) {
-        key.push(chart_data[j].key);
-        this.chart_dta.push(chart_data[j].count);
-      }
-      this.chartData.datasets[0].data = this.chart_dta;
+    closed() {
+      this.$emit("close", this.hasCloseConfirmation);
+    }
+  }
+});
+const _hoisted_1$c = {
+  key: 1,
+  id: "modal-sidebar",
+  class: "modal-sidebar"
+};
+const _hoisted_2$b = {
+  key: 0,
+  id: "modalTitle",
+  class: "modal-header"
+};
+const _hoisted_3$7 = { class: "modal-footer" };
+function _sfc_render$3(_ctx, _cache, $props, $setup, $data, $options) {
+  const _component_dh_icon = resolveComponent("dh-icon");
+  return openBlock(), createBlock(Transition, { name: "modal-fade" }, {
+    default: withCtx(() => [
+      createElementVNode("div", {
+        class: "modal-backdrop",
+        onClick: _cache[2] || (_cache[2] = (...args) => _ctx.closed && _ctx.closed(...args))
+      }, [
+        createElementVNode("div", {
+          "aria-describedby": "modalDescription",
+          "aria-labelledby": "modalTitle",
+          class: normalizeClass(`modal ${_ctx.hasSideBar ? _ctx.sideBarPosition : ""}`),
+          role: "dialog",
+          onClick: _cache[1] || (_cache[1] = withModifiers(() => {
+          }, ["stop"]))
+        }, [
+          _ctx.hasCloseButton ? (openBlock(), createElementBlock("button", {
+            key: 0,
+            "aria-label": "Close modal",
+            class: "btn-close",
+            type: "button",
+            onClick: _cache[0] || (_cache[0] = (...args) => _ctx.closed && _ctx.closed(...args))
+          }, [
+            createVNode(_component_dh_icon, {
+              class: "icon",
+              "icon-name": "close",
+              size: 24
+            })
+          ])) : createCommentVNode("", true),
+          _ctx.hasSideBar ? (openBlock(), createElementBlock("aside", _hoisted_1$c, [
+            renderSlot(_ctx.$slots, "sidebar"),
+            _ctx.hasSideBarButtonBottom ? renderSlot(_ctx.$slots, "sidebar-button-bottom", { key: 0 }) : createCommentVNode("", true)
+          ])) : createCommentVNode("", true),
+          createElementVNode("section", {
+            class: normalizeClass(`right-section ${_ctx.hasSideBar ? "" : "full"}`)
+          }, [
+            _ctx.hasHeader ? (openBlock(), createElementBlock("header", _hoisted_2$b, [
+              renderSlot(_ctx.$slots, "header")
+            ])) : createCommentVNode("", true),
+            createElementVNode("section", {
+              id: "modalDescription",
+              class: normalizeClass(["modal-body", _ctx.bodyClass])
+            }, [
+              renderSlot(_ctx.$slots, "body")
+            ], 2),
+            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)
+            ])
+          ], 2)
+        ], 2)
+      ])
+    ]),
+    _: 3
+  });
+}
+var Modal = /* @__PURE__ */ _export_sfc(_sfc_main$c, [["render", _sfc_render$3]]);
+var __glob_1_0 = "data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICAgIDxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgY2xpcC1ydWxlPSJldmVub2RkIiBkPSJNMTIgMy41YTguNSA4LjUgMCAxIDAgMCAxNyA4LjUgOC41IDAgMCAwIDAtMTd6TTIuNSAxMmE5LjUgOS41IDAgMSAxIDE5IDAgOS41IDkuNSAwIDAgMS0xOSAweiIgZmlsbD0iI0MzMkYyNyIvPgogICAgPHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0xMiA3LjVhLjUuNSAwIDAgMSAuNS41djRhLjUuNSAwIDAgMS0xIDBWOGEuNS41IDAgMCAxIC41LS41ek0xMS4yNSAxNmEuNzUuNzUgMCAwIDEgLjc1LS43NWguMDFhLjc1Ljc1IDAgMCAxIDAgMS41SDEyYS43NS43NSAwIDAgMS0uNzUtLjc1eiIgZmlsbD0iI0MzMkYyNyIvPgo8L3N2Zz4K";
+var __glob_1_1 = "data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICAgIDxwYXRoIGQ9Ik0xNy40NTIgMTkuMTg5SDYuNTU4QTIuNTYgMi41NiAwIDAgMSA0IDE2LjYzMVYxNmMwLTEgLjQxNS0xLjk1OSAxLjEzOC0yLjY0NS40MzMtLjQxLjY3OC0uOTc3LjY3OC0xLjU3MlY5LjE4NEE2LjE5MSA2LjE5MSAwIDAgMSAxMiAzYTYuMTkxIDYuMTkxIDAgMCAxIDYuMTg0IDYuMTg0djIuNmMwIC41OTQuMjQ1IDEuMTY1LjY3OCAxLjU3QTMuNjM2IDMuNjM2IDAgMCAxIDIwIDE2di42MzFhMi41NDcgMi41NDcgMCAwIDEtMi41NDkgMi41NTh6bS01LjQ0Ny0xNC43MmE0LjcxOCA0LjcxOCAwIDAgMC00LjcxIDQuNzF2Mi42YzAgMS0uNDE0IDEuOTU4LTEuMTM4IDIuNjQ1LS40MzMuNDEtLjY3Ny45NzctLjY3NyAxLjU3MXYuNjMyYzAgLjU5OS40ODQgMS4wNzggMS4wODMgMS4wODJoMTAuODk0Yy41OTQgMCAxLjA3OC0uNDgzIDEuMDgzLTEuMDgydi0uNjMyYzAtLjU5NC0uMjQ0LTEuMTY2LS42NzgtMS41NzFhMy42MzYgMy42MzYgMCAwIDEtMS4xMzgtMi42NDZWOS4xNzVhNC43MjUgNC43MjUgMCAwIDAtNC43MTktNC43MDV6TTEzLjkwNCAyMS40NjZoLTMuNzk4YS43NC43NCAwIDAgMS0uNzM3LS43MzguNzQuNzQgMCAwIDEgLjczNy0uNzM3aDMuNzk4YS43MzcuNzM3IDAgMSAxIDAgMS40NzV6IiBmaWxsPSIjQkZCRkJGIi8+Cjwvc3ZnPgo=";
+var __glob_1_2 = "data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICAgIDxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgY2xpcC1ydWxlPSJldmVub2RkIiBkPSJNMTkuNDI3IDYuMjUzYTEgMSAwIDAgMSAwIDEuNDE0bC05LjI0IDkuMjRhMSAxIDAgMCAxLTEuNDE0IDBsLTQuMi00LjJhMSAxIDAgMSAxIDEuNDE0LTEuNDE0bDMuNDkzIDMuNDkzIDguNTMzLTguNTMzYTEgMSAwIDAgMSAxLjQxNCAweiIgZmlsbD0iIzNDQTA2NCIvPgo8L3N2Zz4K";
+var __glob_1_3 = "data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICAgIDxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgY2xpcC1ydWxlPSJldmVub2RkIiBkPSJNMTAuODkzIDMuNzlhMi4yNTYgMi4yNTYgMCAwIDEgMy4wMzYuNzk2bC4wMDIuMDAzIDcuNDQyIDEyLjQyNGEyLjI1NyAyLjI1NyAwIDAgMS0xLjkzIDMuMzg0SDQuNTU3YTIuMjU3IDIuMjU3IDAgMCAxLTEuOTI5LTMuMzg0bC4wMDQtLjAwN0wxMC4wNyA0LjU4OWwuMDAyLS4wMDNjLjIwMS0uMzMxLjQ4NC0uNjA2LjgyMi0uNzk2ek0xMiA0LjVhMS4yNTYgMS4yNTYgMCAwIDAtMS4wNzMuNjA0aC0uMDAxTDMuNDkgMTcuNTE3YTEuMjU2IDEuMjU2IDAgMCAwIDEuMDc0IDEuODgxaDE0Ljg3YTEuMjU2IDEuMjU2IDAgMCAwIDEuMDc0LTEuODgxTDEzLjA3NCA1LjEwNXYtLjAwMUExLjI1NyAxLjI1NyAwIDAgMCAxMiA0LjV6IiBmaWxsPSIjRjI5OTRBIi8+CiAgICA8cGF0aCBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGNsaXAtcnVsZT0iZXZlbm9kZCIgZD0iTTEyIDguODZhLjUuNSAwIDAgMSAuNS41djMuNTEyYS41LjUgMCAxIDEtMSAwVjkuMzU5YS41LjUgMCAwIDEgLjUtLjV6TTExLjI1IDE2LjM4NWEuNzUuNzUgMCAwIDEgLjc1LS43NWguMDA5YS43NS43NSAwIDEgMSAwIDEuNUgxMmEuNzUuNzUgMCAwIDEtLjc1LS43NXoiIGZpbGw9IiNGMjk5NEEiLz4KPC9zdmc+Cg==";
+const _sfc_main$b = defineComponent({
+  props: {
+    notificationType: {
+      type: String,
+      required: true,
+      default: "toast"
     },
-    highlightChart() {
-      var data = this.chartData.datasets[0].data;
-      this.chartLines = this.chartData.datasets[0];
-      this.chartData.datasets[0].backgroundColor = [];
-      for (let i2 = 0; i2 <= data.length; i2++) {
-        if (data[i2] >= this.min && data[i2] <= this.max) {
-          this.chartData.datasets[0].backgroundColor.push("#5ea9e5");
-        } else {
-          this.chartData.datasets[0].backgroundColor.push("#e0e0e0");
-        }
-      }
+    status: {
+      type: String,
+      required: true,
+      default: "info"
     },
-    updateBarChart(e2) {
-      const { minValue, maxValue } = e2;
-      this.BarMinValue = minValue;
-      this.BarMaxValue = maxValue;
-      var data = this.chartData.datasets[0].data;
-      this.min = data[this.BarMinValue] ? data[this.BarMinValue] : "1";
-      this.max = data[this.BarMaxValue] ? data[this.BarMaxValue] : this.max;
-      if (this.isMatch && !this.isDisable) {
-        this.matchFilter();
-      }
-      if (this.isExclude && !this.isDisable) {
-        this.excludeFilter();
-      }
+    title: {
+      type: String,
+      required: false,
+      default: ""
     },
-    toggleFilter() {
-      this.activeFilter = !this.activeFilter;
+    message: {
+      type: String,
+      required: false,
+      default: ""
     },
-    removeChartData() {
-      this.chartData.labels = [];
-      this.chartData.datasets[0].data = [];
-      this.chart_dta = [];
+    dismissible: {
+      type: Boolean,
+      required: false,
+      default: true
     },
-    sortData(arr) {
-      return arr.slice().sort(function(a3, b2) {
-        return a3.count - b2.count;
-      });
+    notificationButton: {
+      type: String,
+      default: "Action"
     },
-    maxNumber(arr) {
-      if (arr.length == 0)
-        return;
-      return arr.reduce((acc, shot) => acc = acc > shot.count ? acc : shot.count, 0);
+    buttonAction: {
+      type: String,
+      default: "void"
     },
-    getLastIndex(index) {
-      let data = this.chartData.datasets[0].data;
-      let indexVal = 0;
-      for (let i2 = index; i2 >= 0; i2--) {
-        if (data.lastIndexOf(i2) !== -1) {
-          indexVal = data.lastIndexOf(i2);
-          break;
-        } else {
-          continue;
-        }
-      }
-      return indexVal;
+    buttonDismiss: {
+      type: String,
+      default: "Dismiss"
+    }
+  },
+  data() {
+    return {
+      show: true
+    };
+  },
+  mounted() {
+    if (this.dismissible && ["toast", "bottom-message"].includes(this.notificationType)) {
+      setTimeout(() => {
+        this.close();
+      }, 3e3);
+    }
+  },
+  methods: {
+    getIconUrl() {
+      return new URL({ "../assets/icon-danger.svg": __glob_1_0, "../assets/icon-info.svg": __glob_1_1, "../assets/icon-success.svg": __glob_1_2, "../assets/icon-warning.svg": __glob_1_3 }[`../assets/icon-${this.status}.svg`], self.location).href;
     },
-    getFirstIndex(index) {
-      let data = this.chartData.datasets[0].data;
-      let indexVal = 0;
-      for (let i2 = index; i2 <= this.max; i2++) {
-        if (data.lastIndexOf(i2) !== -1) {
-          indexVal = data.lastIndexOf(i2);
-          break;
-        } else {
-          continue;
-        }
+    close() {
+      this.show = false;
+    },
+    limitTitle(_title, _type) {
+      if (["toast", "actionable"].includes(_type) && _title.length >= 60) {
+        return `${_title.substring(0, 60)}..`;
+      } else if (["bottom-message"].includes(_type) && _title.length >= 40) {
+        return `${_title.substring(0, 40)}..`;
+      } else if (["modal"].includes(_type) && _title.length >= 80) {
+        return `${_title.substring(0, 80)}..`;
       }
-      return indexVal;
+      return _title;
     }
   }
 });
-const _hoisted_1$c = { class: "dh-range-container" };
-const _hoisted_2$b = { class: "bar-chart" };
-const _hoisted_3$7 = {
+const _hoisted_1$b = /* @__PURE__ */ createElementVNode("img", {
+  alt: "icon",
+  class: "close-icon",
+  src: _imports_0$1
+}, null, -1);
+const _hoisted_2$a = [
+  _hoisted_1$b
+];
+const _hoisted_3$6 = ["src"];
+const _hoisted_4$4 = { class: "additional-text" };
+const _hoisted_5$1 = {
   key: 0,
-  class: "input-group-section"
+  class: "descriptions"
 };
-const _hoisted_4$4 = { class: "input-group sb-input" };
-const _hoisted_5$1 = ["disabled", "max", "value"];
-const _hoisted_6$1 = { class: "input-group sb-input" };
-const _hoisted_7$1 = ["disabled", "max", "min", "value"];
-function _sfc_render$3(_ctx, _cache, $props, $setup, $data, $options) {
-  const _component_Bar = resolveComponent("Bar");
-  const _component_MultiRangeSlider = resolveComponent("MultiRangeSlider");
-  const _component_dh_advanced_filter = resolveComponent("dh-advanced-filter");
-  return openBlock(), createElementBlock("div", _hoisted_1$c, [
-    createElementVNode("div", _hoisted_2$b, [
-      createVNode(_component_Bar, {
-        "chart-data": _ctx.chartData,
-        "chart-id": _ctx.chartId,
-        "chart-options": _ctx.chartOptions,
-        "dataset-id-key": _ctx.datasetIdKey,
-        height: _ctx.height,
-        width: _ctx.width
-      }, null, 8, ["chart-data", "chart-id", "chart-options", "dataset-id-key", "height", "width"]),
-      createVNode(_component_MultiRangeSlider, {
-        "base-class-name": `multi-range-slider range-slider ${_ctx.isDisable}`,
-        label: false,
-        max: _ctx.rangeMax,
-        "max-caption": `${_ctx.max}`,
-        "max-value": _ctx.BarMaxValue,
-        min: 1,
-        "min-caption": `${_ctx.min}`,
-        "min-value": _ctx.BarMinValue,
-        "range-margin": 0,
-        ruler: false,
-        step: _ctx.steps,
-        onInput: _ctx.updateBarChart
-      }, null, 8, ["base-class-name", "max", "max-caption", "max-value", "min-caption", "min-value", "step", "onInput"])
-    ]),
-    _ctx.includeForm ? (openBlock(), createElementBlock("div", _hoisted_3$7, [
-      createElementVNode("div", _hoisted_4$4, [
-        createElementVNode("label", {
-          class: normalizeClass(`text-2 input-to ${_ctx.validated ? "disable" : ""}`)
-        }, " From ", 2),
-        createElementVNode("input", {
-          class: "form-input text",
-          disabled: _ctx.validated ? true : false,
-          max: `${_ctx.max}`,
-          min: "1",
-          placeholder: "From",
-          type: "number",
-          value: `${_ctx.min}`,
-          onInput: _cache[0] || (_cache[0] = ($event) => _ctx.changeMin($event))
-        }, null, 40, _hoisted_5$1)
-      ]),
-      createElementVNode("div", _hoisted_6$1, [
-        createElementVNode("label", {
-          class: normalizeClass(`text-2 input-to ${_ctx.validated ? "disable" : ""}`)
-        }, " To ", 2),
-        createElementVNode("input", {
-          class: "form-input text",
-          disabled: _ctx.validated ? true : false,
-          max: `${_ctx.maxNumber(_ctx.numberRange)}`,
-          min: `${_ctx.min}`,
-          placeholder: "To",
-          type: "number",
-          value: `${_ctx.max}`,
-          onInput: _cache[1] || (_cache[1] = ($event) => _ctx.changeMax($event))
-        }, null, 40, _hoisted_7$1)
-      ])
-    ])) : createCommentVNode("", true),
-    renderSlot(_ctx.$slots, "default"),
-    createVNode(_component_dh_advanced_filter, {
-      onExclude: _ctx.excludeFilter,
-      onFilter_missing: _ctx.missingFilter,
-      onMatch: _ctx.matchFilter
-    }, null, 8, ["onExclude", "onFilter_missing", "onMatch"])
-  ]);
+const _hoisted_6$1 = { class: "btn btn-normal btn-primary" };
+function _sfc_render$2(_ctx, _cache, $props, $setup, $data, $options) {
+  return openBlock(), createElementBlock("div", {
+    class: normalizeClass(`dh-notification-container ${_ctx.notificationType}`)
+  }, [
+    _ctx.show ? (openBlock(), createElementBlock("div", {
+      key: 0,
+      class: normalizeClass(["bottom-message"].includes(_ctx.notificationType) ? `notification-up status status-${_ctx.notificationType}` : `notification-enter status status-${_ctx.notificationType}`)
+    }, [
+      !["modal", "bottom-message"].includes(_ctx.notificationType) ? (openBlock(), createElementBlock("button", {
+        key: 0,
+        class: "close-notification",
+        onClick: _cache[0] || (_cache[0] = withModifiers((...args) => _ctx.close && _ctx.close(...args), ["prevent"]))
+      }, _hoisted_2$a)) : createCommentVNode("", true),
+      createElementVNode("div", {
+        class: normalizeClass(`content content- ${_ctx.notificationType}`)
+      }, [
+        createElementVNode("div", {
+          class: normalizeClass(`ellipse ellipse-${_ctx.status} ellipse-${_ctx.notificationType}`)
+        }, [
+          createElementVNode("img", {
+            class: normalizeClass(`icons icons-${_ctx.status} icons-${_ctx.status}-${_ctx.notificationType}`),
+            src: _ctx.getIconUrl()
+          }, null, 10, _hoisted_3$6)
+        ], 2),
+        createElementVNode("div", _hoisted_4$4, [
+          createElementVNode("div", {
+            class: normalizeClass(`title title-${_ctx.notificationType}`)
+          }, toDisplayString(_ctx.limitTitle(_ctx.title, _ctx.notificationType)), 3),
+          !["bottom-message"].includes(_ctx.notificationType) ? (openBlock(), createElementBlock("div", _hoisted_5$1, toDisplayString(_ctx.message.length >= 280 ? `${_ctx.message.substring(0, 280)}..` : _ctx.message), 1)) : createCommentVNode("", true)
+        ]),
+        !["toast", "bottom-message"].includes(_ctx.notificationType) ? (openBlock(), createElementBlock("div", {
+          key: 0,
+          class: normalizeClass(`buttons ${_ctx.notificationType}`)
+        }, [
+          createElementVNode("button", _hoisted_6$1, toDisplayString(_ctx.notificationButton), 1),
+          createElementVNode("button", {
+            class: "btn btn-normal btn-secondary dismiss",
+            onClick: _cache[1] || (_cache[1] = withModifiers((...args) => _ctx.close && _ctx.close(...args), ["prevent"]))
+          }, toDisplayString(_ctx.buttonDismiss), 1)
+        ], 2)) : createCommentVNode("", true)
+      ], 2)
+    ], 2)) : createCommentVNode("", true)
+  ], 2);
 }
-var NumberRange = /* @__PURE__ */ _export_sfc(_sfc_main$c, [["render", _sfc_render$3]]);
+var Notification = /* @__PURE__ */ _export_sfc(_sfc_main$b, [["render", _sfc_render$2]]);
 var PasswordField_vue_vue_type_style_index_0_scoped_true_lang = "";
-const _hoisted_1$b = { class: "password__panel" };
-const _hoisted_2$a = ["placeholder", "type"];
-const _hoisted_3$6 = { class: "icon is-right" };
+const _hoisted_1$a = { class: "password__panel" };
+const _hoisted_2$9 = ["placeholder", "type"];
+const _hoisted_3$5 = { class: "icon is-right" };
 const _hoisted_4$3 = {
   key: 0,
   class: "password__tooltip"
 };
-const _sfc_main$b = /* @__PURE__ */ defineComponent({
+const _sfc_main$a = /* @__PURE__ */ defineComponent({
   __name: "PasswordField",
   props: {
     modelValue: {
@@ -24237,7 +24625,7 @@ const _sfc_main$b = /* @__PURE__ */ defineComponent({
     onMounted(() => () => password.value = props.modelValue || "");
     watch(props, () => (password.value = props.modelValue || "", hasMinimumLength.value = password.value.length > 11, hasNumber.value = /\d/.test(password.value), hasSpecial.value = /[!@#$%^&*)(+=._-]/.test(password.value)));
     return (_ctx, _cache) => {
-      return openBlock(), createElementBlock("div", _hoisted_1$b, [
+      return openBlock(), createElementBlock("div", _hoisted_1$a, [
         withDirectives(createElementVNode("input", {
           "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => password.value = $event),
           class: "form__input password__panel_input",
@@ -24247,7 +24635,7 @@ const _sfc_main$b = /* @__PURE__ */ defineComponent({
           onFocus,
           onFocusout: outFocus,
           onKeyup: emitChanged
-        }, null, 40, _hoisted_2$a), [
+        }, null, 40, _hoisted_2$9), [
           [vModelDynamic, password.value]
         ]),
         createElementVNode("button", {
@@ -24255,7 +24643,7 @@ const _sfc_main$b = /* @__PURE__ */ defineComponent({
           type: "button",
           onClick: toggleShow
         }, [
-          createElementVNode("span", _hoisted_3$6, [
+          createElementVNode("span", _hoisted_3$5, [
             createVNode(DhIcon, {
               active: isActive.value,
               "icon-name": showPassword.value ? "invisible" : "visible",
@@ -24299,13 +24687,13 @@ const _sfc_main$b = /* @__PURE__ */ defineComponent({
     };
   }
 });
-var PasswordField = /* @__PURE__ */ _export_sfc(_sfc_main$b, [["__scopeId", "data-v-3ae35090"]]);
+var PasswordField = /* @__PURE__ */ _export_sfc(_sfc_main$a, [["__scopeId", "data-v-3ae35090"]]);
 var RadioBox_vue_vue_type_style_index_0_scoped_true_lang = "";
-const _hoisted_1$a = { class: "radio" };
-const _hoisted_2$9 = ["for"];
-const _hoisted_3$5 = ["id", "type", "value"];
+const _hoisted_1$9 = { class: "radio" };
+const _hoisted_2$8 = ["for"];
+const _hoisted_3$4 = ["id", "type", "value"];
 const _hoisted_4$2 = { class: "radio__label_txt" };
-const _sfc_main$a = {
+const _sfc_main$9 = {
   __name: "RadioBox",
   props: {
     type: {
@@ -24324,7 +24712,7 @@ const _sfc_main$a = {
   emits: ["clickBox"],
   setup(__props, { emit }) {
     return (_ctx, _cache) => {
-      return openBlock(), createElementBlock("div", _hoisted_1$a, [
+      return openBlock(), createElementBlock("div", _hoisted_1$9, [
         createElementVNode("label", {
           class: "radio__label",
           for: __props.value
@@ -24336,16 +24724,16 @@ const _sfc_main$a = {
             type: __props.type,
             value: __props.value,
             onClick: _cache[0] || (_cache[0] = ($event) => emit("clickBox"))
-          }, null, 8, _hoisted_3$5),
+          }, null, 8, _hoisted_3$4),
           createElementVNode("span", _hoisted_4$2, toDisplayString(__props.label), 1)
-        ], 8, _hoisted_2$9)
+        ], 8, _hoisted_2$8)
       ]);
     };
   }
 };
-var DhRadioBox = /* @__PURE__ */ _export_sfc(_sfc_main$a, [["__scopeId", "data-v-29696bd5"]]);
+var DhRadioBox = /* @__PURE__ */ _export_sfc(_sfc_main$9, [["__scopeId", "data-v-29696bd5"]]);
 var RadioBoxGroup_vue_vue_type_style_index_0_lang = "";
-const _sfc_main$9 = {
+const _sfc_main$8 = {
   __name: "RadioBoxGroup",
   props: {
     orientation: {
@@ -24397,9 +24785,9 @@ const _sfc_main$9 = {
   }
 };
 var SearchInput_vue_vue_type_style_index_0_scoped_true_lang = "";
-const _hoisted_1$9 = { class: "search-panel" };
-const _hoisted_2$8 = ["placeholder"];
-const _sfc_main$8 = /* @__PURE__ */ defineComponent({
+const _hoisted_1$8 = { class: "search-panel" };
+const _hoisted_2$7 = ["placeholder"];
+const _sfc_main$7 = /* @__PURE__ */ defineComponent({
   __name: "SearchInput",
   props: {
     modelValue: {
@@ -24427,14 +24815,14 @@ const _sfc_main$8 = /* @__PURE__ */ defineComponent({
     onMounted(() => () => search.value = props.modelValue || "");
     watch(props, () => search.value = props.modelValue || "");
     return (_ctx, _cache) => {
-      return openBlock(), createElementBlock("div", _hoisted_1$9, [
+      return openBlock(), createElementBlock("div", _hoisted_1$8, [
         withDirectives(createElementVNode("input", {
           "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => search.value = $event),
           class: "form-input search-panel-input",
           "data-e2e": "search-input",
           placeholder: props.placeholder,
           onKeyup: emitChanged
-        }, null, 40, _hoisted_2$8), [
+        }, null, 40, _hoisted_2$7), [
           [vModelText, search.value]
         ]),
         !search.value ? (openBlock(), createElementBlock("button", {
@@ -24465,12 +24853,12 @@ const _sfc_main$8 = /* @__PURE__ */ defineComponent({
     };
   }
 });
-var SearchInput = /* @__PURE__ */ _export_sfc(_sfc_main$8, [["__scopeId", "data-v-562faa14"]]);
+var SearchInput = /* @__PURE__ */ _export_sfc(_sfc_main$7, [["__scopeId", "data-v-562faa14"]]);
 var Stepper_vue_vue_type_style_index_0_scoped_true_lang = "";
 const _withScopeId = (n) => (pushScopeId("data-v-0213b522"), n = n(), popScopeId(), n);
-const _hoisted_1$8 = { class: "stepper" };
-const _hoisted_2$7 = /* @__PURE__ */ _withScopeId(() => /* @__PURE__ */ createElementVNode("hr", { class: "solid" }, null, -1));
-const _sfc_main$7 = /* @__PURE__ */ defineComponent({
+const _hoisted_1$7 = { class: "stepper" };
+const _hoisted_2$6 = /* @__PURE__ */ _withScopeId(() => /* @__PURE__ */ createElementVNode("hr", { class: "solid" }, null, -1));
+const _sfc_main$6 = /* @__PURE__ */ defineComponent({
   __name: "Stepper",
   props: {
     maxSteps: {
@@ -24488,7 +24876,7 @@ const _sfc_main$7 = /* @__PURE__ */ defineComponent({
       return Array.from(Array(props.maxSteps || 0).keys());
     }
     return (_ctx, _cache) => {
-      return openBlock(), createElementBlock("div", _hoisted_1$8, [
+      return openBlock(), createElementBlock("div", _hoisted_1$7, [
         (openBlock(true), createElementBlock(Fragment, null, renderList(getSteps(), (step, id) => {
           return openBlock(), createElementBlock("div", {
             key: id,
@@ -24497,63 +24885,14 @@ const _sfc_main$7 = /* @__PURE__ */ defineComponent({
             createElementVNode("span", {
               class: normalizeClass(["step-number", { active: step === __props.currentStep }])
             }, toDisplayString(step + 1), 3),
-            _hoisted_2$7
+            _hoisted_2$6
           ]);
         }), 128))
       ]);
     };
   }
 });
-var Stepper = /* @__PURE__ */ _export_sfc(_sfc_main$7, [["__scopeId", "data-v-0213b522"]]);
-const _sfc_main$6 = defineComponent({
-  props: {
-    data: {
-      type: Boolean,
-      required: true,
-      default: false
-    },
-    label: {
-      type: String,
-      default: "Label"
-    }
-  },
-  data() {
-    return {
-      active: this.data
-    };
-  },
-  emits: ["change"],
-  computed: {
-    checkedValue: {
-      get() {
-        return this.data;
-      },
-      set(newValue) {
-        this.active = newValue;
-        this.$emit("change", newValue);
-      }
-    }
-  }
-});
-const _hoisted_1$7 = { class: "dp__options" };
-const _hoisted_2$6 = { class: "dp__options_switch" };
-const _hoisted_3$4 = /* @__PURE__ */ createElementVNode("span", { class: "dp__options_slider" }, null, -1);
-function _sfc_render$2(_ctx, _cache, $props, $setup, $data, $options) {
-  return openBlock(), createElementBlock("label", _hoisted_1$7, [
-    createElementVNode("span", null, toDisplayString(_ctx.label), 1),
-    createElementVNode("div", _hoisted_2$6, [
-      withDirectives(createElementVNode("input", {
-        "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => _ctx.checkedValue = $event),
-        name: "switch",
-        type: "checkbox"
-      }, null, 512), [
-        [vModelCheckbox, _ctx.checkedValue]
-      ]),
-      _hoisted_3$4
-    ])
-  ]);
-}
-var Switch = /* @__PURE__ */ _export_sfc(_sfc_main$6, [["render", _sfc_render$2]]);
+var Stepper = /* @__PURE__ */ _export_sfc(_sfc_main$6, [["__scopeId", "data-v-0213b522"]]);
 const _sfc_main$5 = defineComponent({
   props: {
     target: { type: String, required: true },
@@ -27322,4 +27661,4 @@ const _sfc_main = {
     };
   }
 };
-export { DhAdvancedFilter, _sfc_main$i as DhDatePicker, DropdownMenu as DhDropdownMenu, _sfc_main$h as DhError, ExpansionPanel as DhExpansionPanel, _sfc_main$g as DhFileUpload, DhIcon, _sfc_main$1 as DhInputDropdown, _sfc_main as DhInputList, Modal as DhModal, Notification as DhNotification, NumberRange as DhNumberRange, PasswordField as DhPasswordField, DhRadioBox, _sfc_main$9 as DhRadioBoxGroup, SearchInput as DhSearchInput, Stepper as DhStepper, Switch as DhSwitch, Tooltip as DhTooltip, VerificationCode as DhVerificationCode };
+export { _sfc_main$g as DhAdvancedDatePicker, DhAdvancedFilter, _sfc_main$f as DhDatePicker, DropdownMenu as DhDropdownMenu, _sfc_main$e as DhError, ExpansionPanel as DhExpansionPanel, _sfc_main$d as DhFileUpload, DhIcon, _sfc_main$1 as DhInputDropdown, _sfc_main as DhInputList, Modal as DhModal, Notification as DhNotification, DhNumberRange, PasswordField as DhPasswordField, DhRadioBox, _sfc_main$8 as DhRadioBoxGroup, SearchInput as DhSearchInput, Stepper as DhStepper, DhSwitch, Tooltip as DhTooltip, VerificationCode as DhVerificationCode };