@telefonica/mistica 10.12.0 → 10.14.2

package/dist-es/text-link.js

@@ -1,4 +1,4 @@
-import * as React from 'react';
+import { jsx as _jsx } from "react/jsx-runtime";
 import { createUseStyles } from './jss';
 import Touchable from './touchable';
 import classnames from 'classnames';
@@ -16,19 +16,21 @@ function _defineProperty(obj, key, value) {
     }
     return obj;
 }
-function _extends() {
-    _extends = Object.assign || function(target) {
-        for(var i = 1; i < arguments.length; i++){
-            var source = arguments[i];
-            for(var key in source){
-                if (Object.prototype.hasOwnProperty.call(source, key)) {
-                    target[key] = source[key];
-                }
-            }
+function _objectSpread(target) {
+    for(var i = 1; i < arguments.length; 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) {
+                return Object.getOwnPropertyDescriptor(source, sym).enumerable;
+            }));
         }
-        return target;
-    };
-    return _extends.apply(this, arguments);
+        ownKeys.forEach(function(key) {
+            _defineProperty(target, key, source[key]);
+        });
+    }
+    return target;
 }
 function _objectWithoutProperties(source, excluded) {
     if (source == null) return {
@@ -86,10 +88,11 @@ var TextLink = function(_param) {
     var children = _param.children, _className = _param.className, className = _className === void 0 ? '' : _className, small = _param.small, props = _objectWithoutProperties(_param, ["children", "className", "small"]);
     var classes = useStyles();
     var isInverse = useIsInverseVariant();
-    return(/*#__PURE__*/ React.createElement(Touchable, _extends({
+    return(/*#__PURE__*/ _jsx(Touchable, _objectSpread({
     }, props, {
         className: classnames(classes.textLink, className, (_obj = {
-        }, _defineProperty(_obj, classes.small, small), _defineProperty(_obj, classes.inverse, isInverse), _obj))
-    }), children));
+        }, _defineProperty(_obj, classes.small, small), _defineProperty(_obj, classes.inverse, isInverse), _obj)),
+        children: children
+    })));
 };
 export default TextLink;

package/dist-es/text.js

@@ -1,3 +1,4 @@
+import { jsx as _jsx } from "react/jsx-runtime";
 import * as React from 'react';
 import classnames from 'classnames';
 import { createUseStyles } from './jss';
@@ -16,19 +17,21 @@ function _defineProperty(obj, key, value) {
     }
     return obj;
 }
