UNPKG

primevue

Version:

[![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://opensource.org/licenses/MIT) [![npm version](https://badge.fury.io/js/primevue.svg)](https://badge.fury.io/js/primevue) [![Actions CI](https://github.com/primefaces/primevue/wo

2 lines (1 loc) 3.28 kB
import{UniqueComponentId as e}from"primevue/utils";import n from"primevue/ripple";import{resolveDirective as t,openBlock as l,createElementBlock as a,normalizeClass as i,createElementVNode as o,renderSlot as s,toDisplayString as d,createCommentVNode as p,withDirectives as r,createVNode as c,Transition as g,withCtx as u,vShow as h}from"vue";var m={name:"Panel",emits:["update:collapsed","toggle"],props:{header:String,toggleable:Boolean,collapsed:Boolean,toggleButtonProps:String},data(){return{d_collapsed:this.collapsed}},watch:{collapsed(e){this.d_collapsed=e}},methods:{toggle(e){this.d_collapsed=!this.d_collapsed,this.$emit("update:collapsed",this.d_collapsed),this.$emit("toggle",{originalEvent:e,value:this.d_collapsed})},onKeyDown(e){"Enter"!==e.code&&"Space"!==e.code||(this.toggle(e),e.preventDefault())}},computed:{ariaId:()=>e(),containerClass(){return["p-panel p-component",{"p-panel-toggleable":this.toggleable}]}},directives:{ripple:n}};const b={class:"p-panel-header"},f=["id"],y={class:"p-panel-icons"},x=["id","aria-label","aria-controls","aria-expanded"],v=["id","aria-labelledby"],_={class:"p-panel-content"};!function(e,n){void 0===n&&(n={});var t=n.insertAt;if(e&&"undefined"!=typeof document){var l=document.head||document.getElementsByTagName("head")[0],a=document.createElement("style");a.type="text/css","top"===t&&l.firstChild?l.insertBefore(a,l.firstChild):l.appendChild(a),a.styleSheet?a.styleSheet.cssText=e:a.appendChild(document.createTextNode(e))}}("\n.p-panel-header {\n display: -webkit-box;\n display: -ms-flexbox;\n display: flex;\n -webkit-box-pack: justify;\n -ms-flex-pack: justify;\n justify-content: space-between;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center;\n}\n.p-panel-title {\n line-height: 1;\n}\n.p-panel-header-icon {\n display: -webkit-inline-box;\n display: -ms-inline-flexbox;\n display: inline-flex;\n -webkit-box-pack: center;\n -ms-flex-pack: center;\n justify-content: center;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center;\n cursor: pointer;\n text-decoration: none;\n overflow: hidden;\n position: relative;\n}\n"),m.render=function(e,n,m,k,w,C){const B=t("ripple");return l(),a("div",{class:i(C.containerClass)},[o("div",b,[s(e.$slots,"header",{},(()=>[m.header?(l(),a("span",{key:0,id:C.ariaId+"_header",class:"p-panel-title"},d(m.header),9,f)):p("",!0)])),o("div",y,[s(e.$slots,"icons"),m.toggleable?r((l(),a("button",{key:0,id:C.ariaId+"_header",type:"button",role:"button",class:"p-panel-header-icon p-panel-toggler p-link","aria-label":m.toggleButtonProps||m.header,"aria-controls":C.ariaId+"_content","aria-expanded":!w.d_collapsed,onClick:n[0]||(n[0]=(...e)=>C.toggle&&C.toggle(...e)),onKeydown:n[1]||(n[1]=(...e)=>C.onKeyDown&&C.onKeyDown(...e))},[o("span",{class:i({"pi pi-minus":!w.d_collapsed,"pi pi-plus":w.d_collapsed})},null,2)],40,x)),[[B]]):p("",!0)])]),c(g,{name:"p-toggleable-content"},{default:u((()=>[r(o("div",{id:C.ariaId+"_content",class:"p-toggleable-content",role:"region","aria-labelledby":C.ariaId+"_header"},[o("div",_,[s(e.$slots,"default")])],8,v),[[h,!w.d_collapsed]])])),_:3})],2)};export{m as default};