@dialpad/dialtone-vue 2.60.0 → 2.61.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (6) hide show
  1. package/CHANGELOG.json +1 -1
  2. package/CHANGELOG.md +14 -0
  3. package/dist/dialtone-vue.common.js +82 -29
  4. package/dist/dialtone-vue.umd.js +80 -27
  5. package/dist/dialtone-vue.umd.min.js +1 -1
  6. package/package.json +2 -2
package/CHANGELOG.md CHANGED
@@ -1,3 +1,17 @@
1
+ # [2.61.0](https://github.com/dialpad/dialtone-vue/compare/v2.60.0...v2.61.0) (2023-03-01)
2
+
3
+
4
+ ### Bug Fixes
5
+
6
+ * **Combobox:** popover close on scroll ([#779](https://github.com/dialpad/dialtone-vue/issues/779)) ([7cbb916](https://github.com/dialpad/dialtone-vue/commit/7cbb91607346fed731f122738eb4e3e4633afa9f))
7
+
8
+
9
+ ### Features
10
+
11
+ * **Leftbar General Row:** additional styles ([#786](https://github.com/dialpad/dialtone-vue/issues/786)) ([c803bc0](https://github.com/dialpad/dialtone-vue/commit/c803bc0ddfd6d42394f9543d1a059651fa58ea46))
12
+ * **Leftbar:** update text-overflow style ([#789](https://github.com/dialpad/dialtone-vue/issues/789)) ([d6873a8](https://github.com/dialpad/dialtone-vue/commit/d6873a83684c822ea696d65c9a46acbbc29ea495))
13
+ * **Theme:** update sidebar theme vars ([#782](https://github.com/dialpad/dialtone-vue/issues/782)) ([1c0584f](https://github.com/dialpad/dialtone-vue/commit/1c0584f3c865180573ab5194bc5833f77bee5686))
14
+
1
15
  # [2.60.0](https://github.com/dialpad/dialtone-vue/compare/v2.59.2...v2.60.0) (2023-02-28)
2
16
 
3
17
 
package/dist/dialtone-vue.common.js CHANGED
@@ -402,7 +402,7 @@ __webpack_require__.r(__webpack_exports__);
402
402
 
403
403
  var ___CSS_LOADER_EXPORT___ = _node_modules_vue_cli_service_node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1___default()((_node_modules_vue_cli_service_node_modules_css_loader_dist_runtime_noSourceMaps_js__WEBPACK_IMPORTED_MODULE_0___default()));
404
404
  // Module
405
- ___CSS_LOADER_EXPORT___.push([module.id, ".dt-leftbar-row{--leftbar-row-color-foreground:var(--fc-primary);--leftbar-row-color-background:transparent;--leftbar-row-radius:100em;--leftbar-row-alpha-color-foreground:var(--fc-secondary);--leftbar-row-alpha-width:calc(var(--size-300)*10);--leftbar-row-alpha-height:calc(var(--size-300)*9);--leftbar-row-omega-min-width:var(--leftbar-row-alpha-width);--leftbar-row-omega-height:var(--leftbar-row-alpha-height);--leftbar-row-omega-visibility:visible;--leftbar-row-description-font-weight:var(--fw-normal);--leftbar-row-description-font-size:var(--fs-200);--leftbar-row-description-line-height:var(--lh-200);--leftbar-row-status-color-foreground:var(--fc-secondary);--leftbar-row-status-font-size:var(--fs-100);--leftbar-row-status-line-height:var(--lh-100);--leftbar-row-action-position-right:var(--size-400);--leftbar-row-action-position-bottom:50%;--leftbar-row-action-width:calc(var(--size-300)*6);--leftbar-row-action-height:var(--leftbar-row-action-width);position:relative}.dt-leftbar-row--has-unread{--leftbar-row-description-font-weight:var(--fw-bold);--leftbar-row-alpha-color-foreground:var(--leftbar-row-color-foreground)}.dt-leftbar-row--has-unread:not(.dt-leftbar-row--no-action):hover{--leftbar-row-omega-visibility:hidden}.dt-leftbar-row--selected{--leftbar-row-color-background:var(--black-200)}.dt-leftbar-row--action-focused{--leftbar-row-omega-visibility:hidden}.dt-leftbar-row__primary{display:flex;align-items:center;flex:1;width:100%;text-align:left;color:var(--leftbar-row-color-foreground);text-decoration:none;background-color:var(--leftbar-row-color-background);border-radius:var(--leftbar-row-radius);transition-duration:var(--td200);transition-property:background-color,border,box-shadow;transition-timing-function:var(--ttf-out-quint);-webkit-appearance:none;appearance:none;font-size:inhert;line-height:inherit;margin:0;border:0;padding:0;cursor:pointer}.dt-leftbar-row__primary:hover{--leftbar-row-color-background:var(--black-200)}.dt-leftbar-row__primary:active{--leftbar-row-color-background:var(--black-300)}.dt-leftbar-row__primary:focus-visible{box-shadow:var(--bs-focus-ring-inset)}.dt-leftbar-row__action{position:absolute;right:var(--leftbar-row-action-position-right);top:var(--leftbar-row-action-position-bottom);transform:translateY(calc(var(--leftbar-row-action-position-bottom)*-1));opacity:0}.dt-leftbar-row:hover .dt-leftbar-row__action,.dt-leftbar-row__action:focus,.dt-leftbar-row__action:focus-within{opacity:1}.dt-leftbar-row__action-button{width:var(--leftbar-row-action-width);height:var(--leftbar-row-action-height)}.dt-leftbar-row__alpha{color:var(--leftbar-row-alpha-color-foreground);display:flex;box-sizing:border-box;justify-content:center;align-items:center;padding-left:var(--space-400);padding-right:var(--space-400);width:var(--leftbar-row-alpha-width);height:var(--leftbar-row-alpha-height)}.dt-leftbar-row__label{flex:1;min-width:0}.dt-leftbar-row__omega{display:flex;gap:var(--space-300);justify-content:end;align-items:center;box-sizing:border-box;min-width:var(--leftbar-row-omega-min-width);height:var(--leftbar-row-omega-height);padding-left:var(--space-400);padding-right:var(--space-400);visibility:var(--leftbar-row-omega-visibility)}.dt-leftbar-row__description{font-weight:var(--leftbar-row-description-font-weight);font-size:var(--leftbar-row-description-font-size);line-height:var(--leftbar-row-description-line-height)}.dt-leftbar-row__description,.dt-leftbar-row__status{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.dt-leftbar-row__status{color:var(--leftbar-row-status-color-foreground);font-size:var(--leftbar-row-status-font-size);line-height:var(--leftbar-row-status-line-height);padding-bottom:var(--space-100)}.dt-leftbar-row__meta-context~.dt-leftbar-row__meta-custom:not(:empty):before{content:\" • \";color:var(--fc-tertiary)}.dt-leftbar-row__icon-cc{border-radius:var(--size-200);width:calc(var(--size-300)*3.5);height:calc(var(--size-300)*3.5)}", ""]);
405
+ ___CSS_LOADER_EXPORT___.push([module.id, ".dt-leftbar-row{--leftbar-row-color-foreground:var(--theme-sidebar-color);--leftbar-row-color-background:transparent;--leftbar-row-radius:100em;--leftbar-row-alpha-color-foreground:var(--theme-sidebar-icon-color);--leftbar-row-alpha-width:calc(var(--size-300)*10);--leftbar-row-alpha-height:calc(var(--size-300)*9);--leftbar-row-alpha-opacity:100%;--leftbar-row-omega-min-width:0;--leftbar-row-omega-height:var(--leftbar-row-alpha-height);--leftbar-row-omega-visibility:visible;--leftbar-row-description-font-weight:var(--fw-normal);--leftbar-row-description-font-size:var(--fs-200);--leftbar-row-description-line-height:var(--lh-200);--leftbar-row-description-opacity:100%;--leftbar-row-status-color-foreground:var(--theme-sidebar-status-color);--leftbar-row-status-font-size:var(--fs-100);--leftbar-row-status-line-height:var(--lh-100);--leftbar-row-action-position-right:var(--size-400);--leftbar-row-action-position-bottom:50%;--leftbar-row-action-width:calc(var(--size-300)*6);--leftbar-row-action-height:var(--leftbar-row-action-width);position:relative}.dt-leftbar-row:not(.dt-leftbar-row--no-action):hover{--leftbar-row-omega-min-width:var(--leftbar-row-alpha-width)}.dt-leftbar-row--has-unread{--leftbar-row-description-font-weight:var(--fw-bold);--leftbar-row-alpha-color-foreground:var(--leftbar-row-color-foreground)}.dt-leftbar-row--has-unread:not(.dt-leftbar-row--no-action):hover{--leftbar-row-omega-visibility:hidden}.dt-leftbar-row--muted{--leftbar-row-alpha-opacity:50%;--leftbar-row-description-opacity:60%}.dt-leftbar-row--selected{--leftbar-row-color-background:var(--theme-sidebar-active-row-color-background);--leftbar-row-color-foreground:var(--theme-sidebar-active-row-color)}.dt-leftbar-row--selected .d-avatar__count{--avatar-count-color-shadow:var(--theme-sidebar-active-row-color-background)}.dt-leftbar-row--action-focused{--leftbar-row-omega-visibility:hidden}.dt-leftbar-row__primary{display:flex;align-items:center;flex:1;width:100%;text-align:left;color:var(--leftbar-row-color-foreground);text-decoration:none;background-color:var(--leftbar-row-color-background);border-radius:var(--leftbar-row-radius);transition-duration:var(--td200);transition-property:background-color,border,box-shadow;transition-timing-function:var(--ttf-out-quint);-webkit-appearance:none;appearance:none;font-size:inhert;line-height:inherit;margin:0;border:0;padding:0;cursor:pointer}.dt-leftbar-row__primary:hover{--leftbar-row-color-background:var(--theme-sidebar-row-color-background-hover)}.dt-leftbar-row__primary:active{--leftbar-row-color-background:var(--theme-sidebar-active-row-color-background)}.dt-leftbar-row__primary:focus-visible{box-shadow:var(--bs-focus-ring-inset)}.dt-leftbar-row__action{position:absolute;right:var(--leftbar-row-action-position-right);top:var(--leftbar-row-action-position-bottom);transform:translateY(calc(var(--leftbar-row-action-position-bottom)*-1));opacity:0}.dt-leftbar-row:hover .dt-leftbar-row__action,.dt-leftbar-row__action:focus,.dt-leftbar-row__action:focus-within{opacity:1}.dt-leftbar-row__action-button{width:var(--leftbar-row-action-width);height:var(--leftbar-row-action-height)}.dt-leftbar-row__alpha{color:var(--leftbar-row-alpha-color-foreground);display:flex;box-sizing:border-box;justify-content:center;align-items:center;padding-left:var(--space-400);padding-right:var(--space-400);width:var(--leftbar-row-alpha-width);height:var(--leftbar-row-alpha-height);opacity:var(--leftbar-row-alpha-opacity)}.dt-leftbar-row__label{flex:1;min-width:0}.dt-leftbar-row__omega{display:flex;gap:var(--space-300);justify-content:end;align-items:center;box-sizing:border-box;min-width:var(--leftbar-row-omega-min-width);height:var(--leftbar-row-omega-height);padding-left:var(--space-400);padding-right:var(--space-400);visibility:var(--leftbar-row-omega-visibility)}.dt-leftbar-row__active-voice{color:var(--fc-success);-webkit-animation-name:opacity-pulsate;-webkit-animation-duration:1s;-webkit-animation-iteration-count:infinite;-webkit-animation-fill-mode:both;-moz-animation-name:opacity-pulsate;-moz-animation-duration:1s;-moz-animation-iteration-count:infinite;-moz-animation-fill-mode:both;animation-name:opacity-pulsate;animation-duration:1s;animation-iteration-count:infinite;animation-fill-mode:both}.dt-leftbar-row__dnd{color:var(--black-600);font-size:var(--fs-100);font-weight:var(--fw-bold)}.dt-leftbar-row__description{font-weight:var(--leftbar-row-description-font-weight);font-size:var(--leftbar-row-description-font-size);line-height:var(--leftbar-row-description-line-height);opacity:var(--leftbar-row-description-opacity)}.dt-leftbar-row__description,.dt-leftbar-row__status{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.dt-leftbar-row__status{color:var(--leftbar-row-status-color-foreground);font-size:var(--leftbar-row-status-font-size);line-height:var(--leftbar-row-status-line-height);padding-bottom:var(--space-100)}.dt-leftbar-row__meta-context~.dt-leftbar-row__meta-custom:not(:empty):before{content:\" • \";color:var(--theme-sidebar-status-color)}.dt-leftbar-row__icon-cc{border-radius:var(--size-200);width:calc(var(--size-300)*3.5);height:calc(var(--size-300)*3.5)}.opacity-pulsate{-webkit-animation-name:opacity-pulsate;-webkit-animation-duration:1s;-webkit-animation-iteration-count:infinite;-webkit-animation-fill-mode:both;-moz-animation-name:opacity-pulsate;-moz-animation-duration:1s;-moz-animation-iteration-count:infinite;-moz-animation-fill-mode:both;animation-name:opacity-pulsate;animation-duration:1s;animation-iteration-count:infinite;animation-fill-mode:both}@keyframes opacity-pulsate{0%,to{opacity:.2}50%{opacity:1}}", ""]);
406
406
  // Exports
407
407
  /* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (___CSS_LOADER_EXPORT___);
408
408
 
@@ -1560,7 +1560,7 @@ if ( true && module.exports) {
1560
1560
 
1561
1561
  /***/ }),
1562
1562
 
1563
- /***/ 559:
1563
+ /***/ 627:
1564
1564
  /***/ ((module, __unused_webpack_exports, __webpack_require__) => {
1565
1565
 
1566
1566
  // style-loader: Adds some css to the DOM by adding a <style> tag
@@ -7699,7 +7699,7 @@ var collapsible_lazy_showvue_type_template_id_3ceeeccc_staticRenderFns = []
7699
7699
  ;// CONCATENATED MODULE: ./components/collapsible/collapsible_lazy_show.vue?vue&type=script&lang=js&
7700
7700
  /* harmony default export */ const collapsible_collapsible_lazy_showvue_type_script_lang_js_ = (collapsible_lazy_showvue_type_script_lang_js_);
7701
7701
  // EXTERNAL MODULE: ./node_modules/vue-style-loader/index.js??clonedRuleSet-12[0].rules[0].use[0]!./node_modules/@vue/cli-service/node_modules/css-loader/dist/cjs.js??clonedRuleSet-12[0].rules[0].use[1]!./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/loaders/stylePostLoader.js!./node_modules/@vue/cli-service/node_modules/postcss-loader/dist/cjs.js??clonedRuleSet-12[0].rules[0].use[2]!./node_modules/@vue/cli-service/node_modules/postcss-loader/dist/cjs.js??clonedRuleSet-12[0].rules[0].use[3]!./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/index.js??vue-loader-options!./components/collapsible/collapsible_lazy_show.vue?vue&type=style&index=0&lang=css&
7702
- var collapsible_lazy_showvue_type_style_index_0_lang_css_ = __webpack_require__(559);
7702
+ var collapsible_lazy_showvue_type_style_index_0_lang_css_ = __webpack_require__(627);
7703
7703
  ;// CONCATENATED MODULE: ./components/collapsible/collapsible_lazy_show.vue?vue&type=style&index=0&lang=css&
7704
7704
 
7705
7705
  ;// CONCATENATED MODULE: ./components/collapsible/collapsible_lazy_show.vue
@@ -20912,15 +20912,15 @@ var stack_component = normalizeComponent(
20912
20912
  /* harmony default export */ const stack = (stack_component.exports);
20913
20913
  ;// CONCATENATED MODULE: ./components/stack/index.js
20914
20914
 
20915
- ;// CONCATENATED MODULE: ./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/loaders/templateLoader.js??vue-loader-options!./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/index.js??vue-loader-options!./recipes/comboboxes/combobox_with_popover/combobox_with_popover.vue?vue&type=template&id=2f87445e&
20916
- var combobox_with_popovervue_type_template_id_2f87445e_render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('dt-combobox',_vm._g({ref:"combobox",attrs:{"loading":_vm.loading,"label":_vm.label,"label-visible":_vm.labelVisible,"size":_vm.size,"description":_vm.description,"empty-list":_vm.emptyList,"empty-state-message":_vm.emptyStateMessage,"show-list":_vm.isListShown,"on-beginning-of-list":_vm.onBeginningOfList,"on-end-of-list":_vm.onEndOfList,"list-rendered-outside":true,"list-id":_vm.listId,"data-qa":"dt-combobox"},scopedSlots:_vm._u([{key:"input",fn:function(ref){
20915
+ ;// CONCATENATED MODULE: ./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/loaders/templateLoader.js??vue-loader-options!./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/index.js??vue-loader-options!./recipes/comboboxes/combobox_with_popover/combobox_with_popover.vue?vue&type=template&id=5bccf868&
20916
+ var combobox_with_popovervue_type_template_id_5bccf868_render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('dt-combobox',_vm._g({ref:"combobox",attrs:{"loading":_vm.loading,"label":_vm.label,"label-visible":_vm.labelVisible,"size":_vm.size,"description":_vm.description,"empty-list":_vm.emptyList,"empty-state-message":_vm.emptyStateMessage,"show-list":_vm.isListShown,"on-beginning-of-list":_vm.onBeginningOfList,"on-end-of-list":_vm.onEndOfList,"list-rendered-outside":true,"list-id":_vm.listId,"data-qa":"dt-combobox"},scopedSlots:_vm._u([{key:"input",fn:function(ref){
20917
20917
  var inputProps = ref.inputProps;
20918
20918
  return [_c('div',{ref:"input",attrs:{"id":_vm.externalAnchor},on:{"focusin":_vm.onFocusIn,"keydown":[function($event){if(!$event.type.indexOf('key')&&_vm._k($event.keyCode,"up",38,$event.key,["Up","ArrowUp"])){ return null; }return _vm.openOnArrowKeyPress($event)},function($event){if(!$event.type.indexOf('key')&&_vm._k($event.keyCode,"down",40,$event.key,["Down","ArrowDown"])){ return null; }return _vm.openOnArrowKeyPress($event)}]}},[_vm._t("input",null,{"inputProps":inputProps,"onInput":_vm.handleDisplayList})],2)]}},{key:"list",fn:function(ref){
20919
20919
  var opened = ref.opened;
20920
20920
  var listProps = ref.listProps;
20921
20921
  var clearHighlightIndex = ref.clearHighlightIndex;
20922
20922
  return [_c('dt-popover',{ref:"popover",attrs:{"open":_vm.isListShown,"hide-on-click":false,"max-height":_vm.maxHeight,"max-width":_vm.maxWidth,"offset":_vm.popoverOffset,"sticky":_vm.popoverSticky,"placement":"bottom-start","initial-focus-element":"none","padding":"none","role":"listbox","external-anchor":_vm.externalAnchor,"content-width":_vm.contentWidth,"content-tabindex":null,"modal":false,"auto-focus":false,"append-to":_vm.appendTo,"visually-hidden-close-label":_vm.visuallyHiddenCloseLabel,"visually-hidden-close":_vm.visuallyHiddenClose},on:{"update:open":function($event){_vm.isListShown=$event},"opened":function($event){return opened($event, arguments[1]);}},scopedSlots:_vm._u([{key:"headerContent",fn:function(){return [(_vm.$slots.header)?_c('div',{ref:"header"},[_vm._t("header")],2):_vm._e()]},proxy:true},{key:"content",fn:function(){return [_c('div',{ref:"listWrapper",class:[_vm.DROPDOWN_PADDING_CLASSES[_vm.padding], _vm.listClass],on:{"mouseleave":clearHighlightIndex,"focusout":clearHighlightIndex}},[(_vm.loading)?_c('combobox-loading-list',_vm._b({},'combobox-loading-list',listProps,false)):(_vm.emptyList && _vm.emptyStateMessage)?_c('combobox-empty-list',_vm._b({attrs:{"message":_vm.emptyStateMessage}},'combobox-empty-list',listProps,false)):_vm._t("list",null,{"listProps":listProps})],2)]},proxy:true},{key:"footerContent",fn:function(){return [(_vm.$slots.footer)?_c('div',{ref:"footer"},[_vm._t("footer")],2):_vm._e()]},proxy:true}],null,true)})]}}],null,true)},_vm.comboboxListeners))}
20923
- var combobox_with_popovervue_type_template_id_2f87445e_staticRenderFns = []
20923
+ var combobox_with_popovervue_type_template_id_5bccf868_staticRenderFns = []
20924
20924
 
20925
20925
 
20926
20926
  ;// CONCATENATED MODULE: ./node_modules/thread-loader/dist/cjs.js!./node_modules/babel-loader/lib/index.js??clonedRuleSet-40[0].rules[0].use[1]!./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/index.js??vue-loader-options!./recipes/comboboxes/combobox_with_popover/combobox_with_popover.vue?vue&type=script&lang=js&
@@ -21373,12 +21373,12 @@ var combobox_with_popovervue_type_template_id_2f87445e_staticRenderFns = []
21373
21373
  },
21374
21374
 
21375
21375
  onFocusOut(e) {
21376
+ var _this$$refs$popover$t, _e$composedPath;
21377
+
21376
21378
  // Check if the focus change was to another target within the combobox component
21377
- const isComboboxStillFocused = Object.keys(this.$refs).some(refName => {
21378
- const ref = this.$refs[refName];
21379
- return ref.$el ? ref.$el.contains(e.target) : ref.contains(e.target);
21380
- });
21381
- if (isComboboxStillFocused) return; // If outside the combobox then close
21379
+ const popoverEl = (_this$$refs$popover$t = this.$refs.popover.tip) === null || _this$$refs$popover$t === void 0 ? void 0 : _this$$refs$popover$t.popper;
21380
+ const comboboxEl = this.$refs.input;
21381
+ if ((_e$composedPath = e.composedPath()) !== null && _e$composedPath !== void 0 && _e$composedPath.some(el => [popoverEl, comboboxEl].includes(el))) return; // If outside the combobox then close
21382
21382
 
21383
21383
  this.closeComboboxList();
21384
21384
  },
@@ -21405,8 +21405,8 @@ var combobox_with_popovervue_type_template_id_2f87445e_staticRenderFns = []
21405
21405
  ;
21406
21406
  var combobox_with_popover_component = normalizeComponent(
21407
21407
  combobox_with_popover_combobox_with_popovervue_type_script_lang_js_,
21408
- combobox_with_popovervue_type_template_id_2f87445e_render,
21409
- combobox_with_popovervue_type_template_id_2f87445e_staticRenderFns,
21408
+ combobox_with_popovervue_type_template_id_5bccf868_render,
21409
+ combobox_with_popovervue_type_template_id_5bccf868_staticRenderFns,
21410
21410
  false,
21411
21411
  null,
21412
21412
  null,
@@ -23315,9 +23315,9 @@ var grouped_chip_component = normalizeComponent(
23315
23315
  /* harmony default export */ const grouped_chip = (grouped_chip_component.exports);
23316
23316
  ;// CONCATENATED MODULE: ./recipes/chips/grouped_chip/index.js
23317
23317
 
23318
- ;// CONCATENATED MODULE: ./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/loaders/templateLoader.js??vue-loader-options!./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/index.js??vue-loader-options!./recipes/leftbar/general_row/general_row.vue?vue&type=template&id=40a77fb7&
23319
- var general_rowvue_type_template_id_40a77fb7_render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{class:_vm.leftbarGeneralRowClasses,attrs:{"data-qa":"dt-leftbar-row"}},[_c('button',_vm._g(_vm._b({staticClass:"dt-leftbar-row__primary",attrs:{"data-qa":"dt-leftbar-row-link"}},'button',_vm.$attrs,false),_vm.$listeners),[_c('div',{staticClass:"dt-leftbar-row__alpha"},[_vm._t("left",function(){return [_c('dt-recipe-leftbar-general-row-icon',{attrs:{"type":_vm.getIcon,"color":_vm.color,"data-qa":"dt-leftbar-row-icon"}})]})],2),_c('div',{staticClass:"dt-leftbar-row__label"},[_c('dt-emoji-text-wrapper',{staticClass:"dt-leftbar-row__description",attrs:{"data-qa":"dt-leftbar-row-description"}},[_vm._v(" "+_vm._s(_vm.description)+" ")])],1),_c('div',{staticClass:"dt-leftbar-row__omega"},[(_vm.hasUnreadMessages)?_c('dt-badge',{attrs:{"kind":"count","type":"bulletin","data-qa":"dt-leftbar-row-unread-badge"}},[_vm._v(" "+_vm._s(_vm.unreadCount)+" ")]):_vm._e()],1)])])}
23320
- var general_rowvue_type_template_id_40a77fb7_staticRenderFns = []
23318
+ ;// CONCATENATED MODULE: ./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/loaders/templateLoader.js??vue-loader-options!./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/index.js??vue-loader-options!./recipes/leftbar/general_row/general_row.vue?vue&type=template&id=1889c7ad&
23319
+ var general_rowvue_type_template_id_1889c7ad_render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{class:_vm.leftbarGeneralRowClasses,attrs:{"data-qa":"dt-leftbar-row"}},[_c('button',_vm._g(_vm._b({staticClass:"dt-leftbar-row__primary",attrs:{"data-qa":"dt-leftbar-row-link"}},'button',_vm.$attrs,false),_vm.$listeners),[_c('div',{staticClass:"dt-leftbar-row__alpha"},[_vm._t("left",function(){return [_c('dt-recipe-leftbar-general-row-icon',{attrs:{"type":_vm.getIcon,"color":_vm.color,"data-qa":"dt-leftbar-row-icon"}})]})],2),_c('div',{staticClass:"dt-leftbar-row__label"},[_c('dt-emoji-text-wrapper',{staticClass:"dt-leftbar-row__description",attrs:{"data-qa":"dt-leftbar-row-description"}},[_vm._v(" "+_vm._s(_vm.description)+" ")])],1),_c('div',{staticClass:"dt-leftbar-row__omega"},[(_vm.dndText)?_c('div',{staticClass:"dt-leftbar-row__dnd"},[_vm._v(" "+_vm._s(_vm.dndText)+" ")]):(_vm.activeVoiceChat)?_c('div',{staticClass:"dt-leftbar-row__active-voice"},[_c('dt-icon',{attrs:{"size":"300","name":"activity"}})],1):(_vm.hasUnreadMessages)?_c('dt-badge',{attrs:{"kind":"count","type":"bulletin","data-qa":"dt-leftbar-row-unread-badge"}},[_vm._v(" "+_vm._s(_vm.unreadCount)+" ")]):_vm._e()],1)])])}
23320
+ var general_rowvue_type_template_id_1889c7ad_staticRenderFns = []
23321
23321
 
23322
23322
 
23323
23323
  ;// CONCATENATED MODULE: ./recipes/leftbar/general_row/general_row_constants.js
@@ -23328,7 +23328,9 @@ const LEFTBAR_GENERAL_ROW_TYPES = {
23328
23328
  THREADS: 'threads',
23329
23329
  LOCKED_CHANNEL: 'locked channel',
23330
23330
  CONTACT_CENTER: 'contact center',
23331
- DIALBOT: 'dialbot'
23331
+ DIALBOT: 'dialbot',
23332
+ ASSIGNED: 'assigned',
23333
+ DIGITAL: 'digital'
23332
23334
  };
23333
23335
  const LEFTBAR_GENERAL_ROW_ICON_MAPPING = {
23334
23336
  [LEFTBAR_GENERAL_ROW_TYPES.INBOX]: 'inbox',
@@ -23337,20 +23339,28 @@ const LEFTBAR_GENERAL_ROW_ICON_MAPPING = {
23337
23339
  [LEFTBAR_GENERAL_ROW_TYPES.THREADS]: 'thread',
23338
23340
  [LEFTBAR_GENERAL_ROW_TYPES.LOCKED_CHANNEL]: 'lock',
23339
23341
  'locked channel unread': 'lock-filled',
23340
- 'channel unread': 'hash-bold'
23342
+ 'channel unread': 'hash-bold',
23343
+ [LEFTBAR_GENERAL_ROW_TYPES.ASSIGNED]: 'at-sign',
23344
+ [LEFTBAR_GENERAL_ROW_TYPES.DIGITAL]: 'message'
23341
23345
  };
23342
23346
  const LEFTBAR_GENERAL_ROW_CONTACT_CENTER_COLORS = {
23343
- purple: 'd-bgc-purple-300',
23344
- blue: 'd-bgc-blue-300',
23345
- green: 'd-bgc-green-300',
23346
- red: 'd-bgc-red-300',
23347
- magenta: 'd-bgc-magenta-300',
23348
- gold: 'd-bgc-gold-300'
23347
+ 'magenta-200': 'd-bgc-magenta-200',
23348
+ 'green-200': 'd-bgc-green-200',
23349
+ 'gold-300': 'd-bgc-gold-300',
23350
+ 'purple-600': 'd-bgc-purple-600',
23351
+ 'magenta-300': 'd-bgc-magenta-300',
23352
+ 'purple-300': 'd-bgc-purple-300',
23353
+ 'green-500': 'd-bgc-green-500',
23354
+ 'purple-100': 'd-bgc-purple-100',
23355
+ 'magenta-400': 'd-bgc-magenta-400',
23356
+ 'magenta-100': 'd-bgc-magenta-100'
23349
23357
  };
23358
+ const LEFTBAR_GENERAL_ROW_CONTACT_CENTER_VALIDATION_ERROR = 'If type is contact center, color must be one' + 'of the following:' + Object.keys(LEFTBAR_GENERAL_ROW_CONTACT_CENTER_COLORS).join(', ');
23350
23359
  /* harmony default export */ const general_row_constants = ({
23351
23360
  LEFTBAR_GENERAL_ROW_TYPES,
23352
23361
  LEFTBAR_GENERAL_ROW_ICON_MAPPING,
23353
- LEFTBAR_GENERAL_ROW_CONTACT_CENTER_COLORS
23362
+ LEFTBAR_GENERAL_ROW_CONTACT_CENTER_COLORS,
23363
+ LEFTBAR_GENERAL_ROW_CONTACT_CENTER_VALIDATION_ERROR
23354
23364
  });
23355
23365
  ;// CONCATENATED MODULE: ./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/loaders/templateLoader.js??vue-loader-options!./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/index.js??vue-loader-options!./components/emoji/emoji.vue?vue&type=template&id=147e0534&
23356
23366
  var emojivue_type_template_id_147e0534_render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('span',{class:_vm.emojiSize},[_c('dt-skeleton',{directives:[{name:"show",rawName:"v-show",value:(_vm.imgLoading && _vm.showSkeleton),expression:"imgLoading && showSkeleton"}],class:_vm.emojiSize,attrs:{"offset":0,"shape-option":{ shape: 'square', contentClass: _vm.emojiSize, size: 'auto' }}}),_c('img',{directives:[{name:"show",rawName:"v-show",value:(!_vm.imgLoading),expression:"!imgLoading"}],ref:"emojiImg",class:['d-icon', _vm.emojiSize, _vm.imgClass],attrs:{"aria-label":_vm.emojiLabel,"alt":_vm.emojiAlt,"title":_vm.emojiLabel,"src":_vm.emojiSrc},on:{"load":_vm.imageLoaded,"error":_vm.imageErrored}})],1)}
@@ -24032,6 +24042,22 @@ var leftbar_general_row_icon_component = normalizeComponent(
24032
24042
  //
24033
24043
  //
24034
24044
  //
24045
+ //
24046
+ //
24047
+ //
24048
+ //
24049
+ //
24050
+ //
24051
+ //
24052
+ //
24053
+ //
24054
+ //
24055
+ //
24056
+ //
24057
+ //
24058
+ //
24059
+ //
24060
+
24035
24061
 
24036
24062
 
24037
24063
 
@@ -24041,6 +24067,7 @@ var leftbar_general_row_icon_component = normalizeComponent(
24041
24067
  components: {
24042
24068
  DtEmojiTextWrapper: emoji_text_wrapper,
24043
24069
  DtBadge: badge,
24070
+ DtIcon: icon,
24044
24071
  DtRecipeLeftbarGeneralRowIcon: leftbar_general_row_icon
24045
24072
  },
24046
24073
  inheritAttrs: false,
@@ -24090,13 +24117,39 @@ var leftbar_general_row_icon_component = normalizeComponent(
24090
24117
  selected: {
24091
24118
  type: Boolean,
24092
24119
  default: false
24120
+ },
24121
+
24122
+ /**
24123
+ * Gives a faded style to be used when muted
24124
+ */
24125
+ muted: {
24126
+ type: Boolean,
24127
+ default: false
24128
+ },
24129
+
24130
+ /**
24131
+ * Shows styling to represent an active voice chat. This will display over unreadCount.
24132
+ */
24133
+ activeVoiceChat: {
24134
+ type: Boolean,
24135
+ default: false
24136
+ },
24137
+
24138
+ /**
24139
+ * Acronym used to represent "Do not Disturb" state. If entered will display the entered text over
24140
+ * unreadCount and activeVoiceChat.
24141
+ */
24142
+ dndText: {
24143
+ type: String,
24144
+ default: ''
24093
24145
  }
24094
24146
  },
24095
24147
  computed: {
24096
24148
  leftbarGeneralRowClasses() {
24097
24149
  return ['dt-leftbar-row', 'dt-leftbar-row--no-action', {
24098
24150
  'dt-leftbar-row--has-unread': this.hasUnreadMessages,
24099
- 'dt-leftbar-row--selected': this.selected
24151
+ 'dt-leftbar-row--selected': this.selected,
24152
+ 'dt-leftbar-row--muted': this.muted
24100
24153
  }];
24101
24154
  },
24102
24155
 
@@ -24133,7 +24186,7 @@ var leftbar_general_row_icon_component = normalizeComponent(
24133
24186
  methods: {
24134
24187
  validateProps() {
24135
24188
  if (this.type === LEFTBAR_GENERAL_ROW_TYPES.CONTACT_CENTER && !Object.keys(LEFTBAR_GENERAL_ROW_CONTACT_CENTER_COLORS).includes(this.color)) {
24136
- console.error('If type is contact center, color must be one of the following: ' + Object.keys(LEFTBAR_GENERAL_ROW_CONTACT_CENTER_COLORS).join(', '));
24189
+ console.error(LEFTBAR_GENERAL_ROW_CONTACT_CENTER_VALIDATION_ERROR);
24137
24190
  }
24138
24191
  }
24139
24192
 
@@ -24156,8 +24209,8 @@ var general_rowvue_type_style_index_0_lang_less_ = __webpack_require__(641);
24156
24209
 
24157
24210
  var general_row_component = normalizeComponent(
24158
24211
  general_row_general_rowvue_type_script_lang_js_,
24159
- general_rowvue_type_template_id_40a77fb7_render,
24160
- general_rowvue_type_template_id_40a77fb7_staticRenderFns,
24212
+ general_rowvue_type_template_id_1889c7ad_render,
24213
+ general_rowvue_type_template_id_1889c7ad_staticRenderFns,
24161
24214
  false,
24162
24215
  null,
24163
24216
  null,
package/dist/dialtone-vue.umd.js CHANGED
@@ -412,7 +412,7 @@ __webpack_require__.r(__webpack_exports__);
412
412
 
413
413
  var ___CSS_LOADER_EXPORT___ = _node_modules_vue_cli_service_node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1___default()((_node_modules_vue_cli_service_node_modules_css_loader_dist_runtime_noSourceMaps_js__WEBPACK_IMPORTED_MODULE_0___default()));
414
414
  // Module
415
- ___CSS_LOADER_EXPORT___.push([module.id, ".dt-leftbar-row{--leftbar-row-color-foreground:var(--fc-primary);--leftbar-row-color-background:transparent;--leftbar-row-radius:100em;--leftbar-row-alpha-color-foreground:var(--fc-secondary);--leftbar-row-alpha-width:calc(var(--size-300)*10);--leftbar-row-alpha-height:calc(var(--size-300)*9);--leftbar-row-omega-min-width:var(--leftbar-row-alpha-width);--leftbar-row-omega-height:var(--leftbar-row-alpha-height);--leftbar-row-omega-visibility:visible;--leftbar-row-description-font-weight:var(--fw-normal);--leftbar-row-description-font-size:var(--fs-200);--leftbar-row-description-line-height:var(--lh-200);--leftbar-row-status-color-foreground:var(--fc-secondary);--leftbar-row-status-font-size:var(--fs-100);--leftbar-row-status-line-height:var(--lh-100);--leftbar-row-action-position-right:var(--size-400);--leftbar-row-action-position-bottom:50%;--leftbar-row-action-width:calc(var(--size-300)*6);--leftbar-row-action-height:var(--leftbar-row-action-width);position:relative}.dt-leftbar-row--has-unread{--leftbar-row-description-font-weight:var(--fw-bold);--leftbar-row-alpha-color-foreground:var(--leftbar-row-color-foreground)}.dt-leftbar-row--has-unread:not(.dt-leftbar-row--no-action):hover{--leftbar-row-omega-visibility:hidden}.dt-leftbar-row--selected{--leftbar-row-color-background:var(--black-200)}.dt-leftbar-row--action-focused{--leftbar-row-omega-visibility:hidden}.dt-leftbar-row__primary{display:flex;align-items:center;flex:1;width:100%;text-align:left;color:var(--leftbar-row-color-foreground);text-decoration:none;background-color:var(--leftbar-row-color-background);border-radius:var(--leftbar-row-radius);transition-duration:var(--td200);transition-property:background-color,border,box-shadow;transition-timing-function:var(--ttf-out-quint);-webkit-appearance:none;appearance:none;font-size:inhert;line-height:inherit;margin:0;border:0;padding:0;cursor:pointer}.dt-leftbar-row__primary:hover{--leftbar-row-color-background:var(--black-200)}.dt-leftbar-row__primary:active{--leftbar-row-color-background:var(--black-300)}.dt-leftbar-row__primary:focus-visible{box-shadow:var(--bs-focus-ring-inset)}.dt-leftbar-row__action{position:absolute;right:var(--leftbar-row-action-position-right);top:var(--leftbar-row-action-position-bottom);transform:translateY(calc(var(--leftbar-row-action-position-bottom)*-1));opacity:0}.dt-leftbar-row:hover .dt-leftbar-row__action,.dt-leftbar-row__action:focus,.dt-leftbar-row__action:focus-within{opacity:1}.dt-leftbar-row__action-button{width:var(--leftbar-row-action-width);height:var(--leftbar-row-action-height)}.dt-leftbar-row__alpha{color:var(--leftbar-row-alpha-color-foreground);display:flex;box-sizing:border-box;justify-content:center;align-items:center;padding-left:var(--space-400);padding-right:var(--space-400);width:var(--leftbar-row-alpha-width);height:var(--leftbar-row-alpha-height)}.dt-leftbar-row__label{flex:1;min-width:0}.dt-leftbar-row__omega{display:flex;gap:var(--space-300);justify-content:end;align-items:center;box-sizing:border-box;min-width:var(--leftbar-row-omega-min-width);height:var(--leftbar-row-omega-height);padding-left:var(--space-400);padding-right:var(--space-400);visibility:var(--leftbar-row-omega-visibility)}.dt-leftbar-row__description{font-weight:var(--leftbar-row-description-font-weight);font-size:var(--leftbar-row-description-font-size);line-height:var(--leftbar-row-description-line-height)}.dt-leftbar-row__description,.dt-leftbar-row__status{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.dt-leftbar-row__status{color:var(--leftbar-row-status-color-foreground);font-size:var(--leftbar-row-status-font-size);line-height:var(--leftbar-row-status-line-height);padding-bottom:var(--space-100)}.dt-leftbar-row__meta-context~.dt-leftbar-row__meta-custom:not(:empty):before{content:\" • \";color:var(--fc-tertiary)}.dt-leftbar-row__icon-cc{border-radius:var(--size-200);width:calc(var(--size-300)*3.5);height:calc(var(--size-300)*3.5)}", ""]);
415
+ ___CSS_LOADER_EXPORT___.push([module.id, ".dt-leftbar-row{--leftbar-row-color-foreground:var(--theme-sidebar-color);--leftbar-row-color-background:transparent;--leftbar-row-radius:100em;--leftbar-row-alpha-color-foreground:var(--theme-sidebar-icon-color);--leftbar-row-alpha-width:calc(var(--size-300)*10);--leftbar-row-alpha-height:calc(var(--size-300)*9);--leftbar-row-alpha-opacity:100%;--leftbar-row-omega-min-width:0;--leftbar-row-omega-height:var(--leftbar-row-alpha-height);--leftbar-row-omega-visibility:visible;--leftbar-row-description-font-weight:var(--fw-normal);--leftbar-row-description-font-size:var(--fs-200);--leftbar-row-description-line-height:var(--lh-200);--leftbar-row-description-opacity:100%;--leftbar-row-status-color-foreground:var(--theme-sidebar-status-color);--leftbar-row-status-font-size:var(--fs-100);--leftbar-row-status-line-height:var(--lh-100);--leftbar-row-action-position-right:var(--size-400);--leftbar-row-action-position-bottom:50%;--leftbar-row-action-width:calc(var(--size-300)*6);--leftbar-row-action-height:var(--leftbar-row-action-width);position:relative}.dt-leftbar-row:not(.dt-leftbar-row--no-action):hover{--leftbar-row-omega-min-width:var(--leftbar-row-alpha-width)}.dt-leftbar-row--has-unread{--leftbar-row-description-font-weight:var(--fw-bold);--leftbar-row-alpha-color-foreground:var(--leftbar-row-color-foreground)}.dt-leftbar-row--has-unread:not(.dt-leftbar-row--no-action):hover{--leftbar-row-omega-visibility:hidden}.dt-leftbar-row--muted{--leftbar-row-alpha-opacity:50%;--leftbar-row-description-opacity:60%}.dt-leftbar-row--selected{--leftbar-row-color-background:var(--theme-sidebar-active-row-color-background);--leftbar-row-color-foreground:var(--theme-sidebar-active-row-color)}.dt-leftbar-row--selected .d-avatar__count{--avatar-count-color-shadow:var(--theme-sidebar-active-row-color-background)}.dt-leftbar-row--action-focused{--leftbar-row-omega-visibility:hidden}.dt-leftbar-row__primary{display:flex;align-items:center;flex:1;width:100%;text-align:left;color:var(--leftbar-row-color-foreground);text-decoration:none;background-color:var(--leftbar-row-color-background);border-radius:var(--leftbar-row-radius);transition-duration:var(--td200);transition-property:background-color,border,box-shadow;transition-timing-function:var(--ttf-out-quint);-webkit-appearance:none;appearance:none;font-size:inhert;line-height:inherit;margin:0;border:0;padding:0;cursor:pointer}.dt-leftbar-row__primary:hover{--leftbar-row-color-background:var(--theme-sidebar-row-color-background-hover)}.dt-leftbar-row__primary:active{--leftbar-row-color-background:var(--theme-sidebar-active-row-color-background)}.dt-leftbar-row__primary:focus-visible{box-shadow:var(--bs-focus-ring-inset)}.dt-leftbar-row__action{position:absolute;right:var(--leftbar-row-action-position-right);top:var(--leftbar-row-action-position-bottom);transform:translateY(calc(var(--leftbar-row-action-position-bottom)*-1));opacity:0}.dt-leftbar-row:hover .dt-leftbar-row__action,.dt-leftbar-row__action:focus,.dt-leftbar-row__action:focus-within{opacity:1}.dt-leftbar-row__action-button{width:var(--leftbar-row-action-width);height:var(--leftbar-row-action-height)}.dt-leftbar-row__alpha{color:var(--leftbar-row-alpha-color-foreground);display:flex;box-sizing:border-box;justify-content:center;align-items:center;padding-left:var(--space-400);padding-right:var(--space-400);width:var(--leftbar-row-alpha-width);height:var(--leftbar-row-alpha-height);opacity:var(--leftbar-row-alpha-opacity)}.dt-leftbar-row__label{flex:1;min-width:0}.dt-leftbar-row__omega{display:flex;gap:var(--space-300);justify-content:end;align-items:center;box-sizing:border-box;min-width:var(--leftbar-row-omega-min-width);height:var(--leftbar-row-omega-height);padding-left:var(--space-400);padding-right:var(--space-400);visibility:var(--leftbar-row-omega-visibility)}.dt-leftbar-row__active-voice{color:var(--fc-success);-webkit-animation-name:opacity-pulsate;-webkit-animation-duration:1s;-webkit-animation-iteration-count:infinite;-webkit-animation-fill-mode:both;-moz-animation-name:opacity-pulsate;-moz-animation-duration:1s;-moz-animation-iteration-count:infinite;-moz-animation-fill-mode:both;animation-name:opacity-pulsate;animation-duration:1s;animation-iteration-count:infinite;animation-fill-mode:both}.dt-leftbar-row__dnd{color:var(--black-600);font-size:var(--fs-100);font-weight:var(--fw-bold)}.dt-leftbar-row__description{font-weight:var(--leftbar-row-description-font-weight);font-size:var(--leftbar-row-description-font-size);line-height:var(--leftbar-row-description-line-height);opacity:var(--leftbar-row-description-opacity)}.dt-leftbar-row__description,.dt-leftbar-row__status{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.dt-leftbar-row__status{color:var(--leftbar-row-status-color-foreground);font-size:var(--leftbar-row-status-font-size);line-height:var(--leftbar-row-status-line-height);padding-bottom:var(--space-100)}.dt-leftbar-row__meta-context~.dt-leftbar-row__meta-custom:not(:empty):before{content:\" • \";color:var(--theme-sidebar-status-color)}.dt-leftbar-row__icon-cc{border-radius:var(--size-200);width:calc(var(--size-300)*3.5);height:calc(var(--size-300)*3.5)}.opacity-pulsate{-webkit-animation-name:opacity-pulsate;-webkit-animation-duration:1s;-webkit-animation-iteration-count:infinite;-webkit-animation-fill-mode:both;-moz-animation-name:opacity-pulsate;-moz-animation-duration:1s;-moz-animation-iteration-count:infinite;-moz-animation-fill-mode:both;animation-name:opacity-pulsate;animation-duration:1s;animation-iteration-count:infinite;animation-fill-mode:both}@keyframes opacity-pulsate{0%,to{opacity:.2}50%{opacity:1}}", ""]);
416
416
  // Exports
417
417
  /* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (___CSS_LOADER_EXPORT___);
418
418
 
@@ -20922,15 +20922,15 @@ var stack_component = normalizeComponent(
20922
20922
  /* harmony default export */ const stack = (stack_component.exports);
20923
20923
  ;// CONCATENATED MODULE: ./components/stack/index.js
20924
20924
 
20925
- ;// CONCATENATED MODULE: ./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/loaders/templateLoader.js??vue-loader-options!./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/index.js??vue-loader-options!./recipes/comboboxes/combobox_with_popover/combobox_with_popover.vue?vue&type=template&id=2f87445e&
20926
- var combobox_with_popovervue_type_template_id_2f87445e_render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('dt-combobox',_vm._g({ref:"combobox",attrs:{"loading":_vm.loading,"label":_vm.label,"label-visible":_vm.labelVisible,"size":_vm.size,"description":_vm.description,"empty-list":_vm.emptyList,"empty-state-message":_vm.emptyStateMessage,"show-list":_vm.isListShown,"on-beginning-of-list":_vm.onBeginningOfList,"on-end-of-list":_vm.onEndOfList,"list-rendered-outside":true,"list-id":_vm.listId,"data-qa":"dt-combobox"},scopedSlots:_vm._u([{key:"input",fn:function(ref){
20925
+ ;// CONCATENATED MODULE: ./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/loaders/templateLoader.js??vue-loader-options!./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/index.js??vue-loader-options!./recipes/comboboxes/combobox_with_popover/combobox_with_popover.vue?vue&type=template&id=5bccf868&
20926
+ var combobox_with_popovervue_type_template_id_5bccf868_render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('dt-combobox',_vm._g({ref:"combobox",attrs:{"loading":_vm.loading,"label":_vm.label,"label-visible":_vm.labelVisible,"size":_vm.size,"description":_vm.description,"empty-list":_vm.emptyList,"empty-state-message":_vm.emptyStateMessage,"show-list":_vm.isListShown,"on-beginning-of-list":_vm.onBeginningOfList,"on-end-of-list":_vm.onEndOfList,"list-rendered-outside":true,"list-id":_vm.listId,"data-qa":"dt-combobox"},scopedSlots:_vm._u([{key:"input",fn:function(ref){
20927
20927
  var inputProps = ref.inputProps;
20928
20928
  return [_c('div',{ref:"input",attrs:{"id":_vm.externalAnchor},on:{"focusin":_vm.onFocusIn,"keydown":[function($event){if(!$event.type.indexOf('key')&&_vm._k($event.keyCode,"up",38,$event.key,["Up","ArrowUp"])){ return null; }return _vm.openOnArrowKeyPress($event)},function($event){if(!$event.type.indexOf('key')&&_vm._k($event.keyCode,"down",40,$event.key,["Down","ArrowDown"])){ return null; }return _vm.openOnArrowKeyPress($event)}]}},[_vm._t("input",null,{"inputProps":inputProps,"onInput":_vm.handleDisplayList})],2)]}},{key:"list",fn:function(ref){
20929
20929
  var opened = ref.opened;
20930
20930
  var listProps = ref.listProps;
20931
20931
  var clearHighlightIndex = ref.clearHighlightIndex;
20932
20932
  return [_c('dt-popover',{ref:"popover",attrs:{"open":_vm.isListShown,"hide-on-click":false,"max-height":_vm.maxHeight,"max-width":_vm.maxWidth,"offset":_vm.popoverOffset,"sticky":_vm.popoverSticky,"placement":"bottom-start","initial-focus-element":"none","padding":"none","role":"listbox","external-anchor":_vm.externalAnchor,"content-width":_vm.contentWidth,"content-tabindex":null,"modal":false,"auto-focus":false,"append-to":_vm.appendTo,"visually-hidden-close-label":_vm.visuallyHiddenCloseLabel,"visually-hidden-close":_vm.visuallyHiddenClose},on:{"update:open":function($event){_vm.isListShown=$event},"opened":function($event){return opened($event, arguments[1]);}},scopedSlots:_vm._u([{key:"headerContent",fn:function(){return [(_vm.$slots.header)?_c('div',{ref:"header"},[_vm._t("header")],2):_vm._e()]},proxy:true},{key:"content",fn:function(){return [_c('div',{ref:"listWrapper",class:[_vm.DROPDOWN_PADDING_CLASSES[_vm.padding], _vm.listClass],on:{"mouseleave":clearHighlightIndex,"focusout":clearHighlightIndex}},[(_vm.loading)?_c('combobox-loading-list',_vm._b({},'combobox-loading-list',listProps,false)):(_vm.emptyList && _vm.emptyStateMessage)?_c('combobox-empty-list',_vm._b({attrs:{"message":_vm.emptyStateMessage}},'combobox-empty-list',listProps,false)):_vm._t("list",null,{"listProps":listProps})],2)]},proxy:true},{key:"footerContent",fn:function(){return [(_vm.$slots.footer)?_c('div',{ref:"footer"},[_vm._t("footer")],2):_vm._e()]},proxy:true}],null,true)})]}}],null,true)},_vm.comboboxListeners))}
20933
- var combobox_with_popovervue_type_template_id_2f87445e_staticRenderFns = []
20933
+ var combobox_with_popovervue_type_template_id_5bccf868_staticRenderFns = []
20934
20934
 
20935
20935
 
20936
20936
  ;// CONCATENATED MODULE: ./node_modules/thread-loader/dist/cjs.js!./node_modules/babel-loader/lib/index.js??clonedRuleSet-80[0].rules[0].use[1]!./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/index.js??vue-loader-options!./recipes/comboboxes/combobox_with_popover/combobox_with_popover.vue?vue&type=script&lang=js&
@@ -21383,12 +21383,12 @@ var combobox_with_popovervue_type_template_id_2f87445e_staticRenderFns = []
21383
21383
  },
21384
21384
 
21385
21385
  onFocusOut(e) {
21386
+ var _this$$refs$popover$t, _e$composedPath;
21387
+
21386
21388
  // Check if the focus change was to another target within the combobox component
21387
- const isComboboxStillFocused = Object.keys(this.$refs).some(refName => {
21388
- const ref = this.$refs[refName];
21389
- return ref.$el ? ref.$el.contains(e.target) : ref.contains(e.target);
21390
- });
21391
- if (isComboboxStillFocused) return; // If outside the combobox then close
21389
+ const popoverEl = (_this$$refs$popover$t = this.$refs.popover.tip) === null || _this$$refs$popover$t === void 0 ? void 0 : _this$$refs$popover$t.popper;
21390
+ const comboboxEl = this.$refs.input;
21391
+ if ((_e$composedPath = e.composedPath()) !== null && _e$composedPath !== void 0 && _e$composedPath.some(el => [popoverEl, comboboxEl].includes(el))) return; // If outside the combobox then close
21392
21392
 
21393
21393
  this.closeComboboxList();
21394
21394
  },
@@ -21415,8 +21415,8 @@ var combobox_with_popovervue_type_template_id_2f87445e_staticRenderFns = []
21415
21415
  ;
21416
21416
  var combobox_with_popover_component = normalizeComponent(
21417
21417
  combobox_with_popover_combobox_with_popovervue_type_script_lang_js_,
21418
- combobox_with_popovervue_type_template_id_2f87445e_render,
21419
- combobox_with_popovervue_type_template_id_2f87445e_staticRenderFns,
21418
+ combobox_with_popovervue_type_template_id_5bccf868_render,
21419
+ combobox_with_popovervue_type_template_id_5bccf868_staticRenderFns,
21420
21420
  false,
21421
21421
  null,
21422
21422
  null,
@@ -23325,9 +23325,9 @@ var grouped_chip_component = normalizeComponent(
23325
23325
  /* harmony default export */ const grouped_chip = (grouped_chip_component.exports);
23326
23326
  ;// CONCATENATED MODULE: ./recipes/chips/grouped_chip/index.js
23327
23327
 
23328
- ;// CONCATENATED MODULE: ./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/loaders/templateLoader.js??vue-loader-options!./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/index.js??vue-loader-options!./recipes/leftbar/general_row/general_row.vue?vue&type=template&id=40a77fb7&
23329
- var general_rowvue_type_template_id_40a77fb7_render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{class:_vm.leftbarGeneralRowClasses,attrs:{"data-qa":"dt-leftbar-row"}},[_c('button',_vm._g(_vm._b({staticClass:"dt-leftbar-row__primary",attrs:{"data-qa":"dt-leftbar-row-link"}},'button',_vm.$attrs,false),_vm.$listeners),[_c('div',{staticClass:"dt-leftbar-row__alpha"},[_vm._t("left",function(){return [_c('dt-recipe-leftbar-general-row-icon',{attrs:{"type":_vm.getIcon,"color":_vm.color,"data-qa":"dt-leftbar-row-icon"}})]})],2),_c('div',{staticClass:"dt-leftbar-row__label"},[_c('dt-emoji-text-wrapper',{staticClass:"dt-leftbar-row__description",attrs:{"data-qa":"dt-leftbar-row-description"}},[_vm._v(" "+_vm._s(_vm.description)+" ")])],1),_c('div',{staticClass:"dt-leftbar-row__omega"},[(_vm.hasUnreadMessages)?_c('dt-badge',{attrs:{"kind":"count","type":"bulletin","data-qa":"dt-leftbar-row-unread-badge"}},[_vm._v(" "+_vm._s(_vm.unreadCount)+" ")]):_vm._e()],1)])])}
23330
- var general_rowvue_type_template_id_40a77fb7_staticRenderFns = []
23328
+ ;// CONCATENATED MODULE: ./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/loaders/templateLoader.js??vue-loader-options!./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/index.js??vue-loader-options!./recipes/leftbar/general_row/general_row.vue?vue&type=template&id=1889c7ad&
23329
+ var general_rowvue_type_template_id_1889c7ad_render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{class:_vm.leftbarGeneralRowClasses,attrs:{"data-qa":"dt-leftbar-row"}},[_c('button',_vm._g(_vm._b({staticClass:"dt-leftbar-row__primary",attrs:{"data-qa":"dt-leftbar-row-link"}},'button',_vm.$attrs,false),_vm.$listeners),[_c('div',{staticClass:"dt-leftbar-row__alpha"},[_vm._t("left",function(){return [_c('dt-recipe-leftbar-general-row-icon',{attrs:{"type":_vm.getIcon,"color":_vm.color,"data-qa":"dt-leftbar-row-icon"}})]})],2),_c('div',{staticClass:"dt-leftbar-row__label"},[_c('dt-emoji-text-wrapper',{staticClass:"dt-leftbar-row__description",attrs:{"data-qa":"dt-leftbar-row-description"}},[_vm._v(" "+_vm._s(_vm.description)+" ")])],1),_c('div',{staticClass:"dt-leftbar-row__omega"},[(_vm.dndText)?_c('div',{staticClass:"dt-leftbar-row__dnd"},[_vm._v(" "+_vm._s(_vm.dndText)+" ")]):(_vm.activeVoiceChat)?_c('div',{staticClass:"dt-leftbar-row__active-voice"},[_c('dt-icon',{attrs:{"size":"300","name":"activity"}})],1):(_vm.hasUnreadMessages)?_c('dt-badge',{attrs:{"kind":"count","type":"bulletin","data-qa":"dt-leftbar-row-unread-badge"}},[_vm._v(" "+_vm._s(_vm.unreadCount)+" ")]):_vm._e()],1)])])}
23330
+ var general_rowvue_type_template_id_1889c7ad_staticRenderFns = []
23331
23331
 
23332
23332
 
23333
23333
  ;// CONCATENATED MODULE: ./recipes/leftbar/general_row/general_row_constants.js
@@ -23338,7 +23338,9 @@ const LEFTBAR_GENERAL_ROW_TYPES = {
23338
23338
  THREADS: 'threads',
23339
23339
  LOCKED_CHANNEL: 'locked channel',
23340
23340
  CONTACT_CENTER: 'contact center',
23341
- DIALBOT: 'dialbot'
23341
+ DIALBOT: 'dialbot',
23342
+ ASSIGNED: 'assigned',
23343
+ DIGITAL: 'digital'
23342
23344
  };
23343
23345
  const LEFTBAR_GENERAL_ROW_ICON_MAPPING = {
23344
23346
  [LEFTBAR_GENERAL_ROW_TYPES.INBOX]: 'inbox',
@@ -23347,20 +23349,28 @@ const LEFTBAR_GENERAL_ROW_ICON_MAPPING = {
23347
23349
  [LEFTBAR_GENERAL_ROW_TYPES.THREADS]: 'thread',
23348
23350
  [LEFTBAR_GENERAL_ROW_TYPES.LOCKED_CHANNEL]: 'lock',
23349
23351
  'locked channel unread': 'lock-filled',
23350
- 'channel unread': 'hash-bold'
23352
+ 'channel unread': 'hash-bold',
23353
+ [LEFTBAR_GENERAL_ROW_TYPES.ASSIGNED]: 'at-sign',
23354
+ [LEFTBAR_GENERAL_ROW_TYPES.DIGITAL]: 'message'
23351
23355
  };
23352
23356
  const LEFTBAR_GENERAL_ROW_CONTACT_CENTER_COLORS = {
23353
- purple: 'd-bgc-purple-300',
23354
- blue: 'd-bgc-blue-300',
23355
- green: 'd-bgc-green-300',
23356
- red: 'd-bgc-red-300',
23357
- magenta: 'd-bgc-magenta-300',
23358
- gold: 'd-bgc-gold-300'
23357
+ 'magenta-200': 'd-bgc-magenta-200',
23358
+ 'green-200': 'd-bgc-green-200',
23359
+ 'gold-300': 'd-bgc-gold-300',
23360
+ 'purple-600': 'd-bgc-purple-600',
23361
+ 'magenta-300': 'd-bgc-magenta-300',
23362
+ 'purple-300': 'd-bgc-purple-300',
23363
+ 'green-500': 'd-bgc-green-500',
23364
+ 'purple-100': 'd-bgc-purple-100',
23365
+ 'magenta-400': 'd-bgc-magenta-400',
23366
+ 'magenta-100': 'd-bgc-magenta-100'
23359
23367
  };
23368
+ const LEFTBAR_GENERAL_ROW_CONTACT_CENTER_VALIDATION_ERROR = 'If type is contact center, color must be one' + 'of the following:' + Object.keys(LEFTBAR_GENERAL_ROW_CONTACT_CENTER_COLORS).join(', ');
23360
23369
  /* harmony default export */ const general_row_constants = ({
23361
23370
  LEFTBAR_GENERAL_ROW_TYPES,
23362
23371
  LEFTBAR_GENERAL_ROW_ICON_MAPPING,
23363
- LEFTBAR_GENERAL_ROW_CONTACT_CENTER_COLORS
23372
+ LEFTBAR_GENERAL_ROW_CONTACT_CENTER_COLORS,
23373
+ LEFTBAR_GENERAL_ROW_CONTACT_CENTER_VALIDATION_ERROR
23364
23374
  });
23365
23375
  ;// CONCATENATED MODULE: ./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/loaders/templateLoader.js??vue-loader-options!./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/index.js??vue-loader-options!./components/emoji/emoji.vue?vue&type=template&id=147e0534&
23366
23376
  var emojivue_type_template_id_147e0534_render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('span',{class:_vm.emojiSize},[_c('dt-skeleton',{directives:[{name:"show",rawName:"v-show",value:(_vm.imgLoading && _vm.showSkeleton),expression:"imgLoading && showSkeleton"}],class:_vm.emojiSize,attrs:{"offset":0,"shape-option":{ shape: 'square', contentClass: _vm.emojiSize, size: 'auto' }}}),_c('img',{directives:[{name:"show",rawName:"v-show",value:(!_vm.imgLoading),expression:"!imgLoading"}],ref:"emojiImg",class:['d-icon', _vm.emojiSize, _vm.imgClass],attrs:{"aria-label":_vm.emojiLabel,"alt":_vm.emojiAlt,"title":_vm.emojiLabel,"src":_vm.emojiSrc},on:{"load":_vm.imageLoaded,"error":_vm.imageErrored}})],1)}
@@ -24042,6 +24052,22 @@ var leftbar_general_row_icon_component = normalizeComponent(
24042
24052
  //
24043
24053
  //
24044
24054
  //
24055
+ //
24056
+ //
24057
+ //
24058
+ //
24059
+ //
24060
+ //
24061
+ //
24062
+ //
24063
+ //
24064
+ //
24065
+ //
24066
+ //
24067
+ //
24068
+ //
24069
+ //
24070
+
24045
24071
 
24046
24072
 
24047
24073
 
@@ -24051,6 +24077,7 @@ var leftbar_general_row_icon_component = normalizeComponent(
24051
24077
  components: {
24052
24078
  DtEmojiTextWrapper: emoji_text_wrapper,
24053
24079
  DtBadge: badge,
24080
+ DtIcon: icon,
24054
24081
  DtRecipeLeftbarGeneralRowIcon: leftbar_general_row_icon
24055
24082
  },
24056
24083
  inheritAttrs: false,
@@ -24100,13 +24127,39 @@ var leftbar_general_row_icon_component = normalizeComponent(
24100
24127
  selected: {
24101
24128
  type: Boolean,
24102
24129
  default: false
24130
+ },
24131
+
24132
+ /**
24133
+ * Gives a faded style to be used when muted
24134
+ */
24135
+ muted: {
24136
+ type: Boolean,
24137
+ default: false
24138
+ },
24139
+
24140
+ /**
24141
+ * Shows styling to represent an active voice chat. This will display over unreadCount.
24142
+ */
24143
+ activeVoiceChat: {
24144
+ type: Boolean,
24145
+ default: false
24146
+ },
24147
+
24148
+ /**
24149
+ * Acronym used to represent "Do not Disturb" state. If entered will display the entered text over
24150
+ * unreadCount and activeVoiceChat.
24151
+ */
24152
+ dndText: {
24153
+ type: String,
24154
+ default: ''
24103
24155
  }
24104
24156
  },
24105
24157
  computed: {
24106
24158
  leftbarGeneralRowClasses() {
24107
24159
  return ['dt-leftbar-row', 'dt-leftbar-row--no-action', {
24108
24160
  'dt-leftbar-row--has-unread': this.hasUnreadMessages,
24109
- 'dt-leftbar-row--selected': this.selected
24161
+ 'dt-leftbar-row--selected': this.selected,
24162
+ 'dt-leftbar-row--muted': this.muted
24110
24163
  }];
24111
24164
  },
24112
24165
 
@@ -24143,7 +24196,7 @@ var leftbar_general_row_icon_component = normalizeComponent(
24143
24196
  methods: {
24144
24197
  validateProps() {
24145
24198
  if (this.type === LEFTBAR_GENERAL_ROW_TYPES.CONTACT_CENTER && !Object.keys(LEFTBAR_GENERAL_ROW_CONTACT_CENTER_COLORS).includes(this.color)) {
24146
- console.error('If type is contact center, color must be one of the following: ' + Object.keys(LEFTBAR_GENERAL_ROW_CONTACT_CENTER_COLORS).join(', '));
24199
+ console.error(LEFTBAR_GENERAL_ROW_CONTACT_CENTER_VALIDATION_ERROR);
24147
24200
  }
24148
24201
  }
24149
24202
 
@@ -24166,8 +24219,8 @@ var general_rowvue_type_style_index_0_lang_less_ = __webpack_require__(745);
24166
24219
 
24167
24220
  var general_row_component = normalizeComponent(
24168
24221
  general_row_general_rowvue_type_script_lang_js_,
24169
- general_rowvue_type_template_id_40a77fb7_render,
24170
- general_rowvue_type_template_id_40a77fb7_staticRenderFns,
24222
+ general_rowvue_type_template_id_1889c7ad_render,
24223
+ general_rowvue_type_template_id_1889c7ad_staticRenderFns,
24171
24224
  false,
24172
24225
  null,
24173
24226
  null,