@cavilha/layout/dist/index.es.js

A set of components used to design grid layouts

import t from"react";import{styled as r}from"@cavilha/theme";var i=r("div",{display:"flex",flexWrap:"wrap",mr:"calc($gridGutter / -2)",ml:"calc($gridGutter / -2)",boxSizing:"border-box",variants:{debug:{true:{border:"1px solid green"}},align:{normal:{alignItems:"normal"},start:{alignItems:"flex-start"},center:{alignItems:"center"},end:{alignItems:"flex-end"},stretch:{alignItems:"stretch"}}}}),l=function(r){var l=r.children,d=r.css,c=r.align,n=r.debug;return t.createElement(i,{debug:n,align:c,css:d},l)},d=r("div",{position:"relative",ml:"auto",mr:"auto",pr:"calc($gridGutter / 2)",pl:"calc($gridGutter / 2)",maxWidth:"100%",boxSizing:"border-box","@sm":{width:"100%"},"@md":{width:"100%"},"@lg":{width:"1224px"},variants:{fluid:{true:{"@sm":{width:"100%"},"@md":{width:"100%"},"@lg":{width:"100%"}}},debug:{true:{border:"1px solid red"}}}}),c=t.forwardRef((function(r,i){var l=r.fluid,c=void 0!==l&&l,n=r.children,e=r.debug;return t.createElement(d,{ref:i,fluid:c,debug:e},n)})),n=function(){return n=Object.assign||function(t){for(var r,i=1,l=arguments.length;i<l;i++)for(var d in r=arguments[i])Object.prototype.hasOwnProperty.call(r,d)&&(t[d]=r[d]);return t},n.apply(this,arguments)};var e=r("div",{position:"relative",width:"100%",minHeight:1,pr:"calc($gridMobileGutter / 2)",pl:"calc($gridMobileGutter / 2)",boxSizing:"border-box","@lg":{pr:"calc($gridGutter / 2)",pl:"calc($gridGutter / 2)"},variants:{sm:{12:{"@sm":{width:"calc(100% / 1)"}},11:{"@sm":{width:"calc(100% / ($gridColumns / 11))"}},10:{"@sm":{width:"calc(100% / ($gridColumns / 10))"}},9:{"@sm":{width:"calc(100% / ($gridColumns / 9))"}},8:{"@sm":{width:"calc(100% / ($gridColumns / 8))"}},7:{"@sm":{width:"calc(100% / ($gridColumns / 7))"}},6:{"@sm":{width:"calc(100% / ($gridColumns / 6))"}},5:{"@sm":{width:"calc(100% / ($gridColumns / 5))"}},4:{"@sm":{width:"calc(100% / ($gridColumns / 4))"}},3:{"@sm":{width:"calc(100% / ($gridColumns / 3))"}},2:{"@sm":{width:"calc(100% / ($gridColumns / 2))"}},1:{"@sm":{width:"calc(100% / $gridColumns)"}}},md:{12:{"@md":{width:"calc(100% / 1)"}},11:{"@md":{width:"calc(100% / ($gridColumns / 11))"}},10:{"@md":{width:"calc(100% / ($gridColumns / 10))"}},9:{"@md":{width:"calc(100% / ($gridColumns / 9))"}},8:{"@md":{width:"calc(100% / ($gridColumns / 8))"}},7:{"@md":{width:"calc(100% / ($gridColumns / 7))"}},6:{"@md":{width:"calc(100% / ($gridColumns / 6))"}},5:{"@md":{width:"calc(100% / ($gridColumns / 5))"}},4:{"@md":{width:"calc(100% / ($gridColumns / 4))"}},3:{"@md":{width:"calc(100% / ($gridColumns / 3))"}},2:{"@md":{width:"calc(100% / ($gridColumns / 2))"}},1:{"@md":{width:"calc(100% / $gridColumns)"}}},lg:{12:{"@lg":{width:"calc(100% / 1) !important"}},11:{"@lg":{width:"calc(100% / ($gridColumns / 11)) !important"}},10:{"@lg":{width:"calc(100% / ($gridColumns / 10)) !important"}},9:{"@lg":{width:"calc(100% / ($gridColumns / 9)) !important"}},8:{"@lg":{width:"calc(100% / ($gridColumns / 8)) !important"}},7:{"@lg":{width:"calc(100% / ($gridColumns / 7)) !important"}},6:{"@lg":{width:"calc(100% / ($gridColumns / 6)) !important"}},5:{"@lg":{width:"calc(100% / ($gridColumns / 5)) !important"}},4:{"@lg":{width:"calc(100% / ($gridColumns / 4)) !important"}},3:{"@lg":{width:"calc(100% / ($gridColumns / 3)) !important"}},2:{"@lg":{width:"calc(100% / ($gridColumns / 2)) !important"}},1:{"@lg":{width:"calc(100% / $gridColumns) !important"}}},noGutters:{true:{pr:"0",pl:"0"}},debug:{true:{bc:"#ffff001f",border:"1px solid yellow"}}}}),a=function(r){var i=r.sm,l=r.md,d=r.lg,c=r.children,a=r.debug,m=function(t,r){var i={};for(var l in t)Object.prototype.hasOwnProperty.call(t,l)&&r.indexOf(l)<0&&(i[l]=t[l]);if(null!=t&&"function"==typeof Object.getOwnPropertySymbols){var d=0;for(l=Object.getOwnPropertySymbols(t);d<l.length;d++)r.indexOf(l[d])<0&&Object.prototype.propertyIsEnumerable.call(t,l[d])&&(i[l[d]]=t[l[d]])}return i}(r,["sm","md","lg","children","debug"]);return t.createElement(e,n({sm:i,md:l,lg:d,debug:a},m),c)};export{a as Col,c as Container,l as Row};