@dialpad/dialtone-vue 2.32.1 → 2.33.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 (5) hide show
  1. package/dist/component-documentation.json +1 -1
  2. package/dist/dialtone-vue.common.js +283 -115
  3. package/dist/dialtone-vue.umd.js +285 -117
  4. package/dist/dialtone-vue.umd.min.js +1 -1
  5. package/package.json +1 -1
package/dist/dialtone-vue.common.js CHANGED
@@ -1830,9 +1830,9 @@ var badge_component = normalizeComponent(
1830
1830
  ;// CONCATENATED MODULE: ./components/badge/index.js
1831
1831
 
1832
1832
 
1833
- ;// 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/banner/banner.vue?vue&type=template&id=6a644b26&
1834
- var bannervue_type_template_id_6a644b26_render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('aside',{class:_vm.bannerClass,style:(_vm.bannerBackgroundImage),attrs:{"role":_vm.role},on:{"keydown":function($event){if(!$event.type.indexOf('key')&&_vm._k($event.keyCode,"tab",9,$event.key,"Tab")){ return null; }return _vm.trapFocus.apply(null, arguments)}}},[_c('div',{staticClass:"d-banner__dialog",class:_vm.dialogClass,attrs:{"aria-labelledby":_vm.titleId,"aria-describedby":_vm.contentId}},[(!_vm.hideIcon)?_c('dt-notice-icon',_vm._g({attrs:{"kind":_vm.kind}},_vm.$listeners),[_vm._t("icon")],2):_vm._e(),_c('dt-notice-content',_vm._g({attrs:{"title-id":_vm.titleId,"content-id":_vm.contentId,"title":_vm.title},scopedSlots:_vm._u([{key:"titleOverride",fn:function(){return [_vm._t("titleOverride")]},proxy:true}],null,true)},_vm.$listeners),[_vm._t("default")],2),_c('dt-notice-action',_vm._g({attrs:{"hide-close":_vm.hideClose,"close-button-props":_vm.closeButtonProps}},_vm.$listeners),[_vm._t("action")],2)],1)])}
1835
- var bannervue_type_template_id_6a644b26_staticRenderFns = []
1833
+ ;// 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/banner/banner.vue?vue&type=template&id=756779c1&
1834
+ var bannervue_type_template_id_756779c1_render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('aside',{class:_vm.bannerClass,style:(_vm.bannerBackgroundImage),attrs:{"role":_vm.role},on:{"keydown":function($event){if(!$event.type.indexOf('key')&&_vm._k($event.keyCode,"tab",9,$event.key,"Tab")){ return null; }return _vm.trapFocus.apply(null, arguments)}}},[_c('div',{staticClass:"d-banner__dialog",class:_vm.dialogClass,attrs:{"aria-labelledby":_vm.titleId,"aria-describedby":_vm.contentId}},[(!_vm.hideIcon)?_c('dt-notice-icon',_vm._g({attrs:{"kind":_vm.kind}},_vm.$listeners),[_vm._t("icon")],2):_vm._e(),_c('dt-notice-content',_vm._g({attrs:{"title-id":_vm.titleId,"content-id":_vm.contentId,"title":_vm.title},scopedSlots:_vm._u([{key:"titleOverride",fn:function(){return [_vm._t("titleOverride")]},proxy:true}],null,true)},_vm.$listeners),[_vm._t("default")],2),_c('dt-notice-action',_vm._g({attrs:{"hide-close":_vm.hideClose,"close-button-props":_vm.closeButtonProps,"visually-hidden-close":_vm.visuallyHiddenClose,"visually-hidden-close-label":_vm.visuallyHiddenCloseLabel}},_vm.$listeners),[_vm._t("action")],2)],1)])}
1835
+ var bannervue_type_template_id_756779c1_staticRenderFns = []
1836
1836
 
1837
1837
 
1838
1838
  ;// 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/notice/notice_icon.vue?vue&type=template&id=5544041e&
@@ -2128,9 +2128,9 @@ var notice_content_component = normalizeComponent(
2128
2128
  )
2129
2129
 
2130
2130
  /* harmony default export */ const notice_content = (notice_content_component.exports);
2131
- ;// 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/notice/notice_action.vue?vue&type=template&id=49bf6244&
2132
- var notice_actionvue_type_template_id_49bf6244_render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{staticClass:"d-notice__actions",attrs:{"data-qa":"notice-content-actions"}},[_vm._t("default"),(!_vm.hideClose)?_c('dt-button',_vm._b({ref:"closeButton",attrs:{"size":"sm","importance":"clear","circle":"","aria-label":_vm.closeButtonProps.ariaLabel ? _vm.closeButtonProps.ariaLabel : 'Close'},on:{"click":_vm.close},scopedSlots:_vm._u([{key:"icon",fn:function(){return [_c('icon-close')]},proxy:true}],null,false,4267981299)},'dt-button',_vm.closeButtonProps,false)):_vm._e()],2)}
2133
- var notice_actionvue_type_template_id_49bf6244_staticRenderFns = []
2131
+ ;// 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/notice/notice_action.vue?vue&type=template&id=1daa6e86&
2132
+ var notice_actionvue_type_template_id_1daa6e86_render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{staticClass:"d-notice__actions",attrs:{"data-qa":"notice-content-actions"}},[_vm._t("default"),(!_vm.hideClose)?_c('dt-button',_vm._b({ref:"closeButton",attrs:{"data-qa":"dt-notice-action-close-button","size":"sm","importance":"clear","circle":"","aria-label":_vm.closeButtonProps.ariaLabel ? _vm.closeButtonProps.ariaLabel : 'Close'},on:{"click":_vm.close},scopedSlots:_vm._u([{key:"icon",fn:function(){return [_c('icon-close')]},proxy:true}],null,false,4267981299)},'dt-button',_vm.closeButtonProps,false)):_vm._e(),(_vm.showVisuallyHiddenClose)?_c('sr-only-close-button',{attrs:{"visually-hidden-close-label":_vm.visuallyHiddenCloseLabel},on:{"close":_vm.close}}):_vm._e()],2)}
2133
+ var notice_actionvue_type_template_id_1daa6e86_staticRenderFns = []
2134
2134
 
2135
2135
 
2136
2136
  ;// 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!./node_modules/@dialpad/dialtone/lib/dist/vue/icons/IconClose.vue?vue&type=template&id=4ef5457b&
@@ -2576,6 +2576,125 @@ var button_component = normalizeComponent(
2576
2576
  )
2577
2577
 
2578
2578
  /* harmony default export */ const button_button = (button_component.exports);
