@dialpad/dialtone-vue 2.61.0 → 2.62.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (6) hide show
  1. package/CHANGELOG.json +1 -1
  2. package/CHANGELOG.md +7 -0
  3. package/dist/dialtone-vue.common.js +50 -11
  4. package/dist/dialtone-vue.umd.js +50 -11
  5. package/dist/dialtone-vue.umd.min.js +1 -1
  6. package/package.json +1 -1
package/CHANGELOG.md CHANGED
@@ -1,3 +1,10 @@
1
+ # [2.62.0](https://github.com/dialpad/dialtone-vue/compare/v2.61.0...v2.62.0) (2023-03-01)
2
+
3
+
4
+ ### Features
5
+
6
+ * DP-59900 Add `buttonWidthSize` prop ([167b08c](https://github.com/dialpad/dialtone-vue/commit/167b08c081f3a5f73d8d2bad733f323a3b6c0ff7))
7
+
1
8
  # [2.61.0](https://github.com/dialpad/dialtone-vue/compare/v2.60.0...v2.61.0) (2023-03-01)
2
9
 
3
10
 
package/dist/dialtone-vue.common.js CHANGED
@@ -354,7 +354,7 @@ __webpack_require__.r(__webpack_exports__);
354
354
 
355
355
  var ___CSS_LOADER_EXPORT___ = _node_modules_vue_cli_service_node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1___default()((_node_modules_vue_cli_service_node_modules_css_loader_dist_runtime_noSourceMaps_js__WEBPACK_IMPORTED_MODULE_0___default()));
356
356
  // Module
357
- ___CSS_LOADER_EXPORT___.push([module.id, ".dt-recipe--callbar-button-with-popover--button{position:relative;display:inline-block}.dt-recipe--callbar-button-with-popover--arrow.d-btn--circle{position:absolute;top:2rem;right:0;width:var(--su16);height:var(--su16);padding:var(--su8);border-radius:var(--su4)}.dt-recipe--callbar-button-with-popover--arrow.d-btn--circle.d-btn--active{background:var(--black-025)}.dt-recipe--callbar-button-with-popover--popover .d-popover__header{background:var(--black-900);color:var(--white)}.dt-recipe--callbar-button-with-popover--popover .d-popover__header button{color:var(--white)}.dt-recipe--callbar-button-with-popover--button .d-tab--selected:after,.dt-recipe--callbar-button-with-popover--button .d-tab--selected:hover:after{--tab--bgc:var(--black-900)}.dt-recipe--callbar-button-with-popover--button .tab-group{display:flex;flex-direction:column;height:100%}.dt-recipe--callbar-button-with-popover--button .tab-content{flex:1 1 100%;overflow-y:auto}", ""]);
357
+ ___CSS_LOADER_EXPORT___.push([module.id, ".dt-recipe--callbar-button-with-popover--arrow.d-btn--circle{margin-top:-1.2rem;width:var(--su16);height:var(--su16);padding:var(--su8);border-radius:var(--su4)}.dt-recipe--callbar-button-with-popover--arrow.d-btn--circle.d-btn--active{background:var(--black-025)}.dt-recipe--callbar-button-with-popover--popover .d-popover__header{background:var(--black-900);color:var(--white)}.dt-recipe--callbar-button-with-popover--popover .d-popover__header button{color:var(--white)}.dt-recipe--callbar-button-with-popover--button .d-tab--selected:after,.dt-recipe--callbar-button-with-popover--button .d-tab--selected:hover:after{--tab--bgc:var(--black-900)}.dt-recipe--callbar-button-with-popover--button .tab-group{display:flex;flex-direction:column;height:100%}.dt-recipe--callbar-button-with-popover--button .tab-content{flex:1 1 100%;overflow-y:auto}", ""]);
358
358
  // Exports
359
359
  /* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (___CSS_LOADER_EXPORT___);
360
360
 
@@ -2349,6 +2349,7 @@ __webpack_require__.d(__webpack_exports__, {
2349
2349
  "TOOLTIP_STICKY_VALUES": () => (/* reexport */ TOOLTIP_STICKY_VALUES),
2350
2350
  "USER_STATUS_COLOR_MODIFIERS": () => (/* reexport */ USER_STATUS_COLOR_MODIFIERS),
2351
2351
  "VALIDATION_MESSAGE_TYPES": () => (/* reexport */ VALIDATION_MESSAGE_TYPES),
2352
+ "VALID_WIDTH_SIZE": () => (/* reexport */ VALID_WIDTH_SIZE),
2352
2353
  "filterFormattedMessages": () => (/* reexport */ filterFormattedMessages),
2353
2354
  "formatMessages": () => (/* reexport */ formatMessages),
2354
2355
  "getUniqueString": () => (/* reexport */ getUniqueString),
@@ -22151,9 +22152,9 @@ var combobox_multi_select_component = normalizeComponent(
22151
22152
  ;// CONCATENATED MODULE: ./recipes/comboboxes/combobox_multi_select/index.js
22152
22153
 
22153
22154
 
22154
- ;// 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/buttons/callbar_button/callbar_button.vue?vue&type=template&id=7a807bca&
22155
- var callbar_buttonvue_type_template_id_7a807bca_render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('dt-tooltip',{attrs:{"id":_vm.id,"offset":[0, -12]},scopedSlots:_vm._u([{key:"anchor",fn:function(){return [_c('dt-button',_vm._g({class:_vm.callbarButtonClass,attrs:{"importance":_vm.circle ? 'outlined' : 'clear',"kind":"muted","icon-position":"top","disabled":_vm.disabled,"aria-label":_vm.ariaLabel,"label-class":"d-fs-100","width":"8.4rem"}},_vm.$listeners),[_vm._t("default"),_vm._t("icon",null,{"slot":"icon"})],2)]},proxy:true}],null,true)},[_vm._t("tooltip")],2)}
22156
- var callbar_buttonvue_type_template_id_7a807bca_staticRenderFns = []
22155
+ ;// 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/buttons/callbar_button/callbar_button.vue?vue&type=template&id=44881500&
22156
+ var callbar_buttonvue_type_template_id_44881500_render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('dt-tooltip',{attrs:{"id":_vm.id,"offset":[0, -12]},scopedSlots:_vm._u([{key:"anchor",fn:function(){return [_c('dt-button',_vm._g({class:_vm.callbarButtonClass,attrs:{"importance":_vm.circle ? 'outlined' : 'clear',"kind":"muted","icon-position":"top","disabled":_vm.disabled,"aria-label":_vm.ariaLabel,"label-class":"d-fs-100","width":_vm.buttonWidth}},_vm.$listeners),[_vm._t("default"),_vm._t("icon",null,{"slot":"icon"})],2)]},proxy:true}],null,true)},[_vm._t("tooltip")],2)}
22157
+ var callbar_buttonvue_type_template_id_44881500_staticRenderFns = []
22157
22158
 
