@dialpad/dialtone-vue 2.78.1 → 2.78.2

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.
package/CHANGELOG.md CHANGED
@@ -1,3 +1,10 @@
1
+ ## [2.78.2](https://github.com/dialpad/dialtone-vue/compare/v2.78.1...v2.78.2) (2023-04-11)
2
+
3
+
4
+ ### Bug Fixes
5
+
6
+ * null protection on some refs ([#903](https://github.com/dialpad/dialtone-vue/issues/903)) ([e1addd3](https://github.com/dialpad/dialtone-vue/commit/e1addd30be47f3d0bef1b0fba33822c0423bcc23))
7
+
1
8
  ## [2.78.1](https://github.com/dialpad/dialtone-vue/compare/v2.78.0...v2.78.1) (2023-04-10)
2
9
 
3
10
 
@@ -8428,8 +8428,8 @@ return [_c('ul',{ref:"listWrapper",class:_vm.listClasses,attrs:{"id":_vm.listId,
8428
8428
  var dropdownvue_type_template_id_c0aa082e_staticRenderFns = []
8429
8429
 
8430
8430
 
8431
- ;// 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/popover/popover.vue?vue&type=template&id=6d22723e&
8432
- var popovervue_type_template_id_6d22723e_render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',[(_vm.modal && _vm.isOpen)?_c('portal',[_c('div',{staticClass:"d-modal--transparent",attrs:{"aria-hidden":_vm.modal && _vm.isOpen ? 'false' : 'true'},on:{"click":function($event){$event.preventDefault();$event.stopPropagation();}}})]):_vm._e(),_c(_vm.elementType,_vm._g({ref:"popover",tag:"component",class:['d-popover', { 'd-popover__anchor--opened': _vm.isOpen }],attrs:{"data-qa":"dt-popover-container"}},_vm.$listeners),[_c('div',{ref:"anchor",attrs:{"id":!_vm.ariaLabelledby && _vm.labelledBy,"data-qa":"dt-popover-anchor","tabindex":_vm.openOnContext ? 0 : undefined},on:{"!click":function($event){return _vm.defaultToggleOpen.apply(null, arguments)},"contextmenu":_vm.onContext,"keydown":[function($event){if(!$event.type.indexOf('key')&&_vm._k($event.keyCode,"up",38,$event.key,["Up","ArrowUp"])){ return null; }$event.preventDefault();return _vm.onArrowKeyPress.apply(null, arguments)},function($event){if(!$event.type.indexOf('key')&&_vm._k($event.keyCode,"down",40,$event.key,["Down","ArrowDown"])){ return null; }$event.preventDefault();return _vm.onArrowKeyPress.apply(null, arguments)}],"!keydown":function($event){if(!$event.type.indexOf('key')&&_vm._k($event.keyCode,"escape",undefined,$event.key,undefined)){ return null; }return _vm.closePopover.apply(null, arguments)}}},[_vm._t("anchor",null,{"attrs":{
8431
+ ;// 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/popover/popover.vue?vue&type=template&id=01a6c752&
8432
+ var popovervue_type_template_id_01a6c752_render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',[(_vm.modal && _vm.isOpen)?_c('portal',[_c('div',{staticClass:"d-modal--transparent",attrs:{"aria-hidden":_vm.modal && _vm.isOpen ? 'false' : 'true'},on:{"click":function($event){$event.preventDefault();$event.stopPropagation();}}})]):_vm._e(),_c(_vm.elementType,_vm._g({ref:"popover",tag:"component",class:['d-popover', { 'd-popover__anchor--opened': _vm.isOpen }],attrs:{"data-qa":"dt-popover-container"}},_vm.$listeners),[_c('div',{ref:"anchor",attrs:{"id":!_vm.ariaLabelledby && _vm.labelledBy,"data-qa":"dt-popover-anchor","tabindex":_vm.openOnContext ? 0 : undefined},on:{"!click":function($event){return _vm.defaultToggleOpen.apply(null, arguments)},"contextmenu":_vm.onContext,"keydown":[function($event){if(!$event.type.indexOf('key')&&_vm._k($event.keyCode,"up",38,$event.key,["Up","ArrowUp"])){ return null; }$event.preventDefault();return _vm.onArrowKeyPress.apply(null, arguments)},function($event){if(!$event.type.indexOf('key')&&_vm._k($event.keyCode,"down",40,$event.key,["Down","ArrowDown"])){ return null; }$event.preventDefault();return _vm.onArrowKeyPress.apply(null, arguments)}],"!keydown":function($event){if(!$event.type.indexOf('key')&&_vm._k($event.keyCode,"escape",undefined,$event.key,undefined)){ return null; }return _vm.closePopover.apply(null, arguments)}}},[_vm._t("anchor",null,{"attrs":{
8433
8433
  'aria-expanded': _vm.isOpen.toString(),
8434
8434
  'aria-controls': _vm.id,
8435
8435
  'aria-haspopup': _vm.role,
@@ -8440,7 +8440,7 @@ var popovervue_type_template_id_6d22723e_render = function () {var _vm=this;var
8440
8440
  'd-popover__content',
8441
8441
  _vm.POPOVER_PADDING_CLASSES[_vm.padding],
8442
8442
  _vm.contentClass ],attrs:{"data-qa":"dt-popover-content"}},[_vm._t("content",null,{"close":_vm.closePopover})],2),(_vm.$slots.footerContent)?_c('popover-header-footer',{ref:"popover__footer",class:_vm.POPOVER_HEADER_FOOTER_PADDING_CLASSES[_vm.padding],attrs:{"type":"footer","content-class":_vm.footerClass},scopedSlots:_vm._u([{key:"content",fn:function(){return [_vm._t("footerContent",null,{"close":_vm.closePopover})]},proxy:true}],null,true)}):_vm._e(),(_vm.showVisuallyHiddenClose)?_c('sr-only-close-button',{attrs:{"visually-hidden-close-label":_vm.visuallyHiddenCloseLabel},on:{"close":_vm.closePopover}}):_vm._e()],1)],1)],1)}
