@telefonica/mistica 16.4.0 → 16.6.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 (108) hide show
  1. package/css/mistica.css +1 -1
  2. package/css/vivo-new.css +11 -11
  3. package/dist/accordion.css-mistica.js +16 -13
  4. package/dist/accordion.css.d.ts +1 -0
  5. package/dist/accordion.d.ts +4 -0
  6. package/dist/accordion.js +110 -93
  7. package/dist/callout.js +27 -15
  8. package/dist/card.css-mistica.js +5 -5
  9. package/dist/card.d.ts +9 -1
  10. package/dist/card.js +611 -475
  11. package/dist/community/advanced-data-card.css-mistica.js +14 -11
  12. package/dist/community/advanced-data-card.css.d.ts +1 -0
  13. package/dist/community/advanced-data-card.d.ts +1 -1
  14. package/dist/community/advanced-data-card.js +172 -85
  15. package/dist/cover-hero.css-mistica.js +14 -11
  16. package/dist/cover-hero.css.d.ts +1 -0
  17. package/dist/cover-hero.d.ts +1 -0
  18. package/dist/cover-hero.js +101 -59
  19. package/dist/empty-state.js +24 -15
  20. package/dist/header.css-mistica.js +6 -3
  21. package/dist/header.css.d.ts +1 -0
  22. package/dist/header.d.ts +3 -2
  23. package/dist/header.js +148 -79
  24. package/dist/hero.css-mistica.js +11 -8
  25. package/dist/hero.css.d.ts +1 -0
  26. package/dist/hero.d.ts +2 -1
  27. package/dist/hero.js +102 -68
  28. package/dist/highlighted-card.js +32 -23
  29. package/dist/index.d.ts +1 -0
  30. package/dist/index.js +4 -0
  31. package/dist/maybe-dismissable.js +8 -5
  32. package/dist/meter.d.ts +23 -0
  33. package/dist/meter.js +400 -0
  34. package/dist/mosaic.d.ts +6 -2
  35. package/dist/mosaic.js +50 -48
  36. package/dist/navigation-bar.css-mistica.js +96 -37
  37. package/dist/navigation-bar.css.d.ts +27 -1
  38. package/dist/navigation-bar.d.ts +65 -30
  39. package/dist/navigation-bar.js +818 -193
  40. package/dist/package-version.js +1 -1
  41. package/dist/sheet-common.css-mistica.js +16 -10
  42. package/dist/sheet-common.css.d.ts +3 -1
  43. package/dist/sheet-common.js +78 -70
  44. package/dist/sheet-info.css-mistica.js +15 -4
  45. package/dist/sheet-info.css.d.ts +2 -0
  46. package/dist/sheet-info.d.ts +3 -0
  47. package/dist/sheet-info.js +61 -43
  48. package/dist/sheet-native.js +59 -48
  49. package/dist/sheet-types.d.ts +6 -1
  50. package/dist/sheet-web.js +6 -4
  51. package/dist/skins/blau.js +94 -94
  52. package/dist/skins/movistar.js +94 -94
  53. package/dist/skins/o2-new.js +94 -94
  54. package/dist/skins/o2.js +94 -94
  55. package/dist/skins/telefonica.js +94 -94
  56. package/dist/skins/tu.js +94 -94
  57. package/dist/skins/vivo-new.js +98 -98
  58. package/dist/skins/vivo.js +94 -94
  59. package/dist/text-tokens.d.ts +14 -0
  60. package/dist/text-tokens.js +134 -102
  61. package/dist/theme-context-provider.js +60 -50
  62. package/dist/theme.d.ts +3 -2
  63. package/dist/theme.js +20 -17
  64. package/dist/utils/headings.d.ts +2 -0
  65. package/dist/utils/headings.js +11 -0
  66. package/dist/utils/types.d.ts +1 -0
  67. package/dist-es/accordion.css-mistica.js +7 -7
  68. package/dist-es/accordion.js +140 -123
  69. package/dist-es/callout.js +55 -43
  70. package/dist-es/card.css-mistica.js +2 -2
  71. package/dist-es/card.js +721 -588
  72. package/dist-es/community/advanced-data-card.css-mistica.js +3 -3
  73. package/dist-es/community/advanced-data-card.js +217 -130
  74. package/dist-es/cover-hero.css-mistica.js +3 -3
  75. package/dist-es/cover-hero.js +132 -90
  76. package/dist-es/empty-state.js +40 -31
  77. package/dist-es/header.css-mistica.js +2 -2
  78. package/dist-es/header.js +174 -104
  79. package/dist-es/hero.css-mistica.js +2 -2
  80. package/dist-es/hero.js +150 -115
  81. package/dist-es/highlighted-card.js +36 -27
  82. package/dist-es/index.js +1839 -1838
  83. package/dist-es/maybe-dismissable.js +17 -14
  84. package/dist-es/meter.js +346 -0
  85. package/dist-es/mosaic.js +73 -71
  86. package/dist-es/navigation-bar.css-mistica.js +14 -15
  87. package/dist-es/navigation-bar.js +864 -240
  88. package/dist-es/package-version.js +1 -1
  89. package/dist-es/sheet-common.css-mistica.js +2 -2
  90. package/dist-es/sheet-common.js +124 -116
  91. package/dist-es/sheet-info.css-mistica.js +2 -2
  92. package/dist-es/sheet-info.js +74 -56
  93. package/dist-es/sheet-native.js +59 -48
  94. package/dist-es/sheet-web.js +10 -8
  95. package/dist-es/skins/blau.js +94 -94
  96. package/dist-es/skins/movistar.js +94 -94
  97. package/dist-es/skins/o2-new.js +94 -94
  98. package/dist-es/skins/o2.js +94 -94
  99. package/dist-es/skins/telefonica.js +94 -94
  100. package/dist-es/skins/tu.js +94 -94
  101. package/dist-es/skins/vivo-new.js +98 -98
  102. package/dist-es/skins/vivo.js +94 -94
  103. package/dist-es/style.css +1 -1
  104. package/dist-es/text-tokens.js +72 -52
  105. package/dist-es/theme-context-provider.js +88 -78
  106. package/dist-es/theme.js +20 -20
  107. package/dist-es/utils/headings.js +2 -0
  108. package/package.json +2 -1
