@feathery/react 2.48.1 → 2.50.0

package/cjs/{fthry_index.CwpWkape.js → fthry_index.BldM4IKR.js}

@@ -23035,8 +23035,15 @@ var resizeFitContainer = function (div) {
     var containerMarginLeft = getStylePxValue(containerStyles.marginLeft);
     var containerMarginRight = getStylePxValue(containerStyles.marginRight);
     var totalMargin = containerMarginLeft + containerMarginRight;
-    // Set the maxWidth to the calculated width of it's children and the width to 100% - total margin
-    div.style.maxWidth = "".concat(childrenWidth, "px");
+    var totalPadding = 0;
+    if (containerStyles.boxSizing === 'border-box') {
+        totalPadding =
+            getStylePxValue(containerStyles.paddingLeft) +
+                getStylePxValue(containerStyles.paddingRight) +
+                getStylePxValue(containerStyles.borderLeftWidth) +
+                getStylePxValue(containerStyles.borderRightWidth);
+    }
+    div.style.maxWidth = "".concat(childrenWidth + totalPadding, "px");
     div.style.width = "calc(100% - ".concat(totalMargin, "px)");
 };
 var whichTransitionEvent = function () {
@@ -23587,21 +23594,277 @@ var StyledContainer = React.forwardRef(function (_a, ref) {
     return (jsxs(Fragment, { children: [isFixed && (jsx$1("div", exports.__assign({ className: classNames('styled-container', type, className) }, props, { css: exports.__assign(exports.__assign({}, styles), { position: 'fixed', zIndex: FORM_Z_INDEX + 1 }), ref: fixedContainerRef, "data-feathery-id": node.key, "data-element": elementType }, { children: jsx$1("div", exports.__assign({ className: 'inner-container', css: innerStyles }, { children: children })) }), "".concat(node.id, "-fixed"))), jsx$1("div", exports.__assign({ ref: ref, css: isFixed ? exports.__assign(exports.__assign({}, styles), { visibility: 'hidden' }) : styles, className: classNames('styled-container', type, className) }, props, { "data-id": node.id, "data-feathery-id": node.key, "data-element": elementType }, { children: jsx$1("div", exports.__assign({ className: 'inner-container', css: innerStyles }, { children: isFixed ? null : children })) }), node.id)] }));
 });
 
+var Tooltip = function (_a) {
+    var children = _a.children, css = _a.css, _b = _a.maxWidth, maxWidth = _b === void 0 ? '200px' : _b, props = __rest$1(_a, ["children", "css", "maxWidth"]);
+    return (jsx$1("div", exports.__assign({ css: exports.__assign({ zIndex: FORM_Z_INDEX + 1, padding: '.4rem 0', transition: 'opacity .10s linear', '.tooltip-inner': {
+                maxWidth: maxWidth,
+                padding: '.25rem .5rem',
+                color: '#fff',
+                textAlign: 'center',
+                backgroundColor: '#000',
+                borderRadius: '.25rem',
+                fontSize: 'smaller',
+                // break long unbroken words so they wrap instead of overflowing
+                overflowWrap: 'anywhere'
+            } }, css) }, props, { children: jsx$1("div", exports.__assign({ className: 'tooltip-inner' }, { children: children })) })));
+};
+
+var Overlay = function (_a) {
+    var show = _a.show, targetRef = _a.targetRef, children = _a.children, onHide = _a.onHide, _b = _a.placement, placement = _b === void 0 ? 'bottom-start' : _b, _c = _a.offset, offset = _c === void 0 ? 0 : _c, _d = _a.zIndex, zIndex = _d === void 0 ? 1000 : _d, containerRef = _a.containerRef;
+    var ref = React.useRef(null);
+    var _e = __read(React.useState(null), 2), position = _e[0], setPosition = _e[1];
+    var getContainer = React.useCallback(function () {
+        return (containerRef === null || containerRef === void 0 ? void 0 : containerRef.current) || featheryDoc().body;
+    }, [containerRef]);
+    var recalcPosition = React.useCallback(function () {
+        var _a;
+        if (!show || !targetRef.current || !ref.current)
+            return;
+        var window = featheryWindow();
+        var container = getContainer();
+        if (!container)
+            return;
+        var targetRect = targetRef.current.getBoundingClientRect();
+        var overlayRect = ref.current.getBoundingClientRect();
+        var containerRect = container.getBoundingClientRect();
+        var _b = calcPosition(placement, targetRect, overlayRect, offset), top = _b.top, left = _b.left;
+        // Flip if it doesn’t fit
+        var overlayBottom = top + overlayRect.height;
+        var overlayRight = left + overlayRect.width;
+        var fitsVertically = top >= 0 && overlayBottom <= window.innerHeight;
+        var fitsHorizontally = left >= 0 && overlayRight <= window.innerWidth;
+        if (!fitsVertically || !fitsHorizontally) {
+            var flipped = getFlippedPlacement(placement, !fitsVertically, !fitsHorizontally);
+            if (flipped !== placement) {
+                (_a = calcPosition(flipped, targetRect, overlayRect, offset), top = _a.top, left = _a.left);
+            }
+        }
+        var isBodyContainer = container === featheryDoc().body;
+        var finalTop = isBodyContainer
+            ? top + window.scrollY
+            : top - containerRect.top;
+        var finalLeft = isBodyContainer
+            ? left + window.scrollX
+            : left - containerRect.left;
+        setPosition(function (prev) {
+            if (!prev || prev.top !== finalTop || prev.left !== finalLeft) {
+                return { top: finalTop, left: finalLeft };
+            }
+            return prev;
+        });
+    }, [show, placement, offset, getContainer, targetRef]);
+    var throttledRecalc = React.useCallback(function () {
+        var ticking = false;
+        return function () {
+            if (!ticking) {
+                ticking = true;
+                requestAnimationFrame(function () {
+                    recalcPosition();
+                    ticking = false;
+                });
+            }
+        };
+    }, [recalcPosition])();
+    React.useLayoutEffect(function () {
+        if (show)
+            recalcPosition();
+    }, [show, recalcPosition]);
+    React.useEffect(function () {
+        if (!show)
+            return;
+        var window = featheryWindow();
+        var container = getContainer();
+        if (!container)
+            return;
+        window.addEventListener('resize', throttledRecalc);
+        window.addEventListener('scroll', throttledRecalc, true);
+        if (container !== featheryDoc().body) {
+            container.addEventListener('scroll', throttledRecalc);
+        }
+        var resizeObserver = new ResizeObserver(function () { return throttledRecalc(); });
+        if (targetRef.current)
+            resizeObserver.observe(targetRef.current);
+        if (container !== featheryDoc().body)
+            resizeObserver.observe(container);
+        return function () {
+            window.removeEventListener('resize', throttledRecalc);
+            window.removeEventListener('scroll', throttledRecalc, true);
+            if (container !== featheryDoc().body) {
+                container.removeEventListener('scroll', throttledRecalc);
+            }
+            resizeObserver.disconnect();
+        };
+    }, [show, throttledRecalc, getContainer, targetRef]);
+    React.useEffect(function () {
+        if (!show)
+            return;
+        var handleKeyDown = function (event) {
+            if (event.key === 'Escape') {
+                setPosition(null);
+                onHide === null || onHide === void 0 ? void 0 : onHide();
+            }
+        };
+        var handleClickOutside = function (event) {
+            var target = event.target;
+            if (ref.current &&
+                !ref.current.contains(target) &&
+                targetRef.current &&
+                !targetRef.current.contains(target)) {
+                setPosition(null);
+                onHide === null || onHide === void 0 ? void 0 : onHide();
+            }
+        };
+        var doc = featheryDoc();
+        doc.addEventListener('mousedown', handleClickOutside);
+        doc.addEventListener('keydown', handleKeyDown);
+        return function () {
+            doc.removeEventListener('mousedown', handleClickOutside);
+            doc.removeEventListener('keydown', handleKeyDown);
+        };
+    }, [show, onHide, targetRef]);
+    if (!show)
+        return null;
+    var container = getContainer();
+    if (!container)
+        return jsx$1(Fragment, { children: children });
+    return ReactDOM.createPortal(jsx$1("div", exports.__assign({ ref: ref, style: exports.__assign(exports.__assign({ position: 'absolute' }, (position || { top: -9999, left: -9999 })), { zIndex: zIndex }) }, { children: children })), container);
+};
+var getFlippedPlacement = function (original, needsVerticalFlip, needsHorizontalFlip) {
+    if (needsVerticalFlip) {
+        if (original.includes('top')) {
+            return original.replace('top', 'bottom');
+        }
+        if (original.includes('bottom')) {
+            return original.replace('bottom', 'top');
+        }
+    }
+    if (needsHorizontalFlip) {
+        if (original.includes('left')) {
+            return original.replace('left', 'right');
+        }
+        if (original.includes('right')) {
+            return original.replace('right', 'left');
+        }
+    }
+    return original;
+};
+var calcPosition = function (pl, targetRect, overlayRect, offset) {
+    if (offset === void 0) { offset = 0; }
+    switch (pl) {
+        case 'top':
+            return {
+                top: targetRect.top - overlayRect.height - offset,
+                left: targetRect.left + (targetRect.width - overlayRect.width) / 2
+            };
+        case 'top-start':
+            return {
+                top: targetRect.top - overlayRect.height - offset,
+                left: targetRect.left
+            };
+        case 'top-end':
+            return {
+                top: targetRect.top - overlayRect.height - offset,
+                left: targetRect.right - overlayRect.width
+            };
+        case 'left':
+            return {
+                top: targetRect.top + (targetRect.height - overlayRect.height) / 2,
+                left: targetRect.left - overlayRect.width - offset
+            };
+        case 'left-start':
+            return {
+                top: targetRect.top,
+                left: targetRect.left - overlayRect.width - offset
+            };
+        case 'left-end':
+            return {
+                top: targetRect.bottom - overlayRect.height,
+                left: targetRect.left - overlayRect.width - offset
+            };
+        case 'bottom':
+            return {
+                top: targetRect.bottom + offset,
+                left: targetRect.left + (targetRect.width - overlayRect.width) / 2
+            };
+        case 'bottom-start':
+            return {
+                top: targetRect.bottom + offset,
+                left: targetRect.left
+            };
+        case 'bottom-end':
+            return {
+                top: targetRect.bottom + offset,
+                left: targetRect.right - overlayRect.width
+            };
+        case 'right':
+            return {
+                top: targetRect.top + (targetRect.height - overlayRect.height) / 2,
+                left: targetRect.right + offset
+            };
+        case 'right-start':
+            return {
+                top: targetRect.top,
+                left: targetRect.right + offset
+            };
+        case 'right-end':
+            return {
+                top: targetRect.bottom - overlayRect.height,
+                left: targetRect.right + offset
+            };
+        default:
+            return {
+                top: targetRect.bottom + offset,
+                left: targetRect.left + (targetRect.width - overlayRect.width) / 2
+            };
+    }
+};
+
+/**
+ * Shared overlay-anchored tooltip used by InlineTooltip (field help icon),
+ * TextHoverTooltip (hoverable text), and container hover tooltips. Renders the
+ * styled Tooltip inside an Overlay anchored to the provided trigger ref. The
+ * caller owns the show state and the trigger element + its event handlers.
+ */
+function HoverTooltip(_a) {
+    var show = _a.show, triggerRef = _a.triggerRef, text = _a.text, id = _a.id, onHide = _a.onHide, containerRef = _a.containerRef, _b = _a.placement, placement = _b === void 0 ? 'top' : _b, _c = _a.offset, offset = _c === void 0 ? 4 : _c, css = _a.css, maxWidth = _a.maxWidth;
+    if (!text)
+        return null;
+    return (jsx$1(Overlay, exports.__assign({ show: show, targetRef: triggerRef, containerRef: containerRef, placement: placement, onHide: onHide, offset: offset }, { children: jsx$1(Tooltip, exports.__assign({ id: "tooltip-".concat(id), css: css, maxWidth: maxWidth }, { children: text })) })));
+}
+
 /**
  * Container
  * This component adds additional logic to the StyledContainer that is unique
  * to rendering containers on hosted forms (not the editor).
  */
 var Container = function (_a) {
-    var _b, _c;
-    var node = _a.node, _d = _a.runElementActions, runElementActions = _d === void 0 ? function () { } : _d, selected = _a.selected, viewport = _a.viewport, form = _a.form, children = _a.children;
+    var _b, _c, _d;
+    var node = _a.node, _e = _a.runElementActions, runElementActions = _e === void 0 ? function () { } : _e, selected = _a.selected, viewport = _a.viewport, form = _a.form, children = _a.children;
     var ref = React.useRef(null);
+    var _f = __read(React.useState(false), 2), showTooltip = _f[0], setShowTooltip = _f[1];
     var additionalCss = {};
     var handleClick;
+    // Container-level hover tooltips apply only to actual containers. Field
+    // elements share the same `tooltipText` property but render their own
+    // icon-based InlineTooltip, so they must be excluded here.
+    var tooltipText = !node.isElement && ((_b = node.properties) === null || _b === void 0 ? void 0 : _b.tooltipText)
+        ? replaceTextVariables(node.properties.tooltipText, node.repeat)
+        : '';
+    var isMobile$1 = isMobile();
+    var tooltipHoverProps = tooltipText
+        ? {
+            // mouse hover is the primary trigger; disabled on mobile where a tap is
+            // ambiguous (containers commonly carry click actions)
+            onMouseEnter: isMobile$1 ? undefined : function () { return setShowTooltip(true); },
+            onMouseLeave: isMobile$1 ? undefined : function () { return setShowTooltip(false); },
+            onFocus: function () { return setShowTooltip(true); },
+            onBlur: function () { return setShowTooltip(false); }
+        }
+        : {};
     if (!node.isElement) {
-        var properties = (_b = node.properties) !== null && _b !== void 0 ? _b : {};
-        var actions_1 = (_c = properties.actions) !== null && _c !== void 0 ? _c : [];
-        var _e = __read(getCellStyle(node, undefined, form.formSettings.mobileBreakpoint), 3), _f = _e[1], cellHoverStyle = _f === void 0 ? {} : _f, _g = _e[2], cellActiveStyle = _g === void 0 ? {} : _g;
+        var properties = (_c = node.properties) !== null && _c !== void 0 ? _c : {};
+        var actions_1 = (_d = properties.actions) !== null && _d !== void 0 ? _d : [];
+        var _g = __read(getCellStyle(node, undefined, form.formSettings.mobileBreakpoint), 3), _h = _g[1], cellHoverStyle = _h === void 0 ? {} : _h, _j = _g[2], cellActiveStyle = _j === void 0 ? {} : _j;
         var selectableStyles = actions_1.length > 0
             ? exports.__assign(exports.__assign({ cursor: 'pointer', transition: '0.2s ease opacity, color, background-color, border-width, border-color, outline, box-shadow' }, (selected ? cellActiveStyle : {})), { '&:hover': cellHoverStyle }) : {};
         handleClick = function (e) {
@@ -23622,7 +23885,7 @@ var Container = function (_a) {
         };
         Object.assign(additionalCss, selectableStyles);
     }
-    return (jsx$1(StyledContainer, exports.__assign({ ref: ref, node: node, css: additionalCss, onClick: handleClick, viewport: viewport, breakpoint: form.formSettings.mobileBreakpoint }, { children: children })));
+    return (jsxs(Fragment, { children: [jsx$1(StyledContainer, exports.__assign({ ref: ref, node: node, css: additionalCss, onClick: handleClick, viewport: viewport, breakpoint: form.formSettings.mobileBreakpoint }, tooltipHoverProps, { children: children })), tooltipText && (jsx$1(HoverTooltip, { show: showTooltip, triggerRef: ref, text: tooltipText, id: node.id, onHide: function () { return setShowTooltip(false); }, maxWidth: '320px' }))] }));
 };
 
 function transformCalendlyParams(config) {
@@ -24258,7 +24521,24 @@ function QuikFormViewer(_a) {
         };
     }, [setShow]);
     if (!htmlContent)
-        return jsx$1("div", { children: "Loading..." });
+        return (jsx$1("div", exports.__assign({ css: {
+                display: 'flex',
+                alignItems: 'center',
+                justifyContent: 'center',
+                width: '100%',
+                height: '100%',
+                minHeight: 200
+            } }, { children: jsxs("div", exports.__assign({ css: {
+                    display: 'flex',
+                    flexDirection: 'column',
+                    alignItems: 'center',
+                    gap: 16
+                } }, { children: [jsx$1("div", exports.__assign({ css: { fontSize: 28 } }, { children: jsx$1(FeatherySpinner, {}) })), jsx$1("span", exports.__assign({ css: {
+                            fontFamily: "'Helvetica Neue', helvetica, arial, sans-serif",
+                            fontSize: 16,
+                            fontWeight: 400,
+                            color: '#414859'
+                        } }, { children: "Generating your paperwork. Please wait..." }))] })) })));
     return (jsx$1("div", exports.__assign({ css: inline
             ? { width: '100%', height: '100%', overflow: 'auto' }
             : {
@@ -41088,7 +41368,7 @@ function useTrackUserInteraction(formRef, activeStep, stepKey, formName) {
     }, [activeStep, stepKey, formName]);
 }
 
-var LazyAssistantChat = React.lazy(function () { return Promise.resolve().then(function () { return require(/* webpackChunkName: "AssistantChat" */ './fthry_AssistantChat.BjyKdtNo.js'); }).then(function (n) { return n.AssistantChat; }); });
+var LazyAssistantChat = React.lazy(function () { return Promise.resolve().then(function () { return require(/* webpackChunkName: "AssistantChat" */ './fthry_AssistantChat.BT32wDG3.js'); }).then(function (n) { return n.AssistantChat; }); });
 var AssistantChat = function (props) { return (jsx$1(React.Suspense, exports.__assign({ fallback: null }, { children: jsx$1(LazyAssistantChat, exports.__assign({}, props)) }))); };
 
 var AssistantClient = /** @class */ (function () {
@@ -45129,7 +45409,7 @@ function loadSegment(segmentConfig, queue) {
                 case 0:
                     _a.trys.push([0, 2, , 3]);
                     return [4 /*yield*/, Promise.resolve().then(function () { return require(
-                        /* webpackChunkName: "segment" */ './fthry_index.DRA1vbTd.js'); }).then(function (n) { return n.index; })];
+                        /* webpackChunkName: "segment" */ './fthry_index.ByQJ8Db5.js'); }).then(function (n) { return n.index; })];
                 case 1:
                     (AnalyticsBrowserClass = (_a.sent()).AnalyticsBrowser);
                     return [3 /*break*/, 3];
@@ -47153,7 +47433,7 @@ var FeatheryClient = /** @class */ (function (_super) {
      */
     FeatheryClient.prototype._debouncedSubmitCustom = function (override) {
         return __awaiter$2(this, void 0, void 0, function () {
-            var customKeyValues, userId, url, jsonKeyVals, formData, options, uniqueId, req;
+            var customKeyValues, userId, url, jsonKeyVals, formData, options, uniqueId, req, removeInFlight;
             var _this = this;
             return __generator(this, function (_a) {
                 switch (_a.label) {
@@ -47166,6 +47446,13 @@ var FeatheryClient = /** @class */ (function (_super) {
                         if (!isInteractionDetected()) {
                             return [2 /*return*/];
                         }
+                        // If the previous flush hasn't finished yet, skip this cycle. The pending
+                        // updates stay queued and a new debounced cycle is scheduled so they get
+                        // submitted once the in-flight request completes.
+                        if (Object.keys(this.customSubmitInFlight).length) {
+                            this.debouncedSubmitCustom(override);
+                            return [2 /*return*/];
+                        }
                         customKeyValues = exports.__assign({}, this.pendingCustomFieldUpdates);
                         this.pendingCustomFieldUpdates = {}; // Clear pending updates after copying them
                         userId = initInfo().userId;
@@ -47228,7 +47515,8 @@ var FeatheryClient = /** @class */ (function (_super) {
                         this._removeCustomFieldListener();
                         uniqueId = v4$1();
                         req = this.offlineRequestHandler.runOrSaveRequest(function () { return _this._fetch(url, options, true, true); }, url, options, 'submit');
-                        this.customSubmitInFlight[uniqueId] = req.then(function () { return delete _this.customSubmitInFlight[uniqueId]; });
+                        removeInFlight = function () { return delete _this.customSubmitInFlight[uniqueId]; };
+                        this.customSubmitInFlight[uniqueId] = req.then(removeInFlight, removeInFlight);
                         return [4 /*yield*/, req];
                     case 2: return [2 /*return*/, _a.sent()];
                 }
@@ -47251,10 +47539,20 @@ var FeatheryClient = /** @class */ (function (_super) {
                         return [4 /*yield*/, this.debouncedSubmitCustom.flush()];
                     case 1:
                         ret = _a.sent();
-                        return [4 /*yield*/, Promise.all(Object.values(this.customSubmitInFlight))];
+                        _a.label = 2;
                     case 2:
+                        if (!Object.keys(this.customSubmitInFlight).length) return [3 /*break*/, 5];
+                        return [4 /*yield*/, Promise.all(Object.values(this.customSubmitInFlight))];
+                    case 3:
                         _a.sent();
-                        return [2 /*return*/, ret];
+                        if (!Object.keys(this.pendingCustomFieldUpdates).length)
+                            return [3 /*break*/, 5];
+                        this.debouncedSubmitCustom(override);
+                        return [4 /*yield*/, this.debouncedSubmitCustom.flush()];
+                    case 4:
+                        ret = _a.sent();
+                        return [3 /*break*/, 2];
+                    case 5: return [2 /*return*/, ret];
                 }
             });
         });
@@ -47764,9 +48062,9 @@ function init(sdkKey, options) {
     if (runningInClient()) {
         // Dynamically load libraries that must be client side
         global.scriptjsLoadPromise = Promise.resolve().then(function () { return require(
-        /* webpackChunkName: "scriptjs" */ './fthry_script.CrJCYCaD.js'); }).then(function (n) { return n.script; });
+        /* webpackChunkName: "scriptjs" */ './fthry_script.B2r1qN9_.js'); }).then(function (n) { return n.script; });
         global.webfontloaderPromise = Promise.resolve().then(function () { return require(
-        /* webpackChunkName: "webfontloader" */ './fthry_webfontloader.BbP2ET0j.js'); }).then(function (n) { return n.webfontloader; });
+        /* webpackChunkName: "webfontloader" */ './fthry_webfontloader.DbJc3-T2.js'); }).then(function (n) { return n.webfontloader; });
         // Client-side tracking logic
         if (initState.userTracking === 'cookie') {
             var cookieKey = "feathery-user-id-".concat(sdkKey);
@@ -47953,7 +48251,7 @@ function loadCompletedSteps(client) {
     });
 }
 function logFeatheryBadge() {
-    console.log('%c Feathery %c v' + "2.48.1" + ' ', // replaced with real version during build
+    console.log('%c Feathery %c v' + "2.50.0" + ' ', // replaced with real version during build
     'background: #e2626e; color: white; padding: 2px 6px; border-radius: 3px 0 0 3px; font-weight: bold;', 'background: #fce7e9; color: #c5495a; padding: 2px 6px; border-radius: 0 3px 3px 0;');
 }
 
@@ -49549,64 +49847,64 @@ function resolveLabelStyle(style, opts) {
 
 var fieldLoaders = {
     AddressLine1: function () {
-        return Promise.resolve().then(function () { return require(/* webpackChunkName: "AddressField" */ './fthry_index.CqC7Lj7F.js'); });
+        return Promise.resolve().then(function () { return require(/* webpackChunkName: "AddressField" */ './fthry_index.CNXv_44w.js'); });
     },
     ButtonGroupField: function () {
-        return Promise.resolve().then(function () { return require(/* webpackChunkName: "ButtonGroupField" */ './fthry_index.BbZu0dS9.js'); });
+        return Promise.resolve().then(function () { return require(/* webpackChunkName: "ButtonGroupField" */ './fthry_index.D42pyZzz.js'); });
     },
     CheckboxField: function () {
-        return Promise.resolve().then(function () { return require(/* webpackChunkName: "CheckboxField" */ './fthry_index.CGzU2RS3.js'); });
+        return Promise.resolve().then(function () { return require(/* webpackChunkName: "CheckboxField" */ './fthry_index.Cb-o7T3I.js'); });
     },
     CheckboxGroupField: function () {
-        return Promise.resolve().then(function () { return require(/* webpackChunkName: "CheckboxGroupField" */ './fthry_index.C78x3b5O.js'); });
+        return Promise.resolve().then(function () { return require(/* webpackChunkName: "CheckboxGroupField" */ './fthry_index.BdAvU9aA.js'); });
     },
     ColorPickerField: function () {
-        return Promise.resolve().then(function () { return require(/* webpackChunkName: "ColorPickerField" */ './fthry_index.foJzYyYX.js'); });
+        return Promise.resolve().then(function () { return require(/* webpackChunkName: "ColorPickerField" */ './fthry_index.QAttsABq.js'); });
     },
     CustomField: function () {
-        return Promise.resolve().then(function () { return require(/* webpackChunkName: "CustomField" */ './fthry_index.ycfNh9WZ.js'); });
+        return Promise.resolve().then(function () { return require(/* webpackChunkName: "CustomField" */ './fthry_index.m_XKSVM8.js'); });
     },
     DateSelectorField: function () {
-        return Promise.resolve().then(function () { return require(/* webpackChunkName: "DateSelectorField" */ './fthry_index.WdgJ-r5S.js'); });
+        return Promise.resolve().then(function () { return require(/* webpackChunkName: "DateSelectorField" */ './fthry_index.DAY5VW01.js'); });
     },
     DropdownField: function () {
-        return Promise.resolve().then(function () { return require(/* webpackChunkName: "DropdownField" */ './fthry_index.Bkg_JW4Z.js'); });
+        return Promise.resolve().then(function () { return require(/* webpackChunkName: "DropdownField" */ './fthry_index.D3svtoqj.js'); });
     },
     DropdownMultiField: function () {
-        return Promise.resolve().then(function () { return require(/* webpackChunkName: "DropdownMultiField" */ './fthry_index.BpZi8dM4.js'); });
+        return Promise.resolve().then(function () { return require(/* webpackChunkName: "DropdownMultiField" */ './fthry_index.BDV7qf2C.js'); });
     },
     FileUploadField: function () {
-        return Promise.resolve().then(function () { return require(/* webpackChunkName: "FileUploadField" */ './fthry_index.BOexWQ2G.js'); });
+        return Promise.resolve().then(function () { return require(/* webpackChunkName: "FileUploadField" */ './fthry_index.COg3w9c8.js'); });
     },
     MatrixField: function () {
-        return Promise.resolve().then(function () { return require(/* webpackChunkName: "MatrixField" */ './fthry_index.CeKZIDEV.js'); });
+        return Promise.resolve().then(function () { return require(/* webpackChunkName: "MatrixField" */ './fthry_index.QRzfI0b4.js'); });
     },
     PasswordField: function () {
-        return Promise.resolve().then(function () { return require(/* webpackChunkName: "PasswordField" */ './fthry_index.O5z58cdJ.js'); });
+        return Promise.resolve().then(function () { return require(/* webpackChunkName: "PasswordField" */ './fthry_index.DjKuHZML.js'); });
     },
     PaymentMethodField: function () {
-        return Promise.resolve().then(function () { return require(/* webpackChunkName: "PaymentMethodField" */ './fthry_PaymentMethodField.Cx5IV_Aw.js'); });
+        return Promise.resolve().then(function () { return require(/* webpackChunkName: "PaymentMethodField" */ './fthry_PaymentMethodField.vpxb_M9_.js'); });
     },
-    PhoneField: function () { return Promise.resolve().then(function () { return require(/* webpackChunkName: "PhoneField" */ './fthry_index.B1e00tAu.js'); }); },
+    PhoneField: function () { return Promise.resolve().then(function () { return require(/* webpackChunkName: "PhoneField" */ './fthry_index.CW8fXwgP.js'); }); },
     PinInputField: function () {
-        return Promise.resolve().then(function () { return require(/* webpackChunkName: "PinInputField" */ './fthry_index.CRXRQpkJ.js'); });
+        return Promise.resolve().then(function () { return require(/* webpackChunkName: "PinInputField" */ './fthry_index.u0sKUa7-.js'); });
     },
-    QRScanner: function () { return Promise.resolve().then(function () { return require(/* webpackChunkName: "QRScanner" */ './fthry_index.BhoKqCQO.js'); }); },
+    QRScanner: function () { return Promise.resolve().then(function () { return require(/* webpackChunkName: "QRScanner" */ './fthry_index.BLKRQSHw.js'); }); },
     RadioButtonGroupField: function () {
         return Promise.resolve().then(function () { return require(
-        /* webpackChunkName: "RadioButtonGroupField" */ './fthry_index.97eysi95.js'); });
+        /* webpackChunkName: "RadioButtonGroupField" */ './fthry_index.C6YeHjI_.js'); });
     },
     RatingField: function () {
-        return Promise.resolve().then(function () { return require(/* webpackChunkName: "RatingField" */ './fthry_index.B3VA122M.js'); });
+        return Promise.resolve().then(function () { return require(/* webpackChunkName: "RatingField" */ './fthry_index.DqCigvUs.js'); });
     },
     SignatureField: function () {
-        return Promise.resolve().then(function () { return require(/* webpackChunkName: "SignatureField" */ './fthry_index.SMUP75Ic.js'); });
+        return Promise.resolve().then(function () { return require(/* webpackChunkName: "SignatureField" */ './fthry_index.DgVU5DPg.js'); });
     },
     SliderField: function () {
-        return Promise.resolve().then(function () { return require(/* webpackChunkName: "SliderField" */ './fthry_index.CU2qYyyW.js'); });
+        return Promise.resolve().then(function () { return require(/* webpackChunkName: "SliderField" */ './fthry_index.CSq9ML1V.js'); });
     },
-    TextField: function () { return Promise.resolve().then(function () { return require(/* webpackChunkName: "TextField" */ './fthry_index.DghgxDID.js'); }); },
-    TextArea: function () { return Promise.resolve().then(function () { return require(/* webpackChunkName: "TextArea" */ './fthry_index.CeWHxiu2.js'); }); }
+    TextField: function () { return Promise.resolve().then(function () { return require(/* webpackChunkName: "TextField" */ './fthry_index.ClbpUjqu.js'); }); },
+    TextArea: function () { return Promise.resolve().then(function () { return require(/* webpackChunkName: "TextArea" */ './fthry_index.CX5Tx1di.js'); }); }
 };
 var getPositionKey = function (element) { var _a; return ((_a = element.position) === null || _a === void 0 ? void 0 : _a.join(',')) || 'root'; };
 // Share the resolved component between preload and render. A separate
@@ -50365,16 +50663,6 @@ function applyButtonStyles(element, responsiveStyles) {
         return {};
     });
     responsiveStyles.applyTextAlign('buttonLabel');
-    // Fit-width buttons shrink to their text and padding, so prevent the
-    // text from wrapping
-    responsiveStyles.apply('buttonLabel', 'width_unit', function (unit) {
-        if (!isFit(unit))
-            return {};
-        return {
-            whiteSpace: 'nowrap',
-            'span, a': { whiteSpace: 'pre' }
-        };
-    });
     responsiveStyles.apply('button', [
         'uploader_padding_top',
         'uploader_padding_right',
@@ -50868,8 +51156,8 @@ function ElementSkeleton(_a) {
 }
 var templateObject_1;
 
-var TableElement = React.lazy(function () { return Promise.resolve().then(function () { return require(/* webpackChunkName: "TableElement" */ './fthry_index.duLdHjUv.js'); }); });
-var TabsElement = React.lazy(function () { return Promise.resolve().then(function () { return require(/* webpackChunkName: "TabsElement" */ './fthry_TabsElement.C1KUbyBb.js'); }); });
+var TableElement = React.lazy(function () { return Promise.resolve().then(function () { return require(/* webpackChunkName: "TableElement" */ './fthry_index.DpQfBE8n.js'); }); });
+var TabsElement = React.lazy(function () { return Promise.resolve().then(function () { return require(/* webpackChunkName: "TabsElement" */ './fthry_TabsElement.BHVCgyd9.js'); }); });
 var Basic = {
     ImageElement: ImageElement,
     VideoElement: VideoElement,
@@ -50915,15 +51203,18 @@ exports.FeatheryClient = FeatheryClient;
 exports.Fragment = Fragment;
 exports.Global = Global;
 exports.Grid = Grid;
+exports.HoverTooltip = HoverTooltip;
 exports.JSForm = JSForm;
 exports.KEYFRAMES = KEYFRAMES;
 exports.LoginForm = LoginForm;
 exports.MODAL_Z_INDEX = MODAL_Z_INDEX;
 exports.MOZ = MOZ;
 exports.MS = MS;
+exports.Overlay = Overlay;
 exports.RULESET = RULESET;
 exports.ReactForm = ReactForm;
 exports.StyledContainer = StyledContainer;
+exports.Tooltip = Tooltip;
 exports.WEBKIT = WEBKIT;
 exports.__awaiter = __awaiter$2;
 exports.__extends = __extends;