amotify/dist/atoms/Grid.js

UI Component for React,NextJS,esbuild

import{b as o,c as u,d as h}from"../chunk-C5N2D3ZX.js";import{jsx as c}from"react/jsx-runtime";import g,{UUID as S}from"jmini";import x from"./Box";import{GridClasses as L}from"../@styles/componentClasses";import{useEffect as T,useState as $}from"react";const G=t=>c(x,o({display:"grid"},t)),i=G;i.Layout=t=>{let n=t,{gridTemplateColumns:f,gridTemplateRows:y,gridChildTemplates:d=[]}=n,C=h(n,["gridTemplateColumns","gridTemplateRows","gridChildTemplates"]),[a]=$(S(12));return T(()=>{let s="inlinestyle-"+a,r=document.createElement("style");return r.textContent="",d.forEach(([l,p],m)=>{let e=[`[data-grid-layout-id='${a}'] > *:nth-child(${d.length}n + ${m+1}) {`];d.length==m+1&&(e=[`[data-grid-layout-id='${a}'] > *:nth-child(${d.length}n) {`]),l&&e.push(`   grid-column:${l};`),p&&e.push(`   grid-row:${p};`),e.push("}",""),r.textContent+=e.join(`
`)}),r.id=s,g("head").append(r),()=>{g("#"+s).remove()}},[]),c(i,u(o({},C),{"data-grid-layout-id":a,className:[t.className,L("GridLayout")].join(" "),xcss:o({gridTemplateColumns:f,gridTemplateRows:y},t.xcss)}))};export{i as Grid,i as default};