Extended from PrimeVue Panel
Per our writing guidelines, please ensure the title is in Sentence case.
A normal EsCollapse component. Click it to toggle showing its contents!
A normal EsCollapse component with a multi-line header. Click it to toggle showing its contents!
An EsCollapse component that takes a "visible" prop. Click the checkbox to toggle showing its contents! If you click the collapse itself, the "visible" prop will no longer be honored.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi in aliquam ex. Nullam vestibulum ex mi, ut suscipit libero condimentum id. Pellentesque eu diam vel nisi molestie porta eget sed odio. Quisque congue risus id metus facilisis, non imperdiet libero rutrum. Mauris vitae ante porttitor, consectetur purus faucibus, euismod ex. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nulla ullamcorper elit sed viverra finibus. Mauris vitae tortor mauris. Cras suscipit nibh nec nisi cursus ornare. Maecenas quis turpis sit amet sapien dapibus sollicitudin viverra eu justo. Vivamus posuere metus sit amet purus tempus volutpat. Donec eleifend elit quam.
An EsCollapse component that takes a "visible" prop with "is-programmatic-until-user-input" true. Click the checkbox to toggle showing its contents! Unlike the previous example, if you click the collapse itself, the "visible" prop will continue to be honored.
To avoid a jumpy transition, remove margins from elements within the default slot
visibleBooleanfalseisProgrammaticUntilUserInputBooleantrueborderBooleantrue