envoc-form 3.3.0 → 4.0.1-2

package/es/Form/FormBasedPreventNavigation.js

@@ -1,30 +1,53 @@
-import { useEffect } from 'react';
-import { useFormikContext } from 'formik';
-export default function FormBasedPreventNavigation(_ref) {
-  var ignoreLostChanges = _ref.ignoreLostChanges,
-      _ref$promptMessage = _ref.promptMessage,
-      promptMessage = _ref$promptMessage === void 0 ? 'Changes you made may not be saved.' : _ref$promptMessage;
-
-  var _useFormikContext = useFormikContext(),
-      dirty = _useFormikContext.dirty,
-      isSubmitting = _useFormikContext.isSubmitting;
-
-  var preventNavigate = !ignoreLostChanges && dirty && !isSubmitting;
-  useEffect(function () {
-    if (!preventNavigate) {
-      return;
-    }
-
-    window.addEventListener('beforeunload', beforeUnload);
-    return function () {
-      window.removeEventListener('beforeunload', beforeUnload);
-    };
-
-    function beforeUnload(e) {
-      e.preventDefault();
-      e.returnValue = promptMessage;
-    }
-  }, [preventNavigate, promptMessage]); // TODO: https://reactrouter.com/docs/en/v6/upgrading/v5#prompt-is-not-currently-supported
-
-  return null;
-}
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+import { useContext, useEffect } from 'react';
+// see: https://gist.github.com/rmorse/426ffcc579922a82749934826fa9f743
+import { UNSAFE_NavigationContext as NavigationContext, } from 'react-router-dom';
+import { useFormikContext } from 'formik';
+export default function FormBasedPreventNavigation(_a) {
+    var ignoreLostChanges = _a.ignoreLostChanges, _b = _a.promptMessage, promptMessage = _b === void 0 ? 'Changes you made may not be saved.' : _b;
+    var _c = useFormikContext(), dirty = _c.dirty, isSubmitting = _c.isSubmitting;
+    var preventNavigate = !ignoreLostChanges && dirty && !isSubmitting;
+    var navigator = useContext(NavigationContext).navigator;
+    useEffect(function () {
+        if (!preventNavigate) {
+            return;
+        }
+        // TODO: https://reactrouter.com/docs/en/v6/upgrading/v5#prompt-is-not-currently-supported
+        // this is a workaround until we get native support for prompt on navigate
+        var blocker = function (tx) {
+            if (window.confirm(promptMessage)) {
+                tx.retry();
+            }
+        };
+        var unblock = navigator.block(function (tx) {
+            var autoUnblockingTx = __assign(__assign({}, tx), { retry: function () {
+                    // Automatically unblock the transition so it can play all the way
+                    // through before retrying it. TODO: Figure out how to re-enable
+                    // this block if the transition is cancelled for some reason.
+                    unblock();
+                    tx.retry();
+                } });
+            blocker(autoUnblockingTx);
+        });
+        window.addEventListener('beforeunload', beforeUnload);
+        return function () {
+            unblock();
+            window.removeEventListener('beforeunload', beforeUnload);
+        };
+        function beforeUnload(e) {
+            e.preventDefault();
+            e.returnValue = promptMessage;
+        }
+    }, [preventNavigate, promptMessage, navigator]);
+    return null;
+}

package/es/Form/ServerErrorContext.d.ts

@@ -0,0 +1,10 @@
+import React from 'react';
+export interface ServerErrors {
+    [path: string]: string;
+}
+export interface ServerErrorContextProps {
+    errors: ServerErrors;
+    getError: (path: string) => string | undefined;
+    setError: (path: string, errorMessage: string | undefined) => void;
+}
+export declare const ServerErrorContext: React.Context<ServerErrorContextProps>;

package/es/Form/ServerErrorContext.js

@@ -1,6 +1,8 @@
-import React from 'react';
-var ServerErrorContext = /*#__PURE__*/React.createContext({
-  getError: function getError(path) {},
-  setError: function setError(path, errorMessage) {}
-});
-export default ServerErrorContext;
+import React from 'react';
+export var ServerErrorContext = React.createContext({
+    errors: {},
+    getError: function (path) {
+        return undefined;
+    },
+    setError: function (path, errorMessage) { },
+});

package/es/FormActions.d.ts

@@ -0,0 +1,7 @@
+/// <reference types="react" />
+export interface FormActionsProps {
+    allowPristineSubmit?: boolean;
+    handleCancel?: () => void;
+    disabled?: boolean;
+}
+export default function FormActions({ allowPristineSubmit, handleCancel, disabled, }: FormActionsProps): JSX.Element;

package/es/FormActions.js

