keski_lib_catalog 1.3.0 → 1.3.2

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.
@@ -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,14 +119,13 @@ 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: {
@@ -151,7 +151,7 @@ function Item(props) {
151
151
  }
152
152
  }), /*#__PURE__*/React.createElement(Typography, {
153
153
  dangerouslySetInnerHTML: {
154
- __html: content.subtitle ? content.subtitle : 'Agregue subtítulo'
154
+ __html: content.title ? content.title : 'Agregue subtítulo'
155
155
  },
156
156
  sx: {
157
157
  marginBottom: '16px',
@@ -185,7 +185,7 @@ var Quotes = /*#__PURE__*/function (_AtomicElements) {
185
185
  _this.layoutFootprint = ['quotes_layout_1.png'];
186
186
  _this.layoutFootprintReq = [{
187
187
  'type': 1,
188
- 'subtitle': 'Subtitle',
188
+ 'title': 'Tittle',
189
189
  'description': 'Description',
190
190
  'label': 'Label',
191
191
  'label_color': 'Label color',
@@ -198,7 +198,7 @@ var Quotes = /*#__PURE__*/function (_AtomicElements) {
198
198
  }(AtomicElements);
199
199
 
200
200
  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;
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, _content$component$su17;
202
202
  var visible = true;
203
203
  return /*#__PURE__*/React.createElement(Slide, {
204
204
  direction: "left",
@@ -224,30 +224,46 @@ function Layout1$1(content) {
224
224
  flexDirection: 'column',
225
225
  width: {
226
226
  xs: '100%',
227
- md: '90%',
228
- lg: '80%'
227
+ md: '80%',
228
+ lg: '70%'
229
229
  },
230
230
  height: {
231
231
  xs: '80vh',
232
232
  lg: '80vh'
233
233
  },
234
234
  justifyContent: 'center',
235
- margin: '1em',
236
- color: (_content$component$su3 = content.component.subcomponent[0]) === null || _content$component$su3 === void 0 ? void 0 : _content$component$su3.text_color
235
+ paddingLeft: (_content$component$su3 = content.component.subcomponent[0]) !== null && _content$component$su3 !== void 0 && _content$component$su3.image ? {
236
+ lg: "24px",
237
+ md: "24px",
238
+ sm: "16px",
239
+ xs: "16px"
240
+ } : {
241
+ lg: "0px",
242
+ md: "0px",
243
+ sm: "16px",
244
+ xs: "16px"
245
+ },
246
+ paddingRight: {
247
+ lg: "24px",
248
+ md: "24px",
249
+ sm: "16px",
250
+ xs: "16px"
251
+ },
252
+ color: (_content$component$su4 = content.component.subcomponent[0]) === null || _content$component$su4 === void 0 ? void 0 : _content$component$su4.text_color
237
253
  }
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, {
254
+ }, ((_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
255
  disabled: true,
240
256
  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',
257
+ 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
258
  sx: {
243
259
  marginBottom: '16px',
244
260
  fontSize: '1em',
245
261
  borderRadius: '6px',
246
- backgroundColor: (_content$component$su7 = content.component.subcomponent[0]) === null || _content$component$su7 === void 0 ? void 0 : _content$component$su7.label_color
262
+ backgroundColor: (_content$component$su8 = content.component.subcomponent[0]) === null || _content$component$su8 === void 0 ? void 0 : _content$component$su8.label_color
247
263
  }
248
264
  })), /*#__PURE__*/React.createElement(Typography, {
249
265
  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'
266
+ __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
267
  },
252
268
  sx: {
253
269
  marginBottom: '16px',
@@ -263,7 +279,7 @@ function Layout1$1(content) {
263
279
  }
264
280
  }), /*#__PURE__*/React.createElement(Typography, {
265
281
  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'
282
+ __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
283
  },
268
284
  sx: {
269
285
  marginBottom: '16px',
@@ -276,18 +292,18 @@ function Layout1$1(content) {
276
292
  xl: "1.125em"
277
293
  }
278
294
  }
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, {
295
+ }), ((_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
296
  variant: "contained",
281
297
  size: "medium",
282
298
  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',
299
+ href: (_content$component$su14 = content.component.subcomponent[0]) === null || _content$component$su14 === void 0 ? void 0 : _content$component$su14.button_action,
300
+ target: ((_content$component$su15 = content.component.subcomponent[0]) === null || _content$component$su15 === void 0 ? void 0 : _content$component$su15.link) == 4 ? '_blank' : '_self',
285
301
  sx: {
286
302
  width: 'auto',
287
303
  padding: '14px 40px',
288
304
  borderRadius: '50px'
289
305
  }
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')))));
306
+ }, (_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
307
  }
292
308
 
293
309
  var Banner = /*#__PURE__*/function (_AtomicElements) {
@@ -334,8 +350,20 @@ function Layout1$2(content) {
334
350
  lg: 6,
335
351
  xl: 6,
336
352
  sx: {
337
- paddingLeft: "16px",
338
- paddingRight: "16px",
353
+ paddingLeft: {
354
+ xl: "16px",
355
+ lg: "16px",
356
+ md: "16px",
357
+ sm: "0px",
358
+ xs: "0px"
359
+ },
360
+ paddingRight: {
361
+ xl: "16px",
362
+ lg: "16px",
363
+ md: "16px",
364
+ sm: "0px",
365
+ xs: "0px"
366
+ },
339
367
  paddingTop: "10px"
340
368
  }
341
369
  }, /*#__PURE__*/React.createElement(Slide, {
@@ -373,8 +401,20 @@ function Layout1$2(content) {
373
401
  lg: 6,
374
402
  xl: 6,
375
403
  sx: {
376
- paddingLeft: "16px",
377
- paddingRight: "16px",
404
+ paddingLeft: {
405
+ xl: "16px",
406
+ lg: "16px",
407
+ md: "16px",
408
+ sm: "0px",
409
+ xs: "0px"
410
+ },
411
+ paddingRight: {
412
+ xl: "16px",
413
+ lg: "16px",
414
+ md: "16px",
415
+ sm: "0px",
416
+ xs: "0px"
417
+ },
378
418
  paddingTop: "10px"
379
419
  }
380
420
  }, /*#__PURE__*/React.createElement(Grow, _extends({
@@ -537,14 +577,14 @@ function Layout1$3(content) {
537
577
  width: {
538
578
  xl: '350px',
539
579
  lg: '350px',
540
- md: '350px',
580
+ md: '700px',
541
581
  sm: '700px',
542
582
  xs: '250px'
543
583
  },
544
584
  height: {
545
585
  xl: '350px',
546
586
  lg: '350px',
547
- md: '350px',
587
+ md: '700px',
548
588
  sm: '700px',
549
589
  xs: '250px'
550
590
  }
@@ -554,14 +594,14 @@ function Layout1$3(content) {
554
594
  width: {
555
595
  xl: '350px',
556
596
  lg: '350px',
557
- md: '350px',
597
+ md: '700px',
558
598
  sm: '700px',
559
599
  xs: '250px'
560
600
  },
561
601
  height: {
562
602
  xl: '350px',
563
603
  lg: '350px',
564
- md: '350px',
604
+ md: '700px',
565
605
  sm: '700px',
566
606
  xs: '250px'
567
607
  }
@@ -620,7 +660,13 @@ function Layout1$4(content) {
620
660
  }
621
661
  }), /*#__PURE__*/React.createElement(Box, {
622
662
  sx: {
623
- width: content.component.justify_content == "center" ? "100%" : "80%"
663
+ width: content.component.justify_content == "center" ? "100%" : {
664
+ xl: "70%",
665
+ lg: "72%",
666
+ md: "84%",
667
+ sm: "100%",
668
+ xs: "100%"
669
+ }
624
670
  }
625
671
  }, /*#__PURE__*/React.createElement(Typography, {
626
672
  dangerouslySetInnerHTML: {
@@ -860,7 +906,7 @@ function Item$2(props) {
860
906
  xl: '1em'
861
907
  }
862
908
  }
863
- }), /*#__PURE__*/React.createElement(Button, {
909
+ }), item.button_active && /*#__PURE__*/React.createElement(Button, {
864
910
  variant: "contained",
865
911
  href: item.button_action ? item.button_action : '#',
866
912
  target: item.link == 4 ? '_blank' : '_self',
@@ -1002,6 +1048,7 @@ var List = /*#__PURE__*/function (_AtomicElements) {
1002
1048
  'type': 1,
1003
1049
  'title': 'Title',
1004
1050
  'subtitle': 'Subtitle',
1051
+ 'button_active': 'Button active',
1005
1052
  'button_title': 'Button Title',
1006
1053
  'button_action': 'Button Action',
1007
1054
  'image': 'sqr',
@@ -1216,9 +1263,9 @@ function CanvasContainer(props) {
1216
1263
  lg: '24px',
1217
1264
  xl: '24px'
1218
1265
  } : {
1219
- xs: '24px',
1266
+ xs: '16px',
1220
1267
  md: '24px',
1221
- sm: '24px',
1268
+ sm: '16px',
1222
1269
  lg: '24px',
1223
1270
  xl: '24px'
1224
1271
  },
@@ -1229,9 +1276,9 @@ function CanvasContainer(props) {
1229
1276
  lg: '24px',
1230
1277
  xl: '24px'
1231
1278
  } : {
1232
- xs: '24px',
1279
+ xs: '16px',
1233
1280
  md: '24px',
1234
- sm: '24px',
1281
+ sm: '16px',
1235
1282
  lg: '24px',
1236
1283
  xl: '24px'
1237
1284
  }