2579
+ ;// CONCATENATED MODULE: ./common/mixins/sr_only_close_button.js
2580
+ /**
2581
+ * @displayName Sr-Only close button mixin
2582
+ */
2583
+ /* harmony default export */ const sr_only_close_button = ({
2584
+ props: {
2585
+ /**
2586
+ * If true, a hidden close button is included for screen readers
2587
+ * @values true, false
2588
+ */
2589
+ visuallyHiddenClose: {
2590
+ type: Boolean,
2591
+ default: false
2592
+ },
2593
+
2594
+ /**
2595
+ * Label for the visually hidden close button
2596
+ * Required if visuallyHiddenClose is set to `true`
2597
+ */
2598
+ visuallyHiddenCloseLabel: {
2599
+ type: String,
2600
+ default: null
2601
+ }
2602
+ },
2603
+ watch: {
2604
+ $props: {
2605
+ immediate: true,
2606
+ deep: true,
2607
+
2608
+ handler() {
2609
+ this.validateVisuallyHiddenCloseProps();
2610
+ }
2611
+
2612
+ }
2613
+ },
2614
+ computed: {
2615
+ showVisuallyHiddenClose() {
2616
+ return this.visuallyHiddenClose && this.visuallyHiddenCloseLabel != null;
2617
+ }
2618
+
2619
+ },
2620
+ methods: {
2621
+ validateVisuallyHiddenCloseProps() {
2622
+ if (this.visuallyHiddenClose && !this.visuallyHiddenCloseLabel) {
2623
+ console.error(`If visuallyHiddenClose prop is true, the component includes
2624
+ a visually hidden close button and you must set the visuallyHiddenCloseLabel prop.`);
2625
+ }
2626
+ }
2627
+
2628
+ }
2629
+ });
2630
+ ;// 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!./common/sr_only_close_button.vue?vue&type=template&id=3480ff70&
2631
+ var sr_only_close_buttonvue_type_template_id_3480ff70_render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('dt-button',{staticClass:"d-vi-visible-sr",attrs:{"id":"sr-only-close-button","data-qa":"dt-sr-only-close-button","aria-label":_vm.visuallyHiddenCloseLabel},on:{"click":_vm.close,"keydown":function($event){if(!$event.type.indexOf('key')&&_vm._k($event.keyCode,"space",32,$event.key,[" ","Spacebar"])){ return null; }$event.preventDefault();$event.stopPropagation();return _vm.close.apply(null, arguments)}}},[_c('icon-close')],1)}
2632
+ var sr_only_close_buttonvue_type_template_id_3480ff70_staticRenderFns = []
2633
+
2634
+
2635
+ ;// CONCATENATED MODULE: ./components/button/index.js
2636
+
2637
+ ;// 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!./common/sr_only_close_button.vue?vue&type=script&lang=js&
2638
+ //
2639
+ //
2640
+ //
2641
+ //
2642
+ //
2643
+ //
2644
+ //
2645
+ //
2646
+ //
2647
+ //
2648
+ //
2649
+ //
2650
+ //
2651
+
2652
+
2653
+ /* harmony default export */ const sr_only_close_buttonvue_type_script_lang_js_ = ({
2654
+ name: 'SrOnlyCloseButton',
2655
+ components: {
2656
+ IconClose: IconClose,
2657
+ DtButton: button_button
2658
+ },
2659
+ props: {
2660
+ /**
2661
+ * Label for the visually hidden close button
2662
+ * Required if visuallyHiddenClose is set to `true`
2663
+ */
2664
+ visuallyHiddenCloseLabel: {
2665
+ type: String,
2666
+ default: null
2667
+ }
2668
+ },
2669
+ methods: {
2670
+ close() {
2671
+ this.$emit('close');
2672
+ }
2673
+
2674
+ }
2675
+ });
2676
+ ;// CONCATENATED MODULE: ./common/sr_only_close_button.vue?vue&type=script&lang=js&
2677
+ /* harmony default export */ const common_sr_only_close_buttonvue_type_script_lang_js_ = (sr_only_close_buttonvue_type_script_lang_js_);
2678
+ ;// CONCATENATED MODULE: ./common/sr_only_close_button.vue
2679
+
2680
+
2681
+
2682
+
2683
+
2684
+ /* normalize component */
2685
+ ;
2686
+ var sr_only_close_button_component = normalizeComponent(
2687
+ common_sr_only_close_buttonvue_type_script_lang_js_,
2688
+ sr_only_close_buttonvue_type_template_id_3480ff70_render,
2689
+ sr_only_close_buttonvue_type_template_id_3480ff70_staticRenderFns,
2690
+ false,
2691
+ null,
2692
+ null,
2693
+ null
2694
+
2695
+ )
2696
+
2697
+ /* harmony default export */ const common_sr_only_close_button = (sr_only_close_button_component.exports);
2579
2698
  ;// 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!./components/notice/notice_action.vue?vue&type=script&lang=js&
2580
2699
  //
2581
2700
  //