22158
22159
 
22159
22160
  ;// 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/buttons/callbar_button/callbar_button.vue?vue&type=script&lang=js&
@@ -22188,6 +22189,7 @@ var callbar_buttonvue_type_template_id_7a807bca_staticRenderFns = []
22188
22189
 
22189
22190
 
22190
22191
 
22192
+ const VALID_WIDTH_SIZE = ['sm', 'md', 'lg', 'xl'];
22191
22193
  /* harmony default export */ const callbar_buttonvue_type_script_lang_js_ = ({
22192
22194
  name: 'DtRecipeCallbarButton',
22193
22195
  components: {
@@ -22267,6 +22269,15 @@ var callbar_buttonvue_type_template_id_7a807bca_staticRenderFns = []
22267
22269
  buttonClass: {
22268
22270
  type: [String, Array, Object],
22269
22271
  default: ''
22272
+ },
22273
+
22274
+ /*
22275
+ * Width size. Valid values are: 'xl', 'lg', 'md' and 'sm'.
22276
+ */
22277
+ buttonWidthSize: {
22278
+ type: String,
22279
+ default: 'xl',
22280
+ validator: size => VALID_WIDTH_SIZE.includes(size)
22270
22281
  }
22271
22282
  },
22272
22283
  emits: [
@@ -22284,6 +22295,20 @@ var callbar_buttonvue_type_template_id_7a807bca_staticRenderFns = []
22284
22295
  'dt-recipe-callbar-button--active': this.active,
22285
22296
  'dt-recipe-callbar-button--danger': this.danger
22286
22297
  }];
22298
+ },
22299
+
22300
+ buttonWidth() {
22301
+ switch (this.buttonWidthSize) {
22302
+ case 'sm':
22303
+ case 'md':
22304
+ return '4.5rem';
22305
+
22306
+ case 'lg':
22307
+ return '6rem';
22308
+
22309
+ default:
22310
+ return '8.4rem';
22311
+ }
22287
22312
  }