-function _extends() {
-    _extends = Object.assign || function(target) {
-        for(var i = 1; i < arguments.length; i++){
-            var source = arguments[i];
-            for(var key in source){
-                if (Object.prototype.hasOwnProperty.call(source, key)) {
-                    target[key] = source[key];
-                }
-            }
+function _objectSpread(target) {
+    for(var i = 1; i < arguments.length; 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) {
+                return Object.getOwnPropertyDescriptor(source, sym).enumerable;
+            }));
         }
-        return target;
-    };
-    return _extends.apply(this, arguments);
+        ownKeys.forEach(function(key) {
+            _defineProperty(target, key, source[key]);
+        });
+    }
+    return target;
 }
 var _obj;
 var useStyles = createUseStyles(function(theme) {
@@ -144,92 +147,112 @@ var getWeight = function(props) {
     return props.light && 'light' || props.regular && 'regular' || props.medium && 'medium';
 };
 export var Text10 = function(props) {
-    /*#__PURE__*/ return React.createElement(Text, _extends({
+    /*#__PURE__*/ return _jsx(Text, _objectSpread({
         mobileSize: 32,
         mobileLineHeight: "40px",
         desktopSize: 64,
         desktopLineHeight: "72px",
         weight: "light"
-    }, props), props.children);
+    }, props, {
+        children: props.children
+    }));
 };
 export var Text9 = function(props) {
-    /*#__PURE__*/ return React.createElement(Text, _extends({
+    /*#__PURE__*/ return _jsx(Text, _objectSpread({
         mobileSize: 32,
         mobileLineHeight: "40px",
         desktopSize: 56,
         desktopLineHeight: "64px",
         weight: "light"
-    }, props), props.children);
+    }, props, {
+        children: props.children
+    }));
 };
 export var Text8 = function(props) {
-    /*#__PURE__*/ return React.createElement(Text, _extends({
+    /*#__PURE__*/ return _jsx(Text, _objectSpread({
         mobileSize: 32,
         mobileLineHeight: "40px",
         desktopSize: 40,
         desktopLineHeight: "48px",
         weight: "light"
-    }, props), props.children);
+    }, props, {
+        children: props.children
+    }));
 };
 export var Text7 = function(props) {
-    /*#__PURE__*/ return React.createElement(Text, _extends({
+    /*#__PURE__*/ return _jsx(Text, _objectSpread({
         mobileSize: 28,
         mobileLineHeight: "32px",
         desktopSize: 40,
         desktopLineHeight: "48px",
         weight: "light"
-    }, props), props.children);
+    }, props, {
+        children: props.children
+    }));
 };
 export var Text6 = function(props) {
-    /*#__PURE__*/ return React.createElement(Text, _extends({
+    /*#__PURE__*/ return _jsx(Text, _objectSpread({
         mobileSize: 24,
         mobileLineHeight: "32px",
         desktopSize: 32,
         desktopLineHeight: "40px",
         weight: "light"
-    }, props), props.children);
+    }, props, {
+        children: props.children
+    }));
 };
 export var Text5 = function(props) {
-    /*#__PURE__*/ return React.createElement(Text, _extends({
+    /*#__PURE__*/ return _jsx(Text, _objectSpread({
         mobileSize: 22,
         mobileLineHeight: "24px",
         desktopSize: 28,
         desktopLineHeight: "32px",
         weight: "light"
-    }, props), props.children);
+    }, props, {
+        children: props.children
+    }));
 };
 export var Text4 = function(props) {
-    /*#__PURE__*/ return React.createElement(Text, _extends({
+    /*#__PURE__*/ return _jsx(Text, _objectSpread({
         mobileSize: 18,
         mobileLineHeight: "24px",
         desktopSize: 20,
         desktopLineHeight: "28px",
         weight: getWeight(props)
-    }, props), props.children);
+    }, props, {
+        children: props.children
+    }));
 };
 export var Text3 = function(props) {
-    /*#__PURE__*/ return React.createElement(Text, _extends({
+    /*#__PURE__*/ return _jsx(Text, _objectSpread({
         mobileSize: 16,
         desktopSize: 18,
         lineHeight: "24px",
         weight: getWeight(props)
-    }, props), props.children);
+    }, props, {
+        children: props.children
+    }));
 };
 export var Text2 = function(props) {
-    /*#__PURE__*/ return React.createElement(Text, _extends({
+    /*#__PURE__*/ return _jsx(Text, _objectSpread({
         mobileSize: 14,
         mobileLineHeight: "20px",
         desktopSize: 16,
         desktopLineHeight: "24px",
         weight: getRegularOrMediumWeight(props)
-    }, props), props.children);
+    }, props, {
+        children: props.children
+    }));
 };
 export var Text1 = function(props) {
-    /*#__PURE__*/ return React.createElement(Text, _extends({
+    /*#__PURE__*/ return _jsx(Text, _objectSpread({
         mobileSize: 12,
         mobileLineHeight: "16px",
         desktopSize: 14,
         desktopLineHeight: "20px",
         weight: getRegularOrMediumWeight(props)
-    }, props), props.children);
+    }, props, {
+        children: props.children
+    }));
 };
 export default Text;

package/dist-es/theme-context-provider.js

@@ -1,3 +1,4 @@
+import { jsx as _jsx } from "react/jsx-runtime";
 import * as React from 'react';
 import { JssProvider } from 'react-jss';
 import { createGenerateId } from 'jss';
@@ -162,16 +163,28 @@ var ThemeContextProvider = function(param) {
         theme,
         isOsDarkModeEnabled
     ]);
-    return(/*#__PURE__*/ React.createElement(PortalNodesProvider, null, /*#__PURE__*/ React.createElement(JssProvider, {
-        jss: getJss(),
-        classNamePrefix: classNamePrefix,
-        generateId: generateId
-    }, /*#__PURE__*/ React.createElement(TabFocus, {
-        disabled: !theme.enableTabFocus
-    }, /*#__PURE__*/ React.createElement(ModalContextProvider, null, /*#__PURE__*/ React.createElement(ThemeContext.Provider, {
-        value: contextTheme
-    }, /*#__PURE__*/ React.createElement(AriaIdGetterContext.Provider, {
-        value: getAriaId
-    }, /*#__PURE__*/ React.createElement(ScreenSizeContextProvider, null, /*#__PURE__*/ React.createElement(DialogRoot, null, children)))))))));
+    return(/*#__PURE__*/ _jsx(PortalNodesProvider, {
+        children: /*#__PURE__*/ _jsx(JssProvider, {
+            jss: getJss(),
+            classNamePrefix: classNamePrefix,
+            generateId: generateId,
+            children: /*#__PURE__*/ _jsx(TabFocus, {
+                disabled: !theme.enableTabFocus,
+                children: /*#__PURE__*/ _jsx(ModalContextProvider, {
+                    children: /*#__PURE__*/ _jsx(ThemeContext.Provider, {
+                        value: contextTheme,
+                        children: /*#__PURE__*/ _jsx(AriaIdGetterContext.Provider, {
+                            value: getAriaId,
+                            children: /*#__PURE__*/ _jsx(ScreenSizeContextProvider, {
+                                children: /*#__PURE__*/ _jsx(DialogRoot, {
+                                    children: children
+                                })
+                            })
+                        })
+                    })
+                })
+            })
+        })
+    }));
 };
 export default ThemeContextProvider;

