@mtes-mct/monitor-ui 5.3.2 → 5.3.3

package/index.js

@@ -3574,9 +3574,18 @@ const useClickOutsideEffect = (zoneRefOrzoneRefs, action, baseContainer) => {
     }, [baseContainer, handleClickOutside]);
 };
 
+function usePrevious(value) {
+    const ref = useRef();
+    useEffect(() => {
+        ref.current = value;
+    }, [value]); // Only re-run if value changes
+    return ref.current;
+}
+
 function useFieldUndefineEffect(disabled, onChange, onDisable) {
+    const wasDisabled = usePrevious(disabled);
     useEffect(() => {
-        if (!disabled) {
+        if (!disabled || disabled === wasDisabled) {
             return;
         }
         if (onDisable) {
@@ -3585,7 +3594,7 @@ function useFieldUndefineEffect(disabled, onChange, onDisable) {
         if (onChange) {
             onChange(undefined);
         }
-    }, [disabled, onChange, onDisable]);
+    }, [disabled, onChange, onDisable, wasDisabled]);
 }
 
 var lodashExports = {};
@@ -20804,14 +20813,6 @@ function useForceUpdate() {
     return { forceDebouncedUpdate, forceUpdate };
 }
 
-function usePrevious(value) {
-    const ref = useRef();
-    useEffect(() => {
-        ref.current = value;
-    }, [value]); // Only re-run if value changes
-    return ref.current;
-}
-
 const getPseudoRandomString = () => Math.random().toString(36).slice(2);
 
 function useKey(deps) {
@@ -20979,34 +20980,17 @@ const Box$c = styled.div `
 `;
 
 function Checkbox({ checked = false, error, isErrorMessageHidden = false, isUndefinedWhenDisabled = false, label, onChange, ...originalProps }) {
-    const { forceUpdate } = useForceUpdate();
-    // This tracks the component internal value which allows us to react to value changes after the checkbox toggling
-    const [internalChecked, setInternalChecked] = useState(checked);
-    // and compare it with an eventual external value change (via the `value` prop)
-    const previousChecked = usePrevious(checked);
-    // to decide which on is the source of "truth" in `controlledValue` (the last one to be changed is the true value)
-    // eslint-disable-next-line @typescript-eslint/naming-convention
-    const controlledChecked = useMemo(() => {
-        // If the `value` has changed, `value` takes precedence,
-        // otherwise we can use our current internal value
-        const nextControlledChecked = checked === previousChecked ? internalChecked : checked;
-        return !isUndefinedWhenDisabled || !originalProps.disabled ? nextControlledChecked : undefined;
-    }, [checked, internalChecked, isUndefinedWhenDisabled, originalProps.disabled, previousChecked]);
     const controlledError = useMemo(() => normalizeString(error), [error]);
     const hasError = useMemo(() => Boolean(controlledError), [controlledError]);
     const key = getPseudoRandomString();
     const handleChange = useCallback((_, isChecked) => {
-        setInternalChecked(isChecked);
-        // We have to force the update since a state with the same value wouldn't re-render
-        // which generates conflicting behaviors
-        // when `value` prop is changed to a value that is equal to the current internal value
-        forceUpdate();
-        if (onChange) {
-            onChange(isChecked);
+        if (!onChange) {
+            return;
         }
-    }, [forceUpdate, onChange]);
+        onChange(isChecked);
+    }, [onChange]);
     useFieldUndefineEffect(isUndefinedWhenDisabled && originalProps.disabled, onChange);
-    return (jsxs(Field$2, { className: "Field-Checkbox", children: [jsx(StyledCheckbox, { checked: controlledChecked, id: originalProps.name, onChange: handleChange, ...originalProps, children: label }, key), !isErrorMessageHidden && hasError && jsx(FieldError, { children: controlledError })] }));
+    return (jsxs(Field$2, { className: "Field-Checkbox", children: [jsx(StyledCheckbox, { checked: checked, id: originalProps.name, onChange: handleChange, ...originalProps, children: label }, key), !isErrorMessageHidden && hasError && jsx(FieldError, { children: controlledError })] }));
 }
 const StyledCheckbox = styled(Checkbox$1) `
   > .rs-checkbox-checker {
@@ -22486,52 +22470,22 @@ const Field = styled.span `
 }};
 `;
 
-function useFieldControl(value, onChange, props) {
-    const { disabled, isUndefinedWhenDisabled } = props;
-    // This tracks the component internal value which allows us to react to value changes after the checkbox toggling
-    const internalValueRef = useRef(value);
-    // and compare it with an eventual external value change (via the `value` prop)
-    const previousValue = usePrevious(value);
-    const { forceUpdate } = useForceUpdate();
-    const controlledValue = isUndefinedWhenDisabled && disabled ? undefined : internalValueRef.current;
-    const controlledOnChange = useCallback((nextValue) => {
-        internalValueRef.current = nextValue;
-        if (onChange) {
-            onChange(nextValue);
-        }
-    }, [onChange]);
-    const setInternalValue = useCallback((nextValue) => {
-        internalValueRef.current = nextValue;
-        forceUpdate();
-    }, [forceUpdate]);
-    // We update the `internalValue` each time the `value` prop is updated
-    useEffect(() => {
-        if (lodashExports.isEqual(value, previousValue)) {
-            return;
-        }
-        internalValueRef.current = value;
-        forceUpdate();
-    }, [forceUpdate, previousValue, value]);
-    return { controlledOnChange, controlledValue, setInternalValue };
-}
-
 function MultiCheckbox({ disabled = false, error, isErrorMessageHidden = false, isInline = false, isLabelHidden = false, isLight = false, isUndefinedWhenDisabled = false, label, name, onChange, options, value }) {
-    const { controlledOnChange, controlledValue } = useFieldControl(value, onChange, {
-        disabled,
-        isUndefinedWhenDisabled
-    });
     const controlledError = useMemo(() => normalizeString(error), [error]);
     const hasError = useMemo(() => Boolean(controlledError), [controlledError]);
-    const key = useKey([controlledValue, disabled, name]);
+    const key = useKey([value, disabled, name]);
     const handleChange = useCallback((nextOptionValue, isChecked) => {
+        if (!onChange) {
+            return;
+        }
         const nextCheckedOptionValues = isChecked
-            ? [...(controlledValue || []), nextOptionValue]
-            : reject(equals(nextOptionValue))(controlledValue || []);
+            ? [...(value || []), nextOptionValue]
+            : reject(equals(nextOptionValue))(value || []);
         const normalizedNextValue = nextCheckedOptionValues.length ? nextCheckedOptionValues : undefined;
-        controlledOnChange(normalizedNextValue);
-    }, [controlledOnChange, controlledValue]);
+        onChange(normalizedNextValue);
+    }, [onChange, value]);
     useFieldUndefineEffect(isUndefinedWhenDisabled && disabled, onChange);
-    return (jsxs(Fieldset, { className: "Field-MultiCheckbox", disabled: disabled, hasError: hasError, isLegendHidden: isLabelHidden, isLight: isLight, legend: label, children: [jsx(ChecboxesBox, { "$hasError": hasError, "$isInline": isInline, children: options.map((option, index) => (jsx(Checkbox, { checked: includes(option.value, controlledValue || []), disabled: disabled, label: option.label, name: `${name}${index}`, onChange: (isChecked) => handleChange(option.value, isChecked) }, JSON.stringify(option.value)))) }, key), !isErrorMessageHidden && hasError && jsx(FieldError, { children: controlledError })] }));
+    return (jsxs(Fieldset, { className: "Field-MultiCheckbox", disabled: disabled, hasError: hasError, isLegendHidden: isLabelHidden, isLight: isLight, legend: label, children: [jsx(ChecboxesBox, { "$hasError": hasError, "$isInline": isInline, children: options.map((option, index) => (jsx(Checkbox, { checked: includes(option.value, value || []), disabled: disabled, label: option.label, name: `${name}${index}`, onChange: (isChecked) => handleChange(option.value, isChecked) }, JSON.stringify(option.value)))) }, key), !isErrorMessageHidden && hasError && jsx(FieldError, { children: controlledError })] }));
 }
 const ChecboxesBox = styled.div `
   color: ${p => p.theme.color.gunMetal};