@@ -2601,14 +2720,24 @@ var button_component = normalizeComponent(
2601
2720
  //
2602
2721
  //
2603
2722
  //
2723
+ //
2724
+ //
2725
+ //
2726
+ //
2727
+ //
2728
+ //
2729
+
2730
+
2604
2731
 
2605
2732
 
2606
2733
  /* harmony default export */ const notice_actionvue_type_script_lang_js_ = ({
2607
2734
  name: 'DtNoticeAction',
2608
2735
  components: {
2609
2736
  IconClose: IconClose,
2610
- DtButton: button_button
2737
+ DtButton: button_button,
2738
+ SrOnlyCloseButton: common_sr_only_close_button
2611
2739
  },
2740
+ mixins: [sr_only_close_button],
2612
2741
  props: {
2613
2742
  /**
2614
2743
  * Props for the notice close button.
@@ -2634,6 +2763,17 @@ var button_component = normalizeComponent(
2634
2763
  * @event close
2635
2764
  */
2636
2765
  'close'],
2766
+ watch: {
2767
+ $props: {
2768
+ immediate: true,
2769
+ deep: true,
2770
+
2771
+ handler() {
2772
+ this.validateProps();
2773
+ }
2774
+
2775
+ }
2776
+ },
2637
2777
 
2638
2778
  created() {
2639
2779
  if (!this.hideClose && !this.closeButtonProps.ariaLabel) {
@@ -2656,6 +2796,12 @@ var button_component = normalizeComponent(
2656
2796
  methods: {
2657
2797
  close() {
2658
2798
  this.$emit('close');
2799
+ },
2800
+
2801
+ validateProps() {
2802
+ if (this.hideClose && !this.visuallyHiddenClose) {
2803
+ console.error('If hideClose prop is true, visuallyHiddenClose and visuallyHiddenCloseLabel props ' + 'need to be set so the component always includes a close button');
2804
+ }
2659
2805
  }
2660
2806
 
2661
2807
  }
@@ -2672,8 +2818,8 @@ var button_component = normalizeComponent(
2672
2818
  ;
2673
2819
  var notice_action_component = normalizeComponent(
2674
2820
  notice_notice_actionvue_type_script_lang_js_,
2675
- notice_actionvue_type_template_id_49bf6244_render,
2676
- notice_actionvue_type_template_id_49bf6244_staticRenderFns,
2821
+ notice_actionvue_type_template_id_1daa6e86_render,
2822
+ notice_actionvue_type_template_id_1daa6e86_staticRenderFns,
2677
2823
  false,
2678
2824
  null,
2679
2825
  null,
@@ -2848,6 +2994,9 @@ const focusableElementsList = `button,[href],input,select,textarea,details,[tabi
2848
2994
  //
2849
2995
  //
2850
2996
  //
2997
+ //
2998
+ //
2999
+
2851
3000
 
2852
3001
 
2853
3002
 
@@ -2867,7 +3016,7 @@ const focusableElementsList = `button,[href],input,select,textarea,details,[tabi
2867
3016
  DtNoticeContent: notice_content,
2868
3017
  DtNoticeAction: notice_action
2869
3018
  },
2870
- mixins: [modal],
3019
+ mixins: [modal, sr_only_close_button],
2871
3020
  props: {
2872
3021
  /**
2873
3022
  * Sets an ID on the title element of the component. Useful for aria-describedby
@@ -3050,8 +3199,8 @@ const focusableElementsList = `button,[href],input,select,textarea,details,[tabi
3050
3199
  ;
3051
3200
  var banner_component = normalizeComponent(
3052
3201
  banner_bannervue_type_script_lang_js_,
3053
- bannervue_type_template_id_6a644b26_render,
3054
- bannervue_type_template_id_6a644b26_staticRenderFns,
3202
+ bannervue_type_template_id_756779c1_render,
3203
+ bannervue_type_template_id_756779c1_staticRenderFns,
3055
3204
  false,
3056
3205
  null,
3057
3206
  null,
@@ -3397,8 +3546,6 @@ var breadcrumbs_component = normalizeComponent(
3397
3546
 
3398
3547
 
3399
3548
 
3400
- ;// CONCATENATED MODULE: ./components/button/index.js
3401
-
3402
3549
  ;// 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/button_group/button_group.vue?vue&type=template&id=26eb52e6&
3403
3550
  var button_groupvue_type_template_id_26eb52e6_render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{class:[
3404
3551
  'd-btn-group',
@@ -3842,7 +3989,7 @@ const ERROR_INVALID_LIST_ELEMENT = 'listElementKey is required or the referenced
3842
3989
  return null;
3843
3990
  }
3844
3991
 
3845
- return Array.from(listElement.querySelectorAll(`[role="${listItemRole}"]`));
3992
+ return Array.from(listElement.querySelectorAll(`[role="${listItemRole}"], #sr-only-close-button`));
3846
3993
  },
3847
3994
 
3848
3995
  onUpKey() {
@@ -3945,7 +4092,7 @@ const ERROR_INVALID_LIST_ELEMENT = 'listElementKey is required or the referenced
3945
4092
  return;
3946
4093
  }
3947
4094
 
3948
- const listItems = Array.from(listElement.querySelectorAll(`[role="${listItemRole}"]`));
4095
+ const listItems = Array.from(listElement.querySelectorAll(`[role="${listItemRole}"], #sr-only-close-button`));
3949
4096
  return listItems.indexOf(listElement.querySelector(`#${id}`));
3950
4097
  },
3951
4098
 
@@ -3958,7 +4105,7 @@ const ERROR_INVALID_LIST_ELEMENT = 'listElementKey is required or the referenced
3958
4105
  return;
3959
4106
  }
3960
4107
 
3961
- return (_listElement$querySel = listElement.querySelectorAll(`[role="${listItemRole}"]`)[index]) === null || _listElement$querySel === void 0 ? void 0 : _listElement$querySel.id;
4108
+ return (_listElement$querySel = listElement.querySelectorAll(`[role="${listItemRole}"], #sr-only-close-button`)[index]) === null || _listElement$querySel === void 0 ? void 0 : _listElement$querySel.id;
3962
4109
  },
3963
4110
 
3964
4111
  scrollActiveItemIntoViewIfNeeded() {
@@ -5311,9 +5458,9 @@ var combobox_loading_list_component = normalizeComponent(
5311
5458
  )
5312
5459
 
5313
5460
  /* harmony default export */ const combobox_loading_list = (combobox_loading_list_component.exports);
5314
- ;// 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/combobox/combobox_empty-list.vue?vue&type=template&id=d0c59b2c&
5315
- var combobox_empty_listvue_type_template_id_d0c59b2c_render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('ol',{staticClass:"d-p0",attrs:{"data-qa":"dt-combobox-empty-list"}},[_c('dt-list-item',{staticClass:"d-d-flex d-jc-center",attrs:{"role":"option","navigation-type":"arrow-keys"}},[_c('span',[_vm._v(_vm._s(_vm.message))])])],1)}
5316
- var combobox_empty_listvue_type_template_id_d0c59b2c_staticRenderFns = []
5461
+ ;// 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/combobox/combobox_empty-list.vue?vue&type=template&id=ee5abe2c&
5462
+ var combobox_empty_listvue_type_template_id_ee5abe2c_render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('ol',{staticClass:"d-p0",attrs:{"data-qa":"dt-combobox-empty-list"}},[_c('dt-list-item',{staticClass:"d-d-flex d-jc-center",attrs:{"role":"option","navigation-type":"none"}},[_c('span',[_vm._v(_vm._s(_vm.message))])])],1)}
5463
+ var combobox_empty_listvue_type_template_id_ee5abe2c_staticRenderFns = []
5317
5464
 
5318
5465
 
5319
5466
  ;// 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!./components/combobox/combobox_empty-list.vue?vue&type=script&lang=js&
@@ -5360,8 +5507,8 @@ var combobox_empty_listvue_type_template_id_d0c59b2c_staticRenderFns = []
5360
5507
  ;
5361
5508
  var combobox_empty_list_component = normalizeComponent(
5362
5509
  combobox_combobox_empty_listvue_type_script_lang_js_,
5363
- combobox_empty_listvue_type_template_id_d0c59b2c_render,
5364
- combobox_empty_listvue_type_template_id_d0c59b2c_staticRenderFns,
5510
+ combobox_empty_listvue_type_template_id_ee5abe2c_render,
5511
+ combobox_empty_listvue_type_template_id_ee5abe2c_staticRenderFns,
5365
5512
  false,
5366
5513
  null,
5367
5514
  null,
@@ -6384,17 +6531,17 @@ var collapsible_component = normalizeComponent(
6384
6531
  /* harmony default export */ const collapsible = (collapsible_component.exports);
6385
6532
  ;// CONCATENATED MODULE: ./components/collapsible/index.js
6386
6533
 
6387
- ;// 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/dropdown/dropdown.vue?vue&type=template&id=0ddf9e89&
6388
- var dropdownvue_type_template_id_0ddf9e89_render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('dt-popover',_vm._g({ref:"popover",attrs:{"content-width":_vm.contentWidth,"open":_vm.open,"placement":_vm.placement,"initial-focus-element":_vm.openedWithKeyboard ? 'first' : 'dialog',"fallback-placements":_vm.fallbackPlacements,"padding":"none","role":"menu","modal":_vm.modal,"max-height":_vm.maxHeight,"max-width":_vm.maxWidth,"open-with-arrow-keys":true,"open-on-context":_vm.openOnContext},on:{"opened":_vm.updateInitialHighlightIndex,"keydown":[function($event){if(!$event.type.indexOf('key')&&_vm._k($event.keyCode,"enter",13,$event.key,"Enter")){ return null; }return _vm.onEnterKey.apply(null, arguments)},function($event){if(!$event.type.indexOf('key')&&_vm._k($event.keyCode,"space",32,$event.key,[" ","Spacebar"])){ return null; }return _vm.onSpaceKey.apply(null, arguments)},function($event){if(!$event.type.indexOf('key')&&_vm._k($event.keyCode,"up",38,$event.key,["Up","ArrowUp"])){ return null; }$event.stopPropagation();$event.preventDefault();return _vm.onKeyValidation($event, 'onUpKeyPress')},function($event){if(!$event.type.indexOf('key')&&_vm._k($event.keyCode,"down",40,$event.key,["Down","ArrowDown"])){ return null; }$event.stopPropagation();$event.preventDefault();return _vm.onKeyValidation($event, 'onDownKeyPress')},function($event){if(!$event.type.indexOf('key')&&_vm._k($event.keyCode,"home",undefined,$event.key,undefined)){ return null; }$event.stopPropagation();$event.preventDefault();return _vm.onKeyValidation($event, 'onHomeKeyPress')},function($event){if(!$event.type.indexOf('key')&&_vm._k($event.keyCode,"end",undefined,$event.key,undefined)){ return null; }$event.stopPropagation();$event.preventDefault();return _vm.onKeyValidation($event, 'onEndKeyPress')},function($event){return _vm.onKeyValidation($event, 'onKeyPress')}]},scopedSlots:_vm._u([{key:"anchor",fn:function(ref){
6534
+ ;// 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/dropdown/dropdown.vue?vue&type=template&id=0a8a683d&
6535
+ var dropdownvue_type_template_id_0a8a683d_render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('dt-popover',_vm._g({ref:"popover",attrs:{"content-width":_vm.contentWidth,"open":_vm.open,"placement":_vm.placement,"initial-focus-element":_vm.openedWithKeyboard ? 'first' : 'dialog',"fallback-placements":_vm.fallbackPlacements,"padding":"none","role":"menu","modal":_vm.modal,"max-height":_vm.maxHeight,"max-width":_vm.maxWidth,"open-with-arrow-keys":true,"open-on-context":_vm.openOnContext},on:{"opened":_vm.updateInitialHighlightIndex,"keydown":[function($event){if(!$event.type.indexOf('key')&&_vm._k($event.keyCode,"enter",13,$event.key,"Enter")){ return null; }return _vm.onEnterKey.apply(null, arguments)},function($event){if(!$event.type.indexOf('key')&&_vm._k($event.keyCode,"space",32,$event.key,[" ","Spacebar"])){ return null; }return _vm.onSpaceKey.apply(null, arguments)},function($event){if(!$event.type.indexOf('key')&&_vm._k($event.keyCode,"up",38,$event.key,["Up","ArrowUp"])){ return null; }$event.stopPropagation();$event.preventDefault();return _vm.onKeyValidation($event, 'onUpKeyPress')},function($event){if(!$event.type.indexOf('key')&&_vm._k($event.keyCode,"down",40,$event.key,["Down","ArrowDown"])){ return null; }$event.stopPropagation();$event.preventDefault();return _vm.onKeyValidation($event, 'onDownKeyPress')},function($event){if(!$event.type.indexOf('key')&&_vm._k($event.keyCode,"home",undefined,$event.key,undefined)){ return null; }$event.stopPropagation();$event.preventDefault();return _vm.onKeyValidation($event, 'onHomeKeyPress')},function($event){if(!$event.type.indexOf('key')&&_vm._k($event.keyCode,"end",undefined,$event.key,undefined)){ return null; }$event.stopPropagation();$event.preventDefault();return _vm.onKeyValidation($event, 'onEndKeyPress')},function($event){return _vm.onKeyValidation($event, 'onKeyPress')}]},scopedSlots:_vm._u([{key:"anchor",fn:function(ref){
6389
6536
  var attrs = ref.attrs;
6390
6537
  return [_vm._t("anchor",null,null,attrs)]}},{key:"content",fn:function(ref){
6391
6538
  var close = ref.close;
6392
- return [_c('ul',{ref:"listWrapper",class:_vm.listClasses,attrs:{"id":_vm.listId,"data-qa":"dt-dropdown-list-wrapper"},on:{"mouseleave":_vm.clearHighlightIndex,"!mousemove":function($event){return _vm.onMouseHighlight.apply(null, arguments)}}},[_vm._t("list",null,{"close":close})],2)]}}],null,true)},_vm.$listeners))}
6393
- var dropdownvue_type_template_id_0ddf9e89_staticRenderFns = []
6539
+ return [_c('ul',{ref:"listWrapper",class:_vm.listClasses,attrs:{"id":_vm.listId,"data-qa":"dt-dropdown-list-wrapper"},on:{"mouseleave":_vm.clearHighlightIndex,"!mousemove":function($event){return _vm.onMouseHighlight.apply(null, arguments)}}},[_vm._t("list",null,{"close":close}),(_vm.showVisuallyHiddenClose)?_c('sr-only-close-button',{attrs:{"visually-hidden-close-label":_vm.visuallyHiddenCloseLabel,"tabindex":_vm.isArrowKeyNav ? -1 : 0},on:{"close":close}}):_vm._e()],2)]}}],null,true)},_vm.$listeners))}
6540
+ var dropdownvue_type_template_id_0a8a683d_staticRenderFns = []
6394
6541
 
6395
6542
 
6396
- ;// 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=c06c43b6&
6397
- var popovervue_type_template_id_c06c43b6_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--modal-opened': _vm.modal && _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":function($event){$event.preventDefault();return _vm.onContext.apply(null, arguments)},"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)}],"wheel":function (e) { return (_vm.isOpen && _vm.modal) && e.preventDefault(); },"!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":{
6543
+ ;// 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=b8a8f084&
6544
+ var popovervue_type_template_id_b8a8f084_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":function($event){$event.preventDefault();return _vm.onContext.apply(null, arguments)},"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)}],"wheel":function (e) { return (_vm.isOpen && _vm.modal) && e.preventDefault(); },"!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":{
6398
6545
  'aria-expanded': _vm.isOpen.toString(),
6399
6546
  'aria-controls': _vm.id,
6400
6547
  'aria-haspopup': _vm.role,
@@ -6404,8 +6551,8 @@ var popovervue_type_template_id_c06c43b6_render = function () {var _vm=this;var
6404
6551
  }),attrs:{"id":_vm.id,"role":_vm.role,"data-qa":"dt-popover","aria-hidden":("" + (!_vm.isOpen)),"aria-labelledby":_vm.labelledBy,"aria-label":_vm.ariaLabel,"aria-modal":("" + (!_vm.modal)),"transition":_vm.transition,"show":_vm.isOpen,"tabindex":_vm.contentTabindex,"appear":""},on:{"!keydown":function($event){return _vm.onKeydown.apply(null, arguments)},"after-leave":_vm.onLeaveTransitionComplete,"after-enter":_vm.onEnterTransitionComplete}},_vm.$listeners),[(_vm.$slots.headerContent || _vm.showCloseButton)?_c('popover-header-footer',{ref:"popover__header",class:_vm.POPOVER_HEADER_FOOTER_PADDING_CLASSES[_vm.padding],attrs:{"content-class":_vm.headerClass,"type":"header","show-close-button":_vm.showCloseButton,"close-button-props":_vm.closeButtonProps},on:{"close":_vm.closePopover},scopedSlots:_vm._u([{key:"content",fn:function(){return [_vm._t("headerContent",null,{"close":_vm.closePopover})]},proxy:true}],null,true)}):_vm._e(),_c('div',{ref:"popover__content",class:[
6405
6552
  'd-popover__content',
6406
6553
  _vm.POPOVER_PADDING_CLASSES[_vm.padding],
6407
- _vm.contentClass ],attrs:{"data-qa":"dt-popover-content"}},[_vm._t("content",null,{"close":_vm.closePopover}),(_vm.visuallyHiddenClose)?_c('dt-button',{staticClass:"d-vi-visible-sr",attrs:{"data-qa":"dt-popover-sr-only-close","aria-label":_vm.visuallyHiddenCloseLabel},on:{"click":_vm.closePopover}},[_c('icon-close')],1):_vm._e()],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()],1)],1)],1)}
6408
- var popovervue_type_template_id_c06c43b6_staticRenderFns = []
6554
+ _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)}
6555
+ var popovervue_type_template_id_b8a8f084_staticRenderFns = []
6409
6556
 
