@dialpad/dialtone-vue/dist/lib/collapsible/collapsible.cjs

Vue component library for Dialpad's design system Dialtone

"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const a=require("../../common/utils/index.cjs"),i=require("./collapsible-lazy-show.cjs"),l=require("@dialpad/dialtone-icons/vue2"),o=require("../../_plugin-vue2_normalizer-e_CkxkSV.cjs"),r=require("../lazy-show/lazy-show.cjs"),s=require("../button/button.cjs"),c={name:"DtCollapsible",components:{DtButton:s.default,DtCollapsibleLazyShow:i.default,DtLazyShow:r.default,DtIconChevronDown:l.DtIconChevronDown,DtIconChevronRight:l.DtIconChevronRight},props:{anchorText:{type:String,default:null},open:{type:Boolean,default:null},id:{type:String,default(){return a.getUniqueString()}},elementType:{type:String,default:"div"},contentElementType:{type:String,default:"div"},anchorClass:{type:[String,Array,Object],default:null},contentClass:{type:[String,Array,Object],default:null},maxWidth:{type:String,default:null},maxHeight:{type:String,default:null},ariaLabel:{type:String,default:null},ariaLabelledBy:{type:String,default:null}},emits:["update:open","opened"],data(){return{isOpen:!0}},computed:{labelledBy(){return this.ariaLabelledBy||!this.ariaLabel&&a.getUniqueString("DtCollapsible__anchor")}},watch:{open:{handler:function(n){n!==null&&(this.isOpen=n)},immediate:!0}},mounted(){this.validateProperAnchor()},methods:{onLeaveTransitionComplete(){this.$emit("opened",!1),this.open!==null&&this.$emit("update:open",!1)},onEnterTransitionComplete(){this.$emit("opened",!0,this.$refs.content),this.open!==null&&this.$emit("update:open",!0)},defaultToggleOpen(){this.open===null&&this.toggleOpen()},toggleOpen(){this.isOpen=!this.isOpen},validateProperAnchor(){!this.anchorText&&!this.$scopedSlots.anchor&&console.error("anchor text and anchor slot content cannot both be falsy")}}};var d=function(){var e=this,t=e._self._c;return t(e.elementType,e._g({ref:"collapsible",tag:"component"},e.$listeners),[t("div",{ref:"anchor",class:e.anchorClass,attrs:{id:!e.ariaLabelledBy&&e.labelledBy}},[e._t("anchor",function(){return[t("dt-button",{style:{width:e.maxWidth},attrs:{importance:"clear",kind:"muted","aria-controls":e.id,"aria-expanded":`${e.isOpen}`},on:{click:e.defaultToggleOpen}},[e.isOpen?t("dt-icon-chevron-down",{staticClass:"d-collapsible__icon",attrs:{size:"300"}}):t("dt-icon-chevron-right",{staticClass:"d-collapsible__icon",attrs:{size:"300"}}),t("span",{staticClass:"d-collapsible__anchor-text",attrs:{title:e.anchorText}},[e._v(" "+e._s(e.anchorText)+" ")])],1)]},{attrs:{"aria-controls":e.id,"aria-expanded":e.isOpen.toString(),role:"button"}})],2),t("dt-collapsible-lazy-show",e._g({ref:"contentWrapper",class:e.contentClass,style:{"max-height":e.maxHeight,"max-width":e.maxWidth},attrs:{id:e.id,"aria-hidden":`${!e.isOpen}`,"aria-labelledby":e.labelledBy,"aria-label":e.ariaLabel,show:e.isOpen,"element-type":e.contentElementType,"data-qa":"dt-collapsible--content",tabindex:"-1",appear:""},on:{"after-leave":e.onLeaveTransitionComplete,"after-enter":e.onEnterTransitionComplete}},e.$listeners),[e._t("content")],2)],1)},p=[],u=o.n(c,d,p);const h=u.exports;exports.default=h;
//# sourceMappingURL=collapsible.cjs.map