vexip-ui/lib/components/grid/cell.cjs

A Vue 3 UI library, Highly customizability, full TypeScript, performance pretty good

"use strict";const r=require("vue"),b=require("@vexip-ui/config"),h=require("@vexip-ui/utils"),C=require("./props.cjs"),d=require("./helper.cjs"),w=require("./symbol.cjs"),F=r.defineComponent({name:"Cell",props:C.cellProps,setup(x,{slots:a}){const n=b.useProps("cell",x,{tag:"div",top:"auto",left:"auto",width:null,height:1,right:"",bottom:"",xs:null,sm:null,md:null,lg:null,xl:null,xxl:null,useFlex:null}),l=r.inject(w.GRID_STATE,null),u=b.useNameHelper("cell");r.provide(w.GRID_STATE,null);const e=r.reactive({top:n.top,right:n.right,bottom:n.bottom,left:n.left,width:n.width,height:n.height}),f=Object.keys(e),m=r.computed(()=>h.isDefined(n.width)?n.width:l!=null&&l.columns&&typeof l.columns=="number"?l.columns:1);r.watch(d.currentBreakPoint,t=>{const o=y(t);o?typeof o=="number"?(f.forEach(i=>{e[i]=n[i]}),e.width=o):(f.forEach(i=>{e[i]=h.has(o,i)?o[i]:n[i]}),e.width=e.width??m.value):(f.forEach(i=>{e[i]=n[i]}),e.width=m.value)},{immediate:!0});const E=r.computed(()=>{const t=n.useFlex!==!1&&(n.useFlex||(l==null?void 0:l.cellFlex))&&{...(l==null?void 0:l.cellFlex)||{},...n.useFlex?n.useFlex===!0?{justify:"start",align:"top"}:n.useFlex:{}},o={[u.b()]:!0,[u.bm("inherit")]:l||n.inherit,[u.bm("flex")]:t};return t&&(t.justify&&(o[u.bm(t.justify)]=!0),t.align&&(o[u.bm(t.align)]=!0)),o}),S=r.computed(()=>{const t={},o=c(e.top),i=c(e.right),p=c(e.bottom),g=c(e.left);return o&&p?(t.gridRowStart=s(e.top),t.gridRowEnd=s(e.bottom)):o?(t.gridRowStart=s(e.top),t.gridRowEnd=`span ${e.height}`):p?(t.gridRowStart=`span ${e.height}`,t.gridRowEnd=s(e.bottom)):t.gridRowEnd=`span ${e.height}`,g&&i?(t.gridColumnStart=s(e.left),t.gridColumnEnd=s(e.right)):g?(t.gridColumnStart=s(e.left),t.gridColumnEnd=`span ${e.width}`):i?(t.gridColumnStart=`span ${e.width}`,t.gridColumnEnd=s(e.right)):t.gridColumnStart=`span ${e.width}`,t});function c(t){return t===0||t&&t!=="auto"}function s(t){return typeof t=="number"?t+1:t}function y(t){const o=d.breakPoints.findIndex(i=>i===t);if(~o){for(let i=o;i>=0;--i)if(h.isDefined(n[d.breakPoints[i]]))return n[d.breakPoints[i]]}return null}return()=>r.h(n.tag||"div",{class:E.value,style:S.value},{default:()=>{var t;return(t=a.default)==null?void 0:t.call(a)}})}});module.exports=F;
//# sourceMappingURL=cell.cjs.map