@dialpad/dialtone-vue 3.42.2 → 3.43.0

package/dist/dialtone-vue.umd.js

@@ -1291,31 +1291,40 @@ if (typeof window !== 'undefined') {
 
 ;// CONCATENATED MODULE: external {"commonjs":"vue","commonjs2":"vue","root":"Vue"}
 const external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject = require("vue");
-;// CONCATENATED MODULE: ./node_modules/thread-loader/dist/cjs.js!./node_modules/babel-loader/lib/index.js??clonedRuleSet-82.use[1]!./node_modules/vue-loader/dist/templateLoader.js??ruleSet[1].rules[3]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./components/avatar/avatar.vue?vue&type=template&id=3cb27068
+;// CONCATENATED MODULE: ./node_modules/thread-loader/dist/cjs.js!./node_modules/babel-loader/lib/index.js??clonedRuleSet-82.use[1]!./node_modules/vue-loader/dist/templateLoader.js??ruleSet[1].rules[3]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./components/avatar/avatar.vue?vue&type=template&id=4cb798be
 
 const _hoisted_1 = ["id"];
 const _hoisted_2 = {
-  key: 1
+  ref: "canvas",
+  class: "d-avatar__canvas"
+};
+const _hoisted_3 = {
+  key: 0,
+  class: "d-avatar__count",
+  "data-qa": "dt-avatar-count"
 };
 function render(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_dt_presence = (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.resolveComponent)("dt-presence");
 
   return (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.openBlock)(), (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createElementBlock)("div", {
     id: $props.id,
-    class: (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.normalizeClass)(['d-avatar', $data.AVATAR_KIND_MODIFIERS[$data.kind], $data.AVATAR_SIZE_MODIFIERS[$props.size], $props.avatarClass]),
+    class: (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.normalizeClass)($options.avatarClasses),
     style: (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.normalizeStyle)($options.initialKindStyle),
     "data-qa": "dt-avatar"
-  }, [$options.showDefaultSlot ? (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.renderSlot)(_ctx.$slots, "default", {
+  }, [(0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createElementVNode)("div", _hoisted_2, [$options.showDefaultSlot ? (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.renderSlot)(_ctx.$slots, "default", {
     key: 0
-  }) : $options.showInitials ? ((0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.openBlock)(), (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createElementBlock)("span", _hoisted_2, (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.toDisplayString)($data.formattedInitials), 1)) : (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createCommentVNode)("", true), $props.presence ? ((0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.openBlock)(), (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createBlock)(_component_dt_presence, (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.mergeProps)({
-    key: 2,
+  }) : $options.showInitials ? ((0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.openBlock)(), (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createElementBlock)("span", {
+    key: 1,
+    class: (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.normalizeClass)($data.AVATAR_KIND_MODIFIERS.initials)
+  }, (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.toDisplayString)($data.formattedInitials), 3)) : (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createCommentVNode)("", true)], 512), $options.showGroup ? ((0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.openBlock)(), (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createElementBlock)("span", _hoisted_3, (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.toDisplayString)($options.formattedGroup), 1)) : (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createCommentVNode)("", true), $props.presence && !$options.showGroup ? ((0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.openBlock)(), (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createBlock)(_component_dt_presence, (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.mergeProps)({
+    key: 1,
     presence: $props.presence,
     class: ['d-avatar__presence', $data.AVATAR_PRESENCE_SIZE_MODIFIERS[$props.size]]
   }, $props.presenceProps, {
     "data-qa": "dt-presence"
   }), null, 16, ["presence", "class"])) : (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createCommentVNode)("", true)], 14, _hoisted_1);
 }
-;// CONCATENATED MODULE: ./components/avatar/avatar.vue?vue&type=template&id=3cb27068
+;// CONCATENATED MODULE: ./components/avatar/avatar.vue?vue&type=template&id=4cb798be
 
 ;// CONCATENATED MODULE: ./common/constants.js
 /* TODO: Move and sort these in a constants directory
@@ -1623,11 +1632,6 @@ const __exports__ = /*#__PURE__*/(0,exportHelper/* default */.Z)(presencevue_typ
 var node_modules_seedrandom = __webpack_require__(377);
 var seedrandom_default = /*#__PURE__*/__webpack_require__.n(node_modules_seedrandom);
 ;// CONCATENATED MODULE: ./components/avatar/avatar_constants.js
-const AVATAR_KIND_MODIFIERS = {
-  default: '',
-  icon: 'd-avatar--icon',
-  initials: 'd-avatar--initials'
-};
 const AVATAR_SIZE_MODIFIERS = {
   xs: 'd-avatar--xs',
   sm: 'd-avatar--sm',
@@ -1635,6 +1639,11 @@ const AVATAR_SIZE_MODIFIERS = {
   lg: 'd-avatar--lg',
   xl: 'd-avatar--xl'
 };
+const AVATAR_KIND_MODIFIERS = {
+  default: '',
+  icon: 'd-avatar__icon',
+  initials: 'd-avatar__initials'
+};
 const AVATAR_PRESENCE_SIZE_MODIFIERS = {
   md: 'd-avatar__presence--md',
   lg: 'd-avatar__presence--lg'
@@ -1653,11 +1662,13 @@ const GRADIENT_COLORS = {
 };
 const MAX_GRADIENT_COLORS = 3;
 const MAX_GRADIENT_COLORS_100 = 2;
+const AVATAR_GROUP_VALIDATOR = group => group > 1;
 /* harmony default export */ const avatar_constants = ({
   AVATAR_KIND_MODIFIERS,
   AVATAR_SIZE_MODIFIERS,
   AVATAR_ICON_SIZES,
-  AVATAR_ANGLES
+  AVATAR_ANGLES,
+  AVATAR_GROUP_VALIDATOR
 });
 ;// CONCATENATED MODULE: ./node_modules/thread-loader/dist/cjs.js!./node_modules/babel-loader/lib/index.js??clonedRuleSet-82.use[1]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./components/avatar/avatar.vue?vue&type=script&lang=js
 
@@ -1740,6 +1751,25 @@ const MAX_GRADIENT_COLORS_100 = 2;
     initials: {
       type: String,
       default: ''
+    },
+
+    /**
+     * Determines whether to show a gradient background for the avatar.
+     */
+    gradient: {
+      type: Boolean,
+      default: true
+    },
+
+    /**
+     * Determines whether to show a group avatar.
+     * Limit to 2 digits max, more than 99 will be rendered as “99+”.
+     * if the number is 1 or less it would just show the regular avatar as if group had not been set.
+     */
+    group: {
+      type: Number,
+      default: undefined,
+      validator: group => AVATAR_GROUP_VALIDATOR(group)
     }
   },
 
@@ -1757,6 +1787,13 @@ const MAX_GRADIENT_COLORS_100 = 2;
   },
 
   computed: {
+    avatarClasses() {
+      return ['d-avatar', AVATAR_SIZE_MODIFIERS[this.size], this.avatarClass, {
+        'd-avatar--no-gradient': !this.gradient,
+        'd-avatar--group': this.showGroup
+      }];
+    },
+
     showDefaultSlot() {
       return this.kind !== 'initials' && this.imageLoadedSuccessfully !== false;
     },
@@ -1765,6 +1802,10 @@ const MAX_GRADIENT_COLORS_100 = 2;
       return this.kind === 'initials' || this.initials;
     },
 
+    showGroup() {
+      return AVATAR_GROUP_VALIDATOR(this.group);
+    },
+
     initialKindStyle() {
       const randomGradientColorStops = this.randomizeGradientColorStops();
       return {
@@ -1773,6 +1814,10 @@ const MAX_GRADIENT_COLORS_100 = 2;
         '--avatar-gradient-stop-2': `var(--${randomGradientColorStops[1]})`,
         '--avatar-gradient-stop-3': `var(--${randomGradientColorStops[2]})`
       };
+    },
+
+    formattedGroup() {
+      return this.group > 99 ? '99+' : this.group;
     }
 
   },
@@ -1790,31 +1835,46 @@ const MAX_GRADIENT_COLORS_100 = 2;
 
   methods: {
     init() {
-      const firstChild = this.$el.children[0] || this.$el;
+      const firstChild = this.$refs.canvas.children[0] || this.$refs.canvas;
 
-      if (firstChild) {
-        this.setKind(firstChild);
+      if (!firstChild) {
+        return;
+      }
+
+      this.setKind(firstChild);
+      this.kindHandler(firstChild);
+    },
 
-        if (this.kind === 'image') {
-          firstChild.classList.add('d-avatar__image');
+    kindHandler(el) {
+      switch (this.kind) {
+        case 'image':
+          el.classList.add('d-avatar__image');
           this.validateImageAttrsPresence();
-          firstChild.addEventListener('error', () => {
-            this.formatInitials(this.initials);
-            this.imageLoadedSuccessfully = false;
-          });
-          firstChild.addEventListener('load', () => {
-            firstChild.classList.add('d-avatar--image-loaded');
-            this.imageLoadedSuccessfully = true;
-          });
-        }
+          this.setImageListeners(el);
+          break;
+
+        case 'icon':
+          el.classList.add(AVATAR_KIND_MODIFIERS.icon);
+          break;
 
-        if (this.kind === 'initials') {
-          this.slottedInitials = firstChild.textContent;
+        case 'initials':
+          this.slottedInitials = el.textContent;
           this.formatInitials(this.slottedInitials);
-        }
+          break;
       }
     },
 
+    setImageListeners(el) {
+      el.addEventListener('error', () => {
+        this.formatInitials(this.initials);
+        this.imageLoadedSuccessfully = false;
+      });
+      el.addEventListener('load', () => {
+        el.classList.add('d-avatar--image-loaded');
+        this.imageLoadedSuccessfully = true;
+      });
+    },
+
     formatInitials(initials) {
       if (!initials) return;
 
@@ -1881,8 +1941,8 @@ const MAX_GRADIENT_COLORS_100 = 2;
     },
 
     validateImageAttrsPresence() {
-      const isSrcMissing = !this.$el.children[0].getAttribute('src');
-      const isAltMissing = !this.$el.children[0].getAttribute('alt');
+      const isSrcMissing = !this.$refs.canvas.children[0].getAttribute('src');
+      const isAltMissing = !this.$refs.canvas.children[0].getAttribute('alt');
 
       if (isSrcMissing || isAltMissing) {
         (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.warn)('src and alt attributes are required for image avatars', this);
@@ -1893,10 +1953,10 @@ const MAX_GRADIENT_COLORS_100 = 2;
 });
 ;// CONCATENATED MODULE: ./components/avatar/avatar.vue?vue&type=script&lang=js
  
-;// CONCATENATED MODULE: ./node_modules/mini-css-extract-plugin/dist/loader.js??clonedRuleSet-74.use[0]!./node_modules/css-loader/dist/cjs.js??clonedRuleSet-74.use[1]!./node_modules/vue-loader/dist/stylePostLoader.js!./node_modules/postcss-loader/dist/cjs.js??clonedRuleSet-74.use[2]!./node_modules/less-loader/dist/cjs.js??clonedRuleSet-74.use[3]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./components/avatar/avatar.vue?vue&type=style&index=0&id=3cb27068&lang=less
+;// CONCATENATED MODULE: ./node_modules/mini-css-extract-plugin/dist/loader.js??clonedRuleSet-74.use[0]!./node_modules/css-loader/dist/cjs.js??clonedRuleSet-74.use[1]!./node_modules/vue-loader/dist/stylePostLoader.js!./node_modules/postcss-loader/dist/cjs.js??clonedRuleSet-74.use[2]!./node_modules/less-loader/dist/cjs.js??clonedRuleSet-74.use[3]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./components/avatar/avatar.vue?vue&type=style&index=0&id=4cb798be&lang=less
 // extracted by mini-css-extract-plugin
 
-;// CONCATENATED MODULE: ./components/avatar/avatar.vue?vue&type=style&index=0&id=3cb27068&lang=less
+;// CONCATENATED MODULE: ./components/avatar/avatar.vue?vue&type=style&index=0&id=4cb798be&lang=less
 
 ;// CONCATENATED MODULE: ./components/avatar/avatar.vue
 
@@ -1921,7 +1981,7 @@ const badgevue_type_template_id_741d001d_hoisted_1 = {
 const badgevue_type_template_id_741d001d_hoisted_2 = {
   class: "d-badge__label"
 };
-const _hoisted_3 = {
+const badgevue_type_template_id_741d001d_hoisted_3 = {
   key: 1,
   class: "d-badge__icon-right"
 };
@@ -1934,7 +1994,7 @@ function badgevue_type_template_id_741d001d_render(_ctx, _cache, $props, $setup,
   }, [$props.iconLeft || $props.type === 'ai' ? ((0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.openBlock)(), (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createElementBlock)("span", badgevue_type_template_id_741d001d_hoisted_1, [(0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createVNode)(_component_dt_icon, {
     name: $props.iconLeft || 'dialpad-ai',
     size: "200"
-  }, null, 8, ["name"])])) : (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createCommentVNode)("", true), (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createElementVNode)("span", badgevue_type_template_id_741d001d_hoisted_2, [(0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.renderSlot)(_ctx.$slots, "default", {}, () => [(0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createTextVNode)((0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.toDisplayString)($props.text), 1)])]), $props.iconRight ? ((0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.openBlock)(), (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createElementBlock)("span", _hoisted_3, [(0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createVNode)(_component_dt_icon, {
+  }, null, 8, ["name"])])) : (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createCommentVNode)("", true), (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createElementVNode)("span", badgevue_type_template_id_741d001d_hoisted_2, [(0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.renderSlot)(_ctx.$slots, "default", {}, () => [(0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createTextVNode)((0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.toDisplayString)($props.text), 1)])]), $props.iconRight ? ((0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.openBlock)(), (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createElementBlock)("span", badgevue_type_template_id_741d001d_hoisted_3, [(0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createVNode)(_component_dt_icon, {
     name: $props.iconRight,
     size: "200"
   }, null, 8, ["name"])])) : (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createCommentVNode)("", true)], 2);
@@ -6393,11 +6453,11 @@ function dropdownvue_type_template_id_878a8588_render(_ctx, _cache, $props, $set
 }
 ;// CONCATENATED MODULE: ./components/dropdown/dropdown.vue?vue&type=template&id=878a8588
 
-;// CONCATENATED MODULE: ./node_modules/thread-loader/dist/cjs.js!./node_modules/babel-loader/lib/index.js??clonedRuleSet-82.use[1]!./node_modules/vue-loader/dist/templateLoader.js??ruleSet[1].rules[3]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./components/popover/popover.vue?vue&type=template&id=4654097b
+;// CONCATENATED MODULE: ./node_modules/thread-loader/dist/cjs.js!./node_modules/babel-loader/lib/index.js??clonedRuleSet-82.use[1]!./node_modules/vue-loader/dist/templateLoader.js??ruleSet[1].rules[3]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./components/popover/popover.vue?vue&type=template&id=6557f2d6
 
-const popovervue_type_template_id_4654097b_hoisted_1 = ["aria-hidden"];
-const popovervue_type_template_id_4654097b_hoisted_2 = ["id", "tabindex"];
-function popovervue_type_template_id_4654097b_render(_ctx, _cache, $props, $setup, $data, $options) {
+const popovervue_type_template_id_6557f2d6_hoisted_1 = ["aria-hidden"];
+const popovervue_type_template_id_6557f2d6_hoisted_2 = ["id", "tabindex"];
+function popovervue_type_template_id_6557f2d6_render(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_popover_header_footer = (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.resolveComponent)("popover-header-footer");
 
   const _component_sr_only_close_button = (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.resolveComponent)("sr-only-close-button");
@@ -6411,7 +6471,7 @@ function popovervue_type_template_id_4654097b_render(_ctx, _cache, $props, $setu
     class: "d-modal--transparent",
     "aria-hidden": $props.modal && $data.isOpen ? 'false' : 'true',
     onClick: _cache[0] || (_cache[0] = (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.withModifiers)(() => {}, ["prevent", "stop"]))
-  }, null, 8, popovervue_type_template_id_4654097b_hoisted_1)])) : (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createCommentVNode)("", true), ((0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.openBlock)(), (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createBlock)((0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.resolveDynamicComponent)($props.elementType), {
+  }, null, 8, popovervue_type_template_id_6557f2d6_hoisted_1)])) : (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createCommentVNode)("", true), ((0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.openBlock)(), (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createBlock)((0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.resolveDynamicComponent)($props.elementType), {
     ref: "popover",
     class: (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.normalizeClass)(['d-popover', {
       'd-popover__anchor--opened': $data.isOpen
@@ -6443,7 +6503,7 @@ function popovervue_type_template_id_4654097b_render(_ctx, _cache, $props, $setu
         'aria-controls': $props.id,
         'aria-haspopup': $props.role
       }
-    })], 40, popovervue_type_template_id_4654097b_hoisted_2), (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createVNode)(_component_dt_lazy_show, (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.mergeProps)({
+    })], 40, popovervue_type_template_id_6557f2d6_hoisted_2), (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createVNode)(_component_dt_lazy_show, (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.mergeProps)({
       id: $props.id,
       ref: "content",
       role: $props.role,
@@ -6506,7 +6566,7 @@ function popovervue_type_template_id_4654097b_render(_ctx, _cache, $props, $setu
     _: 3
   }, 8, ["class"]))]);
 }
-;// CONCATENATED MODULE: ./components/popover/popover.vue?vue&type=template&id=4654097b
+;// CONCATENATED MODULE: ./components/popover/popover.vue?vue&type=template&id=6557f2d6
 
 ;// CONCATENATED MODULE: ./node_modules/@popperjs/core/lib/dom-utils/getWindow.js
 function getWindow(node) {
@@ -11674,11 +11734,9 @@ const popover_header_footer_exports_ = /*#__PURE__*/(0,exportHelper/* default */
     isOpen(isOpen, isPrev) {
       if (isOpen) {
         this.initTippyInstance();
-        this.preventScrolling();
       } else if (!isOpen && isPrev !== isOpen) {
         this.removeEventListeners();
         this.tip.hide();
-        this.enableScrolling();
       }
     }
 
@@ -11869,6 +11927,7 @@ const popover_header_footer_exports_ = /*#__PURE__*/(0,exportHelper/* default */
       }
 
       (_this$tip8 = this.tip) === null || _this$tip8 === void 0 ? void 0 : _this$tip8.unmount();
+      this.enableScrolling();
       this.$emit('opened', false);
 
       if (this.open !== null) {
@@ -11877,7 +11936,8 @@ const popover_header_footer_exports_ = /*#__PURE__*/(0,exportHelper/* default */
     },
 
     async onEnterTransitionComplete() {
-      this.focusInitialElement(); // await next tick in case the user wants to change focus themselves.
+      this.focusInitialElement();
+      this.preventScrolling(); // await next tick in case the user wants to change focus themselves.
 
       await this.$nextTick();
       this.$emit('opened', true, this.$refs.popover__content);
@@ -11994,10 +12054,10 @@ const popover_header_footer_exports_ = /*#__PURE__*/(0,exportHelper/* default */
 });
 ;// CONCATENATED MODULE: ./components/popover/popover.vue?vue&type=script&lang=js
  
-;// CONCATENATED MODULE: ./node_modules/mini-css-extract-plugin/dist/loader.js??clonedRuleSet-74.use[0]!./node_modules/css-loader/dist/cjs.js??clonedRuleSet-74.use[1]!./node_modules/vue-loader/dist/stylePostLoader.js!./node_modules/postcss-loader/dist/cjs.js??clonedRuleSet-74.use[2]!./node_modules/less-loader/dist/cjs.js??clonedRuleSet-74.use[3]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./components/popover/popover.vue?vue&type=style&index=0&id=4654097b&lang=less
+;// CONCATENATED MODULE: ./node_modules/mini-css-extract-plugin/dist/loader.js??clonedRuleSet-74.use[0]!./node_modules/css-loader/dist/cjs.js??clonedRuleSet-74.use[1]!./node_modules/vue-loader/dist/stylePostLoader.js!./node_modules/postcss-loader/dist/cjs.js??clonedRuleSet-74.use[2]!./node_modules/less-loader/dist/cjs.js??clonedRuleSet-74.use[3]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./components/popover/popover.vue?vue&type=style&index=0&id=6557f2d6&lang=less
 // extracted by mini-css-extract-plugin
 
-;// CONCATENATED MODULE: ./components/popover/popover.vue?vue&type=style&index=0&id=4654097b&lang=less
+;// CONCATENATED MODULE: ./components/popover/popover.vue?vue&type=style&index=0&id=6557f2d6&lang=less
 
 ;// CONCATENATED MODULE: ./components/popover/popover.vue
 
@@ -12007,7 +12067,7 @@ const popover_header_footer_exports_ = /*#__PURE__*/(0,exportHelper/* default */
 ;
 
 
-const popover_exports_ = /*#__PURE__*/(0,exportHelper/* default */.Z)(popovervue_type_script_lang_js, [['render',popovervue_type_template_id_4654097b_render]])
+const popover_exports_ = /*#__PURE__*/(0,exportHelper/* default */.Z)(popovervue_type_script_lang_js, [['render',popovervue_type_template_id_6557f2d6_render]])
 
 /* harmony default export */ const popover = (popover_exports_);
 ;// CONCATENATED MODULE: ./components/popover/index.js
@@ -17891,15 +17951,15 @@ const keyboard_shortcut_exports_ = /*#__PURE__*/(0,exportHelper/* default */.Z)(
 ;// CONCATENATED MODULE: ./components/keyboard_shortcut/index.js
 
 
-;// CONCATENATED MODULE: ./node_modules/thread-loader/dist/cjs.js!./node_modules/babel-loader/lib/index.js??clonedRuleSet-82.use[1]!./node_modules/vue-loader/dist/templateLoader.js??ruleSet[1].rules[3]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./components/root_layout/root_layout.vue?vue&type=template&id=3670772e
+;// CONCATENATED MODULE: ./node_modules/thread-loader/dist/cjs.js!./node_modules/babel-loader/lib/index.js??clonedRuleSet-82.use[1]!./node_modules/vue-loader/dist/templateLoader.js??ruleSet[1].rules[3]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./components/root_layout/root_layout.vue?vue&type=template&id=115594cd
 
-const root_layoutvue_type_template_id_3670772e_hoisted_1 = {
+const root_layoutvue_type_template_id_115594cd_hoisted_1 = {
   class: "root-layout d-root-layout"
 };
-function root_layoutvue_type_template_id_3670772e_render(_ctx, _cache, $props, $setup, $data, $options) {
+function root_layoutvue_type_template_id_115594cd_render(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_dt_root_layout_body = (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.resolveComponent)("dt-root-layout-body");
 
-  return (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.openBlock)(), (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createElementBlock)("div", root_layoutvue_type_template_id_3670772e_hoisted_1, [$data.hasSlotContent(_ctx.$slots.header) ? ((0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.openBlock)(), (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createElementBlock)("header", {
+  return (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.openBlock)(), (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createElementBlock)("div", root_layoutvue_type_template_id_115594cd_hoisted_1, [$data.hasSlotContent(_ctx.$slots.header) ? ((0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.openBlock)(), (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createElementBlock)("header", {
     key: 0,
     class: (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.normalizeClass)(['root-layout__header', $props.headerClass, {
       'root-layout__header--sticky': $props.headerSticky
@@ -17916,8 +17976,8 @@ function root_layoutvue_type_template_id_3670772e_render(_ctx, _cache, $props, $
     "sidebar-class": $props.sidebarClass,
     "sidebar-width": $props.sidebarWidth,
     "sidebar-position": $props.sidebarPosition,
-    "header-height": $props.headerHeight,
-    "footer-height": $props.footerHeight,
+    "header-height": $data.hasSlotContent(_ctx.$slots.header) ? $props.headerHeight : '0px',
+    "footer-height": $data.hasSlotContent(_ctx.$slots.footer) ? $props.footerHeight : '0px',
     fixed: $props.fixed
   }, (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createSlots)({
     _: 2
@@ -17939,7 +17999,7 @@ function root_layoutvue_type_template_id_3670772e_render(_ctx, _cache, $props, $
     "data-qa": "root-layout-footer"
   }, [(0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.renderSlot)(_ctx.$slots, "footer")], 6)) : (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createCommentVNode)("", true)]);
 }
-;// CONCATENATED MODULE: ./components/root_layout/root_layout.vue?vue&type=template&id=3670772e
+;// CONCATENATED MODULE: ./components/root_layout/root_layout.vue?vue&type=template&id=115594cd
 
 ;// CONCATENATED MODULE: ./node_modules/thread-loader/dist/cjs.js!./node_modules/babel-loader/lib/index.js??clonedRuleSet-82.use[1]!./node_modules/vue-loader/dist/templateLoader.js??ruleSet[1].rules[3]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./components/root_layout/root_layout_body.vue?vue&type=template&id=e95be78c
 
@@ -18262,10 +18322,10 @@ const root_layout_body_exports_ = /*#__PURE__*/(0,exportHelper/* default */.Z)(r
 });
 ;// CONCATENATED MODULE: ./components/root_layout/root_layout.vue?vue&type=script&lang=js
  
-;// CONCATENATED MODULE: ./node_modules/mini-css-extract-plugin/dist/loader.js??clonedRuleSet-74.use[0]!./node_modules/css-loader/dist/cjs.js??clonedRuleSet-74.use[1]!./node_modules/vue-loader/dist/stylePostLoader.js!./node_modules/postcss-loader/dist/cjs.js??clonedRuleSet-74.use[2]!./node_modules/less-loader/dist/cjs.js??clonedRuleSet-74.use[3]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./components/root_layout/root_layout.vue?vue&type=style&index=0&id=3670772e&lang=less
+;// CONCATENATED MODULE: ./node_modules/mini-css-extract-plugin/dist/loader.js??clonedRuleSet-74.use[0]!./node_modules/css-loader/dist/cjs.js??clonedRuleSet-74.use[1]!./node_modules/vue-loader/dist/stylePostLoader.js!./node_modules/postcss-loader/dist/cjs.js??clonedRuleSet-74.use[2]!./node_modules/less-loader/dist/cjs.js??clonedRuleSet-74.use[3]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./components/root_layout/root_layout.vue?vue&type=style&index=0&id=115594cd&lang=less
 // extracted by mini-css-extract-plugin
 
-;// CONCATENATED MODULE: ./components/root_layout/root_layout.vue?vue&type=style&index=0&id=3670772e&lang=less
+;// CONCATENATED MODULE: ./components/root_layout/root_layout.vue?vue&type=style&index=0&id=115594cd&lang=less
 
 ;// CONCATENATED MODULE: ./components/root_layout/root_layout.vue
 
@@ -18275,7 +18335,7 @@ const root_layout_body_exports_ = /*#__PURE__*/(0,exportHelper/* default */.Z)(r
 ;
 
 
-const root_layout_exports_ = /*#__PURE__*/(0,exportHelper/* default */.Z)(root_layoutvue_type_script_lang_js, [['render',root_layoutvue_type_template_id_3670772e_render]])
+const root_layout_exports_ = /*#__PURE__*/(0,exportHelper/* default */.Z)(root_layoutvue_type_script_lang_js, [['render',root_layoutvue_type_template_id_115594cd_render]])
 
 /* harmony default export */ const root_layout = (root_layout_exports_);
 ;// CONCATENATED MODULE: ./components/root_layout/index.js