package/dist-es/theme-variant-context.js

@@ -1,10 +1,12 @@
+import { jsx as _jsx } from "react/jsx-runtime";
 import * as React from 'react';
 var IsInverseThemeVariant = /*#__PURE__*/ React.createContext(false);
 export var ThemeVariant = function(param) {
     var isInverse = param.isInverse, children = param.children;
-    /*#__PURE__*/ return React.createElement(IsInverseThemeVariant.Provider, {
-        value: !!isInverse
-    }, children);
+    /*#__PURE__*/ return _jsx(IsInverseThemeVariant.Provider, {
+        value: !!isInverse,
+        children: children
+    });
 };
 export var useIsInverseVariant = function() {
     return React.useContext(IsInverseThemeVariant);

package/dist-es/theme.js

@@ -1,17 +1,32 @@
-import * as React from 'react';
-function _extends() {
-    _extends = Object.assign || function(target) {
-        for(var i = 1; i < arguments.length; i++){
-            var source = arguments[i];
-            for(var key in source){
-                if (Object.prototype.hasOwnProperty.call(source, key)) {
-                    target[key] = source[key];
-                }
-            }
+import { jsx as _jsx } from "react/jsx-runtime";
+function _defineProperty(obj, key, value) {
+    if (key in obj) {
+        Object.defineProperty(obj, key, {
+            value: value,
+            enumerable: true,
+            configurable: true,
+            writable: true
+        });
+    } else {
+        obj[key] = value;
+    }
+    return obj;
+}
+function _objectSpread(target) {
+    for(var i = 1; i < arguments.length; 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) {
+                return Object.getOwnPropertyDescriptor(source, sym).enumerable;
+            }));
         }
-        return target;
-    };
-    return _extends.apply(this, arguments);
+        ownKeys.forEach(function(key) {
+            _defineProperty(target, key, source[key]);
+        });
+    }
+    return target;
 }
 function _objectWithoutProperties(source, excluded) {
     if (source == null) return {
@@ -194,9 +209,11 @@ export var mediaQueriesConfig = {
 };
 var AnchorLink = function(_param) {
     var to = _param.to, innerRef = _param.innerRef, props = _objectWithoutProperties(_param, ["to", "innerRef"]);
-    return(/*#__PURE__*/ React.createElement("a", _extends({
+    return(/*#__PURE__*/ _jsx("a", _objectSpread({
         ref: innerRef,
         href: typeof to === 'string' ? to : to === null || to === void 0 ? void 0 : to.pathname
-    }, props), props.children));
+    }, props, {
+        children: props.children
+    })));
 };
 export { AnchorLink };

package/dist-es/tooltip.js

@@ -1,3 +1,4 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import * as React from 'react';
 import classnames from 'classnames';
 import { useAriaId, useScreenSize } from './hooks';
@@ -289,36 +290,60 @@ var Tooltip = function(_param) {
         left: classes.arrowLeft,
         right: classes.arrowRight
     };
-    return(/*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement("div", {
-        className: classes.wrapper,
-        onPointerDown: toggleVisibility,
-        onFocus: handleFocus,
-        onKeyDown: handleKeyDown,
-        "touch-action": "auto" // Prop needed for Pointer Events Polyfill to work properly
-        ,
-        role: "button",
-        tabIndex: 0,
-        "aria-describedby": ariaId,
-        "aria-expanded": isVisible,
-        "aria-label": targetLabel
-    }, target), isVisible && /*#__PURE__*/ React.createElement(Portal, null, /*#__PURE__*/ React.createElement(Overlay, {
-        onPress: handleClickOutside
-    }), /*#__PURE__*/ React.createElement("div", {
-        role: "tooltip",
-        id: ariaId,
-        className: classes.container,
-        style: _objectSpread({
-            width: width
-        }, getContainerPosition(position, width))
-    }, /*#__PURE__*/ React.createElement("div", {
-        className: classnames(classes.arrowWrapper, classNameByPosition[position]),
-        style: getCustomStylesForMobile()
-    }, /*#__PURE__*/ React.createElement("div", {
-        className: classes.arrow
-    })), (title || description) && /*#__PURE__*/ React.createElement(React.Fragment, null, title && /*#__PURE__*/ React.createElement("p", {
-        className: classes.title
-    }, title), description && /*#__PURE__*/ React.createElement("p", {
-        className: classes.description
-    }, description)), children))));
+    return(/*#__PURE__*/ _jsxs(_Fragment, {
+        children: [
+            /*#__PURE__*/ _jsx("div", {
+                className: classes.wrapper,
+                onPointerDown: toggleVisibility,
+                onFocus: handleFocus,
+                onKeyDown: handleKeyDown,
+                "touch-action": "auto" // Prop needed for Pointer Events Polyfill to work properly
+                ,
+                role: "button",
+                tabIndex: 0,
+                "aria-describedby": ariaId,
+                "aria-expanded": isVisible,
+                "aria-label": targetLabel,
+                children: target
+            }),
+            isVisible && /*#__PURE__*/ _jsxs(Portal, {
+                children: [
+                    /*#__PURE__*/ _jsx(Overlay, {
+                        onPress: handleClickOutside
+                    }),
+                    /*#__PURE__*/ _jsxs("div", {
+                        role: "tooltip",
+                        id: ariaId,
+                        className: classes.container,
+                        style: _objectSpread({
+                            width: width
+                        }, getContainerPosition(position, width)),
+                        children: [
+                            /*#__PURE__*/ _jsx("div", {
+                                className: classnames(classes.arrowWrapper, classNameByPosition[position]),
+                                style: getCustomStylesForMobile(),
+                                children: /*#__PURE__*/ _jsx("div", {
+                                    className: classes.arrow
+                                })
+                            }),
+                            (title || description) && /*#__PURE__*/ _jsxs(_Fragment, {
+                                children: [
+                                    title && /*#__PURE__*/ _jsx("p", {
+                                        className: classes.title,
+                                        children: title
+                                    }),
+                                    description && /*#__PURE__*/ _jsx("p", {
+                                        className: classes.description,
+                                        children: description
+                                    })
+                                ]
+                            }),
+                            children
+                        ]
+                    })
+                ]
+            })
+        ]
+    }));
 };
 export default Tooltip;