6410
6557
 
6411
6558
  ;// CONCATENATED MODULE: ./node_modules/@popperjs/core/lib/dom-utils/getBoundingClientRect.js
@@ -11355,10 +11502,6 @@ var popover_header_footer_component = normalizeComponent(
11355
11502
  //
11356
11503
  //
11357
11504
  //
11358
- //
11359
- //
11360
- //
11361
- //
11362
11505
 
11363
11506
  /* eslint-disable max-lines */
11364
11507
 
@@ -11382,17 +11525,16 @@ var popover_header_footer_component = normalizeComponent(
11382
11525
  * CHILD COMPONENTS *
11383
11526
  ********************/
11384
11527
  components: {
11528
+ SrOnlyCloseButton: common_sr_only_close_button,
11385
11529
  DtLazyShow: lazy_show,
11386
11530
  PopoverHeaderFooter: popover_header_footer,
11387
- Portal: Portal,
11388
- DtButton: button_button,
11389
- IconClose: IconClose
11531
+ Portal: Portal
11390
11532
  },
11391
- mixins: [modal],
11533
+ mixins: [modal, sr_only_close_button],
11392
11534
  props: {
11393
11535
  /**
11394
11536
  * Controls whether the popover is shown. Leaving this null will have the popover trigger on click by default.
11395
- * If you set this value, the default trigger behavior will be disabled and you can control it as you need.
11537
+ * If you set this value, the default trigger behavior will be disabled, and you can control it as you need.
11396
11538
  * Supports .sync modifier
11397
11539
  * @values null, true, false
11398
11540
  */
@@ -11675,7 +11817,7 @@ var popover_header_footer_component = normalizeComponent(
11675
11817
  */
11676
11818
  initialFocusElement: {
11677
11819
  type: [String, HTMLElement],
11678
- default: 'none',
11820
+ default: 'first',
11679
11821
  validator: initialFocusElement => {
11680
11822
  return POPOVER_INITIAL_FOCUS_STRINGS.includes(initialFocusElement) || initialFocusElement instanceof HTMLElement || initialFocusElement.startsWith('#');
11681
11823
  }
@@ -11689,24 +11831,6 @@ var popover_header_footer_component = normalizeComponent(
11689
11831
  openWithArrowKeys: {
11690
11832
  type: Boolean,
11691
11833
  default: false
11692
- },
11693
-
11694
- /**
11695
- * If true, a visually hidden close button its included in the popover.
11696
- * @values true, false
11697
- */
11698
- visuallyHiddenClose: {
11699
- type: Boolean,
11700
- default: false
11701
- },
11702
-
11703
- /**
11704
- * Label for the visually hidden close button
11705
- * Required if visuallyHiddenClose is set to `true`
11706
- */
11707
- visuallyHiddenCloseLabel: {
11708
- type: String,
11709
- default: ''
11710
11834
  }
11711
11835
  },
11712
11836
  emits: [
@@ -11756,7 +11880,7 @@ var popover_header_footer_component = normalizeComponent(
11756
11880
 
11757
11881
  modal(modal) {
11758
11882
  this.tip.setProps({
11759
- zIndex: modal ? 650 : 300
11883
+ zIndex: this.modal ? 650 : this.calculateAnchorZindex()
11760
11884
  });
11761
11885
  },
11762
11886
 
@@ -11803,6 +11927,9 @@ var popover_header_footer_component = normalizeComponent(
11803
11927
 
11804
11928
  isOpen(isOpen, isPrev) {
11805
11929
  if (isOpen) {
11930
+ this.tip.setProps({
11931
+ zIndex: this.modal ? 650 : this.calculateAnchorZindex()
11932
+ });
11806
11933
  this.tip.show();
11807
11934
  this.addClosePopoverEventListener();
11808
11935
  } else if (!isOpen && isPrev !== isOpen) {
@@ -11871,10 +11998,6 @@ var popover_header_footer_component = normalizeComponent(
11871
11998
  if (this.modal && this.initialFocusElement === 'none') {
11872
11999
  console.error('If the popover is modal you must set the ' + 'initialFocusElement prop. Possible values: "dialog", "first", HTMLElement');
11873
12000
  }
11874
-
11875
- if (this.visuallyHiddenClose && !this.visuallyHiddenCloseLabel) {
11876
- console.error('If visuallyHiddenClose prop is true (default), the popover includes a visually hidden ' + 'close button and you must set the visuallyHiddenCloseLabel prop.');
11877
- }
11878
12001
  },
11879
12002
 
11880
12003
  calculateAnchorZindex() {
@@ -12029,9 +12152,9 @@ var popover_header_footer_component = normalizeComponent(
12029
12152
  },
12030
12153
 
12031
12154
  onClickOutside() {
12032
- if (!this.hideOnClick) return; // If a modal popover is opened inside of this one, do not hide on click out
12155
+ if (!this.hideOnClick) return; // If a popover is opened inside of this one, do not hide on click out
12033
12156
 
12034
- const innerModals = this.popoverContentEl.querySelector('.d-popover__anchor--modal-opened');
12157
+ const innerModals = this.popoverContentEl.querySelector('.d-popover__anchor--opened');
12035
12158
 
12036
12159
  if (!innerModals) {
12037
12160
  this.closePopover();
@@ -12089,8 +12212,8 @@ var popovervue_type_style_index_0_lang_less_ = __webpack_require__(230);
12089
12212
 
12090
12213
  var popover_component = normalizeComponent(
12091
12214
  popover_popovervue_type_script_lang_js_,
12092
- popovervue_type_template_id_c06c43b6_render,
12093
- popovervue_type_template_id_c06c43b6_staticRenderFns,
12215
+ popovervue_type_template_id_b8a8f084_render,
12216
+ popovervue_type_template_id_b8a8f084_staticRenderFns,
12094
12217
  false,
12095
12218
  null,
12096
12219
  null,
@@ -12162,6 +12285,14 @@ const DROPDOWN_PADDING_CLASSES = {
12162
12285
  //
12163
12286
  //
12164
12287
  //
12288
+ //
12289
+ //
12290
+ //
12291
+ //
12292
+ //
12293
+ //
12294
+
12295
+
12165
12296
 
12166
12297
 
12167
12298
 
@@ -12170,7 +12301,8 @@ const DROPDOWN_PADDING_CLASSES = {
12170
12301
  /* harmony default export */ const dropdownvue_type_script_lang_js_ = ({
12171
12302
  name: 'DtDropdown',
12172
12303
  components: {
12173
- DtPopover: popover
12304
+ DtPopover: popover,
12305
+ SrOnlyCloseButton: common_sr_only_close_button
12174
12306
  },
12175
12307
  mixins: [keyboard_list_navigation({
12176
12308
  indexKey: 'highlightIndex',
@@ -12182,7 +12314,7 @@ const DROPDOWN_PADDING_CLASSES = {
12182
12314
  endOfListMethod: 'endOfListMethod',
12183
12315
  activeItemKey: 'activeItemEl',
12184
12316
  focusOnKeyboardNavigation: true
12185
- })],
12317
+ }), sr_only_close_button],
12186
12318
  props: {
12187
12319
  /**
12188
12320
  * Controls whether the dropdown is shown. Leaving this null will have the dropdown trigger on click by default.
@@ -12391,6 +12523,10 @@ const DROPDOWN_PADDING_CLASSES = {
12391
12523
  },
12392
12524
 
12393
12525
  afterHighlight() {
12526
+ if (this.visuallyHiddenClose && this.highlightIndex === this._itemsLength() - 1) {
12527
+ return;
12528
+ }
12529
+
12394
12530
  this.$emit('highlight', this.highlightIndex);
12395
12531
  },
12396
12532
 
@@ -12398,7 +12534,7 @@ const DROPDOWN_PADDING_CLASSES = {
12398
12534
  this.isOpen = isPopoverOpen;
12399
12535
 
12400
12536
  if (isPopoverOpen) {
12401
- if (this.openedWithKeyboard && this.navigationType === this.LIST_ITEM_NAVIGATION_TYPES.ARROW_KEYS) {
12537
+ if (this.openedWithKeyboard && this.isArrowKeyNav) {
12402
12538
  this.setHighlightIndex(0);
12403
12539
  }
12404
12540
 
@@ -12497,8 +12633,8 @@ var dropdownvue_type_style_index_0_lang_less_ = __webpack_require__(782);
12497
12633
 
12498
12634
  var dropdown_component = normalizeComponent(
12499
12635
  dropdown_dropdownvue_type_script_lang_js_,
12500
- dropdownvue_type_template_id_0ddf9e89_render,
12501
- dropdownvue_type_template_id_0ddf9e89_staticRenderFns,
12636
+ dropdownvue_type_template_id_0a8a683d_render,
12637
+ dropdownvue_type_template_id_0a8a683d_staticRenderFns,
12502
12638
  false,
12503
12639
  null,
12504
12640
  null,
@@ -14098,8 +14234,8 @@ var input_group_component = normalizeComponent(
14098
14234
  /* harmony default export */ const input_group_input_group = (input_group_component.exports);
14099
14235
  ;// CONCATENATED MODULE: ./components/input_group/index.js
14100
14236
 
14101
- ;// 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/modal/modal.vue?vue&type=template&id=d71a3468&
14102
- var modalvue_type_template_id_d71a3468_render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('dt-lazy-show',{class:[
14237
+ ;// 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/modal/modal.vue?vue&type=template&id=21785ac6&
14238
+ var modalvue_type_template_id_21785ac6_render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('dt-lazy-show',{class:[
14103
14239
  'd-modal',
14104
14240
  _vm.MODAL_KIND_MODIFIERS[_vm.kind],
14105
14241
  _vm.MODAL_SIZE_MODIFIERS[_vm.size],
@@ -14108,8 +14244,8 @@ var modalvue_type_template_id_d71a3468_render = function () {var _vm=this;var _h
14108
14244
  _vm.bannerClass ],attrs:{"data-qa":"dt-modal-banner"}},[_vm._t("banner",function(){return [_vm._v(" "+_vm._s(_vm.bannerTitle)+" ")]})],2):_vm._e(),_c('transition',{attrs:{"appear":"","name":"d-modal__dialog"}},[_c('div',{directives:[{name:"show",rawName:"v-show",value:(_vm.show),expression:"show"}],class:[
14109
14245
  'd-modal__dialog',
14110
14246
  { 'd-modal__dialog--scrollable': _vm.fixedHeaderFooter },
14111
- _vm.dialogClass ],attrs:{"role":"dialog","aria-modal":"true","aria-describedby":_vm.describedById,"aria-labelledby":_vm.labelledById}},[(_vm.$slots.header)?_c('div',{staticClass:"d-modal__header",attrs:{"id":_vm.labelledById,"data-qa":"dt-modal-title"}},[_vm._t("header")],2):_c('h2',{staticClass:"d-modal__header",attrs:{"id":_vm.labelledById,"data-qa":"dt-modal-title"}},[_vm._v(" "+_vm._s(_vm.title)+" ")]),(_vm.$slots.default)?_c('div',{staticClass:"d-modal__content",attrs:{"data-qa":"dt-modal-copy"}},[_vm._t("default")],2):_c('p',{staticClass:"d-modal__content",attrs:{"data-qa":"dt-modal-copy"}},[_vm._v(" "+_vm._s(_vm.copy)+" ")]),(_vm.hasFooterSlot)?_c('footer',{staticClass:"d-modal__footer"},[_vm._t("footer")],2):_vm._e(),(!_vm.hideClose)?_c('dt-button',_vm._b({staticClass:"d-modal__close",attrs:{"circle":"","size":"lg","importance":"clear","aria-label":_vm.closeButtonProps.ariaLabel,"kind":_vm.kind},on:{"click":_vm.close},scopedSlots:_vm._u([{key:"icon",fn:function(){return [_c('icon-close')]},proxy:true}],null,false,4267981299)},'dt-button',_vm.closeButtonProps,false)):_vm._e()],1)])],1)}
14112
- var modalvue_type_template_id_d71a3468_staticRenderFns = []
14247
+ _vm.dialogClass ],attrs:{"role":"dialog","aria-modal":"true","aria-describedby":_vm.describedById,"aria-labelledby":_vm.labelledById}},[(_vm.$slots.header)?_c('div',{staticClass:"d-modal__header",attrs:{"id":_vm.labelledById,"data-qa":"dt-modal-title"}},[_vm._t("header")],2):_c('h2',{staticClass:"d-modal__header",attrs:{"id":_vm.labelledById,"data-qa":"dt-modal-title"}},[_vm._v(" "+_vm._s(_vm.title)+" ")]),(_vm.$slots.default)?_c('div',{staticClass:"d-modal__content",attrs:{"data-qa":"dt-modal-copy"}},[_vm._t("default")],2):_c('p',{staticClass:"d-modal__content",attrs:{"data-qa":"dt-modal-copy"}},[_vm._v(" "+_vm._s(_vm.copy)+" ")]),(_vm.hasFooterSlot)?_c('footer',{staticClass:"d-modal__footer"},[_vm._t("footer")],2):_vm._e(),(!_vm.hideClose)?_c('dt-button',_vm._b({staticClass:"d-modal__close",attrs:{"circle":"","size":"lg","importance":"clear","aria-label":_vm.closeButtonProps.ariaLabel,"kind":_vm.kind},on:{"click":_vm.close},scopedSlots:_vm._u([{key:"icon",fn:function(){return [_c('icon-close')]},proxy:true}],null,false,4267981299)},'dt-button',_vm.closeButtonProps,false)):_vm._e(),(_vm.showVisuallyHiddenClose)?_c('sr-only-close-button',{attrs:{"visually-hidden-close-label":_vm.visuallyHiddenCloseLabel},on:{"close":_vm.close}}):_vm._e()],1)])],1)}
14248
+ var modalvue_type_template_id_21785ac6_staticRenderFns = []
14113
14249
 
14114
14250
 
14115
14251
  ;// CONCATENATED MODULE: ./components/modal/modal_constants.js
@@ -14229,6 +14365,13 @@ const MODAL_SIZE_MODIFIERS = {
14229
14365
  //
14230
14366
  //
14231
14367
  //
14368
+ //
14369
+ //
14370
+ //
14371
+ //
14372
+ //
14373
+
14374
+
14232
14375
 
14233
14376
 
14234
14377
 
@@ -14246,9 +14389,10 @@ const MODAL_SIZE_MODIFIERS = {
14246
14389
  components: {
14247
14390
  DtLazyShow: lazy_show,
14248
14391
  DtButton: button_button,
14249
- IconClose: IconClose
14392
+ IconClose: IconClose,
14393
+ SrOnlyCloseButton: common_sr_only_close_button
14250
14394
  },
14251
- mixins: [modal],
14395
+ mixins: [modal, sr_only_close_button],
14252
14396
  props: {
14253
14397
  /**
14254
14398
  * A set of props to be passed into the modal's close button.
@@ -14428,6 +14572,15 @@ const MODAL_SIZE_MODIFIERS = {
14428
14572
  }
14429
14573
  }
14430
14574
 
14575
+ },
14576
+ $props: {
14577
+ immediate: true,
14578
+ deep: true,
14579
+
14580
+ handler() {
14581
+ this.validateProps();
14582
+ }
14583
+
14431
14584
  }
14432
14585
  },
14433
14586
  methods: {
@@ -14443,6 +14596,13 @@ const MODAL_SIZE_MODIFIERS = {
14443
14596
  if (this.show) {
14444
14597
  this.focusTrappedTabPress(e);
14445
14598
  }
14599
+ },
14600
+
14601
+ validateProps() {
14602
+ if (this.hideClose && !this.visuallyHiddenClose) {
14603
+ console.error(`If hideClose prop is true, visuallyHiddenClose and visuallyHiddenCloseLabel props
14604
+ need to be set so the component always includes a close button`);
14605
+ }
14446
14606
  }
14447
14607
 
14448
14608
  }
@@ -14459,8 +14619,8 @@ const MODAL_SIZE_MODIFIERS = {
14459
14619
  ;
14460
14620
  var modal_component = normalizeComponent(
14461
14621
  modal_modalvue_type_script_lang_js_,
14462
- modalvue_type_template_id_d71a3468_render,
14463
- modalvue_type_template_id_d71a3468_staticRenderFns,
14622
+ modalvue_type_template_id_21785ac6_render,
14623
+ modalvue_type_template_id_21785ac6_staticRenderFns,
14464
14624
  false,
14465
14625
  null,
14466
14626
  null,
@@ -14655,9 +14815,9 @@ var list_section_component = normalizeComponent(
14655
14815
  /* harmony default export */ const list_section = (list_section_component.exports);
14656
14816
  ;// CONCATENATED MODULE: ./components/list_section/index.js
14657
14817
 
14658
- ;// 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/notice/notice.vue?vue&type=template&id=30c65ac1&
14659
- var noticevue_type_template_id_30c65ac1_render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('aside',_vm._g({class:_vm.noticeClass,attrs:{"data-qa":"notice"}},_vm.$listeners),[_c('dt-notice-icon',_vm._g({attrs:{"kind":_vm.kind}},_vm.$listeners),[_vm._t("icon")],2),_c('dt-notice-content',_vm._g({attrs:{"title-id":_vm.titleId,"content-id":_vm.contentId,"title":_vm.title,"role":_vm.role},scopedSlots:_vm._u([{key:"titleOverride",fn:function(){return [_vm._t("titleOverride")]},proxy:true}],null,true)},_vm.$listeners),[_vm._t("default")],2),_c('dt-notice-action',_vm._g({attrs:{"hide-close":_vm.hideClose,"close-button-props":_vm.closeButtonProps}},_vm.$listeners),[_vm._t("action")],2)],1)}
14660
- var noticevue_type_template_id_30c65ac1_staticRenderFns = []
14818
+ ;// 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/notice/notice.vue?vue&type=template&id=5825773c&
14819
+ var noticevue_type_template_id_5825773c_render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('aside',_vm._g({class:_vm.noticeClass,attrs:{"data-qa":"notice"}},_vm.$listeners),[_c('dt-notice-icon',_vm._g({attrs:{"kind":_vm.kind}},_vm.$listeners),[_vm._t("icon")],2),_c('dt-notice-content',_vm._g({attrs:{"title-id":_vm.titleId,"content-id":_vm.contentId,"title":_vm.title,"role":_vm.role},scopedSlots:_vm._u([{key:"titleOverride",fn:function(){return [_vm._t("titleOverride")]},proxy:true}],null,true)},_vm.$listeners),[_vm._t("default")],2),_c('dt-notice-action',_vm._g({attrs:{"hide-close":_vm.hideClose,"close-button-props":_vm.closeButtonProps,"visually-hidden-close":_vm.visuallyHiddenClose,"visually-hidden-close-label":_vm.visuallyHiddenCloseLabel}},_vm.$listeners),[_vm._t("action")],2)],1)}
14820
+ var noticevue_type_template_id_5825773c_staticRenderFns = []
14661
14821
 
14662
14822
 
14663
14823
  ;// 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!./components/notice/notice.vue?vue&type=script&lang=js&
@@ -14700,6 +14860,9 @@ var noticevue_type_template_id_30c65ac1_staticRenderFns = []
14700
14860
  //
14701
14861
  //
14702
14862
  //
14863
+ //
14864
+ //
14865
+
14703
14866
 
14704
14867
 
14705
14868
 
@@ -14716,6 +14879,7 @@ var noticevue_type_template_id_30c65ac1_staticRenderFns = []
14716
14879
  DtNoticeContent: notice_content,
14717
14880
  DtNoticeAction: notice_action
14718
14881
  },
14882
+ mixins: [sr_only_close_button],
14719
14883
  props: {
14720
14884
  /**
14721
14885
  * Sets an ID on the title element of the component. Useful for aria-describedby
@@ -14835,8 +14999,8 @@ var noticevue_type_template_id_30c65ac1_staticRenderFns = []
14835
14999
  ;
14836
15000
  var notice_component = normalizeComponent(
14837
15001
  notice_noticevue_type_script_lang_js_,
14838
- noticevue_type_template_id_30c65ac1_render,
14839
- noticevue_type_template_id_30c65ac1_staticRenderFns,
15002
+ noticevue_type_template_id_5825773c_render,
15003
+ noticevue_type_template_id_5825773c_staticRenderFns,
14840
15004
  false,
14841
15005
  null,
14842
15006
  null,
@@ -17054,12 +17218,12 @@ var select_menu_component = normalizeComponent(
17054
17218
  ;// CONCATENATED MODULE: ./components/select_menu/index.js
17055
17219
 
17056
17220
 
17057
- ;// 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/toast/toast.vue?vue&type=template&id=48807c9a&
17058
- var toastvue_type_template_id_48807c9a_render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return (_vm.isShown)?_c('div',{class:[
17221
+ ;// 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/toast/toast.vue?vue&type=template&id=b85afb74&
17222
+ var toastvue_type_template_id_b85afb74_render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return (_vm.isShown)?_c('div',{class:[
17059
17223
  'd-toast',
17060
17224
  _vm.kindClass,
17061
- { 'd-toast--important': _vm.important } ],attrs:{"data-qa":"dt-toast","aria-hidden":(!_vm.isShown).toString()}},[_c('div',{staticClass:"d-toast__dialog"},[_c('dt-notice-icon',_vm._g({attrs:{"kind":_vm.kind}},_vm.$listeners),[_vm._t("icon")],2),_c('dt-notice-content',_vm._g({attrs:{"title-id":_vm.titleId,"content-id":_vm.contentId,"title":_vm.title,"role":_vm.role},scopedSlots:_vm._u([{key:"titleOverride",fn:function(){return [_vm._t("titleOverride")]},proxy:true}],null,true)},_vm.$listeners),[_vm._t("default",function(){return [_vm._v(" "+_vm._s(_vm.message)+" ")]})],2),_c('dt-notice-action',_vm._g({attrs:{"hide-close":_vm.hideClose,"close-button-props":_vm.closeButtonProps}},_vm.noticeActionListeners),[_vm._t("action")],2)],1)]):_vm._e()}
17062
- var toastvue_type_template_id_48807c9a_staticRenderFns = []
17225
+ { 'd-toast--important': _vm.important } ],attrs:{"data-qa":"dt-toast","aria-hidden":(!_vm.isShown).toString()}},[_c('div',{staticClass:"d-toast__dialog"},[_c('dt-notice-icon',_vm._g({attrs:{"kind":_vm.kind}},_vm.$listeners),[_vm._t("icon")],2),_c('dt-notice-content',_vm._g({attrs:{"title-id":_vm.titleId,"content-id":_vm.contentId,"title":_vm.title,"role":_vm.role},scopedSlots:_vm._u([{key:"titleOverride",fn:function(){return [_vm._t("titleOverride")]},proxy:true}],null,true)},_vm.$listeners),[_vm._t("default",function(){return [_vm._v(" "+_vm._s(_vm.message)+" ")]})],2),_c('dt-notice-action',_vm._g({attrs:{"hide-close":_vm.hideClose,"close-button-props":_vm.closeButtonProps,"visually-hidden-close":_vm.visuallyHiddenClose,"visually-hidden-close-label":_vm.visuallyHiddenCloseLabel}},_vm.noticeActionListeners),[_vm._t("action")],2)],1)]):_vm._e()}
17226
+ var toastvue_type_template_id_b85afb74_staticRenderFns = []
17063
17227
 
17064
17228
 
17065
17229
  ;// CONCATENATED MODULE: ./components/toast/toast_constants.js
@@ -17118,6 +17282,9 @@ const TOAST_MIN_DURATION = 6000;
17118
17282
  //
17119
17283
  //
17120
17284
  //
17285
+ //
17286
+ //
17287
+
17121
17288
 
17122
17289
 
17123
17290
 
@@ -17137,6 +17304,7 @@ const TOAST_MIN_DURATION = 6000;
17137
17304
  DtNoticeContent: notice_content,
17138
17305
  DtNoticeAction: notice_action
17139
17306
  },
17307
+ mixins: [sr_only_close_button],
17140
17308
  props: {
17141
17309
  /**
17142
17310
  * Sets an ID on the title element of the component. Useful for aria-describedby
@@ -17349,8 +17517,8 @@ const TOAST_MIN_DURATION = 6000;
17349
17517
  ;
17350
17518
  var toast_component = normalizeComponent(
17351
17519
  toast_toastvue_type_script_lang_js_,
17352
- toastvue_type_template_id_48807c9a_render,
17353
- toastvue_type_template_id_48807c9a_staticRenderFns,
17520
+ toastvue_type_template_id_b85afb74_render,
17521
+ toastvue_type_template_id_b85afb74_staticRenderFns,
17354
17522
  false,
17355
17523
  null,
17356
17524
  null,
@@ -18628,15 +18796,15 @@ var root_layout_component = normalizeComponent(
18628
18796
  ;// CONCATENATED MODULE: ./components/root_layout/index.js
18629
18797
 
18630
18798
 
18631
- ;// 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=27a3126a&
18632
- var combobox_with_popovervue_type_template_id_27a3126a_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,"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-aria-label":_vm.listAriaLabel,"list-rendered-outside":true,"list-id":_vm.listId,"data-qa":"dt-combobox"},scopedSlots:_vm._u([{key:"input",fn:function(ref){
18799
+ ;// 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=96ff85ec&
18800
+ var combobox_with_popovervue_type_template_id_96ff85ec_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,"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-aria-label":_vm.listAriaLabel,"list-rendered-outside":true,"list-id":_vm.listId,"data-qa":"dt-combobox"},scopedSlots:_vm._u([{key:"input",fn:function(ref){
18633
18801
  var inputProps = ref.inputProps;
18634
18802
  return [_c('div',{ref:"input",attrs:{"id":_vm.externalAnchor},on:{"focusin":_vm.onFocusIn,"focusout":_vm.onFocusOut,"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){
18635
18803
  var opened = ref.opened;
18636
18804
  var listProps = ref.listProps;
18637
18805
  var clearHighlightIndex = ref.clearHighlightIndex;
18638
- return [_c('dt-popover',{ref:"popover",attrs:{"open":_vm.isListShown,"hide-on-click":_vm.showList === null,"max-height":_vm.maxHeight,"max-width":_vm.maxWidth,"offset":_vm.popoverOffset,"sticky":_vm.popoverSticky,"placement":"bottom-start","padding":"none","role":"listbox","external-anchor":_vm.externalAnchor,"content-width":_vm.contentWidth,"content-tabindex":null,"modal":_vm.modal,"auto-focus":false},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",on:{"focusout":_vm.onFocusOut}},[_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":function($event){clearHighlightIndex; _vm.onFocusOut;}}},[(_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",on:{"focusout":_vm.onFocusOut}},[_vm._t("footer")],2):_vm._e()]},proxy:true}],null,true)})]}}],null,true)},_vm.comboboxListeners))}
18639
- var combobox_with_popovervue_type_template_id_27a3126a_staticRenderFns = []
18806
+ return [_c('dt-popover',{ref:"popover",attrs:{"open":_vm.isListShown,"hide-on-click":_vm.showList === null,"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,"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",on:{"focusout":_vm.onFocusOut}},[_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":function($event){clearHighlightIndex; _vm.onFocusOut;}}},[(_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",on:{"focusout":_vm.onFocusOut}},[_vm._t("footer")],2):_vm._e()]},proxy:true}],null,true)})]}}],null,true)},_vm.comboboxListeners))}
18807
+ var combobox_with_popovervue_type_template_id_96ff85ec_staticRenderFns = []
18640
18808
 
18641
18809
 
18642
18810
  ;// 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&
@@ -18740,6 +18908,10 @@ var combobox_with_popovervue_type_template_id_27a3126a_staticRenderFns = []
18740
18908
  //
18741
18909
  //
18742
18910
  //
18911
+ //
18912
+ //
18913
+ //
18914
+
18743
18915
 
18744
18916
 
18745
18917
 
@@ -18754,6 +18926,7 @@ var combobox_with_popovervue_type_template_id_27a3126a_staticRenderFns = []
18754
18926
  ComboboxLoadingList: combobox_loading_list,
18755
18927
  ComboboxEmptyList: combobox_empty_list
18756
18928
  },
18929
+ mixins: [sr_only_close_button],
18757
18930
  props: {
18758
18931
  /**
18759
18932
  * String to use for the list's aria-label.
@@ -18876,15 +19049,6 @@ var combobox_with_popovervue_type_template_id_27a3126a_staticRenderFns = []
18876
19049
  default: false
18877
19050
  },
18878
19051
 
18879
- /**
18880
- * Determines modal state. If enabled popover has a modal overlay
18881
- * preventing interaction with elements below it, but it is invisible.
18882
- */
18883
- modal: {
18884
- type: Boolean,
18885
- default: true
18886
- },
18887
-
18888
19052
  /**
18889
19053
  * Displays the list when the combobox is focused, before the user has typed anything.
18890
19054
  * When this is enabled the list will not close after selection.
@@ -19036,7 +19200,7 @@ var combobox_with_popovervue_type_template_id_27a3126a_staticRenderFns = []
19036
19200
 
19037
19201
  onFocusIn(e) {
19038
19202
  if (this.hasSuggestionList && e && this.$refs.input.querySelector('input') === e.target) {
19039
- // only trigger if we show suggestion list when focus and
19203
+ // only trigger if we show suggestion list when focused, and
19040
19204
  // it's the input specifically that was focused
19041
19205
  this.showComboboxList();
19042
19206
  }
@@ -19049,7 +19213,7 @@ var combobox_with_popovervue_type_template_id_27a3126a_staticRenderFns = []
19049
19213
  var _this$$refs$ref;
19050
19214
 
19051
19215
  return (_this$$refs$ref = this.$refs[ref]) === null || _this$$refs$ref === void 0 ? void 0 : _this$$refs$ref.contains(e.relatedTarget);
19052
- }); // If outside of the combobox then close
19216
+ }) || this.visuallyHiddenClose; // If outside the combobox then close
19053
19217
 
19054
19218
  if (!isComboboxStillFocused) {
19055
19219
  this.closeComboboxList();
@@ -19078,8 +19242,8 @@ var combobox_with_popovervue_type_template_id_27a3126a_staticRenderFns = []
19078
19242
  ;
19079
19243
  var combobox_with_popover_component = normalizeComponent(
19080
19244
  combobox_with_popover_combobox_with_popovervue_type_script_lang_js_,
19081
- combobox_with_popovervue_type_template_id_27a3126a_render,
19082
- combobox_with_popovervue_type_template_id_27a3126a_staticRenderFns,
19245
+ combobox_with_popovervue_type_template_id_96ff85ec_render,
19246
+ combobox_with_popovervue_type_template_id_96ff85ec_staticRenderFns,
19083
19247
  false,
19084
19248
  null,
19085
19249
  null,
@@ -19090,11 +19254,11 @@ var combobox_with_popover_component = normalizeComponent(
19090
19254
  /* harmony default export */ const combobox_with_popover = (combobox_with_popover_component.exports);
19091
19255
  ;// CONCATENATED MODULE: ./recipes/comboboxes/combobox_with_popover/index.js
19092
19256
 
19093
- ;// 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=6305bf12&
19094
- var combobox_multi_selectvue_type_template_id_6305bf12_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:{"list-aria-label":"listAriaLabel","show-list":_vm.showList,"max-height":_vm.listMaxHeight,"popover-offset":_vm.popoverOffset,"has-suggestion-list":_vm.hasSuggestionList,"content-width":"anchor"},on:{"select":_vm.onComboboxSelect},scopedSlots:_vm._u([{key:"input",fn:function(ref){
19257
+ ;// 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=652b0440&
19258
+ var combobox_multi_selectvue_type_template_id_652b0440_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:{"list-aria-label":"listAriaLabel","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"},on:{"select":_vm.onComboboxSelect},scopedSlots:_vm._u([{key:"input",fn:function(ref){
19095
19259
  var onInput = ref.onInput;
19096
19260
  return [_c('span',{ref:"inputSlotWrapper",staticClass:"d-ps-relative"},[_c('span',{ref:"chipsWrapper",staticClass:"d-ps-absolute d-mx2"},_vm._l((_vm.selectedItems),function(item){return _c('dt-chip',_vm._g({key:item.id,ref:"chips",refInFor:true,staticClass:"d-mt4 d-mx2 d-zi-base1",attrs:{"close-button-props":{ ariaLabel: 'close' },"size":_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 d-mb4",attrs:{"label":_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)})}
19097
- var combobox_multi_selectvue_type_template_id_6305bf12_staticRenderFns = []
19261
+ var combobox_multi_selectvue_type_template_id_652b0440_staticRenderFns = []
19098
19262
 
19099
19263
 
19100
19264
  ;// CONCATENATED MODULE: ./recipes/comboboxes/combobox_multi_select/combobox_multi_select_story_constants.js
@@ -19296,6 +19460,9 @@ const MULTI_SELECT_SIZES = {
19296
19460
  //
19297
19461
  //
19298
19462
  //
19463
+ //
19464
+ //
19465
+
19299
19466
 
19300
19467
 
19301
19468
 
@@ -19310,6 +19477,7 @@ const MULTI_SELECT_SIZES = {
19310
19477
  DtChip: chip,
19311
19478
  DtValidationMessages: validation_messages
19312
19479
  },
19480
+ mixins: [sr_only_close_button],
19313
19481
  props: {
19314
19482
  /**
19315
19483
  * Label for the combobox
@@ -19476,7 +19644,7 @@ const MULTI_SELECT_SIZES = {
19476
19644
  data() {
19477
19645
  return {
19478
19646
  value: '',
19479
- popoverOffset: [0, 0],
19647
+ popoverOffset: [0, 4],
19480
19648
  showValidationMessages: false,
19481
19649
  initialInputPadding: {},
19482
19650
  resizeWindowObserver: null
@@ -19709,7 +19877,7 @@ const MULTI_SELECT_SIZES = {
19709
19877
  // If the new chip goes to the next line and the input box expands,
19710
19878
  // move the popover down to the next line. Same when chips are removed
19711
19879
 
19712
- this.popoverOffset = [0, 0];
19880
+ this.popoverOffset = [0, 4];
19713
19881
  },
19714
19882
 
19715
19883
  getFullWidth(el) {
@@ -19762,8 +19930,8 @@ const MULTI_SELECT_SIZES = {
19762
19930
  ;
19763
19931
  var combobox_multi_select_component = normalizeComponent(
19764
19932
  combobox_multi_select_combobox_multi_selectvue_type_script_lang_js_,
19765
- combobox_multi_selectvue_type_template_id_6305bf12_render,
19766
- combobox_multi_selectvue_type_template_id_6305bf12_staticRenderFns,
19933
+ combobox_multi_selectvue_type_template_id_652b0440_render,
19934
+ combobox_multi_selectvue_type_template_id_652b0440_staticRenderFns,
19767
19935
  false,
19768
19936
  null,
19769
19937
  null,