@@ -0,0 +1,22 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { useFormikContext } from 'formik';
+import SubmitFormButton from './SubmitFormButton';
+export default function FormActions(_a) {
+    var allowPristineSubmit = _a.allowPristineSubmit, handleCancel = _a.handleCancel, disabled = _a.disabled;
+    var isSubmitting = useFormikContext().isSubmitting;
+    return (_jsxs(_Fragment, { children: [_jsx(SubmitFormButton, { className: "form-actions", allowPristineSubmit: allowPristineSubmit, disabled: disabled }), _jsx("button", __assign({ type: "button", className: "form-actions cancel-form-button", disabled: isSubmitting || disabled, onClick: handleCancel || goBack }, { children: "Cancel" }))] }));
+    function goBack() {
+        window.history.back();
+    }
+}

package/es/Group.d.ts

@@ -0,0 +1,13 @@
+/// <reference types="react" />
+import { InjectedFieldProps } from './Field/InjectedFieldProps';
+export interface GroupProps extends InjectedFieldProps<any> {
+    className?: string;
+    children: React.ReactNode;
+    /** simple text label before the input */
+    label?: string;
+    /** simple helper text after the input*/
+    helpText?: string | React.ReactNode;
+    disabled?: boolean;
+}
+/** contains standard field bits like a label, helper text, error scroll target, validation message container, etc */
+export default function Group({ className, children, label, helpText, meta, input, disabled, }: GroupProps): JSX.Element;

package/es/Group.js

@@ -0,0 +1,22 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import classNames from 'classnames';
+import FieldErrorScrollTarget from './Field/FieldErrorScrollTarget';
+/** contains standard field bits like a label, helper text, error scroll target, validation message container, etc */
+export default function Group(_a) {
+    var className = _a.className, children = _a.children, label = _a.label, helpText = _a.helpText, meta = _a.meta, input = _a.input, disabled = _a.disabled;
+    return (_jsxs("div", __assign({ className: classNames(className, 'group', {
+            'is-invalid': meta.error,
+            disabled: disabled,
+        }) }, { children: [_jsx(FieldErrorScrollTarget, {}), meta.warning && _jsx("div", __assign({ className: "warning" }, { children: meta.warning })), _jsx("label", __assign({ htmlFor: input.id }, { children: label })), children, meta.error && _jsx("div", __assign({ className: "error" }, { children: meta.error })), helpText && _jsx("div", __assign({ className: "help" }, { children: helpText }))] })));
+}

package/es/Input/IconInputGroup.d.ts

@@ -0,0 +1,9 @@
+import React from 'react';
+import { InputGroupProps } from './InputGroup';
+export interface IconInputGroupProps extends Omit<InputGroupProps<string | undefined>, 'onChange' | 'type' | 'value'> {
+    type?: 'color' | 'email' | 'search' | 'tel' | 'text' | 'url';
+    icon: React.ReactNode;
+    helpText?: string;
+}
+declare const IconInputGroupWithRef: React.ComponentType<IconInputGroupProps>;
+export default IconInputGroupWithRef;

package/es/Input/IconInputGroup.js

