@telefonica/mistica 10.13.0 → 10.15.0

package/dist-es/navigation-breadcrumbs.js

@@ -1,3 +1,4 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import * as React from 'react';
 import { Text1 } from './text';
 import { useTheme } from './hooks';
@@ -6,23 +7,35 @@ var NavigationBreadcrumbs = function(param) {
     var title = param.title, breadcrumbs = param.breadcrumbs;
     var theme = useTheme();
     var Link = theme.Link;
-    return(/*#__PURE__*/ React.createElement("div", null, breadcrumbs.map(function(param, index) {
-        var title = param.title, url = param.url;
-        /*#__PURE__*/ return React.createElement(React.Fragment, {
-            key: index
-        }, /*#__PURE__*/ React.createElement(Link, {
-            style: {
-                textDecoration: 'none'
-            },
-            to: url
-        }, /*#__PURE__*/ React.createElement(Text1, {
-            regular: true
-        }, title)), /*#__PURE__*/ React.createElement(Text1, {
-            regular: true
-        }, BREADCRUMB_SEPARATOR));
-    }), /*#__PURE__*/ React.createElement(Text1, {
-        regular: true,
-        color: theme.colors.textSecondary
-    }, title)));
+    return(/*#__PURE__*/ _jsxs("div", {
+        children: [
+            breadcrumbs.map(function(param, index) {
+                var title = param.title, url = param.url;
+                /*#__PURE__*/ return _jsxs(React.Fragment, {
+                    children: [
+                        /*#__PURE__*/ _jsx(Link, {
+                            style: {
+                                textDecoration: 'none'
+                            },
+                            to: url,
+                            children: /*#__PURE__*/ _jsx(Text1, {
+                                regular: true,
+                                children: title
+                            })
+                        }),
+                        /*#__PURE__*/ _jsx(Text1, {
+                            regular: true,
+                            children: BREADCRUMB_SEPARATOR
+                        })
+                    ]
+                }, index);
+            }),
+            /*#__PURE__*/ _jsx(Text1, {
+                regular: true,
+                color: theme.colors.textSecondary,
+                children: title
+            })
+        ]
+    }));
 };
 export default NavigationBreadcrumbs;

package/dist-es/negative-box.js

