keski_lib_catalog 1.3.1 → 1.3.3

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 +102 -117
  2. package/dist/index.js.map +1 -1
  3. package/dist/index.modern.js +102 -117
  4. package/dist/index.modern.js.map +1 -1
  5. package/package.json +1 -1
package/dist/index.modern.js CHANGED
@@ -1,6 +1,7 @@
1
1
  import React, { useState, useEffect } from 'react';
2
2
  import Carousel from 'react-material-ui-carousel';
3
3
  import { Box, Slide, Typography, Chip, Button, Card, CardMedia, Grid as Grid$1, useTheme, useMediaQuery, CardContent, Container } from '@mui/material';
4
+ import Avatar from '@mui/material/Avatar';
4
5
  import { styled } from '@mui/material/styles';
5
6
  import Paper from '@mui/material/Paper';
6
7
  import Grid from '@mui/material/Grid';
@@ -118,22 +119,27 @@ function Item(props) {
118
119
  color: content.text_color,
119
120
  alignItems: getSideRender(side)
120
121
  }
121
- }, /*#__PURE__*/React.createElement(Box, {
122
- component: "img",
123
- src: content.image ? content.image.url : "https://cdn-icons-png.flaticon.com/512/6596/6596121.png",
122
+ }, /*#__PURE__*/React.createElement(Avatar, {
123
+ src: content.image ? content.image.url : "none",
124
124
  sx: {
125
125
  width: '120px',
126
126
  height: '120px',
127
- marginBottom: '16px',
128
- borderRadius: '50%'
127
+ bgcolor: "black",
128
+ marginBottom: '16px'
129
129
  }
130
130
  }), /*#__PURE__*/React.createElement(Box, {
131
131
  sx: {
132
132
  width: {
133
133
  xs: "100%",
134
- xl: "90%",
135
- lg: "90%"
136
- }
134
+ xl: "72%",
135
+ lg: "72%"
136
+ },
137
+ height: "100%",
138
+ overflow: 'hidden',
139
+ textOverflow: 'ellipsis',
140
+ display: '-webkit-box',
141
+ WebkitLineClamp: 7,
142
+ WebkitBoxOrient: 'vertical'
137
143
  }
138
144
  }, /*#__PURE__*/React.createElement(Typography, {
139
145
  dangerouslySetInnerHTML: {
@@ -144,14 +150,14 @@ function Item(props) {
144
150
  fontSize: {
145
151
  xl: '1.75em',
146
152
  lg: '1.75em',
147
- md: '1.5em',
153
+ md: '1.75em',
148
154
  sm: '1.5em',
149
155
  xs: '1.5em'
150
156
  }
151
157
  }
152
- }), /*#__PURE__*/React.createElement(Typography, {
158
+ })), /*#__PURE__*/React.createElement(Typography, {
153
159
  dangerouslySetInnerHTML: {
154
- __html: content.subtitle ? content.subtitle : 'Agregue subtítulo'
160
+ __html: content.title ? content.title : 'Agregue subtítulo'
155
161
  },
156
162
  sx: {
157
163
  marginBottom: '16px',
@@ -163,7 +169,7 @@ function Item(props) {
163
169
  xs: '1.125em'
164
170
  }
165
171
  }
166
- })), content.label_active && /*#__PURE__*/React.createElement(Box, null, /*#__PURE__*/React.createElement(Chip, {
172
+ }), content.label_active && /*#__PURE__*/React.createElement(Box, null, /*#__PURE__*/React.createElement(Chip, {
167
173
  disabled: true,
168
174
  color: "info",
169
175
  label: content.label ? content.label : 'Agregue etiqueta',
@@ -185,7 +191,7 @@ var Quotes = /*#__PURE__*/function (_AtomicElements) {
185
191
  _this.layoutFootprint = ['quotes_layout_1.png'];
186
192
  _this.layoutFootprintReq = [{
187
193
  'type': 1,
188
- 'subtitle': 'Subtitle',
194
+ 'title': 'Tittle',
189
195
  'description': 'Description',
190
196
  'label': 'Label',
191
197
  'label_color': 'Label color',
@@ -198,7 +204,7 @@ var Quotes = /*#__PURE__*/function (_AtomicElements) {
198
204
  }(AtomicElements);
199
205
 
200
206
  function Layout1$1(content) {
201
- 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;
207
+ 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;
202
208
  var visible = true;
203
209
  return /*#__PURE__*/React.createElement(Slide, {
204
210
  direction: "left",
@@ -224,30 +230,46 @@ function Layout1$1(content) {
224
230
  flexDirection: 'column',
225
231
  width: {
226
232
  xs: '100%',
227
- md: '90%',
228
- lg: '80%'
233
+ md: '80%',
234
+ lg: '70%'
229
235
  },
230
236
  height: {
231
237
  xs: '80vh',
232
238
  lg: '80vh'
233
239
  },
234
240
  justifyContent: 'center',
235
- paddingLeft: content.component.bg_type === 3 ? '24px' : '0px',
236
- color: (_content$component$su3 = content.component.subcomponent[0]) === null || _content$component$su3 === void 0 ? void 0 : _content$component$su3.text_color
241
+ paddingLeft: (_content$component$su3 = content.component.subcomponent[0]) !== null && _content$component$su3 !== void 0 && _content$component$su3.image ? {
242
+ lg: "24px",
243
+ md: "24px",
244
+ sm: "16px",
245
+ xs: "16px"
246
+ } : {
247
+ lg: "0px",
248
+ md: "24px",
249
+ sm: "16px",
250
+ xs: "16px"
251
+ },
252
+ paddingRight: {
253
+ lg: "24px",
254
+ md: "24px",
255
+ sm: "16px",
256
+ xs: "16px"
257
+ },
258
+ color: (_content$component$su4 = content.component.subcomponent[0]) === null || _content$component$su4 === void 0 ? void 0 : _content$component$su4.text_color
237
259
  }
238
- }, ((_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, {
260
+ }, ((_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, {
239
261
  disabled: true,
240
262
  color: "info",
241
- 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',
263
+ 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',
242
264
  sx: {
243
265
  marginBottom: '16px',
244
266
  fontSize: '1em',
245
267
  borderRadius: '6px',
246
- backgroundColor: (_content$component$su7 = content.component.subcomponent[0]) === null || _content$component$su7 === void 0 ? void 0 : _content$component$su7.label_color
268
+ backgroundColor: (_content$component$su8 = content.component.subcomponent[0]) === null || _content$component$su8 === void 0 ? void 0 : _content$component$su8.label_color
247
269
  }
248
270
  })), /*#__PURE__*/React.createElement(Typography, {
249
271
  dangerouslySetInnerHTML: {
250
- __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'
272
+ __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'
251
273
  },
252
274
  sx: {
253
275
  marginBottom: '16px',
@@ -255,7 +277,7 @@ function Layout1$1(content) {
255
277
  fontSize: {
256
278
  xs: "2em",
257
279
  sm: "2em",
258
- md: "2em",
280
+ md: "3.75em",
259
281
  lg: "3.75em",
260
282
  xl: "3.75em"
261
283
  },
@@ -263,7 +285,7 @@ function Layout1$1(content) {
263
285
  }
264
286
  }), /*#__PURE__*/React.createElement(Typography, {
265
287
  dangerouslySetInnerHTML: {
266
- __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'
288
+ __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'
267
289
  },
268
290
  sx: {
269
291
  marginBottom: '16px',
@@ -276,18 +298,18 @@ function Layout1$1(content) {
276
298
  xl: "1.125em"
277
299
  }
278
300
  }
279
- }), ((_content$component$su12 = content.component.subcomponent[0]) === null || _content$component$su12 === void 0 ? void 0 : _content$component$su12.button_active) && /*#__PURE__*/React.createElement(Box, null, /*#__PURE__*/React.createElement(Button, {
301
+ }), ((_content$component$su13 = content.component.subcomponent[0]) === null || _content$component$su13 === void 0 ? void 0 : _content$component$su13.button_active) && /*#__PURE__*/React.createElement(Box, null, /*#__PURE__*/React.createElement(Button, {
280
302
  variant: "contained",
281
303
  size: "medium",
282
304
  color: "primary",
283
- href: (_content$component$su13 = content.component.subcomponent[0]) === null || _content$component$su13 === void 0 ? void 0 : _content$component$su13.button_action,
284
- target: ((_content$component$su14 = content.component.subcomponent[0]) === null || _content$component$su14 === void 0 ? void 0 : _content$component$su14.link) == 4 ? '_blank' : '_self',
305
+ href: (_content$component$su14 = content.component.subcomponent[0]) === null || _content$component$su14 === void 0 ? void 0 : _content$component$su14.button_action,
306
+ target: ((_content$component$su15 = content.component.subcomponent[0]) === null || _content$component$su15 === void 0 ? void 0 : _content$component$su15.link) == 4 ? '_blank' : '_self',
285
307
  sx: {
286
308
  width: 'auto',
287
309
  padding: '14px 40px',
288
310
  borderRadius: '50px'
289
311
  }
290
- }, (_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')))));
312
+ }, (_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')))));
291
313
  }
292
314
 
293
315
  var Banner = /*#__PURE__*/function (_AtomicElements) {
@@ -330,33 +352,16 @@ function Layout1$2(content) {
330
352
  item: true,
331
353
  xs: 12,
332
354
  sm: 12,
333
- md: 6,
334
- lg: 6,
335
- xl: 6,
336
- sx: {
337
- paddingLeft: {
338
- xl: "16px",
339
- lg: "16px",
340
- md: "16px",
341
- sm: "0px",
342
- xs: "0px"
343
- },
344
- paddingRight: {
345
- xl: "16px",
346
- lg: "16px",
347
- md: "16px",
348
- sm: "0px",
349
- xs: "0px"
350
- },
351
- paddingTop: "10px"
352
- }
355
+ md: 5.5,
356
+ lg: 5.5,
357
+ xl: 5.5
353
358
  }, /*#__PURE__*/React.createElement(Slide, {
354
359
  direction: "right",
355
360
  "in": visible
356
361
  }, /*#__PURE__*/React.createElement(Item$1, {
357
362
  elevation: 0,
358
363
  sx: {
359
- height: "90%",
364
+ height: "100%",
360
365
  width: "100%",
361
366
  background: "none"
362
367
  }
@@ -381,26 +386,24 @@ function Layout1$2(content) {
381
386
  item: true,
382
387
  xs: 12,
383
388
  sm: 12,
384
- md: 6,
385
- lg: 6,
386
- xl: 6,
389
+ md: 1,
390
+ lg: 1,
391
+ xl: 1
392
+ }, /*#__PURE__*/React.createElement(Item$1, {
393
+ elevation: 0,
387
394
  sx: {
388
- paddingLeft: {
389
- xl: "16px",
390
- lg: "16px",
391
- md: "16px",
392
- sm: "0px",
393
- xs: "0px"
394
- },
395
- paddingRight: {
396
- xl: "16px",
397
- lg: "16px",
398
- md: "16px",
399
- sm: "0px",
400
- xs: "0px"
401
- },
402
- paddingTop: "10px"
395
+ height: "100%",
396
+ width: "100%",
397
+ background: "none",
398
+ paddingTop: "48px"
403
399
  }
400
+ })), /*#__PURE__*/React.createElement(Grid, {
401
+ item: true,
402
+ xs: 12,
403
+ sm: 12,
404
+ md: 5.5,
405
+ lg: 5.5,
406
+ xl: 5.5
404
407
  }, /*#__PURE__*/React.createElement(Grow, _extends({
405
408
  "in": visible,
406
409
  style: {
@@ -411,7 +414,7 @@ function Layout1$2(content) {
411
414
  } ), /*#__PURE__*/React.createElement(Item$1, {
412
415
  elevation: 0,
413
416
  sx: {
414
- height: "90%",
417
+ height: "100%",
415
418
  width: "100%",
416
419
  background: "none"
417
420
  }
@@ -457,8 +460,8 @@ function Layout1$2(content) {
457
460
  xs: "1.125em",
458
461
  sm: "1.125em",
459
462
  md: "1.125em",
460
- lg: "1em",
461
- xl: "1em"
463
+ lg: "1.125em",
464
+ xl: "1.125em"
462
465
  }
463
466
  }
464
467
  })), ((_content$component$su15 = content.component.subcomponent[0]) === null || _content$component$su15 === void 0 ? void 0 : _content$component$su15.button_active) && /*#__PURE__*/React.createElement(Box, null, /*#__PURE__*/React.createElement(Button, {
@@ -527,24 +530,18 @@ function Layout1$3(content) {
527
530
  whiteSpace: 'pre-wrap',
528
531
  fontSize: {
529
532
  xs: "1.875em",
530
- sm: "1.875em",
531
- md: "2.25em",
533
+ sm: "2.25em",
534
+ md: "3em",
532
535
  lg: "3em",
533
536
  xl: "3em"
534
- }
537
+ },
538
+ paddingBottom: "32px"
535
539
  }
536
540
  }), /*#__PURE__*/React.createElement(Grid$1, {
537
541
  container: true,
538
542
  spacing: 2,
539
543
  alignItems: "center",
540
- justifyContent: "center",
541
- direction: {
542
- xl: "row",
543
- lg: "row",
544
- md: "row",
545
- sm: "column",
546
- xs: "column"
547
- }
544
+ justifyContent: "center"
548
545
  }, (_content$component$su3 = content.component.subcomponent) === null || _content$component$su3 === void 0 ? void 0 : _content$component$su3.map(function (img, index) {
549
546
  return /*#__PURE__*/React.createElement(Grid$1, {
550
547
  key: index,
@@ -557,40 +554,22 @@ function Layout1$3(content) {
557
554
  }, /*#__PURE__*/React.createElement(Card, {
558
555
  elevation: 0,
559
556
  sx: {
560
- borderRadius: '50px',
561
- width: {
562
- xl: '350px',
563
- lg: '350px',
564
- md: '450px',
565
- sm: '700px',
566
- xs: '250px'
567
- },
557
+ borderRadius: '24px',
558
+ width: "100%",
568
559
  height: {
569
- xl: '350px',
570
- lg: '350px',
571
- md: '450px',
572
- sm: '700px',
573
- xs: '250px'
560
+ xl: 350,
561
+ lg: 350,
562
+ md: 350,
563
+ sm: 700,
564
+ xs: 250
574
565
  }
575
566
  }
576
567
  }, /*#__PURE__*/React.createElement(CardMedia, {
577
568
  sx: {
578
- width: {
579
- xl: '350px',
580
- lg: '350px',
581
- md: '450px',
582
- sm: '700px',
583
- xs: '250px'
584
- },
585
- height: {
586
- xl: '350px',
587
- lg: '350px',
588
- md: '450px',
589
- sm: '700px',
590
- xs: '250px'
591
- }
569
+ width: "100%",
570
+ height: "100%"
592
571
  },
593
- 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'
572
+ image: img.image.url ? img.image.url : 'none'
594
573
  })));
595
574
  }))));
596
575
  }
@@ -635,8 +614,8 @@ function Layout1$4(content) {
635
614
  whiteSpace: 'pre-wrap',
636
615
  fontSize: {
637
616
  xs: "1.875em",
638
- sm: "1.875em",
639
- md: "2.25em",
617
+ sm: "2.25em",
618
+ md: "3em",
640
619
  lg: "3em",
641
620
  xl: "3em"
642
621
  },
@@ -644,7 +623,13 @@ function Layout1$4(content) {
644
623
  }
645
624
  }), /*#__PURE__*/React.createElement(Box, {
646
625
  sx: {
647
- width: content.component.justify_content == "center" ? "100%" : "80%"
626
+ width: content.component.justify_content == "center" ? "100%" : {
627
+ xl: "70%",
628
+ lg: "72%",
629
+ md: "84%",
630
+ sm: "100%",
631
+ xs: "100%"
632
+ }
648
633
  }
649
634
  }, /*#__PURE__*/React.createElement(Typography, {
650
635
  dangerouslySetInnerHTML: {
@@ -656,7 +641,7 @@ function Layout1$4(content) {
656
641
  fontSize: {
657
642
  xs: "1em",
658
643
  sm: "1em",
659
- md: "1em",
644
+ md: "1.125em",
660
645
  lg: "1.125em",
661
646
  xl: "1.125em"
662
647
  }
@@ -1241,9 +1226,9 @@ function CanvasContainer(props) {
1241
1226
  lg: '24px',
1242
1227
  xl: '24px'
1243
1228
  } : {
1244
- xs: '24px',
1229
+ xs: '16px',
1245
1230
  md: '24px',
1246
- sm: '24px',
1231
+ sm: '16px',
1247
1232
  lg: '24px',
1248
1233
  xl: '24px'
1249
1234
  },
@@ -1254,9 +1239,9 @@ function CanvasContainer(props) {
1254
1239
  lg: '24px',
1255
1240
  xl: '24px'
1256
1241
  } : {
1257
- xs: '24px',
1242
+ xs: '16px',
1258
1243
  md: '24px',
1259
- sm: '24px',
1244
+ sm: '16px',
1260
1245
  lg: '24px',
1261
1246
  xl: '24px'
1262
1247
  }