keski_lib_catalog 1.1.0 → 1.2.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (5) hide show
  1. package/dist/index.js +299 -103
  2. package/dist/index.js.map +1 -1
  3. package/dist/index.modern.js +311 -115
  4. package/dist/index.modern.js.map +1 -1
  5. package/package.json +1 -1
package/dist/index.modern.js CHANGED
@@ -1,10 +1,10 @@
1
1
  import React, { useState, useEffect } from 'react';
2
2
  import Carousel from 'react-material-ui-carousel';
3
- import { Box, Slide, Typography, Button, Grid, useTheme, useMediaQuery, Card, CardMedia, CardContent, Container } from '@mui/material';
4
- import Grow from '@mui/material/Grow';
5
- import { createTheme, styled } from '@mui/material/styles';
3
+ import { Box, Slide, Typography, Container, Chip, Button, Card, CardMedia, Grid as Grid$1, useTheme, useMediaQuery, CardContent } from '@mui/material';
4
+ import { styled, createTheme } from '@mui/material/styles';
6
5
  import Paper from '@mui/material/Paper';
7
- import Grid$1 from '@mui/material/Grid';
6
+ import Grid from '@mui/material/Grid';
7
+ import Grow from '@mui/material/Grow';
8
8
  import { ThemeProvider } from '@emotion/react';
9
9
 