package/dist-es/touchable.js

@@ -1,3 +1,4 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import * as React from 'react';
 import classnames from 'classnames';
 import ScreenReaderOnly from './screen-reader-only';
@@ -19,20 +20,6 @@ function _defineProperty(obj, key, value) {
     }
     return obj;
 }
-function _extends() {
-    _extends = Object.assign || function(target) {
-        for(var i = 1; i < arguments.length; i++){
-            var source = arguments[i];
-            for(var key in source){
-                if (Object.prototype.hasOwnProperty.call(source, key)) {
-                    target[key] = source[key];
-                }
-            }
-        }
-        return target;
-    };
-    return _extends.apply(this, arguments);
-}
 function _objectSpread(target) {
     for(var i = 1; i < arguments.length; i++){
         var source = arguments[i] != null ? arguments[i] : {
@@ -93,8 +80,8 @@ var useStyles = createUseStyles(function() {
         }
     };
 });
-var Touchable = function(props) {
-    var ref = useTheme(), texts = ref.texts, analytics = ref.analytics, platformOverrides = ref.platformOverrides, Link = ref.Link;
+var Touchable = /*#__PURE__*/ React.forwardRef(function(props, ref) {
+    var ref1 = useTheme(), texts = ref1.texts, analytics = ref1.analytics, platformOverrides = ref1.platformOverrides, Link = ref1.Link;
     var classes = useStyles();
     var isClicked = React.useRef(false);
     var trackingEvents = [];
@@ -180,7 +167,7 @@ var Touchable = function(props) {
         }
     };
     if (!!props.href || props.to && props.fullPageOnWebView && isInsideNovumNativeApp(platformOverrides)) {
-        return(/*#__PURE__*/ React.createElement("a", _extends({
+        return(/*#__PURE__*/ _jsxs("a", _objectSpread({
         }, commonProps, {
             "aria-label": props['aria-label'],
             "aria-labelledby": props['aria-labelledby'],
@@ -188,23 +175,35 @@ var Touchable = function(props) {
             onKeyDown: handleKeyDown,
             href: props.disabled ? '' : getHref(),
             target: openNewTab ? '_blank' : undefined,
-            rel: openNewTab ? 'noopener noreferrer' : undefined
-        }), children, openNewTab && /*#__PURE__*/ React.createElement(ScreenReaderOnly, null, /*#__PURE__*/ React.createElement("span", null, texts.linkOpensInNewTab))));
+            rel: openNewTab ? 'noopener noreferrer' : undefined,
+            ref: ref,
+            children: [
+                children,
+                openNewTab && /*#__PURE__*/ _jsx(ScreenReaderOnly, {
+                    children: /*#__PURE__*/ _jsx("span", {
+                        children: texts.linkOpensInNewTab
+                    })
+                })
+            ]
+        })));
     }
     if (props.to) {
-        return(/*#__PURE__*/ React.createElement(Link, _extends({
+        var ref2;
+        return(/*#__PURE__*/ _jsx(Link, _objectSpread({
         }, commonProps, {
             "aria-label": props['aria-label'],
             "aria-labelledby": props['aria-labelledby'],
-            innerRef: props.elementRef,
+            innerRef: (ref2 = props.elementRef) !== null && ref2 !== void 0 ? ref2 : ref,
             to: props.disabled ? '' : props.to,
             replace: props.replace,
             onClick: trackEvent,
-            onKeyDown: handleKeyDown
-        }), children));
+            onKeyDown: handleKeyDown,
+            children: children
+        })));
     }
     if (props.onPress) {
-        return(/*#__PURE__*/ React.createElement("button", _extends({
+        var ref2;
+        return(/*#__PURE__*/ _jsx("button", _objectSpread({
         }, commonProps, {
             // this "form" attribute is useful when the form's submit button
             // is located outside the <form> element, for example if you use
@@ -214,14 +213,17 @@ var Touchable = function(props) {
             "aria-label": props['aria-label'],
             "aria-labelledby": props['aria-labelledby'],
             type: type,
-            ref: props.elementRef,
-            onClick: handleButtonClick
-        }), children));
+            ref: (ref2 = props.elementRef) !== null && ref2 !== void 0 ? ref2 : ref,
+            onClick: handleButtonClick,
+            children: children
+        })));
     }
-    return(/*#__PURE__*/ React.createElement("div", _extends({
+    var ref2;
+    return(/*#__PURE__*/ _jsx("div", _objectSpread({
     }, commonProps, {
-        ref: props.elementRef,
-        className: classnames(commonProps.className, classes.notTouchable)
-    }), children));
-};
+        ref: (ref2 = props.elementRef) !== null && ref2 !== void 0 ? ref2 : ref,
+        className: classnames(commonProps.className, classes.notTouchable),
+        children: children
+    })));
+});
 export default Touchable;