@start-base/start-ui/Grid/index.js

<p align="center"> <a href="https://startbase.dev" target="_blank"> <img src="https://startbase.dev/apple-touch-icon.png" width="60px" style="padding-top: 60px" /> </a> </p>

"use strict";var l=require("react"),e=require("clsx");function r(l){return l&&l.__esModule?l:{default:l}}var s=r(l),u=r(e),i=Object.defineProperty,n=Object.defineProperties,a=Object.getOwnPropertyDescriptors,d=Object.getOwnPropertySymbols,p=Object.prototype.hasOwnProperty,o=Object.prototype.propertyIsEnumerable,t=(l,e,r)=>e in l?i(l,e,{enumerable:!0,configurable:!0,writable:!0,value:r}):l[e]=r,g=(l,e)=>{for(var r in e||(e={}))p.call(e,r)&&t(l,r,e[r]);if(d)for(var r of d(e))o.call(e,r)&&t(l,r,e[r]);return l},m=(l,e)=>n(l,a(e)),x="SUI-Grid-module-root-xZ1Th",c="SUI-Grid-module-item-tsxQb",b=l.forwardRef(((l,e)=>{var r,i,n,a,t,b,f,y,$,w,v,j,O,G,N,P,h,E,I,S,q,U,_,D,M,Q=l,{children:R,className:T,style:Z,container:k=!1,span:z=12,columns:A=12,padding:B=0,gap:C=8,rowGap:F,columnGap:H}=Q,J=((l,e)=>{var r={};for(var s in l)p.call(l,s)&&e.indexOf(s)<0&&(r[s]=l[s]);if(null!=l&&d)for(var s of d(l))e.indexOf(s)<0&&o.call(l,s)&&(r[s]=l[s]);return r})(Q,["children","className","style","container","span","columns","padding","gap","rowGap","columnGap"]);const K=u.default(T,x);F||(F=C);const L="number"==typeof F?F:F.base;let V=L,W=L,X=L,Y=L,ll=L;"object"==typeof F&&(V=null!=(r=F.sm)?r:F.base,W=null!=(i=F.md)?i:V,X=null!=(n=F.lg)?n:W,Y=null!=(a=F.xl)?a:X,ll=null!=(t=F.xxl)?t:Y),H||(H=C);const el="number"==typeof H?H:H.base;let rl=el,sl=el,ul=el,il=el,nl=el;"object"==typeof H&&(rl=null!=(b=H.sm)?b:H.base,sl=null!=(f=H.md)?f:rl,ul=null!=(y=H.lg)?y:sl,il=null!=($=H.xl)?$:ul,nl=null!=(w=H.xxl)?w:il);const al="number"==typeof A?A:A.base;let dl=al,pl=al,ol=al,tl=al,gl=al;"object"==typeof A&&(dl=null!=(v=A.sm)?v:A.base,pl=null!=(j=A.md)?j:dl,ol=null!=(O=A.lg)?O:pl,tl=null!=(G=A.xl)?G:ol,gl=null!=(N=A.xxl)?N:tl);const ml="number"==typeof B?B:B.base;let xl=ml,cl=ml,bl=ml,fl=ml,yl=ml;if("object"==typeof B&&(xl=null!=(P=B.sm)?P:B.base,cl=null!=(h=B.md)?h:xl,bl=null!=(E=B.lg)?E:cl,fl=null!=(I=B.xl)?I:bl,yl=null!=(S=B.xxl)?S:fl),k)return s.default.createElement("div",g({ref:e,className:K,style:m(g({},Z),{"--sui-grid-row-gap-base":`${L}px`,"--sui-grid-row-gap-sm":`${V}px`,"--sui-grid-row-gap-md":`${W}px`,"--sui-grid-row-gap-lg":`${X}px`,"--sui-grid-row-gap-xl":`${Y}px`,"--sui-grid-row-gap-xxl":`${ll}px`,"--sui-grid-column-gap-base":`${el}px`,"--sui-grid-column-gap-sm":`${rl}px`,"--sui-grid-column-gap-md":`${sl}px`,"--sui-grid-column-gap-lg":`${ul}px`,"--sui-grid-column-gap-xl":`${il}px`,"--sui-grid-column-gap-xxl":`${nl}px`,"--sui-grid-columns-base":al,"--sui-grid-columns-sm":dl,"--sui-grid-columns-md":pl,"--sui-grid-columns-lg":ol,"--sui-grid-columns-xl":tl,"--sui-grid-columns-xxl":gl,"--sui-grid-padding-base":`${ml}px`,"--sui-grid-padding-sm":`${xl}px`,"--sui-grid-padding-md":`${cl}px`,"--sui-grid-padding-lg":`${bl}px`,"--sui-grid-padding-xl":`${fl}px`,"--sui-grid-padding-xxl":`${yl}px`})},J),R);const $l=u.default(T,c),wl="number"==typeof z?z:z.base;let vl=wl,jl=wl,Ol=wl,Gl=wl,Nl=wl;return"object"==typeof z&&(vl=null!=(q=z.sm)?q:z.base,jl=null!=(U=z.md)?U:vl,Ol=null!=(_=z.lg)?_:jl,Gl=null!=(D=z.xl)?D:Ol,Nl=null!=(M=z.xxl)?M:Gl),s.default.createElement("div",g({ref:e,className:$l,style:m(g({},Z),{"--sui-grid-span-base":wl,"--sui-grid-span-sm":vl,"--sui-grid-span-md":jl,"--sui-grid-span-lg":Ol,"--sui-grid-span-xl":Gl,"--sui-grid-span-xxl":Nl})},J),R)}));b.displayName="Grid";var f=b;module.exports=f;