@@ -1,4 +1,4 @@
-import * as React from 'react';
+import { jsx as _jsx } from "react/jsx-runtime";
 import { createUseStyles } from './jss';
 var useStyles = createUseStyles(function() {
     return {
@@ -22,8 +22,9 @@ var NegativeBox = function(param) {
         marginLeft: marginLeft,
         marginRight: marginRight
     });
-    return(/*#__PURE__*/ React.createElement("div", {
-        className: classes.negativeBox
-    }, children));
+    return(/*#__PURE__*/ _jsx("div", {
+        className: classes.negativeBox,
+        children: children
+    }));
 };
 export default NegativeBox;

package/dist-es/nestable-context.js

@@ -1,3 +1,4 @@
+import { jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
 import * as React from 'react';
 import isEqual from 'lodash/isEqual';
 function _arrayWithHoles(arr) {
@@ -109,11 +110,13 @@ var createNestableContext = function(defaultValue) {
                 computedValue = values[values.length - 1];
             }
         }
-        return(/*#__PURE__*/ React.createElement(DispatchContext.Provider, {
-            value: dispatch
-        }, /*#__PURE__*/ React.createElement(ValueContext.Provider, {
-            value: computedValue
-        }, children)));
+        return(/*#__PURE__*/ _jsx(DispatchContext.Provider, {
+            value: dispatch,
+            children: /*#__PURE__*/ _jsx(ValueContext.Provider, {
+                value: computedValue,
+                children: children
+            })
+        }));
     };
     var useSetValue = function(value) {
         var dispatch = React.useContext(DispatchContext);
@@ -143,7 +146,9 @@ var createNestableContext = function(defaultValue) {
     };
     var Getter = function(param) {
         var children = param.children;
-        /*#__PURE__*/ return React.createElement(React.Fragment, null, children(useValue()));
+        /*#__PURE__*/ return _jsx(_Fragment, {
+            children: children(useValue())
+        });
     };
     return {
         Setter: Setter,

package/dist-es/overlay.js

@@ -1,3 +1,4 @@
+import { jsx as _jsx } from "react/jsx-runtime";
 import * as React from 'react';
 import { isAndroid, isChrome } from './utils/platform';
 import { useDisableBodyScroll, useTheme } from './hooks';
@@ -82,7 +83,7 @@ var Overlay = function(param) {
             onPress(event);
         }
     };
-    return(/*#__PURE__*/ React.createElement("div", {
+    return(/*#__PURE__*/ _jsx("div", {
         "data-overlay": "true",
         style: _objectSpread({
         }, defaultStyle, style),
@@ -110,7 +111,8 @@ var Overlay = function(param) {
         ,
         onContextMenu: handleContextMenu,
         role: "button",
-        tabIndex: 0
-    }, showChildren && children));
+        tabIndex: 0,
+        children: showChildren && children
+    }));
 };
 export default Overlay;

package/dist-es/overscroll-color-context.js

@@ -1,4 +1,4 @@
-import * as React from 'react';
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { useIsInverseVariant } from './theme-variant-context';
 import { useTheme, useScreenSize } from './hooks';
 import createNestableContext from './nestable-context';
@@ -7,27 +7,40 @@ var ref = createNestableContext(''), Provider = ref.Provider, Getter = ref.Gette
 var shouldRender = getPlatform() === 'ios';
 var OverscrollColorProviderNoOp = function(param) {
     var children = param.children;
-    /*#__PURE__*/ return React.createElement(React.Fragment, null, children || null);
+    /*#__PURE__*/ return _jsx(_Fragment, {
+        children: children || null
+    });
 };
 var OverscrollColorProviderComponent = function(param) {
     var children = param.children;
     var ref = useTheme(), platformOverrides = ref.platformOverrides;
     var ref1 = useScreenSize(), isTabletOrSmaller = ref1.isTabletOrSmaller;
     var theme = useTheme();
-    return isTabletOrSmaller ? /*#__PURE__*/ React.createElement(Provider, null, /*#__PURE__*/ React.createElement(Getter, null, function(color) {
-        /*#__PURE__*/ return React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement("div", {
-            style: {
-                position: 'absolute',
-                zIndex: 1,
-                background: color || theme.colors.background,
-                width: '100%',
-                height: 500 + (isInsideNovumNativeApp(platformOverrides) ? 0 : theme.dimensions.headerMobileHeight),
-                left: 0,
-                marginTop: -500,
-                transform: 'translate3d(0,0,0)'
+    return isTabletOrSmaller ? /*#__PURE__*/ _jsx(Provider, {
+        children: /*#__PURE__*/ _jsx(Getter, {
+            children: function(color) {
+                /*#__PURE__*/ return _jsxs(_Fragment, {
+                    children: [
+                        /*#__PURE__*/ _jsx("div", {
+                            style: {
+                                position: 'absolute',
+                                zIndex: 1,
+                                background: color || theme.colors.background,
+                                width: '100%',
+                                height: 500 + (isInsideNovumNativeApp(platformOverrides) ? 0 : theme.dimensions.headerMobileHeight),
+                                left: 0,
+                                marginTop: -500,
+                                transform: 'translate3d(0,0,0)'
+                            }
+                        }),
+                        children
+                    ]
+                });
             }
-        }), children);
-    })) : /*#__PURE__*/ React.createElement(React.Fragment, null, children);
+        })
+    }) : /*#__PURE__*/ _jsx(_Fragment, {
+        children: children
+    });
 };
 export var OverscrollColorProvider = shouldRender ? OverscrollColorProviderComponent : OverscrollColorProviderNoOp;
 var OverscrollColorComponent = function() {

package/dist-es/package-version.js

@@ -1,2 +1,2 @@
-import { version } from '../package.json';
-export var PACKAGE_VERSION = version;
+// DO NOT EDIT THIS FILE. It's autogenerated by set-version.js
+export var PACKAGE_VERSION = '10.15.0';

package/dist-es/password-field.js

@@ -1,3 +1,4 @@
+import { jsx as _jsx } from "react/jsx-runtime";
 import * as React from 'react';
 import { useFieldProps } from './form-context';
 import TextFieldBase from './text-field-base';
@@ -22,20 +23,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 _iterableToArrayLimit(arr, i) {
     var _arr = [];
     var _n = true;
@@ -61,6 +48,22 @@ function _iterableToArrayLimit(arr, i) {
 function _nonIterableRest() {
     throw new TypeError("Invalid attempt to destructure non-iterable instance");
 }
+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;
+            }));
+        }
+        ownKeys.forEach(function(key) {
+            _defineProperty(target, key, source[key]);
+        });
+    }
+    return target;
+}
 function _objectWithoutProperties(source, excluded) {
     if (source == null) return {
     };
@@ -115,7 +118,7 @@ var PasswordAdornment = function(param) {
         borderRadius: '50%',
         backgroundColor: undefined
     };
-    return(/*#__PURE__*/ React.createElement(IconButton, {
+    return(/*#__PURE__*/ _jsx(IconButton, {
         "aria-label": texts.togglePasswordVisibilityLabel,
         onPress: function() {
             setVisibility(!isVisible);
@@ -123,8 +126,11 @@ var PasswordAdornment = function(param) {
         },
         size: 48,
         className: classes.shadow,
-        style: style
-    }, isVisible ? /*#__PURE__*/ React.createElement(VisibilityOff, null) : /*#__PURE__*/ React.createElement(Visibility, null)));
+        style: style,
+        children: isVisible ? /*#__PURE__*/ _jsx(VisibilityOff, {
+        }) : /*#__PURE__*/ _jsx(Visibility, {
+        })
+    }));
 };
 var PasswordField = function(_param) {
     var disabled = _param.disabled, error = _param.error, helperText = _param.helperText, name = _param.name, optional = _param.optional, validate = _param.validate, onChange = _param.onChange, onChangeValue = _param.onChangeValue, onBlur = _param.onBlur, value = _param.value, _autoComplete = _param.autoComplete, autoComplete = _autoComplete === void 0 ? 'current-password' : _autoComplete, defaultValue = _param.defaultValue, rest = _objectWithoutProperties(_param, ["disabled", "error", "helperText", "name", "optional", "validate", "onChange", "onChangeValue", "onBlur", "value", "autoComplete", "defaultValue"]);
@@ -168,7 +174,7 @@ var PasswordField = function(_param) {
         onChange: onChange,
         onChangeValue: onChangeValue
     });
-    return(/*#__PURE__*/ React.createElement(TextFieldBase, _extends({
+    return(/*#__PURE__*/ _jsx(TextFieldBase, _objectSpread({
     }, rest, fieldProps, {
         type: isVisible ? 'text' : 'password',
         inputRef: function(field) {
@@ -177,7 +183,7 @@ var PasswordField = function(_param) {
             inputRef.current = field;
         },
         autoComplete: autoComplete,
-        endIcon: /*#__PURE__*/ React.createElement(PasswordAdornment, {
+        endIcon: /*#__PURE__*/ _jsx(PasswordAdornment, {
             focus: focus,
             isVisible: isVisible,
             setVisibility: setIsVisible

package/dist-es/phone-number-field.js

@@ -1,3 +1,4 @@
+import { jsx as _jsx } from "react/jsx-runtime";
 import * as React from 'react';
 import { useRifm } from 'rifm';
 import { formatAsYouType, formatToE164, parse, getRegionCodeForCountryCode } from '@telefonica/libphonenumber';
@@ -9,19 +10,18 @@ import { combineRefs } from './utils/common';
 function _arrayWithHoles(arr) {
     if (Array.isArray(arr)) return arr;
 }
-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 _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 _iterableToArrayLimit(arr, i) {
     var _arr = [];
@@ -48,6 +48,22 @@ function _iterableToArrayLimit(arr, i) {
 function _nonIterableRest() {
     throw new TypeError("Invalid attempt to destructure non-iterable instance");
 }
+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;
+            }));
+        }
+        ownKeys.forEach(function(key) {
+            _defineProperty(target, key, source[key]);
+        });
+    }
+    return target;
+}
 function _objectWithoutProperties(source, excluded) {
     if (source == null) return {
     };
@@ -139,7 +155,7 @@ var PhoneInput = function(_param) {
             return s.replace(/@/g, '-');
         }
     });
-    return(/*#__PURE__*/ React.createElement("input", _extends({
+    return(/*#__PURE__*/ _jsx("input", _objectSpread({
     }, other, {
         value: rifm.value,
         onChange: rifm.onChange,
@@ -183,7 +199,7 @@ var PhoneNumberField = function(_param) {
         onChange: onChange,
         onChangeValue: onChangeValue
     });
-    return(/*#__PURE__*/ React.createElement(TextFieldBase, _extends({
+    return(/*#__PURE__*/ _jsx(TextFieldBase, _objectSpread({
     }, rest, fieldProps, {
         type: "phone",
         inputProps: {

package/dist-es/placeholder.js

@@ -1,9 +1,9 @@
-import * as React from 'react';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { applyAlpha } from './utils/color';
 import { useTheme } from './hooks';
 export var AvatarPlaceholder = function(param) {
     var _size = param.size, size = _size === void 0 ? '100%' : _size;
-    /*#__PURE__*/ return React.createElement("div", {
+    /*#__PURE__*/ return _jsx("div", {
         style: {
             width: size,
             height: size,
@@ -15,7 +15,7 @@ export var AvatarPlaceholder = function(param) {
 export var Placeholder = function(param) {
     var _width = param.width, width = _width === void 0 ? 'auto' : _width, _height = param.height, height = _height === void 0 ? 120 : _height;
     var ref = useTheme(), colors = ref.colors;
-    return(/*#__PURE__*/ React.createElement("div", {
+    return(/*#__PURE__*/ _jsx("div", {
         style: {
             height: height,
             width: width,
@@ -23,27 +23,32 @@ export var Placeholder = function(param) {
             background: applyAlpha(colors.neutralHigh, 0.08),
             border: "2px solid ".concat(applyAlpha(colors.neutralHigh, 0.3)),
             position: 'relative'
-        }
-    }, /*#__PURE__*/ React.createElement("svg", {
-        width: "100%",
-        height: "100%"
-    }, /*#__PURE__*/ React.createElement("line", {
-        style: {
-            strokeWidth: 2,
-            stroke: applyAlpha(colors.neutralHigh, 0.1)
-        },
-        x1: 0,
-        y1: 0,
-        x2: "100%",
-        y2: "100%"
-    }), /*#__PURE__*/ React.createElement("line", {
-        style: {
-            strokeWidth: 2,
-            stroke: applyAlpha(colors.neutralHigh, 0.1)
         },
-        x1: "100%",
-        y1: 0,
-        x2: 0,
-        y2: "100%"
-    }))));
+        children: /*#__PURE__*/ _jsxs("svg", {
+            width: "100%",
+            height: "100%",
+            children: [
+                /*#__PURE__*/ _jsx("line", {
+                    style: {
+                        strokeWidth: 2,
+                        stroke: applyAlpha(colors.neutralHigh, 0.1)
+                    },
+                    x1: 0,
+                    y1: 0,
+                    x2: "100%",
+                    y2: "100%"
+                }),
+                /*#__PURE__*/ _jsx("line", {
+                    style: {
+                        strokeWidth: 2,
+                        stroke: applyAlpha(colors.neutralHigh, 0.1)
+                    },
+                    x1: "100%",
+                    y1: 0,
+                    x2: 0,
+                    y2: "100%"
+                })
+            ]
+        })
+    }));
 };

package/dist-es/popover.js

@@ -1,3 +1,4 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import * as React from 'react';
 import { createUseStyles } from './jss';
 import IcnCloseRegular from './generated/mistica-icons/icon-close-regular';
@@ -263,40 +264,64 @@ var Popover = function(param) {
     var popoverContainer = null;
     if (isVisible && targetPosition) {
         var ref = getPositionStyles(position, innerWidth, targetPosition, isTabletOrSmaller), containerStyles = ref.containerStyles, arrowStyles = ref.arrowStyles;
-        popoverContainer = /*#__PURE__*/ React.createElement("div", {
+        popoverContainer = /*#__PURE__*/ _jsxs("div", {
             className: classes.container,
             style: _objectSpread({
                 width: innerWidth
-            }, containerStyles)
-        }, /*#__PURE__*/ React.createElement("div", {
-            className: classes.arrowWrapper,
-            style: arrowStyles
-        }, /*#__PURE__*/ React.createElement("div", {
-            className: classes.arrow
-        })), /*#__PURE__*/ React.createElement("div", {
-            className: classes.boxContainer
-        }, asset && /*#__PURE__*/ React.createElement("div", {
-            className: classes.assetContent
-        }, asset), /*#__PURE__*/ React.createElement("div", {
-            className: classes.textContent
-        }, title && /*#__PURE__*/ React.createElement("span", {
-            className: classes.title
-        }, title), /*#__PURE__*/ React.createElement("span", {
-            className: classes.text
-        }, description)), /*#__PURE__*/ React.createElement("div", {
-            className: classes.closeButtonIcon
-        }, /*#__PURE__*/ React.createElement(IconButton, {
-            onPress: handleClose,
-            trackingEvent: trackingEvent,
-            "aria-label": texts.modalClose
-        }, /*#__PURE__*/ React.createElement(IcnCloseRegular, {
-            color: colors.neutralHigh
-        })))));
+            }, containerStyles),
+            children: [
+                /*#__PURE__*/ _jsx("div", {
+                    className: classes.arrowWrapper,
+                    style: arrowStyles,
+                    children: /*#__PURE__*/ _jsx("div", {
+                        className: classes.arrow
+                    })
+                }),
+                /*#__PURE__*/ _jsxs("div", {
+                    className: classes.boxContainer,
+                    children: [
+                        asset && /*#__PURE__*/ _jsx("div", {
+                            className: classes.assetContent,
+                            children: asset
+                        }),
+                        /*#__PURE__*/ _jsxs("div", {
+                            className: classes.textContent,
+                            children: [
+                                title && /*#__PURE__*/ _jsx("span", {
+                                    className: classes.title,
+                                    children: title
+                                }),
+                                /*#__PURE__*/ _jsx("span", {
+                                    className: classes.text,
+                                    children: description
+                                })
+                            ]
+                        }),
+                        /*#__PURE__*/ _jsx("div", {
+                            className: classes.closeButtonIcon,
+                            children: /*#__PURE__*/ _jsx(IconButton, {
+                                onPress: handleClose,
+                                trackingEvent: trackingEvent,
+                                "aria-label": texts.modalClose,
+                                children: /*#__PURE__*/ _jsx(IcnCloseRegular, {
+                                    color: colors.neutralHigh
+                                })
+                            })
+                        })
+                    ]
+                })
+            ]
+        });
     }
-    return(/*#__PURE__*/ React.createElement("div", {
-        className: classes.wrapper
-    }, /*#__PURE__*/ React.createElement("div", {
-        ref: targetWrapperRef
-    }, target), popoverContainer));
+    return(/*#__PURE__*/ _jsxs("div", {
+        className: classes.wrapper,
+        children: [
+            /*#__PURE__*/ _jsx("div", {
+                ref: targetWrapperRef,
+                children: target
+            }),
+            popoverContainer
+        ]
+    }));
 };
 export default Popover;

package/dist-es/portal.js

@@ -1,3 +1,4 @@
+import { jsx as _jsx } from "react/jsx-runtime";
 import * as React from 'react';
 import ReactDOM from 'react-dom';
 function _arrayWithHoles(arr) {
@@ -60,12 +61,13 @@ function _toConsumableArray(arr) {
  */ export var PortalNodesProvider = function(param) {
     var children = param.children;
     var ref = _slicedToArray(React.useState([]), 2), portalNodes = ref[0], setPortalNodes = ref[1];
-    return(/*#__PURE__*/ React.createElement(PortalNodes.Provider, {
+    return(/*#__PURE__*/ _jsx(PortalNodes.Provider, {
         value: {
             portalNodes: portalNodes,
             setPortalNodes: setPortalNodes
-        }
-    }, children));
+        },
+        children: children
+    }));
 };
 /**
  * @deprecated - to be removed in next major

package/dist-es/progress-bar.js

@@ -1,4 +1,4 @@
-import * as React from 'react';
+import { jsx as _jsx } from "react/jsx-runtime";
 import { createUseStyles } from './jss';
 var transition = '1s cubic-bezier(0.75, 0, 0.27, 1)';
 var useStyles = createUseStyles(function(param) {
@@ -36,13 +36,14 @@ var ProgressBar = function(param) {
         progressPercent: progressPercent,
         color: color
     });
-    return(/*#__PURE__*/ React.createElement("div", {
+    return(/*#__PURE__*/ _jsx("div", {
         className: classes.barBackground,
         "aria-valuenow": progressPercent,
         "aria-valuemin": 0,
-        "aria-valuemax": 100
-    }, /*#__PURE__*/ React.createElement("div", {
-        className: classes.bar
-    })));
+        "aria-valuemax": 100,
+        children: /*#__PURE__*/ _jsx("div", {
+            className: classes.bar
+        })
+    }));
 };
 export default ProgressBar;