keski_lib_catalog 1.4.3 → 1.5.0

package/dist/index.js

@@ -5,10 +5,10 @@ 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'));
 var Grow = _interopDefault(require('@mui/material/Grow'));
+var Paper = _interopDefault(require('@mui/material/Paper'));
+var styles = require('@mui/material/styles');
 var Lottie = _interopDefault(require('react-lottie'));
 
 function _extends() {
@@ -77,13 +77,13 @@ function Layout1(content) {
     sx: {
       whiteSpace: 'pre-wrap',
       fontSize: {
-        xs: "1.875em",
-        sm: "2.25em",
-        md: "3em",
-        lg: "3em",
-        xl: "3em"
+        xs: '1.875em',
+        sm: '2.25em',
+        md: '3em',
+        lg: '3em',
+        xl: '3em'
       },
-      paddingBottom: "32px"
+      paddingBottom: '32px'
     }
   }), /*#__PURE__*/React__default.createElement(Carousel, {
     indicators: true,
@@ -161,16 +161,16 @@ function Item(props) {
     sx: {
       width: '120px',
       height: '120px',
-      transform: "translate(\n                " + content.image_transform_x + "%\n                ,\n                " + content.image_transform_y + "%)" + ("scale(" + (content.image_scale ? content.image_scale : "1") + ")")
+      transform: "translate(\n                " + content.image_transform_x + "%\n                ,\n                " + content.image_transform_y + "%)" + ("scale(" + (content.image_scale ? content.image_scale : '1') + ")")
     }
   }))), /*#__PURE__*/React__default.createElement(material.Box, {
     sx: {
       width: {
-        xs: "100%",
-        xl: "72%",
-        lg: "72%"
+        xs: '100%',
+        xl: '72%',
+        lg: '72%'
       },
-      height: "100%",
+      height: '100%',
       overflow: 'hidden',
       textOverflow: 'ellipsis',
       display: '-webkit-box',
@@ -256,9 +256,9 @@ function Layout1$1(content) {
         xs: '100%'
       },
       height: {
-        xs: '80vh',
-        sm: "80vh",
-        md: "80vh"
+        xs: '90vh',
+        sm: '50vh',
+        md: '95vh'
       },
       backgroundSize: 'cover',
       backgroundPosition: 'center',
@@ -280,21 +280,21 @@ function Layout1$1(content) {
       },
       justifyContent: 'center',
       paddingLeft: (_content$component$su = content.component.subcomponent[0]) !== null && _content$component$su !== void 0 && _content$component$su.image ? {
-        lg: "24px",
-        md: "24px",
-        sm: "16px",
-        xs: "16px"
+        lg: '24px',
+        md: '24px',
+        sm: '16px',
+        xs: '16px'
       } : {
-        lg: "0px",
-        md: "24px",
-        sm: "16px",
-        xs: "16px"
+        lg: '0px',
+        md: '24px',
+        sm: '16px',
+        xs: '16px'
       },
       paddingRight: {
-        lg: "24px",
-        md: "24px",
-        sm: "16px",
-        xs: "16px"
+        lg: '24px',
+        md: '24px',
+        sm: '16px',
+        xs: '16px'
       }
     }
   }, ((_content$component$su2 = content.component.subcomponent[0]) === null || _content$component$su2 === void 0 ? void 0 : _content$component$su2.label_active) && /*#__PURE__*/React__default.createElement(material.Box, null, /*#__PURE__*/React__default.createElement(material.Chip, {
@@ -316,13 +316,13 @@ function Layout1$1(content) {
       marginBottom: '16px',
       whiteSpace: 'pre-wrap',
       fontSize: {
-        xs: "2em",
-        sm: "2em",
-        md: "3.75em",
-        lg: "3.75em",
-        xl: "3.75em"
+        xs: '2em',
+        sm: '2em',
+        md: '3.75em',
+        lg: '3.75em',
+        xl: '3.75em'
       },
-      fontWeight: "bold"
+      fontWeight: 'bold'
     }
   }), /*#__PURE__*/React__default.createElement(material.Typography, {
     component: 'p',
@@ -333,11 +333,11 @@ function Layout1$1(content) {
       marginBottom: '16px',
       whiteSpace: 'pre-wrap',
       fontSize: {
-        xs: "1.125em",
-        sm: "1.125em",
-        md: "1.125em",
-        lg: "1.125em",
-        xl: "1.125em"
+        xs: '1.125em',
+        sm: '1.125em',
+        md: '1.125em',
+        lg: '1.125em',
+        xl: '1.125em'
       }
     }
   }), ((_content$component$su10 = content.component.subcomponent[0]) === null || _content$component$su10 === void 0 ? void 0 : _content$component$su10.button_active) && /*#__PURE__*/React__default.createElement(material.Box, null, /*#__PURE__*/React__default.createElement(material.Button, {
@@ -387,7 +387,8 @@ function Layout1$2(content) {
   return /*#__PURE__*/React__default.createElement(Grid, {
     container: true,
     alignItems: "center",
-    direction: content.component.justify_content != 'right' ? 'row' : 'row-reverse'
+    direction: content.component.justify_content != 'right' ? 'row' : 'row-reverse',
+    mt: 10
   }, /*#__PURE__*/React__default.createElement(Grid, {
     item: true,
     xs: 12,
@@ -401,25 +402,25 @@ function Layout1$2(content) {
   }, /*#__PURE__*/React__default.createElement(Item$1, {
     elevation: 0,
     sx: {
-      height: "100%",
-      width: "100%",
-      background: "none"
+      height: '100%',
+      width: '100%',
+      background: 'none'
     }
   }, /*#__PURE__*/React__default.createElement(material.Card, {
     elevation: 0,
     sx: {
-      borderRadius: "24px",
-      background: "none",
+      borderRadius: '24px',
+      background: 'none',
       backgroundSize: 'center',
       backgroundPosition: 'center'
     }
   }, /*#__PURE__*/React__default.createElement(material.CardMedia, {
     component: "img",
     sx: {
-      width: "100%",
+      width: '100%',
       backgroundSize: 'center',
       backgroundPosition: 'center',
-      transform: "translate(\n                        " + ((_content$component$su = content.component.subcomponent[0]) === null || _content$component$su === void 0 ? void 0 : _content$component$su.image_transform_x) + "%\n                        ,\n                        " + ((_content$component$su2 = content.component.subcomponent[0]) === null || _content$component$su2 === void 0 ? void 0 : _content$component$su2.image_transform_y) + "%)" + ("scale(" + ((_content$component$su3 = content.component.subcomponent[0]) !== null && _content$component$su3 !== void 0 && _content$component$su3.image_scale ? (_content$component$su4 = content.component.subcomponent[0]) === null || _content$component$su4 === void 0 ? void 0 : _content$component$su4.image_scale : "1") + ")")
+      transform: "translate(\n                        " + ((_content$component$su = content.component.subcomponent[0]) === null || _content$component$su === void 0 ? void 0 : _content$component$su.image_transform_x) + "%\n                        ,\n                        " + ((_content$component$su2 = content.component.subcomponent[0]) === null || _content$component$su2 === void 0 ? void 0 : _content$component$su2.image_transform_y) + "%)" + ("scale(" + ((_content$component$su3 = content.component.subcomponent[0]) !== null && _content$component$su3 !== void 0 && _content$component$su3.image_scale ? (_content$component$su4 = content.component.subcomponent[0]) === null || _content$component$su4 === void 0 ? void 0 : _content$component$su4.image_scale : '1') + ")")
     },
     alt: (_content$component$su5 = content.component.subcomponent[0]) !== null && _content$component$su5 !== void 0 && _content$component$su5.title ? (_content$component$su6 = content.component.subcomponent[0]) === null || _content$component$su6 === void 0 ? void 0 : _content$component$su6.title : 'imagen Keski',
     image: (_content$component$su7 = content.component.subcomponent[0]) !== null && _content$component$su7 !== void 0 && _content$component$su7.image ? (_content$component$su8 = content.component.subcomponent[0]) === null || _content$component$su8 === void 0 ? void 0 : _content$component$su8.image.url : 'none'
@@ -433,10 +434,10 @@ function Layout1$2(content) {
   }, /*#__PURE__*/React__default.createElement(Item$1, {
     elevation: 0,
     sx: {
-      height: "100%",
-      width: "100%",
-      background: "none",
-      paddingTop: "48px"
+      height: '100%',
+      width: '100%',
+      background: 'none',
+      paddingTop: '48px'
     }
   })), /*#__PURE__*/React__default.createElement(Grid, {
     item: true,
@@ -455,9 +456,9 @@ function Layout1$2(content) {
   } ), /*#__PURE__*/React__default.createElement(Item$1, {
     elevation: 0,
     sx: {
-      height: "100%",
-      width: "100%",
-      background: "none"
+      height: '100%',
+      width: '100%',
+      background: 'none'
     }
   }, /*#__PURE__*/React__default.createElement(material.Box, null, ((_content$component$su9 = content.component.subcomponent[0]) === null || _content$component$su9 === void 0 ? void 0 : _content$component$su9.label_active) && /*#__PURE__*/React__default.createElement(material.Box, null, /*#__PURE__*/React__default.createElement(material.Chip, {
     disabled: true,
@@ -481,11 +482,11 @@ function Layout1$2(content) {
     sx: {
       whiteSpace: 'pre-wrap',
       fontSize: {
-        xs: "2em",
-        sm: "2em",
-        md: "2em",
-        lg: "2em",
-        xl: "2em"
+        xs: '2em',
+        sm: '2em',
+        md: '2em',
+        lg: '2em',
+        xl: '2em'
       }
     }
   })), /*#__PURE__*/React__default.createElement(material.Box, {
@@ -500,11 +501,11 @@ function Layout1$2(content) {
     sx: {
       whiteSpace: 'pre-wrap',
       fontSize: {
-        xs: "1.125em",
-        sm: "1.125em",
-        md: "1.125em",
-        lg: "1.125em",
-        xl: "1.125em"
+        xs: '1.125em',
+        sm: '1.125em',
+        md: '1.125em',
+        lg: '1.125em',
+        xl: '1.125em'
       }
     }
   })), ((_content$component$su17 = content.component.subcomponent[0]) === null || _content$component$su17 === void 0 ? void 0 : _content$component$su17.button_active) && /*#__PURE__*/React__default.createElement(material.Box, null, /*#__PURE__*/React__default.createElement(material.Button, {
@@ -573,17 +574,17 @@ function Layout1$3(content) {
     sx: {
       whiteSpace: 'pre-wrap',
       fontSize: {
-        xs: "1.875em",
-        sm: "2.25em",
-        md: "3em",
-        lg: "3em",
-        xl: "3em"
+        xs: '1.875em',
+        sm: '2.25em',
+        md: '3em',
+        lg: '3em',
+        xl: '3em'
       },
-      paddingBottom: "32px"
+      paddingBottom: '32px'
     }
   }), /*#__PURE__*/React__default.createElement(material.Grid, {
     container: true,
-    spacing: 2,
+    spacing: 1,
     alignItems: "center",
     justifyContent: "center"
   }, (_content$component$su = content.component.subcomponent) === null || _content$component$su === void 0 ? void 0 : _content$component$su.map(function (img, index) {
@@ -599,7 +600,7 @@ function Layout1$3(content) {
       elevation: 0,
       sx: {
         borderRadius: '24px',
-        width: "100%",
+        width: '100%',
         height: {
           xl: 350,
           lg: 350,
@@ -610,12 +611,12 @@ function Layout1$3(content) {
       }
     }, /*#__PURE__*/React__default.createElement(material.CardMedia, {
       component: "img",
-      alt: img.description ? img.description : "",
+      alt: img.description ? img.description : '',
       image: img.image ? img.image.url ? img.image.url : 'none' : 'none',
       sx: {
-        width: "100%",
-        height: "100%",
-        transform: "translate(\n                        " + img.image_transform_x + "%\n                        ,\n                        " + img.image_transform_y + "%)" + ("scale(" + (img.image_scale ? img.image_scale : "1") + ")")
+        width: '100%',
+        height: '100%',
+        transform: "translate(\n                        " + img.image_transform_x + "%\n                        ,\n                        " + img.image_transform_y + "%)" + ("scale(" + (img.image_scale ? img.image_scale : '1') + ")")
       }
     })));
   }))));
@@ -777,33 +778,19 @@ function Item$2(props) {
     return null;
   } else {
     return content.length >= 1 ? /*#__PURE__*/React__default.createElement(Carousel, {
-      autoPlay: false,
-      indicators: false,
-      navButtonsAlwaysVisible: true,
-      navButtonsProps: {
-        style: {
-          backgroundColor: 'transparent',
-          borderRadius: 0,
-          color: '#767676'
-        }
-      },
-      navButtonsWrapperProps: {
-        style: {
-          top: '0',
-          bottom: 'unset'
-        }
-      },
+      autoPlay: true,
+      indicators: true,
+      navButtonsAlwaysVisible: false,
       sx: {
         width: '100%',
-        height: '520px',
-        paddingTop: '70px',
-        "& .css-hn784z": {
+        height: '620px',
+        '& .css-hn784z': {
           left: {
             xs: 'calc(100% - 120px)'
           },
           height: 'auto'
         },
-        "& .css-1abc02a": {
+        '& .css-1abc02a': {
           height: 'auto'
         }
       }
@@ -811,23 +798,20 @@ function Item$2(props) {
       return /*#__PURE__*/React__default.createElement(material.Grid, {
         container: true,
         key: i,
-        spacing: 3,
+        spacing: 1,
         sx: {
           margin: 'auto',
           padding: 'auto'
         }
-      }, /*#__PURE__*/React__default.createElement(material.Box, {
-        sx: {
-          position: 'absolute',
-          top: {
-            xs: '-20px',
-            sm: '-50px'
-          }
-        }
-      }, /*#__PURE__*/React__default.createElement(material.Typography, {
+      }, /*#__PURE__*/React__default.createElement(material.Grid, {
+        container: true,
+        justifyContent: 'center',
+        marginBottom: 1
+      }, /*#__PURE__*/React__default.createElement(material.Box, null, ' ', /*#__PURE__*/React__default.createElement(material.Typography, {
+        textAlign: 'center',
         component: 'h2',
         dangerouslySetInnerHTML: {
-          __html: title ? title : 'Agregue un título'
+          __html: title ? title : ''
         },
         sx: {
           height: '100%',
@@ -839,27 +823,34 @@ function Item$2(props) {
             xs: '1.875em'
           }
         }
-      })), items.map(function (item, j) {
+      }))), items.map(function (item, j) {
         var _ref;
         return /*#__PURE__*/React__default.createElement(material.Grid, {
           item: true,
           key: j,
-          sm: 6,
+          sm: 5,
           md: 4,
-          lg: 3,
-          xl: 3,
+          lg: 2.9,
+          xl: 2.9,
           sx: {
             margin: {
               xs: '0px',
               sm: '0px'
             },
-            width: 'object-fit',
-            display: 'flex',
+            display: {
+              xs: '',
+              sm: 'flex'
+            },
             justifyContent: 'center',
             alignItems: 'center',
             '&.MuiGrid-item': {
-              paddingLeft: '10px',
-              paddingTop: '10px'
+              paddingLeft: {
+                xs: '35px',
+                sm: '55px',
+                md: '20px',
+                lg: '12px',
+                xl: '12px'
+              }
             }
           }
         }, /*#__PURE__*/React__default.createElement(material.Slide, {
@@ -881,7 +872,7 @@ function Item$2(props) {
           image: item.image ? item.image.url ? item.image.url : 'none' : 'none',
           sx: {
             aspectRatio: '1/1',
-            transform: "translate(\n                                  " + item.image_transform_x + "%\n                                  ,\n                                  " + item.image_transform_y + "%)" + ("scale(" + (item.image_scale ? item.image_scale : "1") + ")")
+            transform: "translate(\n                                  " + item.image_transform_x + "%\n                                  ,\n                                  " + item.image_transform_y + "%)" + ("scale(" + (item.image_scale ? item.image_scale : '1') + ")")
           }
         })), /*#__PURE__*/React__default.createElement(material.CardContent, {
           sx: {
@@ -891,12 +882,20 @@ function Item$2(props) {
               paddingBottom: '8px'
             }
           }
+        }, /*#__PURE__*/React__default.createElement(material.Grid, {
+          height: {
+            xs: '2vh',
+            sm: '2vh',
+            md: '3.1vh',
+            lg: '3.2vh',
+            xl: '3.2vh'
+          }
         }, /*#__PURE__*/React__default.createElement(material.Typography, {
-          component: 'h3',
           dangerouslySetInnerHTML: {
             __html: item.title ? item.title : 'Agrega título'
           },
           sx: {
+            padding: '1px !important',
             display: '-webkit-box',
             WebkitLineClamp: 1,
             WebkitBoxOrient: 'vertical',
@@ -906,17 +905,19 @@ function Item$2(props) {
             fontSize: {
               xs: '1em',
               sm: '1em',
-              md: '1em',
-              lg: '1em',
-              xl: '1em'
+              md: '1.3em',
+              lg: '1.3em',
+              xl: '1.3em'
             }
           }
-        }), /*#__PURE__*/React__default.createElement(material.Typography, {
+        })), /*#__PURE__*/React__default.createElement(material.Grid, null, /*#__PURE__*/React__default.createElement(material.Typography, {
           component: 'p',
           dangerouslySetInnerHTML: {
             __html: item.subtitle ? item.subtitle : 'Agrega subtítulo'
           },
           sx: {
+            padding: '1px !important',
+            maxHeight: '40px',
             display: '-webkit-box',
             WebkitLineClamp: 2,
             WebkitBoxOrient: 'vertical',
@@ -931,7 +932,15 @@ function Item$2(props) {
               xl: '1em'
             }
           }
-        }), item.button_active && /*#__PURE__*/React__default.createElement(material.Button, {
+        })), item.button_active && /*#__PURE__*/React__default.createElement(material.Grid, {
+          height: {
+            xs: '2vh',
+            sm: '2vh',
+            md: '2vh',
+            lg: '2vh',
+            xl: '2vh'
+          }
+        }, /*#__PURE__*/React__default.createElement(material.Button, {
           variant: "contained",
           href: item.button_action ? item.button_action : '#',
           target: item.link == 4 ? '_blank' : '_self',
@@ -942,7 +951,7 @@ function Item$2(props) {
             borderRadius: '50px',
             fontSize: '12px'
           }
-        }, item.button_title ? item.button_title : 'Nombre botón')))));
+        }, item.button_title ? item.button_title : 'Nombre botón'))))));
       }));
     })) : /*#__PURE__*/React__default.createElement(material.Grid, {
       container: true,
@@ -1001,7 +1010,7 @@ function Item$2(props) {
         image: item.image.url ? item.image.url : 'https://via.placeholder.com/300x300.png?text=No+Image',
         sx: {
           aspectRatio: '1/1',
-          transform: "translate(\n                            " + item.image_transform_x + "%\n                            ,\n                            " + item.image_transform_y + "%)" + ("scale(" + (item.image_scale ? item.image_scale : "1") + ")")
+          transform: "translate(\n                            " + item.image_transform_x + "%\n                            ,\n                            " + item.image_transform_y + "%)" + ("scale(" + (item.image_scale ? item.image_scale : '1') + ")")
         }
       }), /*#__PURE__*/React__default.createElement(material.CardContent, {
         sx: {
@@ -1089,13 +1098,7 @@ var List = /*#__PURE__*/function (_AtomicElements) {
 
 function Layout1$6(content) {
   return /*#__PURE__*/React__default.createElement(material.Grid, {
-    container: true,
-    sx: {
-      minHeight: '250px',
-      width: '100%',
-      margin: 'auto',
-      padding: '0px'
-    }
+    container: true
   }, /*#__PURE__*/React__default.createElement(Item$3, {
     title: content.component.title,
     content: content.component.subcomponent,
@@ -1144,13 +1147,13 @@ function Item$3(props) {
   } else {
     return content.length >= 1 ? /*#__PURE__*/React__default.createElement(Carousel, {
       autoPlay: true,
-      indicators: false,
+      indicators: true,
       swipe: true,
       cycleNavigation: true,
       sx: {
         width: '100%',
-        height: '250px',
-        paddingTop: '60px',
+        height: '40vh',
+        paddingTop: '20px',
         position: 'relative'
       }
     }, arrayFourElements.map(function (items, p) {
@@ -1159,21 +1162,15 @@ function Item$3(props) {
         key: p
       }, /*#__PURE__*/React__default.createElement(material.Grid, {
         container: true,
-        spacing: 0,
         sx: {
-          margin: 'auto',
           padding: 'auto'
         }
-      }, /*#__PURE__*/React__default.createElement(material.Box, {
-        sx: {
-          position: 'absolute',
-          top: {
-            xs: '-40px',
-            sm: '-70px'
-          },
-          zIndex: 1
-        }
-      }, " ", /*#__PURE__*/React__default.createElement(material.Typography, {
+      }, /*#__PURE__*/React__default.createElement(material.Grid, {
+        container: true,
+        justifyContent: 'center',
+        marginBottom: 1
+      }, /*#__PURE__*/React__default.createElement(material.Box, null, ' ', /*#__PURE__*/React__default.createElement(material.Typography, {
+        textAlign: 'center',
         component: 'h2',
         dangerouslySetInnerHTML: {
           __html: title ? title : ''
@@ -1188,30 +1185,31 @@ function Item$3(props) {
             xs: '1.875em'
           }
         }
-      })), items.map(function (item, j) {
-        return /*#__PURE__*/React__default.createElement(material.Grid, {
-          item: true,
-          key: j,
-          xs: 12,
-          sm: 6,
-          md: 4,
-          lg: 3,
-          xl: 3,
-          sx: {
-            margin: {
-              xs: '0px',
-              sm: '0px'
+      }))), /*#__PURE__*/React__default.createElement(material.Grid, {
+        item: true,
+        xs: 12,
+        sm: 12,
+        md: 12,
+        lg: 12,
+        xl: 12,
+        sx: {
+          width: 'object-fit',
+          display: 'flex',
+          justifyContent: 'center',
+          alignItems: 'center',
+          '&.MuiGrid-item': {
+            paddingLeft: {
+              xs: '80px',
+              sm: '12px',
+              md: '12px',
+              lg: '12px',
+              xl: '12px'
             },
-            width: 'object-fit',
-            display: 'flex',
-            justifyContent: 'center',
-            alignItems: 'center',
-            '&.MuiGrid-item': {
-              paddingLeft: '17px',
-              paddingTop: '10px'
-            }
+            paddingTop: '10px'
           }
-        }, /*#__PURE__*/React__default.createElement(material.Slide, {
+        }
+      }, items.map(function (item, j) {
+        return /*#__PURE__*/React__default.createElement(material.Slide, {
           direction: "left",
           "in": visible
         }, /*#__PURE__*/React__default.createElement(material.Card, {
@@ -1219,20 +1217,23 @@ function Item$3(props) {
           sx: {
             width: '100%',
             height: '100%',
+            maxHeight: '200px',
             borderRadius: '10px',
-            background: 'none'
+            background: 'none',
+            margin: 'auto'
           }
         }, /*#__PURE__*/React__default.createElement(material.CardMedia, {
           component: "img",
           image: item.image ? item.image.url ? item.image.url : 'none' : 'none',
           alt: item.title ? item.title : 'none',
           sx: {
-            width: '100%',
-            height: '140px',
-            transform: "translate(" + item.image_transform_x + "%, " + item.image_transform_y + "%) scale(" + (item.image_scale ? item.image_scale : '1') + ")"
+            width: '200px',
+            height: 'auto',
+            maxHeight: '200px',
+            objectFit: 'contain'
           }
-        }))));
-      })));
+        })));
+      }))));
     })) : null;
   }
 }
@@ -1366,8 +1367,10 @@ function CanvasContainer(props) {
       backgroundColor: json.component.bg_type === 1 ? json.component.bg_color1 : undefined,
       backgroundImage: json.component.bg_type === 2 ? "linear-gradient(to " + json.component.bg_gradiant_orientation + ", " + json.component.bg_color1 + ", " + json.component.bg_color2 + ")" : json.component.bg_type === 3 ? "url(" + ((_json$component$bg_im = json.component.bg_image) === null || _json$component$bg_im === void 0 ? void 0 : _json$component$bg_im.url) + ")" : undefined,
       backgroundPosition: 'center',
+      backgroundAttachment: 'fixed',
       backgroundSize: 'cover',
-      backgroundRepeat: 'no-repeat'
+      backgroundRepeat: 'no-repeat',
+      justifyContent: 'center'
     }
   }, /*#__PURE__*/React__default.createElement(material.Box, {
     sx: {
@@ -3083,39 +3086,39 @@ function Layout(content) {
       preserveAspectRatio: 'xMidYMid slice'
     }
   };
-  var callToAction = "Ingresa a Keski Creator desde tu panel administrativo para editar esta vista.";
+  var callToAction = 'Ingresa a Keski Creator desde tu panel administrativo para editar esta vista.';
   var infoLoadingMap = {
     'landing/content/1': {
-      title: "Página de inicio",
-      description: "Esta página es muy importante, aquí es la primera impresión de tus clientes. Agrega las secciones necesarias para que tu cliente te conozca, utiliza un diseño agradable y atractivo para captar su atención desde el primer momento. Personaliza el contenido para reflejar la esencia de tu marca y los valores de tu negocio."
+      title: 'Página de inicio',
+      description: 'Esta página es muy importante, aquí es la primera impresión de tus clientes. Agrega las secciones necesarias para que tu cliente te conozca, utiliza un diseño agradable y atractivo para captar su atención desde el primer momento. Personaliza el contenido para reflejar la esencia de tu marca y los valores de tu negocio.'
     },
     'landing/content/2': {
-      title: "Productos",
-      description: "En esta sección puedes detallar los productos que ofreces. Organiza tu catálogo y facilita la navegación."
+      title: 'Productos',
+      description: 'En esta sección puedes detallar los productos que ofreces. Organiza tu catálogo y facilita la navegación.'
     },
     'landing/content/3': {
-      title: "Nosotros",
-      description: "Aquí puedes contar la historia de tu empresa, presentar a tu equipo y destacar tus valores y misión. Es una excelente oportunidad para generar confianza y credibilidad. Usa esta sección para humanizar tu marca y conectar emocionalmente con tus visitantes."
+      title: 'Nosotros',
+      description: 'Aquí puedes contar la historia de tu empresa, presentar a tu equipo y destacar tus valores y misión. Es una excelente oportunidad para generar confianza y credibilidad. Usa esta sección para humanizar tu marca y conectar emocionalmente con tus visitantes.'
     },
     'landing/content/4': {
-      title: "Catálogo",
-      description: "Muestra una lista detallada de todos los productos o servicios que ofreces. Organiza tu catálogo de manera que sea fácil de navegar y busca resaltar tus productos más populares o nuevos lanzamientos. Puedes incluir filtros y categorías para mejorar la experiencia del usuario."
+      title: 'Catálogo',
+      description: 'Muestra una lista detallada de todos los productos o servicios que ofreces. Organiza tu catálogo de manera que sea fácil de navegar y busca resaltar tus productos más populares o nuevos lanzamientos. Puedes incluir filtros y categorías para mejorar la experiencia del usuario.'
     },
     'landing/content/5': {
-      title: "Servicios",
-      description: "En esta página puedes detallar los diferentes servicios que ofreces. Describe cada servicio de manera clara y concisa, incluyendo sus beneficios y características. Utiliza imágenes y testimonios para reforzar la calidad de tus servicios y motivar a los visitantes a contactarte."
+      title: 'Servicios',
+      description: 'En esta página puedes detallar los diferentes servicios que ofreces. Describe cada servicio de manera clara y concisa, incluyendo sus beneficios y características. Utiliza imágenes y testimonios para reforzar la calidad de tus servicios y motivar a los visitantes a contactarte.'
     },
     'landing/content/6': {
-      title: "Blog",
-      description: "Comparte artículos, noticias y actualizaciones relacionadas con tu negocio. Un blog activo puede mejorar tu SEO y mantener a tus clientes informados y comprometidos. Publica contenido relevante y útil que pueda interesar a tus visitantes y mostrar tu expertise en la industria."
+      title: 'Blog',
+      description: 'Comparte artículos, noticias y actualizaciones relacionadas con tu negocio. Un blog activo puede mejorar tu SEO y mantener a tus clientes informados y comprometidos. Publica contenido relevante y útil que pueda interesar a tus visitantes y mostrar tu expertise en la industria.'
     },
     'landing/content/7': {
-      title: "Ubicación",
-      description: "Aquí puedes mostrar a tus clientes dónde estás ubicado. Incluye un mapa interactivo, tu dirección completa y cualquier otra información de contacto relevante. Si tienes varias ubicaciones, asegúrate de incluir detalles para cada una. También puedes agregar instrucciones sobre cómo llegar y el horario de atención."
+      title: 'Ubicación',
+      description: 'Aquí puedes mostrar a tus clientes dónde estás ubicado. Incluye un mapa interactivo, tu dirección completa y cualquier otra información de contacto relevante. Si tienes varias ubicaciones, asegúrate de incluir detalles para cada una. También puedes agregar instrucciones sobre cómo llegar y el horario de atención.'
     },
-    'placeholder': {
-      title: "En construccion",
-      description: "Bienvenido a la página principal. Aquí encontrarás información general y acceso a las diferentes secciones."
+    placeholder: {
+      title: 'En construccion',
+      description: 'Bienvenido a la página principal. Aquí encontrarás información general y acceso a las diferentes secciones.'
     }
   };
   var visible = true;
@@ -3129,8 +3132,8 @@ function Layout(content) {
       },
       height: {
         xs: '80vh',
-        sm: "80vh",
-        md: "80vh"
+        sm: '80vh',
+        md: '80vh'
       },
       backgroundPosition: 'center',
       justifyContent: 'center',
@@ -3150,18 +3153,18 @@ function Layout(content) {
         lg: '80vh'
       },
       justifyContent: 'center',
-      alignItems: "center",
+      alignItems: 'center',
       paddingLeft: {
-        lg: "0px",
-        md: "24px",
-        sm: "16px",
-        xs: "16px"
+        lg: '0px',
+        md: '24px',
+        sm: '16px',
+        xs: '16px'
       },
       paddingRight: {
-        lg: "24px",
-        md: "24px",
-        sm: "16px",
-        xs: "16px"
+        lg: '24px',
+        md: '24px',
+        sm: '16px',
+        xs: '16px'
       },
       textAlign: 'center'
     }
@@ -3171,11 +3174,11 @@ function Layout(content) {
       marginBottom: '16px',
       whiteSpace: 'pre-wrap',
       fontSize: {
-        xs: "2em",
-        sm: "2em",
-        md: "3.75em",
-        lg: "3.75em",
-        xl: "3.75em"
+        xs: '2em',
+        sm: '2em',
+        md: '3.75em',
+        lg: '3.75em',
+        xl: '3.75em'
       },
       color: '#60269E'
     }
@@ -3185,11 +3188,11 @@ function Layout(content) {
       marginBottom: '16px',
       justifyContent: 'center',
       fontSize: {
-        xs: "1.25em",
-        sm: "1.25em",
-        md: "1.25em",
-        lg: "1.25em",
-        xl: "1.25em"
+        xs: '1.25em',
+        sm: '1.25em',
+        md: '1.25em',
+        lg: '1.25em',
+        xl: '1.25em'
       }
     }
   }, infoLoadingMap[content.component.view_placeholder].description), /*#__PURE__*/React__default.createElement(Lottie, {
@@ -3202,11 +3205,11 @@ function Layout(content) {
       marginBottom: '16px',
       justifyContent: 'center',
       fontSize: {
-        xs: "1.25em",
-        sm: "1.25em",
-        md: "1.25em",
-        lg: "1.25em",
-        xl: "1.25em"
+        xs: '1.25em',
+        sm: '1.25em',
+        md: '1.25em',
+        lg: '1.25em',
+        xl: '1.25em'
       }
     }
   }, callToAction))));