felicity-lims/felicity/templates/static/assets/Drawer-e4f25488.js

1 line
2.1 KiB
JavaScript

import{f as u,r,w as f,h,k as w,x as e,s as m,l as n,al as i,_ as p}from"./_plugin-vue_export-helper-3f67fb71.js";const v={class:"flex items-center justify-between"},x={tabindex:"0",class:"focus:outline-none text-2xl font-semibold leading-6 text-gray-800"},g=e("svg",{width:"24",height:"24",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg"},[e("path",{d:"M18 6L6 18",stroke:"#4B5563","stroke-width":"1.25","stroke-linecap":"round","stroke-linejoin":"round"}),e("path",{d:"M6 6L18 18",stroke:"#4B5563","stroke-width":"1.25","stroke-linecap":"round","stroke-linejoin":"round"})],-1),y=[g],_={class:"w-full my-4 py-1 px-2 bg-white shadow-xs flex-1"},k={class:"w-full my-1 py-1 px-2 flex items-center"},b=u({__name:"Drawer",props:{show:Boolean,contentWidth:String},emits:["close"],setup(o,{emit:d}){const c=o;let t=r(null),l=r(null);return f(()=>c.show,(s,a)=>{s!==!0?(t.value?.classList.add("translate-x-full"),t.value?.classList.remove("translate-x-0"),setTimeout(function(){l.value?.classList.add("hidden")},500)):(setTimeout(function(){t.value?.classList.remove("translate-x-full"),t.value?.classList.add("translate-x-0")},500),l.value?.classList.remove("hidden"))}),(s,a)=>(h(),w("div",{ref_key:"drawerNode",ref:l,class:"w-full h-screen bg-gray-800 bg-opacity-90 top-0 left-0 overflow-y-auto hidden overflow-x-hidden fixed sticky-0 z-10"},[e("div",{ref_key:"notification",ref:t,class:"w-full absolute z-20 right-0 h-full overflow-x-hidden transform translate-x-full transition ease-in-out duration-700"},[e("div",{class:m(["",["bg-gray-50 h-screen overflow-y-auto p-8 absolute right-0 flex flex-col",o.contentWidth?o.contentWidth:"w-1/3"]])},[e("div",v,[e("p",x,[n(s.$slots,"header",{},()=>[i("Drawer Title")])]),e("button",{role:"button","aria-label":"close modal",class:"focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-gray-500 rounded-sm cursor-pointer",onClick:a[0]||(a[0]=()=>d("close"))},y)]),e("div",_,[n(s.$slots,"body",{},()=>[i("Drawer Body")])]),e("div",k,[n(s.$slots,"footer")])],2)],512)],512))}}),L=p(b,[["__file","/home/aurthurm/Development/felicity-lims/webapp/components/Drawer.vue"]]);export{L as default};