@@ -340,154 +340,154 @@ const e = {
340
340
  mediaSmall: "8px"
341
341
  },
342
342
  textPresets: {
343
+ button: {
344
+ weight: "medium"
345
+ },
343
346
  cardTitle: {
344
347
  weight: "bold"
345
348
  },
346
- button: {
349
+ indicator: {
347
350
  weight: "medium"
348
351
  },
349
- tabsLabel: {
350
- weight: "medium",
351
- size: {
352
- mobile: 16,
353
- desktop: 18
354
- },
355
- lineHeight: {
356
- mobile: 24,
357
- desktop: 24
358
- }
359
- },
360
352
  link: {
361
353
  weight: "medium"
362
354
  },
363
- title1: {
355
+ navigationBar: {
364
356
  weight: "medium"
365
357
  },
366
- title2: {
367
- weight: "bold"
368
- },
369
- title3: {
370
- weight: "bold",
358
+ tabsLabel: {
359
+ lineHeight: {
360
+ desktop: 24,
361
+ mobile: 24
362
+ },
371
363
  size: {
372
- mobile: 20,
373
- desktop: 28
364
+ desktop: 18,
365
+ mobile: 16
374
366
  },
375
- lineHeight: {
376
- mobile: 24,
377
- desktop: 32
378
- }
379
- },
380
- indicator: {
381
- weight: "medium"
382
- },
383
- navigationBar: {
384
367
  weight: "medium"
385
368
  },
386
369
  text1: {
387
- size: {
388
- mobile: 12,
389
- desktop: 14
390
- },
391
370
  lineHeight: {
392
- mobile: 16,
393
- desktop: 20
371
+ desktop: 20,
372
+ mobile: 16
373
+ },
374
+ size: {
375
+ desktop: 14,
376
+ mobile: 12
394
377
  }
395
378
  },
396
379
  text2: {
397
- size: {
398
- mobile: 14,
399
- desktop: 16
400
- },
401
380
  lineHeight: {
402
- mobile: 20,
403
- desktop: 24
381
+ desktop: 24,
382
+ mobile: 20
383
+ },
384
+ size: {
385
+ desktop: 16,
386
+ mobile: 14
404
387
  }
405
388
  },
406
389
  text3: {
407
- size: {
408
- mobile: 16,
409
- desktop: 18
410
- },
411
390
  lineHeight: {
412
- mobile: 24,
413
- desktop: 24
391
+ desktop: 24,
392
+ mobile: 24
393
+ },
394
+ size: {
395
+ desktop: 18,
396
+ mobile: 16
414
397
  }
415
398
  },
416
399
  text4: {
417
- size: {
418
- mobile: 18,
419
- desktop: 20
420
- },
421
400
  lineHeight: {
422
- mobile: 24,
423
- desktop: 28
401
+ desktop: 28,
402
+ mobile: 24
403
+ },
404
+ size: {
405
+ desktop: 20,
406
+ mobile: 18
424
407
  }
425
408
  },
426
409
  text5: {
427
- weight: "bold",
410
+ lineHeight: {
411
+ desktop: 32,
412
+ mobile: 24
413
+ },
428
414
  size: {
429
- mobile: 20,
430
- desktop: 28
415
+ desktop: 28,
416
+ mobile: 20
431
417
  },
432
- lineHeight: {
433
- mobile: 24,
434
- desktop: 32
435
- }
418
+ weight: "bold"
436
419
  },
437
420
  text6: {
438
- weight: "bold",
421
+ lineHeight: {
422
+ desktop: 40,
423
+ mobile: 32
424
+ },
439
425
  size: {
440
- mobile: 24,
441
- desktop: 32
426
+ desktop: 32,
427
+ mobile: 24
442
428
  },
443
- lineHeight: {
444
- mobile: 32,
445
- desktop: 40
446
- }
429
+ weight: "bold"
447
430
  },
448
431
  text7: {
449
- weight: "bold",
432
+ lineHeight: {
433
+ desktop: 48,
434
+ mobile: 32
435
+ },
450
436
  size: {
451
- mobile: 28,
452
- desktop: 40
437
+ desktop: 40,
438
+ mobile: 28
453
439
  },
454
- lineHeight: {
455
- mobile: 32,
456
- desktop: 48
457
- }
440
+ weight: "bold"
458
441
  },
459
442
  text8: {
460
- weight: "bold",
443
+ lineHeight: {
444
+ desktop: 56,
445
+ mobile: 40
446
+ },
461
447
  size: {
462
- mobile: 32,
463
- desktop: 48
448
+ desktop: 48,
449
+ mobile: 32
464
450
  },
465
- lineHeight: {
466
- mobile: 40,
467
- desktop: 56
468
- }
451
+ weight: "bold"
469
452
  },
470
453
  text9: {
471
- weight: "bold",
454
+ lineHeight: {
455
+ desktop: 64,
456
+ mobile: 48
457
+ },
472
458
  size: {
473
- mobile: 40,
474
- desktop: 56
459
+ desktop: 56,
460
+ mobile: 40
475
461
  },
476
- lineHeight: {
477
- mobile: 48,
478
- desktop: 64
479
- }
462
+ weight: "bold"
480
463
  },
481
464
  text10: {
482
- weight: "bold",
465
+ lineHeight: {
466
+ desktop: 72,
467
+ mobile: 56
468
+ },
483
469
  size: {
484
- mobile: 48,
485
- desktop: 64
470
+ desktop: 64,
471
+ mobile: 48
486
472
  },
473
+ weight: "bold"
474
+ },
475
+ title1: {
476
+ weight: "medium"
477
+ },
478
+ title2: {
479
+ weight: "bold"
480
+ },
481
+ title3: {
487
482
  lineHeight: {
488
- mobile: 56,
489
- desktop: 72
490
- }
483
+ desktop: 32,
484
+ mobile: 24
485
+ },
486
+ size: {
487
+ desktop: 28,
488
+ mobile: 20
489
+ },
490
+ weight: "bold"
491
491
  }
492
492
  }
493
493
  });