8443
- var popovervue_type_template_id_6d22723e_staticRenderFns = []
8443
+ var popovervue_type_template_id_01a6c752_staticRenderFns = []
8444
8444
 
8445
8445
 
8446
8446
  ;// CONCATENATED MODULE: ./node_modules/@popperjs/core/lib/dom-utils/getBoundingClientRect.js
@@ -14106,7 +14106,7 @@ var popover_header_footer_component = normalizeComponent(
14106
14106
  },
14107
14107
 
14108
14108
  focusInitialElementById() {
14109
- var _this$$refs$content, _this$$refs$content$$;
14109
+ var _this$$refs$content, _this$$refs$content$$, _this$$refs$content2;
14110
14110
 
14111
14111
  const result = (_this$$refs$content = this.$refs.content) === null || _this$$refs$content === void 0 ? void 0 : (_this$$refs$content$$ = _this$$refs$content.$el) === null || _this$$refs$content$$ === void 0 ? void 0 : _this$$refs$content$$.querySelector(this.initialFocusElement);
14112
14112
 
@@ -14116,7 +14116,7 @@ var popover_header_footer_component = normalizeComponent(
14116
14116
  console.warn('Could not find the element specified in dt-popover prop "initialFocusElement". ' + 'Defaulting to focusing the dialog.');
14117
14117
  }
14118
14118
 
14119
- result ? result.focus() : this.$refs.content.$el.focus();
14119
+ result ? result.focus() : (_this$$refs$content2 = this.$refs.content) === null || _this$$refs$content2 === void 0 ? void 0 : _this$$refs$content2.$el.focus();
14120
14120
  },
14121
14121
 
14122
14122
  onResize() {
@@ -14160,8 +14160,10 @@ var popover_header_footer_component = normalizeComponent(
14160
14160
 
14161
14161
  (_this$$refs$popover__ = this.$refs.popover__header) === null || _this$$refs$popover__ === void 0 ? void 0 : _this$$refs$popover__.focusCloseButton();
14162
14162
  } else {
14163
+ var _this$$refs$content3;
14164
+
14163
14165
  // if there are no focusable elements at all focus the dialog itself
14164
- this.$refs.content.$el.focus();
14166
+ (_this$$refs$content3 = this.$refs.content) === null || _this$$refs$content3 === void 0 ? void 0 : _this$$refs$content3.$el.focus();
14165
14167
  }
14166
14168
  },
14167
14169
 
@@ -14205,8 +14207,8 @@ var popovervue_type_style_index_0_lang_less_ = __webpack_require__(4230);
14205
14207
 
