@feathery/react 2.12.3-pr-1522.4bcc507.0 → 2.14.0

package/dist/esm/fthry_index.Cvc2tCaE.js

@@ -1,39 +0,0 @@
-import { b as jsx, a as __assign, _ as __read, j as jsxs, E as ErrorInput } from './fthry_index.ChZdNtIX.js';
-import { useState } from 'react';
-import 'react/jsx-runtime';
-import 'react-dom/client';
-import 'jszip';
-import 'react-dom';
-
-function RatingStar(props) {
-    return (jsx("svg", __assign({ width: '32', viewBox: '0 0 32 31', fill: '#D9D9D9', xmlns: 'http://www.w3.org/2000/svg' }, props, { children: jsx("path", { d: 'M24.9576 20.3922C24.8671 19.8489 25.0482 19.2875 25.4466 18.9072L31.2598 13.1846C31.6401 12.8224 31.7849 12.3515 31.7668 11.8988C31.7668 11.8263 31.7668 11.7539 31.7487 11.6815C31.6763 11.3555 31.5314 11.0476 31.296 10.8122L31.2055 10.7216C31.1873 10.7126 31.1738 10.699 31.1602 10.6854C31.1466 10.6718 31.133 10.6583 31.1149 10.6492C30.8976 10.4862 30.6259 10.3595 30.3181 10.3232L30.137 10.3051L22.2593 9.16422C21.9514 9.1099 21.6798 8.98313 21.4444 8.80203C21.2633 8.65715 21.1003 8.45795 20.9916 8.24063L17.3878 0.942454C17.098 0.344836 16.5367 0.0188638 15.9571 0.000754181C15.3414 -0.0173554 14.7076 0.290508 14.3816 0.942454L10.7778 8.24063C10.5424 8.7477 10.0534 9.09179 9.51012 9.16422L1.45135 10.3413C0.0569115 10.5406 -0.48639 12.2429 0.509634 13.2208L6.34093 18.9072C6.73936 19.2875 6.92044 19.8489 6.8299 20.3922L5.45356 28.4148C5.43547 28.5595 5.43546 28.6862 5.43546 28.8129C5.47167 29.3018 5.70711 29.7186 6.05118 30.0084C6.54014 30.4068 7.24642 30.5336 7.89837 30.1895L13.0053 27.5093L15.1241 26.4046C15.4139 26.2597 15.7398 26.1873 16.0658 26.2235C16.2831 26.2416 16.5004 26.2959 16.6996 26.4046L16.7358 26.4227L23.527 29.9903L23.8892 30.1895C25.1206 30.8414 26.5694 29.7911 26.3339 28.4148L24.9576 20.3922Z' }) })));
-}
-
-function Heart(props) {
-    return (jsx("svg", __assign({ xmlns: 'http://www.w3.org/2000/svg', width: '32', viewBox: '0 0 24 24', fill: '#000000' }, props, { children: jsx("path", { d: 'M12 5.881C12.981 4.729 14.484 4 16.05 4C18.822 4 21 6.178 21 8.95C21 12.3492 17.945 15.1195 13.3164 19.3167L13.305 19.327L12 20.515L10.695 19.336L10.6595 19.3037C6.04437 15.1098 3 12.3433 3 8.95C3 6.178 5.178 4 7.95 4C9.516 4 11.019 4.729 12 5.881Z' }) })));
-}
-
-function RatingField(_a) {
-    var _b;
-    var element = _a.element, fieldLabel = _a.fieldLabel, responsiveStyles = _a.responsiveStyles, fieldVal = _a.fieldVal, editMode = _a.editMode, _c = _a.onChange, onChange = _c === void 0 ? function () { } : _c, _d = _a.elementProps, elementProps = _d === void 0 ? {} : _d, _e = _a.disabled, disabled = _e === void 0 ? false : _e, children = _a.children;
-    var _f = __read(useState(null), 2), hoverIndex = _f[0], setHoverIndex = _f[1];
-    var servar = element.servar;
-    var numRatings = (_b = servar.max_length) !== null && _b !== void 0 ? _b : 5;
-    // If no field value, default to 1 less than the max
-    fieldVal = fieldVal !== null && fieldVal !== void 0 ? fieldVal : numRatings - 1;
-    var Icon = element.styles.icon_type === 'heart' ? Heart : RatingStar;
-    return (jsxs("div", __assign({ css: __assign({ maxWidth: '100%', width: '100%', height: '100%', position: 'relative' }, responsiveStyles.getTarget('fc')) }, elementProps, { children: [children, fieldLabel, jsxs("div", __assign({ css: { display: 'flex', justifyContent: 'space-around' } }, { children: [Array(numRatings)
-                        .fill(null)
-                        .map(function (_, index) {
-                        var activeStyles = {};
-                        if (hoverIndex === null) {
-                            if (index <= fieldVal - 1)
-                                activeStyles = responsiveStyles.getTarget('selectedRating');
-                        }
-                        else if (index <= hoverIndex)
-                            activeStyles = responsiveStyles.getTarget('hoverRating');
-                        return (jsx(Icon, { onClick: function () { return onChange(index + 1); }, onMouseEnter: function () { return setHoverIndex(index); }, onMouseLeave: function () { return setHoverIndex(null); }, css: __assign(__assign({ pointerEvents: editMode || disabled ? 'none' : 'auto', cursor: editMode || disabled ? 'default' : 'pointer', width: "".concat(100 / numRatings, "%"), paddingRight: '5px' }, responsiveStyles.getTarget('field')), activeStyles) }, index));
-                    }), jsx(ErrorInput, { id: servar.key, name: servar.key, "aria-label": element.properties.aria_label })] }))] })));
-}
-
-export { RatingField as default };