22288
22313
 
22289
22314
  }
@@ -22305,8 +22330,8 @@ var callbar_buttonvue_type_style_index_0_lang_less_ = __webpack_require__(759);
22305
22330
 
22306
22331
  var callbar_button_component = normalizeComponent(
22307
22332
  callbar_button_callbar_buttonvue_type_script_lang_js_,
22308
- callbar_buttonvue_type_template_id_7a807bca_render,
22309
- callbar_buttonvue_type_template_id_7a807bca_staticRenderFns,
22333
+ callbar_buttonvue_type_template_id_44881500_render,
22334
+ callbar_buttonvue_type_template_id_44881500_staticRenderFns,
22310
22335
  false,
22311
22336
  null,
22312
22337
  null,
@@ -22317,9 +22342,9 @@ var callbar_button_component = normalizeComponent(
22317
22342
  /* harmony default export */ const callbar_button = (callbar_button_component.exports);
22318
22343
  ;// CONCATENATED MODULE: ./recipes/buttons/callbar_button/index.js
22319
22344
 
22320
- ;// 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/buttons/callbar_button_with_popover/callbar_button_with_popover.vue?vue&type=template&id=cca8d214&
22321
- var callbar_button_with_popovervue_type_template_id_cca8d214_render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{staticClass:"dt-recipe--callbar-button-with-popover--button"},[_c('dt-recipe-callbar-button',{staticClass:"dt-recipe--callbar-button-with-popover--main-button",attrs:{"aria-label":_vm.ariaLabel,"disabled":_vm.disabled,"active":_vm.active,"danger":_vm.danger,"button-class":_vm.buttonClass},on:{"click":_vm.buttonClick}},[_vm._t("icon",null,{"slot":"icon"}),_vm._t("tooltip",null,{"slot":"tooltip"}),_vm._t("default")],2),(_vm.showArrowButton)?_c('dt-popover',_vm._b({staticClass:"dt-recipe--callbar-button-with-popover--popover-wrapper",attrs:{"id":_vm.id,"open":_vm.open,"placement":_vm.placement,"initial-focus-element":_vm.initialFocusElement,"show-close-button":_vm.showCloseButton,"padding":"none","dialog-class":['dt-recipe--callbar-button-with-popover--popover', _vm.contentClass],"header-class":"d-d-flex d-ai-center d-fw-normal d-px12"},on:{"opened":_vm.onModalIsOpened},scopedSlots:_vm._u([{key:"anchor",fn:function(){return [_c('dt-button',{staticClass:"dt-recipe--callbar-button-with-popover--arrow",attrs:{"circle":"","importance":"clear","size":"lg","width":"2rem","aria-label":_vm.arrowButtonLabel,"active":_vm.open},on:{"click":_vm.arrowClick},scopedSlots:_vm._u([{key:"icon",fn:function(){return [_c('dt-icon',{attrs:{"name":"chevron-up","size":"200"}})]},proxy:true}],null,false,3340821372)})]},proxy:true}],null,false,86794195)},'dt-popover',_vm.$attrs,false),[_vm._t("content",null,{"slot":"content"}),_vm._t("headerContent",null,{"slot":"headerContent"}),_vm._t("footerContent",null,{"slot":"footerContent"})],2):_vm._e()],1)}
22322
- var callbar_button_with_popovervue_type_template_id_cca8d214_staticRenderFns = []
22345
+ ;// 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/buttons/callbar_button_with_popover/callbar_button_with_popover.vue?vue&type=template&id=428bc44b&
22346
+ var callbar_button_with_popovervue_type_template_id_428bc44b_render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{staticClass:"d-d-flex d-ai-center"},[_c('dt-recipe-callbar-button',{staticClass:"dt-recipe--callbar-button-with-popover--main-button",attrs:{"aria-label":_vm.ariaLabel,"disabled":_vm.disabled,"active":_vm.active,"danger":_vm.danger,"button-class":_vm.buttonClass,"button-width-size":_vm.buttonWidthSize},on:{"click":_vm.buttonClick}},[_vm._t("icon",null,{"slot":"icon"}),_vm._t("tooltip",null,{"slot":"tooltip"}),_vm._t("default")],2),(_vm.showArrowButton)?_c('dt-popover',_vm._b({staticClass:"dt-recipe--callbar-button-with-popover--popover-wrapper",attrs:{"id":_vm.id,"open":_vm.open,"placement":_vm.placement,"initial-focus-element":_vm.initialFocusElement,"show-close-button":_vm.showCloseButton,"padding":"none","dialog-class":['dt-recipe--callbar-button-with-popover--popover', _vm.contentClass],"header-class":"d-d-flex d-ai-center d-fw-normal d-px12"},on:{"opened":_vm.onModalIsOpened},scopedSlots:_vm._u([{key:"anchor",fn:function(){return [_c('dt-button',{class:['dt-recipe--callbar-button-with-popover--arrow', _vm.isCompactMode ? 'd-mln16' : 'd-mln24'],attrs:{"circle":"","importance":"clear","size":"lg","width":"2rem","aria-label":_vm.arrowButtonLabel,"active":_vm.open},on:{"click":_vm.arrowClick},scopedSlots:_vm._u([{key:"icon",fn:function(){return [_c('dt-icon',{attrs:{"name":"chevron-up","size":"200"}})]},proxy:true}],null,false,3340821372)})]},proxy:true}],null,false,821174459)},'dt-popover',_vm.$attrs,false),[_vm._t("content",null,{"slot":"content"}),_vm._t("headerContent",null,{"slot":"headerContent"}),_vm._t("footerContent",null,{"slot":"footerContent"})],2):_vm._e()],1)}
22347
+ var callbar_button_with_popovervue_type_template_id_428bc44b_staticRenderFns = []
22323
22348
 
