@mtes-mct/monitor-ui 2.19.1 → 3.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/CHANGELOG.md CHANGED
@@ -1,3 +1,13 @@
1
+ ## [2.19.2](https://github.com/MTES-MCT/monitor-ui/compare/v2.19.1...v2.19.2) (2023-02-20)
2
+
3
+
4
+ ### Bug Fixes
5
+
6
+ * **css:** use selector ([3088eb1](https://github.com/MTES-MCT/monitor-ui/commit/3088eb1a973c1ab02411aad69fe8a28b77f025c6))
7
+ * **multiselect:** add css when using isLight ([a9a6131](https://github.com/MTES-MCT/monitor-ui/commit/a9a61314bc5aae340211aff9c528e48994fa1fb1))
8
+
9
+ ## [2.19.1](https://github.com/MTES-MCT/monitor-ui/compare/v2.19.0...v2.19.1) (2023-02-20)
10
+
1
11
  # [2.19.0](https://github.com/MTES-MCT/monitor-ui/compare/v2.18.1...v2.19.0) (2023-02-17)
2
12
 
3
13
 
package/index.js CHANGED
@@ -1793,6 +1793,60 @@ _curry3(function remove(start, count, list) {
1793
1793
  return result;
1794
1794
  });
1795
1795
 
1796
+ /**
1797
+ * Tests whether or not an object is a typed array.
1798
+ *
1799
+ * @private
1800
+ * @param {*} val The object to test.
1801
+ * @return {Boolean} `true` if `val` is a typed array, `false` otherwise.
1802
+ * @example
1803
+ *
1804
+ * _isTypedArray(new Uint8Array([])); //=> true
1805
+ * _isTypedArray(new Float32Array([])); //=> true
1806
+ * _isTypedArray([]); //=> false
1807
+ * _isTypedArray(null); //=> false
1808
+ * _isTypedArray({}); //=> false
1809
+ */
1810
+ function _isTypedArray(val) {
1811
+ var type = Object.prototype.toString.call(val);
1812
+ return type === '[object Uint8ClampedArray]' || type === '[object Int8Array]' || type === '[object Uint8Array]' || type === '[object Int16Array]' || type === '[object Uint16Array]' || type === '[object Int32Array]' || type === '[object Uint32Array]' || type === '[object Float32Array]' || type === '[object Float64Array]' || type === '[object BigInt64Array]' || type === '[object BigUint64Array]';
1813
+ }
1814
+
1815
+ /**
1816
+ * Returns the empty value of its argument's type. Ramda defines the empty
1817
+ * value of Array (`[]`), Object (`{}`), String (`''`),
1818
+ * TypedArray (`Uint8Array []`, `Float32Array []`, etc), and Arguments. Other
1819
+ * types are supported if they define `<Type>.empty`,
1820
+ * `<Type>.prototype.empty` or implement the
1821
+ * [FantasyLand Monoid spec](https://github.com/fantasyland/fantasy-land#monoid).
1822
+ *
1823
+ * Dispatches to the `empty` method of the first argument, if present.
1824
+ *
1825
+ * @func
1826
+ * @memberOf R
1827
+ * @since v0.3.0
1828
+ * @category Function
1829
+ * @sig a -> a
1830
+ * @param {*} x
1831
+ * @return {*}
1832
+ * @example
1833
+ *
1834
+ * R.empty(Just(42)); //=> Nothing()
1835
+ * R.empty([1, 2, 3]); //=> []
1836
+ * R.empty('unicorns'); //=> ''
1837
+ * R.empty({x: 1, y: 2}); //=> {}
1838
+ * R.empty(Uint8Array.from('123')); //=> Uint8Array []
1839
+ */
1840
+
1841
+ var empty =
1842
+ /*#__PURE__*/
1843
+ _curry1(function empty(x) {
1844
+ return x != null && typeof x['fantasy-land/empty'] === 'function' ? x['fantasy-land/empty']() : x != null && x.constructor != null && typeof x.constructor['fantasy-land/empty'] === 'function' ? x.constructor['fantasy-land/empty']() : x != null && typeof x.empty === 'function' ? x.empty() : x != null && x.constructor != null && typeof x.constructor.empty === 'function' ? x.constructor.empty() : _isArray(x) ? [] : _isString(x) ? '' : _isObject(x) ? {} : _isArguments(x) ? function () {
1845
+ return arguments;
1846
+ }() : _isTypedArray(x) ? x.constructor.from('') : void 0 // else
1847
+ ;
1848
+ });
1849
+
1796
1850
  /**
1797
1851
  * Returns `true` if the specified value is equal, in [`R.equals`](#equals)
1798
1852
  * terms, to at least one element of the given list; `false` otherwise.
@@ -1820,6 +1874,35 @@ var includes =
1820
1874
  /*#__PURE__*/
1821
1875
  _curry2(_includes);
1822
1876
 
1877
+ /**
1878
+ * Returns `true` if the given value is its type's empty value; `false`
1879
+ * otherwise.
1880
+ *
1881
+ * @func
1882
+ * @memberOf R
1883
+ * @since v0.1.0
1884
+ * @category Logic
1885
+ * @sig a -> Boolean
1886
+ * @param {*} x
1887
+ * @return {Boolean}
1888
+ * @see R.empty
1889
+ * @example
1890
+ *
1891
+ * R.isEmpty([1, 2, 3]); //=> false
1892
+ * R.isEmpty([]); //=> true
1893
+ * R.isEmpty(''); //=> true
1894
+ * R.isEmpty(null); //=> false
1895
+ * R.isEmpty({}); //=> true
1896
+ * R.isEmpty({length: 0}); //=> false
1897
+ * R.isEmpty(Uint8Array.from('')); //=> true
1898
+ */
1899
+
1900
+ var isEmpty =
1901
+ /*#__PURE__*/
1902
+ _curry1(function isEmpty(x) {
1903
+ return x != null && equals(x, empty(x));
1904
+ });
1905
+
1823
1906
  /**
1824
1907
  * Creates a new object with the own properties of the two provided objects. If
1825
1908
  * a key exists in both objects, the provided function is applied to the key
@@ -2632,9 +2715,9 @@ function SingleTag({ children, onDelete }) {
2632
2715
  onDelete();
2633
2716
  }
2634
2717
  }, [onDelete]);
2635
- return (jsx("div", { children: jsxs(Box$g, { children: [jsx(Text, { children: children }), jsx(StyledIconButton, { accent: Accent.TERTIARY, Icon: Close, iconSize: 10, onClick: handleDelete })] }) }));
2718
+ return (jsx("div", { children: jsxs(Box$f, { children: [jsx(Text, { children: children }), jsx(StyledIconButton, { accent: Accent.TERTIARY, Icon: Close, iconSize: 10, onClick: handleDelete })] }) }));
2636
2719
  }
2637
- const Box$g = styled.div `
2720
+ const Box$f = styled.div `
2638
2721
  align-items: center;
2639
2722
  display: inline-flex;
2640
2723
  `;
@@ -2692,14 +2775,14 @@ const StyledLabel = styled(Label) `
2692
2775
 
2693
2776
  function Fieldset({ children, hasBorder = false, isLegendHidden = false, isLight = false, legend, ...nativeProps }) {
2694
2777
  const hasLegend = useMemo(() => Boolean(legend), [legend]);
2695
- return (jsxs(StyledField, { as: "fieldset", ...nativeProps, children: [legend && (jsx(Legend, { disabled: nativeProps.disabled, isHidden: isLegendHidden, children: legend })), jsx(Box$f, { "$hasBorder": hasBorder, "$hasLegend": hasLegend, "$isLight": isLight, children: children })] }));
2778
+ return (jsxs(StyledField, { as: "fieldset", ...nativeProps, children: [legend && (jsx(Legend, { disabled: nativeProps.disabled, isHidden: isLegendHidden, children: legend })), jsx(Box$e, { "$hasBorder": hasBorder, "$hasLegend": hasLegend, "$isLight": isLight, children: children })] }));
2696
2779
  }
2697
2780
  const StyledField = styled(Field$2) `
2698
2781
  border: 0;
2699
2782
  margin: 0;
2700
2783
  padding: 0;
2701
2784
  `;
2702
- const Box$f = styled.div `
2785
+ const Box$e = styled.div `
2703
2786
  background-color: ${p => (p.$isLight ? p.theme.color.white : 'transparent')};
2704
2787
  padding: ${p => (p.$hasBorder || p.$isLight ? '16px' : 0)};
2705
2788
  width: 100%;
@@ -2745,10 +2828,10 @@ function Tag({ accent, bullet, children, color, Icon, isLight = false, ...native
2745
2828
  case Accent.TERTIARY:
2746
2829
  return jsx(TertiaryTag, { ...commonProps });
2747
2830
  default:
2748
- return jsx(Box$e, { "$color": color, ...commonProps });
2831
+ return jsx(Box$d, { "$color": color, ...commonProps });
2749
2832
  }
2750
2833
  }
2751
- const Box$e = styled.span `
2834
+ const Box$d = styled.span `
2752
2835
  align-items: center;
2753
2836
  background-color: ${p => (p.$isLight ? p.theme.color.white : 'transparent')};
2754
2837
  border-radius: 11px;
@@ -2770,16 +2853,16 @@ const Box$e = styled.span `
2770
2853
  margin-right: 4px;
2771
2854
  }
2772
2855
  `;
2773
- const PrimaryTag = styled(Box$e) `
2856
+ const PrimaryTag = styled(Box$d) `
2774
2857
  background-color: ${p => (p.$isLight ? p.theme.color.white : p.theme.color.gainsboro)};
2775
2858
  color: ${p => p.theme.color.gunMetal};
2776
2859
  `;
2777
2860
  // TODO Fix this color.
2778
- const SecondaryTag = styled(Box$e) `
2861
+ const SecondaryTag = styled(Box$d) `
2779
2862
  background-color: ${p => (p.$isLight ? '#f6d012' : '#f6d012')};
2780
2863
  color: ${p => p.theme.color.gunMetal};
2781
2864
  `;
2782
- const TertiaryTag = styled(Box$e) `
2865
+ const TertiaryTag = styled(Box$d) `
2783
2866
  background-color: ${p => (p.$isLight ? p.theme.color.charcoal : p.theme.color.charcoal)};
2784
2867
  color: ${p => p.theme.color.white};
2785
2868
  `;
@@ -3908,7 +3991,7 @@ function AutoComplete({ baseContainer, defaultValue, error, isLabelHidden, isLig
3908
3991
  useEffect(() => {
3909
3992
  forceUpdate();
3910
3993
  }, [forceUpdate]);
3911
- return (jsxs(Field$2, { children: [jsx(Label, { disabled: originalProps.disabled, hasError: hasError, htmlFor: originalProps.name, isHidden: isLabelHidden, children: label }), jsx(Box$d, { ref: boxRef, onClick: open, children: boxRef.current && (jsx(StyledAutoComplete, { "$isLight": isLight, container: boxRef.current, data: controlledOptions, defaultValue: controlledValueAsLabel, id: originalProps.name, onChange: handleChange, onSelect: handleSelect, open: isOpen, ...originalProps }, key)) }), hasError && jsx(FieldError, { children: controlledError })] }));
3994
+ return (jsxs(Field$2, { children: [jsx(Label, { disabled: originalProps.disabled, hasError: hasError, htmlFor: originalProps.name, isHidden: isLabelHidden, children: label }), jsx(Box$c, { ref: boxRef, onClick: open, children: boxRef.current && (jsx(StyledAutoComplete, { "$isLight": isLight, container: boxRef.current, data: controlledOptions, defaultValue: controlledValueAsLabel, id: originalProps.name, onChange: handleChange, onSelect: handleSelect, open: isOpen, ...originalProps }, key)) }), hasError && jsx(FieldError, { children: controlledError })] }));
3912
3995
  }
3913
3996
  const StyledAutoComplete = styled(AutoComplete$1) `
3914
3997
  font-size: 13px;
@@ -3920,7 +4003,7 @@ const StyledAutoComplete = styled(AutoComplete$1) `
3920
4003
  width: 100%;
3921
4004
  }
3922
4005
  `;
3923
- const Box$d = styled.div `
4006
+ const Box$c = styled.div `
3924
4007
  position: relative;
3925
4008
 
3926
4009
  > .rs-picker-select {
@@ -4260,10 +4343,10 @@ disabled = false, isCompact, isEndDate = false, isForcedFocused, isLight, isStar
4260
4343
  ];
4261
4344
  onChange(nextDateTuple, isFilled);
4262
4345
  }, [onChange]);
4263
- return (jsxs(Box$c, { ref: boxRef, "$hasError": hasFormatError || hasValidationError, "$isCompact": isCompact, "$isDisabled": disabled, "$isFocused": isForcedFocused || isFocused, "$isLight": isLight, children: [jsxs("div", { children: [isStartDate && jsx("span", { children: "Du " }), isEndDate && jsx("span", { children: "Au " }), jsx(NumberInput$1, { ref: dayInputRef, "aria-label": `Jour${isStartDate ? ' de début' : ''}${isEndDate ? ' de fin' : ''}`, defaultValue: defaultValue && formatNumberAsDoubleDigit(defaultValue[2]), disabled: disabled, isLight: isLight, max: 31, min: 1, onBack: onBack, onBlur: handleBlur, onClick: onClick, onFilled: submit, onFocus: handleFocus, onFormatError: handleFormatError, onNext: () => monthInputRef.current.focus(), onPrevious: onPrevious, size: 2 }), "/", jsx(NumberInput$1, { ref: monthInputRef, "aria-label": `Mois${isStartDate ? ' de début' : ''}${isEndDate ? ' de fin' : ''}`, defaultValue: defaultValue && formatNumberAsDoubleDigit(defaultValue[1]), disabled: disabled, isLight: isLight, max: 12, min: 1, onBack: () => dayInputRef.current.focus(), onBlur: handleBlur, onClick: onClick, onFilled: submit, onFocus: handleFocus, onFormatError: handleFormatError, onNext: () => yearInputRef.current.focus(), onPrevious: () => dayInputRef.current.focus(), size: 2 }), "/", jsx(NumberInput$1, { ref: yearInputRef, "aria-label": `Année${isStartDate ? ' de début' : ''}${isEndDate ? ' de fin' : ''}`, defaultValue: defaultValue && defaultValue[0], disabled: disabled, isLight: isLight, max: 2030, min: 2020, onBack: () => monthInputRef.current.focus(), onBlur: handleBlur, onClick: onClick, onFilled: submit, onFocus: handleFocus, onFormatError: handleFormatError, onNext: onNext, onPrevious: () => monthInputRef.current.focus(), size: 4 })] }), !isCompact && jsx(Calendar, {})] }));
4346
+ return (jsxs(Box$b, { ref: boxRef, "$hasError": hasFormatError || hasValidationError, "$isCompact": isCompact, "$isDisabled": disabled, "$isFocused": isForcedFocused || isFocused, "$isLight": isLight, children: [jsxs("div", { children: [isStartDate && jsx("span", { children: "Du " }), isEndDate && jsx("span", { children: "Au " }), jsx(NumberInput$1, { ref: dayInputRef, "aria-label": `Jour${isStartDate ? ' de début' : ''}${isEndDate ? ' de fin' : ''}`, defaultValue: defaultValue && formatNumberAsDoubleDigit(defaultValue[2]), disabled: disabled, isLight: isLight, max: 31, min: 1, onBack: onBack, onBlur: handleBlur, onClick: onClick, onFilled: submit, onFocus: handleFocus, onFormatError: handleFormatError, onNext: () => monthInputRef.current.focus(), onPrevious: onPrevious, size: 2 }), "/", jsx(NumberInput$1, { ref: monthInputRef, "aria-label": `Mois${isStartDate ? ' de début' : ''}${isEndDate ? ' de fin' : ''}`, defaultValue: defaultValue && formatNumberAsDoubleDigit(defaultValue[1]), disabled: disabled, isLight: isLight, max: 12, min: 1, onBack: () => dayInputRef.current.focus(), onBlur: handleBlur, onClick: onClick, onFilled: submit, onFocus: handleFocus, onFormatError: handleFormatError, onNext: () => yearInputRef.current.focus(), onPrevious: () => dayInputRef.current.focus(), size: 2 }), "/", jsx(NumberInput$1, { ref: yearInputRef, "aria-label": `Année${isStartDate ? ' de début' : ''}${isEndDate ? ' de fin' : ''}`, defaultValue: defaultValue && defaultValue[0], disabled: disabled, isLight: isLight, max: 2030, min: 2020, onBack: () => monthInputRef.current.focus(), onBlur: handleBlur, onClick: onClick, onFilled: submit, onFocus: handleFocus, onFormatError: handleFormatError, onNext: onNext, onPrevious: () => monthInputRef.current.focus(), size: 4 })] }), !isCompact && jsx(Calendar, {})] }));
4264
4347
  }
4265
4348
  const DateInput = forwardRef(DateInputWithRef);
4266
- const Box$c = styled.div `
4349
+ const Box$b = styled.div `
4267
4350
  align-items: center;
4268
4351
  background-color: ${p => (p.$isLight ? p.theme.color.white : p.theme.color.gainsboro)};
4269
4352
  box-shadow: ${p => p.$hasError || p.$isFocused
@@ -4336,9 +4419,9 @@ function RangedTimePicker({ filter, minutesRange, onChange }) {
4336
4419
  if (!filteredRangedTimeOptions.length) {
4337
4420
  return jsx(Fragment, {});
4338
4421
  }
4339
- return (jsx(Box$b, { onClick: stopMouseEventPropagation, role: "listbox", children: filteredRangedTimeOptions.map(({ label, value }, index) => (jsx(Option, { "aria-selected": false, className: "js-ranged-time-picker-option", isSelected: index === selectedOptionIndex, onClick: () => onChange(value), role: "option", tabIndex: -1, children: spannedLabels[index] }, label))) }));
4422
+ return (jsx(Box$a, { onClick: stopMouseEventPropagation, role: "listbox", children: filteredRangedTimeOptions.map(({ label, value }, index) => (jsx(Option, { "aria-selected": false, className: "js-ranged-time-picker-option", isSelected: index === selectedOptionIndex, onClick: () => onChange(value), role: "option", tabIndex: -1, children: spannedLabels[index] }, label))) }));
4340
4423
  }
4341
- const Box$b = styled.div `
4424
+ const Box$a = styled.div `
4342
4425
  background-color: ${p => p.theme.color.white};
4343
4426
  box-shadow: inset 0px 0px 0px 1px ${p => p.theme.color.lightGray};
4344
4427
  display: flex;
@@ -4463,10 +4546,10 @@ disabled = false, isCompact, isEndDate = false, isLight, isStartDate = false, mi
4463
4546
  onChange(nextTimeTuple);
4464
4547
  }, [closeRangedTimePicker, onChange]);
4465
4548
  useClickOutsideEffect(boxRef, closeRangedTimePicker, baseContainer);
4466
- return (jsxs(Box$a, { ref: boxRef, "$hasError": hasFormatError || hasValidationError, "$isCompact": isCompact, "$isDisabled": disabled, "$isFocused": isFocused, "$isLight": isLight, children: [jsxs(InputGroup, { children: [jsxs("div", { children: [jsx(NumberInput$1, { ref: hourInputRef, "aria-label": `Heure${isStartDate ? ' de début' : ''}${isEndDate ? ' de fin' : ''}`, defaultValue: controlledDefaultValue && controlledDefaultValue[0], disabled: disabled, isLight: isLight, max: 23, min: 0, onBack: handleBack, onBlur: handleBlur, onClick: openRangedTimePicker, onFilled: submit, onFocus: handleFocus, onFormatError: handleFormatError, onInput: handleHourInput, onNext: () => minuteInputRef.current.focus(), onPrevious: onPrevious, size: 2 }), ":", jsx(NumberInput$1, { ref: minuteInputRef, "aria-label": `Minute${isStartDate ? ' de début' : ''}${isEndDate ? ' de fin' : ''}`, defaultValue: controlledDefaultValue && controlledDefaultValue[1], disabled: disabled, isLight: isLight, max: 59, min: 0, onBack: () => hourInputRef.current.focus(), onBlur: handleBlur, onClick: openRangedTimePicker, onFilled: submit, onFocus: handleFocus, onFormatError: handleFormatError, onNext: onNext, onPrevious: () => hourInputRef.current.focus(), size: 2 })] }), !isCompact && jsx(Clock, {})] }), isRangedTimePickerOpenRef.current && (jsx(RangedTimePicker, { filter: rangedTimePickerFilter, minutesRange: minutesRange, onChange: handleRangedTimePickedChange }))] }));
4549
+ return (jsxs(Box$9, { ref: boxRef, "$hasError": hasFormatError || hasValidationError, "$isCompact": isCompact, "$isDisabled": disabled, "$isFocused": isFocused, "$isLight": isLight, children: [jsxs(InputGroup, { children: [jsxs("div", { children: [jsx(NumberInput$1, { ref: hourInputRef, "aria-label": `Heure${isStartDate ? ' de début' : ''}${isEndDate ? ' de fin' : ''}`, defaultValue: controlledDefaultValue && controlledDefaultValue[0], disabled: disabled, isLight: isLight, max: 23, min: 0, onBack: handleBack, onBlur: handleBlur, onClick: openRangedTimePicker, onFilled: submit, onFocus: handleFocus, onFormatError: handleFormatError, onInput: handleHourInput, onNext: () => minuteInputRef.current.focus(), onPrevious: onPrevious, size: 2 }), ":", jsx(NumberInput$1, { ref: minuteInputRef, "aria-label": `Minute${isStartDate ? ' de début' : ''}${isEndDate ? ' de fin' : ''}`, defaultValue: controlledDefaultValue && controlledDefaultValue[1], disabled: disabled, isLight: isLight, max: 59, min: 0, onBack: () => hourInputRef.current.focus(), onBlur: handleBlur, onClick: openRangedTimePicker, onFilled: submit, onFocus: handleFocus, onFormatError: handleFormatError, onNext: onNext, onPrevious: () => hourInputRef.current.focus(), size: 2 })] }), !isCompact && jsx(Clock, {})] }), isRangedTimePickerOpenRef.current && (jsx(RangedTimePicker, { filter: rangedTimePickerFilter, minutesRange: minutesRange, onChange: handleRangedTimePickedChange }))] }));
4467
4550
  }
4468
4551
  const TimeInput = forwardRef(TimeInputWithRef);
4469
- const Box$a = styled.div `
4552
+ const Box$9 = styled.div `
4470
4553
  background-color: ${p => (p.$isLight ? p.theme.color.white : p.theme.color.gainsboro)};
4471
4554
  box-shadow: ${p => p.$hasError || p.$isFocused
4472
4555
  ? `inset 0px 0px 0px 1px ${p.$hasError ? p.theme.color.maximumRed : p.theme.color.blueGray[100]}`
@@ -4545,13 +4628,13 @@ function CalendarPicker({ defaultValue, isHistorical, isOpen, onChange }) {
4545
4628
  // and can be used as a container for <RsuiteDatePicker />
4546
4629
  forceUpdate();
4547
4630
  }, [forceUpdate]);
4548
- return (jsx(Box$9, { ref: boxRef, onClick: stopMouseEventPropagation, children: boxRef.current && (jsx(DatePicker$1, { container: boxRef.current, disabledDate: disabledDate, format: "yyyy-MM-dd", locale: RSUITE_CALENDAR_LOCALE, oneTap: true, onSelect: handleSelect, open: isOpen,
4631
+ return (jsx(Box$8, { ref: boxRef, onClick: stopMouseEventPropagation, children: boxRef.current && (jsx(DatePicker$1, { container: boxRef.current, disabledDate: disabledDate, format: "yyyy-MM-dd", locale: RSUITE_CALENDAR_LOCALE, oneTap: true, onSelect: handleSelect, open: isOpen,
4549
4632
  // `defaultValue` seems to be immediatly cancelled so we come down to using a controlled `value`
4550
4633
  ranges: [],
4551
4634
  // eslint-disable-next-line no-null/no-null
4552
4635
  value: defaultValue ?? null })) }));
4553
4636
  }
4554
- const Box$9 = styled.div `
4637
+ const Box$8 = styled.div `
4555
4638
  height: 0;
4556
4639
  position: relative;
4557
4640
  user-select: none;
@@ -4804,9 +4887,9 @@ disabled = false, error, isCompact = false, isHistorical = false, isLabelHidden
4804
4887
  }, [forceUpdate]);
4805
4888
  useFieldUndefineEffect(disabled, onChange, handleDisable);
4806
4889
  useClickOutsideEffect(boxRef, closeCalendarPicker, baseContainer);
4807
- return (jsxs(Fieldset, { disabled: disabled, isLegendHidden: isLabelHidden, legend: label, ...nativeProps, children: [jsxs(Box$8, { ref: boxRef, children: [jsx(Field$1, { children: jsx(DateInput, { ref: dateInputRef, defaultValue: selectedLocalizedDateTupleRef.current, disabled: disabled, isCompact: isCompact, isForcedFocused: isCalendarPickerOpenRef.current, isLight: isLight, onChange: handleDateInputChange, onClick: openCalendarPicker, onNext: handleDateInputNext }) }), withTime && (jsx(Field$1, { "$isTimeField": true, children: jsx(TimeInput, { ref: timeInputRef, baseContainer: baseContainer, defaultValue: selectedLocalizedTimeTupleRef.current, disabled: disabled, isCompact: isCompact, isLight: isLight, minutesRange: minutesRange, onBack: () => dateInputRef.current.focus(true), onChange: handleTimeInputFilled, onFocus: closeCalendarPicker, onPrevious: () => dateInputRef.current.focus(true) }) }))] }), hasError && jsx(FieldError, { children: controlledError }), jsx(CalendarPicker, { defaultValue: rangeCalendarPickerDefaultValue, isHistorical: isHistorical, isOpen: isCalendarPickerOpenRef.current, onChange: handleCalendarPickerChange })] }));
4890
+ return (jsxs(Fieldset, { disabled: disabled, isLegendHidden: isLabelHidden, legend: label, ...nativeProps, children: [jsxs(Box$7, { ref: boxRef, children: [jsx(Field$1, { children: jsx(DateInput, { ref: dateInputRef, defaultValue: selectedLocalizedDateTupleRef.current, disabled: disabled, isCompact: isCompact, isForcedFocused: isCalendarPickerOpenRef.current, isLight: isLight, onChange: handleDateInputChange, onClick: openCalendarPicker, onNext: handleDateInputNext }) }), withTime && (jsx(Field$1, { "$isTimeField": true, children: jsx(TimeInput, { ref: timeInputRef, baseContainer: baseContainer, defaultValue: selectedLocalizedTimeTupleRef.current, disabled: disabled, isCompact: isCompact, isLight: isLight, minutesRange: minutesRange, onBack: () => dateInputRef.current.focus(true), onChange: handleTimeInputFilled, onFocus: closeCalendarPicker, onPrevious: () => dateInputRef.current.focus(true) }) }))] }), hasError && jsx(FieldError, { children: controlledError }), jsx(CalendarPicker, { defaultValue: rangeCalendarPickerDefaultValue, isHistorical: isHistorical, isOpen: isCalendarPickerOpenRef.current, onChange: handleCalendarPickerChange })] }));
4808
4891
  }
4809
- const Box$8 = styled.div `
4892
+ const Box$7 = styled.div `
4810
4893
  * {
4811
4894
  font-weight: 500;
4812
4895
  line-height: 1;
@@ -4855,12 +4938,12 @@ function RangeCalendarPicker({ defaultValue, isHistorical, isOpen, onChange }) {
4855
4938
  // and can be used as a container for <RsuiteDateRangePicker />
4856
4939
  forceUpdate();
4857
4940
  }, [forceUpdate]);
4858
- return (jsx(Box$7, { ref: boxRef, onClick: stopMouseEventPropagation, children: boxRef.current && (jsx(DateRangePicker$1, { container: boxRef.current, disabledDate: disabledDate, format: "yyyy-MM-dd", locale: RSUITE_CALENDAR_LOCALE, onSelect: handleSelect, open: isOpen, ranges: [],
4941
+ return (jsx(Box$6, { ref: boxRef, onClick: stopMouseEventPropagation, children: boxRef.current && (jsx(DateRangePicker$1, { container: boxRef.current, disabledDate: disabledDate, format: "yyyy-MM-dd", locale: RSUITE_CALENDAR_LOCALE, onSelect: handleSelect, open: isOpen, ranges: [],
4859
4942
  // `defaultValue` seems to be immediatly cancelled so we come down to using a controlled `value`
4860
4943
  // eslint-disable-next-line no-null/no-null
4861
4944
  value: controlledValue ?? null })) }));
4862
4945
  }
4863
- const Box$7 = styled.div `
4946
+ const Box$6 = styled.div `
4864
4947
  height: 0;
4865
4948
  position: relative;
4866
4949
  user-select: none;
@@ -5189,9 +5272,9 @@ disabled = false, error, isCompact = false, isHistorical = false, isLabelHidden
5189
5272
  }, [forceUpdate]);
5190
5273
  useFieldUndefineEffect(disabled, onChange, handleDisable);
5191
5274
  useClickOutsideEffect([endDateInputRef, startDateInputRef], closeRangeCalendarPicker, baseContainer);
5192
- return (jsxs(Fieldset, { disabled: disabled, isLegendHidden: isLabelHidden, legend: label, ...nativeProps, children: [jsxs(Box$6, { isDisabled: disabled, children: [jsx(Field, { children: jsx(DateInput, { ref: startDateInputRef, defaultValue: selectedLocalizedStartDateTupleRef.current, disabled: disabled, isCompact: isCompact, isForcedFocused: isRangeCalendarPickerOpenRef.current, isLight: isLight, isStartDate: true, onChange: (nextDateTuple, isFilled) => handleDateInputChange(DateRangePosition.START, nextDateTuple, isFilled), onClick: openRangeCalendarPicker, onNext: handleStartDateInputNext }) }), withTime && (jsx(Field, { isTimeField: true, children: jsx(TimeInput, { ref: startTimeInputRef, baseContainer: baseContainer, defaultValue: selectedLocalizedStartTimeTupleRef.current, disabled: disabled, isCompact: isCompact, isLight: isLight, isStartDate: true, minutesRange: minutesRange, onBack: () => startDateInputRef.current.focus(true), onChange: nextTimeTuple => handleTimeInputFilled(DateRangePosition.START, nextTimeTuple), onFocus: closeRangeCalendarPicker, onNext: () => endDateInputRef.current.focus(), onPrevious: () => startDateInputRef.current.focus(true) }) })), jsx(Field, { isEndDateField: true, children: jsx(DateInput, { ref: endDateInputRef, defaultValue: selectedLocalizedEndDateTupleRef.current, disabled: disabled, isCompact: isCompact, isEndDate: true, isForcedFocused: isRangeCalendarPickerOpenRef.current, isLight: isLight, onBack: handleEndDateInputPrevious, onChange: (nextDateTuple, isFilled) => handleDateInputChange(DateRangePosition.END, nextDateTuple, isFilled), onClick: openRangeCalendarPicker, onNext: handleEndDateInputNext, onPrevious: handleEndDateInputPrevious }) }), withTime && (jsx(Field, { isTimeField: true, children: jsx(TimeInput, { ref: endTimeInputRef, baseContainer: baseContainer, defaultValue: selectedLocalizedEndTimeTupleRef.current, disabled: disabled, isCompact: isCompact, isEndDate: true, isLight: isLight, minutesRange: minutesRange, onBack: () => endDateInputRef.current.focus(true), onChange: nextTimeTuple => handleTimeInputFilled(DateRangePosition.END, nextTimeTuple), onFocus: closeRangeCalendarPicker, onPrevious: () => endDateInputRef.current.focus(true) }) }))] }), hasError && jsx(FieldError, { children: controlledError }), jsx(RangeCalendarPicker, { defaultValue: rangeCalendarPickerDefaultValue, isHistorical: isHistorical, isOpen: isRangeCalendarPickerOpenRef.current, onChange: handleRangeCalendarPickerChange })] }));
5275
+ return (jsxs(Fieldset, { disabled: disabled, isLegendHidden: isLabelHidden, legend: label, ...nativeProps, children: [jsxs(Box$5, { isDisabled: disabled, children: [jsx(Field, { children: jsx(DateInput, { ref: startDateInputRef, defaultValue: selectedLocalizedStartDateTupleRef.current, disabled: disabled, isCompact: isCompact, isForcedFocused: isRangeCalendarPickerOpenRef.current, isLight: isLight, isStartDate: true, onChange: (nextDateTuple, isFilled) => handleDateInputChange(DateRangePosition.START, nextDateTuple, isFilled), onClick: openRangeCalendarPicker, onNext: handleStartDateInputNext }) }), withTime && (jsx(Field, { isTimeField: true, children: jsx(TimeInput, { ref: startTimeInputRef, baseContainer: baseContainer, defaultValue: selectedLocalizedStartTimeTupleRef.current, disabled: disabled, isCompact: isCompact, isLight: isLight, isStartDate: true, minutesRange: minutesRange, onBack: () => startDateInputRef.current.focus(true), onChange: nextTimeTuple => handleTimeInputFilled(DateRangePosition.START, nextTimeTuple), onFocus: closeRangeCalendarPicker, onNext: () => endDateInputRef.current.focus(), onPrevious: () => startDateInputRef.current.focus(true) }) })), jsx(Field, { isEndDateField: true, children: jsx(DateInput, { ref: endDateInputRef, defaultValue: selectedLocalizedEndDateTupleRef.current, disabled: disabled, isCompact: isCompact, isEndDate: true, isForcedFocused: isRangeCalendarPickerOpenRef.current, isLight: isLight, onBack: handleEndDateInputPrevious, onChange: (nextDateTuple, isFilled) => handleDateInputChange(DateRangePosition.END, nextDateTuple, isFilled), onClick: openRangeCalendarPicker, onNext: handleEndDateInputNext, onPrevious: handleEndDateInputPrevious }) }), withTime && (jsx(Field, { isTimeField: true, children: jsx(TimeInput, { ref: endTimeInputRef, baseContainer: baseContainer, defaultValue: selectedLocalizedEndTimeTupleRef.current, disabled: disabled, isCompact: isCompact, isEndDate: true, isLight: isLight, minutesRange: minutesRange, onBack: () => endDateInputRef.current.focus(true), onChange: nextTimeTuple => handleTimeInputFilled(DateRangePosition.END, nextTimeTuple), onFocus: closeRangeCalendarPicker, onPrevious: () => endDateInputRef.current.focus(true) }) }))] }), hasError && jsx(FieldError, { children: controlledError }), jsx(RangeCalendarPicker, { defaultValue: rangeCalendarPickerDefaultValue, isHistorical: isHistorical, isOpen: isRangeCalendarPickerOpenRef.current, onChange: handleRangeCalendarPickerChange })] }));
5193
5276
  }
5194
- const Box$6 = styled.div `
5277
+ const Box$5 = styled.div `
5195
5278
  * {
5196
5279
  font-weight: 500;
5197
5280
  line-height: 1;
@@ -5314,13 +5397,14 @@ searchable = false, ...originalProps }) {
5314
5397
  useEffect(() => {
5315
5398
  forceUpdate();
5316
5399
  }, [forceUpdate]);
5317
- return (jsxs(Field$2, { children: [jsx(Label, { disabled: originalProps.disabled, hasError: hasError, htmlFor: originalProps.name, isHidden: isLabelHidden, children: label }), jsx(Box$5, { ref: boxRef, "$isActive": isOpen, "$isLight": isLight, onClick: toggle, children: boxRef.current && (jsx(TagPicker, { container: boxRef.current, data: options, defaultValue: controlledDefaultValue, id: originalProps.name, onChange: handleChange, onClick: toggle, open: isOpen, renderMenuItem: renderMenuItem, searchable: searchable, ...originalProps }, key)) }), hasError && jsx(FieldError, { children: controlledError })] }));
5400
+ return (jsxs(Field$2, { children: [jsx(Label, { disabled: originalProps.disabled, hasError: hasError, htmlFor: originalProps.name, isHidden: isLabelHidden, children: label }), jsx(Box$4, { ref: boxRef, "$isActive": isOpen, "$isLight": isLight, onClick: toggle, children: boxRef.current && (jsx(TagPicker, { container: boxRef.current, data: options, defaultValue: controlledDefaultValue, id: originalProps.name, onChange: handleChange, onClick: toggle, open: isOpen, renderMenuItem: renderMenuItem, searchable: searchable, ...originalProps }, key)) }), hasError && jsx(FieldError, { children: controlledError })] }));
5318
5401
  }
5319
- const Box$5 = styled.div `
5402
+ const Box$4 = styled.div `
5320
5403
  position: relative;
5321
5404
  width: 100%;
5322
5405
 
5323
5406
  > .rs-picker-input {
5407
+ background-color: ${p => (p.$isLight ? p.theme.color.white : p.theme.color.gainsboro)} !important;
5324
5408
  border: solid 1px ${p => (p.$isActive ? p.theme.color.blueGray[100] : p.theme.color.gainsboro)} !important;
5325
5409
  cursor: pointer;
5326
5410
  width: 100%;
@@ -5357,6 +5441,9 @@ const Box$5 = styled.div `
5357
5441
  }
5358
5442
 
5359
5443
  > .rs-picker-tag-wrapper {
5444
+ > .rs-tag {
5445
+ background-color: ${p => (p.$isLight ? p.theme.color.gainsboro : p.theme.color.white)};
5446
+ }
5360
5447
  .rs-picker-search {
5361
5448
  .rs-picker-search-input {
5362
5449
  padding: 0 8px !important;
@@ -5558,6 +5645,8 @@ const StyledInput$2 = styled(Input) `
5558
5645
  width: 100%;
5559
5646
  `;
5560
5647
 
5648
+ const noop = () => { };
5649
+
5561
5650
  function c(u,e,c){var i=this,a=useRef(null),o=useRef(0),f=useRef(null),l=useRef([]),m=useRef(),v=useRef(),d=useRef(u),p=useRef(!0);useEffect(function(){d.current=u;},[u]);var g=!e&&0!==e&&"undefined"!=typeof window;if("function"!=typeof u)throw new TypeError("Expected a function");e=+e||0;var w=!!(c=c||{}).leading,s=!("trailing"in c)||!!c.trailing,x="maxWait"in c,y=x?Math.max(+c.maxWait||0,e):null;useEffect(function(){return p.current=!0,function(){p.current=!1;}},[]);var h=useMemo(function(){var r=function(r){var n=l.current,t=m.current;return l.current=m.current=null,o.current=r,v.current=d.current.apply(t,n)},n=function(r,n){g&&cancelAnimationFrame(f.current),f.current=g?requestAnimationFrame(r):setTimeout(r,n);},t=function(r){if(!p.current)return !1;var n=r-a.current;return !a.current||n>=e||n<0||x&&r-o.current>=y},u=function(n){return f.current=null,s&&l.current?r(n):(l.current=m.current=null,v.current)},c=function r(){var c=Date.now();if(t(c))return u(c);if(p.current){var i=e-(c-a.current),f=x?Math.min(i,y-(c-o.current)):i;n(r,f);}},h=function(){var u=Date.now(),d=t(u);if(l.current=[].slice.call(arguments),m.current=i,a.current=u,d){if(!f.current&&p.current)return o.current=a.current,n(c,e),w?r(a.current):v.current;if(x)return n(c,e),r(a.current)}return f.current||n(c,e),v.current};return h.cancel=function(){f.current&&(g?cancelAnimationFrame(f.current):clearTimeout(f.current)),o.current=0,l.current=a.current=m.current=f.current=null;},h.isPending=function(){return !!f.current},h.flush=function(){return f.current?u(Date.now()):v.current},h},[w,x,e,y,s,g]);return h}
5562
5651
 
5563
5652
  function isNumeric(val) {
@@ -5568,12 +5657,18 @@ function isNumeric(val) {
5568
5657
  return !(val instanceof Array) && val - parseFloat(val) + 1 >= 0;
5569
5658
  }
5570
5659
 
5571
- function DDCoordinatesInput({ coordinates, onChange }) {
5660
+ // TODO This field should return undefined when cleared (i.e.: Select all & Backspace/Delete)
5661
+ function DDCoordinatesInput({ coordinates,
5662
+ // eslint-disable-next-line @typescript-eslint/naming-convention
5663
+ disabled = false, onChange }) {
5572
5664
  const latitudeInputRef = useRef();
5573
5665
  const longitudeInputRef = useRef();
5574
5666
  const [latitudeError, setLatitudeError] = useState('');
5575
5667
  const [longitudeError, setLongitudeError] = useState('');
5576
5668
  const defaultValue = useMemo(() => {
5669
+ if (!coordinates) {
5670
+ return undefined;
5671
+ }
5577
5672
  const [latitude, longitude] = coordinates;
5578
5673
  if (isNumeric(latitude) && isNumeric(longitude)) {
5579
5674
  return {
@@ -5606,7 +5701,7 @@ function DDCoordinatesInput({ coordinates, onChange }) {
5606
5701
  const longitude = Number(longitudeAsString);
5607
5702
  onChange([latitude, longitude], nextCoordinates);
5608
5703
  }, 500);
5609
- return (jsxs(Box$4, { children: [jsx(DDInput, { ref: latitudeInputRef, "data-cy": "coordinates-dd-input-lat", defaultValue: defaultValue.latitude, onChange: () => handleChange(coordinates), placeholder: "Latitude", style: { border: latitudeError ? '1px solid red' : undefined } }), jsx(DDInput, { ref: longitudeInputRef, "data-cy": "coordinates-dd-input-lon", defaultValue: defaultValue.longitude, onChange: () => handleChange(coordinates), placeholder: "Longitude", style: { border: longitudeError ? '1px solid red' : undefined } }), jsx(CoordinatesType$2, { children: "(DD)" }), jsx(Error$2, { children: latitudeError }), jsx(Error$2, { children: longitudeError })] }));
5704
+ return (jsxs(Box$3, { children: [jsx(DDInput, { ref: latitudeInputRef, "data-cy": "coordinates-dd-input-lat", defaultValue: defaultValue ? defaultValue.latitude : undefined, disabled: disabled, onChange: () => handleChange(coordinates), placeholder: "Latitude", style: { border: latitudeError ? '1px solid red' : undefined } }), jsx(DDInput, { ref: longitudeInputRef, "data-cy": "coordinates-dd-input-lon", defaultValue: defaultValue ? defaultValue.longitude : undefined, disabled: disabled, onChange: () => handleChange(coordinates), placeholder: "Longitude", style: { border: longitudeError ? '1px solid red' : undefined } }), jsx(CoordinatesType$2, { children: "(DD)" }), jsx(Error$2, { children: latitudeError }), jsx(Error$2, { children: longitudeError })] }));
5610
5705
  }
5611
5706
  const DDInput = styled.input `
5612
5707
  margin-right: 5px !important;
@@ -5620,7 +5715,7 @@ const Error$2 = styled.span `
5620
5715
  color: red;
5621
5716
  display: block;
5622
5717
  `;
5623
- const Box$4 = styled.div `
5718
+ const Box$3 = styled.div `
5624
5719
  font-size: 13px;
5625
5720
  text-align: left;
5626
5721
  `;
@@ -15558,7 +15653,10 @@ const coordinatesAreDistinct = (nextCoordinates, coordinates) => {
15558
15653
  // TODO Remove that once the fix is added and released.
15559
15654
  // Open issue: https://github.com/uNmAnNeR/imaskjs/issues/761
15560
15655
  const UntypedIMaskInput = IMaskInput;
15561
- function DMDCoordinatesInput({ coordinates, coordinatesFormat, onChange }) {
15656
+ // TODO This field should return undefined when cleared (i.e.: Select all & Backspace/Delete)
15657
+ function DMDCoordinatesInput({ coordinates, coordinatesFormat,
15658
+ // eslint-disable-next-line @typescript-eslint/naming-convention
15659
+ disabled = false, onChange }) {
15562
15660
  const [error, setError] = useState('');
15563
15661
  const [value, setValue] = useState('');
15564
15662
  useEffect(() => {
@@ -15611,9 +15709,11 @@ function DMDCoordinatesInput({ coordinates, coordinatesFormat, onChange }) {
15611
15709
  setError('Format lat/long invalide');
15612
15710
  }
15613
15711
  }
15614
- return (jsxs(Box$3, { children: [jsx(UntypedIMaskInput, { "data-cy": "dmd-coordinates-input", lazy: false, mask: "00\u00B0 00.000\u2032 a 000\u00B0 00.000\u2032 a",
15712
+ return (jsxs(Box$2, { children: [jsx(UntypedIMaskInput, { "data-cy": "dmd-coordinates-input", disabled: disabled, lazy: false, mask: "00\u00B0 00.000\u2032 a 000\u00B0 00.000\u2032 a",
15615
15713
  // @ts-ignore
15616
- onAccept: (_, mask) => setValue(mask.value), onComplete: (_, mask) => completeCoordinates(mask), placeholder: "__\u00B0 __.___\u2032 _ ___\u00B0 __.___\u2032", radix: ".", style: { border: error ? '1px solid red' : undefined }, value: value }), jsx(CoordinatesType$1, { children: "(DMD)" }), jsx(Error$1, { children: error })] }));
15714
+ onAccept: (_, mask) => setValue(mask.value), onComplete: (_, mask) => completeCoordinates(mask), placeholder: "__\u00B0 __.___\u2032 _ ___\u00B0 __.___\u2032", radix: ".", style: { border: error ? '1px solid red' : undefined },
15715
+ // TODO Use `defaultValue` here.
15716
+ value: value }), jsx(CoordinatesType$1, { children: "(DMD)" }), jsx(Error$1, { children: error })] }));
15617
15717
  }
15618
15718
  const CoordinatesType$1 = styled.span `
15619
15719
  margin-left: 7px;
@@ -15623,56 +15723,63 @@ const Error$1 = styled.span `
15623
15723
  color: ${p => p.theme.color.maximumRed};
15624
15724
  display: inline-block;
15625
15725
  `;
15626
- const Box$3 = styled.div `
15726
+ const Box$2 = styled.div `
15627
15727
  font-size: 13px;
15628
15728
  text-align: left;
15629
15729
  `;
15630
15730
 
15631
- function DMSCoordinatesInput({ coordinates, coordinatesFormat, onChange }) {
15731
+ function DMSCoordinatesInput({ coordinates, coordinatesFormat,
15732
+ // eslint-disable-next-line @typescript-eslint/naming-convention
15733
+ disabled = false, onChange }) {
15632
15734
  /** Convert the coordinates to the [latitude, longitude] string format */
15633
- const showedValue = useMemo(() => {
15735
+ const defaultValue = useMemo(() => {
15634
15736
  if (!coordinates?.length || !coordinatesFormat) {
15635
15737
  return '';
15636
15738
  }
15637
15739
  return coordinates?.join(', ') || '';
15638
15740
  }, [coordinates, coordinatesFormat]);
15639
15741
  const update = useCallback(nextCoordinates => {
15640
- onChange(nextCoordinates, coordinates);
15742
+ const normalizedNextCoordinates = !isEmpty(nextCoordinates) ? nextCoordinates : undefined;
15743
+ onChange(normalizedNextCoordinates, coordinates);
15641
15744
  }, [coordinates, onChange]);
15642
- return (jsxs(Box$2, { children: [jsx(CoordinateInput, { "data-cy": "dms-coordinates-input", ddPrecision: 6, onChange: (_, { dd }) => update(dd), value: showedValue }), jsx(CoordinatesType, { children: "(DMS)" })] }));
15745
+ return (jsxs(Box$1, { children: [jsx(CoordinateInput, { "data-cy": "dms-coordinates-input", ddPrecision: 6, disabled: disabled, onChange: (_, { dd }) => update(dd),
15746
+ // TODO Use `defaultValue` here.
15747
+ value: defaultValue }), jsx(CoordinatesType, { children: "(DMS)" })] }));
15643
15748
  }
15644
15749
  const CoordinatesType = styled.span `
15645
15750
  margin-left: 7px;
15646
15751
  color: ${p => p.theme.color.slateGray};
15647
15752
  `;
15648
- const Box$2 = styled.div `
15753
+ const Box$1 = styled.div `
15649
15754
  font-size: 13px;
15650
15755
  text-align: left;
15651
15756
  `;
15652
15757
 
15653
- function CoordinatesInput({ coordinatesFormat, defaultValue, isLight = false, onChange }) {
15758
+ function CoordinatesInput({ coordinatesFormat, defaultValue,
15759
+ // eslint-disable-next-line @typescript-eslint/naming-convention
15760
+ error, isLabelHidden = false, isLight = false, label, onChange = noop, ...nativeProps }) {
15761
+ const controlledError = useMemo(() => normalizeString(error), [error]);
15762
+ const hasError = useMemo(() => Boolean(controlledError), [controlledError]);
15654
15763
  const getCoordinatesInput = useCallback(() => {
15655
15764
  switch (coordinatesFormat) {
15656
15765
  case CoordinatesFormat.DEGREES_MINUTES_SECONDS:
15657
- return (jsx(DMSCoordinatesInput, { coordinates: defaultValue, coordinatesFormat: CoordinatesFormat.DEGREES_MINUTES_SECONDS, onChange: onChange }));
15766
+ return (jsx(DMSCoordinatesInput, { coordinates: defaultValue, coordinatesFormat: CoordinatesFormat.DEGREES_MINUTES_SECONDS, disabled: nativeProps.disabled, onChange: onChange }));
15658
15767
  case CoordinatesFormat.DEGREES_MINUTES_DECIMALS:
15659
- return (jsx(DMDCoordinatesInput, { coordinates: defaultValue, coordinatesFormat: CoordinatesFormat.DEGREES_MINUTES_DECIMALS, onChange: onChange }));
15768
+ return (jsx(DMDCoordinatesInput, { coordinates: defaultValue, coordinatesFormat: CoordinatesFormat.DEGREES_MINUTES_DECIMALS, disabled: nativeProps.disabled, onChange: onChange }));
15660
15769
  case CoordinatesFormat.DECIMAL_DEGREES:
15661
- return jsx(DDCoordinatesInput, { coordinates: defaultValue, onChange: onChange });
15770
+ return (jsx(DDCoordinatesInput, { coordinates: defaultValue, disabled: nativeProps.disabled, onChange: onChange }));
15662
15771
  default:
15663
15772
  return undefined;
15664
15773
  }
15665
- }, [defaultValue, onChange, coordinatesFormat]);
15666
- return jsx(Box$1, { "$isLight": isLight, children: getCoordinatesInput() });
15774
+ }, [defaultValue, nativeProps.disabled, onChange, coordinatesFormat]);
15775
+ // TODO We must add a `handleDisable()` callback here to effectively empty the inputs when disabling this field.
15776
+ useFieldUndefineEffect(nativeProps.disabled, onChange /* , handleDisable */);
15777
+ return (jsxs(StyledFieldset, { isLegendHidden: isLabelHidden, isLight: isLight, legend: label, ...nativeProps, children: [getCoordinatesInput(), hasError && jsx(FieldError, { children: controlledError })] }));
15667
15778
  }
15668
- const Box$1 = styled.div `
15669
- color: ${p => p.theme.color.lightGray};
15670
- font-size: 13px;
15671
- text-align: left;
15672
-
15779
+ const StyledFieldset = styled(Fieldset) `
15673
15780
  input {
15674
- background-color: ${p => (p.$isLight ? p.theme.color.white : p.theme.color.gainsboro)};
15675
- border: ${p => (p.$isLight ? `1px solid ${p.theme.color.lightGray}` : 'none')};
15781
+ background-color: ${p => (p.isLight ? p.theme.color.white : p.theme.color.gainsboro)};
15782
+ border: ${p => (p.isLight ? `1px solid ${p.theme.color.lightGray}` : 'none')};
15676
15783
  color: ${p => p.theme.color.gunMetal};
15677
15784
  height: 33px;
15678
15785
  padding: 7px 11px;
@@ -15890,6 +15997,15 @@ function FormikCheckbox({ name, ...originalProps }) {
15890
15997
  return (jsx(Checkbox, { defaultChecked: isDefaultChecked, error: meta.error, name: name, onChange: handleChange, ...originalProps }));
15891
15998
  }
15892
15999
 
16000
+ function FormikCoordinatesInput({ name, ...originalProps }) {
16001
+ const [field, meta, helpers] = useField(name);
16002
+ // eslint-disable-next-line react-hooks/exhaustive-deps
16003
+ const defaultValue = useMemo(() => field.value, []);
16004
+ // eslint-disable-next-line react-hooks/exhaustive-deps
16005
+ const handleChange = useMemo(() => (nextCoordinates) => helpers.setValue(nextCoordinates), []);
16006
+ return jsx(CoordinatesInput, { defaultValue: defaultValue, error: meta.error, onChange: handleChange, ...originalProps });
16007
+ }
16008
+
15893
16009
  const UntypedDatePicker = DatePicker;
15894
16010
  function FormikDatePicker({ name, ...originalProps }) {
15895
16011
  const [field, meta, helpers] = useField(name);
@@ -15981,7 +16097,5 @@ function FormikTextInput({ name, ...originalProps }) {
15981
16097
  return (jsx(TextInput, { defaultValue: defaultValue, error: meta.error, name: name, onChange: handleChange, ...originalProps }));
15982
16098
  }
15983
16099
 
15984
- const noop = () => { };
15985
-
15986
- export { Accent, AutoComplete, Button, Checkbox, CoordinatesFormat, CoordinatesInput, DatePicker, DateRangePicker, Dropdown, Field$2 as Field, Fieldset, FormikAutoComplete, FormikCheckbox, FormikDatePicker, FormikDateRangePicker, FormikEffect, FormikMultiCheckbox, FormikMultiRadio, FormikMultiSelect, FormikNumberInput, FormikSelect, FormikTextInput, FormikTextarea, GlobalStyle, index as Icon, IconButton, Label, Legend, MultiCheckbox, MultiRadio, MultiSelect, MultiZoneEditor, NumberInput, OPENLAYERS_PROJECTION, OnlyFontGlobalStyle, Select, SingleTag, Size, THEME, Tag, TagGroup, TextInput, Textarea, ThemeProvider, WSG84_PROJECTION, coordinatesAreDistinct, dayjs, getCoordinates, getLocalizedDayjs, getUtcizedDayjs, isNumeric, noop, stopMouseEventPropagation, useClickOutsideEffect, useForceUpdate, useKey, usePrevious };
16100
+ export { Accent, AutoComplete, Button, Checkbox, CoordinatesFormat, CoordinatesInput, DatePicker, DateRangePicker, Dropdown, Field$2 as Field, Fieldset, FormikAutoComplete, FormikCheckbox, FormikCoordinatesInput, FormikDatePicker, FormikDateRangePicker, FormikEffect, FormikMultiCheckbox, FormikMultiRadio, FormikMultiSelect, FormikNumberInput, FormikSelect, FormikTextInput, FormikTextarea, GlobalStyle, index as Icon, IconButton, Label, Legend, MultiCheckbox, MultiRadio, MultiSelect, MultiZoneEditor, NumberInput, OPENLAYERS_PROJECTION, OnlyFontGlobalStyle, Select, SingleTag, Size, THEME, Tag, TagGroup, TextInput, Textarea, ThemeProvider, WSG84_PROJECTION, coordinatesAreDistinct, dayjs, getCoordinates, getLocalizedDayjs, getUtcizedDayjs, isNumeric, noop, stopMouseEventPropagation, useClickOutsideEffect, useForceUpdate, useKey, usePrevious };
15987
16101
  //# sourceMappingURL=index.js.map