primevue
Version:
[](https://opensource.org/licenses/MIT) [](https://badge.fury.io/js/primevue) [ • 1.75 kB
JavaScript
import t from"primevue/icons/bars";import i from"primevue/icons/thlarge";import{resolveComponent as e,openBlock as s,createElementBlock as a,createElementVNode as o,normalizeClass as r,renderSlot as n,createVNode as l}from"vue";var u={name:"DataViewLayoutOptions",emits:["update:modelValue"],props:{modelValue:String},data:()=>({isListButtonPressed:!1,isGridButtonPressed:!1}),methods:{changeLayout(t){this.$emit("update:modelValue",t),"list"===t?(this.isListButtonPressed=!0,this.isGridButtonPressed=!1):"grid"===t&&(this.isGridButtonPressed=!0,this.isListButtonPressed=!1)}},computed:{buttonListClass(){return["p-button p-button-icon-only",{"p-highlight":"list"===this.modelValue}]},buttonGridClass(){return["p-button p-button-icon-only",{"p-highlight":"grid"===this.modelValue}]},listViewAriaLabel(){return this.$primevue.config.locale.aria?this.$primevue.config.locale.aria.listView:void 0},gridViewAriaLabel(){return this.$primevue.config.locale.aria?this.$primevue.config.locale.aria.gridView:void 0}},components:{BarsIcon:t,ThLargeIcon:i}};const d={class:"p-dataview-layout-options p-selectbutton p-buttonset",role:"group"},p=["aria-label","aria-pressed"],c=["aria-label","aria-pressed"];u.render=function(t,i,u,h,b,g){const m=e("BarsIcon"),L=e("ThLargeIcon");return s(),a("div",d,[o("button",{"aria-label":g.listViewAriaLabel,class:r(g.buttonListClass),onClick:i[0]||(i[0]=t=>g.changeLayout("list")),type:"button","aria-pressed":b.isListButtonPressed},[n(t.$slots,"listicon",{},(()=>[l(m)]))],10,p),o("button",{"aria-label":g.gridViewAriaLabel,class:r(g.buttonGridClass),onClick:i[1]||(i[1]=t=>g.changeLayout("grid")),type:"button","aria-pressed":b.isGridButtonPressed},[n(t.$slots,"gridicon",{},(()=>[l(L)]))],10,c)])};export{u as default};