22324
22349
 
22325
22350
  ;// 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/buttons/callbar_button_with_popover/callbar_button_with_popover.vue?vue&type=script&lang=js&
@@ -22395,6 +22420,7 @@ var callbar_button_with_popovervue_type_template_id_cca8d214_staticRenderFns = [
22395
22420
  //
22396
22421
  //
22397
22422
  //
22423
+ //
22398
22424
 
22399
22425
 
22400
22426
 
@@ -22532,6 +22558,15 @@ var callbar_button_with_popovervue_type_template_id_cca8d214_staticRenderFns = [
22532
22558
  default: ''
22533
22559
  },
22534
22560
 
22561
+ /*
22562
+ * Width size. Valid values are: 'xl', 'lg', 'md' and 'sm'.
22563
+ */
22564
+ buttonWidthSize: {
22565
+ type: String,
22566
+ default: 'xl',
22567
+ validator: size => VALID_WIDTH_SIZE.includes(size)
22568
+ },
22569
+
22535
22570
  /**
22536
22571
  * Additional class name for the popover content wrapper element.
22537
22572
  */
@@ -22562,6 +22597,10 @@ var callbar_button_with_popovervue_type_template_id_cca8d214_staticRenderFns = [
22562
22597
  computed: {
22563
22598
  showArrowButton() {
22564
22599
  return this.forceShowArrow || !this.disabled;
22600
+ },
22601
+
22602
+ isCompactMode() {
22603
+ return this.buttonWidthSize === 'sm' || this.buttonWidthSize === 'md';
22565
22604
  }
22566
22605
 
22567
22606
  },
@@ -22604,8 +22643,8 @@ var callbar_button_with_popovervue_type_style_index_0_lang_less_ = __webpack_req
22604
22643
 
22605
22644
  var callbar_button_with_popover_component = normalizeComponent(
22606
22645
  callbar_button_with_popover_callbar_button_with_popovervue_type_script_lang_js_,
22607
- callbar_button_with_popovervue_type_template_id_cca8d214_render,
22608
- callbar_button_with_popovervue_type_template_id_cca8d214_staticRenderFns,
22646
+ callbar_button_with_popovervue_type_template_id_428bc44b_render,
22647
+ callbar_button_with_popovervue_type_template_id_428bc44b_staticRenderFns,
22609
22648
  false,
22610
22649
  null,
22611
22650
  null,
package/dist/dialtone-vue.umd.js CHANGED
@@ -364,7 +364,7 @@ __webpack_require__.r(__webpack_exports__);
364
364
 
365
365
  var ___CSS_LOADER_EXPORT___ = _node_modules_vue_cli_service_node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1___default()((_node_modules_vue_cli_service_node_modules_css_loader_dist_runtime_noSourceMaps_js__WEBPACK_IMPORTED_MODULE_0___default()));
366
366
  // Module
367
- ___CSS_LOADER_EXPORT___.push([module.id, ".dt-recipe--callbar-button-with-popover--button{position:relative;display:inline-block}.dt-recipe--callbar-button-with-popover--arrow.d-btn--circle{position:absolute;top:2rem;right:0;width:var(--su16);height:var(--su16);padding:var(--su8);border-radius:var(--su4)}.dt-recipe--callbar-button-with-popover--arrow.d-btn--circle.d-btn--active{background:var(--black-025)}.dt-recipe--callbar-button-with-popover--popover .d-popover__header{background:var(--black-900);color:var(--white)}.dt-recipe--callbar-button-with-popover--popover .d-popover__header button{color:var(--white)}.dt-recipe--callbar-button-with-popover--button .d-tab--selected:after,.dt-recipe--callbar-button-with-popover--button .d-tab--selected:hover:after{--tab--bgc:var(--black-900)}.dt-recipe--callbar-button-with-popover--button .tab-group{display:flex;flex-direction:column;height:100%}.dt-recipe--callbar-button-with-popover--button .tab-content{flex:1 1 100%;overflow-y:auto}", ""]);
367
+ ___CSS_LOADER_EXPORT___.push([module.id, ".dt-recipe--callbar-button-with-popover--arrow.d-btn--circle{margin-top:-1.2rem;width:var(--su16);height:var(--su16);padding:var(--su8);border-radius:var(--su4)}.dt-recipe--callbar-button-with-popover--arrow.d-btn--circle.d-btn--active{background:var(--black-025)}.dt-recipe--callbar-button-with-popover--popover .d-popover__header{background:var(--black-900);color:var(--white)}.dt-recipe--callbar-button-with-popover--popover .d-popover__header button{color:var(--white)}.dt-recipe--callbar-button-with-popover--button .d-tab--selected:after,.dt-recipe--callbar-button-with-popover--button .d-tab--selected:hover:after{--tab--bgc:var(--black-900)}.dt-recipe--callbar-button-with-popover--button .tab-group{display:flex;flex-direction:column;height:100%}.dt-recipe--callbar-button-with-popover--button .tab-content{flex:1 1 100%;overflow-y:auto}", ""]);
368
368
  // Exports
369
369
  /* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (___CSS_LOADER_EXPORT___);
370
370
 
@@ -2359,6 +2359,7 @@ __webpack_require__.d(__webpack_exports__, {
2359
2359
  "TOOLTIP_STICKY_VALUES": () => (/* reexport */ TOOLTIP_STICKY_VALUES),
2360
2360
  "USER_STATUS_COLOR_MODIFIERS": () => (/* reexport */ USER_STATUS_COLOR_MODIFIERS),
2361
2361
  "VALIDATION_MESSAGE_TYPES": () => (/* reexport */ VALIDATION_MESSAGE_TYPES),
2362
+ "VALID_WIDTH_SIZE": () => (/* reexport */ VALID_WIDTH_SIZE),
2362
2363
  "filterFormattedMessages": () => (/* reexport */ filterFormattedMessages),
2363
2364
  "formatMessages": () => (/* reexport */ formatMessages),
2364
2365
  "getUniqueString": () => (/* reexport */ getUniqueString),
@@ -22161,9 +22162,9 @@ var combobox_multi_select_component = normalizeComponent(
22161
22162
  ;// CONCATENATED MODULE: ./recipes/comboboxes/combobox_multi_select/index.js
22162
22163
 
22163
22164
 
22164
- ;// 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/buttons/callbar_button/callbar_button.vue?vue&type=template&id=7a807bca&
22165
- var callbar_buttonvue_type_template_id_7a807bca_render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('dt-tooltip',{attrs:{"id":_vm.id,"offset":[0, -12]},scopedSlots:_vm._u([{key:"anchor",fn:function(){return [_c('dt-button',_vm._g({class:_vm.callbarButtonClass,attrs:{"importance":_vm.circle ? 'outlined' : 'clear',"kind":"muted","icon-position":"top","disabled":_vm.disabled,"aria-label":_vm.ariaLabel,"label-class":"d-fs-100","width":"8.4rem"}},_vm.$listeners),[_vm._t("default"),_vm._t("icon",null,{"slot":"icon"})],2)]},proxy:true}],null,true)},[_vm._t("tooltip")],2)}
22166
- var callbar_buttonvue_type_template_id_7a807bca_staticRenderFns = []
22165
+ ;// 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/buttons/callbar_button/callbar_button.vue?vue&type=template&id=44881500&
22166
+ var callbar_buttonvue_type_template_id_44881500_render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('dt-tooltip',{attrs:{"id":_vm.id,"offset":[0, -12]},scopedSlots:_vm._u([{key:"anchor",fn:function(){return [_c('dt-button',_vm._g({class:_vm.callbarButtonClass,attrs:{"importance":_vm.circle ? 'outlined' : 'clear',"kind":"muted","icon-position":"top","disabled":_vm.disabled,"aria-label":_vm.ariaLabel,"label-class":"d-fs-100","width":_vm.buttonWidth}},_vm.$listeners),[_vm._t("default"),_vm._t("icon",null,{"slot":"icon"})],2)]},proxy:true}],null,true)},[_vm._t("tooltip")],2)}
22167
+ var callbar_buttonvue_type_template_id_44881500_staticRenderFns = []
22167
22168
 
22168
22169
 
22169
22170
  ;// 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/buttons/callbar_button/callbar_button.vue?vue&type=script&lang=js&
@@ -22198,6 +22199,7 @@ var callbar_buttonvue_type_template_id_7a807bca_staticRenderFns = []
22198
22199
 
22199
22200
 
22200
22201
 
22202
+ const VALID_WIDTH_SIZE = ['sm', 'md', 'lg', 'xl'];
22201
22203
  /* harmony default export */ const callbar_buttonvue_type_script_lang_js_ = ({
22202
22204
  name: 'DtRecipeCallbarButton',
22203
22205
  components: {
@@ -22277,6 +22279,15 @@ var callbar_buttonvue_type_template_id_7a807bca_staticRenderFns = []
22277
22279
  buttonClass: {
22278
22280
  type: [String, Array, Object],
22279
22281
  default: ''
22282
+ },
22283
+
22284
+ /*
22285
+ * Width size. Valid values are: 'xl', 'lg', 'md' and 'sm'.
22286
+ */
22287
+ buttonWidthSize: {
22288
+ type: String,
22289
+ default: 'xl',
22290
+ validator: size => VALID_WIDTH_SIZE.includes(size)
22280
22291
  }
22281
22292
  },
22282
22293
  emits: [
@@ -22294,6 +22305,20 @@ var callbar_buttonvue_type_template_id_7a807bca_staticRenderFns = []
22294
22305
  'dt-recipe-callbar-button--active': this.active,
22295
22306
  'dt-recipe-callbar-button--danger': this.danger
22296
22307
  }];
22308
+ },
22309
+
22310
+ buttonWidth() {
22311
+ switch (this.buttonWidthSize) {
22312
+ case 'sm':
22313
+ case 'md':
22314
+ return '4.5rem';
22315
+
22316
+ case 'lg':
22317
+ return '6rem';
22318
+
22319
+ default:
22320
+ return '8.4rem';
22321
+ }
22297
22322
  }
22298
22323
 
22299
22324
  }