14206
14208
  var popover_component = normalizeComponent(
14207
14209
  popover_popovervue_type_script_lang_js_,
14208
- popovervue_type_template_id_6d22723e_render,
14209
- popovervue_type_template_id_6d22723e_staticRenderFns,
14210
+ popovervue_type_template_id_01a6c752_render,
14211
+ popovervue_type_template_id_01a6c752_staticRenderFns,
14210
14212
  false,
14211
14213
  null,
14212
14214
  null,
@@ -21525,15 +21527,15 @@ var stack_component = normalizeComponent(
21525
21527
  /* harmony default export */ const stack = (stack_component.exports);
21526
21528
  ;// CONCATENATED MODULE: ./components/stack/index.js
21527
21529
 
21528
- ;// 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=386059b2&
21529
- var combobox_with_popovervue_type_template_id_386059b2_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){
21530
+ ;// 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=1ab85920&
21531
+ var combobox_with_popovervue_type_template_id_1ab85920_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){
21530
21532
  var inputProps = ref.inputProps;
21531
21533
  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){
21532
21534
  var opened = ref.opened;
21533
21535
  var listProps = ref.listProps;
21534
21536
  var clearHighlightIndex = ref.clearHighlightIndex;
21535
21537
  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,"transition":_vm.transition,"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))}
21536
- var combobox_with_popovervue_type_template_id_386059b2_staticRenderFns = []
21538
+ var combobox_with_popovervue_type_template_id_1ab85920_staticRenderFns = []
21537
21539
 
21538
21540
 
21539
21541
  ;// 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&
@@ -21988,7 +21990,9 @@ var combobox_with_popovervue_type_template_id_386059b2_staticRenderFns = []
21988
21990
  },
21989
21991
 
21990
21992
  onFocusIn(e) {
21991
- if (this.hasSuggestionList && e && this.$refs.input.querySelector('input') === e.target) {
21993
+ var _this$$refs$input;
21994
+
21995
+ if (this.hasSuggestionList && e && ((_this$$refs$input = this.$refs.input) === null || _this$$refs$input === void 0 ? void 0 : _this$$refs$input.querySelector('input')) === e.target) {
21992
21996
  // only trigger if we show suggestion list when focused, and
21993
21997
  // it's the input specifically that was focused
21994
21998
  this.showComboboxList();
@@ -21996,10 +22000,10 @@ var combobox_with_popovervue_type_template_id_386059b2_staticRenderFns = []
21996
22000
  },
21997
22001
 
21998
22002
  onFocusOut(e) {
21999
- var _this$$refs$popover$t, _e$composedPath;
22003
+ var _this$$refs$popover, _this$$refs$popover$t, _e$composedPath;
22000
22004
 
22001
22005
  // Check if the focus change was to another target within the combobox component
22002
- const popoverEl = (_this$$refs$popover$t = this.$refs.popover.tip) === null || _this$$refs$popover$t === void 0 ? void 0 : _this$$refs$popover$t.popper;
22006
+ const popoverEl = (_this$$refs$popover = this.$refs.popover) === null || _this$$refs$popover === void 0 ? void 0 : (_this$$refs$popover$t = _this$$refs$popover.tip) === null || _this$$refs$popover$t === void 0 ? void 0 : _this$$refs$popover$t.popper;
22003
22007
  const comboboxEl = this.$refs.input;
22004
22008
  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
22005
22009
 
@@ -22028,8 +22032,8 @@ var combobox_with_popovervue_type_template_id_386059b2_staticRenderFns = []
22028
22032
  ;
22029
22033
  var combobox_with_popover_component = normalizeComponent(
22030
22034
  combobox_with_popover_combobox_with_popovervue_type_script_lang_js_,
22031
- combobox_with_popovervue_type_template_id_386059b2_render,
22032
- combobox_with_popovervue_type_template_id_386059b2_staticRenderFns,
22035
+ combobox_with_popovervue_type_template_id_1ab85920_render,
22036
+ combobox_with_popovervue_type_template_id_1ab85920_staticRenderFns,
22033
22037
  false,
22034
22038
  null,
22035
22039
  null,
@@ -22040,11 +22044,11 @@ var combobox_with_popover_component = normalizeComponent(
22040
22044
  /* harmony default export */ const combobox_with_popover = (combobox_with_popover_component.exports);
22041
22045
  ;// CONCATENATED MODULE: ./recipes/comboboxes/combobox_with_popover/index.js
22042
22046
 
22043
- ;// 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_multi_select/combobox_multi_select.vue?vue&type=template&id=42ee0c13&
22044
- var combobox_multi_selectvue_type_template_id_42ee0c13_render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('dt-recipe-combobox-with-popover',{ref:"comboboxWithPopover",attrs:{"label":_vm.label,"show-list":_vm.showList,"max-height":_vm.listMaxHeight,"popover-offset":_vm.popoverOffset,"has-suggestion-list":_vm.hasSuggestionList,"visually-hidden-close-label":_vm.visuallyHiddenCloseLabel,"visually-hidden-close":_vm.visuallyHiddenClose,"content-width":"anchor","append-to":_vm.appendTo,"transition":_vm.transition},on:{"select":_vm.onComboboxSelect},scopedSlots:_vm._u([{key:"input",fn:function(ref){
22047
+ ;// 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_multi_select/combobox_multi_select.vue?vue&type=template&id=4a2fe866&
22048
+ var combobox_multi_selectvue_type_template_id_4a2fe866_render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('dt-recipe-combobox-with-popover',{ref:"comboboxWithPopover",attrs:{"label":_vm.label,"show-list":_vm.showList,"max-height":_vm.listMaxHeight,"popover-offset":_vm.popoverOffset,"has-suggestion-list":_vm.hasSuggestionList,"visually-hidden-close-label":_vm.visuallyHiddenCloseLabel,"visually-hidden-close":_vm.visuallyHiddenClose,"content-width":"anchor","append-to":_vm.appendTo,"transition":_vm.transition},on:{"select":_vm.onComboboxSelect},scopedSlots:_vm._u([{key:"input",fn:function(ref){
22045
22049
  var onInput = ref.onInput;
22046
22050
  return [_c('span',{ref:"inputSlotWrapper",staticClass:"d-ps-relative d-d-block"},[_c('span',{ref:"chipsWrapper",staticClass:"d-ps-absolute d-mx2 d-pl1"},_vm._l((_vm.selectedItems),function(item){return _c('dt-chip',_vm._g({key:item.id,ref:"chips",refInFor:true,class:['d-mt4', 'd-mx2', 'd-zi-base1'],attrs:{"label-class":['d-chip__label'],"close-button-props":{ ariaLabel: 'close' },"size":_vm.CHIP_SIZES[_vm.size]},on:{"keyup":function($event){if(!$event.type.indexOf('key')&&_vm._k($event.keyCode,"backspace",undefined,$event.key,undefined)){ return null; }return _vm.onChipRemove(item)},"close":function($event){return _vm.onChipRemove(item)}}},_vm.chipListeners),[_vm._v(" "+_vm._s(item)+" ")])}),1),_c('dt-input',_vm._g({ref:"input",staticClass:"d-fl-grow1",attrs:{"aria-label":_vm.label,"label":_vm.labelVisible ? _vm.label : '',"description":_vm.description,"placeholder":_vm.inputPlaceHolder,"show-messages":_vm.showInputMessages,"messages":_vm.inputMessages,"size":_vm.size},on:{"input":onInput},model:{value:(_vm.value),callback:function ($$v) {_vm.value=$$v},expression:"value"}},_vm.inputListeners)),_c('dt-validation-messages',{attrs:{"validation-messages":_vm.maxSelectedMessage,"show-messages":_vm.showValidationMessages}})],1)]}},{key:"header",fn:function(){return [(_vm.$slots.header)?_c('div',{ref:"header"},[_vm._t("header")],2):_vm._e()]},proxy:true},{key:"list",fn:function(){return [_c('div',{ref:"list",on:{"mousedown":function($event){$event.preventDefault();}}},[(!_vm.loading)?_vm._t("list"):_c('div',{staticClass:"d-ta-center d-py16"},[_vm._v(" "+_vm._s(_vm.loadingMessage)+" ")])],2)]},proxy:true},{key:"footer",fn:function(){return [(_vm.$slots.footer)?_c('div',{ref:"footer"},[_vm._t("footer")],2):_vm._e()]},proxy:true}],null,true)})}
22047
- var combobox_multi_selectvue_type_template_id_42ee0c13_staticRenderFns = []
22051
+ var combobox_multi_selectvue_type_template_id_4a2fe866_staticRenderFns = []
22048
22052
 
22049
22053
 
22050
22054
  ;// CONCATENATED MODULE: ./recipes/comboboxes/combobox_multi_select/combobox_multi_select_story_constants.js
@@ -22580,8 +22584,10 @@ const CHIP_TOP_POSITION = {
22580
22584
 
22581
22585
  methods: {
22582
22586
  onChipRemove(item) {
22587
+ var _this$$refs$input;
22588
+
22583
22589
  this.$emit('remove', item);
22584
- this.$refs.input.focus();
22590
+ (_this$$refs$input = this.$refs.input) === null || _this$$refs$input === void 0 ? void 0 : _this$$refs$input.focus();
22585
22591
  },
22586
22592
 
22587
22593
  onComboboxSelect(i) {
@@ -22590,19 +22596,23 @@ const CHIP_TOP_POSITION = {
22590
22596
  },
22591
22597
 
22592
22598
  showComboboxList() {
22599
+ var _this$$refs$comboboxW;
22600
+
22593
22601
  if (this.showList != null) {
22594
22602
  return;
22595
22603
  }
22596
22604
 
22597
- this.$refs.comboboxWithPopover.showComboboxList();
22605
+ (_this$$refs$comboboxW = this.$refs.comboboxWithPopover) === null || _this$$refs$comboboxW === void 0 ? void 0 : _this$$refs$comboboxW.showComboboxList();
22598
22606
  },
22599
22607
 
22600
22608
  closeComboboxList() {
22609
+ var _this$$refs$comboboxW2;
22610
+
22601
22611
  if (this.showList != null) {
22602
22612
  return;
22603
22613
  }
22604
22614
 
22605
- this.$refs.comboboxWithPopover.closeComboboxList();
22615
+ (_this$$refs$comboboxW2 = this.$refs.comboboxWithPopover) === null || _this$$refs$comboboxW2 === void 0 ? void 0 : _this$$refs$comboboxW2.closeComboboxList();
22606
22616
  },
22607
22617
 
22608
22618
  getChipButtons() {
@@ -22626,9 +22636,9 @@ const CHIP_TOP_POSITION = {
22626
22636
  },
22627
22637
 
22628
22638
  getInput() {
22629
- var _this$$refs$input;
22639
+ var _this$$refs$input2;
22630
22640
 
22631
- return (_this$$refs$input = this.$refs.input) === null || _this$$refs$input === void 0 ? void 0 : _this$$refs$input.$refs.input;
22641
+ return (_this$$refs$input2 = this.$refs.input) === null || _this$$refs$input2 === void 0 ? void 0 : _this$$refs$input2.$refs.input;
22632
22642
  },
22633
22643
 
22634
22644
  onChipKeyup(event) {
@@ -22664,22 +22674,28 @@ const CHIP_TOP_POSITION = {
22664
22674
  },
22665
22675
 
22666
22676
  moveFromInputToChip() {
22677
+ var _this$$refs$input3;
22678
+
22667
22679
  this.getLastChipButton().focus();
22668
- this.$refs.input.blur();
22680
+ (_this$$refs$input3 = this.$refs.input) === null || _this$$refs$input3 === void 0 ? void 0 : _this$$refs$input3.blur();
22669
22681
  this.closeComboboxList();
22670
22682
  },
22671
22683
 
22672
22684
  moveFromChipToInput() {
22685
+ var _this$$refs$input4;
22686
+
22673
22687
  this.getLastChipButton().blur();
22674
- this.$refs.input.focus();
22688
+ (_this$$refs$input4 = this.$refs.input) === null || _this$$refs$input4 === void 0 ? void 0 : _this$$refs$input4.focus();
22675
22689
  this.showComboboxList();
22676
22690
  },
22677
22691
 
22678
22692
  navigateBetweenChips(target, toLeft) {
22693
+ var _this$$refs$chips;
22694
+
22679
22695
  const from = this.getChipButtons().indexOf(target);
22680
22696
  const to = toLeft ? from - 1 : from + 1;
22681
22697
 
22682
- if (to < 0 || to >= this.$refs.chips.length) {
22698
+ if (to < 0 || to >= ((_this$$refs$chips = this.$refs.chips) === null || _this$$refs$chips === void 0 ? void 0 : _this$$refs$chips.length)) {
22683
22699
  return;
22684
22700
  }
22685
22701
 
@@ -22771,8 +22787,8 @@ const CHIP_TOP_POSITION = {
22771
22787
  ;
22772
22788
  var combobox_multi_select_component = normalizeComponent(
22773
22789
  combobox_multi_select_combobox_multi_selectvue_type_script_lang_js_,
22774
- combobox_multi_selectvue_type_template_id_42ee0c13_render,
22775
- combobox_multi_selectvue_type_template_id_42ee0c13_staticRenderFns,
22790
+ combobox_multi_selectvue_type_template_id_4a2fe866_render,
22791
+ combobox_multi_selectvue_type_template_id_4a2fe866_staticRenderFns,
22776
22792
  false,
22777
22793
  null,
22778
22794
  null,
@@ -8438,8 +8438,8 @@ return [_c('ul',{ref:"listWrapper",class:_vm.listClasses,attrs:{"id":_vm.listId,
8438
8438
  var dropdownvue_type_template_id_c0aa082e_staticRenderFns = []
8439
8439
 
8440
8440
 
8441
- ;// 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/popover/popover.vue?vue&type=template&id=6d22723e&
8442
- var popovervue_type_template_id_6d22723e_render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',[(_vm.modal && _vm.isOpen)?_c('portal',[_c('div',{staticClass:"d-modal--transparent",attrs:{"aria-hidden":_vm.modal && _vm.isOpen ? 'false' : 'true'},on:{"click":function($event){$event.preventDefault();$event.stopPropagation();}}})]):_vm._e(),_c(_vm.elementType,_vm._g({ref:"popover",tag:"component",class:['d-popover', { 'd-popover__anchor--opened': _vm.isOpen }],attrs:{"data-qa":"dt-popover-container"}},_vm.$listeners),[_c('div',{ref:"anchor",attrs:{"id":!_vm.ariaLabelledby && _vm.labelledBy,"data-qa":"dt-popover-anchor","tabindex":_vm.openOnContext ? 0 : undefined},on:{"!click":function($event){return _vm.defaultToggleOpen.apply(null, arguments)},"contextmenu":_vm.onContext,"keydown":[function($event){if(!$event.type.indexOf('key')&&_vm._k($event.keyCode,"up",38,$event.key,["Up","ArrowUp"])){ return null; }$event.preventDefault();return _vm.onArrowKeyPress.apply(null, arguments)},function($event){if(!$event.type.indexOf('key')&&_vm._k($event.keyCode,"down",40,$event.key,["Down","ArrowDown"])){ return null; }$event.preventDefault();return _vm.onArrowKeyPress.apply(null, arguments)}],"!keydown":function($event){if(!$event.type.indexOf('key')&&_vm._k($event.keyCode,"escape",undefined,$event.key,undefined)){ return null; }return _vm.closePopover.apply(null, arguments)}}},[_vm._t("anchor",null,{"attrs":{
8441
+ ;// 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/popover/popover.vue?vue&type=template&id=01a6c752&
8442
+ var popovervue_type_template_id_01a6c752_render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',[(_vm.modal && _vm.isOpen)?_c('portal',[_c('div',{staticClass:"d-modal--transparent",attrs:{"aria-hidden":_vm.modal && _vm.isOpen ? 'false' : 'true'},on:{"click":function($event){$event.preventDefault();$event.stopPropagation();}}})]):_vm._e(),_c(_vm.elementType,_vm._g({ref:"popover",tag:"component",class:['d-popover', { 'd-popover__anchor--opened': _vm.isOpen }],attrs:{"data-qa":"dt-popover-container"}},_vm.$listeners),[_c('div',{ref:"anchor",attrs:{"id":!_vm.ariaLabelledby && _vm.labelledBy,"data-qa":"dt-popover-anchor","tabindex":_vm.openOnContext ? 0 : undefined},on:{"!click":function($event){return _vm.defaultToggleOpen.apply(null, arguments)},"contextmenu":_vm.onContext,"keydown":[function($event){if(!$event.type.indexOf('key')&&_vm._k($event.keyCode,"up",38,$event.key,["Up","ArrowUp"])){ return null; }$event.preventDefault();return _vm.onArrowKeyPress.apply(null, arguments)},function($event){if(!$event.type.indexOf('key')&&_vm._k($event.keyCode,"down",40,$event.key,["Down","ArrowDown"])){ return null; }$event.preventDefault();return _vm.onArrowKeyPress.apply(null, arguments)}],"!keydown":function($event){if(!$event.type.indexOf('key')&&_vm._k($event.keyCode,"escape",undefined,$event.key,undefined)){ return null; }return _vm.closePopover.apply(null, arguments)}}},[_vm._t("anchor",null,{"attrs":{
8443
8443
  'aria-expanded': _vm.isOpen.toString(),
8444
8444
  'aria-controls': _vm.id,
8445
8445
  'aria-haspopup': _vm.role,
@@ -8450,7 +8450,7 @@ var popovervue_type_template_id_6d22723e_render = function () {var _vm=this;var
8450
8450
  'd-popover__content',
8451
8451
  _vm.POPOVER_PADDING_CLASSES[_vm.padding],
8452
8452
  _vm.contentClass ],attrs:{"data-qa":"dt-popover-content"}},[_vm._t("content",null,{"close":_vm.closePopover})],2),(_vm.$slots.footerContent)?_c('popover-header-footer',{ref:"popover__footer",class:_vm.POPOVER_HEADER_FOOTER_PADDING_CLASSES[_vm.padding],attrs:{"type":"footer","content-class":_vm.footerClass},scopedSlots:_vm._u([{key:"content",fn:function(){return [_vm._t("footerContent",null,{"close":_vm.closePopover})]},proxy:true}],null,true)}):_vm._e(),(_vm.showVisuallyHiddenClose)?_c('sr-only-close-button',{attrs:{"visually-hidden-close-label":_vm.visuallyHiddenCloseLabel},on:{"close":_vm.closePopover}}):_vm._e()],1)],1)],1)}
8453
- var popovervue_type_template_id_6d22723e_staticRenderFns = []
8453
+ var popovervue_type_template_id_01a6c752_staticRenderFns = []
8454
8454
 
8455
8455
 
8456
8456
  ;// CONCATENATED MODULE: ./node_modules/@popperjs/core/lib/dom-utils/getBoundingClientRect.js
@@ -14116,7 +14116,7 @@ var popover_header_footer_component = normalizeComponent(
14116
14116
  },
14117
14117
 
14118
14118
  focusInitialElementById() {
14119
- var _this$$refs$content, _this$$refs$content$$;
14119
+ var _this$$refs$content, _this$$refs$content$$, _this$$refs$content2;
14120
14120
 
14121
14121
  const result = (_this$$refs$content = this.$refs.content) === null || _this$$refs$content === void 0 ? void 0 : (_this$$refs$content$$ = _this$$refs$content.$el) === null || _this$$refs$content$$ === void 0 ? void 0 : _this$$refs$content$$.querySelector(this.initialFocusElement);
14122
14122
 
@@ -14126,7 +14126,7 @@ var popover_header_footer_component = normalizeComponent(
14126
14126
  console.warn('Could not find the element specified in dt-popover prop "initialFocusElement". ' + 'Defaulting to focusing the dialog.');
14127
14127
  }
14128
14128
 
14129
- result ? result.focus() : this.$refs.content.$el.focus();
14129
+ result ? result.focus() : (_this$$refs$content2 = this.$refs.content) === null || _this$$refs$content2 === void 0 ? void 0 : _this$$refs$content2.$el.focus();
14130
14130
  },
14131
14131
 
14132
14132
  onResize() {
@@ -14170,8 +14170,10 @@ var popover_header_footer_component = normalizeComponent(
14170
14170
 
14171
14171
  (_this$$refs$popover__ = this.$refs.popover__header) === null || _this$$refs$popover__ === void 0 ? void 0 : _this$$refs$popover__.focusCloseButton();
14172
14172
  } else {
14173
+ var _this$$refs$content3;
14174
+
14173
14175
  // if there are no focusable elements at all focus the dialog itself
14174
- this.$refs.content.$el.focus();
14176
+ (_this$$refs$content3 = this.$refs.content) === null || _this$$refs$content3 === void 0 ? void 0 : _this$$refs$content3.$el.focus();
14175
14177
  }
14176
14178
  },
14177
14179
 
@@ -14215,8 +14217,8 @@ var popovervue_type_style_index_0_lang_less_ = __webpack_require__(2532);
14215
14217
 
14216
14218
  var popover_component = normalizeComponent(
14217
14219
  popover_popovervue_type_script_lang_js_,
14218
- popovervue_type_template_id_6d22723e_render,
14219
- popovervue_type_template_id_6d22723e_staticRenderFns,
14220
+ popovervue_type_template_id_01a6c752_render,
14221
+ popovervue_type_template_id_01a6c752_staticRenderFns,
14220
14222
  false,
14221
14223
  null,
14222
14224
  null,
@@ -21535,15 +21537,15 @@ var stack_component = normalizeComponent(
21535
21537
  /* harmony default export */ const stack = (stack_component.exports);
21536
21538
  ;// CONCATENATED MODULE: ./components/stack/index.js
21537
21539
 
21538
- ;// 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=386059b2&
21539
- var combobox_with_popovervue_type_template_id_386059b2_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){
21540
+ ;// 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=1ab85920&
21541
+ var combobox_with_popovervue_type_template_id_1ab85920_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){
21540
21542
  var inputProps = ref.inputProps;
21541
21543
  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){
21542
21544
  var opened = ref.opened;
21543
21545
  var listProps = ref.listProps;
21544
21546
  var clearHighlightIndex = ref.clearHighlightIndex;
21545
21547
  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,"transition":_vm.transition,"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))}
21546
- var combobox_with_popovervue_type_template_id_386059b2_staticRenderFns = []
21548
+ var combobox_with_popovervue_type_template_id_1ab85920_staticRenderFns = []
21547
21549
 
21548
21550
 
21549
21551
  ;// 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&
@@ -21998,7 +22000,9 @@ var combobox_with_popovervue_type_template_id_386059b2_staticRenderFns = []
21998
22000
  },
21999
22001
 
22000
22002
  onFocusIn(e) {
22001
- if (this.hasSuggestionList && e && this.$refs.input.querySelector('input') === e.target) {
22003
+ var _this$$refs$input;
22004
+
22005
+ if (this.hasSuggestionList && e && ((_this$$refs$input = this.$refs.input) === null || _this$$refs$input === void 0 ? void 0 : _this$$refs$input.querySelector('input')) === e.target) {
22002
22006
  // only trigger if we show suggestion list when focused, and
22003
22007
  // it's the input specifically that was focused
22004
22008
  this.showComboboxList();
@@ -22006,10 +22010,10 @@ var combobox_with_popovervue_type_template_id_386059b2_staticRenderFns = []
22006
22010
  },
22007
22011
 
22008
22012
  onFocusOut(e) {
22009
- var _this$$refs$popover$t, _e$composedPath;
22013
+ var _this$$refs$popover, _this$$refs$popover$t, _e$composedPath;
22010
22014
 
22011
22015
  // Check if the focus change was to another target within the combobox component
22012
- const popoverEl = (_this$$refs$popover$t = this.$refs.popover.tip) === null || _this$$refs$popover$t === void 0 ? void 0 : _this$$refs$popover$t.popper;
22016
+ const popoverEl = (_this$$refs$popover = this.$refs.popover) === null || _this$$refs$popover === void 0 ? void 0 : (_this$$refs$popover$t = _this$$refs$popover.tip) === null || _this$$refs$popover$t === void 0 ? void 0 : _this$$refs$popover$t.popper;
22013
22017
  const comboboxEl = this.$refs.input;
22014
22018
  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
22015
22019
 
@@ -22038,8 +22042,8 @@ var combobox_with_popovervue_type_template_id_386059b2_staticRenderFns = []
22038
22042
  ;
22039
22043
  var combobox_with_popover_component = normalizeComponent(
22040
22044
  combobox_with_popover_combobox_with_popovervue_type_script_lang_js_,
22041
- combobox_with_popovervue_type_template_id_386059b2_render,
22042
- combobox_with_popovervue_type_template_id_386059b2_staticRenderFns,
22045
+ combobox_with_popovervue_type_template_id_1ab85920_render,
22046
+ combobox_with_popovervue_type_template_id_1ab85920_staticRenderFns,
22043
22047
  false,
22044
22048
  null,
22045
22049
  null,
@@ -22050,11 +22054,11 @@ var combobox_with_popover_component = normalizeComponent(
22050
22054
  /* harmony default export */ const combobox_with_popover = (combobox_with_popover_component.exports);
22051
22055
  ;// CONCATENATED MODULE: ./recipes/comboboxes/combobox_with_popover/index.js
22052
22056
 
22053
- ;// 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_multi_select/combobox_multi_select.vue?vue&type=template&id=42ee0c13&
22054
- var combobox_multi_selectvue_type_template_id_42ee0c13_render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('dt-recipe-combobox-with-popover',{ref:"comboboxWithPopover",attrs:{"label":_vm.label,"show-list":_vm.showList,"max-height":_vm.listMaxHeight,"popover-offset":_vm.popoverOffset,"has-suggestion-list":_vm.hasSuggestionList,"visually-hidden-close-label":_vm.visuallyHiddenCloseLabel,"visually-hidden-close":_vm.visuallyHiddenClose,"content-width":"anchor","append-to":_vm.appendTo,"transition":_vm.transition},on:{"select":_vm.onComboboxSelect},scopedSlots:_vm._u([{key:"input",fn:function(ref){
22057
+ ;// 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_multi_select/combobox_multi_select.vue?vue&type=template&id=4a2fe866&
22058
+ var combobox_multi_selectvue_type_template_id_4a2fe866_render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('dt-recipe-combobox-with-popover',{ref:"comboboxWithPopover",attrs:{"label":_vm.label,"show-list":_vm.showList,"max-height":_vm.listMaxHeight,"popover-offset":_vm.popoverOffset,"has-suggestion-list":_vm.hasSuggestionList,"visually-hidden-close-label":_vm.visuallyHiddenCloseLabel,"visually-hidden-close":_vm.visuallyHiddenClose,"content-width":"anchor","append-to":_vm.appendTo,"transition":_vm.transition},on:{"select":_vm.onComboboxSelect},scopedSlots:_vm._u([{key:"input",fn:function(ref){
22055
22059
  var onInput = ref.onInput;
22056
22060
  return [_c('span',{ref:"inputSlotWrapper",staticClass:"d-ps-relative d-d-block"},[_c('span',{ref:"chipsWrapper",staticClass:"d-ps-absolute d-mx2 d-pl1"},_vm._l((_vm.selectedItems),function(item){return _c('dt-chip',_vm._g({key:item.id,ref:"chips",refInFor:true,class:['d-mt4', 'd-mx2', 'd-zi-base1'],attrs:{"label-class":['d-chip__label'],"close-button-props":{ ariaLabel: 'close' },"size":_vm.CHIP_SIZES[_vm.size]},on:{"keyup":function($event){if(!$event.type.indexOf('key')&&_vm._k($event.keyCode,"backspace",undefined,$event.key,undefined)){ return null; }return _vm.onChipRemove(item)},"close":function($event){return _vm.onChipRemove(item)}}},_vm.chipListeners),[_vm._v(" "+_vm._s(item)+" ")])}),1),_c('dt-input',_vm._g({ref:"input",staticClass:"d-fl-grow1",attrs:{"aria-label":_vm.label,"label":_vm.labelVisible ? _vm.label : '',"description":_vm.description,"placeholder":_vm.inputPlaceHolder,"show-messages":_vm.showInputMessages,"messages":_vm.inputMessages,"size":_vm.size},on:{"input":onInput},model:{value:(_vm.value),callback:function ($$v) {_vm.value=$$v},expression:"value"}},_vm.inputListeners)),_c('dt-validation-messages',{attrs:{"validation-messages":_vm.maxSelectedMessage,"show-messages":_vm.showValidationMessages}})],1)]}},{key:"header",fn:function(){return [(_vm.$slots.header)?_c('div',{ref:"header"},[_vm._t("header")],2):_vm._e()]},proxy:true},{key:"list",fn:function(){return [_c('div',{ref:"list",on:{"mousedown":function($event){$event.preventDefault();}}},[(!_vm.loading)?_vm._t("list"):_c('div',{staticClass:"d-ta-center d-py16"},[_vm._v(" "+_vm._s(_vm.loadingMessage)+" ")])],2)]},proxy:true},{key:"footer",fn:function(){return [(_vm.$slots.footer)?_c('div',{ref:"footer"},[_vm._t("footer")],2):_vm._e()]},proxy:true}],null,true)})}
22057
- var combobox_multi_selectvue_type_template_id_42ee0c13_staticRenderFns = []
22061
+ var combobox_multi_selectvue_type_template_id_4a2fe866_staticRenderFns = []
22058
22062
 
22059
22063
 
22060
22064
  ;// CONCATENATED MODULE: ./recipes/comboboxes/combobox_multi_select/combobox_multi_select_story_constants.js
@@ -22590,8 +22594,10 @@ const CHIP_TOP_POSITION = {
22590
22594
 
22591
22595
  methods: {
22592
22596
  onChipRemove(item) {
22597
+ var _this$$refs$input;
22598
+
22593
22599
  this.$emit('remove', item);
22594
- this.$refs.input.focus();
22600
+ (_this$$refs$input = this.$refs.input) === null || _this$$refs$input === void 0 ? void 0 : _this$$refs$input.focus();
22595
22601
  },
22596
22602
 
22597
22603
  onComboboxSelect(i) {
@@ -22600,19 +22606,23 @@ const CHIP_TOP_POSITION = {
22600
22606
  },
22601
22607
 
22602
22608
  showComboboxList() {
22609
+ var _this$$refs$comboboxW;
22610
+
22603
22611
  if (this.showList != null) {
22604
22612
  return;
22605
22613
  }
22606
22614
 
22607
- this.$refs.comboboxWithPopover.showComboboxList();
22615
+ (_this$$refs$comboboxW = this.$refs.comboboxWithPopover) === null || _this$$refs$comboboxW === void 0 ? void 0 : _this$$refs$comboboxW.showComboboxList();
22608
22616
  },
22609
22617
 
22610
22618
  closeComboboxList() {
22619
+ var _this$$refs$comboboxW2;
22620
+
22611
22621
  if (this.showList != null) {
22612
22622
  return;
22613
22623
  }
22614
22624
 
22615
- this.$refs.comboboxWithPopover.closeComboboxList();
22625
+ (_this$$refs$comboboxW2 = this.$refs.comboboxWithPopover) === null || _this$$refs$comboboxW2 === void 0 ? void 0 : _this$$refs$comboboxW2.closeComboboxList();
22616
22626
  },
22617
22627
 
22618
22628
  getChipButtons() {
@@ -22636,9 +22646,9 @@ const CHIP_TOP_POSITION = {
22636
22646
  },
22637
22647
 
22638
22648
  getInput() {
22639
- var _this$$refs$input;
22649
+ var _this$$refs$input2;
22640
22650
 
22641
- return (_this$$refs$input = this.$refs.input) === null || _this$$refs$input === void 0 ? void 0 : _this$$refs$input.$refs.input;
22651
+ return (_this$$refs$input2 = this.$refs.input) === null || _this$$refs$input2 === void 0 ? void 0 : _this$$refs$input2.$refs.input;
22642
22652
  },
22643
22653
 
22644
22654
  onChipKeyup(event) {
@@ -22674,22 +22684,28 @@ const CHIP_TOP_POSITION = {
22674
22684
  },
22675
22685
 
22676
22686
  moveFromInputToChip() {
22687
+ var _this$$refs$input3;
22688
+
22677
22689
  this.getLastChipButton().focus();
22678
- this.$refs.input.blur();
22690
+ (_this$$refs$input3 = this.$refs.input) === null || _this$$refs$input3 === void 0 ? void 0 : _this$$refs$input3.blur();
22679
22691
  this.closeComboboxList();
22680
22692
  },
22681
22693
 
22682
22694
  moveFromChipToInput() {
22695
+ var _this$$refs$input4;
22696
+
22683
22697
  this.getLastChipButton().blur();
22684
- this.$refs.input.focus();
22698
+ (_this$$refs$input4 = this.$refs.input) === null || _this$$refs$input4 === void 0 ? void 0 : _this$$refs$input4.focus();
22685
22699
  this.showComboboxList();
22686
22700
  },
22687
22701
 
22688
22702
  navigateBetweenChips(target, toLeft) {
22703
+ var _this$$refs$chips;
22704
+
22689
22705
  const from = this.getChipButtons().indexOf(target);
22690
22706
  const to = toLeft ? from - 1 : from + 1;
22691
22707
 
22692
- if (to < 0 || to >= this.$refs.chips.length) {
22708
+ if (to < 0 || to >= ((_this$$refs$chips = this.$refs.chips) === null || _this$$refs$chips === void 0 ? void 0 : _this$$refs$chips.length)) {
22693
22709
  return;
22694
22710
  }
22695
22711
 
@@ -22781,8 +22797,8 @@ const CHIP_TOP_POSITION = {
22781
22797
  ;
22782
22798
  var combobox_multi_select_component = normalizeComponent(
22783
22799
  combobox_multi_select_combobox_multi_selectvue_type_script_lang_js_,
22784
- combobox_multi_selectvue_type_template_id_42ee0c13_render,
22785
- combobox_multi_selectvue_type_template_id_42ee0c13_staticRenderFns,
22800
+ combobox_multi_selectvue_type_template_id_4a2fe866_render,
22801
+ combobox_multi_selectvue_type_template_id_4a2fe866_staticRenderFns,
22786
22802
  false,
22787
22803
  null,
22788
22804
  null,