@telefonica/mistica 10.23.0 → 10.24.0

package/dist-es/button.js

@@ -9,6 +9,11 @@ import { useForm } from './form-context';
 import { pxToRem } from './utils/css';
 import { Text, Text2, Text3 } from './text';
 import Box from './box';
+function _arrayLikeToArray(arr, len) {
+    if (len == null || len > arr.length) len = arr.length;
+    for(var i = 0, arr2 = new Array(len); i < len; i++)arr2[i] = arr[i];
+    return arr2;
+}
 function _arrayWithHoles(arr) {
     if (Array.isArray(arr)) return arr;
 }
@@ -26,12 +31,14 @@ function _defineProperty(obj, key, value) {
     return obj;
 }
 function _iterableToArrayLimit(arr, i) {
+    var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"];
+    if (_i == null) return;
     var _arr = [];
     var _n = true;
     var _d = false;
-    var _e = undefined;
+    var _s, _e;
     try {
-        for(var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true){
+        for(_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true){
             _arr.push(_s.value);
             if (i && _arr.length === i) break;
         }
@@ -48,12 +55,11 @@ function _iterableToArrayLimit(arr, i) {
     return _arr;
 }
 function _nonIterableRest() {
-    throw new TypeError("Invalid attempt to destructure non-iterable instance");
+    throw new TypeError("Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
 }
 function _objectSpread(target) {
     for(var i = 1; i < arguments.length; i++){
-        var source = arguments[i] != null ? arguments[i] : {
-        };
+        var source = arguments[i] != null ? arguments[i] : {};
         var ownKeys = Object.keys(source);
         if (typeof Object.getOwnPropertySymbols === "function") {
             ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function(sym) {
@@ -67,7 +73,15 @@ function _objectSpread(target) {
     return target;
 }
 function _slicedToArray(arr, i) {
-    return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _nonIterableRest();
+    return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest();
+}
+function _unsupportedIterableToArray(o, minLen) {
+    if (!o) return;
+    if (typeof o === "string") return _arrayLikeToArray(o, minLen);
+    var n = Object.prototype.toString.call(o).slice(8, -1);
+    if (n === "Object" && o.constructor) n = o.constructor.name;
+    if (n === "Map" || n === "Set") return Array.from(n);
+    if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen);
 }
 export var BUTTON_MIN_WIDTH = 136;
 var transitionTiming = '0.3s cubic-bezier(0.77, 0, 0.175, 1)';
@@ -147,8 +161,7 @@ var disabledStyle = {
     opacity: 0.5
 };
 var usePrimaryButtonStyles = createUseStyles(function(theme) {
-    return _objectSpread({
-    }, commonClasses(), {
+    return _objectSpread({}, commonClasses(), {
         light: {
             color: theme.colors.textButtonPrimary,
             backgroundColor: theme.colors.buttonPrimaryBackground,
@@ -204,17 +217,12 @@ var buttonSecondaryHoverLightStyle = function(theme) {
     };
 };
 var useSecondaryButtonStyles = createUseStyles(function(theme) {
-    return _objectSpread({
-    }, commonClasses(), {
-        light: _objectSpread({
-        }, buttonSecondaryLightStyle(theme), {
-            '&:enabled:active': _objectSpread({
-            }, buttonSecondaryHoverLightStyle(theme)),
+    return _objectSpread({}, commonClasses(), {
+        light: _objectSpread({}, buttonSecondaryLightStyle(theme), {
+            '&:enabled:active': _objectSpread({}, buttonSecondaryHoverLightStyle(theme)),
             '&[disabled]:not($isLoading)': disabledStyle,
-            '&:hover:not([disabled])': _objectSpread({
-            }, buttonSecondaryHoverLightStyle(theme), {
-                '@media (pointer: coarse)': _objectSpread({
-                }, buttonSecondaryLightStyle(theme))
+            '&:hover:not([disabled])': _objectSpread({}, buttonSecondaryHoverLightStyle(theme), {
+                '@media (pointer: coarse)': _objectSpread({}, buttonSecondaryLightStyle(theme))
             })
         }),
         inverse: {
@@ -256,13 +264,11 @@ var dangerButtonStyles = function(theme) {
     };
 };
 var useDangerButtonStyles = createUseStyles(function(theme) {
-    return _objectSpread({
-    }, commonClasses(), {
+    return _objectSpread({}, commonClasses(), {
         light: dangerButtonStyles(theme),
         inverse: dangerButtonStyles(theme)
     });
 });
-var _obj;
 var Button = function(props) {
     var ref = useForm(), formStatus = ref.formStatus, formId = ref.formId;
     var isInverse = useIsInverseVariant();
@@ -302,9 +308,9 @@ var Button = function(props) {
             children: text
         });
     };
+    var _obj;
     var commonProps = {
-        className: classnames(classes.button, props.className, (_obj = {
-        }, _defineProperty(_obj, classes.small, props.small), _defineProperty(_obj, classes.inverse, isInverse), _defineProperty(_obj, classes.light, !isInverse), _defineProperty(_obj, classes.isLoading, showSpinner), _obj)),
+        className: classnames(classes.button, props.className, (_obj = {}, _defineProperty(_obj, classes.small, props.small), _defineProperty(_obj, classes.inverse, isInverse), _defineProperty(_obj, classes.light, !isInverse), _defineProperty(_obj, classes.isLoading, showSpinner), _obj)),
         style: _objectSpread({
             cursor: props.fake ? 'pointer' : undefined
         }, props.style),
@@ -379,26 +385,22 @@ var Button = function(props) {
         return(/*#__PURE__*/ _jsx(Touchable, _objectSpread({
             type: "submit",
             formId: formId,
-            onPress: function() {
-            }
+            onPress: function() {}
         }, commonProps)));
     }
     if (props.onPress) {
-        return(/*#__PURE__*/ _jsx(Touchable, _objectSpread({
-        }, commonProps, {
+        return(/*#__PURE__*/ _jsx(Touchable, _objectSpread({}, commonProps, {
             onPress: props.onPress
         })));
     }
     if (props.to || props.to === '') {
-        return(/*#__PURE__*/ _jsx(Touchable, _objectSpread({
-        }, commonProps, {
+        return(/*#__PURE__*/ _jsx(Touchable, _objectSpread({}, commonProps, {
             to: props.to,
             fullPageOnWebView: props.fullPageOnWebView
         })));
     }
     if (props.href || props.href === '') {
-        return(/*#__PURE__*/ _jsx(Touchable, _objectSpread({
-        }, commonProps, {
+        return(/*#__PURE__*/ _jsx(Touchable, _objectSpread({}, commonProps, {
             href: props.href,
             newTab: props.newTab
         })));
@@ -448,13 +450,12 @@ var useButtonLinkStyles = createUseStyles(function(theme) {
         }
     };
 });
-var _obj1;
 export var ButtonLink = /*#__PURE__*/ React.forwardRef(function(props, ref) {
     var classes = useButtonLinkStyles();
     var isInverse = useIsInverseVariant();
+    var _obj;
     var commonProps = {
-        className: classnames(classes.link, (_obj1 = {
-        }, _defineProperty(_obj1, classes.inverse, isInverse), _defineProperty(_obj1, classes.aligned, props.aligned), _obj1)),
+        className: classnames(classes.link, (_obj = {}, _defineProperty(_obj, classes.inverse, isInverse), _defineProperty(_obj, classes.aligned, props.aligned), _obj)),
         trackingEvent: props.trackingEvent,
         dataAttributes: props.dataAttributes,
         children: /*#__PURE__*/ _jsx(Text2, {
@@ -500,22 +501,19 @@ export var ButtonLink = /*#__PURE__*/ React.forwardRef(function(props, ref) {
 });
 export var ButtonPrimary = function(props) {
     var classes = usePrimaryButtonStyles();
-    return(/*#__PURE__*/ _jsx(Button, _objectSpread({
-    }, props, {
+    return(/*#__PURE__*/ _jsx(Button, _objectSpread({}, props, {
         classes: classes
     })));
 };
 export var ButtonSecondary = function(props) {
     var classes = useSecondaryButtonStyles();
-    return(/*#__PURE__*/ _jsx(Button, _objectSpread({
-    }, props, {
+    return(/*#__PURE__*/ _jsx(Button, _objectSpread({}, props, {
         classes: classes
     })));
 };
 export var ButtonDanger = function(props) {
     var classes = useDangerButtonStyles();
-    return(/*#__PURE__*/ _jsx(Button, _objectSpread({
-    }, props, {
+    return(/*#__PURE__*/ _jsx(Button, _objectSpread({}, props, {
         classes: classes
     })));
 };

package/dist-es/callout.js

@@ -1,4 +1,5 @@
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import * as React from 'react';
 import Stack from './stack';
 import { useTheme } from './hooks';
 import { ThemeVariant, useIsInverseVariant } from './theme-variant-context';
@@ -57,8 +58,7 @@ var Callout = function(param) {
     });
     var ref = useTheme(), colors = ref.colors, texts = ref.texts;
     return(/*#__PURE__*/ _jsx("section", {
-        className: classNames(classes.container, _defineProperty({
-        }, classes.overInverse, isInverse)),
+        className: classNames(classes.container, _defineProperty({}, classes.overInverse, isInverse)),
         "aria-label": ariaLabel !== null && ariaLabel !== void 0 ? ariaLabel : title,
         children: /*#__PURE__*/ _jsxs(ThemeVariant, {
             isInverse: false,

package/dist-es/card.js

@@ -42,7 +42,7 @@ var CardContent = function(param) {
                 children: [
                     (headline || pretitle || title || subtitle) && /*#__PURE__*/ _jsx("header", {
                         children: /*#__PURE__*/ _jsxs(Stack, {
-                            space: 16,
+                            space: 8,
                             children: [
                                 renderHeadline(),
                                 /*#__PURE__*/ _jsxs(Stack, {