@telefonica/mistica 11.1.0 → 11.3.0

package/dist-es/empty-state.js

@@ -1,14 +1,3 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import * as React from 'react';
-import Box from './box';
-import { Boxed } from './boxed';
-import { ButtonPrimary } from './button';
-import { useScreenSize, useTheme } from './hooks';
-import Stack from './stack';
-import { Text4, Text6 } from './text';
-import { createUseStyles } from './jss';
-import ButtonGroup from './button-group';
-import { getPrefixedDataAttributes } from './utils/dom';
 function _defineProperty(obj, key, value) {
     if (key in obj) {
         Object.defineProperty(obj, key, {
@@ -37,36 +26,47 @@ function _objectSpread(target) {
     }
     return target;
 }
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import * as React from "react";
+import Box from "./box";
+import { Boxed } from "./boxed";
+import { ButtonPrimary } from "./button";
+import { useScreenSize, useTheme } from "./hooks";
+import Stack from "./stack";
+import { Text4, Text6 } from "./text";
+import { createUseStyles } from "./jss";
+import ButtonGroup from "./button-group";
+import { getPrefixedDataAttributes } from "./utils/dom";
 var useStyles = createUseStyles(function(theme) {
     return {
         container: _defineProperty({}, theme.mq.tabletOrSmaller, {
             maxWidth: 368
         }),
         desktopContainer: {
-            display: 'flex',
-            justifyContent: 'spaceBetween'
+            display: "flex",
+            justifyContent: "spaceBetween"
         },
         desktopContent: _defineProperty({}, theme.mq.desktopOrBigger, {
-            width: '50%'
+            width: "50%"
         }),
         desktopImage: {
             backgroundImage: function(param) {
                 var largeImageUrl = param.largeImageUrl;
                 return "url(".concat(largeImageUrl, ")");
             },
-            backgroundPosition: 'bottom right',
-            backgroundRepeat: 'no-repeat',
-            backgroundSize: 'contain',
+            backgroundPosition: "bottom right",
+            backgroundRepeat: "no-repeat",
+            backgroundSize: "contain",
             flex: 1
         },
         largeImage: {
-            width: '100%',
-            display: 'block',
-            aspectRatio: '16/9'
+            width: "100%",
+            display: "block",
+            aspectRatio: "16/9"
         },
         smallImage: _defineProperty({
             height: 128,
-            display: 'block'
+            display: "block"
         }, theme.mq.tabletOrSmaller, {
             height: 112
         }),
@@ -80,7 +80,7 @@ var useStyles = createUseStyles(function(theme) {
     };
 });
 var EmptyState = function(param) {
-    var title = param.title, description = param.description, button = param.button, buttonLink = param.buttonLink, largeImageUrl = param.largeImageUrl, imageUrl = param.imageUrl, icon = param.icon, ariaLabel = param['aria-label'], dataAttributes = param.dataAttributes;
+    var title = param.title, description = param.description, button = param.button, buttonLink = param.buttonLink, largeImageUrl = param.largeImageUrl, imageUrl = param.imageUrl, icon = param.icon, ariaLabel = param["aria-label"], dataAttributes = param.dataAttributes;
     var colors = useTheme().colors;
     var needsButtonLinkAlignment = buttonLink && !button;
     var classes = useStyles({
@@ -111,7 +111,7 @@ var EmptyState = function(param) {
     buttons.link = buttonLink;
     if (isTabletOrSmaller) {
         var ref;
-        return(/*#__PURE__*/ _jsx("section", _objectSpread({
+        return /*#__PURE__*/ _jsx("section", _objectSpread({
             className: classes.container,
             "aria-label": ariaLabel
         }, getPrefixedDataAttributes(dataAttributes), {
@@ -140,9 +140,9 @@ var EmptyState = function(param) {
                     button && /*#__PURE__*/ _jsx(ButtonGroup, _objectSpread({}, buttons))
                 ]
             })
-        })));
+        }));
     }
-    return(/*#__PURE__*/ _jsx(Boxed, {
+    return /*#__PURE__*/ _jsx(Boxed, {
         "aria-label": ariaLabel,
         role: "region",
         dataAttributes: dataAttributes,
@@ -185,6 +185,6 @@ var EmptyState = function(param) {
                 })
             ]
         })
-    }));
+    });
 };
 export default EmptyState;

package/dist-es/fade-in.js

@@ -1,15 +1,15 @@
 import { jsx as _jsx } from "react/jsx-runtime";
-import * as React from 'react';
-import { createUseStyles } from './jss';
-var defaultDuration = '0.3s';
+import * as React from "react";
+import { createUseStyles } from "./jss";
+var defaultDuration = "0.3s";
 var useStyles = createUseStyles(function() {
     return {
         wrapper: {
-            animationName: '$fadeIn',
-            animationTimingFunction: 'ease',
-            animationFillMode: 'both'
+            animationName: "$fadeIn",
+            animationTimingFunction: "ease",
+            animationFillMode: "both"
         },
-        '@keyframes fadeIn': {
+        "@keyframes fadeIn": {
             from: {
                 opacity: 0
             },
@@ -20,9 +20,9 @@ var useStyles = createUseStyles(function() {
     };
 });
 var FadeIn = function(param) {
-    var children = param.children, _className = param.className, className = _className === void 0 ? '' : _className, _duration = param.duration, duration = _duration === void 0 ? defaultDuration : _duration, _delay = param.delay, delay = _delay === void 0 ? '0' : _delay;
+    var children = param.children, _className = param.className, className = _className === void 0 ? "" : _className, _duration = param.duration, duration = _duration === void 0 ? defaultDuration : _duration, _delay = param.delay, delay = _delay === void 0 ? "0" : _delay;
     var classes = useStyles();
-    return(/*#__PURE__*/ _jsx("div", {
+    return /*#__PURE__*/ _jsx("div", {
         className: "".concat(classes.wrapper, " ").concat(className),
         style: {
             animationDelay: delay,
@@ -31,6 +31,6 @@ var FadeIn = function(param) {
             WebkitAnimationDuration: duration
         },
         children: children
-    }));
+    });
 };
 export default FadeIn;

package/dist-es/feedback.js

@@ -1,24 +1,3 @@
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import * as React from 'react';
-import { createUseStyles } from './jss';
-import { useTheme, useScreenSize, useWindowHeight, useIsomorphicLayoutEffect } from './hooks';
-import { ThemeVariant, useIsInverseVariant } from './theme-variant-context';
-import ButtonFixedFooterLayout from './button-fixed-footer-layout';
-import OverscrollColor from './overscroll-color-context';
-import { VIVO_SKIN } from './skins/constants';
-import IcnSuccess from './icons/icon-success';
-import IconSuccessVivo from './icons/icon-success-vivo';
-import IcnError from './icons/icon-error';
-import IcnInfo from './icons/icon-info';
-import { isWebViewBridgeAvailable, requestVibration as requestVibrationNative } from '@tef-novum/webview-bridge';
-import { isOldChrome, isRunningAcceptanceTest } from './utils/platform';
-import { Text6, Text4, Text2 } from './text';
-import Box from './box';
-import { Boxed } from './boxed';
-import ResponsiveLayout from './responsive-layout';
-import Stack from './stack';
-import classnames from 'classnames';
-import ButtonGroup from './button-group';
 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];
@@ -120,6 +99,27 @@ function _unsupportedIterableToArray(o, minLen) {
     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);
 }
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import * as React from "react";
+import { createUseStyles } from "./jss";
+import { useTheme, useScreenSize, useWindowHeight, useIsomorphicLayoutEffect } from "./hooks";
+import { ThemeVariant, useIsInverseVariant } from "./theme-variant-context";
+import ButtonFixedFooterLayout from "./button-fixed-footer-layout";
+import OverscrollColor from "./overscroll-color-context";
+import { VIVO_SKIN } from "./skins/constants";
+import IcnSuccess from "./icons/icon-success";
+import IconSuccessVivo from "./icons/icon-success-vivo";
+import IcnError from "./icons/icon-error";
+import IcnInfo from "./icons/icon-info";
+import { isWebViewBridgeAvailable, requestVibration as requestVibrationNative } from "@tef-novum/webview-bridge";
+import { isOldChrome, isRunningAcceptanceTest } from "./utils/platform";
+import { Text6, Text4, Text2 } from "./text";
+import Box from "./box";
+import { Boxed } from "./boxed";
+import ResponsiveLayout from "./responsive-layout";
+import Stack from "./stack";
+import classnames from "classnames";
+import ButtonGroup from "./button-group";
 var areAnimationsSupported = function(platformOverrides) {
     return !isOldChrome(platformOverrides) && !isRunningAcceptanceTest(platformOverrides);
 };
@@ -132,15 +132,15 @@ var useStyles = createUseStyles(function(theme) {
         background: {
             background: function(param) {
                 var isInverse = param.isInverse;
-                return isInverse ? theme.colors.backgroundBrand : 'initial';
+                return isInverse ? theme.colors.backgroundBrand : "initial";
             }
         },
         desktopContainer: {
-            display: 'flex',
-            justifyContent: 'space-between'
+            display: "flex",
+            justifyContent: "space-between"
         },
         desktopContent: _defineProperty({}, theme.mq.desktopOrBigger, {
-            width: '50%'
+            width: "50%"
         }),
         desktopImage: {
             backgroundImage: function(param) {
@@ -149,27 +149,27 @@ var useStyles = createUseStyles(function(theme) {
             },
             backgroundPosition: function(param) {
                 var imageFit = param.imageFit;
-                return imageFit === 'fit' ? 'bottom right' : 'center right';
+                return imageFit === "fit" ? "bottom right" : "center right";
             },
-            backgroundRepeat: 'no-repeat',
+            backgroundRepeat: "no-repeat",
             backgroundSize: function(param) {
                 var imageFit = param.imageFit;
-                return imageFit === 'fit' ? 'contain' : 'cover';
+                return imageFit === "fit" ? "contain" : "cover";
             },
             flex: 1,
             maxWidth: 600
         },
         container: {
-            display: 'flex',
-            height: '100%',
-            width: '100%',
-            margin: 'auto',
-            '& *': {
+            display: "flex",
+            height: "100%",
+            width: "100%",
+            margin: "auto",
+            "& *": {
                 zIndex: 1
             }
         },
         backgroundDiv: {
-            position: 'absolute',
+            position: "absolute",
             bottom: function(param) {
                 var footerHeight = param.footerHeight;
                 return footerHeight;
@@ -189,27 +189,27 @@ var useStyles = createUseStyles(function(theme) {
             }
         },
         innerContainer: {
-            textAlign: 'left',
-            padding: '64px 8px 16px'
+            textAlign: "left",
+            padding: "64px 8px 16px"
         },
         feedbackData: {
-            '& p:not(:first-child)': {
+            "& p:not(:first-child)": {
                 marginTop: 16
             },
             maxWidth: 496,
-            overflowWrap: 'break-word'
+            overflowWrap: "break-word"
         },
         feedbackDataAppear: {
             opacity: 0,
-            transform: 'translate(0, 20px)'
+            transform: "translate(0, 20px)"
         },
         feedbackDataAppearActive: {
-            transitionProperty: 'opacity, transform',
-            transitionDuration: '0.8s',
-            transitionTimingFunction: 'cubic-bezier(0.215, 0.61, 0.355, 1)',
-            transitionDelay: '0.6s',
+            transitionProperty: "opacity, transform",
+            transitionDuration: "0.8s",
+            transitionTimingFunction: "cubic-bezier(0.215, 0.61, 0.355, 1)",
+            transitionDelay: "0.6s",
             opacity: 1,
-            transform: 'translate(0, 0)'
+            transform: "translate(0, 0)"
         }
     };
 });
@@ -221,14 +221,14 @@ var requestVibration = function(type) {
 var useHapticFeedback = function(type) {
     React.useEffect(function() {
         var timeoutId;
-        if (type === 'success') {
+        if (type === "success") {
             timeoutId = setTimeout(function() {
-                return requestVibration('success');
+                return requestVibration("success");
             }, 700);
         }
-        if (type === 'error') {
+        if (type === "error") {
             timeoutId = setTimeout(function() {
-                return requestVibration('error');
+                return requestVibration("error");
             }, 1000);
         }
         return function() {
@@ -259,11 +259,11 @@ var useHapticFeedback = function(type) {
 var renderFeedbackBody = function(param, animateText, appear, classes, colors) {
     var icon = param.icon, title = param.title, description = param.description, children = param.children;
     var normalizedDescription = description && Array.isArray(description) ? description.map(function(paragraph, i) {
-        /*#__PURE__*/ return _jsx("p", {
+        return /*#__PURE__*/ _jsx("p", {
             children: paragraph
         }, i);
     }) : description;
-    return(/*#__PURE__*/ _jsxs(Stack, {
+    return /*#__PURE__*/ _jsxs(Stack, {
         space: 24,
         children: [
             icon,
@@ -284,21 +284,21 @@ var renderFeedbackBody = function(param, animateText, appear, classes, colors) {
                 ]
             })
         ]
-    }));
+    });
 };
 var renderInlineFeedbackBody = function(feedbackBody, buttons) {
     var hasButtons = checkHasButtons(buttons);
-    return(/*#__PURE__*/ _jsxs(Stack, {
+    return /*#__PURE__*/ _jsxs(Stack, {
         space: 24,
         children: [
             feedbackBody,
             hasButtons && /*#__PURE__*/ _jsx(ButtonGroup, _objectSpread({}, buttons))
         ]
-    }));
+    });
 };
 var renderFeedbackInDesktop = function(param) {
     var isInverse = param.isInverse, inlineFeedbackBody = param.inlineFeedbackBody, classes = param.classes, imageUrl = param.imageUrl, dataAttributes = param.dataAttributes;
-    /*#__PURE__*/ return _jsx(Boxed, {
+    return /*#__PURE__*/ _jsx(Boxed, {
         isInverse: isInverse,
         dataAttributes: dataAttributes,
         children: /*#__PURE__*/ _jsxs("div", {
@@ -325,7 +325,7 @@ export var FeedbackScreen = function(param) {
     var ref = useTheme(), colors = ref.colors, platformOverrides = ref.platformOverrides;
     var windowHeight = useWindowHeight();
     var isTabletOrSmaller = useScreenSize().isTabletOrSmaller;
-    var ref1 = _slicedToArray(React.useState(typeof self !== 'undefined'), 2), isServerSide = ref1[0], setIsServerSide = ref1[1];
+    var ref1 = _slicedToArray(React.useState(typeof self !== "undefined"), 2), isServerSide = ref1[0], setIsServerSide = ref1[1];
     var ref2 = _slicedToArray(React.useState(0), 2), footerHeight = ref2[0], setFooterHeight = ref2[1];
     var contentHeightPx = "".concat(windowHeight - footerHeight, "px");
     var hasButtons = checkHasButtons({
@@ -335,7 +335,7 @@ export var FeedbackScreen = function(param) {
     });
     var classes = useStyles({
         isInverse: isInverse,
-        contentHeight: isServerSide ? '100vh' : contentHeightPx,
+        contentHeight: isServerSide ? "100vh" : contentHeightPx,
         footerHeight: footerHeight,
         animateText: animateText,
         primaryButton: primaryButton,
@@ -378,7 +378,7 @@ export var FeedbackScreen = function(param) {
             isInverse && /*#__PURE__*/ _jsx(OverscrollColor, {}),
             /*#__PURE__*/ _jsx("div", {
                 style: {
-                    position: 'relative'
+                    position: "relative"
                 },
                 children: /*#__PURE__*/ _jsx(ButtonFixedFooterLayout, {
                     isFooterVisible: hasButtons,
@@ -411,7 +411,7 @@ export var FeedbackScreen = function(param) {
 export var SuccessFeedbackScreen = function(props) {
     var isTabletOrSmaller = useScreenSize().isTabletOrSmaller;
     var skinName = useTheme().skinName;
-    return(/*#__PURE__*/ _jsx(ThemeVariant, {
+    return /*#__PURE__*/ _jsx(ThemeVariant, {
         isInverse: !props.unstable_inlineInDesktop || isTabletOrSmaller,
         children: /*#__PURE__*/ _jsx(FeedbackScreen, _objectSpread({}, props, {
             hapticFeedback: "success",
@@ -420,7 +420,7 @@ export var SuccessFeedbackScreen = function(props) {
             imageUrl: props.imageUrl,
             imageFit: props.imageFit
         }))
-    }));
+    });
 };
 var ErrorFeedbackScreen = function(_param) {
     var children = _param.children, errorReference = _param.errorReference, otherProps = _objectWithoutProperties(_param, [
@@ -428,7 +428,7 @@ var ErrorFeedbackScreen = function(_param) {
         "errorReference"
     ]);
     var colors = useTheme().colors;
-    return(/*#__PURE__*/ _jsxs(FeedbackScreen, _objectSpread({}, otherProps, {
+    return /*#__PURE__*/ _jsxs(FeedbackScreen, _objectSpread({}, otherProps, {
         hapticFeedback: "error",
         icon: /*#__PURE__*/ _jsx(IcnError, {}),
         animateText: true,
@@ -440,17 +440,17 @@ var ErrorFeedbackScreen = function(_param) {
                 children: errorReference
             })
         ]
-    })));
+    }));
 };
 export { ErrorFeedbackScreen };
 export var InfoFeedbackScreen = function(props) {
-    return(/*#__PURE__*/ _jsx(FeedbackScreen, _objectSpread({}, props, {
+    return /*#__PURE__*/ _jsx(FeedbackScreen, _objectSpread({}, props, {
         icon: /*#__PURE__*/ _jsx(IcnInfo, {})
-    })));
+    }));
 };
 export var SuccessFeedback = function(param) {
     var title = param.title, description = param.description, children = param.children, primaryButton = param.primaryButton, secondaryButton = param.secondaryButton, link = param.link, imageUrl = param.imageUrl, imageFit = param.imageFit, dataAttributes = param.dataAttributes;
-    useHapticFeedback('success');
+    useHapticFeedback("success");
     var isTabletOrSmaller = useScreenSize().isTabletOrSmaller;
     var ref = useTheme(), skinName = ref.skinName, platformOverrides = ref.platformOverrides, colors = ref.colors;
     var hasButtons = checkHasButtons({
@@ -479,7 +479,7 @@ export var SuccessFeedback = function(param) {
         secondaryButton: secondaryButton,
         link: link
     });
-    return(/*#__PURE__*/ _jsx(ThemeVariant, {
+    return /*#__PURE__*/ _jsx(ThemeVariant, {
         isInverse: true,
         children: isTabletOrSmaller ? /*#__PURE__*/ _jsxs(ResponsiveLayout, {
             className: classes.background,
@@ -500,5 +500,5 @@ export var SuccessFeedback = function(param) {
             imageUrl: imageUrl,
             dataAttributes: dataAttributes
         })
-    }));
+    });
 };

package/dist-es/fixed-footer-layout.js

@@ -1,11 +1,3 @@
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import * as React from 'react';
-import classnames from 'classnames';
-import debounce from 'lodash/debounce';
-import { createUseStyles } from './jss';
-import { isRunningAcceptanceTest } from './utils/platform';
-import { useElementDimensions, useIsomorphicLayoutEffect, useScreenSize, useTheme } from './hooks';
-import { addPassiveEventListener, getScrollableParentElement, getScrollDistanceToBottom, hasScroll, removePassiveEventListener } from './utils/dom';
 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];
@@ -65,6 +57,14 @@ function _unsupportedIterableToArray(o, minLen) {
     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);
 }
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import * as React from "react";
+import classnames from "classnames";
+import debounce from "lodash/debounce";
+import { createUseStyles } from "./jss";
+import { isRunningAcceptanceTest } from "./utils/platform";
+import { useElementDimensions, useIsomorphicLayoutEffect, useScreenSize, useTheme } from "./hooks";
+import { addPassiveEventListener, getScrollableParentElement, getScrollDistanceToBottom, hasScroll, removePassiveEventListener } from "./utils/dom";
 var getScrollEventTarget = function(el) {
     return el === document.documentElement ? window : el;
 };
@@ -79,11 +79,11 @@ var waitForSwitchTransitionToStart = function(fn) {
 var useStyles = createUseStyles(function(theme) {
     return _defineProperty({
         footer: {
-            width: '100%'
+            width: "100%"
         },
         shadow: {},
         withoutFooter: {
-            display: 'none'
+            display: "none"
         },
         containerSmall: {
             paddingBottom: function(param) {
@@ -97,18 +97,18 @@ var useStyles = createUseStyles(function(theme) {
         }
     }, theme.mq.tabletOrSmaller, {
         footer: {
-            position: 'fixed',
+            position: "fixed",
             left: 0,
             bottom: 0,
             zIndex: 1
         },
         shadow: {
-            boxShadow: '0 -3px 8px 0 rgba(0, 0, 0, 0.15)'
+            boxShadow: "0 -3px 8px 0 rgba(0, 0, 0, 0.15)"
         }
     });
 });
 var FixedFooterLayout = function(param) {
-    var _isFooterVisible = param.isFooterVisible, isFooterVisible = _isFooterVisible === void 0 ? true : _isFooterVisible, footer = param.footer, _footerHeight = param.footerHeight, footerHeight = _footerHeight === void 0 ? 'auto' : _footerHeight, footerBgColor = param.footerBgColor, containerBgColor = param.containerBgColor, children = param.children, onChangeFooterHeight = param.onChangeFooterHeight;
+    var _isFooterVisible = param.isFooterVisible, isFooterVisible = _isFooterVisible === void 0 ? true : _isFooterVisible, footer = param.footer, _footerHeight = param.footerHeight, footerHeight = _footerHeight === void 0 ? "auto" : _footerHeight, footerBgColor = param.footerBgColor, containerBgColor = param.containerBgColor, children = param.children, onChangeFooterHeight = param.onChangeFooterHeight;
     var ref = _slicedToArray(React.useState(false), 2), displayShadow = ref[0], setDisplayShadow = ref[1];
     var containerRef = React.useRef(null);
     var isTabletOrSmaller = useScreenSize().isTabletOrSmaller;
@@ -139,12 +139,12 @@ var FixedFooterLayout = function(param) {
         });
         var transitionAwaiter = waitForSwitchTransitionToStart(checkDisplayShadow);
         var scrollEventTarget = getScrollEventTarget(scrollable);
-        addPassiveEventListener(scrollEventTarget, 'resize', checkDisplayShadow);
-        addPassiveEventListener(scrollEventTarget, 'scroll', checkDisplayShadow);
+        addPassiveEventListener(scrollEventTarget, "resize", checkDisplayShadow);
+        addPassiveEventListener(scrollEventTarget, "scroll", checkDisplayShadow);
         return function() {
             checkDisplayShadow.cancel();
-            removePassiveEventListener(scrollEventTarget, 'scroll', checkDisplayShadow);
-            removePassiveEventListener(scrollEventTarget, 'resize', checkDisplayShadow);
+            removePassiveEventListener(scrollEventTarget, "scroll", checkDisplayShadow);
+            removePassiveEventListener(scrollEventTarget, "resize", checkDisplayShadow);
             transitionAwaiter.cancel();
         };
     }, [
@@ -158,7 +158,7 @@ var FixedFooterLayout = function(param) {
         height: realHeight
     });
     var _obj;
-    return(/*#__PURE__*/ _jsxs(_Fragment, {
+    return /*#__PURE__*/ _jsxs(_Fragment, {
         children: [
             /*#__PURE__*/ _jsx("div", {
                 ref: containerRef,
@@ -174,7 +174,7 @@ var FixedFooterLayout = function(param) {
                  */ style: {
                     background: isTabletOrSmaller ? footerBgColor || colors.backgroundContainer : undefined
                 },
-                "data-testid": "fixed-footer".concat(isFooterVisible ? '-visible' : '-hidden'),
+                "data-testid": "fixed-footer".concat(isFooterVisible ? "-visible" : "-hidden"),
                 /**
                  * This hints about the position of the fixed element. Other components could select nodes
                  * with this data attribute to correctly position it while transitioning. For example in
@@ -183,12 +183,12 @@ var FixedFooterLayout = function(param) {
                 children: isFooterVisible && /*#__PURE__*/ _jsx("aside", {
                     style: {
                         height: footerHeight,
-                        marginBottom: 'env(safe-area-inset-bottom)'
+                        marginBottom: "env(safe-area-inset-bottom)"
                     },
                     children: footer
                 })
             })
         ]
-    }));
+    });
 };
 export default FixedFooterLayout;

package/dist-es/fixed-to-top.js

@@ -1,12 +1,12 @@
 import { jsx as _jsx } from "react/jsx-runtime";
-import * as React from 'react';
+import * as React from "react";
 export var TopDistanceContext = /*#__PURE__*/ React.createContext(0);
 var FixedToTop = function(param) {
     var children = param.children, height = param.height;
     var top = React.useContext(TopDistanceContext);
-    return(/*#__PURE__*/ _jsx(TopDistanceContext.Provider, {
+    return /*#__PURE__*/ _jsx(TopDistanceContext.Provider, {
         value: top + height,
         children: children(top)
-    }));
+    });
 };
 export default FixedToTop;

package/dist-es/focus-trap.js

@@ -1,9 +1,9 @@
 import { jsx as _jsx } from "react/jsx-runtime";
-import * as React from 'react';
-import ReactFocusLock from 'react-focus-lock';
+import * as React from "react";
+import ReactFocusLock from "react-focus-lock";
 var FocusTrap = function(param) {
     var children = param.children, disabled = param.disabled, className = param.className, group = param.group;
-    /*#__PURE__*/ return _jsx(ReactFocusLock, {
+    return /*#__PURE__*/ _jsx(ReactFocusLock, {
         noFocusGuards: true,
         disabled: disabled,
         className: className,

package/dist-es/form-context.js

@@ -1,10 +1,10 @@
-import * as React from 'react';
+import * as React from "react";
 export var FormContext = /*#__PURE__*/ React.createContext({
     values: {},
     setValue: function() {},
     rawValues: {},
     setRawValue: function() {},
-    formStatus: 'filling',
+    formStatus: "filling",
     register: function() {},
     formErrors: {},
     setFormError: function() {},
@@ -13,7 +13,7 @@ export var FormContext = /*#__PURE__*/ React.createContext({
     validate: function() {
         return {};
     },
-    formId: ''
+    formId: ""
 });
 export var useForm = function() {
     return React.useContext(FormContext);
@@ -63,18 +63,18 @@ export var useControlProps = function(param) {
             });
             setFormError({
                 name: name,
-                error: ''
+                error: ""
             });
             onChange === null || onChange === void 0 ? void 0 : onChange(value);
         },
-        disabled: formStatus === 'sending' || disabled
+        disabled: formStatus === "sending" || disabled
     };
 };
 export var useFieldProps = function(param) {
     var name = param.name, value2 = param.value, defaultValue = param.defaultValue, processValue = param.processValue, helperText = param.helperText, optional = param.optional, error = param.error, disabled = param.disabled, onBlur = param.onBlur, validate = param.validate, onChange = param.onChange, onChangeValue = param.onChangeValue;
     var ref = useForm(), setRawValue = ref.setRawValue, setValue = ref.setValue, rawValues = ref.rawValues, values = ref.values, formErrors = ref.formErrors, formStatus = ref.formStatus, setFormError = ref.setFormError, register = ref.register;
     var ref2, ref3;
-    var rawValue1 = (ref3 = (ref2 = value2 !== null && value2 !== void 0 ? value2 : defaultValue) !== null && ref2 !== void 0 ? ref2 : rawValues[name]) !== null && ref3 !== void 0 ? ref3 : '';
+    var rawValue1 = (ref3 = (ref2 = value2 !== null && value2 !== void 0 ? value2 : defaultValue) !== null && ref2 !== void 0 ? ref2 : rawValues[name]) !== null && ref3 !== void 0 ? ref3 : "";
     var processValueRef = React.useRef(processValue);
     React.useEffect(function() {
         setRawValue({
@@ -94,12 +94,12 @@ export var useFieldProps = function(param) {
     var _name;
     return {
         value: value2,
-        defaultValue: defaultValue !== null && defaultValue !== void 0 ? defaultValue : value2 === undefined ? (_name = rawValues[name]) !== null && _name !== void 0 ? _name : '' : undefined,
+        defaultValue: defaultValue !== null && defaultValue !== void 0 ? defaultValue : value2 === undefined ? (_name = rawValues[name]) !== null && _name !== void 0 ? _name : "" : undefined,
         name: name,
         helperText: formErrors[name] || helperText,
         required: !optional,
         error: error || !!formErrors[name],
-        disabled: disabled || formStatus === 'sending',
+        disabled: disabled || formStatus === "sending",
         onBlur: function(e) {
             setFormError({
                 name: name,
@@ -126,7 +126,7 @@ export var useFieldProps = function(param) {
             });
             setFormError({
                 name: name,
-                error: ''
+                error: ""
             });
             onChange === null || onChange === void 0 ? void 0 : onChange(event);
             onChangeValue === null || onChangeValue === void 0 ? void 0 : onChangeValue(value, rawValue);