react-configurable-grid/dist/index.m.js

A simple configurable react grid inspired on grid-styled and react-bootstrap

import e from"react";var r=["nowrap","wrap","wrap-reverse"],t=["baseline","center","flex-end","flex-start","stretch"],n=t;var a,o={xs:"0px",sm:"576px",md:"768px",lg:"992px",xl:"1200px"},i=["xs","sm","md","lg","xl"],l="15px";function s(e,s){if(void 0===e&&(e={}),a=!0,"undefined"==typeof window||!document.querySelector("[data-grid]")){for(var c=0;i[c];c++)(e[i[c]]||null===e[i[c]])&&(o[i[c]]=e[i[c]]);if("string"==typeof e.gutter){var d=e.gutter.replace(/[0-9]+/,e.gutter.match(/\d/g).join("")/2);l=d}var p=function(){for(var e=".rcg-col{-webkit-box-sizing:border-box;box-sizing:border-box;padding:0 "+l+"}",r=Object.keys(o),t=0;r[t];t++){var n=r[t],a=o[n];if(null!==a)for(var i=1;i<=12;i++){var s=i/12*100;e+="@media(min-width:"+a+"){.rcg-col-"+n+"-"+i+"{max-width:"+s+"%;-ms-flex-preferred-size:"+s+"%;flex-basis:"+s+"%}}"}}return e}()+".rcg-row{-webkit-box-sizing:border-box;box-sizing:border-box;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;margin: 0 -"+l+"}"+r.map(function(e){return".rcg-row-wrap--"+e+"{-ms-flex-wrap:"+e+";flex-wrap:"+e+"}"}).join("")+t.map(function(e){return".rcg-row-align--"+e+"{-webkit-box-align:"+e+";-ms-flex-align:"+e+";align-items:"+e+"}"}).join("")+n.map(function(e){return".rcg-row-justify--"+e+"{-webkit-box-pack:"+e+";-ms-flex-pack:"+e+";justify-content:"+e+"}"}).join(""),f='<style type="text/css" '+"data-grid"+">"+p+"</style>";return function(e,r){"undefined"==typeof window||document.querySelector("["+e+"]")||(document.head||document.getElementsByTagName("head")[0]).insertAdjacentHTML("beforeend",r)}("data-grid",f),s?f:p}}function c(r){var t=["rcg-col",r.className];a||s();for(var n=Object.assign({},r),o=0,l=i;o<l.length;o+=1){var c=l[o];r[c]&&(t.push("rcg-col-"+c+"-"+r[c]),delete n[c])}return delete n.component,e.createElement(r.component,Object.assign({},n,{className:t.join(" ")}),r.children)}c.defaultProps={component:"div",className:null};var d=["wrap","align","justify"];function p(r){for(var t=["rcg-row",r.className],n=Object.assign({},r),a=0,o=d;a<o.length;a+=1){var i=o[a];r[i]&&(t.push("rcg-row-"+i+"--"+r[i]),delete n[i])}return delete n.component,e.createElement(r.component,Object.assign({},n,{className:t.join(" ")}),r.children)}p.defaultProps={wrap:"wrap",align:"stretch",justify:"flex-start",component:"div",className:null};export{c as Col,p as Row,s as configureGrid};