package/dist/esm/fthry_index.DE7Dh4ea.js

@@ -1,290 +0,0 @@
-import { j as jsxs, a as __assign, b as jsx, D as DROPDOWN_Z_INDEX, _ as __read, u as useBorder, ar as getFieldValue, as as stringifyWithNull, h as hoverStylesGuard, i as iosScrollOnFocus, k as FORM_Z_INDEX, r as resetStyles, at as emailPatternStr } from './fthry_index.ChZdNtIX.js';
-import { memo, useRef, useState } from 'react';
-import { P as Placeholder } from './fthry_Placeholder.BZZOH4gv.js';
-import { I as InlineTooltip } from './fthry_InlineTooltip.DwsGjmPQ.js';
-import { O as Overlay } from './fthry_Overlay.DkCTSVzA.js';
-import { u as useElementSize } from './fthry_useElementSize.CuzKKLqH.js';
-import { S as ShowEyeIcon, a as ShowEyeIcon$1 } from './fthry_ShowEyeIcon.FVKM_CUd.js';
-import { a as IMaskInput } from './fthry_input.DgpAkI4d.js';
-import 'react/jsx-runtime';
-import 'react-dom/client';
-import 'jszip';
-import 'react-dom';
-import './fthry_index.CLVY8zB_.js';
-
-function TextAutocomplete(_a) {
-    var _b = _a.allOptions, allOptions = _b === void 0 ? [] : _b, showOptions = _a.showOptions, _c = _a.onSelect, onSelect = _c === void 0 ? function () { } : _c, _d = _a.onHide, onHide = _d === void 0 ? function () { } : _d, _e = _a.onInputFocus, onInputFocus = _e === void 0 ? function () { } : _e, _f = _a.value, value = _f === void 0 ? '' : _f, containerRef = _a.containerRef, responsiveStyles = _a.responsiveStyles, listItemRef = _a.listItemRef, children = _a.children;
-    var options = allOptions.filter(function (opt) {
-        return opt.toLowerCase().includes(value.toLowerCase());
-    });
-    var triggerRef = useRef(null);
-    var dropdownWidth = useElementSize(triggerRef).width;
-    if (allOptions.length === 0)
-        return children;
-    return (jsxs("div", __assign({ ref: triggerRef, css: { height: '100%', width: '100%' } }, { children: [children, options.length > 0 && showOptions && (jsx(Overlay, __assign({ targetRef: triggerRef, containerRef: containerRef, show: true, placement: 'bottom-start', onHide: onHide }, { children: jsx("ul", __assign({ css: __assign({ zIndex: DROPDOWN_Z_INDEX, listStyleType: 'none', padding: 0, margin: 0, maxHeight: '210px', overflowY: 'scroll', overflowX: 'auto', width: dropdownWidth !== undefined ? "".concat(dropdownWidth, "px") : '100%', backgroundColor: 'white', cursor: 'pointer', boxShadow: '0 0 4px rgb(0 0 0 / 15%)' }, responsiveStyles.getTarget('dropdown')) }, { children: options.map(function (opt, index) { return (jsx("li", __assign({ css: {
-                            padding: '8px 14px',
-                            transition: '0.1s ease all',
-                            '&:hover': { backgroundColor: '#e6e6e633' },
-                            '&:focus-visible': {
-                                outline: 'none',
-                                backgroundColor: '#e6e6e644'
-                            }
-                        }, tabIndex: 0, ref: function (ref) {
-                            listItemRef.current[index] = ref;
-                        }, onClick: function () { return onSelect(opt); }, onKeyDown: function (e) {
-                            var _a, _b;
-                            var disable = function () {
-                                e.preventDefault();
-                                e.stopPropagation();
-                            };
-                            if (e.key === 'Enter') {
-                                disable();
-                                onSelect(opt);
-                            }
-                            else if (['ArrowDown', 'ArrowRight'].includes(e.key)) {
-                                disable();
-                                (_a = listItemRef.current[index].nextSibling) === null || _a === void 0 ? void 0 : _a.focus();
-                            }
-                            else if (['ArrowUp', 'ArrowLeft'].includes(e.key)) {
-                                disable();
-                                if (index === 0)
-                                    onInputFocus();
-                                else
-                                    (_b = listItemRef.current[index].previousSibling) === null || _b === void 0 ? void 0 : _b.focus();
-                            }
-                        }, onBlur: function (e) {
-                            if (!e.relatedTarget ||
-                                !listItemRef.current.some(function (item) { return item === e.relatedTarget; })) {
-                                onHide();
-                            }
-                        } }, { children: opt }), "".concat(opt, "-").concat(index))); }) })) })))] })));
-}
-var TextAutocomplete$1 = memo(TextAutocomplete);
-
-var DEFAULT_LENGTH = 1024; // Default limit on backend
-var MAX_FIELD_LENGTHS = {
-    text_area: 16384,
-    url: 256,
-    gmap_zip: 10
-};
-var maxFieldLength = function (type) { var _a; return (_a = MAX_FIELD_LENGTHS[type]) !== null && _a !== void 0 ? _a : DEFAULT_LENGTH; };
-function escapeDefinitionChars(str) {
-    return (str !== null && str !== void 0 ? str : '')
-        .replaceAll('0', '\\0')
-        .replaceAll('a', '\\a')
-        .replaceAll('b', '\\b')
-        .replaceAll('*', '\\*');
-}
-function constraintChar(allowed) {
-    switch (allowed) {
-        case 'letters':
-            return 'a';
-        case 'alphanumeric':
-            return 'b';
-        case 'alphaspace':
-            return 'c';
-        case 'digits':
-            return '0';
-        default:
-            return '*';
-    }
-}
-function getTextFieldMask(servar) {
-    var data = servar.metadata;
-    var prefix = escapeDefinitionChars(data.prefix);
-    var suffix = escapeDefinitionChars(data.suffix);
-    var mask = '';
-    if (data.mask)
-        mask = data.mask;
-    else {
-        var allowed = data.allowed_characters;
-        if (servar.type === 'gmap_zip' && !allowed)
-            allowed = 'alphaspace';
-        var definitionChar = constraintChar(allowed);
-        var numOptional = maxFieldLength(servar.type) - prefix.length - suffix.length;
-        if (servar.max_length)
-            numOptional = Math.min(servar.max_length, numOptional);
-        mask = "[".concat(definitionChar.repeat(numOptional), "]");
-    }
-    // Approximate dynamic input by making each character optional
-    return "".concat(prefix).concat(mask).concat(suffix);
-}
-function getMaskProps(servar, value, showPassword) {
-    var _a, _b, _c;
-    var maskProps;
-    // Max length included in mask for validation of typed inputs
-    var maxLength = (_a = servar.max_length) !== null && _a !== void 0 ? _a : maxFieldLength(servar.type);
-    switch (servar.type) {
-        case 'integer_field':
-            maskProps = {
-                mask: 'num',
-                blocks: {
-                    num: {
-                        mask: Number,
-                        radix: '.',
-                        thousandsSeparator: ',',
-                        scale: 2,
-                        // Larger numbers get converted to scientific notation when sent to backend
-                        max: (_b = servar.max_length) !== null && _b !== void 0 ? _b : Number.MAX_SAFE_INTEGER,
-                        min: Math.max(0, (_c = servar.min_length) !== null && _c !== void 0 ? _c : 0)
-                    }
-                },
-                value: value.toString()
-            };
-            if (servar.format === 'currency') {
-                maskProps.mask = '$num';
-            }
-            break;
-        case 'ssn':
-            maskProps = {
-                // mask uses ∗ character which is like * but centered in inputs
-                mask: servar.metadata.last_four_digits
-                    ? '∗∗∗ - ∗∗ - 0000'
-                    : '000 - 00 - 0000',
-                // displayChar allows for secure entry without using password input
-                // this prevents browser password manager from triggering on SSN fields
-                displayChar: showPassword ? undefined : '∗',
-                placeholderChar: servar.metadata.last_four_digits ? ' ' : undefined,
-                lazy: !servar.metadata.last_four_digits
-            };
-            break;
-        case 'email':
-        case 'text_area':
-        case 'url':
-            maskProps = { mask: new RegExp("^.{0,".concat(maxLength, "}$")), maxLength: maxLength };
-            break;
-        default:
-            if (servar.metadata.mask)
-                maxLength = undefined;
-            maskProps = {
-                mask: getTextFieldMask(servar),
-                definitions: {
-                    b: /[a-zA-Z0-9]/,
-                    c: /[a-zA-Z0-9 ]/
-                },
-                maxLength: maxLength
-            };
-            break;
-    }
-    return __assign({ lazy: false, unmask: !servar.metadata.save_mask }, maskProps);
-}
-function getInputProps(servar, options, autoComplete) {
-    var _a;
-    var constraints = {
-        minLength: servar.min_length
-    };
-    // Max length included here for validation of programmatically set
-    // inputs
-    var maxLength = (_a = servar.max_length) !== null && _a !== void 0 ? _a : maxFieldLength(servar.type);
-    if (options.length > 0)
-        constraints.autoComplete = 'off';
-    var meta = servar.metadata;
-    switch (servar.type) {
-        case 'integer_field':
-            return { inputMode: 'decimal' };
-        case 'email':
-            if (autoComplete && !constraints.autoComplete) {
-                constraints.autoComplete = 'email';
-            }
-            return __assign({ type: 'email', pattern: emailPatternStr, maxLength: maxLength }, constraints);
-        case 'gmap_zip':
-            if (autoComplete && !constraints.autoComplete) {
-                constraints.autoComplete = 'postal-code';
-            }
-            return __assign(__assign({}, constraints), { maxLength: maxLength, inputMode: (meta.allowed_characters === 'digits'
-                    ? 'numeric'
-                    : 'text') });
-        case 'url':
-            if (autoComplete && !constraints.autoComplete) {
-                constraints.autoComplete = 'url';
-                constraints.maxLength = maxLength;
-            }
-            return constraints;
-        case 'ssn':
-            return __assign({ inputMode: 'numeric' }, constraints);
-        default:
-            constraints.maxLength = maxLength;
-            if (meta.custom_autocomplete && !constraints.autoComplete)
-                constraints.autoComplete = meta.custom_autocomplete;
-            if (meta.number_keypad || meta.allowed_characters === 'digits') {
-                return __assign({ inputMode: 'numeric' }, constraints);
-            }
-            return constraints;
-    }
-}
-var EXIT_DELAY_TIME = 200;
-function TextField(_a) {
-    var _b;
-    var _c;
-    var element = _a.element, responsiveStyles = _a.responsiveStyles, fieldLabel = _a.fieldLabel, _d = _a.elementProps, elementProps = _d === void 0 ? {} : _d, _e = _a.required, required = _e === void 0 ? false : _e, _f = _a.disabled, disabled = _f === void 0 ? false : _f, autoComplete = _a.autoComplete, editMode = _a.editMode, _g = _a.onAccept, onAccept = _g === void 0 ? function () { } : _g, _h = _a.onEnter, onEnter = _h === void 0 ? function () { } : _h, _j = _a.setRef, setRef = _j === void 0 ? function () { } : _j, inlineError = _a.inlineError, _k = _a.repeatIndex, repeatIndex = _k === void 0 ? null : _k, children = _a.children;
-    var _l = __read(useState(false), 2), showAutocomplete = _l[0], setShowAutocomplete = _l[1];
-    // Hide SSNs by default
-    var _m = __read(useState(false), 2), showPassword = _m[0], setShowPassword = _m[1];
-    var _o = useBorder({
-        element: element,
-        error: inlineError,
-        breakpoint: responsiveStyles.getMobileBreakpoint()
-    }), borderStyles = _o.borderStyles, customBorder = _o.customBorder, borderId = _o.borderId;
-    var containerRef = useRef(null);
-    var listItemRef = useRef([]);
-    var inputRef = useRef(null);
-    var fieldVal = getFieldValue(element).value;
-    var rawValue = stringifyWithNull(fieldVal);
-    var servar = element.servar;
-    var options = ((_c = servar.metadata.options) !== null && _c !== void 0 ? _c : []).filter(function (opt) { return opt; });
-    var spacing = element.properties.tooltipText ? 30 : 8;
-    return (jsxs("div", __assign({ ref: containerRef, css: __assign({ maxWidth: '100%', width: '100%', height: '100%', position: 'relative', pointerEvents: editMode ? 'none' : 'auto' }, responsiveStyles.getTarget('fc')) }, elementProps, { children: [children, fieldLabel, jsxs("div", __assign({ css: __assign(__assign(__assign({ position: 'relative', width: '100%', whiteSpace: 'nowrap', 
-                    // Prevent placeholder overflow
-                    overflowX: 'clip' }, responsiveStyles.getTarget('sub-fc')), (disabled ? responsiveStyles.getTarget('disabled') : {})), { '&:focus-within': __assign(__assign({}, responsiveStyles.getTarget('active')), borderStyles.active), '&:hover': hoverStylesGuard(disabled
-                        ? {}
-                        : __assign(__assign({}, responsiveStyles.getTarget('hover')), borderStyles.hover)) }) }, { children: [jsx(TextAutocomplete$1, __assign({ allOptions: options, value: rawValue, showOptions: showAutocomplete, onSelect: function (option) {
-                            var _a, _b, _c;
-                            onAccept(option, {});
-                            setShowAutocomplete(false);
-                            (_c = (_b = (_a = inputRef.current) === null || _a === void 0 ? void 0 : _a.element) === null || _b === void 0 ? void 0 : _b.focus) === null || _c === void 0 ? void 0 : _c.call(_b);
-                        }, responsiveStyles: responsiveStyles, containerRef: containerRef, listItemRef: listItemRef, onHide: function () { return setShowAutocomplete(false); }, onInputFocus: function () { var _a, _b, _c; return (_c = (_b = (_a = inputRef.current) === null || _a === void 0 ? void 0 : _a.element) === null || _b === void 0 ? void 0 : _b.focus) === null || _c === void 0 ? void 0 : _c.call(_b); } }, { children: jsx(IMaskInput, __assign({ id: servar.key, name: servar.key, ref: inputRef, css: __assign(__assign(__assign({ position: 'relative', 
-                                // Position input above the border div
-                                zIndex: FORM_Z_INDEX, height: '100%', width: '100%', border: 'none', margin: 0, backgroundColor: 'transparent' }, resetStyles), responsiveStyles.getTarget('field')), (_b = { '&:focus': responsiveStyles.getTarget('field')['&:focus'] }, _b["&:focus ~ #".concat(borderId)] = Object.values(borderStyles.active)[0], _b['&:not(:focus)'] = rawValue || !element.properties.placeholder
-                                ? {}
-                                : { color: 'transparent !important' }, _b)), required: required, disabled: disabled, placeholder: '', value: rawValue, "aria-label": element.properties.aria_label, 
-                            // Not on focus because if error is showing, it will
-                            // keep triggering dropdown after blur
-                            onKeyDown: function (e) {
-                                if (e.key === 'Enter')
-                                    onEnter(e);
-                                else if (options.length) {
-                                    if (!rawValue && ['Backspace', 'Delete'].includes(e.key))
-                                        return;
-                                    if (['ArrowUp', 'ArrowLeft', 'ArrowRight'].includes(e.key))
-                                        return;
-                                    setShowAutocomplete(e.key !== 'Escape');
-                                    if (e.key === 'ArrowDown') {
-                                        setTimeout(function () {
-                                            var _a;
-                                            return (_a = listItemRef.current[0]) === null || _a === void 0 ? void 0 : _a.focus({
-                                                preventScroll: true
-                                            });
-                                        }, 0);
-                                    }
-                                }
-                            }, onBlur: function (e) {
-                                if (e.relatedTarget &&
-                                    listItemRef.current.some(function (item) { return item === e.relatedTarget; }))
-                                    return;
-                                if (options.length > 0) {
-                                    // Blur may be triggered by option selection, and option
-                                    // click logic may need to be run first. So delay option removal.
-                                    setTimeout(function () { return setShowAutocomplete(false); }, EXIT_DELAY_TIME);
-                                }
-                            }, onFocus: iosScrollOnFocus, inputRef: setRef }, getInputProps(servar, options, autoComplete === 'on'), getMaskProps(servar, rawValue, showPassword), { onAccept: onAccept })) })), servar.type === 'ssn' && rawValue && (jsx("div", __assign({ css: {
-                            position: 'absolute',
-                            cursor: 'pointer',
-                            insetInlineEnd: "".concat(spacing, "px"),
-                            // We need to subtract half the height of the icon to center it
-                            top: 'calc(50% - 12px)',
-                            zIndex: FORM_Z_INDEX
-                        }, onClick: function () { return setShowPassword(function (prev) { return !prev; }); }, "aria-label": 'Toggle SSN visibility' }, { children: showPassword ? jsx(ShowEyeIcon, {}) : jsx(ShowEyeIcon$1, {}) }))), customBorder, jsx(Placeholder, { value: rawValue, element: element, responsiveStyles: responsiveStyles, repeatIndex: repeatIndex }), jsx(InlineTooltip, { containerRef: containerRef, id: element.id, text: element.properties.tooltipText, responsiveStyles: responsiveStyles, repeat: element.repeat })] }))] })));
-}
-var index = memo(TextField);
-
-export { index as default };