@@ -22315,8 +22340,8 @@ var callbar_buttonvue_type_style_index_0_lang_less_ = __webpack_require__(736);
22315
22340
 
22316
22341
  var callbar_button_component = normalizeComponent(
22317
22342
  callbar_button_callbar_buttonvue_type_script_lang_js_,
22318
- callbar_buttonvue_type_template_id_7a807bca_render,
22319
- callbar_buttonvue_type_template_id_7a807bca_staticRenderFns,
22343
+ callbar_buttonvue_type_template_id_44881500_render,
22344
+ callbar_buttonvue_type_template_id_44881500_staticRenderFns,
22320
22345
  false,
22321
22346
  null,
22322
22347
  null,
@@ -22327,9 +22352,9 @@ var callbar_button_component = normalizeComponent(
22327
22352
  /* harmony default export */ const callbar_button = (callbar_button_component.exports);
22328
22353
  ;// CONCATENATED MODULE: ./recipes/buttons/callbar_button/index.js
22329
22354
 
22330
- ;// 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/buttons/callbar_button_with_popover/callbar_button_with_popover.vue?vue&type=template&id=cca8d214&
22331
- var callbar_button_with_popovervue_type_template_id_cca8d214_render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{staticClass:"dt-recipe--callbar-button-with-popover--button"},[_c('dt-recipe-callbar-button',{staticClass:"dt-recipe--callbar-button-with-popover--main-button",attrs:{"aria-label":_vm.ariaLabel,"disabled":_vm.disabled,"active":_vm.active,"danger":_vm.danger,"button-class":_vm.buttonClass},on:{"click":_vm.buttonClick}},[_vm._t("icon",null,{"slot":"icon"}),_vm._t("tooltip",null,{"slot":"tooltip"}),_vm._t("default")],2),(_vm.showArrowButton)?_c('dt-popover',_vm._b({staticClass:"dt-recipe--callbar-button-with-popover--popover-wrapper",attrs:{"id":_vm.id,"open":_vm.open,"placement":_vm.placement,"initial-focus-element":_vm.initialFocusElement,"show-close-button":_vm.showCloseButton,"padding":"none","dialog-class":['dt-recipe--callbar-button-with-popover--popover', _vm.contentClass],"header-class":"d-d-flex d-ai-center d-fw-normal d-px12"},on:{"opened":_vm.onModalIsOpened},scopedSlots:_vm._u([{key:"anchor",fn:function(){return [_c('dt-button',{staticClass:"dt-recipe--callbar-button-with-popover--arrow",attrs:{"circle":"","importance":"clear","size":"lg","width":"2rem","aria-label":_vm.arrowButtonLabel,"active":_vm.open},on:{"click":_vm.arrowClick},scopedSlots:_vm._u([{key:"icon",fn:function(){return [_c('dt-icon',{attrs:{"name":"chevron-up","size":"200"}})]},proxy:true}],null,false,3340821372)})]},proxy:true}],null,false,86794195)},'dt-popover',_vm.$attrs,false),[_vm._t("content",null,{"slot":"content"}),_vm._t("headerContent",null,{"slot":"headerContent"}),_vm._t("footerContent",null,{"slot":"footerContent"})],2):_vm._e()],1)}
22332
- var callbar_button_with_popovervue_type_template_id_cca8d214_staticRenderFns = []
22355
+ ;// 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/buttons/callbar_button_with_popover/callbar_button_with_popover.vue?vue&type=template&id=428bc44b&
22356
+ var callbar_button_with_popovervue_type_template_id_428bc44b_render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{staticClass:"d-d-flex d-ai-center"},[_c('dt-recipe-callbar-button',{staticClass:"dt-recipe--callbar-button-with-popover--main-button",attrs:{"aria-label":_vm.ariaLabel,"disabled":_vm.disabled,"active":_vm.active,"danger":_vm.danger,"button-class":_vm.buttonClass,"button-width-size":_vm.buttonWidthSize},on:{"click":_vm.buttonClick}},[_vm._t("icon",null,{"slot":"icon"}),_vm._t("tooltip",null,{"slot":"tooltip"}),_vm._t("default")],2),(_vm.showArrowButton)?_c('dt-popover',_vm._b({staticClass:"dt-recipe--callbar-button-with-popover--popover-wrapper",attrs:{"id":_vm.id,"open":_vm.open,"placement":_vm.placement,"initial-focus-element":_vm.initialFocusElement,"show-close-button":_vm.showCloseButton,"padding":"none","dialog-class":['dt-recipe--callbar-button-with-popover--popover', _vm.contentClass],"header-class":"d-d-flex d-ai-center d-fw-normal d-px12"},on:{"opened":_vm.onModalIsOpened},scopedSlots:_vm._u([{key:"anchor",fn:function(){return [_c('dt-button',{class:['dt-recipe--callbar-button-with-popover--arrow', _vm.isCompactMode ? 'd-mln16' : 'd-mln24'],attrs:{"circle":"","importance":"clear","size":"lg","width":"2rem","aria-label":_vm.arrowButtonLabel,"active":_vm.open},on:{"click":_vm.arrowClick},scopedSlots:_vm._u([{key:"icon",fn:function(){return [_c('dt-icon',{attrs:{"name":"chevron-up","size":"200"}})]},proxy:true}],null,false,3340821372)})]},proxy:true}],null,false,821174459)},'dt-popover',_vm.$attrs,false),[_vm._t("content",null,{"slot":"content"}),_vm._t("headerContent",null,{"slot":"headerContent"}),_vm._t("footerContent",null,{"slot":"footerContent"})],2):_vm._e()],1)}
22357
+ var callbar_button_with_popovervue_type_template_id_428bc44b_staticRenderFns = []
22333
22358
 
