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) [![Discord Chat](https://img.shields.io/discord/55794023

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