keski_lib_catalog 1.0.5 → 1.0.7

package/README.md

@@ -1,30 +1,30 @@
-# keski_lib_catalog
-
-> Keski catalog components for Keski store, Codenation Studio
-
-[![NPM](https://img.shields.io/npm/v/keski_lib_catalog.svg)](https://www.npmjs.com/package/keski_lib_catalog) [![JavaScript Style Guide](https://img.shields.io/badge/code_style-standard-brightgreen.svg)](https://standardjs.com)
-
-## Install
-
-```bash
-npm install --save keski_lib_catalog
-```
-
-## Usage
-
-```jsx
-import React, { Component } from 'react'
-
-import MyComponent from 'keski_lib_catalog'
-import 'keski_lib_catalog/dist/index.css'
-
-class Example extends Component {
-  render() {
-    return <MyComponent />
-  }
-}
-```
-
-## License
-
- © [Francisco Marmolejo](https://github.com/Francisco Marmolejo)
+# keski_lib_catalog
+
+> Keski catalog components for Keski store, Codenation Studio
+
+[![NPM](https://img.shields.io/npm/v/keski_lib_catalog.svg)](https://www.npmjs.com/package/keski_lib_catalog) [![JavaScript Style Guide](https://img.shields.io/badge/code_style-standard-brightgreen.svg)](https://standardjs.com)
+
+## Install
+
+```bash
+npm install --save keski_lib_catalog
+```
+
+## Usage
+
+```jsx
+import React, { Component } from 'react'
+
+import MyComponent from 'keski_lib_catalog'
+import 'keski_lib_catalog/dist/index.css'
+
+class Example extends Component {
+  render() {
+    return <MyComponent />
+  }
+}
+```
+
+## License
+
+ © [Francisco Marmolejo](https://github.com/Francisco Marmolejo)

package/dist/index.js

@@ -29,8 +29,8 @@ var AtomicElements = /*#__PURE__*/function () {
   _proto.build = function build(content, layoutId) {
     return this.layout[layoutId](content);
   };
-  _proto.footprint = function footprint(layoutId) {
-    var img = this.layoutFootprint[layoutId];
+  _proto.footprint = function footprint(layout) {
+    var img = this.layoutFootprint[layout];
     console.log('img atomic', img);
     return img;
   };
@@ -39,44 +39,19 @@ var AtomicElements = /*#__PURE__*/function () {
 
 function Layout1(content) {
   var _content$;
-  return /*#__PURE__*/React.createElement(material.Grid, null, (_content$ = content['0']) !== null && _content$ !== void 0 && _content$.title ? content['0'].title : 'placeholder', /*#__PURE__*/React.createElement(material.Card, null));
+  return /*#__PURE__*/React.createElement(material.Grid, null, (_content$ = content['0']) !== null && _content$ !== void 0 && _content$.title ? content['0'].title : '', /*#__PURE__*/React.createElement(material.Card, null));
 }
 
-var BriefComponents = /*#__PURE__*/function (_AtomicElements) {
-  _inheritsLoose(BriefComponents, _AtomicElements);
-  function BriefComponents() {
+var Brief = /*#__PURE__*/function (_AtomicElements) {
+  _inheritsLoose(Brief, _AtomicElements);
+  function Brief() {
     var _this;
     _this = _AtomicElements.call(this) || this;
     _this.layout = [Layout1];
+    _this.layoutFootprint = ['text_image_layout_1.png'];
     return _this;
   }
-  return BriefComponents;
-}(AtomicElements);
-
-function Layout1$1(content) {
-  var _content$;
-  return /*#__PURE__*/React.createElement(material.Grid, null, (_content$ = content['0']) !== null && _content$ !== void 0 && _content$.title ? content['0'].title : 'placeholder', /*#__PURE__*/React.createElement(material.Card, null));
-}
-
-function Layout1$2(content) {
-  var _content$;
-  return /*#__PURE__*/React.createElement(material.Grid, null, (_content$ = content['0']) !== null && _content$ !== void 0 && _content$.title ? content['0'].title : 'placeholder', /*#__PURE__*/React.createElement(material.Card, null));
-}
-
-var banner_layout_1 = "banner_layout_1~tssbvgEJ.jpg";
-
-var banner_layout_2 = "banner_layout_2~tssbvgEJ.jpg";
-
-var HeadComponents = /*#__PURE__*/function (_AtomicElements) {
-  _inheritsLoose(HeadComponents, _AtomicElements);
-  function HeadComponents() {
-    var _this;
-    _this = _AtomicElements.call(this) || this;
-    _this.layout = [Layout1$1, Layout1$2];
-    _this.layoutFootprint = [banner_layout_1, banner_layout_2];
-    return _this;
-  }
-  return HeadComponents;
+  return Brief;
 }(AtomicElements);
 
 var COLOR_PRIMARY = '#4CAF50';
@@ -145,15 +120,16 @@ var theme = styles.createTheme({
 });
 
 var BannerContainer = styles.styled(material.Box)(function (_ref) {
-  var _ref2;
+  var _json$component$bg_im, _json$component$bg_im2, _ref2;
   var theme = _ref.theme,
     json = _ref.json;
   return _ref2 = {
     display: 'flex',
-    justifyContent: 'center',
+    justifyContent: 'right',
     heigth: '100%',
-    padding: '0px',
-    backgroundImage: "url(" + json.backgroundImage + ")",
+    padding: '32px',
+    backgroundColor: json.component.bg_color1 && json.component.bg_type == 1 ? json.component.bg_color1 : null,
+    backgroundImage: (_json$component$bg_im = json.component.bg_image) !== null && _json$component$bg_im !== void 0 && _json$component$bg_im.url && json.component.bg_type === 3 ? "url(" + json.component.bg_image.url + ")" : (_json$component$bg_im2 = json.component.bg_image) !== null && _json$component$bg_im2 !== void 0 && _json$component$bg_im2.url && json.component.bg_type === 2 ? "linear-gradient(" + json.component.bg_color1 + ", " + json.component.bg_color2 + ")" : 'none',
     backgroundPosition: '0% 20%',
     backgroundSize: 'cover',
     backgroundRepeat: 'no-repeat'
@@ -186,7 +162,8 @@ var BannerContent = styles.styled(material.Box)(function () {
     display: 'flex',
     flexDirection: 'column',
     justifyContent: 'center',
-    maxWidth: 420,
+    width: '100%',
+    maxWidth: '30%',
     padding: '30px',
     color: Colors.contrastText
   };
@@ -195,35 +172,63 @@ var BannerTittle = styles.styled(material.Typography)(function () {
   var _ref5;
   return _ref5 = {
     lineHeigth: 1.5,
-    fontSize: '72px',
+    fontSize: '28px',
     marginBottom: '20px',
     color: Colors.contrastText
   }, _ref5[theme.breakpoints.down('sm')] = {
     fontSize: '42px'
   }, _ref5;
 });
-var BannerDescription = styles.styled(material.Typography)(function (_ref6) {
-  var _ref7;
-  var theme = _ref6.theme;
-  return _ref7 = {
+var BannerSubtitle = styles.styled(material.Typography)(function () {
+  var _ref6;
+  return _ref6 = {
+    lineHeigth: 1.5,
+    fontSize: '24px',
+    marginBottom: '20px',
+    color: Colors.contrastText
+  }, _ref6[theme.breakpoints.down('sm')] = {
+    fontSize: '42px'
+  }, _ref6;
+});
+var BannerDescription = styles.styled(material.Typography)(function (_ref7) {
+  var _ref8;
+  var theme = _ref7.theme;
+  return _ref8 = {
     lineHeigth: 1.25,
+    fontSize: '22px',
     letterSpacing: 1.25,
     marginBottom: "3em"
-  }, _ref7[theme.breakpoints.down('md')] = {
+  }, _ref8[theme.breakpoints.down('md')] = {
     lineHeigth: 1.15,
     letterSpacing: 1.15,
     marginBottom: "1.5em"
-  }, _ref7;
+  }, _ref8;
 });
-var BannerButton = styles.styled(material.Button)(function (_ref8) {
-  var theme = _ref8.theme;
+var BannerButton = styles.styled(material.Button)(function (_ref9) {
+  var theme = _ref9.theme;
   return {
     color: Colors.white,
     background: theme.palette.primary.main,
-    fontSize: '25px'
+    fontSize: '24px'
   };
 });
 
+function Layout1$1(content) {
+  return /*#__PURE__*/React.createElement(material.Box, null, /*#__PURE__*/React.createElement(BannerTittle, null, content.component.subcomponent[0].title ? content.component.subcomponent[0].title : 'Placeholder title'), /*#__PURE__*/React.createElement(BannerSubtitle, null, content.component.subcomponent[0].subtitle ? content.component.subcomponent[0].subtitle : 'Placeholder subtitle'), /*#__PURE__*/React.createElement(BannerDescription, null, content.component.subcomponent[0].description ? content.component.subcomponent[0].description : 'Placeholder description'), /*#__PURE__*/React.createElement(BannerButton, null, content.component.subcomponent[0].button_title ? content.component.subcomponent[0].button_title : 'Placeholder button'));
+}
+
+var Banner = /*#__PURE__*/function (_AtomicElements) {
+  _inheritsLoose(Banner, _AtomicElements);
+  function Banner() {
+    var _this;
+    _this = _AtomicElements.call(this) || this;
+    _this.layout = [Layout1$1];
+    _this.layoutFootprint = ['banner_layout_1.jpg'];
+    return _this;
+  }
+  return Banner;
+}(AtomicElements);
+
 function HeadContainer(props) {
   var theme = styles.useTheme();
   return /*#__PURE__*/React.createElement(BannerContainer, {
@@ -234,12 +239,15 @@ function HeadContainer(props) {
   }, /*#__PURE__*/React.createElement(BannerContent, null, props.children));
 }
 
+var JK_RESOURCES = 'https://jk-clients.s3.us-east-2.amazonaws.com/jk-resources/';
+
 var Section = /*#__PURE__*/function () {
   function Section(AtomicElement) {
     this.child = AtomicElement;
   }
   var _proto = Section.prototype;
   _proto.component = function component(json) {
+    console.log('json', json);
     return /*#__PURE__*/React.createElement(HeadContainer, {
       json: json
     }, this.child.build(json, json.component.layout));
@@ -247,7 +255,7 @@ var Section = /*#__PURE__*/function () {
   _proto.getFootPrint = function getFootPrint(layout) {
     var img = this.child.footprint(layout);
     console.log('section', img);
-    return img;
+    return "" + JK_RESOURCES + img;
   };
   _proto.layoutLength = function layoutLength() {
     return this.child.layoutsLength();
@@ -256,15 +264,16 @@ var Section = /*#__PURE__*/function () {
 }();
 var Sections = /*#__PURE__*/function () {
   function Sections() {
-    this.head = new Section(new HeadComponents());
-    this.brief = new Section(new BriefComponents());
-    this.sections = [this.head, this.brief];
+    this.banner = new Section(new Banner());
+    this.brief = new Section(new Brief());
+    this.sections = [this.banner, this.brief];
   }
   var _proto2 = Sections.prototype;
   _proto2.getSectionList = function getSectionList() {
     return {
-      '0': 'Header',
-      '1': 'Brief'
+      '0': 'Banner',
+      '1': 'Brief',
+      '2': 'Quotes'
     };
   };
   _proto2.getLayoutsFromSection = function getLayoutsFromSection(index) {

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../src/atomicElement.js","../src/brief/elements/layout1.js","../src/brief/Component.js","../src/head/elements/layout1.js","../src/head/elements/layout2.js","../src/head/elements/banner_layout_1.jpg","../src/head/elements/banner_layout_2.jpg","../src/head/Component.js","../src/theme/index.js","../src/head/styles.js","../src/canvas/HeadContainer.js","../src/Section.js"],"sourcesContent":["export class AtomicElements {\r\n    constructor(){\r\n        this.layout = []\r\n        this.layoutFootprint = []\r\n    }\r\n\r\n    layoutsLength(){\r\n        return(\r\n            this.layout.length\r\n        )\r\n    }\r\n\r\n    build(content, layoutId){\r\n        return(\r\n            this.layout[layoutId](content)\r\n        )\r\n    }\r\n\r\n    footprint(layoutId){\r\n        let img = this.layoutFootprint[layoutId]\r\n        console.log('img atomic', img)\r\n        return(\r\n            img\r\n        )\r\n    }\r\n\r\n}\r\n","import { Card, CardContent, Grid } from \"@mui/material\"\r\nimport React from \"react\"\r\n\r\n\r\nexport default function Layout1(content){\r\n    return(\r\n        <Grid>\r\n           {content['0']?.title ? content['0'].title : 'placeholder'}\r\n            <Card>\r\n                {/* <CardContent>\r\n                {content['0']?.title ? content['0'].title : 'placeholder'}\r\n                </CardContent> */}\r\n            </Card>\r\n        </Grid>\r\n    )\r\n}","import { AtomicElements } from \"../atomicElement\"\r\nimport Layout1  from './elements/layout1'\r\n\r\nexport class BriefComponents extends AtomicElements {\r\n    constructor() {\r\n      super()\r\n    }\r\n    layout = [Layout1]\r\n\r\n    //Methods heredados\r\n    // layout, layouts(), build() \r\n    \r\n}","import { Card, CardContent, Grid } from \"@mui/material\"\r\nimport React from \"react\"\r\n\r\n\r\nexport default function Layout1(content){\r\n    return(\r\n        <Grid>\r\n            {content['0']?.title ? content['0'].title : 'placeholder'}\r\n            <Card>\r\n                {/* <CardContent>\r\n                {content['0']?.title ? content['0'].title : 'placeholder'}\r\n                </CardContent> */}\r\n            </Card>\r\n        </Grid>\r\n    )\r\n}","import { Card, CardContent, Grid } from \"@mui/material\"\r\nimport React from \"react\"\r\n\r\n\r\nexport default function Layout1(content){\r\n    return(\r\n        <Grid>\r\n            {content['0']?.title ? content['0'].title : 'placeholder'}\r\n            <Card>\r\n                {/* <CardContent>\r\n                {content['0']?.title ? content['0'].title : 'placeholder'}\r\n                </CardContent> */}\r\n            </Card>\r\n        </Grid>\r\n    )\r\n}","/* loaded by smart-asset */\nexport default \"banner_layout_1~tssbvgEJ.jpg\"","/* loaded by smart-asset */\nexport default \"banner_layout_2~tssbvgEJ.jpg\"","import { AtomicElements } from \"../atomicElement\"\r\nimport Layout1  from './elements/layout1'\r\nimport Layout2  from './elements/layout2'\r\nimport banner_layout_1 from \"./elements/banner_layout_1.jpg\"\r\nimport banner_layout_2 from \"./elements/banner_layout_2.jpg\"\r\n\r\nexport class HeadComponents extends AtomicElements {\r\n  constructor() {\r\n    super()\r\n  }\r\n\r\n  layout = [Layout1, Layout2]\r\n  layoutFootprint = [banner_layout_1, banner_layout_2]\r\n  // layoutRequirements = [\r\n  //   `{\r\n  //     'title'\r\n  //     'content'\r\n  //   }`,\r\n  //    `{\r\n  //     'title'\r\n  //     'content'\r\n  //   }`,\r\n  \r\n  // ]\r\n  //Methods heredados\r\n  // layout, layouts(), build() \r\n  //<texinput disable={!layout.img}>\r\n}","import { createTheme } from \"@mui/material/styles\";\r\n//import { COLOR_PRIMARY,COLOR_SECONDARY } from \"../../utils/constants\";\r\n\r\nconst COLOR_PRIMARY = '#4CAF50'\r\n\r\nconst COLOR_SECONDARY = '#FF5722'\r\n\r\nexport const Colors = {\r\n  // primary: \"#4CAF50\",\r\n  // secondary: \"#FF5722\",\r\n  contrastText: '#fff',\r\n  grayText: \"#8a8a8a\",\r\n  success: \"#00A650\",\r\n  info: \"#3483FA\",\r\n  danger: \"#B12704\",\r\n  warning: \"#FFC107\",\r\n  dark: \"#0e1b20\",\r\n  ligth: \"#aaa\",\r\n  muted: \"#abafb3\",\r\n  border: \"#DDDFE1\",\r\n  inverse: \"#2F3D4A\",\r\n  shaft: \"#333\",\r\n\r\n  ///////////////\r\n  // Greens \r\n  ///////////////\r\n  ligth_green: \"#9ad28a\",\r\n  ligth_green_default: \"#9ad29c\",\r\n  green_dark: \"#6fbf73\",  \r\n\r\n  // dim_gray:\"#487e4c\",\r\n  // body_bg: \"#81c784\",\r\n\r\n  /////////////////\r\n  // solid color\r\n  /////////////////\r\n  white: \"#fff\",\r\n  black: \"#000\",\r\n\r\n  //custom colors\r\n  prim: \"#292929\",\r\n  sec: \"#545454\",\r\n  sec_alt: \"#767676\",\r\n  hiden: \"#C8C8C8\",\r\n  green: \"#6fbf73\",\r\n\r\n  //footer colors\r\n  footer_backgound:\"#f4f4f4\"\r\n}\r\n\r\nconst theme = createTheme({\r\n  palette: {\r\n    primary: {\r\n      main: COLOR_PRIMARY,\r\n    },\r\n    secondary: {\r\n      main:  COLOR_SECONDARY,\r\n    },\r\n  },\r\n  components: {\r\n    // Name of the component\r\n    MuiButtonBase: {\r\n      defaultProps: {\r\n        disableRipple: true,\r\n      },\r\n    },\r\n    typography: {\r\n      button: {\r\n        textTransform: 'none'\r\n      }\r\n    },\r\n    MuiOutlinedInput:{\r\n      styleOverrides: {\r\n        // Name of the slot\r\n        root: {\r\n          // Some CSS\r\n          borderRadius: '90px'\r\n        },\r\n      },\r\n    },\r\n    MuiButton: {\r\n      styleOverrides: {\r\n        // Name of the slot\r\n        root: {\r\n          // Some CSS\r\n          borderRadius: '90px',\r\n          textTransform: 'initial'\r\n        },\r\n      },\r\n    },\r\n  },\r\n});\r\n\r\nexport default theme;","import { Button, Typography } from \"@mui/material\";\r\nimport { styled } from \"@mui/material/styles\";\r\nimport { Box, style } from \"@mui/material\";\r\nimport theme, { Colors } from \"../theme\";\r\n\r\nexport const BannerContainer = styled(Box)(({theme, json}) =>({\r\n  display: 'flex',\r\n  justifyContent: 'center',\r\n  heigth: '100%',\r\n  padding: '0px',\r\n  // [customAtt?.backgroundImg]:{\r\n  backgroundImage: `url(${json.backgroundImage})`,\r\n  backgroundPosition: '0% 20%',\r\n  backgroundSize: 'cover',\r\n  backgroundRepeat: 'no-repeat',\r\n  // },\r\n  // [customAtt?.backgroundColor]:{\r\n  //   backgroundColor: customAtt?.backgroundColor,\r\n  // },\r\n  [theme.breakpoints.down('sm')]: {\r\n    flexDirection: 'column',\r\n    alignItems: 'center'\r\n  },\r\n  [theme.breakpoints.down('md')]: {\r\n    flexDirection: 'column',\r\n    alignItems: 'center'\r\n  },\r\n\r\n}));\r\n\r\nexport const BannerImage = styled('img')(({src, theme})=>({\r\n  src: `url(${src})`,\r\n  width:'40%',\r\n  height: 'auto',\r\n  [theme.breakpoints.down('md')]:{\r\n    width:'70%',\r\n    height: 'auto',\r\n  },\r\n  [theme.breakpoints.down('sm')]:{\r\n    width:'90%',\r\n    height: 'auto',\r\n  }\r\n}))\r\n\r\nexport const BannerContent = styled(Box)(() =>({\r\n  display: 'flex',\r\n  flexDirection: 'column',\r\n  justifyContent: 'center',\r\n  maxWidth: 420,\r\n  padding: '30px',\r\n  color: Colors.contrastText,\r\n}))\r\n\r\nexport const BannerTittle = styled(Typography)(() =>({\r\n  lineHeigth: 1.5,\r\n  fontSize: '72px',\r\n  marginBottom: '20px',\r\n  color: Colors.contrastText,\r\n  [theme.breakpoints.down('sm')]:{\r\n    fontSize:'42px'\r\n  }\r\n}))\r\n\r\n\r\n\r\nexport const BannerDescription = styled(Typography)(({ theme })=>({\r\n  lineHeigth: 1.25,\r\n  letterSpacing: 1.25,\r\n  marginBottom: \"3em\",\r\n  [theme.breakpoints.down('md')]:{\r\n    lineHeigth:1.15,\r\n    letterSpacing: 1.15,\r\n    marginBottom: \"1.5em\",\r\n\r\n  }\r\n}))\r\n\r\n\r\nexport const BannerButton = styled(Button)(({ theme })=>({\r\n  color: Colors.white,\r\n  background: theme.palette.primary.main,\r\n  fontSize: '25px'\r\n    \r\n}))","import React from \"react\";\r\n\r\nimport { useTheme } from \"@mui/material/styles\";\r\nimport { BannerContainer, BannerContent, BannerDescription, BannerImage, BannerTittle, BannerButton } from \"../head/styles\";\r\n\r\nexport default function HeadContainer(props){\r\n\r\n  const theme = useTheme();\r\n\r\n  return(\r\n    <BannerContainer sx={{height:'680px'}} json={props.json}>\r\n      <BannerContent>\r\n        {props.children}\r\n      </BannerContent>\r\n    </BannerContainer>\r\n  );\r\n}","import React from \"react\"\r\nimport { BriefComponents } from \"./brief/Component\"\r\nimport { HeadComponents } from \"./head/Component\"\r\nimport HeadContainer from \"./canvas/HeadContainer\"\r\n// Section is a common class for each component\r\nexport class Section{\r\n    constructor(AtomicElement) {\r\n        this.child = AtomicElement\r\n      }\r\n    \r\n      component(json){\r\n        return(\r\n        <HeadContainer json={json}>\r\n          {/* Child is the instance passed as parameter in section, next class */}\r\n          {this.child.build(json, json.component.layout)}\r\n        </HeadContainer>\r\n        )\r\n      }\r\n\r\n      getFootPrint(layout){\r\n        \r\n        let img =  this.child.footprint(layout)\r\n        console.log('section', img)\r\n        return(\r\n          img\r\n        )\r\n      }\r\n\r\n      layoutLength(){\r\n        return(\r\n        this.child.layoutsLength()\r\n        )\r\n      }\r\n    \r\n}\r\n\r\n//Sections is the interface with admin and store\r\nexport class Sections{\r\n    constructor(){\r\n     this.head = new Section(new HeadComponents())  \r\n     this.brief = new Section(new BriefComponents())\r\n     this.sections = [this.head, this.brief] \r\n    }\r\n\r\n    getSectionList(){\r\n        return(\r\n            {\r\n                '0' : 'Header',\r\n                '1': 'Brief',\r\n            }\r\n        )\r\n    }\r\n    \r\n    getLayoutsFromSection(index){\r\n       let section = this.sections[index] \r\n       return(section)\r\n    }\r\n\r\n}"],"names":["AtomicElements","layout","layoutFootprint","_proto","prototype","layoutsLength","length","build","content","layoutId","footprint","img","console","log","Layout1","_content$","React","createElement","Grid","title","Card","BriefComponents","_AtomicElements","_inheritsLoose","_this","call","HeadComponents","Layout2","banner_layout_1","banner_layout_2","COLOR_PRIMARY","COLOR_SECONDARY","Colors","contrastText","grayText","success","info","danger","warning","dark","ligth","muted","border","inverse","shaft","ligth_green","ligth_green_default","green_dark","white","black","prim","sec","sec_alt","hiden","green","footer_backgound","theme","createTheme","palette","primary","main","secondary","components","MuiButtonBase","defaultProps","disableRipple","typography","button","textTransform","MuiOutlinedInput","styleOverrides","root","borderRadius","MuiButton","BannerContainer","styled","Box","_ref","_ref2","json","display","justifyContent","heigth","padding","backgroundImage","backgroundPosition","backgroundSize","backgroundRepeat","breakpoints","down","flexDirection","alignItems","BannerImage","_ref3","_ref4","src","width","height","BannerContent","maxWidth","color","BannerTittle","Typography","_ref5","lineHeigth","fontSize","marginBottom","BannerDescription","_ref6","_ref7","letterSpacing","BannerButton","Button","_ref8","background","HeadContainer","props","useTheme","sx","children","Section","AtomicElement","child","component","getFootPrint","layoutLength","Sections","head","brief","sections","_proto2","getSectionList","getLayoutsFromSection","index","section"],"mappings":"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"}
+{"version":3,"file":"index.js","sources":["../src/atomicElement.js","../src/brief/elements/layout1.js","../src/brief/Component.js","../src/theme/index.js","../src/banner/styles.js","../src/banner/elements/layout1.js","../src/banner/Component.js","../src/canvas/HeadContainer.js","../example/constants.js","../src/Section.js"],"sourcesContent":["export class AtomicElements {\r\n    constructor(){\r\n        this.layout = []\r\n        this.layoutFootprint = []\r\n    }\r\n\r\n    layoutsLength(){\r\n        return(\r\n            this.layout.length\r\n        )\r\n    }\r\n\r\n    build(content, layoutId){\r\n        return(\r\n            this.layout[layoutId](content)\r\n        )\r\n    }\r\n\r\n    footprint(layout){\r\n        let img = this.layoutFootprint[layout]\r\n        console.log('img atomic', img)\r\n        return(\r\n            img\r\n        )\r\n    }\r\n\r\n}\r\n","import { Card, CardContent, Grid } from \"@mui/material\"\r\nimport React from \"react\"\r\n\r\n\r\nexport default function Layout1(content){\r\n    return(\r\n        <Grid>\r\n           {content['0']?.title ? content['0'].title : ''}\r\n            <Card>\r\n                {/* <CardContent>\r\n                {content['0']?.title ? content['0'].title : 'placeholder'}\r\n                </CardContent> */}\r\n            </Card>\r\n        </Grid>\r\n    )\r\n}","import { AtomicElements } from \"../atomicElement\"\r\nimport Layout1  from './elements/layout1'\r\n\r\nexport class Brief extends AtomicElements {\r\n    constructor() {\r\n      super()\r\n    }\r\n    layout = [Layout1]\r\n    layoutFootprint = ['text_image_layout_1.png']\r\n    //Methods heredados\r\n    // layout, layouts(), build() \r\n    \r\n}","import { createTheme } from \"@mui/material/styles\";\r\n//import { COLOR_PRIMARY,COLOR_SECONDARY } from \"../../utils/constants\";\r\n\r\nconst COLOR_PRIMARY = '#4CAF50'\r\n\r\nconst COLOR_SECONDARY = '#FF5722'\r\n\r\nexport const Colors = {\r\n  // primary: \"#4CAF50\",\r\n  // secondary: \"#FF5722\",\r\n  contrastText: '#fff',\r\n  grayText: \"#8a8a8a\",\r\n  success: \"#00A650\",\r\n  info: \"#3483FA\",\r\n  danger: \"#B12704\",\r\n  warning: \"#FFC107\",\r\n  dark: \"#0e1b20\",\r\n  ligth: \"#aaa\",\r\n  muted: \"#abafb3\",\r\n  border: \"#DDDFE1\",\r\n  inverse: \"#2F3D4A\",\r\n  shaft: \"#333\",\r\n\r\n  ///////////////\r\n  // Greens \r\n  ///////////////\r\n  ligth_green: \"#9ad28a\",\r\n  ligth_green_default: \"#9ad29c\",\r\n  green_dark: \"#6fbf73\",  \r\n\r\n  // dim_gray:\"#487e4c\",\r\n  // body_bg: \"#81c784\",\r\n\r\n  /////////////////\r\n  // solid color\r\n  /////////////////\r\n  white: \"#fff\",\r\n  black: \"#000\",\r\n\r\n  //custom colors\r\n  prim: \"#292929\",\r\n  sec: \"#545454\",\r\n  sec_alt: \"#767676\",\r\n  hiden: \"#C8C8C8\",\r\n  green: \"#6fbf73\",\r\n\r\n  //footer colors\r\n  footer_backgound:\"#f4f4f4\"\r\n}\r\n\r\nconst theme = createTheme({\r\n  palette: {\r\n    primary: {\r\n      main: COLOR_PRIMARY,\r\n    },\r\n    secondary: {\r\n      main:  COLOR_SECONDARY,\r\n    },\r\n  },\r\n  components: {\r\n    // Name of the component\r\n    MuiButtonBase: {\r\n      defaultProps: {\r\n        disableRipple: true,\r\n      },\r\n    },\r\n    typography: {\r\n      button: {\r\n        textTransform: 'none'\r\n      }\r\n    },\r\n    MuiOutlinedInput:{\r\n      styleOverrides: {\r\n        // Name of the slot\r\n        root: {\r\n          // Some CSS\r\n          borderRadius: '90px'\r\n        },\r\n      },\r\n    },\r\n    MuiButton: {\r\n      styleOverrides: {\r\n        // Name of the slot\r\n        root: {\r\n          // Some CSS\r\n          borderRadius: '90px',\r\n          textTransform: 'initial'\r\n        },\r\n      },\r\n    },\r\n  },\r\n});\r\n\r\nexport default theme;","import { Button, Typography } from \"@mui/material\";\r\nimport { styled } from \"@mui/material/styles\";\r\nimport { Box, style } from \"@mui/material\";\r\nimport theme, { Colors } from \"../theme\";\r\n\r\nexport const BannerContainer = styled(Box)(({ theme, json }) => ({\r\n  display: 'flex',\r\n  justifyContent: 'right',\r\n  heigth: '100%',\r\n  padding: '32px',\r\n  backgroundColor:\r\n    json.component.bg_color1 && json.component.bg_type == 1\r\n      ? json.component.bg_color1\r\n      : null,\r\n  backgroundImage:\r\n    json.component.bg_image?.url && json.component.bg_type === 3\r\n      ? `url(${json.component.bg_image.url})`\r\n      : json.component.bg_image?.url && json.component.bg_type === 2\r\n      ? `linear-gradient(${json.component.bg_color1}, ${json.component.bg_color2})`\r\n      : 'none',\r\n  backgroundPosition: '0% 20%',\r\n  backgroundSize: 'cover',\r\n  backgroundRepeat: 'no-repeat',\r\n  [theme.breakpoints.down('sm')]: {\r\n    flexDirection: 'column',\r\n    alignItems: 'center'\r\n  },\r\n  [theme.breakpoints.down('md')]: {\r\n    flexDirection: 'column',\r\n    alignItems: 'center'\r\n  },\r\n}));\r\n\r\nexport const BannerImage = styled('img')(({ src, theme }) => ({\r\n  src: `url(${src})`,\r\n  width: '40%',\r\n  height: 'auto',\r\n  [theme.breakpoints.down('md')]: {\r\n    width: '70%',\r\n    height: 'auto',\r\n  },\r\n  [theme.breakpoints.down('sm')]: {\r\n    width: '90%',\r\n    height: 'auto',\r\n  }\r\n}))\r\n\r\n\r\nexport const BannerContent = styled(Box)(() => ({\r\n  display: 'flex',\r\n  flexDirection: 'column',\r\n  justifyContent: 'center',\r\n  width: '100%',\r\n  maxWidth: '30%',\r\n  padding: '30px',\r\n  color: Colors.contrastText,\r\n}))\r\n\r\n\r\nexport const BannerTittle = styled(Typography)(() => ({\r\n  lineHeigth: 1.5,\r\n  fontSize: '28px',\r\n  marginBottom: '20px',\r\n  color: Colors.contrastText,\r\n  [theme.breakpoints.down('sm')]: {\r\n    fontSize: '42px'\r\n  }\r\n}))\r\n\r\nexport const BannerSubtitle = styled(Typography)(() => ({\r\n  lineHeigth: 1.5,\r\n  fontSize: '24px',\r\n  marginBottom: '20px',\r\n  color: Colors.contrastText,\r\n  [theme.breakpoints.down('sm')]: {\r\n    fontSize: '42px'\r\n  }\r\n}))\r\n\r\nexport const BannerDescription = styled(Typography)(({ theme }) => ({\r\n  lineHeigth: 1.25,\r\n  fontSize: '22px',\r\n  letterSpacing: 1.25,\r\n  marginBottom: \"3em\",\r\n  [theme.breakpoints.down('md')]: {\r\n    lineHeigth: 1.15,\r\n    letterSpacing: 1.15,\r\n    marginBottom: \"1.5em\",\r\n\r\n  }\r\n}))\r\n\r\nexport const BannerButton = styled(Button)(({ theme }) => ({\r\n  color: Colors.white,\r\n  background: theme.palette.primary.main,\r\n  fontSize: '24px'\r\n}))","import { Box } from '@mui/material'\r\nimport React from 'react'\r\nimport { BannerTittle, BannerSubtitle, BannerDescription, BannerButton } from '../styles'\r\n\r\nexport default function Layout1(content) {\r\n  return (\r\n    <Box>\r\n      <BannerTittle>\r\n        {content.component.subcomponent[0].title ?\r\n          content.component.subcomponent[0].title\r\n          : 'Placeholder title'}\r\n      </BannerTittle>\r\n      <BannerSubtitle>\r\n        {content.component.subcomponent[0].subtitle ?\r\n          content.component.subcomponent[0].subtitle\r\n          : 'Placeholder subtitle'}\r\n      </BannerSubtitle>\r\n      <BannerDescription>\r\n        {content.component.subcomponent[0].description ?\r\n          content.component.subcomponent[0].description\r\n          : 'Placeholder description'}\r\n      </BannerDescription>\r\n      <BannerButton>\r\n        {content.component.subcomponent[0].button_title ?\r\n          content.component.subcomponent[0].button_title\r\n          : 'Placeholder button'}\r\n      </BannerButton>\r\n    </Box>\r\n  )\r\n}","import { AtomicElements } from \"../atomicElement\"\r\nimport Layout1  from './elements/layout1'\r\nimport Layout2  from './elements/layout2'\r\n\r\nexport class Banner extends AtomicElements {\r\n  constructor() {\r\n    super()\r\n  }\r\n\r\n  layout = [Layout1]\r\n  layoutFootprint = ['banner_layout_1.jpg']\r\n  // layoutRequirements = [\r\n  //   `{\r\n  //     'title'\r\n  //     'content'\r\n  //   }`,\r\n  //    `{\r\n  //     'title'\r\n  //     'content'\r\n  //     'name'\r\n  //   }`,\r\n  \r\n  // ]\r\n  //Methods heredados\r\n  // layout, layouts(), build() \r\n  // <texinput display={!layout.img} id='Title'>\r\n  // <texinput display={!layout.img} id='content'></texinput>\r\n  // <texinput display={!layout.img} id='name'></texinput>\r\n  //<texinput disable={!layout.img}>\r\n}","import React from \"react\";\r\n\r\nimport { useTheme } from \"@mui/material/styles\";\r\nimport { BannerContainer, BannerContent, BannerDescription, BannerImage, BannerTittle, BannerButton } from \"../banner/styles\";\r\n\r\nexport default function HeadContainer(props){\r\n// console.log(\"🚀 ~ file: HeadContainer.js:7 ~ HeadContainer ~ props:\", props.json.component.bg_image.url)\r\n\r\n  const theme = useTheme();\r\n\r\n  return(\r\n    <BannerContainer sx={{height:'680px'}} json={props.json}>\r\n      <BannerContent>\r\n        {props.children}\r\n      </BannerContent>\r\n    </BannerContainer>\r\n  );\r\n}","export const JK_RESOURCES = 'https://jk-clients.s3.us-east-2.amazonaws.com/jk-resources/'","import React from \"react\"\r\nimport { Brief } from \"./brief/Component\"\r\nimport { Banner } from \"./banner/Component\"\r\nimport HeadContainer from \"./canvas/HeadContainer\"\r\nimport { JK_RESOURCES } from \"../example/constants\"\r\n// Section is a common class for each component\r\nexport class Section{\r\n    constructor(AtomicElement) {\r\n        this.child = AtomicElement\r\n      }\r\n    \r\n      component(json){\r\n        console.log('json', json)\r\n        return(\r\n        <HeadContainer json={json}>\r\n          {/* Child is the instance passed as parameter in section, next class */}\r\n          {this.child.build(json, json.component.layout)}\r\n        </HeadContainer>\r\n        )\r\n      }\r\n\r\n      getFootPrint(layout){\r\n        let img =  this.child.footprint(layout)\r\n        console.log('section', img)\r\n        return(\r\n          `${JK_RESOURCES}${img}`\r\n        )\r\n      }\r\n\r\n      layoutLength(){\r\n        return(\r\n        this.child.layoutsLength()\r\n        )\r\n      }\r\n    \r\n}\r\n\r\n//Sections is the interface with admin and store\r\nexport class Sections{\r\n    constructor(){\r\n     this.banner = new Section(new Banner())  \r\n     this.brief = new Section(new Brief())\r\n     this.sections = [this.banner, this.brief] \r\n    }\r\n\r\n    getSectionList(){\r\n        return(\r\n            {\r\n                '0': 'Banner',\r\n                '1': 'Brief',\r\n                '2': 'Quotes'\r\n            }\r\n        )\r\n    }\r\n    \r\n    getLayoutsFromSection(index){\r\n       let section = this.sections[index] \r\n       return(section)\r\n    }\r\n\r\n}"],"names":["AtomicElements","layout","layoutFootprint","_proto","prototype","layoutsLength","length","build","content","layoutId","footprint","img","console","log","Layout1","_content$","React","createElement","Grid","title","Card","Brief","_AtomicElements","_inheritsLoose","_this","call","COLOR_PRIMARY","COLOR_SECONDARY","Colors","contrastText","grayText","success","info","danger","warning","dark","ligth","muted","border","inverse","shaft","ligth_green","ligth_green_default","green_dark","white","black","prim","sec","sec_alt","hiden","green","footer_backgound","theme","createTheme","palette","primary","main","secondary","components","MuiButtonBase","defaultProps","disableRipple","typography","button","textTransform","MuiOutlinedInput","styleOverrides","root","borderRadius","MuiButton","BannerContainer","styled","Box","_ref","_json$component$bg_im","_json$component$bg_im2","_ref2","json","display","justifyContent","heigth","padding","backgroundColor","component","bg_color1","bg_type","backgroundImage","bg_image","url","bg_color2","backgroundPosition","backgroundSize","backgroundRepeat","breakpoints","down","flexDirection","alignItems","BannerImage","_ref3","_ref4","src","width","height","BannerContent","maxWidth","color","BannerTittle","Typography","_ref5","lineHeigth","fontSize","marginBottom","BannerSubtitle","_ref6","BannerDescription","_ref7","_ref8","letterSpacing","BannerButton","Button","_ref9","background","subcomponent","subtitle","description","button_title","Banner","HeadContainer","props","useTheme","sx","children","JK_RESOURCES","Section","AtomicElement","child","getFootPrint","layoutLength","Sections","banner","brief","sections","_proto2","getSectionList","getLayoutsFromSection","index","section"],"mappings":"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"}

package/dist/index.modern.js

@@ -27,8 +27,8 @@ var AtomicElements = /*#__PURE__*/function () {
   _proto.build = function build(content, layoutId) {
     return this.layout[layoutId](content);
   };
-  _proto.footprint = function footprint(layoutId) {
-    var img = this.layoutFootprint[layoutId];
+  _proto.footprint = function footprint(layout) {
+    var img = this.layoutFootprint[layout];
     console.log('img atomic', img);
     return img;
   };
@@ -37,44 +37,19 @@ var AtomicElements = /*#__PURE__*/function () {
 
 function Layout1(content) {
   var _content$;
-  return /*#__PURE__*/React.createElement(Grid, null, (_content$ = content['0']) !== null && _content$ !== void 0 && _content$.title ? content['0'].title : 'placeholder', /*#__PURE__*/React.createElement(Card, null));
+  return /*#__PURE__*/React.createElement(Grid, null, (_content$ = content['0']) !== null && _content$ !== void 0 && _content$.title ? content['0'].title : '', /*#__PURE__*/React.createElement(Card, null));
 }
 
-var BriefComponents = /*#__PURE__*/function (_AtomicElements) {
-  _inheritsLoose(BriefComponents, _AtomicElements);
-  function BriefComponents() {
+var Brief = /*#__PURE__*/function (_AtomicElements) {
+  _inheritsLoose(Brief, _AtomicElements);
+  function Brief() {
     var _this;
     _this = _AtomicElements.call(this) || this;
     _this.layout = [Layout1];
+    _this.layoutFootprint = ['text_image_layout_1.png'];
     return _this;
   }
-  return BriefComponents;
-}(AtomicElements);
-
-function Layout1$1(content) {
-  var _content$;
-  return /*#__PURE__*/React.createElement(Grid, null, (_content$ = content['0']) !== null && _content$ !== void 0 && _content$.title ? content['0'].title : 'placeholder', /*#__PURE__*/React.createElement(Card, null));
-}
-
-function Layout1$2(content) {
-  var _content$;
-  return /*#__PURE__*/React.createElement(Grid, null, (_content$ = content['0']) !== null && _content$ !== void 0 && _content$.title ? content['0'].title : 'placeholder', /*#__PURE__*/React.createElement(Card, null));
-}
-
-var banner_layout_1 = "banner_layout_1~tssbvgEJ.jpg";
-
-var banner_layout_2 = "banner_layout_2~tssbvgEJ.jpg";
-
-var HeadComponents = /*#__PURE__*/function (_AtomicElements) {
-  _inheritsLoose(HeadComponents, _AtomicElements);
-  function HeadComponents() {
-    var _this;
-    _this = _AtomicElements.call(this) || this;
-    _this.layout = [Layout1$1, Layout1$2];
-    _this.layoutFootprint = [banner_layout_1, banner_layout_2];
-    return _this;
-  }
-  return HeadComponents;
+  return Brief;
 }(AtomicElements);
 
 var COLOR_PRIMARY = '#4CAF50';
@@ -143,15 +118,16 @@ var theme = createTheme({
 });
 
 var BannerContainer = styled(Box)(function (_ref) {
-  var _ref2;
+  var _json$component$bg_im, _json$component$bg_im2, _ref2;
   var theme = _ref.theme,
     json = _ref.json;
   return _ref2 = {
     display: 'flex',
-    justifyContent: 'center',
+    justifyContent: 'right',
     heigth: '100%',
-    padding: '0px',
-    backgroundImage: "url(" + json.backgroundImage + ")",
+    padding: '32px',
+    backgroundColor: json.component.bg_color1 && json.component.bg_type == 1 ? json.component.bg_color1 : null,
+    backgroundImage: (_json$component$bg_im = json.component.bg_image) !== null && _json$component$bg_im !== void 0 && _json$component$bg_im.url && json.component.bg_type === 3 ? "url(" + json.component.bg_image.url + ")" : (_json$component$bg_im2 = json.component.bg_image) !== null && _json$component$bg_im2 !== void 0 && _json$component$bg_im2.url && json.component.bg_type === 2 ? "linear-gradient(" + json.component.bg_color1 + ", " + json.component.bg_color2 + ")" : 'none',
     backgroundPosition: '0% 20%',
     backgroundSize: 'cover',
     backgroundRepeat: 'no-repeat'
@@ -184,7 +160,8 @@ var BannerContent = styled(Box)(function () {
     display: 'flex',
     flexDirection: 'column',
     justifyContent: 'center',
-    maxWidth: 420,
+    width: '100%',
+    maxWidth: '30%',
     padding: '30px',
     color: Colors.contrastText
   };
@@ -193,35 +170,63 @@ var BannerTittle = styled(Typography)(function () {
   var _ref5;
   return _ref5 = {
     lineHeigth: 1.5,
-    fontSize: '72px',
+    fontSize: '28px',
     marginBottom: '20px',
     color: Colors.contrastText
   }, _ref5[theme.breakpoints.down('sm')] = {
     fontSize: '42px'
   }, _ref5;
 });
-var BannerDescription = styled(Typography)(function (_ref6) {
-  var _ref7;
-  var theme = _ref6.theme;
-  return _ref7 = {
+var BannerSubtitle = styled(Typography)(function () {
+  var _ref6;
+  return _ref6 = {
+    lineHeigth: 1.5,
+    fontSize: '24px',
+    marginBottom: '20px',
+    color: Colors.contrastText
+  }, _ref6[theme.breakpoints.down('sm')] = {
+    fontSize: '42px'
+  }, _ref6;
+});
+var BannerDescription = styled(Typography)(function (_ref7) {
+  var _ref8;
+  var theme = _ref7.theme;
+  return _ref8 = {
     lineHeigth: 1.25,
+    fontSize: '22px',
     letterSpacing: 1.25,
     marginBottom: "3em"
-  }, _ref7[theme.breakpoints.down('md')] = {
+  }, _ref8[theme.breakpoints.down('md')] = {
     lineHeigth: 1.15,
     letterSpacing: 1.15,
     marginBottom: "1.5em"
-  }, _ref7;
+  }, _ref8;
 });
-var BannerButton = styled(Button)(function (_ref8) {
-  var theme = _ref8.theme;
+var BannerButton = styled(Button)(function (_ref9) {
+  var theme = _ref9.theme;
   return {
     color: Colors.white,
     background: theme.palette.primary.main,
-    fontSize: '25px'
+    fontSize: '24px'
   };
 });
 
+function Layout1$1(content) {
+  return /*#__PURE__*/React.createElement(Box, null, /*#__PURE__*/React.createElement(BannerTittle, null, content.component.subcomponent[0].title ? content.component.subcomponent[0].title : 'Placeholder title'), /*#__PURE__*/React.createElement(BannerSubtitle, null, content.component.subcomponent[0].subtitle ? content.component.subcomponent[0].subtitle : 'Placeholder subtitle'), /*#__PURE__*/React.createElement(BannerDescription, null, content.component.subcomponent[0].description ? content.component.subcomponent[0].description : 'Placeholder description'), /*#__PURE__*/React.createElement(BannerButton, null, content.component.subcomponent[0].button_title ? content.component.subcomponent[0].button_title : 'Placeholder button'));
+}
+
+var Banner = /*#__PURE__*/function (_AtomicElements) {
+  _inheritsLoose(Banner, _AtomicElements);
+  function Banner() {
+    var _this;
+    _this = _AtomicElements.call(this) || this;
+    _this.layout = [Layout1$1];
+    _this.layoutFootprint = ['banner_layout_1.jpg'];
+    return _this;
+  }
+  return Banner;
+}(AtomicElements);
+
 function HeadContainer(props) {
   var theme = useTheme();
   return /*#__PURE__*/React.createElement(BannerContainer, {
@@ -232,12 +237,15 @@ function HeadContainer(props) {
   }, /*#__PURE__*/React.createElement(BannerContent, null, props.children));
 }
 
+var JK_RESOURCES = 'https://jk-clients.s3.us-east-2.amazonaws.com/jk-resources/';
+
 var Section = /*#__PURE__*/function () {
   function Section(AtomicElement) {
     this.child = AtomicElement;
   }
   var _proto = Section.prototype;
   _proto.component = function component(json) {
+    console.log('json', json);
     return /*#__PURE__*/React.createElement(HeadContainer, {
       json: json
     }, this.child.build(json, json.component.layout));
@@ -245,7 +253,7 @@ var Section = /*#__PURE__*/function () {
   _proto.getFootPrint = function getFootPrint(layout) {
     var img = this.child.footprint(layout);
     console.log('section', img);
-    return img;
+    return "" + JK_RESOURCES + img;
   };
   _proto.layoutLength = function layoutLength() {
     return this.child.layoutsLength();
@@ -254,15 +262,16 @@ var Section = /*#__PURE__*/function () {
 }();
 var Sections = /*#__PURE__*/function () {
   function Sections() {
-    this.head = new Section(new HeadComponents());
-    this.brief = new Section(new BriefComponents());
-    this.sections = [this.head, this.brief];
+    this.banner = new Section(new Banner());
+    this.brief = new Section(new Brief());
+    this.sections = [this.banner, this.brief];
   }
   var _proto2 = Sections.prototype;
   _proto2.getSectionList = function getSectionList() {
     return {
-      '0': 'Header',
-      '1': 'Brief'
+      '0': 'Banner',
+      '1': 'Brief',
+      '2': 'Quotes'
     };
   };
   _proto2.getLayoutsFromSection = function getLayoutsFromSection(index) {

package/dist/index.modern.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.modern.js","sources":["../src/atomicElement.js","../src/brief/elements/layout1.js","../src/brief/Component.js","../src/head/elements/layout1.js","../src/head/elements/layout2.js","../src/head/elements/banner_layout_1.jpg","../src/head/elements/banner_layout_2.jpg","../src/head/Component.js","../src/theme/index.js","../src/head/styles.js","../src/canvas/HeadContainer.js","../src/Section.js"],"sourcesContent":["export class AtomicElements {\r\n    constructor(){\r\n        this.layout = []\r\n        this.layoutFootprint = []\r\n    }\r\n\r\n    layoutsLength(){\r\n        return(\r\n            this.layout.length\r\n        )\r\n    }\r\n\r\n    build(content, layoutId){\r\n        return(\r\n            this.layout[layoutId](content)\r\n        )\r\n    }\r\n\r\n    footprint(layoutId){\r\n        let img = this.layoutFootprint[layoutId]\r\n        console.log('img atomic', img)\r\n        return(\r\n            img\r\n        )\r\n    }\r\n\r\n}\r\n","import { Card, CardContent, Grid } from \"@mui/material\"\r\nimport React from \"react\"\r\n\r\n\r\nexport default function Layout1(content){\r\n    return(\r\n        <Grid>\r\n           {content['0']?.title ? content['0'].title : 'placeholder'}\r\n            <Card>\r\n                {/* <CardContent>\r\n                {content['0']?.title ? content['0'].title : 'placeholder'}\r\n                </CardContent> */}\r\n            </Card>\r\n        </Grid>\r\n    )\r\n}","import { AtomicElements } from \"../atomicElement\"\r\nimport Layout1  from './elements/layout1'\r\n\r\nexport class BriefComponents extends AtomicElements {\r\n    constructor() {\r\n      super()\r\n    }\r\n    layout = [Layout1]\r\n\r\n    //Methods heredados\r\n    // layout, layouts(), build() \r\n    \r\n}","import { Card, CardContent, Grid } from \"@mui/material\"\r\nimport React from \"react\"\r\n\r\n\r\nexport default function Layout1(content){\r\n    return(\r\n        <Grid>\r\n            {content['0']?.title ? content['0'].title : 'placeholder'}\r\n            <Card>\r\n                {/* <CardContent>\r\n                {content['0']?.title ? content['0'].title : 'placeholder'}\r\n                </CardContent> */}\r\n            </Card>\r\n        </Grid>\r\n    )\r\n}","import { Card, CardContent, Grid } from \"@mui/material\"\r\nimport React from \"react\"\r\n\r\n\r\nexport default function Layout1(content){\r\n    return(\r\n        <Grid>\r\n            {content['0']?.title ? content['0'].title : 'placeholder'}\r\n            <Card>\r\n                {/* <CardContent>\r\n                {content['0']?.title ? content['0'].title : 'placeholder'}\r\n                </CardContent> */}\r\n            </Card>\r\n        </Grid>\r\n    )\r\n}","/* loaded by smart-asset */\nexport default \"banner_layout_1~tssbvgEJ.jpg\"","/* loaded by smart-asset */\nexport default \"banner_layout_2~tssbvgEJ.jpg\"","import { AtomicElements } from \"../atomicElement\"\r\nimport Layout1  from './elements/layout1'\r\nimport Layout2  from './elements/layout2'\r\nimport banner_layout_1 from \"./elements/banner_layout_1.jpg\"\r\nimport banner_layout_2 from \"./elements/banner_layout_2.jpg\"\r\n\r\nexport class HeadComponents extends AtomicElements {\r\n  constructor() {\r\n    super()\r\n  }\r\n\r\n  layout = [Layout1, Layout2]\r\n  layoutFootprint = [banner_layout_1, banner_layout_2]\r\n  // layoutRequirements = [\r\n  //   `{\r\n  //     'title'\r\n  //     'content'\r\n  //   }`,\r\n  //    `{\r\n  //     'title'\r\n  //     'content'\r\n  //   }`,\r\n  \r\n  // ]\r\n  //Methods heredados\r\n  // layout, layouts(), build() \r\n  //<texinput disable={!layout.img}>\r\n}","import { createTheme } from \"@mui/material/styles\";\r\n//import { COLOR_PRIMARY,COLOR_SECONDARY } from \"../../utils/constants\";\r\n\r\nconst COLOR_PRIMARY = '#4CAF50'\r\n\r\nconst COLOR_SECONDARY = '#FF5722'\r\n\r\nexport const Colors = {\r\n  // primary: \"#4CAF50\",\r\n  // secondary: \"#FF5722\",\r\n  contrastText: '#fff',\r\n  grayText: \"#8a8a8a\",\r\n  success: \"#00A650\",\r\n  info: \"#3483FA\",\r\n  danger: \"#B12704\",\r\n  warning: \"#FFC107\",\r\n  dark: \"#0e1b20\",\r\n  ligth: \"#aaa\",\r\n  muted: \"#abafb3\",\r\n  border: \"#DDDFE1\",\r\n  inverse: \"#2F3D4A\",\r\n  shaft: \"#333\",\r\n\r\n  ///////////////\r\n  // Greens \r\n  ///////////////\r\n  ligth_green: \"#9ad28a\",\r\n  ligth_green_default: \"#9ad29c\",\r\n  green_dark: \"#6fbf73\",  \r\n\r\n  // dim_gray:\"#487e4c\",\r\n  // body_bg: \"#81c784\",\r\n\r\n  /////////////////\r\n  // solid color\r\n  /////////////////\r\n  white: \"#fff\",\r\n  black: \"#000\",\r\n\r\n  //custom colors\r\n  prim: \"#292929\",\r\n  sec: \"#545454\",\r\n  sec_alt: \"#767676\",\r\n  hiden: \"#C8C8C8\",\r\n  green: \"#6fbf73\",\r\n\r\n  //footer colors\r\n  footer_backgound:\"#f4f4f4\"\r\n}\r\n\r\nconst theme = createTheme({\r\n  palette: {\r\n    primary: {\r\n      main: COLOR_PRIMARY,\r\n    },\r\n    secondary: {\r\n      main:  COLOR_SECONDARY,\r\n    },\r\n  },\r\n  components: {\r\n    // Name of the component\r\n    MuiButtonBase: {\r\n      defaultProps: {\r\n        disableRipple: true,\r\n      },\r\n    },\r\n    typography: {\r\n      button: {\r\n        textTransform: 'none'\r\n      }\r\n    },\r\n    MuiOutlinedInput:{\r\n      styleOverrides: {\r\n        // Name of the slot\r\n        root: {\r\n          // Some CSS\r\n          borderRadius: '90px'\r\n        },\r\n      },\r\n    },\r\n    MuiButton: {\r\n      styleOverrides: {\r\n        // Name of the slot\r\n        root: {\r\n          // Some CSS\r\n          borderRadius: '90px',\r\n          textTransform: 'initial'\r\n        },\r\n      },\r\n    },\r\n  },\r\n});\r\n\r\nexport default theme;","import { Button, Typography } from \"@mui/material\";\r\nimport { styled } from \"@mui/material/styles\";\r\nimport { Box, style } from \"@mui/material\";\r\nimport theme, { Colors } from \"../theme\";\r\n\r\nexport const BannerContainer = styled(Box)(({theme, json}) =>({\r\n  display: 'flex',\r\n  justifyContent: 'center',\r\n  heigth: '100%',\r\n  padding: '0px',\r\n  // [customAtt?.backgroundImg]:{\r\n  backgroundImage: `url(${json.backgroundImage})`,\r\n  backgroundPosition: '0% 20%',\r\n  backgroundSize: 'cover',\r\n  backgroundRepeat: 'no-repeat',\r\n  // },\r\n  // [customAtt?.backgroundColor]:{\r\n  //   backgroundColor: customAtt?.backgroundColor,\r\n  // },\r\n  [theme.breakpoints.down('sm')]: {\r\n    flexDirection: 'column',\r\n    alignItems: 'center'\r\n  },\r\n  [theme.breakpoints.down('md')]: {\r\n    flexDirection: 'column',\r\n    alignItems: 'center'\r\n  },\r\n\r\n}));\r\n\r\nexport const BannerImage = styled('img')(({src, theme})=>({\r\n  src: `url(${src})`,\r\n  width:'40%',\r\n  height: 'auto',\r\n  [theme.breakpoints.down('md')]:{\r\n    width:'70%',\r\n    height: 'auto',\r\n  },\r\n  [theme.breakpoints.down('sm')]:{\r\n    width:'90%',\r\n    height: 'auto',\r\n  }\r\n}))\r\n\r\nexport const BannerContent = styled(Box)(() =>({\r\n  display: 'flex',\r\n  flexDirection: 'column',\r\n  justifyContent: 'center',\r\n  maxWidth: 420,\r\n  padding: '30px',\r\n  color: Colors.contrastText,\r\n}))\r\n\r\nexport const BannerTittle = styled(Typography)(() =>({\r\n  lineHeigth: 1.5,\r\n  fontSize: '72px',\r\n  marginBottom: '20px',\r\n  color: Colors.contrastText,\r\n  [theme.breakpoints.down('sm')]:{\r\n    fontSize:'42px'\r\n  }\r\n}))\r\n\r\n\r\n\r\nexport const BannerDescription = styled(Typography)(({ theme })=>({\r\n  lineHeigth: 1.25,\r\n  letterSpacing: 1.25,\r\n  marginBottom: \"3em\",\r\n  [theme.breakpoints.down('md')]:{\r\n    lineHeigth:1.15,\r\n    letterSpacing: 1.15,\r\n    marginBottom: \"1.5em\",\r\n\r\n  }\r\n}))\r\n\r\n\r\nexport const BannerButton = styled(Button)(({ theme })=>({\r\n  color: Colors.white,\r\n  background: theme.palette.primary.main,\r\n  fontSize: '25px'\r\n    \r\n}))","import React from \"react\";\r\n\r\nimport { useTheme } from \"@mui/material/styles\";\r\nimport { BannerContainer, BannerContent, BannerDescription, BannerImage, BannerTittle, BannerButton } from \"../head/styles\";\r\n\r\nexport default function HeadContainer(props){\r\n\r\n  const theme = useTheme();\r\n\r\n  return(\r\n    <BannerContainer sx={{height:'680px'}} json={props.json}>\r\n      <BannerContent>\r\n        {props.children}\r\n      </BannerContent>\r\n    </BannerContainer>\r\n  );\r\n}","import React from \"react\"\r\nimport { BriefComponents } from \"./brief/Component\"\r\nimport { HeadComponents } from \"./head/Component\"\r\nimport HeadContainer from \"./canvas/HeadContainer\"\r\n// Section is a common class for each component\r\nexport class Section{\r\n    constructor(AtomicElement) {\r\n        this.child = AtomicElement\r\n      }\r\n    \r\n      component(json){\r\n        return(\r\n        <HeadContainer json={json}>\r\n          {/* Child is the instance passed as parameter in section, next class */}\r\n          {this.child.build(json, json.component.layout)}\r\n        </HeadContainer>\r\n        )\r\n      }\r\n\r\n      getFootPrint(layout){\r\n        \r\n        let img =  this.child.footprint(layout)\r\n        console.log('section', img)\r\n        return(\r\n          img\r\n        )\r\n      }\r\n\r\n      layoutLength(){\r\n        return(\r\n        this.child.layoutsLength()\r\n        )\r\n      }\r\n    \r\n}\r\n\r\n//Sections is the interface with admin and store\r\nexport class Sections{\r\n    constructor(){\r\n     this.head = new Section(new HeadComponents())  \r\n     this.brief = new Section(new BriefComponents())\r\n     this.sections = [this.head, this.brief] \r\n    }\r\n\r\n    getSectionList(){\r\n        return(\r\n            {\r\n                '0' : 'Header',\r\n                '1': 'Brief',\r\n            }\r\n        )\r\n    }\r\n    \r\n    getLayoutsFromSection(index){\r\n       let section = this.sections[index] \r\n       return(section)\r\n    }\r\n\r\n}"],"names":["AtomicElements","layout","layoutFootprint","_proto","prototype","layoutsLength","length","build","content","layoutId","footprint","img","console","log","Layout1","_content$","React","createElement","Grid","title","Card","BriefComponents","_AtomicElements","_inheritsLoose","_this","call","HeadComponents","Layout2","banner_layout_1","banner_layout_2","COLOR_PRIMARY","COLOR_SECONDARY","Colors","contrastText","grayText","success","info","danger","warning","dark","ligth","muted","border","inverse","shaft","ligth_green","ligth_green_default","green_dark","white","black","prim","sec","sec_alt","hiden","green","footer_backgound","theme","createTheme","palette","primary","main","secondary","components","MuiButtonBase","defaultProps","disableRipple","typography","button","textTransform","MuiOutlinedInput","styleOverrides","root","borderRadius","MuiButton","BannerContainer","styled","Box","_ref","_ref2","json","display","justifyContent","heigth","padding","backgroundImage","backgroundPosition","backgroundSize","backgroundRepeat","breakpoints","down","flexDirection","alignItems","BannerImage","_ref3","_ref4","src","width","height","BannerContent","maxWidth","color","BannerTittle","Typography","_ref5","lineHeigth","fontSize","marginBottom","BannerDescription","_ref6","_ref7","letterSpacing","BannerButton","Button","_ref8","background","HeadContainer","props","useTheme","sx","children","Section","AtomicElement","child","component","getFootPrint","layoutLength","Sections","head","brief","sections","_proto2","getSectionList","getLayoutsFromSection","index","section"],"mappings":"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"}
+{"version":3,"file":"index.modern.js","sources":["../src/atomicElement.js","../src/brief/elements/layout1.js","../src/brief/Component.js","../src/theme/index.js","../src/banner/styles.js","../src/banner/elements/layout1.js","../src/banner/Component.js","../src/canvas/HeadContainer.js","../example/constants.js","../src/Section.js"],"sourcesContent":["export class AtomicElements {\r\n    constructor(){\r\n        this.layout = []\r\n        this.layoutFootprint = []\r\n    }\r\n\r\n    layoutsLength(){\r\n        return(\r\n            this.layout.length\r\n        )\r\n    }\r\n\r\n    build(content, layoutId){\r\n        return(\r\n            this.layout[layoutId](content)\r\n        )\r\n    }\r\n\r\n    footprint(layout){\r\n        let img = this.layoutFootprint[layout]\r\n        console.log('img atomic', img)\r\n        return(\r\n            img\r\n        )\r\n    }\r\n\r\n}\r\n","import { Card, CardContent, Grid } from \"@mui/material\"\r\nimport React from \"react\"\r\n\r\n\r\nexport default function Layout1(content){\r\n    return(\r\n        <Grid>\r\n           {content['0']?.title ? content['0'].title : ''}\r\n            <Card>\r\n                {/* <CardContent>\r\n                {content['0']?.title ? content['0'].title : 'placeholder'}\r\n                </CardContent> */}\r\n            </Card>\r\n        </Grid>\r\n    )\r\n}","import { AtomicElements } from \"../atomicElement\"\r\nimport Layout1  from './elements/layout1'\r\n\r\nexport class Brief extends AtomicElements {\r\n    constructor() {\r\n      super()\r\n    }\r\n    layout = [Layout1]\r\n    layoutFootprint = ['text_image_layout_1.png']\r\n    //Methods heredados\r\n    // layout, layouts(), build() \r\n    \r\n}","import { createTheme } from \"@mui/material/styles\";\r\n//import { COLOR_PRIMARY,COLOR_SECONDARY } from \"../../utils/constants\";\r\n\r\nconst COLOR_PRIMARY = '#4CAF50'\r\n\r\nconst COLOR_SECONDARY = '#FF5722'\r\n\r\nexport const Colors = {\r\n  // primary: \"#4CAF50\",\r\n  // secondary: \"#FF5722\",\r\n  contrastText: '#fff',\r\n  grayText: \"#8a8a8a\",\r\n  success: \"#00A650\",\r\n  info: \"#3483FA\",\r\n  danger: \"#B12704\",\r\n  warning: \"#FFC107\",\r\n  dark: \"#0e1b20\",\r\n  ligth: \"#aaa\",\r\n  muted: \"#abafb3\",\r\n  border: \"#DDDFE1\",\r\n  inverse: \"#2F3D4A\",\r\n  shaft: \"#333\",\r\n\r\n  ///////////////\r\n  // Greens \r\n  ///////////////\r\n  ligth_green: \"#9ad28a\",\r\n  ligth_green_default: \"#9ad29c\",\r\n  green_dark: \"#6fbf73\",  \r\n\r\n  // dim_gray:\"#487e4c\",\r\n  // body_bg: \"#81c784\",\r\n\r\n  /////////////////\r\n  // solid color\r\n  /////////////////\r\n  white: \"#fff\",\r\n  black: \"#000\",\r\n\r\n  //custom colors\r\n  prim: \"#292929\",\r\n  sec: \"#545454\",\r\n  sec_alt: \"#767676\",\r\n  hiden: \"#C8C8C8\",\r\n  green: \"#6fbf73\",\r\n\r\n  //footer colors\r\n  footer_backgound:\"#f4f4f4\"\r\n}\r\n\r\nconst theme = createTheme({\r\n  palette: {\r\n    primary: {\r\n      main: COLOR_PRIMARY,\r\n    },\r\n    secondary: {\r\n      main:  COLOR_SECONDARY,\r\n    },\r\n  },\r\n  components: {\r\n    // Name of the component\r\n    MuiButtonBase: {\r\n      defaultProps: {\r\n        disableRipple: true,\r\n      },\r\n    },\r\n    typography: {\r\n      button: {\r\n        textTransform: 'none'\r\n      }\r\n    },\r\n    MuiOutlinedInput:{\r\n      styleOverrides: {\r\n        // Name of the slot\r\n        root: {\r\n          // Some CSS\r\n          borderRadius: '90px'\r\n        },\r\n      },\r\n    },\r\n    MuiButton: {\r\n      styleOverrides: {\r\n        // Name of the slot\r\n        root: {\r\n          // Some CSS\r\n          borderRadius: '90px',\r\n          textTransform: 'initial'\r\n        },\r\n      },\r\n    },\r\n  },\r\n});\r\n\r\nexport default theme;","import { Button, Typography } from \"@mui/material\";\r\nimport { styled } from \"@mui/material/styles\";\r\nimport { Box, style } from \"@mui/material\";\r\nimport theme, { Colors } from \"../theme\";\r\n\r\nexport const BannerContainer = styled(Box)(({ theme, json }) => ({\r\n  display: 'flex',\r\n  justifyContent: 'right',\r\n  heigth: '100%',\r\n  padding: '32px',\r\n  backgroundColor:\r\n    json.component.bg_color1 && json.component.bg_type == 1\r\n      ? json.component.bg_color1\r\n      : null,\r\n  backgroundImage:\r\n    json.component.bg_image?.url && json.component.bg_type === 3\r\n      ? `url(${json.component.bg_image.url})`\r\n      : json.component.bg_image?.url && json.component.bg_type === 2\r\n      ? `linear-gradient(${json.component.bg_color1}, ${json.component.bg_color2})`\r\n      : 'none',\r\n  backgroundPosition: '0% 20%',\r\n  backgroundSize: 'cover',\r\n  backgroundRepeat: 'no-repeat',\r\n  [theme.breakpoints.down('sm')]: {\r\n    flexDirection: 'column',\r\n    alignItems: 'center'\r\n  },\r\n  [theme.breakpoints.down('md')]: {\r\n    flexDirection: 'column',\r\n    alignItems: 'center'\r\n  },\r\n}));\r\n\r\nexport const BannerImage = styled('img')(({ src, theme }) => ({\r\n  src: `url(${src})`,\r\n  width: '40%',\r\n  height: 'auto',\r\n  [theme.breakpoints.down('md')]: {\r\n    width: '70%',\r\n    height: 'auto',\r\n  },\r\n  [theme.breakpoints.down('sm')]: {\r\n    width: '90%',\r\n    height: 'auto',\r\n  }\r\n}))\r\n\r\n\r\nexport const BannerContent = styled(Box)(() => ({\r\n  display: 'flex',\r\n  flexDirection: 'column',\r\n  justifyContent: 'center',\r\n  width: '100%',\r\n  maxWidth: '30%',\r\n  padding: '30px',\r\n  color: Colors.contrastText,\r\n}))\r\n\r\n\r\nexport const BannerTittle = styled(Typography)(() => ({\r\n  lineHeigth: 1.5,\r\n  fontSize: '28px',\r\n  marginBottom: '20px',\r\n  color: Colors.contrastText,\r\n  [theme.breakpoints.down('sm')]: {\r\n    fontSize: '42px'\r\n  }\r\n}))\r\n\r\nexport const BannerSubtitle = styled(Typography)(() => ({\r\n  lineHeigth: 1.5,\r\n  fontSize: '24px',\r\n  marginBottom: '20px',\r\n  color: Colors.contrastText,\r\n  [theme.breakpoints.down('sm')]: {\r\n    fontSize: '42px'\r\n  }\r\n}))\r\n\r\nexport const BannerDescription = styled(Typography)(({ theme }) => ({\r\n  lineHeigth: 1.25,\r\n  fontSize: '22px',\r\n  letterSpacing: 1.25,\r\n  marginBottom: \"3em\",\r\n  [theme.breakpoints.down('md')]: {\r\n    lineHeigth: 1.15,\r\n    letterSpacing: 1.15,\r\n    marginBottom: \"1.5em\",\r\n\r\n  }\r\n}))\r\n\r\nexport const BannerButton = styled(Button)(({ theme }) => ({\r\n  color: Colors.white,\r\n  background: theme.palette.primary.main,\r\n  fontSize: '24px'\r\n}))","import { Box } from '@mui/material'\r\nimport React from 'react'\r\nimport { BannerTittle, BannerSubtitle, BannerDescription, BannerButton } from '../styles'\r\n\r\nexport default function Layout1(content) {\r\n  return (\r\n    <Box>\r\n      <BannerTittle>\r\n        {content.component.subcomponent[0].title ?\r\n          content.component.subcomponent[0].title\r\n          : 'Placeholder title'}\r\n      </BannerTittle>\r\n      <BannerSubtitle>\r\n        {content.component.subcomponent[0].subtitle ?\r\n          content.component.subcomponent[0].subtitle\r\n          : 'Placeholder subtitle'}\r\n      </BannerSubtitle>\r\n      <BannerDescription>\r\n        {content.component.subcomponent[0].description ?\r\n          content.component.subcomponent[0].description\r\n          : 'Placeholder description'}\r\n      </BannerDescription>\r\n      <BannerButton>\r\n        {content.component.subcomponent[0].button_title ?\r\n          content.component.subcomponent[0].button_title\r\n          : 'Placeholder button'}\r\n      </BannerButton>\r\n    </Box>\r\n  )\r\n}","import { AtomicElements } from \"../atomicElement\"\r\nimport Layout1  from './elements/layout1'\r\nimport Layout2  from './elements/layout2'\r\n\r\nexport class Banner extends AtomicElements {\r\n  constructor() {\r\n    super()\r\n  }\r\n\r\n  layout = [Layout1]\r\n  layoutFootprint = ['banner_layout_1.jpg']\r\n  // layoutRequirements = [\r\n  //   `{\r\n  //     'title'\r\n  //     'content'\r\n  //   }`,\r\n  //    `{\r\n  //     'title'\r\n  //     'content'\r\n  //     'name'\r\n  //   }`,\r\n  \r\n  // ]\r\n  //Methods heredados\r\n  // layout, layouts(), build() \r\n  // <texinput display={!layout.img} id='Title'>\r\n  // <texinput display={!layout.img} id='content'></texinput>\r\n  // <texinput display={!layout.img} id='name'></texinput>\r\n  //<texinput disable={!layout.img}>\r\n}","import React from \"react\";\r\n\r\nimport { useTheme } from \"@mui/material/styles\";\r\nimport { BannerContainer, BannerContent, BannerDescription, BannerImage, BannerTittle, BannerButton } from \"../banner/styles\";\r\n\r\nexport default function HeadContainer(props){\r\n// console.log(\"🚀 ~ file: HeadContainer.js:7 ~ HeadContainer ~ props:\", props.json.component.bg_image.url)\r\n\r\n  const theme = useTheme();\r\n\r\n  return(\r\n    <BannerContainer sx={{height:'680px'}} json={props.json}>\r\n      <BannerContent>\r\n        {props.children}\r\n      </BannerContent>\r\n    </BannerContainer>\r\n  );\r\n}","export const JK_RESOURCES = 'https://jk-clients.s3.us-east-2.amazonaws.com/jk-resources/'","import React from \"react\"\r\nimport { Brief } from \"./brief/Component\"\r\nimport { Banner } from \"./banner/Component\"\r\nimport HeadContainer from \"./canvas/HeadContainer\"\r\nimport { JK_RESOURCES } from \"../example/constants\"\r\n// Section is a common class for each component\r\nexport class Section{\r\n    constructor(AtomicElement) {\r\n        this.child = AtomicElement\r\n      }\r\n    \r\n      component(json){\r\n        console.log('json', json)\r\n        return(\r\n        <HeadContainer json={json}>\r\n          {/* Child is the instance passed as parameter in section, next class */}\r\n          {this.child.build(json, json.component.layout)}\r\n        </HeadContainer>\r\n        )\r\n      }\r\n\r\n      getFootPrint(layout){\r\n        let img =  this.child.footprint(layout)\r\n        console.log('section', img)\r\n        return(\r\n          `${JK_RESOURCES}${img}`\r\n        )\r\n      }\r\n\r\n      layoutLength(){\r\n        return(\r\n        this.child.layoutsLength()\r\n        )\r\n      }\r\n    \r\n}\r\n\r\n//Sections is the interface with admin and store\r\nexport class Sections{\r\n    constructor(){\r\n     this.banner = new Section(new Banner())  \r\n     this.brief = new Section(new Brief())\r\n     this.sections = [this.banner, this.brief] \r\n    }\r\n\r\n    getSectionList(){\r\n        return(\r\n            {\r\n                '0': 'Banner',\r\n                '1': 'Brief',\r\n                '2': 'Quotes'\r\n            }\r\n        )\r\n    }\r\n    \r\n    getLayoutsFromSection(index){\r\n       let section = this.sections[index] \r\n       return(section)\r\n    }\r\n\r\n}"],"names":["AtomicElements","layout","layoutFootprint","_proto","prototype","layoutsLength","length","build","content","layoutId","footprint","img","console","log","Layout1","_content$","React","createElement","Grid","title","Card","Brief","_AtomicElements","_inheritsLoose","_this","call","COLOR_PRIMARY","COLOR_SECONDARY","Colors","contrastText","grayText","success","info","danger","warning","dark","ligth","muted","border","inverse","shaft","ligth_green","ligth_green_default","green_dark","white","black","prim","sec","sec_alt","hiden","green","footer_backgound","theme","createTheme","palette","primary","main","secondary","components","MuiButtonBase","defaultProps","disableRipple","typography","button","textTransform","MuiOutlinedInput","styleOverrides","root","borderRadius","MuiButton","BannerContainer","styled","Box","_ref","_json$component$bg_im","_json$component$bg_im2","_ref2","json","display","justifyContent","heigth","padding","backgroundColor","component","bg_color1","bg_type","backgroundImage","bg_image","url","bg_color2","backgroundPosition","backgroundSize","backgroundRepeat","breakpoints","down","flexDirection","alignItems","BannerImage","_ref3","_ref4","src","width","height","BannerContent","maxWidth","color","BannerTittle","Typography","_ref5","lineHeigth","fontSize","marginBottom","BannerSubtitle","_ref6","BannerDescription","_ref7","_ref8","letterSpacing","BannerButton","Button","_ref9","background","subcomponent","subtitle","description","button_title","Banner","HeadContainer","props","useTheme","sx","children","JK_RESOURCES","Section","AtomicElement","child","getFootPrint","layoutLength","Sections","banner","brief","sections","_proto2","getSectionList","getLayoutsFromSection","index","section"],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "keski_lib_catalog",
-  "version": "1.0.5",
+  "version": "1.0.7",
   "description": "Keski catalog components for Keski store, Codenation Studio",
   "author": "Francisco Marmolejo",
   "license": "",

package/dist/index.css

@@ -1,9 +0,0 @@
-/* add css module styles here (optional) */
-
-._styles-module__test__3ybTi {
-  margin: 2em;
-  padding: 0.5em;
-  border: 2px solid #000;
-  font-size: 2em;
-  text-align: center;
-}