@@ -0,0 +1,40 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import { jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
+import React from 'react';
+import classNames from 'classnames';
+import InputGroupWithRef from './InputGroup';
+function IconInputGroup(_a, ref) {
+    var icon = _a.icon, className = _a.className, rest = __rest(_a, ["icon", "className"]);
+    var input = rest.input;
+    return (_jsx(_Fragment, { children: _jsx(InputGroupWithRef, __assign({ icon: icon, ref: ref, className: classNames(className, 'icon-input-group'), value: input.value || '', onChange: function (e) {
+                if (!e.target.value) {
+                    input.onChange(undefined);
+                }
+                else {
+                    input.onChange(e.target.value);
+                }
+            } }, rest)) }));
+}
+var IconInputGroupWithRef = React.forwardRef(IconInputGroup);
+export default IconInputGroupWithRef;

package/es/Input/InputGroup.d.ts

@@ -0,0 +1,12 @@
+import React, { ChangeEventHandler, LegacyRef } from 'react';
+import { InjectedFieldProps } from '../Field/InjectedFieldProps';
+import { GroupProps } from '../Group';
+export interface InputGroupProps<TValue> extends InjectedFieldProps<TValue>, Omit<React.HTMLProps<HTMLInputElement>, keyof InjectedFieldProps<any> | 'children' | 'className' | 'label'>, Omit<GroupProps, keyof InjectedFieldProps<any> | 'children'> {
+    onChange: ChangeEventHandler<HTMLInputElement>;
+    value: string | number;
+    icon?: React.ReactNode;
+}
+/** generic controlled <input/> wrapped by a Group */
+declare function InputGroup<TValue>({ input, meta, label, helpText, className, disabled, onChange, value, icon, ...rest }: InputGroupProps<TValue>, ref: LegacyRef<HTMLInputElement>): JSX.Element;
+declare const InputGroupWithRef: typeof InputGroup;
+export default InputGroupWithRef;

package/es/Input/InputGroup.js

@@ -0,0 +1,33 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import React from 'react';
+import classNames from 'classnames';
+import Group from '../Group';
+/** generic controlled <input/> wrapped by a Group */
+function InputGroup(_a, ref) {
+    var input = _a.input, meta = _a.meta, label = _a.label, helpText = _a.helpText, className = _a.className, disabled = _a.disabled, onChange = _a.onChange, value = _a.value, icon = _a.icon, rest = __rest(_a, ["input", "meta", "label", "helpText", "className", "disabled", "onChange", "value", "icon"]);
+    return (_jsxs(Group, __assign({ input: input, meta: meta, disabled: disabled, label: label, helpText: helpText, className: classNames(className, 'input-group') }, { children: [icon, _jsx("input", __assign({}, input, rest, { value: value, onChange: onChange, ref: ref, className: classNames(className, 'input-group') }))] })));
+}
+var InputGroupWithRef = React.forwardRef(InputGroup);
+export default InputGroupWithRef;

package/es/Input/MoneyInputGroup.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+import { InputGroupProps } from './InputGroup';
+export interface MoneyInputGroupProps extends Omit<InputGroupProps<number | undefined>, 'onChange' | 'type' | 'value'> {
+    parseFunc?: typeof parseInt | typeof parseFloat;
+}
+declare const MoneyInputGroupWithRef: React.FunctionComponent<MoneyInputGroupProps>;
+export default MoneyInputGroupWithRef;

package/es/Input/MoneyInputGroup.js

@@ -0,0 +1,41 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import { jsx as _jsx } from "react/jsx-runtime";
+import React from 'react';
+import classNames from 'classnames';
+import InputGroup from './InputGroup';
+function MoneyInputGroup(_a, ref) {
+    var parseFunc = _a.parseFunc, className = _a.className, rest = __rest(_a, ["parseFunc", "className"]);
+    var effectiveParse = parseFunc !== null && parseFunc !== void 0 ? parseFunc : parseFloat;
+    var input = rest.input;
+    return (_jsx(InputGroup, __assign({ ref: ref, step: 0.01, min: 0 }, rest, { type: "number", className: classNames(className, 'money-group'), value: input.value || '', onChange: function (e) {
+            if (!e.target.value) {
+                input.onChange(undefined);
+            }
+            else {
+                input.onChange(effectiveParse(e.target.value));
+            }
+        } })));
+}
+var MoneyInputGroupWithRef = React.forwardRef(MoneyInputGroup);
+export default MoneyInputGroupWithRef;

package/es/Input/NumberInputGroup.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+import { InputGroupProps } from './InputGroup';
+export interface NumberInputGroupProps extends Omit<InputGroupProps<number | undefined>, 'onChange' | 'type' | 'value'> {
+    parseFunc?: typeof parseInt | typeof parseFloat;
+}
+declare const NumberInputGroupWithRef: React.ComponentType<NumberInputGroupProps>;
+export default NumberInputGroupWithRef;

package/es/Input/NumberInputGroup.js

@@ -0,0 +1,41 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import { jsx as _jsx } from "react/jsx-runtime";
+import React from 'react';
+import classNames from 'classnames';
+import InputGroup from './InputGroup';
+function NumberInputGroup(_a, ref) {
+    var parseFunc = _a.parseFunc, className = _a.className, rest = __rest(_a, ["parseFunc", "className"]);
+    var effectiveParse = parseFunc !== null && parseFunc !== void 0 ? parseFunc : parseFloat;
+    var input = rest.input;
+    return (_jsx(InputGroup, __assign({ ref: ref }, rest, { type: "number", className: classNames(className, 'number-group'), value: input.value || '', onChange: function (e) {
+            if (!e.target.value) {
+                input.onChange(undefined);
+            }
+            else {
+                input.onChange(effectiveParse(e.target.value));
+            }
+        } })));
+}
+var NumberInputGroupWithRef = React.forwardRef(NumberInputGroup);
+export default NumberInputGroupWithRef;

package/es/Input/StringInputGroup.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+import { InputGroupProps } from './InputGroup';
+export interface StringInputGroupProps extends Omit<InputGroupProps<string | undefined>, 'onChange' | 'type' | 'value'> {
+    type?: 'color' | 'email' | 'search' | 'tel' | 'text' | 'url' | 'password' | 'textarea';
+}
+declare const StringInputGroupWithRef: React.ComponentType<StringInputGroupProps>;
+export default StringInputGroupWithRef;

package/es/Input/StringInputGroup.js

@@ -0,0 +1,40 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import { jsx as _jsx } from "react/jsx-runtime";
+import React from 'react';
+import classNames from 'classnames';
+import InputGroup from './InputGroup';
+function StringInputGroup(_a, ref) {
+    var className = _a.className, rest = __rest(_a, ["className"]);
+    var input = rest.input;
+    return (_jsx(InputGroup, __assign({ ref: ref }, rest, { className: classNames(className, 'string-group'), value: input.value || '', onChange: function (e) {
+            if (!e.target.value) {
+                input.onChange(undefined);
+            }
+            else {
+                input.onChange(e.target.value);
+            }
+        } })));
+}
+var StringInputGroupWithRef = React.forwardRef(StringInputGroup);
+export default StringInputGroupWithRef;

package/es/Normalization/NormalizationFunction.d.ts

@@ -0,0 +1,4 @@
+/** Normalization of values */
+export interface NormalizationFunction<TValue> {
+    (value: TValue): TValue;
+}

package/es/Normalization/NormalizationFunction.js

@@ -0,0 +1 @@
+export {};

package/es/Normalization/normalizers.d.ts

@@ -0,0 +1,2 @@
+export declare const phoneNumber: (value: string | undefined) => string | undefined;
+export declare const zipCode: (value: string | undefined) => string | undefined;

package/es/Normalization/normalizers.js

@@ -0,0 +1,30 @@
+export var phoneNumber = function (value) {
+    if (!value) {
+        return undefined;
+    }
+    var onlyNums = value.replace(/[^\d]/g, '');
+    if (onlyNums.length <= 3) {
+        return onlyNums;
+    }
+    if (onlyNums.length <= 7) {
+        return "".concat(onlyNums.slice(0, 3), "-").concat(onlyNums.slice(3));
+    }
+    if (onlyNums.length <= 10) {
+        return "".concat(onlyNums.slice(0, 3), "-").concat(onlyNums.slice(3, 6), "-").concat(onlyNums.slice(6, 10));
+    }
+    if (onlyNums.length <= 13) {
+        var countryCodeLength = onlyNums.length - 10;
+        return "+".concat(onlyNums.slice(0, countryCodeLength), " ").concat(onlyNums.slice(countryCodeLength, 3 + countryCodeLength), "-").concat(onlyNums.slice(3 + countryCodeLength, 6 + countryCodeLength), "-").concat(onlyNums.slice(6 + countryCodeLength, onlyNums.length));
+    }
+    return onlyNums;
+};
+export var zipCode = function (value) {
+    if (!value) {
+        return undefined;
+    }
+    var onlyNums = value.replace(/[^\d]/g, '');
+    if (onlyNums.length > 5) {
+        return onlyNums.substring(0, 5) + '-' + onlyNums.substring(5, 9);
+    }
+    return onlyNums;
+};

package/es/Select/BooleanSelectGroup.d.ts

@@ -0,0 +1,7 @@
+/// <reference types="react" />
+import { SelectOption } from './SelectGroup';
+import { SelectGroupPropsHelper } from './SelectGroupPropsHelper';
+export interface BooleanSelectGroupProps extends Omit<SelectGroupPropsHelper<boolean>, 'options'> {
+    options?: SelectOption<boolean>[];
+}
+export declare function BooleanSelectGroup(props: BooleanSelectGroupProps): JSX.Element;

package/es/Select/BooleanSelectGroup.js

@@ -0,0 +1,27 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+import { jsx as _jsx } from "react/jsx-runtime";
+import SelectGroup from './SelectGroup';
+var booleanOptions = [
+    {
+        label: 'Yes',
+        value: true,
+    },
+    {
+        label: 'No',
+        value: false,
+    },
+];
+export function BooleanSelectGroup(props) {
+    var _a;
+    return (_jsx(SelectGroup, __assign({ multiple: false }, props, { options: (_a = props.options) !== null && _a !== void 0 ? _a : booleanOptions })));
+}

package/es/Select/NumberSelectGroup.d.ts

@@ -0,0 +1,8 @@
+/// <reference types="react" />
+import { SelectGroupPropsHelper } from './SelectGroupPropsHelper';
+export interface MultiNumberSelectGroupProps extends SelectGroupPropsHelper<number[]> {
+}
+export declare function MultiNumberSelectGroup(props: MultiNumberSelectGroupProps): JSX.Element;
+export interface SingleNumberSelectGroupProps extends SelectGroupPropsHelper<number> {
+}
+export declare function SingleNumberSelectGroup(props: SingleNumberSelectGroupProps): JSX.Element;

package/es/Select/NumberSelectGroup.js

@@ -0,0 +1,19 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+import { jsx as _jsx } from "react/jsx-runtime";
+import SelectGroup from './SelectGroup';
+export function MultiNumberSelectGroup(props) {
+    return _jsx(SelectGroup, __assign({ multiple: true }, props));
+}
+export function SingleNumberSelectGroup(props) {
+    return _jsx(SelectGroup, __assign({ multiple: false }, props));
+}

package/es/Select/SelectGroup.d.ts

@@ -0,0 +1,22 @@
+/// <reference types="react" />
+import { InjectedFieldProps } from '../Field/InjectedFieldProps';
+import { GroupProps } from '../Group';
+export interface SelectOption<TValue> {
+    value: (TValue extends Array<infer P> ? P : TValue) | undefined;
+    label: string;
+}
+interface OptionsApiResult<TValue> {
+    result?: Partial<SelectOption<TValue>>[];
+}
+interface OptionsUseServiceResult<TValue> {
+    loading?: boolean;
+    resp?: Partial<SelectOption<TValue>>[] | OptionsApiResult<TValue> | null;
+    error?: any;
+}
+export interface SelectGroupProps<TValue> extends InjectedFieldProps<TValue | undefined>, Omit<GroupProps, 'input' | 'meta' | 'children'> {
+    options: SelectOption<TValue>[] | OptionsUseServiceResult<TValue>;
+    multiple: TValue extends Array<any> ? true : false;
+    placeholder?: string;
+}
+export default function SelectGroup<TValue>({ input, meta, className, options, multiple, placeholder, ...rest }: SelectGroupProps<TValue>): JSX.Element;
+export {};

package/es/Select/SelectGroup.js

@@ -0,0 +1,59 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import { jsx as _jsx } from "react/jsx-runtime";
+import { default as ReactSelect } from 'react-select';
+import classNames from 'classnames';
+import Group from '../Group';
+// TODO: we could also name this "ReactSelectGroup" or similar but the types are strongly defined now so kept the names consistent
+export default function SelectGroup(_a) {
+    var input = _a.input, meta = _a.meta, className = _a.className, options = _a.options, multiple = _a.multiple, placeholder = _a.placeholder, rest = __rest(_a, ["input", "meta", "className", "options", "multiple", "placeholder"]);
+    var effectiveOptions = !options
+        ? []
+        : Array.isArray(options)
+            ? options
+            : 'resp' in options &&
+                !!options.resp &&
+                'result' in options.resp &&
+                !!options.resp.result
+                ? options.resp.result
+                : 'resp' in options && !!options.resp && Array.isArray(options.resp)
+                    ? options.resp
+                    : [];
+    var isLoading = (options && 'loading' in options && options.loading) || false;
+    return (_jsx(Group, __assign({}, rest, { input: input, meta: meta, className: classNames(className, { multiple: multiple, 'is-loading': isLoading }, 'select-group') }, { children: _jsx(ReactSelect, { inputId: input.id, isMulti: multiple, options: effectiveOptions, onBlur: input.onBlur, value: getValue(), onChange: function (e) {
+                if (multiple === true) {
+                    input.onChange(e === null || e === void 0 ? void 0 : e.map(function (x) { return x.value; }));
+                }
+                else {
+                    input.onChange(e === null || e === void 0 ? void 0 : e.value);
+                }
+            }, getOptionLabel: function (option) { var _a; return (_a = option === null || option === void 0 ? void 0 : option.label) !== null && _a !== void 0 ? _a : ''; }, className: classNames(className, 'select-group'), classNamePrefix: "react-select", menuPortalTarget: document.body, menuPlacement: "auto", placeholder: placeholder }) })));
+    function getValue() {
+        if (multiple) {
+            return effectiveOptions.filter(function (o) {
+                return Array.isArray(input.value) && !!input.value.find(function (x) { return o.value === x; });
+            });
+        }
+        return effectiveOptions.find(function (o) { return o.value === input.value; });
+    }
+}

package/es/Select/SelectGroupPropsHelper.d.ts

@@ -0,0 +1,3 @@
+import { SelectGroupProps } from './SelectGroup';
+export interface SelectGroupPropsHelper<T> extends Omit<SelectGroupProps<T>, 'multiple'> {
+}

package/es/Select/SelectGroupPropsHelper.js

@@ -0,0 +1 @@
+export {};