keski_lib_catalog 1.3.1 → 1.3.3

package/dist/index.js

@@ -4,6 +4,7 @@ var React = require('react');
 var React__default = _interopDefault(React);
 var Carousel = _interopDefault(require('react-material-ui-carousel'));
 var material = require('@mui/material');
+var Avatar = _interopDefault(require('@mui/material/Avatar'));
 var styles = require('@mui/material/styles');
 var Paper = _interopDefault(require('@mui/material/Paper'));
 var Grid = _interopDefault(require('@mui/material/Grid'));
@@ -121,22 +122,27 @@ function Item(props) {
       color: content.text_color,
       alignItems: getSideRender(side)
     }
-  }, /*#__PURE__*/React__default.createElement(material.Box, {
-    component: "img",
-    src: content.image ? content.image.url : "https://cdn-icons-png.flaticon.com/512/6596/6596121.png",
+  }, /*#__PURE__*/React__default.createElement(Avatar, {
+    src: content.image ? content.image.url : "none",
     sx: {
       width: '120px',
       height: '120px',
-      marginBottom: '16px',
-      borderRadius: '50%'
+      bgcolor: "black",
+      marginBottom: '16px'
     }
   }), /*#__PURE__*/React__default.createElement(material.Box, {
     sx: {
       width: {
         xs: "100%",
-        xl: "90%",
-        lg: "90%"
-      }
+        xl: "72%",
+        lg: "72%"
+      },
+      height: "100%",
+      overflow: 'hidden',
+      textOverflow: 'ellipsis',
+      display: '-webkit-box',
+      WebkitLineClamp: 7,
+      WebkitBoxOrient: 'vertical'
     }
   }, /*#__PURE__*/React__default.createElement(material.Typography, {
     dangerouslySetInnerHTML: {
@@ -147,14 +153,14 @@ function Item(props) {
       fontSize: {
         xl: '1.75em',
         lg: '1.75em',
-        md: '1.5em',
+        md: '1.75em',
         sm: '1.5em',
         xs: '1.5em'
       }
     }
-  }), /*#__PURE__*/React__default.createElement(material.Typography, {
+  })), /*#__PURE__*/React__default.createElement(material.Typography, {
     dangerouslySetInnerHTML: {
-      __html: content.subtitle ? content.subtitle : 'Agregue subtítulo'
+      __html: content.title ? content.title : 'Agregue subtítulo'
     },
     sx: {
       marginBottom: '16px',
@@ -166,7 +172,7 @@ function Item(props) {
         xs: '1.125em'
       }
     }
-  })), content.label_active && /*#__PURE__*/React__default.createElement(material.Box, null, /*#__PURE__*/React__default.createElement(material.Chip, {
+  }), content.label_active && /*#__PURE__*/React__default.createElement(material.Box, null, /*#__PURE__*/React__default.createElement(material.Chip, {
     disabled: true,
     color: "info",
     label: content.label ? content.label : 'Agregue etiqueta',
@@ -188,7 +194,7 @@ var Quotes = /*#__PURE__*/function (_AtomicElements) {
     _this.layoutFootprint = ['quotes_layout_1.png'];
     _this.layoutFootprintReq = [{
       'type': 1,
-      'subtitle': 'Subtitle',
+      'title': 'Tittle',
       'description': 'Description',
       'label': 'Label',
       'label_color': 'Label color',
@@ -201,7 +207,7 @@ var Quotes = /*#__PURE__*/function (_AtomicElements) {
 }(AtomicElements);
 
 function Layout1$1(content) {
-  var _content$component$su, _content$component$su2, _content$component$su3, _content$component$su4, _content$component$su5, _content$component$su6, _content$component$su7, _content$component$su8, _content$component$su9, _content$component$su10, _content$component$su11, _content$component$su12, _content$component$su13, _content$component$su14, _content$component$su15, _content$component$su16;
+  var _content$component$su, _content$component$su2, _content$component$su3, _content$component$su4, _content$component$su5, _content$component$su6, _content$component$su7, _content$component$su8, _content$component$su9, _content$component$su10, _content$component$su11, _content$component$su12, _content$component$su13, _content$component$su14, _content$component$su15, _content$component$su16, _content$component$su17;
   var visible = true;
   return /*#__PURE__*/React__default.createElement(material.Slide, {
     direction: "left",
@@ -227,30 +233,46 @@ function Layout1$1(content) {
       flexDirection: 'column',
       width: {
         xs: '100%',
-        md: '90%',
-        lg: '80%'
+        md: '80%',
+        lg: '70%'
       },
       height: {
         xs: '80vh',
         lg: '80vh'
       },
       justifyContent: 'center',
-      paddingLeft: content.component.bg_type === 3 ? '24px' : '0px',
-      color: (_content$component$su3 = content.component.subcomponent[0]) === null || _content$component$su3 === void 0 ? void 0 : _content$component$su3.text_color
+      paddingLeft: (_content$component$su3 = content.component.subcomponent[0]) !== null && _content$component$su3 !== void 0 && _content$component$su3.image ? {
+        lg: "24px",
+        md: "24px",
+        sm: "16px",
+        xs: "16px"
+      } : {
+        lg: "0px",
+        md: "24px",
+        sm: "16px",
+        xs: "16px"
+      },
+      paddingRight: {
+        lg: "24px",
+        md: "24px",
+        sm: "16px",
+        xs: "16px"
+      },
+      color: (_content$component$su4 = content.component.subcomponent[0]) === null || _content$component$su4 === void 0 ? void 0 : _content$component$su4.text_color
     }
-  }, ((_content$component$su4 = content.component.subcomponent[0]) === null || _content$component$su4 === void 0 ? void 0 : _content$component$su4.label_active) && /*#__PURE__*/React__default.createElement(material.Box, null, /*#__PURE__*/React__default.createElement(material.Chip, {
+  }, ((_content$component$su5 = content.component.subcomponent[0]) === null || _content$component$su5 === void 0 ? void 0 : _content$component$su5.label_active) && /*#__PURE__*/React__default.createElement(material.Box, null, /*#__PURE__*/React__default.createElement(material.Chip, {
     disabled: true,
     color: "info",
-    label: (_content$component$su5 = content.component.subcomponent[0]) !== null && _content$component$su5 !== void 0 && _content$component$su5.label ? (_content$component$su6 = content.component.subcomponent[0]) === null || _content$component$su6 === void 0 ? void 0 : _content$component$su6.label : 'Agregue etiqueta',
+    label: (_content$component$su6 = content.component.subcomponent[0]) !== null && _content$component$su6 !== void 0 && _content$component$su6.label ? (_content$component$su7 = content.component.subcomponent[0]) === null || _content$component$su7 === void 0 ? void 0 : _content$component$su7.label : 'Agregue etiqueta',
     sx: {
       marginBottom: '16px',
       fontSize: '1em',
       borderRadius: '6px',
-      backgroundColor: (_content$component$su7 = content.component.subcomponent[0]) === null || _content$component$su7 === void 0 ? void 0 : _content$component$su7.label_color
+      backgroundColor: (_content$component$su8 = content.component.subcomponent[0]) === null || _content$component$su8 === void 0 ? void 0 : _content$component$su8.label_color
     }
   })), /*#__PURE__*/React__default.createElement(material.Typography, {
     dangerouslySetInnerHTML: {
-      __html: (_content$component$su8 = content.component.subcomponent[0]) !== null && _content$component$su8 !== void 0 && _content$component$su8.title ? (_content$component$su9 = content.component.subcomponent[0]) === null || _content$component$su9 === void 0 ? void 0 : _content$component$su9.title : 'Agregue titulo'
+      __html: (_content$component$su9 = content.component.subcomponent[0]) !== null && _content$component$su9 !== void 0 && _content$component$su9.title ? (_content$component$su10 = content.component.subcomponent[0]) === null || _content$component$su10 === void 0 ? void 0 : _content$component$su10.title : 'Agregue titulo'
     },
     sx: {
       marginBottom: '16px',
@@ -258,7 +280,7 @@ function Layout1$1(content) {
       fontSize: {
         xs: "2em",
         sm: "2em",
-        md: "2em",
+        md: "3.75em",
         lg: "3.75em",
         xl: "3.75em"
       },
@@ -266,7 +288,7 @@ function Layout1$1(content) {
     }
   }), /*#__PURE__*/React__default.createElement(material.Typography, {
     dangerouslySetInnerHTML: {
-      __html: (_content$component$su10 = content.component.subcomponent[0]) !== null && _content$component$su10 !== void 0 && _content$component$su10.description ? (_content$component$su11 = content.component.subcomponent[0]) === null || _content$component$su11 === void 0 ? void 0 : _content$component$su11.description : 'Agregue descripción'
+      __html: (_content$component$su11 = content.component.subcomponent[0]) !== null && _content$component$su11 !== void 0 && _content$component$su11.description ? (_content$component$su12 = content.component.subcomponent[0]) === null || _content$component$su12 === void 0 ? void 0 : _content$component$su12.description : 'Agregue descripción'
     },
     sx: {
       marginBottom: '16px',
@@ -279,18 +301,18 @@ function Layout1$1(content) {
         xl: "1.125em"
       }
     }
-  }), ((_content$component$su12 = content.component.subcomponent[0]) === null || _content$component$su12 === void 0 ? void 0 : _content$component$su12.button_active) && /*#__PURE__*/React__default.createElement(material.Box, null, /*#__PURE__*/React__default.createElement(material.Button, {
+  }), ((_content$component$su13 = content.component.subcomponent[0]) === null || _content$component$su13 === void 0 ? void 0 : _content$component$su13.button_active) && /*#__PURE__*/React__default.createElement(material.Box, null, /*#__PURE__*/React__default.createElement(material.Button, {
     variant: "contained",
     size: "medium",
     color: "primary",
-    href: (_content$component$su13 = content.component.subcomponent[0]) === null || _content$component$su13 === void 0 ? void 0 : _content$component$su13.button_action,
-    target: ((_content$component$su14 = content.component.subcomponent[0]) === null || _content$component$su14 === void 0 ? void 0 : _content$component$su14.link) == 4 ? '_blank' : '_self',
+    href: (_content$component$su14 = content.component.subcomponent[0]) === null || _content$component$su14 === void 0 ? void 0 : _content$component$su14.button_action,
+    target: ((_content$component$su15 = content.component.subcomponent[0]) === null || _content$component$su15 === void 0 ? void 0 : _content$component$su15.link) == 4 ? '_blank' : '_self',
     sx: {
       width: 'auto',
       padding: '14px 40px',
       borderRadius: '50px'
     }
-  }, (_content$component$su15 = content.component.subcomponent[0]) !== null && _content$component$su15 !== void 0 && _content$component$su15.button_title ? (_content$component$su16 = content.component.subcomponent[0]) === null || _content$component$su16 === void 0 ? void 0 : _content$component$su16.button_title : 'Nombre botón')))));
+  }, (_content$component$su16 = content.component.subcomponent[0]) !== null && _content$component$su16 !== void 0 && _content$component$su16.button_title ? (_content$component$su17 = content.component.subcomponent[0]) === null || _content$component$su17 === void 0 ? void 0 : _content$component$su17.button_title : 'Nombre botón')))));
 }
 
 var Banner = /*#__PURE__*/function (_AtomicElements) {
@@ -333,33 +355,16 @@ function Layout1$2(content) {
     item: true,
     xs: 12,
     sm: 12,
-    md: 6,
-    lg: 6,
-    xl: 6,
-    sx: {
-      paddingLeft: {
-        xl: "16px",
-        lg: "16px",
-        md: "16px",
-        sm: "0px",
-        xs: "0px"
-      },
-      paddingRight: {
-        xl: "16px",
-        lg: "16px",
-        md: "16px",
-        sm: "0px",
-        xs: "0px"
-      },
-      paddingTop: "10px"
-    }
+    md: 5.5,
+    lg: 5.5,
+    xl: 5.5
   }, /*#__PURE__*/React__default.createElement(material.Slide, {
     direction: "right",
     "in": visible
   }, /*#__PURE__*/React__default.createElement(Item$1, {
     elevation: 0,
     sx: {
-      height: "90%",
+      height: "100%",
       width: "100%",
       background: "none"
     }
@@ -384,26 +389,24 @@ function Layout1$2(content) {
     item: true,
     xs: 12,
     sm: 12,
-    md: 6,
-    lg: 6,
-    xl: 6,
+    md: 1,
+    lg: 1,
+    xl: 1
+  }, /*#__PURE__*/React__default.createElement(Item$1, {
+    elevation: 0,
     sx: {
-      paddingLeft: {
-        xl: "16px",
-        lg: "16px",
-        md: "16px",
-        sm: "0px",
-        xs: "0px"
-      },
-      paddingRight: {
-        xl: "16px",
-        lg: "16px",
-        md: "16px",
-        sm: "0px",
-        xs: "0px"
-      },
-      paddingTop: "10px"
+      height: "100%",
+      width: "100%",
+      background: "none",
+      paddingTop: "48px"
     }
+  })), /*#__PURE__*/React__default.createElement(Grid, {
+    item: true,
+    xs: 12,
+    sm: 12,
+    md: 5.5,
+    lg: 5.5,
+    xl: 5.5
   }, /*#__PURE__*/React__default.createElement(Grow, _extends({
     "in": visible,
     style: {
@@ -414,7 +417,7 @@ function Layout1$2(content) {
   } ), /*#__PURE__*/React__default.createElement(Item$1, {
     elevation: 0,
     sx: {
-      height: "90%",
+      height: "100%",
       width: "100%",
       background: "none"
     }
@@ -460,8 +463,8 @@ function Layout1$2(content) {
         xs: "1.125em",
         sm: "1.125em",
         md: "1.125em",
-        lg: "1em",
-        xl: "1em"
+        lg: "1.125em",
+        xl: "1.125em"
       }
     }
   })), ((_content$component$su15 = content.component.subcomponent[0]) === null || _content$component$su15 === void 0 ? void 0 : _content$component$su15.button_active) && /*#__PURE__*/React__default.createElement(material.Box, null, /*#__PURE__*/React__default.createElement(material.Button, {
@@ -530,24 +533,18 @@ function Layout1$3(content) {
       whiteSpace: 'pre-wrap',
       fontSize: {
         xs: "1.875em",
-        sm: "1.875em",
-        md: "2.25em",
+        sm: "2.25em",
+        md: "3em",
         lg: "3em",
         xl: "3em"
-      }
+      },
+      paddingBottom: "32px"
     }
   }), /*#__PURE__*/React__default.createElement(material.Grid, {
     container: true,
     spacing: 2,
     alignItems: "center",
-    justifyContent: "center",
-    direction: {
-      xl: "row",
-      lg: "row",
-      md: "row",
-      sm: "column",
-      xs: "column"
-    }
+    justifyContent: "center"
   }, (_content$component$su3 = content.component.subcomponent) === null || _content$component$su3 === void 0 ? void 0 : _content$component$su3.map(function (img, index) {
     return /*#__PURE__*/React__default.createElement(material.Grid, {
       key: index,
@@ -560,40 +557,22 @@ function Layout1$3(content) {
     }, /*#__PURE__*/React__default.createElement(material.Card, {
       elevation: 0,
       sx: {
-        borderRadius: '50px',
-        width: {
-          xl: '350px',
-          lg: '350px',
-          md: '450px',
-          sm: '700px',
-          xs: '250px'
-        },
+        borderRadius: '24px',
+        width: "100%",
         height: {
-          xl: '350px',
-          lg: '350px',
-          md: '450px',
-          sm: '700px',
-          xs: '250px'
+          xl: 350,
+          lg: 350,
+          md: 350,
+          sm: 700,
+          xs: 250
         }
       }
     }, /*#__PURE__*/React__default.createElement(material.CardMedia, {
       sx: {
-        width: {
-          xl: '350px',
-          lg: '350px',
-          md: '450px',
-          sm: '700px',
-          xs: '250px'
-        },
-        height: {
-          xl: '350px',
-          lg: '350px',
-          md: '450px',
-          sm: '700px',
-          xs: '250px'
-        }
+        width: "100%",
+        height: "100%"
       },
-      image: img.image.url ? img.image.url : 'https://wozapps-develop.s3.us-east-2.amazonaws.com/gerry/resources/landing/bbb84144-02cd-4cf8-a1be-21ba47e7c4fa.jpeg'
+      image: img.image.url ? img.image.url : 'none'
     })));
   }))));
 }
@@ -638,8 +617,8 @@ function Layout1$4(content) {
       whiteSpace: 'pre-wrap',
       fontSize: {
         xs: "1.875em",
-        sm: "1.875em",
-        md: "2.25em",
+        sm: "2.25em",
+        md: "3em",
         lg: "3em",
         xl: "3em"
       },
@@ -647,7 +626,13 @@ function Layout1$4(content) {
     }
   }), /*#__PURE__*/React__default.createElement(material.Box, {
     sx: {
-      width: content.component.justify_content == "center" ? "100%" : "80%"
+      width: content.component.justify_content == "center" ? "100%" : {
+        xl: "70%",
+        lg: "72%",
+        md: "84%",
+        sm: "100%",
+        xs: "100%"
+      }
     }
   }, /*#__PURE__*/React__default.createElement(material.Typography, {
     dangerouslySetInnerHTML: {
@@ -659,7 +644,7 @@ function Layout1$4(content) {
       fontSize: {
         xs: "1em",
         sm: "1em",
-        md: "1em",
+        md: "1.125em",
         lg: "1.125em",
         xl: "1.125em"
       }
@@ -1244,9 +1229,9 @@ function CanvasContainer(props) {
           lg: '24px',
           xl: '24px'
         } : {
-          xs: '24px',
+          xs: '16px',
           md: '24px',
-          sm: '24px',
+          sm: '16px',
           lg: '24px',
           xl: '24px'
         },
@@ -1257,9 +1242,9 @@ function CanvasContainer(props) {
           lg: '24px',
           xl: '24px'
         } : {
-          xs: '24px',
+          xs: '16px',
           md: '24px',
-          sm: '24px',
+          sm: '16px',
           lg: '24px',
           xl: '24px'
         }