22334
22359
 
22335
22360
  ;// 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/buttons/callbar_button_with_popover/callbar_button_with_popover.vue?vue&type=script&lang=js&
@@ -22405,6 +22430,7 @@ var callbar_button_with_popovervue_type_template_id_cca8d214_staticRenderFns = [
22405
22430
  //
22406
22431
  //
22407
22432
  //
22433
+ //
22408
22434
 
22409
22435
 
22410
22436
 
@@ -22542,6 +22568,15 @@ var callbar_button_with_popovervue_type_template_id_cca8d214_staticRenderFns = [
22542
22568
  default: ''
22543
22569
  },
22544
22570
 
22571
+ /*
22572
+ * Width size. Valid values are: 'xl', 'lg', 'md' and 'sm'.
22573
+ */
22574
+ buttonWidthSize: {
22575
+ type: String,
22576
+ default: 'xl',
22577
+ validator: size => VALID_WIDTH_SIZE.includes(size)
22578
+ },
22579
+
22545
22580
  /**
22546
22581
  * Additional class name for the popover content wrapper element.
22547
22582
  */
@@ -22572,6 +22607,10 @@ var callbar_button_with_popovervue_type_template_id_cca8d214_staticRenderFns = [
22572
22607
  computed: {
22573
22608
  showArrowButton() {
22574
22609
  return this.forceShowArrow || !this.disabled;
22610
+ },
22611
+
22612
+ isCompactMode() {
22613
+ return this.buttonWidthSize === 'sm' || this.buttonWidthSize === 'md';
22575
22614
  }
22576
22615
 
22577
22616
  },
@@ -22614,8 +22653,8 @@ var callbar_button_with_popovervue_type_style_index_0_lang_less_ = __webpack_req
22614
22653
 
22615
22654
  var callbar_button_with_popover_component = normalizeComponent(
22616
22655
  callbar_button_with_popover_callbar_button_with_popovervue_type_script_lang_js_,
22617
- callbar_button_with_popovervue_type_template_id_cca8d214_render,
22618
- callbar_button_with_popovervue_type_template_id_cca8d214_staticRenderFns,
22656
+ callbar_button_with_popovervue_type_template_id_428bc44b_render,
22657
+ callbar_button_with_popovervue_type_template_id_428bc44b_staticRenderFns,
22619
22658
  false,
22620
22659
  null,
22621
22660
  null,