@@ -22585,28 +22539,27 @@ function MultiSelect({ baseContainer, disabled = false, error, isErrorMessageHid
     // eslint-disable-next-line no-null/no-null
     const boxRef = useRef(null);
     const [isOpen, setIsOpen] = useState(false);
-    const { controlledOnChange, controlledValue } = useFieldControl(value, onChange, {
-        disabled,
-        isUndefinedWhenDisabled
-    });
-    const controlledRsuiteValue = useMemo(() => (controlledValue || []).map(controlledValueItem => getRsuiteValueFromOptionValue(controlledValueItem, optionValueKey)), [controlledValue, optionValueKey]);
     const controlledError = useMemo(() => normalizeString(error), [error]);
     const data = useMemo(() => getRsuiteDataFromOptions(options, optionValueKey), [options, optionValueKey]);
     const hasError = useMemo(() => Boolean(controlledError), [controlledError]);
     const key = useKey([disabled, originalProps.name, value]);
+    const rsuiteValue = useMemo(() => (value || []).map(valueItem => getRsuiteValueFromOptionValue(valueItem, optionValueKey)), [optionValueKey, value]);
     const { forceUpdate } = useForceUpdate();
     const close = useCallback(() => {
         setIsOpen(false);
     }, []);
     const handleChange = useCallback((nextOptionRsuiteValues) => {
+        if (!onChange) {
+            return;
+        }
         const nextValue = nextOptionRsuiteValues
             ? options
                 .filter(option => nextOptionRsuiteValues.includes(optionValueKey ? option.value[optionValueKey] : String(option.value)))
                 .map(option => option.value)
             : [];
         const normalizedNextValue = !nextValue.length ? undefined : nextValue;
-        controlledOnChange(normalizedNextValue);
-    }, [controlledOnChange, options, optionValueKey]);
+        onChange(normalizedNextValue);
+    }, [onChange, options, optionValueKey]);
     const renderMenuItem = useCallback((node) => jsx("span", { title: String(node), children: String(node) }), []);
     const toggle = useCallback((event) => {
         let targetElement = event.target;
@@ -22628,7 +22581,7 @@ function MultiSelect({ baseContainer, disabled = false, error, isErrorMessageHid
     }, [forceUpdate]);
     return (jsxs(Field$2, { className: "Field-MultiSelect", children: [jsx(Label, { disabled: disabled, hasError: hasError, htmlFor: originalProps.name, isHidden: isLabelHidden, children: label }), jsx(Box$4, { ref: boxRef, "$hasError": hasError, "$isActive": isOpen, "$isLight": isLight, onClick: toggle, children: boxRef.current && (jsx(TagPicker, { container: boxRef.current, data: data, disabled: disabled, id: originalProps.name, 
                     // Since we customized `ItemDataType` type by adding `optionValue`, we have an optional vs required conflict
-                    onChange: handleChange, onClick: toggle, open: isOpen, renderMenuItem: renderMenuItem, searchable: searchable, value: controlledRsuiteValue, ...originalProps }, key)) }), !isErrorMessageHidden && hasError && jsx(FieldError, { children: controlledError })] }));
+                    onChange: handleChange, onClick: toggle, open: isOpen, renderMenuItem: renderMenuItem, searchable: searchable, value: rsuiteValue, ...originalProps }, key)) }), !isErrorMessageHidden && hasError && jsx(FieldError, { children: controlledError })] }));
 }
 const Box$4 = styled.div `
   position: relative;
@@ -22752,19 +22705,18 @@ const Box$4 = styled.div `
 `;
 
 function MultiRadio({ disabled = false, error, isErrorMessageHidden = false, isInline = false, isLabelHidden = false, isLight = false, isUndefinedWhenDisabled = false, label, name, onChange, options, value }) {
-    const { controlledOnChange, controlledValue } = useFieldControl(value, onChange, {
-        disabled,
-        isUndefinedWhenDisabled
-    });
     const controlledError = useMemo(() => normalizeString(error), [error]);
     const hasError = useMemo(() => Boolean(controlledError), [controlledError]);
-    const key = useKey([controlledValue, disabled, name]);
+    const key = useKey([value, disabled, name]);
     const handleChange = useCallback((nextOptionValue, isChecked) => {
+        if (!onChange) {
+            return;
+        }
         const nextCheckedOptionValue = isChecked ? nextOptionValue : undefined;
-        controlledOnChange(nextCheckedOptionValue);
-    }, [controlledOnChange]);
+        onChange(nextCheckedOptionValue);
+    }, [onChange]);
     useFieldUndefineEffect(isUndefinedWhenDisabled && disabled, onChange);
-    return (jsxs(Fieldset, { className: "Field-MultiRadio", disabled: disabled, hasError: hasError, isLegendHidden: isLabelHidden, isLight: isLight, legend: label, children: [jsx(CheckboxesBox, { "$isInline": isInline, children: options.map(option => (jsx(Radio, { checked: equals(option.value, controlledValue), disabled: disabled, name: name, onChange: (_, isChecked) => handleChange(option.value, isChecked), children: option.label }, JSON.stringify(option.value)))) }, key), !isErrorMessageHidden && hasError && jsx(FieldError, { children: controlledError })] }));
+    return (jsxs(Fieldset, { className: "Field-MultiRadio", disabled: disabled, hasError: hasError, isLegendHidden: isLabelHidden, isLight: isLight, legend: label, children: [jsx(CheckboxesBox, { "$isInline": isInline, children: options.map(option => (jsx(Radio, { checked: equals(option.value, value), disabled: disabled, name: name, onChange: (_, isChecked) => handleChange(option.value, isChecked), children: option.label }, JSON.stringify(option.value)))) }, key), !isErrorMessageHidden && hasError && jsx(FieldError, { children: controlledError })] }));
 }
 const CheckboxesBox = styled.div `
   color: ${p => p.theme.color.gunMetal};