10
10
  function _extends() {
@@ -167,47 +167,93 @@ var Quotes = /*#__PURE__*/function (_AtomicElements) {
167
167
  }(AtomicElements);
168
168
 
169
169
  function Layout1$1(content) {
170
- 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;
170
+ 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;
171
171
  var visible = true;
172
- return /*#__PURE__*/React.createElement(Slide, {
172
+ return /*#__PURE__*/React.createElement(Container, {
173
+ maxWidth: "lg"
174
+ }, /*#__PURE__*/React.createElement(Slide, {
173
175
  direction: "left",
174
176
  "in": visible
177
+ }, /*#__PURE__*/React.createElement(Box, {
178
+ sx: {
179
+ width: {
180
+ xs: '100%'
181
+ },
182
+ height: {
183
+ xs: '100%'
184
+ },
185
+ backgroundImage: "url(" + ((_content$component$su = content.component.subcomponent[0]) !== null && _content$component$su !== void 0 && _content$component$su.image ? (_content$component$su2 = content.component.subcomponent[0]) === null || _content$component$su2 === void 0 ? void 0 : _content$component$su2.image : 'none') + ")",
186
+ backgroundSize: 'cover',
187
+ backgroundPosition: 'center',
188
+ display: 'flex'
189
+ }
175
190
  }, /*#__PURE__*/React.createElement(Box, {
176
191
  sx: {
177
192
  display: 'flex',
178
193
  flexDirection: 'column',
179
194
  width: {
180
195
  xs: '100%',
181
- md: '50%'
196
+ md: '50%',
197
+ lg: '80%'
182
198
  },
183
199
  height: {
184
200
  xs: '100%',
185
201
  lg: '60vh'
186
202
  },
187
203
  justifyContent: 'center',
188
- color: (_content$component$su = content.component.subcomponent[0]) === null || _content$component$su === void 0 ? void 0 : _content$component$su.text_color
204
+ margin: '1em',
205
+ color: (_content$component$su3 = content.component.subcomponent[0]) === null || _content$component$su3 === void 0 ? void 0 : _content$component$su3.text_color
189
206
  }
190
- }, /*#__PURE__*/React.createElement(Typography, {
191
- className: "title-xxlarge",
207
+ }, ((_content$component$su4 = content.component.subcomponent[0]) === null || _content$component$su4 === void 0 ? void 0 : _content$component$su4.label_active) && /*#__PURE__*/React.createElement(Box, null, /*#__PURE__*/React.createElement(Chip, {
208
+ disabled: true,
209
+ color: "info",
210
+ 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',
192
211
  sx: {
193
212
  marginBottom: '16px',
194
- whiteSpace: 'pre-wrap'
213
+ fontSize: '1em',
214
+ borderRadius: '6px',
215
+ backgroundColor: (_content$component$su7 = content.component.subcomponent[0]) === null || _content$component$su7 === void 0 ? void 0 : _content$component$su7.label_color
195
216
  }
196
- }, (_content$component$su2 = content.component.subcomponent[0]) !== null && _content$component$su2 !== void 0 && _content$component$su2.title ? (_content$component$su3 = content.component.subcomponent[0]) === null || _content$component$su3 === void 0 ? void 0 : _content$component$su3.title : 'Agregue título'), /*#__PURE__*/React.createElement(Typography, {
197
- className: "xmiddle",
217
+ })), /*#__PURE__*/React.createElement(Typography, {
218
+ dangerouslySetInnerHTML: {
219
+ __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'
220
+ },
198
221
  sx: {
199
222
  marginBottom: '16px',
200
- whiteSpace: 'pre-wrap'
223
+ whiteSpace: 'pre-wrap',
224
+ fontSize: {
225
+ xs: "2em",
226
+ md: "2em",
227
+ lg: "3.75em"
228
+ },
229
+ fontWeight: "bold"
201
230
  }
202
- }, (_content$component$su4 = content.component.subcomponent[0]) !== null && _content$component$su4 !== void 0 && _content$component$su4.description ? (_content$component$su5 = content.component.subcomponent[0]) === null || _content$component$su5 === void 0 ? void 0 : _content$component$su5.description : 'Agregue descripción'), /*#__PURE__*/React.createElement(Box, null, /*#__PURE__*/React.createElement(Button, {
231
+ }), /*#__PURE__*/React.createElement(Typography, {
232
+ dangerouslySetInnerHTML: {
233
+ __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'
234
+ },
235
+ sx: {
236
+ marginBottom: '16px',
237
+ whiteSpace: 'pre-wrap',
238
+ fontSize: {
239
+ xs: "1.125em",
240
+ md: "1.125em",
241
+ lg: "1.125em"
242
+ }
243
+ }
244
+ }), ((_content$component$su12 = content.component.subcomponent[0]) === null || _content$component$su12 === void 0 ? void 0 : _content$component$su12.button_active) && /*#__PURE__*/React.createElement(Box, {
245
+ sx: {}
246
+ }, /*#__PURE__*/React.createElement(Button, {
203
247
  variant: "contained",
204
- href: (_content$component$su6 = content.component.subcomponent[0]) === null || _content$component$su6 === void 0 ? void 0 : _content$component$su6.button_action,
205
- target: ((_content$component$su7 = content.component.subcomponent[0]) === null || _content$component$su7 === void 0 ? void 0 : _content$component$su7.link) == 4 ? '_blank' : '_self',
248
+ size: "medium",
249
+ href: (_content$component$su13 = content.component.subcomponent[0]) === null || _content$component$su13 === void 0 ? void 0 : _content$component$su13.button_action,
250
+ target: ((_content$component$su14 = content.component.subcomponent[0]) === null || _content$component$su14 === void 0 ? void 0 : _content$component$su14.link) == 4 ? '_blank' : '_self',
206
251
  sx: {
207
252
  width: 'auto',
208
- marginBottom: '16px'
253
+ padding: '14px 40px',
254
+ borderRadius: '50px'
209
255
  }
210
- }, (_content$component$su8 = content.component.subcomponent[0]) !== null && _content$component$su8 !== void 0 && _content$component$su8.button_title ? (_content$component$su9 = content.component.subcomponent[0]) === null || _content$component$su9 === void 0 ? void 0 : _content$component$su9.button_title : 'Nombre botón'))));
256
+ }, (_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'))))));
211
257
  }
212
258
 
213
259
  var Banner = /*#__PURE__*/function (_AtomicElements) {
@@ -219,10 +265,15 @@ var Banner = /*#__PURE__*/function (_AtomicElements) {
219
265
  _this.layoutFootprint = ['banner_layout_1.jpg'];
220
266
  _this.layoutFootprintReq = [{
221
267
  'type': 0,
268
+ 'label': 'Label',
269
+ 'label_color': 'Label color',
270
+ 'label_active': 'Label active',
222
271
  'title': 'Tittle',
272
+ 'image': 'Image',
223
273
  'description': 'Description',
224
274
  'button_title': 'Button Title',
225
275
  'button_action': 'Button action',
276
+ 'button_active': 'Button active',
226
277
  'text_color': 'Text color',
227
278
  'link': 'Link'
228
279
  }];
@@ -231,70 +282,133 @@ var Banner = /*#__PURE__*/function (_AtomicElements) {
231
282
  return Banner;
232
283
  }(AtomicElements);
233
284
 
285
+ var Item$1 = styled(Paper)(function (_ref) {
286
+ var theme = _ref.theme;
287
+ return _extends({
288
+ backgroundColor: theme.palette.mode === 'dark' ? '#1A2027' : '#fff'
289
+ }, theme.typography.body2, {
290
+ padding: theme.spacing(2),
291
+ textAlign: 'left',
292
+ color: theme.palette.text.secondary
293
+ });
294
+ });
234
295
  function Layout1$2(content) {
235
- 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;
296
+ 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;
236
297
  var visible = true;
237
- return /*#__PURE__*/React.createElement(Box, {
238
- sx: {
239
- display: 'flex',
240
- flexDirection: {
241
- xs: 'column',
242
- md: content.component.justify_content != 'right' ? 'row' : 'row-reverse'
243
- },
244
- gap: '16px',
245
- alignItems: 'center'
246
- },
247
- color: (_content$component$su = content.component.subcomponent[0]) === null || _content$component$su === void 0 ? void 0 : _content$component$su.text_color
248
- }, /*#__PURE__*/React.createElement(Box, null, /*#__PURE__*/React.createElement(Slide, {
298
+ return /*#__PURE__*/React.createElement(Container, {
299
+ maxWidth: "lg"
300
+ }, /*#__PURE__*/React.createElement(Grid, {
301
+ container: true,
302
+ spacing: 4,
303
+ direction: content.component.justify_content != 'right' ? 'row' : 'row-reverse'
304
+ }, /*#__PURE__*/React.createElement(Grid, {
305
+ item: true,
306
+ xs: 12,
307
+ sm: 12,
308
+ md: 6,
309
+ lg: 6,
310
+ xl: 6
311
+ }, /*#__PURE__*/React.createElement(Slide, {
249
312
  direction: "right",
250
313
  "in": visible
251
- }, /*#__PURE__*/React.createElement(Box, {
314
+ }, /*#__PURE__*/React.createElement(Item$1, {
315
+ elevation: 0,
252
316
  sx: {
253
- width: {
254
- xs: '100%',
255
- md: '550px',
256
- lg: '640px'
257
- },
258
- maxWidth: '100vw'
317
+ height: "90%",
318
+ width: "100%",
319
+ background: "none"
259
320
  }
260
- }, /*#__PURE__*/React.createElement("img", {
261
- width: "100%",
262
- height: "100%",
263
- src: (_content$component$su2 = content.component.subcomponent[0]) !== null && _content$component$su2 !== void 0 && _content$component$su2.image ? (_content$component$su3 = content.component.subcomponent[0]) === null || _content$component$su3 === void 0 ? void 0 : _content$component$su3.image.url : 'https://wozapps-develop.s3.us-east-2.amazonaws.com/gerry/resources/landing/bbb84144-02cd-4cf8-a1be-21ba47e7c4fa.jpeg'
264
- })))), /*#__PURE__*/React.createElement(Box, null, /*#__PURE__*/React.createElement(Grow, _extends({
321
+ }, /*#__PURE__*/React.createElement(Card, {
322
+ elevation: 0,
323
+ sx: {
324
+ borderRadius: "24px",
325
+ background: "none",
326
+ backgroundSize: 'center',
327
+ backgroundPosition: 'center'
328
+ }
329
+ }, /*#__PURE__*/React.createElement(CardMedia, {
330
+ sx: {
331
+ width: "100%",
332
+ paddingTop: '56.25%',
333
+ backgroundSize: 'center',
334
+ backgroundPosition: 'center',
335
+ transform: (_content$component$su = content.component.subcomponent[0]) !== null && _content$component$su !== void 0 && _content$component$su.image_scale ? (_content$component$su2 = content.component.subcomponent[0]) === null || _content$component$su2 === void 0 ? void 0 : _content$component$su2.image_scale : '1'
336
+ },
337
+ image: (_content$component$su3 = content.component.subcomponent[0]) !== null && _content$component$su3 !== void 0 && _content$component$su3.image ? (_content$component$su4 = content.component.subcomponent[0]) === null || _content$component$su4 === void 0 ? void 0 : _content$component$su4.image.url : 'none'
338
+ }))))), /*#__PURE__*/React.createElement(Grid, {
339
+ item: true,
340
+ xs: 12,
341
+ sm: 12,
342
+ md: 6,
343
+ lg: 6,
344
+ xl: 6
345
+ }, /*#__PURE__*/React.createElement(Grow, _extends({
265
346
  "in": visible,
266
347
  style: {
267
348
  transformOrigin: '0 0 0'
268
349
  }
269
350
  }, {
270
351
  timeout: 1000
271
- } ), /*#__PURE__*/React.createElement(Box, null, /*#__PURE__*/React.createElement(Box, {
352
+ } ), /*#__PURE__*/React.createElement(Item$1, {
353
+ elevation: 0,
354
+ sx: {
355
+ height: "90%",
356
+ width: "100%",
357
+ background: "none"
358
+ }
359
+ }, /*#__PURE__*/React.createElement(Box, null, ((_content$component$su5 = content.component.subcomponent[0]) === null || _content$component$su5 === void 0 ? void 0 : _content$component$su5.label_active) && /*#__PURE__*/React.createElement(Box, null, /*#__PURE__*/React.createElement(Chip, {
360
+ disabled: true,
361
+ color: "info",
362
+ 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',
363
+ sx: {
364
+ marginBottom: '16px',
365
+ fontSize: '1em',
366
+ borderRadius: '6px',
367
+ backgroundColor: (_content$component$su8 = content.component.subcomponent[0]) === null || _content$component$su8 === void 0 ? void 0 : _content$component$su8.label_color
368
+ }
369
+ })), /*#__PURE__*/React.createElement(Box, {
272
370
  sx: {
273
371
  marginBottom: '16px'
274
372
  }
275
373
  }, /*#__PURE__*/React.createElement(Typography, {
276
- className: "title-xlarge",
374
+ dangerouslySetInnerHTML: {
375
+ __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'
376
+ },
277
377
  sx: {
278
- whiteSpace: 'pre-wrap'
378
+ whiteSpace: 'pre-wrap',
379
+ fontSize: {
380
+ xs: "2em",
381
+ md: "2em",
382
+ lg: "2em",
383
+ xl: "3em"
384
+ }
279
385
  }
280
- }, (_content$component$su4 = content.component.subcomponent[0]) !== null && _content$component$su4 !== void 0 && _content$component$su4.title ? (_content$component$su5 = content.component.subcomponent[0]) === null || _content$component$su5 === void 0 ? void 0 : _content$component$su5.title : 'Agregue título')), /*#__PURE__*/React.createElement(Box, {
386
+ })), /*#__PURE__*/React.createElement(Box, {
281
387
  sx: {
282
- marginBottom: '16px',
283
- color: '#767676'
388
+ marginBottom: '16px'
284
389
  }
285
390
  }, /*#__PURE__*/React.createElement(Typography, {
286
- className: "middle",
391
+ dangerouslySetInnerHTML: {
392
+ __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'
393
+ },
287
394
  sx: {
288
- whiteSpace: 'pre-wrap'
395
+ whiteSpace: 'pre-wrap',
396
+ fontSize: {
397
+ xs: "1.125em",
398
+ md: "1.125em",
399
+ lg: "1em"
400
+ }
289
401
  }
290
- }, (_content$component$su6 = content.component.subcomponent[0]) !== null && _content$component$su6 !== void 0 && _content$component$su6.description ? (_content$component$su7 = content.component.subcomponent[0]) === null || _content$component$su7 === void 0 ? void 0 : _content$component$su7.description : 'Agregue descripción')), /*#__PURE__*/React.createElement(Box, null, /*#__PURE__*/React.createElement(Button, {
402
+ })), /*#__PURE__*/React.createElement(Box, null, /*#__PURE__*/React.createElement(Button, {
291
403
  variant: "contained",
292
- href: (_content$component$su8 = content.component.subcomponent[0]) === null || _content$component$su8 === void 0 ? void 0 : _content$component$su8.button_action,
293
- target: ((_content$component$su9 = content.component.subcomponent[0]) === null || _content$component$su9 === void 0 ? void 0 : _content$component$su9.link) == 4 ? '_blank' : '_self',
404
+ href: (_content$component$su13 = content.component.subcomponent[0]) === null || _content$component$su13 === void 0 ? void 0 : _content$component$su13.button_action,
405
+ target: ((_content$component$su14 = content.component.subcomponent[0]) === null || _content$component$su14 === void 0 ? void 0 : _content$component$su14.link) == 4 ? '_blank' : '_self',
294
406
  sx: {
295
- width: 'auto'
407
+ width: 'auto',
408
+ padding: '14px 40px',
409
+ borderRadius: '40px'
296
410
  }
297
- }, (_content$component$su10 = content.component.subcomponent[0]) !== null && _content$component$su10 !== void 0 && _content$component$su10.button_title ? (_content$component$su11 = content.component.subcomponent[0]) === null || _content$component$su11 === void 0 ? void 0 : _content$component$su11.button_title : 'Nombre botón'))))));
411
+ }, (_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'))))))));
298
412
  }
299
413
 
300
414
  var TextPlusImg = /*#__PURE__*/function (_AtomicElements) {
@@ -306,11 +420,15 @@ var TextPlusImg = /*#__PURE__*/function (_AtomicElements) {
306
420
  _this.layoutFootprint = ['text_image_layout_1.png', 'text_image_layout_1.png'];
307
421
  _this.layoutFootprintReq = [{
308
422
  'type': 0,
423
+ 'label': 'Label',
424
+ 'label_color': 'Label color',
425
+ 'label_active': 'Label active',
309
426
  'title': 'Title',
310
427
  'description': 'Text',
311
428
  'button_title': 'Button Title',
312
429
  'button_action': 'Button Action',
313
- 'image': 'req_hor',
430
+ 'image': 'image',
431
+ 'image_scale': 'image scale',
314
432
  'link': 'Link'
315
433
  }, {
316
434
  'type': 0,
@@ -341,10 +459,10 @@ function Layout1$3(content) {
341
459
  margin: '16px auto',
342
460
  whiteSpace: 'pre-wrap'
343
461
  }
344
- }, content.component.title ? content.component.title : 'Agregue un título'), /*#__PURE__*/React.createElement(Grid, {
462
+ }, content.component.title ? content.component.title : 'Agregue un título'), /*#__PURE__*/React.createElement(Grid$1, {
345
463
  container: true
346
464
  }, (_content$component$su = content.component.subcomponent) === null || _content$component$su === void 0 ? void 0 : _content$component$su.map(function (img, index) {
347
- return /*#__PURE__*/React.createElement(Grid, {
465
+ return /*#__PURE__*/React.createElement(Grid$1, {
348
466
  key: index,
349
467
  item: true,
350
468
  xs: 12,
@@ -429,7 +547,7 @@ var Text = /*#__PURE__*/function (_AtomicElements) {
429
547
  }(AtomicElements);
430
548
 
431
549
  function Layout1$5(content) {
432
- return /*#__PURE__*/React.createElement(Grid, {
550
+ return /*#__PURE__*/React.createElement(Grid$1, {
433
551
  container: true,
434
552
  sx: {
435
553
  minHeight: '550px',
@@ -437,13 +555,13 @@ function Layout1$5(content) {
437
555
  margin: 'auto',
438
556
  padding: '8px'
439
557
  }
440
- }, /*#__PURE__*/React.createElement(Item$1, {
558
+ }, /*#__PURE__*/React.createElement(Item$2, {
441
559
  title: content.component.title,
442
560
  content: content.component.subcomponent,
443
561
  side: content.component.justify_content
444
562
  }));
445
563
  }
446
- function Item$1(props) {
564
+ function Item$2(props) {
447
565
  var content = props.content,
448
566
  side = props.side,
449
567
  title = props.title;
@@ -516,7 +634,7 @@ function Item$1(props) {
516
634
  }
517
635
  }
518
636
  }, arrayFourElements.map(function (items, i) {
519
- return /*#__PURE__*/React.createElement(Grid, {
637
+ return /*#__PURE__*/React.createElement(Grid$1, {
520
638
  container: true,
521
639
  key: i,
522
640
  spacing: 3,
@@ -536,7 +654,7 @@ function Item$1(props) {
536
654
  }
537
655
  }, title ? title : 'Agregue un título')), items.map(function (item, j) {
538
656
  var _ref;
539
- return /*#__PURE__*/React.createElement(Grid, {
657
+ return /*#__PURE__*/React.createElement(Grid$1, {
540
658
  item: true,
541
659
  className: "containerdegrid",
542
660
  key: j,
@@ -614,7 +732,7 @@ function Item$1(props) {
614
732
  }
615
733
  }, item.button_title ? item.button_title : 'Nombre botón')))));
616
734
  }));
617
- })) : /*#__PURE__*/React.createElement(Grid, {
735
+ })) : /*#__PURE__*/React.createElement(Grid$1, {
618
736
  container: true,
619
737
  sx: {
620
738
  width: '100%',
@@ -629,7 +747,7 @@ function Item$1(props) {
629
747
  className: "title-xlarge"
630
748
  }, title ? title : 'Agregue un título')), content.map(function (item, i) {
631
749
  var _ref2;
632
- return /*#__PURE__*/React.createElement(Grid, {
750
+ return /*#__PURE__*/React.createElement(Grid$1, {
633
751
  item: true,
634
752
  key: i,
635
753
  xs: 12,
@@ -723,79 +841,131 @@ var List = /*#__PURE__*/function (_AtomicElements) {
723
841
  return List;
724
842
  }(AtomicElements);
725
843
 
726
- var theme = createTheme({
727
- breakpoints: {
728
- values: {
729
- xs: 0,
730
- sm: 600,
731
- md: 840,
732
- lg: 1200,
733
- xl: 1536
734
- }
735
- }
736
- });
737
-
738
- var Item$2 = styled(Paper)(function (_ref) {
844
+ var Item$3 = styled(Paper)(function (_ref) {
739
845
  var theme = _ref.theme;
740
846
  return _extends({
741
847
  backgroundColor: theme.palette.mode === 'dark' ? '#1A2027' : '#fff'
742
848
  }, theme.typography.body2, {
743
- padding: theme.spacing(1),
744
- textAlign: 'center',
849
+ padding: theme.spacing(2),
850
+ textAlign: 'left',
745
851
  color: theme.palette.text.secondary
746
852
  });
747
853
  });
748
854
  function Layout1$6(content) {
749
- var _content$component$su, _content$component$su2, _content$component$su3, _content$component$su4, _content$component$su5, _content$component$su6;
750
- return /*#__PURE__*/React.createElement(ThemeProvider, {
751
- theme: theme
752
- }, /*#__PURE__*/React.createElement(Container, {
753
- maxWidth: "lg",
754
- sx: {
755
- marginLeft: "36px",
756
- marginRight: "36px"
757
- }
758
- }, /*#__PURE__*/React.createElement(Grid$1, {
855
+ 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;
856
+ var visible = true;
857
+ return /*#__PURE__*/React.createElement(Container, {
858
+ maxWidth: "lg"
859
+ }, /*#__PURE__*/React.createElement(Grid, {
759
860
  container: true,
760
- spacing: 2
761
- }, /*#__PURE__*/React.createElement(Grid$1, {
861
+ spacing: 4,
862
+ direction: content.component.justify_content != 'right' ? 'row' : 'row-reverse'
863
+ }, /*#__PURE__*/React.createElement(Grid, {
762
864
  item: true,
763
865
  xs: 12,
764
866
  sm: 12,
765
867
  md: 6,
766
- lg: 5
767
- }, /*#__PURE__*/React.createElement(Item$2, {
768
- elevation: 0
868
+ lg: 6,
869
+ xl: 6
870
+ }, /*#__PURE__*/React.createElement(Slide, {
871
+ direction: "right",
872
+ "in": visible
873
+ }, /*#__PURE__*/React.createElement(Item$3, {
874
+ elevation: 0,
875
+ sx: {
876
+ height: "90%",
877
+ width: "100%",
878
+ background: "none"
879
+ }
769
880
  }, /*#__PURE__*/React.createElement(Card, {
770
- elevation: 0
881
+ sx: {
882
+ borderRadius: "24px",
883
+ background: "none",
884
+ backgroundSize: 'center',
885
+ backgroundPosition: 'center'
886
+ }
771
887
  }, /*#__PURE__*/React.createElement(CardMedia, {
772
888
  sx: {
773
- height: "50%",
774
889
  width: "100%",
775
890
  paddingTop: '56.25%',
776
- backgroundImage: "url(" + ((_content$component$su = content.component.subcomponent[0]) !== null && _content$component$su !== void 0 && _content$component$su.image ? (_content$component$su2 = content.component.subcomponent[0]) === null || _content$component$su2 === void 0 ? void 0 : _content$component$su2.image : 'agregue imagen') + ")"
777
- }
778
- })))), /*#__PURE__*/React.createElement(Grid$1, {
891
+ backgroundSize: 'center',
892
+ backgroundPosition: 'center'
893
+ },
894
+ image: (_content$component$su = content.component.subcomponent[0]) !== null && _content$component$su !== void 0 && _content$component$su.image ? (_content$component$su2 = content.component.subcomponent[0]) === null || _content$component$su2 === void 0 ? void 0 : _content$component$su2.image.url : 'none'
895
+ }))))), /*#__PURE__*/React.createElement(Grid, {
779
896
  item: true,
780
897
  xs: 12,
781
898
  sm: 12,
782
899
  md: 6,
783
- lg: 7
784
- }, /*#__PURE__*/React.createElement(Item$2, {
785
- elevation: 0
900
+ lg: 6,
901
+ xl: 6
902
+ }, /*#__PURE__*/React.createElement(Grow, _extends({
903
+ "in": visible,
904
+ style: {
905
+ transformOrigin: '0 0 0'
906
+ }
907
+ }, {
908
+ timeout: 1000
909
+ } ), /*#__PURE__*/React.createElement(Item$3, {
910
+ elevation: 0,
911
+ sx: {
912
+ height: "90%",
913
+ width: "100%",
914
+ background: "none"
915
+ }
916
+ }, /*#__PURE__*/React.createElement(Box, null, ((_content$component$su3 = content.component.subcomponent[0]) === null || _content$component$su3 === void 0 ? void 0 : _content$component$su3.label_active) && /*#__PURE__*/React.createElement(Box, null, /*#__PURE__*/React.createElement(Chip, {
917
+ disabled: true,
918
+ color: "info",
919
+ label: (_content$component$su4 = content.component.subcomponent[0]) !== null && _content$component$su4 !== void 0 && _content$component$su4.label ? (_content$component$su5 = content.component.subcomponent[0]) === null || _content$component$su5 === void 0 ? void 0 : _content$component$su5.label : 'Agregue etiqueta',
920
+ sx: {
921
+ marginBottom: '16px',
922
+ fontSize: '1em',
923
+ borderRadius: '6px',
924
+ backgroundColor: (_content$component$su6 = content.component.subcomponent[0]) === null || _content$component$su6 === void 0 ? void 0 : _content$component$su6.label_color
925
+ }
926
+ })), /*#__PURE__*/React.createElement(Box, {
927
+ sx: {
928
+ marginBottom: '16px'
929
+ }
930
+ }, /*#__PURE__*/React.createElement(Typography, {
931
+ dangerouslySetInnerHTML: {
932
+ __html: (_content$component$su7 = content.component.subcomponent[0]) !== null && _content$component$su7 !== void 0 && _content$component$su7.title ? (_content$component$su8 = content.component.subcomponent[0]) === null || _content$component$su8 === void 0 ? void 0 : _content$component$su8.title : 'Agregue titulo'
933
+ },
934
+ sx: {
935
+ whiteSpace: 'pre-wrap',
936
+ fontSize: {
937
+ xs: "2em",
938
+ md: "2em",
939
+ lg: "2em",
940
+ xl: "3em"
941
+ }
942
+ }
943
+ })), /*#__PURE__*/React.createElement(Box, {
944
+ sx: {
945
+ marginBottom: '16px'
946
+ }
786
947
  }, /*#__PURE__*/React.createElement(Typography, {
787
- variant: "h2",
788
- component: "h1",
948
+ dangerouslySetInnerHTML: {
949
+ __html: (_content$component$su9 = content.component.subcomponent[0]) !== null && _content$component$su9 !== void 0 && _content$component$su9.description ? (_content$component$su10 = content.component.subcomponent[0]) === null || _content$component$su10 === void 0 ? void 0 : _content$component$su10.description : 'Agregue descripción'
950
+ },
789
951
  sx: {
790
- fontSize: "40px"
952
+ whiteSpace: 'pre-wrap',
953
+ fontSize: {
954
+ xs: "1.125em",
955
+ md: "1.125em",
956
+ lg: "1em"
957
+ }
791
958
  }
792
- }, (_content$component$su3 = content.component.subcomponent[0]) !== null && _content$component$su3 !== void 0 && _content$component$su3.title ? (_content$component$su4 = content.component.subcomponent[0]) === null || _content$component$su4 === void 0 ? void 0 : _content$component$su4.title : 'Agregue título'), /*#__PURE__*/React.createElement(Typography, {
793
- variant: "h5",
794
- component: "p",
959
+ })), /*#__PURE__*/React.createElement(Box, null, /*#__PURE__*/React.createElement(Button, {
960
+ variant: "contained",
961
+ href: (_content$component$su11 = content.component.subcomponent[0]) === null || _content$component$su11 === void 0 ? void 0 : _content$component$su11.button_action,
962
+ target: ((_content$component$su12 = content.component.subcomponent[0]) === null || _content$component$su12 === void 0 ? void 0 : _content$component$su12.link) == 4 ? '_blank' : '_self',
795
963
  sx: {
796
- fontSize: "20px"
964
+ width: 'auto',
965
+ padding: '14px 40px',
966
+ borderRadius: '40px'
797
967
  }
798
- }, (_content$component$su5 = content.component.subcomponent[0]) !== null && _content$component$su5 !== void 0 && _content$component$su5.description ? (_content$component$su6 = content.component.subcomponent[0]) === null || _content$component$su6 === void 0 ? void 0 : _content$component$su6.description : 'Agregue descripción'))))));
968
+ }, (_content$component$su13 = content.component.subcomponent[0]) !== null && _content$component$su13 !== void 0 && _content$component$su13.button_title ? (_content$component$su14 = content.component.subcomponent[0]) === null || _content$component$su14 === void 0 ? void 0 : _content$component$su14.button_title : 'Nombre botón'))))))));
799
969
  }
800
970
 
801
971
  var ImagPlusText = /*#__PURE__*/function (_AtomicElements) {
@@ -807,9 +977,23 @@ var ImagPlusText = /*#__PURE__*/function (_AtomicElements) {
807
977
  _this.layoutFootprint = ['imgPlusText_layout_1.png'];
808
978
  _this.layoutFootprintReq = [{
809
979
  'type': 0,
810
- 'image': 'Imagen',
980
+ 'label': 'Label',
981
+ 'label_color': 'Label color',
982
+ 'label_active': 'Label active',
983
+ 'title': 'Title',
984
+ 'description': 'Text',
985
+ 'button_title': 'Button Title',
986
+ 'button_action': 'Button Action',
987
+ 'image': 'image',
988
+ 'image_scale': 'image scale',
989
+ 'link': 'Link'
990
+ }, {
991
+ 'type': 0,
811
992
  'title': 'Title',
812
- 'description': 'Text'
993
+ 'description': 'Text',
994
+ 'button_title': 'Button Title',
995
+ 'button_action': 'Button Action',
996
+ 'image': 'req_hor'
813
997
  }];
814
998
  return _this;
815
999
  }
@@ -888,6 +1072,18 @@ function hexToRgb(hex) {
888
1072
 
889
1073
  var JK_RESOURCES = 'https://jk-clients.s3.us-east-2.amazonaws.com/jk-resources/';
890
1074
 
1075
+ var theme = createTheme({
1076
+ breakpoints: {
1077
+ values: {
1078
+ xs: 0,
1079
+ sm: 600,
1080
+ md: 840,
1081
+ lg: 1200,
1082
+ xl: 1536
1083
+ }
1084
+ }
1085
+ });
1086
+
891
1087
  var Section = /*#__PURE__*/function () {
892
1088
  function Section(AtomicElement, theme) {
893
1089
  this.child = AtomicElement;