@@ -330,154 +330,154 @@ const e = {
330
330
  mediaSmall: "8px"
331
331
  },
332
332
  textPresets: {
333
- cardTitle: {
333
+ button: {
334
334
  weight: "medium"
335
335
  },
336
- button: {
336
+ cardTitle: {
337
337
  weight: "medium"
338
338
  },
339
- tabsLabel: {
340
- weight: "medium",
341
- size: {
342
- mobile: 16,
343
- desktop: 18
344
- },
345
- lineHeight: {
346
- mobile: 24,
347
- desktop: 24
348
- }
339
+ indicator: {
340
+ weight: "medium"
349
341
  },
350
342
  link: {
351
343
  weight: "medium"
352
344
  },
353
- title1: {
345
+ navigationBar: {
354
346
  weight: "medium"
355
347
  },
356
- title2: {
357
- weight: "bold"
358
- },
359
- title3: {
360
- weight: "bold",
348
+ tabsLabel: {
349
+ lineHeight: {
350
+ desktop: 24,
351
+ mobile: 24
352
+ },
361
353
  size: {
362
- mobile: 20,
363
- desktop: 28
354
+ desktop: 18,
355
+ mobile: 16
364
356
  },
365
- lineHeight: {
366
- mobile: 24,
367
- desktop: 32
368
- }
369
- },
370
- indicator: {
371
- weight: "medium"
372
- },
373
- navigationBar: {
374
357
  weight: "medium"
375
358
  },
376
359
  text1: {
377
- size: {
378
- mobile: 12,
379
- desktop: 14
380
- },
381
360
  lineHeight: {
382
- mobile: 16,
383
- desktop: 20
361
+ desktop: 20,
362
+ mobile: 16
363
+ },
364
+ size: {
365
+ desktop: 14,
366
+ mobile: 12
384
367
  }
385
368
  },
386
369
  text2: {
387
- size: {
388
- mobile: 14,
389
- desktop: 16
390
- },
391
370
  lineHeight: {
392
- mobile: 20,
393
- desktop: 24
371
+ desktop: 24,
372
+ mobile: 20
373
+ },
374
+ size: {
375
+ desktop: 16,
376
+ mobile: 14
394
377
  }
395
378
  },
396
379
  text3: {
397
- size: {
398
- mobile: 16,
399
- desktop: 18
400
- },
401
380
  lineHeight: {
402
- mobile: 24,
403
- desktop: 24
381
+ desktop: 24,
382
+ mobile: 24
383
+ },
384
+ size: {
385
+ desktop: 18,
386
+ mobile: 16
404
387
  }
405
388
  },
406
389
  text4: {
407
- size: {
408
- mobile: 18,
409
- desktop: 20
410
- },
411
390
  lineHeight: {
412
- mobile: 24,
413
- desktop: 28
391
+ desktop: 28,
392
+ mobile: 24
393
+ },
394
+ size: {
395
+ desktop: 20,
396
+ mobile: 18
414
397
  }
415
398
  },
416
399
  text5: {
417
- weight: "bold",
400
+ lineHeight: {
401
+ desktop: 32,
402
+ mobile: 24
403
+ },
418
404
  size: {
419
- mobile: 20,
420
- desktop: 28
405
+ desktop: 28,
406
+ mobile: 20
421
407
  },
422
- lineHeight: {
423
- mobile: 24,
424
- desktop: 32
425
- }
408
+ weight: "bold"
426
409
  },
427
410
  text6: {
428
- weight: "bold",
411
+ lineHeight: {
412
+ desktop: 40,
413
+ mobile: 32
414
+ },
429
415
  size: {
430
- mobile: 24,
431
- desktop: 32
416
+ desktop: 32,
417
+ mobile: 24
432
418
  },
433
- lineHeight: {
434
- mobile: 32,
435
- desktop: 40
436
- }
419
+ weight: "bold"
437
420
  },
438
421
  text7: {
439
- weight: "bold",
422
+ lineHeight: {
423
+ desktop: 48,
424
+ mobile: 32
425
+ },
440
426
  size: {
441
- mobile: 28,
442
- desktop: 40
427
+ desktop: 40,
428
+ mobile: 28
443
429
  },
444
- lineHeight: {
445
- mobile: 32,
446
- desktop: 48
447
- }
430
+ weight: "bold"
448
431
  },
449
432
  text8: {
450
- weight: "bold",
433
+ lineHeight: {
434
+ desktop: 56,
435
+ mobile: 40
436
+ },
451
437
  size: {
452
- mobile: 32,
453
- desktop: 48
438
+ desktop: 48,
439
+ mobile: 32
454
440
  },
455
- lineHeight: {
456
- mobile: 40,
457
- desktop: 56
458
- }
441
+ weight: "bold"
459
442
  },
460
443
  text9: {
461
- weight: "bold",
444
+ lineHeight: {
445
+ desktop: 64,
446
+ mobile: 48
447
+ },
462
448
  size: {
463
- mobile: 40,
464
- desktop: 56
449
+ desktop: 56,
450
+ mobile: 40
465
451
  },
466
- lineHeight: {
467
- mobile: 48,
468
- desktop: 64
469
- }
452
+ weight: "bold"
470
453
  },
471
454
  text10: {
472
- weight: "bold",
455
+ lineHeight: {
456
+ desktop: 72,
457
+ mobile: 56
458
+ },
473
459
  size: {
474
- mobile: 48,
475
- desktop: 64
460
+ desktop: 64,
461
+ mobile: 48
476
462
  },
463
+ weight: "bold"
464
+ },
465
+ title1: {
466
+ weight: "medium"
467
+ },
468
+ title2: {
469
+ weight: "bold"
470
+ },
471
+ title3: {
477
472
  lineHeight: {
478
- mobile: 56,
479
- desktop: 72
480
- }
473
+ desktop: 32,
474
+ mobile: 24
475
+ },
476
+ size: {
477
+ desktop: 28,
478
+ mobile: 20
479
+ },
480
+ weight: "bold"
481
481
  }
482
482
  }
483
483
  });