@dialpad/dialtone
Version:
Dialpad's Dialtone design system monorepo
3 lines (2 loc) • 4.45 kB
JavaScript
;Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const u=require("@dialpad/dialtone-icons/vue3"),n=require("../../common/utils/index.cjs"),p=require("../../localization/index.cjs"),t=require("vue"),b=require("../../_plugin-vue_export-helper-BRilXfQE.cjs"),w=require("../callbar-button/callbar-button-constants.cjs"),h=require("../button/button.cjs"),_=require("../dropdown/dropdown.cjs"),m=require("../callbar-button/callbar-button.cjs"),f={name:"DtRecipeCallbarButtonWithDropdown",components:{DtRecipeCallbarButton:m.default,DtDropdown:_.default,DtButton:h.default,DtIconChevronUp:u.DtIconChevronUp},inheritAttrs:!1,props:{id:{type:String,default(){return n.default.getUniqueString()}},ariaLabel:{type:String,default:null,validator:e=>e||(void 0).$slots.default},placement:{type:String,default:"top"},fallbackPlacements:{type:Array,default:()=>["auto"]},disabled:{type:Boolean,default:!1},forceShowArrow:{type:Boolean,default:!1},active:{type:Boolean,default:!1},danger:{type:Boolean,default:!1},onClick:{type:Function,default:null},buttonClass:{type:[String,Array,Object],default:""},textClass:{type:[String,Array,Object],default:""},buttonWidthSize:{type:String,default:"xl",validator:e=>w.CALLBAR_BUTTON_VALID_WIDTH_SIZE.includes(e)},invertedTooltip:{type:Boolean,default:!1},showTooltip:{type:Boolean,default:null},tooltipText:{type:String,default:void 0},tooltipDelay:{type:Boolean,default:void 0}},emits:["arrow-click","click","opened"],data(){return{open:!1,i18n:new p.DialtoneLocalization}},computed:{showArrowButton(){return this.forceShowArrow||!this.disabled},isCompactMode(){return this.buttonWidthSize==="sm"||this.buttonWidthSize==="md"},arrowButtonLabel(){return this.i18n.$t("DIALTONE_CALLBAR_BUTTON_WITH_DROPDOWN_ARROW_BUTTON_ARIA_LABEL")}},mounted(){n.warnIfUnmounted(n.returnFirstEl(this.$el),this.$options.name)},methods:{removeClassStyleAttrs:n.removeClassStyleAttrs,addClassStyleAttrs:n.addClassStyleAttrs,arrowClick(e){return this.$emit("arrow-click",e),this.toggleOpen()},toggleOpen(){return this.open=!this.open},syncOpenState(){this.open=this.openDropdown},buttonClick(e){this.$props.onClick?this.$emit("click",e):this.arrowClick(e)},onModalIsOpened(e){this.open=e,this.$emit("opened",e)}}};function C(e,B,o,S,a,l){const r=t.resolveComponent("dt-recipe-callbar-button"),i=t.resolveComponent("dt-icon-chevron-up"),d=t.resolveComponent("dt-button"),s=t.resolveComponent("dt-dropdown");return t.openBlock(),t.createElementBlock("div",t.mergeProps({class:"dt-recipe--callbar-button-with-dropdown"},l.addClassStyleAttrs(e.$attrs)),[t.createVNode(r,{active:o.active,"aria-label":o.ariaLabel,"button-class":o.buttonClass,"button-width-size":o.buttonWidthSize,danger:o.danger,disabled:o.disabled,"inverted-tooltip":o.invertedTooltip,"show-tooltip":o.showTooltip,"text-class":o.textClass,"tooltip-delay":o.tooltipDelay,"tooltip-text":o.tooltipText,class:"dt-recipe--callbar-button-with-dropdown--main-button",onClick:l.buttonClick},{icon:t.withCtx(()=>[t.renderSlot(e.$slots,"icon")]),tooltip:t.withCtx(()=>[t.renderSlot(e.$slots,"tooltip")]),default:t.withCtx(()=>[t.renderSlot(e.$slots,"default")]),_:3},8,["active","aria-label","button-class","button-width-size","danger","disabled","inverted-tooltip","show-tooltip","text-class","tooltip-delay","tooltip-text","onClick"]),l.showArrowButton?(t.openBlock(),t.createBlock(s,t.mergeProps({key:0,id:o.id,"fallback-placements":o.fallbackPlacements,open:a.open,modal:!1,placement:o.placement,class:"dt-recipe--callbar-button-with-dropdown--dropdown-wrapper",padding:"none"},l.removeClassStyleAttrs(e.$attrs),{onOpened:l.onModalIsOpened}),{anchor:t.withCtx(()=>[t.createVNode(d,{active:a.open,class:t.normalizeClass(["dt-recipe--callbar-button-with-dropdown--arrow",{"dt-recipe--callbar-button-with-dropdown--arrow--large":!l.isCompactMode}]),circle:!0,importance:"clear",size:"lg","aria-label":l.arrowButtonLabel,title:l.arrowButtonLabel,width:"2rem",onClick:l.arrowClick},{icon:t.withCtx(()=>[t.createVNode(i,{class:"dt-recipe--callbar-button-with-dropdown--arrow__icon",size:"200"})]),_:1},8,["active","class","aria-label","title","onClick"])]),list:t.withCtx(({close:c})=>[t.renderSlot(e.$slots,"list",{close:c})]),_:3},16,["id","fallback-placements","open","placement","onOpened"])):t.createCommentVNode("",!0)],16)}const y=b._(f,[["render",C]]);exports.default=y;
//# sourceMappingURL=callbar-button-with-dropdown.cjs.map