@@ -22877,7 +22829,6 @@ const Link = styled.a `
 `;
 
 function NumberInput({ error, isErrorMessageHidden = false, isLabelHidden = false, isLight = false, isUndefinedWhenDisabled = false, label, onChange, value, ...originalProps }) {
-    const controlledValue = useMemo(() => (!isUndefinedWhenDisabled || !originalProps.disabled ? value : undefined), [isUndefinedWhenDisabled, originalProps.disabled, value]);
     const controlledError = useMemo(() => normalizeString(error), [error]);
     const hasError = useMemo(() => Boolean(controlledError), [controlledError]);
     const key = useKey([originalProps.disabled, originalProps.name]);
@@ -22891,7 +22842,7 @@ function NumberInput({ error, isErrorMessageHidden = false, isLabelHidden = fals
         onChange(normalizedNextValue);
     }, [onChange]);
     useFieldUndefineEffect(isUndefinedWhenDisabled && originalProps.disabled, onChange);
-    return (jsxs(Field$2, { className: "Field-NumberInput", children: [jsx(Label, { disabled: originalProps.disabled, hasError: hasError, htmlFor: originalProps.name, isHidden: isLabelHidden, children: label }), jsx(StyledInput$2, { "$hasError": hasError, "$isLight": isLight, id: originalProps.name, onChange: handleChange, type: "number", value: controlledValue, ...originalProps }, key), !isErrorMessageHidden && hasError && jsx(FieldError, { children: controlledError })] }));
+    return (jsxs(Field$2, { className: "Field-NumberInput", children: [jsx(Label, { disabled: originalProps.disabled, hasError: hasError, htmlFor: originalProps.name, isHidden: isLabelHidden, children: label }), jsx(StyledInput$2, { "$hasError": hasError, "$isLight": isLight, id: originalProps.name, onChange: handleChange, type: "number", value: value, ...originalProps }, key), !isErrorMessageHidden && hasError && jsx(FieldError, { children: controlledError })] }));
 }
 const StyledInput$2 = styled(Input) `
   background-color: ${p => (p.$isLight ? p.theme.color.white : p.theme.color.gainsboro)};
@@ -33041,25 +32992,26 @@ function Select({ baseContainer, disabled = false, error, isErrorMessageHidden =
     const boxRef = useRef(null);
     const [isOpen, setIsOpen] = useState(false);
     const { forceUpdate } = useForceUpdate();
-    const { controlledOnChange, controlledValue } = useFieldControl(value, onChange, {
-        disabled,
-        isUndefinedWhenDisabled
-    });
-    const controlledRsuiteValue = useMemo(() => getRsuiteValueFromOptionValue(controlledValue, optionValueKey), [controlledValue, optionValueKey]);
     const controlledError = useMemo(() => normalizeString(error), [error]);
     const data = useMemo(() => getRsuiteDataFromOptions(options, optionValueKey), [options, optionValueKey]);
     const hasError = useMemo(() => Boolean(controlledError), [controlledError]);
     const key = useKey([disabled, originalProps.name, value]);
+    const rsuiteValue = useMemo(() => getRsuiteValueFromOptionValue(value, optionValueKey), [value, optionValueKey]);
     const close = useCallback(() => {
         setIsOpen(false);
     }, []);
     const handleClean = useCallback(() => {
-        controlledOnChange(undefined);
-    }, [controlledOnChange]);
+        if (!onChange) {
+            return;
+        }
+        onChange(undefined);
+    }, [onChange]);
     const handleSelect = useCallback((_, selectedItem) => {
         close();
-        controlledOnChange(selectedItem.optionValue);
-    }, [close, controlledOnChange]);
+        if (onChange) {
+            onChange(selectedItem.optionValue);
+        }
+    }, [close, onChange]);
     const renderMenuItem = useCallback((node) => jsx("span", { title: String(node), children: String(node) }), []);
     const toggle = useCallback((event) => {
         let targetElement = event.target;
@@ -33083,7 +33035,7 @@ function Select({ baseContainer, disabled = false, error, isErrorMessageHidden =
     }, [forceUpdate]);
     return (jsxs(Field$2, { className: "Field-Select", children: [jsx(Label, { disabled: disabled, hasError: hasError, htmlFor: originalProps.name, isHidden: isLabelHidden, children: label }), jsx(Box, { ref: boxRef, onClick: toggle, children: boxRef.current && (jsx(StyledSelectPicker, { "$isLight": isLight, container: boxRef.current, data: data, disabled: disabled, id: originalProps.name, onClean: handleClean, 
                     // Since we customized `ItemDataType` type by adding `optionValue`, we have an optional vs required conflict
-                    onSelect: handleSelect, open: isOpen, renderMenuItem: renderMenuItem, searchable: searchable, value: controlledRsuiteValue, ...originalProps }, key)) }), !isErrorMessageHidden && hasError && jsx(FieldError, { children: controlledError })] }));
+                    onSelect: handleSelect, open: isOpen, renderMenuItem: renderMenuItem, searchable: searchable, value: rsuiteValue, ...originalProps }, key)) }), !isErrorMessageHidden && hasError && jsx(FieldError, { children: controlledError })] }));
 }
 const StyledSelectPicker = styled(SelectPicker) `
   > .rs-picker-toggle {
@@ -33168,7 +33120,6 @@ const Box = styled.div `
 
 function Textarea({ error, isErrorMessageHidden = false, isLabelHidden = false, isLight = false, isUndefinedWhenDisabled = false, label, onChange, rows = 3, value, ...originalProps }) {
     const inputRef = useRef();
-    const controlledValue = useMemo(() => (!isUndefinedWhenDisabled || !originalProps.disabled ? value : undefined), [isUndefinedWhenDisabled, originalProps.disabled, value]);
     const controlledError = useMemo(() => normalizeString(error), [error]);
     const hasError = useMemo(() => Boolean(controlledError), [controlledError]);
     const key = useKey([originalProps.disabled, originalProps.name]);
@@ -33181,7 +33132,7 @@ function Textarea({ error, isErrorMessageHidden = false, isLabelHidden = false,
         onChange(normalizedNextValue);
     }, [onChange]);
     useFieldUndefineEffect(isUndefinedWhenDisabled && originalProps.disabled, onChange);
-    return (jsxs(Field$2, { className: "Field-Textarea", children: [jsx(Label, { disabled: originalProps.disabled, htmlFor: originalProps.name, isHidden: isLabelHidden, children: label }), jsx(StyledInput$1, { ref: inputRef, "$isLight": isLight, as: "textarea", id: originalProps.name, onChange: handleChange, rows: rows, value: controlledValue, ...originalProps }, key), !isErrorMessageHidden && hasError && jsx(FieldError, { children: controlledError })] }));
+    return (jsxs(Field$2, { className: "Field-Textarea", children: [jsx(Label, { disabled: originalProps.disabled, htmlFor: originalProps.name, isHidden: isLabelHidden, children: label }), jsx(StyledInput$1, { ref: inputRef, "$isLight": isLight, as: "textarea", id: originalProps.name, onChange: handleChange, rows: rows, value: value, ...originalProps }, key), !isErrorMessageHidden && hasError && jsx(FieldError, { children: controlledError })] }));
 }
 const StyledInput$1 = styled(Input) `
   background-color: ${p => (p.$isLight ? p.theme.color.white : p.theme.color.gainsboro)};
@@ -33196,7 +33147,6 @@ const StyledInput$1 = styled(Input) `
 `;
 
 function TextInput({ error, isErrorMessageHidden = false, isLabelHidden = false, isLight = false, isUndefinedWhenDisabled = false, label, onChange, value, ...originalProps }) {
-    const controlledValue = useMemo(() => (!isUndefinedWhenDisabled || !originalProps.disabled ? value : undefined), [isUndefinedWhenDisabled, originalProps.disabled, value]);
     const controlledError = useMemo(() => normalizeString(error), [error]);
     const hasError = useMemo(() => Boolean(controlledError), [controlledError]);
     const key = useKey([originalProps.disabled, originalProps.name]);
@@ -33208,7 +33158,7 @@ function TextInput({ error, isErrorMessageHidden = false, isLabelHidden = false,
         onChange(normalizedNextValue);
     }, [onChange]);
     useFieldUndefineEffect(isUndefinedWhenDisabled && originalProps.disabled, onChange);
-    return (jsxs(Field$2, { className: "Field-TextInput", children: [jsx(Label, { disabled: originalProps.disabled, hasError: hasError, htmlFor: originalProps.name, isHidden: isLabelHidden, children: label }), jsx(StyledInput, { "$hasError": hasError, "$isLight": isLight, id: originalProps.name, onChange: handleChange, type: "text", value: controlledValue, ...originalProps }, key), !isErrorMessageHidden && hasError && jsx(FieldError, { children: controlledError })] }));
+    return (jsxs(Field$2, { className: "Field-TextInput", children: [jsx(Label, { disabled: originalProps.disabled, hasError: hasError, htmlFor: originalProps.name, isHidden: isLabelHidden, children: label }), jsx(StyledInput, { "$hasError": hasError, "$isLight": isLight, id: originalProps.name, onChange: handleChange, type: "text", value: value, ...originalProps }, key), !isErrorMessageHidden && hasError && jsx(FieldError, { children: controlledError })] }));
 }
 const StyledInput = styled(Input) `
   background-color: ${p => (p.$isLight ? p.theme.color.white : p.theme.color.gainsboro)};
@@ -33339,5 +33289,26 @@ function FormikTextInput({ name, ...originalProps }) {
     return jsx(TextInput, { error: meta.error, name: name, onChange: handleChange, value: field.value, ...originalProps });
 }
 
-export { Accent, Button, Checkbox, CoordinatesFormat, CoordinatesInput, DatePicker, DateRangePicker, Dropdown, Field$2 as Field, Fieldset, FormikCheckbox, FormikCoordinatesInput, FormikDatePicker, FormikDateRangePicker, FormikEffect, FormikMultiCheckbox, FormikMultiRadio, FormikMultiSelect, FormikNumberInput, FormikSearch, FormikSelect, FormikTextInput, FormikTextarea, GlobalStyle, index as Icon, IconButton, Label, Legend, MultiCheckbox, MultiRadio, MultiSelect, MultiZoneEditor, NumberInput, OPENLAYERS_PROJECTION, OnlyFontGlobalStyle, Search, Select, SingleTag, Size, THEME, Tag, TagBullet, TagGroup, TextInput, Textarea, ThemeProvider, WSG84_PROJECTION, coordinatesAreDistinct, customDayjs, getCoordinates, getLocalizedDayjs, getPseudoRandomString, getUtcizedDayjs, isNumeric, noop, stopMouseEventPropagation, useClickOutsideEffect, useForceUpdate, useKey, usePrevious };
+function useFieldControl(value, onChange, defaultValueWhenUndefined) {
+    const previousValue = usePrevious(value);
+    const [internalValue, setInternalValue] = useState(value);
+    const controlledValue = internalValue === undefined && defaultValueWhenUndefined !== undefined ? defaultValueWhenUndefined : internalValue;
+    // We keep track of the field value changes via `internalValue`
+    const controlledOnChange = useCallback((nextValue) => {
+        setInternalValue(nextValue);
+        if (onChange) {
+            onChange(nextValue);
+        }
+    }, [onChange]);
+    // And we override `internalValue` each time the `value` prop is updated
+    useEffect(() => {
+        if (lodashExports.isEqual(value, previousValue)) {
+            return;
+        }
+        setInternalValue(value);
+    }, [previousValue, value]);
+    return { controlledOnChange, controlledValue };
+}
+
+export { Accent, Button, Checkbox, CoordinatesFormat, CoordinatesInput, DatePicker, DateRangePicker, Dropdown, Field$2 as Field, Fieldset, FormikCheckbox, FormikCoordinatesInput, FormikDatePicker, FormikDateRangePicker, FormikEffect, FormikMultiCheckbox, FormikMultiRadio, FormikMultiSelect, FormikNumberInput, FormikSearch, FormikSelect, FormikTextInput, FormikTextarea, GlobalStyle, index as Icon, IconButton, Label, Legend, MultiCheckbox, MultiRadio, MultiSelect, MultiZoneEditor, NumberInput, OPENLAYERS_PROJECTION, OnlyFontGlobalStyle, Search, Select, SingleTag, Size, THEME, Tag, TagBullet, TagGroup, TextInput, Textarea, ThemeProvider, WSG84_PROJECTION, coordinatesAreDistinct, customDayjs, getCoordinates, getLocalizedDayjs, getPseudoRandomString, getUtcizedDayjs, isNumeric, noop, stopMouseEventPropagation, useClickOutsideEffect, useFieldControl, useForceUpdate, useKey, usePrevious };
 //# sourceMappingURL=index.js.map