@opengeoweb/form-fields 15.3.0 → 17.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.
Files changed (38) hide show
  1. package/index.esm.js +131 -26
  2. package/package.json +4 -4
  3. package/src/index.d.ts +0 -5
  4. package/src/lib/components/DegreesMinutesField.d.ts +0 -15
  5. package/src/lib/components/DegreesMinutesField.spec.d.ts +0 -1
  6. package/src/lib/components/Providers.d.ts +0 -19
  7. package/src/lib/components/Providers.spec.d.ts +0 -1
  8. package/src/lib/components/ReactHookFormDateTime.d.ts +0 -24
  9. package/src/lib/components/ReactHookFormDateTime.spec.d.ts +0 -1
  10. package/src/lib/components/ReactHookFormDateTime.stories.d.ts +0 -9
  11. package/src/lib/components/ReactHookFormFormControl.d.ts +0 -12
  12. package/src/lib/components/ReactHookFormFormControl.spec.d.ts +0 -1
  13. package/src/lib/components/ReactHookFormHiddenInput.d.ts +0 -7
  14. package/src/lib/components/ReactHookFormHiddenInput.spec.d.ts +0 -1
  15. package/src/lib/components/ReactHookFormHiddenInput.stories.d.ts +0 -7
  16. package/src/lib/components/ReactHookFormNumberField.d.ts +0 -12
  17. package/src/lib/components/ReactHookFormNumberField.spec.d.ts +0 -1
  18. package/src/lib/components/ReactHookFormNumberField.stories.d.ts +0 -9
  19. package/src/lib/components/ReactHookFormProvider.d.ts +0 -9
  20. package/src/lib/components/ReactHookFormProvider.stories.d.ts +0 -9
  21. package/src/lib/components/ReactHookFormRadioGroup.d.ts +0 -9
  22. package/src/lib/components/ReactHookFormRadioGroup.spec.d.ts +0 -1
  23. package/src/lib/components/ReactHookFormRadioGroup.stories.d.ts +0 -10
  24. package/src/lib/components/ReactHookFormSelect.d.ts +0 -8
  25. package/src/lib/components/ReactHookFormSelect.spec.d.ts +0 -1
  26. package/src/lib/components/ReactHookFormSelect.stories.d.ts +0 -9
  27. package/src/lib/components/ReactHookFormTextField.d.ts +0 -10
  28. package/src/lib/components/ReactHookFormTextField.spec.d.ts +0 -1
  29. package/src/lib/components/ReactHookFormTextField.stories.d.ts +0 -9
  30. package/src/lib/components/formUtils.d.ts +0 -3
  31. package/src/lib/components/formUtils.spec.d.ts +0 -1
  32. package/src/lib/components/index.d.ts +0 -13
  33. package/src/lib/components/types.d.ts +0 -8
  34. package/src/lib/components/utils.d.ts +0 -37
  35. package/src/lib/components/utils.spec.d.ts +0 -1
  36. package/src/lib/hooks/useDraftFormHelpers/useDraftFormHelpers.d.ts +0 -8
  37. package/src/lib/hooks/useDraftFormHelpers/useDraftFormHelpers.spec.d.ts +0 -1
  38. package/src/lib/utils/i18n.d.ts +0 -7
package/index.esm.js CHANGED
@@ -1,11 +1,11 @@
1
- import { jsxs, jsx } from 'react/jsx-runtime';
2
1
  import { FormControl, FormHelperText, InputLabel, Select, RadioGroup, TextField, InputAdornment } from '@mui/material';
2
+ import React, { useState } from 'react';
3
3
  import { useFormContext, useController, useForm, FormProvider, Controller } from 'react-hook-form';
4
4
  import { isEqual } from 'lodash';
5
5
  import { dateUtils } from '@opengeoweb/shared';
6
6
  import 'i18next';
7
7
  import { useTranslation } from 'react-i18next';
8
- import React, { useState } from 'react';
8
+ import { jsxs, jsx } from 'react/jsx-runtime';
9
9
  import { DateTimePicker } from '@mui/x-date-pickers';
10
10
  import { CalendarToday } from '@opengeoweb/theme';
11
11
  import { AdapterDateFns } from '@mui/x-date-pickers/AdapterDateFns';
@@ -96,6 +96,24 @@ function _objectWithoutPropertiesLoose(r, e) {
96
96
  return t;
97
97
  }
98
98
 
99
+ /* *
100
+ * Licensed under the Apache License, Version 2.0 (the "License");
101
+ * you may not use this file except in compliance with the License.
102
+ * You may obtain a copy of the License at
103
+ *
104
+ * http://www.apache.org/licenses/LICENSE-2.0
105
+ *
106
+ * Unless required by applicable law or agreed to in writing, software
107
+ * distributed under the License is distributed on an "AS IS" BASIS,
108
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
109
+ * See the License for the specific language governing permissions and
110
+ * limitations under the License.
111
+ *
112
+ * Copyright 2023 - Koninklijk Nederlands Meteorologisch Instituut (KNMI)
113
+ * Copyright 2023 - Finnish Meteorological Institute (FMI)
114
+ * Copyright 2024 - The Norwegian Meteorological Institute (MET Norway)
115
+ * */
116
+
99
117
  function getDeepProperty(property, state) {
100
118
  return property.reduce(function (xs, x) {
101
119
  if (xs && typeof xs === 'object' && x in xs) {
@@ -110,6 +128,24 @@ var getErrors = function getErrors(name, errors) {
110
128
  return (_getDeepProperty = getDeepProperty(nameAsArray, errors)) != null ? _getDeepProperty : undefined;
111
129
  };
112
130
 
131
+ /* *
132
+ * Licensed under the Apache License, Version 2.0 (the "License");
133
+ * you may not use this file except in compliance with the License.
134
+ * You may obtain a copy of the License at
135
+ *
136
+ * http://www.apache.org/licenses/LICENSE-2.0
137
+ *
138
+ * Unless required by applicable law or agreed to in writing, software
139
+ * distributed under the License is distributed on an "AS IS" BASIS,
140
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
141
+ * See the License for the specific language governing permissions and
142
+ * limitations under the License.
143
+ *
144
+ * Copyright 2021 - Koninklijk Nederlands Meteorologisch Instituut (KNMI)
145
+ * Copyright 2021 - Finnish Meteorological Institute (FMI)
146
+ * Copyright 2024 - The Norwegian Meteorological Institute (MET Norway)
147
+ * */
148
+
113
149
  var defaultProps = {
114
150
  shouldUnregister: false
115
151
  };
@@ -130,6 +166,7 @@ var errorMessages = {
130
166
  isNumeric: 'form-fields-error-numeric'
131
167
  };
132
168
  var regexMaxTwoDecimals = /^\s*-?\d+(\.\d{1,2})?\s*$/;
169
+
133
170
  // validations
134
171
  var isEmpty = function isEmpty(value) {
135
172
  if (typeof value === 'string' && !value.trim().length || value === null || value === undefined) {
@@ -169,6 +206,7 @@ var isLongitude = function isLongitude(lng) {
169
206
  }
170
207
  return isFinite(lng) && Math.abs(lng) <= 180 && lng >= -180 && regexMaxTwoDecimals.test(lng.toString());
171
208
  };
209
+
172
210
  // Pass null if no maxValue
173
211
  var isValidMax = function isValidMax(value, maxValue) {
174
212
  if (isEmpty(value) || maxValue === null) {
@@ -176,6 +214,7 @@ var isValidMax = function isValidMax(value, maxValue) {
176
214
  }
177
215
  return !(value > maxValue);
178
216
  };
217
+
179
218
  // Pass null if no minValue
180
219
  var isValidMin = function isValidMin(value, minValue) {
181
220
  if (isEmpty(value) || minValue === null) {
@@ -198,6 +237,7 @@ var isValidGeoJsonCoordinates = function isValidGeoJsonCoordinates(geojson) {
198
237
  if (!hasGeometry) {
199
238
  return false;
200
239
  }
240
+
201
241
  // eslint-disable-next-line @typescript-eslint/ban-ts-comment
202
242
  // @ts-ignore
203
243
  var _geojson$features$0$g2 = geojson.features[0].geometry,
@@ -241,6 +281,7 @@ var hasIntersectionWithFIR = function hasIntersectionWithFIR(geojson, intersecti
241
281
  if (!(intersection != null && intersection.features) || intersection.features.length === 0 || !((_intersection$feature = intersection.features[0]) != null && _intersection$feature.geometry)) {
242
282
  return false;
243
283
  }
284
+
244
285
  // eslint-disable-next-line @typescript-eslint/ban-ts-comment
245
286
  // @ts-ignore
246
287
  var _intersection$feature2 = intersection.features[0].geometry,
@@ -281,6 +322,7 @@ var countIntersectionPoints = function countIntersectionPoints(geojson, intersec
281
322
  }
282
323
  var geojsonCoordinates = geojsonGeometry.coordinates[0];
283
324
  var intersectionCoordinates = intersectionGeometry.coordinates[0];
325
+
284
326
  // If both arrays are empty, return 0
285
327
  if (!geojsonCoordinates && !intersectionCoordinates) {
286
328
  return 0;
@@ -347,6 +389,7 @@ var isNonOrBothCoordinates = function isNonOrBothCoordinates(coordinate, otherCo
347
389
  * Copyright 2024 - Finnish Meteorological Institute (FMI)
348
390
  * Copyright 2024 - The Norwegian Meteorological Institute (MET Norway)
349
391
  * */
392
+
350
393
  var FORM_FIELDS_NAMESPACE = 'form-fields';
351
394
  var ns = [FORM_FIELDS_NAMESPACE];
352
395
  var useFormFieldsTranslation = function useFormFieldsTranslation() {
@@ -396,7 +439,7 @@ var ReactHookFormFormControl = function ReactHookFormFormControl(_ref) {
396
439
  props = _objectWithoutPropertiesLoose(_ref, _excluded$6);
397
440
  var _useFormFieldsTransla = useFormFieldsTranslation(),
398
441
  t = _useFormFieldsTransla.t;
399
- return jsxs(FormControl, Object.assign({
442
+ return /*#__PURE__*/jsxs(FormControl, Object.assign({
400
443
  className: (isReadOnly ? 'is-read-only' : '') + " " + className,
401
444
  error: !!errors,
402
445
  fullWidth: true,
@@ -422,7 +465,7 @@ var ReactHookFormFormControl = function ReactHookFormFormControl(_ref) {
422
465
  }
423
466
  }, Array.isArray(sx) ? Object.assign.apply(Object, [{}].concat(sx)) : sx)
424
467
  }, props, {
425
- children: [children, errors ? jsx(FormHelperText, {
468
+ children: [children, errors ? /*#__PURE__*/jsx(FormHelperText, {
426
469
  role: "alert",
427
470
  variant: "filled",
428
471
  children: getErrorMessage(t, errors)
@@ -464,18 +507,18 @@ var ReactHookFormSelect = function ReactHookFormSelect(_ref) {
464
507
  ref = _useController$field.ref,
465
508
  formErrors = _useController.formState.errors;
466
509
  var errors = getErrors(name, formErrors);
467
- return jsxs(ReactHookFormFormControl, {
510
+ return /*#__PURE__*/jsxs(ReactHookFormFormControl, {
468
511
  className: className,
469
512
  disabled: disabled,
470
513
  errors: errors,
471
514
  isReadOnly: isReadOnly,
472
515
  size: size,
473
516
  sx: sx,
474
- children: [jsx(InputLabel, {
517
+ children: [/*#__PURE__*/jsx(InputLabel, {
475
518
  id: labelId,
476
519
  variant: "filled",
477
520
  children: label
478
- }), jsx(Select, Object.assign({
521
+ }), /*#__PURE__*/jsx(Select, Object.assign({
479
522
  inputRef: ref,
480
523
  label: label,
481
524
  labelId: labelId,
@@ -535,14 +578,14 @@ var ReactHookFormRadioGroup = function ReactHookFormRadioGroup(_ref) {
535
578
  }
536
579
  }
537
580
  }, [errors, formErrors, name]);
538
- return jsxs(ReactHookFormFormControl, {
581
+ return /*#__PURE__*/jsxs(ReactHookFormFormControl, {
539
582
  disabled: disabled,
540
583
  errors: errors,
541
584
  isReadOnly: isReadOnly,
542
- children: [jsx(InputLabel, {
585
+ children: [/*#__PURE__*/jsx(InputLabel, {
543
586
  id: labelId,
544
587
  children: label
545
- }), jsx(RadioGroup, Object.assign({
588
+ }), /*#__PURE__*/jsx(RadioGroup, Object.assign({
546
589
  name: name,
547
590
  onChange: function onChange(changeEvent) {
548
591
  onChangeField(changeEvent.target.value);
@@ -593,13 +636,13 @@ var ReactHookFormTextField = function ReactHookFormTextField(_ref) {
593
636
  ref = _useController$field.ref,
594
637
  formErrors = _useController.formState.errors;
595
638
  var errors = getErrors(name, formErrors);
596
- return jsx(ReactHookFormFormControl, {
639
+ return /*#__PURE__*/jsx(ReactHookFormFormControl, {
597
640
  className: className,
598
641
  disabled: disabled,
599
642
  errors: errors,
600
643
  isReadOnly: isReadOnly,
601
644
  sx: sx,
602
- children: jsx(TextField, Object.assign({
645
+ children: /*#__PURE__*/jsx(TextField, Object.assign({
603
646
  disabled: disabled,
604
647
  error: !!errors,
605
648
  helperText: helperText,
@@ -705,6 +748,7 @@ var ReactHookFormNumberField = function ReactHookFormNumberField(_ref) {
705
748
  event.preventDefault();
706
749
  }
707
750
  };
751
+
708
752
  // Transform number value to string for display, following React Hook Form transform pattern
709
753
  var formatValueForDisplay = React.useCallback(function (numValue) {
710
754
  if (numValue === null || numValue === undefined || isNaN(numValue)) {
@@ -712,6 +756,7 @@ var ReactHookFormNumberField = function ReactHookFormNumberField(_ref) {
712
756
  }
713
757
  return String(numValue);
714
758
  }, []);
759
+
715
760
  // Local state to preserve string precision during editing (e.g., trailing zeros), only sync from form value when not actively editing
716
761
  var _React$useState = React.useState(null),
717
762
  localValue = _React$useState[0],
@@ -719,6 +764,7 @@ var ReactHookFormNumberField = function ReactHookFormNumberField(_ref) {
719
764
  var isFocusedRef = React.useRef(false);
720
765
  var previousValueRef = React.useRef(value);
721
766
  var lastSetValueRef = React.useRef(null);
767
+
722
768
  // Sync local value from form value when value changes externally, but only when not actively editing and the change wasn't from our own update
723
769
  React.useEffect(function () {
724
770
  if (!isFocusedRef.current && value !== previousValueRef.current) {
@@ -736,6 +782,7 @@ var ReactHookFormNumberField = function ReactHookFormNumberField(_ref) {
736
782
  previousValueRef.current = value;
737
783
  }
738
784
  }, [value, localValue, inputMode]);
785
+
739
786
  // Compute display value: prefer local value if it has more precision than number representation
740
787
  var displayValue = React.useMemo(function () {
741
788
  // Always use local value if it exists and represents the same number as form value
@@ -749,13 +796,13 @@ var ReactHookFormNumberField = function ReactHookFormNumberField(_ref) {
749
796
  // When no local value or it doesn't match, use formatted form value
750
797
  return formatValueForDisplay(value);
751
798
  }, [value, localValue, inputMode, formatValueForDisplay]);
752
- return jsx(ReactHookFormFormControl, {
799
+ return /*#__PURE__*/jsx(ReactHookFormFormControl, {
753
800
  className: className,
754
801
  disabled: disabled,
755
802
  errors: errors,
756
803
  isReadOnly: isReadOnly,
757
804
  sx: sx,
758
- children: jsx(TextField, Object.assign({
805
+ children: /*#__PURE__*/jsx(TextField, Object.assign({
759
806
  disabled: disabled,
760
807
  error: !!errors,
761
808
  helperText: helperText,
@@ -810,7 +857,7 @@ var ReactHookFormNumberField = function ReactHookFormNumberField(_ref) {
810
857
 
811
858
  var _excluded$1 = ["name", "rules", "disabled", "label", "format", "openTo", "defaultNullValue", "helperText", "onChange", "className", "sx", "isReadOnly", "shouldHideUTC", "disablePast", "disableFuture"];
812
859
  var OpenPicker = function OpenPicker() {
813
- return jsx(CalendarToday, {});
860
+ return /*#__PURE__*/jsx(CalendarToday, {});
814
861
  };
815
862
  var getTimezoneOffset = function getTimezoneOffset(value) {
816
863
  return value.getTimezoneOffset() * 60000;
@@ -821,6 +868,7 @@ var makeLocalAppearUTC = function makeLocalAppearUTC(value) {
821
868
  var localToUTC = function localToUTC(dateTime) {
822
869
  return new Date(dateTime.getTime() - getTimezoneOffset(dateTime));
823
870
  };
871
+
824
872
  /**
825
873
  * Should return an isostring in the form "YYYY-MM-DDThh:mmZ";
826
874
  * The milli seconds section should not be included, strictly YYYY-MM-DDThh:mm:ssZ is important
@@ -879,18 +927,20 @@ var ReactHookKeyboardDateTimePicker = function ReactHookKeyboardDateTimePicker(_
879
927
  ref = _useController$field.ref,
880
928
  formErrors = _useController.formState.errors;
881
929
  var errors = getErrors(name, formErrors);
930
+
882
931
  // Ensure value is a Date object
932
+
883
933
  var dateValue = getDateValue(value);
884
934
  var now = makeLocalAppearUTC(dateUtils.utc());
885
935
  var minDateTime = disablePast ? now : null;
886
936
  var maxDateTime = disableFuture ? now : null;
887
- return jsx(ReactHookFormFormControl, {
937
+ return /*#__PURE__*/jsx(ReactHookFormFormControl, {
888
938
  className: className,
889
939
  disabled: disabled,
890
940
  errors: errors,
891
941
  isReadOnly: isReadOnly,
892
942
  sx: sx,
893
- children: jsx(DateTimePicker, Object.assign({
943
+ children: /*#__PURE__*/jsx(DateTimePicker, Object.assign({
894
944
  ampm: false,
895
945
  desktopModeMediaQuery: "@media (min-width: 720px)",
896
946
  disabled: disabled,
@@ -918,7 +968,7 @@ var ReactHookKeyboardDateTimePicker = function ReactHookKeyboardDateTimePicker(_
918
968
  name: name,
919
969
  placeholder: disabled ? '' : format.toLowerCase(),
920
970
  InputProps: Object.assign({}, !shouldHideUTC && {
921
- endAdornment: jsx(InputAdornment, {
971
+ endAdornment: /*#__PURE__*/jsx(InputAdornment, {
922
972
  position: "end",
923
973
  style: {
924
974
  paddingTop: '16px'
@@ -953,6 +1003,23 @@ var ReactHookKeyboardDateTimePicker = function ReactHookKeyboardDateTimePicker(_
953
1003
  });
954
1004
  };
955
1005
 
1006
+ /* *
1007
+ * Licensed under the Apache License, Version 2.0 (the "License");
1008
+ * you may not use this file except in compliance with the License.
1009
+ * You may obtain a copy of the License at
1010
+ *
1011
+ * http://www.apache.org/licenses/LICENSE-2.0
1012
+ *
1013
+ * Unless required by applicable law or agreed to in writing, software
1014
+ * distributed under the License is distributed on an "AS IS" BASIS,
1015
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
1016
+ * See the License for the specific language governing permissions and
1017
+ * limitations under the License.
1018
+ *
1019
+ * Copyright 2021 - Koninklijk Nederlands Meteorologisch Instituut (KNMI)
1020
+ * Copyright 2021 - Finnish Meteorological Institute (FMI)
1021
+ * Copyright 2024 - The Norwegian Meteorological Institute (MET Norway)
1022
+ * */
956
1023
  var defaultFormOptions = {
957
1024
  mode: 'onChange',
958
1025
  reValidateMode: 'onChange'
@@ -965,7 +1032,7 @@ var ReactHookFormProvider = function ReactHookFormProvider(_ref) {
965
1032
  // added this ignore as the build is failing otherwise on: Type instantiation is excessively deep and possibly infinite.
966
1033
  // eslint-disable-next-line @typescript-eslint/ban-ts-comment
967
1034
  // @ts-ignore
968
- return jsx(FormProvider, Object.assign({}, formMethods, {
1035
+ return /*#__PURE__*/jsx(FormProvider, Object.assign({}, formMethods, {
969
1036
  children: children
970
1037
  }));
971
1038
  };
@@ -973,9 +1040,9 @@ var ReactHookFormProviderWrapper = function ReactHookFormProviderWrapper(_ref2)
973
1040
  var children = _ref2.children,
974
1041
  _ref2$options = _ref2.options,
975
1042
  options = _ref2$options === void 0 ? defaultFormOptions : _ref2$options;
976
- return jsx(LocalizationProvider, {
1043
+ return /*#__PURE__*/jsx(LocalizationProvider, {
977
1044
  dateAdapter: AdapterDateFns,
978
- children: jsx(ReactHookFormProvider, {
1045
+ children: /*#__PURE__*/jsx(ReactHookFormProvider, {
979
1046
  options: options,
980
1047
  children: children
981
1048
  })
@@ -998,16 +1065,35 @@ var ReactHookFormHiddenInput = function ReactHookFormHiddenInput(_ref) {
998
1065
  defaultValue: defaultValue
999
1066
  }, defaultProps)),
1000
1067
  field = _useController.field;
1001
- return field.value !== null ? jsx("input", Object.assign({}, field, {
1068
+ return field.value !== null ? /*#__PURE__*/jsx("input", Object.assign({}, field, {
1002
1069
  type: "hidden"
1003
1070
  }, props)) : null;
1004
1071
  };
1005
1072
 
1073
+ /* *
1074
+ * Licensed under the Apache License, Version 2.0 (the "License");
1075
+ * you may not use this file except in compliance with the License.
1076
+ * You may obtain a copy of the License at
1077
+ *
1078
+ * http://www.apache.org/licenses/LICENSE-2.0
1079
+ *
1080
+ * Unless required by applicable law or agreed to in writing, software
1081
+ * distributed under the License is distributed on an "AS IS" BASIS,
1082
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
1083
+ * See the License for the specific language governing permissions and
1084
+ * limitations under the License.
1085
+ *
1086
+ * Copyright 2025 - Koninklijk Nederlands Meteorologisch Instituut (KNMI)
1087
+ * Copyright 2025 - Finnish Meteorological Institute (FMI)
1088
+ * Copyright 2025 - The Norwegian Meteorological Institute (MET Norway)
1089
+ * */
1090
+
1006
1091
  function decimalToDegreesMinutes(value) {
1007
1092
  var sign = value < 0 ? '-' : '';
1008
1093
  var abs = Math.abs(value);
1009
1094
  var degrees = Math.floor(abs);
1010
1095
  var minutes = Math.round((abs - degrees) * 60);
1096
+
1011
1097
  // normalize rounding overflow (e.g. 59.9 min → +1 degree)
1012
1098
  if (minutes === 60) {
1013
1099
  abs += 1;
@@ -1024,9 +1110,11 @@ function degreesMinutesToDecimal(input) {
1024
1110
  var _deg = parseInt(digits || '0', 10);
1025
1111
  return sign * _deg;
1026
1112
  }
1113
+
1027
1114
  // split into degrees + minutes
1028
1115
  var deg = parseInt(digits.slice(0, digits.length - 2), 10);
1029
1116
  var min = parseInt(digits.slice(-2), 10);
1117
+
1030
1118
  // normalize minutes overflow (e.g. 65 → 1°05′)
1031
1119
  var extraDeg = Math.floor(min / 60);
1032
1120
  min %= 60;
@@ -1052,7 +1140,7 @@ var DegreesMinutesField = function DegreesMinutesField(_ref) {
1052
1140
  var _useState2 = useState(false),
1053
1141
  isEditing = _useState2[0],
1054
1142
  setIsEditing = _useState2[1];
1055
- return jsx(Controller, {
1143
+ return /*#__PURE__*/jsx(Controller, {
1056
1144
  control: control,
1057
1145
  name: name,
1058
1146
  render: function render(_ref2) {
@@ -1070,6 +1158,7 @@ var DegreesMinutesField = function DegreesMinutesField(_ref) {
1070
1158
  var input = localInput.replace(/[^\d-]/g, '');
1071
1159
  var negative = input.startsWith('-');
1072
1160
  var digits = input.replace(/[^0-9]/g, '');
1161
+
1073
1162
  // Latitude: 4 digits (DDMM), Longitude: 5 (DDDMM)
1074
1163
  var maxLen = isLongitude ? 5 : 4;
1075
1164
  if (digits.length > maxLen) {
@@ -1094,7 +1183,7 @@ var DegreesMinutesField = function DegreesMinutesField(_ref) {
1094
1183
  } else {
1095
1184
  displayValue = '';
1096
1185
  }
1097
- return jsx(TextField, {
1186
+ return /*#__PURE__*/jsx(TextField, {
1098
1187
  disabled: disabled,
1099
1188
  error: !!fieldState.error,
1100
1189
  helperText: (_fieldState$error = fieldState.error) == null ? void 0 : _fieldState$error.message,
@@ -1128,7 +1217,23 @@ var DegreesMinutesField = function DegreesMinutesField(_ref) {
1128
1217
  });
1129
1218
  };
1130
1219
 
1131
- // hidden input helpers, should not be part of send formdata
1220
+ /* *
1221
+ * Licensed under the Apache License, Version 2.0 (the "License");
1222
+ * you may not use this file except in compliance with the License.
1223
+ * You may obtain a copy of the License at
1224
+ *
1225
+ * http://www.apache.org/licenses/LICENSE-2.0
1226
+ *
1227
+ * Unless required by applicable law or agreed to in writing, software
1228
+ * distributed under the License is distributed on an "AS IS" BASIS,
1229
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
1230
+ * See the License for the specific language governing permissions and
1231
+ * limitations under the License.
1232
+ *
1233
+ * Copyright 2021 - Koninklijk Nederlands Meteorologisch Instituut (KNMI)
1234
+ * Copyright 2021 - Finnish Meteorological Institute (FMI)
1235
+ * Copyright 2024 - The Norwegian Meteorological Institute (MET Norway)
1236
+ * */
1132
1237
  var HIDDEN_INPUT_HELPER_IS_DRAFT = 'IS_DRAFT';
1133
1238
  var useDraftFormHelpers = function useDraftFormHelpers(isDefaultDraft) {
1134
1239
  if (isDefaultDraft === void 0) {
@@ -1158,7 +1263,7 @@ var useDraftFormHelpers = function useDraftFormHelpers(isDefaultDraft) {
1158
1263
  });
1159
1264
  };
1160
1265
  var DraftFieldHelper = function DraftFieldHelper() {
1161
- return jsx("input", Object.assign({}, register(HIDDEN_INPUT_HELPER_IS_DRAFT), {
1266
+ return /*#__PURE__*/jsx("input", Object.assign({}, register(HIDDEN_INPUT_HELPER_IS_DRAFT), {
1162
1267
  type: "hidden"
1163
1268
  }));
1164
1269
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@opengeoweb/form-fields",
3
- "version": "15.3.0",
3
+ "version": "17.0.0",
4
4
  "description": "GeoWeb form-fields library for the opengeoweb project",
5
5
  "license": "Apache-2.0",
6
6
  "repository": {
@@ -8,11 +8,11 @@
8
8
  "url": "git@gitlab.com:opengeoweb/opengeoweb.git"
9
9
  },
10
10
  "dependencies": {
11
- "@opengeoweb/theme": "15.3.0",
11
+ "@opengeoweb/theme": "17.0.0",
12
12
  "react-hook-form": "^7.50.1",
13
13
  "@mui/x-date-pickers": "^8.11.2",
14
14
  "lodash": "^4.17.21",
15
- "@opengeoweb/shared": "15.3.0",
15
+ "@opengeoweb/shared": "17.0.0",
16
16
  "react-i18next": "^15.1.1",
17
17
  "@mui/material": "^7.0.1",
18
18
  "i18next": "^25.0.1",
@@ -24,7 +24,7 @@
24
24
  "@emotion/styled": "*"
25
25
  },
26
26
  "devDependencies": {
27
- "eslint-plugin-storybook": "9.0.17"
27
+ "eslint-plugin-storybook": "10.3.3"
28
28
  },
29
29
  "module": "./index.esm.js",
30
30
  "type": "module",
package/src/index.d.ts DELETED
@@ -1,5 +0,0 @@
1
- import formFieldsTranslations from '../locales/formFields.json';
2
- export * from './lib/components';
3
- export * from './lib/hooks/useDraftFormHelpers/useDraftFormHelpers';
4
- export { FORM_FIELDS_NAMESPACE } from './lib/utils/i18n';
5
- export { formFieldsTranslations };
@@ -1,15 +0,0 @@
1
- import type { TFunction } from 'i18next';
2
- import React from 'react';
3
- export declare function decimalToDegreesMinutes(value: number): string;
4
- export declare function degreesMinutesToDecimal(input: string | number): number;
5
- interface Props {
6
- name: string;
7
- label: string;
8
- disabled?: boolean;
9
- isReadOnly?: boolean;
10
- size?: 'small' | 'medium';
11
- isLongitude?: boolean;
12
- t: TFunction;
13
- }
14
- export declare const DegreesMinutesField: React.FC<Props>;
15
- export {};
@@ -1 +0,0 @@
1
- export {};
@@ -1,19 +0,0 @@
1
- import React from 'react';
2
- import type { UseFormProps } from 'react-hook-form';
3
- export declare const zeplinLinks: {
4
- name: string;
5
- link: string;
6
- }[];
7
- interface StoryLayoutProps {
8
- children?: React.ReactNode;
9
- }
10
- export declare const FormFieldsWrapper: React.FC<StoryLayoutProps & {
11
- options?: UseFormProps;
12
- }>;
13
- export declare const FormFieldsWrappeDecorator: React.FC<StoryLayoutProps & {
14
- isDarkTheme?: boolean;
15
- }>;
16
- export declare const FormFieldsI18nProvider: React.FC<{
17
- children?: React.ReactNode;
18
- }>;
19
- export {};
@@ -1 +0,0 @@
1
- export {};
@@ -1,24 +0,0 @@
1
- import type { SxProps, Theme } from '@mui/material';
2
- import type { DateTimePickerProps, DateTimePickerSlotProps } from '@mui/x-date-pickers';
3
- import React from 'react';
4
- import type { ReactHookFormInput } from './types';
5
- /**
6
- * Should return an isostring in the form "YYYY-MM-DDThh:mmZ";
7
- * The milli seconds section should not be included, strictly YYYY-MM-DDThh:mm:ssZ is important
8
- * @param value input Date
9
- * @returns iso string in YYYY-MM-DDThh:mm format.
10
- */
11
- export declare const getFormattedValueForDatePicker: (value: Date) => string | null;
12
- export declare const getDateValue: (value: string) => Date | null;
13
- type ReactHookKeyboardDateTimePickerProps = DateTimePickerProps & DateTimePickerSlotProps<false> & ReactHookFormInput<{
14
- defaultNullValue?: string | null;
15
- value?: string;
16
- onChange?: (value: Date | string | null) => void;
17
- format?: string;
18
- sx?: SxProps<Theme>;
19
- }> & {
20
- 'data-testid'?: string;
21
- shouldHideUTC?: boolean;
22
- };
23
- declare const ReactHookKeyboardDateTimePicker: React.FC<ReactHookKeyboardDateTimePickerProps>;
24
- export default ReactHookKeyboardDateTimePicker;
@@ -1 +0,0 @@
1
- export {};
@@ -1,9 +0,0 @@
1
- import type { Meta, StoryObj } from '@storybook/react-webpack5';
2
- import { ReactHookFormDateTime } from '.';
3
- type Story = StoryObj<typeof ReactHookFormDateTime>;
4
- declare const meta: Meta<typeof ReactHookFormDateTime>;
5
- export default meta;
6
- export declare const Component: Story;
7
- export declare const DateTime: Story;
8
- export declare const DateTimeLightTheme: Story;
9
- export declare const DateTimeDarkTheme: Story;
@@ -1,12 +0,0 @@
1
- import type { FormControlProps } from '@mui/material';
2
- import type { TFunction } from 'i18next';
3
- import React from 'react';
4
- import type { FieldErrors } from 'react-hook-form';
5
- interface ReactHookFormFormControlProps extends FormControlProps {
6
- children?: React.ReactNode;
7
- errors?: FieldErrors;
8
- isReadOnly?: boolean;
9
- }
10
- export declare const getErrorMessage: (t: TFunction, errors: FieldErrors) => string;
11
- declare const ReactHookFormFormControl: React.FC<ReactHookFormFormControlProps>;
12
- export default ReactHookFormFormControl;
@@ -1 +0,0 @@
1
- export {};
@@ -1,7 +0,0 @@
1
- import React from 'react';
2
- import type { ReactHookFormInput } from './types';
3
- type ReactHookFormHiddenInputProps = ReactHookFormInput<{
4
- defaultValue?: unknown;
5
- }>;
6
- declare const ReactHookFormHiddenInput: React.FC<ReactHookFormHiddenInputProps>;
7
- export default ReactHookFormHiddenInput;
@@ -1 +0,0 @@
1
- export {};
@@ -1,7 +0,0 @@
1
- import type { Meta, StoryObj } from '@storybook/react-webpack5';
2
- import { ReactHookFormHiddenInput } from '.';
3
- type Story = StoryObj<typeof ReactHookFormHiddenInput>;
4
- declare const meta: Meta<typeof ReactHookFormHiddenInput>;
5
- export default meta;
6
- export declare const HiddenInput: Story;
7
- export declare const HiddenInputDarkTheme: Story;
@@ -1,12 +0,0 @@
1
- import type { TextFieldProps } from '@mui/material';
2
- import React from 'react';
3
- import type { ReactHookFormInput } from './types';
4
- type InputMode = 'numeric' | 'decimal';
5
- export declare const convertNumericInputValue: (value: string, inputMode: InputMode) => number | null;
6
- export declare const getAllowedKeys: (inputMode?: InputMode) => string[];
7
- type ReactHookFormNumberFieldProps = Partial<TextFieldProps> & ReactHookFormInput<{
8
- inputMode?: InputMode;
9
- onBeforeChange?: () => void;
10
- }>;
11
- declare const ReactHookFormNumberField: React.FC<ReactHookFormNumberFieldProps>;
12
- export default ReactHookFormNumberField;
@@ -1 +0,0 @@
1
- export {};
@@ -1,9 +0,0 @@
1
- import type { Meta, StoryObj } from '@storybook/react-webpack5';
2
- import { ReactHookFormNumberField } from '.';
3
- type Story = StoryObj<typeof ReactHookFormNumberField>;
4
- declare const meta: Meta<typeof ReactHookFormNumberField>;
5
- export default meta;
6
- export declare const Component: Story;
7
- export declare const NumberField: Story;
8
- export declare const NumberFieldLightTheme: Story;
9
- export declare const NumberFieldDarkTheme: Story;
@@ -1,9 +0,0 @@
1
- import React from 'react';
2
- import type { UseFormProps } from 'react-hook-form';
3
- interface WrapperProps {
4
- children: React.ReactNode;
5
- options?: UseFormProps;
6
- }
7
- export declare const defaultFormOptions: UseFormProps;
8
- declare const ReactHookFormProviderWrapper: React.FC<WrapperProps>;
9
- export default ReactHookFormProviderWrapper;
@@ -1,9 +0,0 @@
1
- import type { Meta, StoryObj } from '@storybook/react-webpack5';
2
- import { ReactHookFormDateTime } from '.';
3
- import { FormFieldsWrapper } from './Providers';
4
- type Story = StoryObj<typeof FormFieldsWrapper>;
5
- declare const meta: Meta<typeof ReactHookFormDateTime>;
6
- export default meta;
7
- export declare const FormProvider: Story;
8
- export declare const FormProviderLightTheme: Story;
9
- export declare const FormProviderDarkTheme: Story;
@@ -1,9 +0,0 @@
1
- import type { RadioGroupProps } from '@mui/material';
2
- import React from 'react';
3
- import type { ReactHookFormInput } from './types';
4
- type ReactHookFormRadioGroupProps = Partial<RadioGroupProps> & ReactHookFormInput<{
5
- disabled?: boolean;
6
- children?: React.ReactNode;
7
- }>;
8
- declare const ReactHookFormRadioGroup: React.FC<ReactHookFormRadioGroupProps>;
9
- export default ReactHookFormRadioGroup;
@@ -1 +0,0 @@
1
- export {};
@@ -1,10 +0,0 @@
1
- import type { Meta, StoryObj } from '@storybook/react-webpack5';
2
- import { ReactHookFormRadioGroup } from '.';
3
- type Story = StoryObj<typeof ReactHookFormRadioGroup>;
4
- declare const meta: Meta<typeof ReactHookFormRadioGroup>;
5
- export default meta;
6
- export declare const Component: Story;
7
- export declare const RadioGroup: Story;
8
- export declare const RadioGroupLightTheme: Story;
9
- export declare const RadioGroupDarkTheme: Story;
10
- export declare const RadioGroupDarkThemeStory: Story;
@@ -1,8 +0,0 @@
1
- import type { SelectProps } from '@mui/material';
2
- import React from 'react';
3
- import type { ReactHookFormInput } from './types';
4
- type ReactHookFormSelectProps = Partial<SelectProps> & ReactHookFormInput<{
5
- onBeforeChange?: () => void;
6
- }>;
7
- declare const ReactHookFormSelect: React.FC<ReactHookFormSelectProps>;
8
- export default ReactHookFormSelect;
@@ -1 +0,0 @@
1
- export {};
@@ -1,9 +0,0 @@
1
- import type { Meta, StoryObj } from '@storybook/react-webpack5';
2
- import { ReactHookFormSelect } from '.';
3
- type Story = StoryObj<typeof ReactHookFormSelect>;
4
- declare const meta: Meta<typeof ReactHookFormSelect>;
5
- export default meta;
6
- export declare const Component: Story;
7
- export declare const Select: Story;
8
- export declare const SelectLightTheme: Story;
9
- export declare const SelectDarkTheme: Story;
@@ -1,10 +0,0 @@
1
- import type { BaseTextFieldProps, FilledInputProps, SlotCommonProps, SlotProps, TextFieldProps } from '@mui/material';
2
- import React from 'react';
3
- import type { ReactHookFormInput } from './types';
4
- export declare const convertTextInputValue: (value: string, inCapitals: boolean) => number | string;
5
- type ReactHookFormTextFieldProps = Partial<TextFieldProps> & ReactHookFormInput<{
6
- upperCase?: boolean;
7
- inputSlotProps?: SlotProps<React.ElementType<FilledInputProps, keyof React.JSX.IntrinsicElements>, SlotCommonProps, BaseTextFieldProps> | undefined;
8
- }>;
9
- declare const ReactHookFormTextField: React.FC<ReactHookFormTextFieldProps>;
10
- export default ReactHookFormTextField;
@@ -1 +0,0 @@
1
- export {};
@@ -1,9 +0,0 @@
1
- import type { Meta, StoryObj } from '@storybook/react-webpack5';
2
- import { ReactHookFormTextField } from '.';
3
- type Story = StoryObj<typeof ReactHookFormTextField>;
4
- declare const meta: Meta<typeof ReactHookFormTextField>;
5
- export default meta;
6
- export declare const Component: Story;
7
- export declare const TextField: Story;
8
- export declare const TextFieldLightTheme: Story;
9
- export declare const TextFieldDarkTheme: Story;
@@ -1,3 +0,0 @@
1
- import type { FieldErrors } from 'react-hook-form';
2
- export declare function getDeepProperty<I>(property: string[], state: I): I | null;
3
- export declare const getErrors: (name: string, errors: FieldErrors) => FieldErrors | undefined;
@@ -1 +0,0 @@
1
- export {};
@@ -1,13 +0,0 @@
1
- export { default as ReactHookFormSelect } from './ReactHookFormSelect';
2
- export { default as ReactHookFormRadioGroup } from './ReactHookFormRadioGroup';
3
- export { default as ReactHookFormTextField } from './ReactHookFormTextField';
4
- export { default as ReactHookFormNumberField } from './ReactHookFormNumberField';
5
- export { default as ReactHookFormFormControl } from './ReactHookFormFormControl';
6
- export { default as ReactHookFormDateTime } from './ReactHookFormDateTime';
7
- export * from './ReactHookFormDateTime';
8
- export { default as ReactHookFormProvider } from './ReactHookFormProvider';
9
- export { default as ReactHookFormHiddenInput } from './ReactHookFormHiddenInput';
10
- export { DegreesMinutesField } from './DegreesMinutesField';
11
- export { defaultFormOptions } from './ReactHookFormProvider';
12
- export { errorMessages, isMaximumOneDrawing, hasValidGeometry, isGeometryDirty, isValidGeoJsonCoordinates, hasIntersectionWithFIR, countIntersectionPoints, isValidMax, isValidMin, isInteger, hasMulitpleIntersections, isLatitude, isLongitude, isNonOrBothCoordinates, isEmpty, isXHoursAfter, isXHoursBefore, } from './utils';
13
- export { getDeepProperty } from './formUtils';
@@ -1,8 +0,0 @@
1
- import type { RegisterOptions } from 'react-hook-form';
2
- export type ReactHookFormInput<T> = T & {
3
- name: string;
4
- label?: string;
5
- rules?: RegisterOptions;
6
- helperText?: string;
7
- isReadOnly?: boolean;
8
- };
@@ -1,37 +0,0 @@
1
- import type { Polygon } from 'geojson';
2
- export declare const defaultProps: {
3
- shouldUnregister: boolean;
4
- };
5
- export declare const errorMessages: {
6
- required: string;
7
- isValidDate: string;
8
- isAfter: string;
9
- isXHoursBefore: string;
10
- isXHoursAfter: string;
11
- isBefore: string;
12
- minLevel: string;
13
- isLatitude: string;
14
- isLongitude: string;
15
- isValidMax: string;
16
- isLevelLower: string;
17
- isNonOrBothCoordinates: string;
18
- isInteger: string;
19
- isNumeric: string;
20
- };
21
- export declare const isEmpty: (value?: number | string | null) => boolean;
22
- export declare const isXHoursBefore: (ownDate: string, otherDate: string, hours?: number) => boolean;
23
- export declare const isXHoursAfter: (ownDate: string, otherDate: string, hours?: number) => boolean;
24
- export declare const isLatitude: (lat?: number | null) => boolean;
25
- export declare const isLongitude: (lng?: number | null) => boolean;
26
- export declare const isValidMax: (value: number, maxValue: number | null) => boolean;
27
- export declare const isValidMin: (value: number, minValue: number | null) => boolean;
28
- export declare const hasValidGeometry: (geojson?: GeoJSON.FeatureCollection | null) => boolean;
29
- export declare const isValidGeoJsonCoordinates: (geojson: GeoJSON.FeatureCollection) => boolean;
30
- export declare const isMaximumOneDrawing: (geojson: GeoJSON.FeatureCollection) => boolean;
31
- export declare const hasIntersectionWithFIR: (geojson: GeoJSON.FeatureCollection, intersection: GeoJSON.FeatureCollection) => boolean;
32
- export declare const hasMulitpleIntersections: (geojson: GeoJSON.FeatureCollection) => boolean;
33
- export declare const countIntersectionPoints: (geojson: GeoJSON.FeatureCollection<Polygon>, intersection: GeoJSON.FeatureCollection<Polygon>) => number;
34
- export declare const isGeometryDirty: (geoJSON?: GeoJSON.FeatureCollection | null, formGeoJSON?: GeoJSON.FeatureCollection | null) => boolean;
35
- export declare const isInteger: (value: number) => boolean;
36
- export declare const isNumeric: (value: any) => boolean;
37
- export declare const isNonOrBothCoordinates: (coordinate?: number | null, otherCoordinate?: number | null) => boolean;
@@ -1 +0,0 @@
1
- export {};
@@ -1,8 +0,0 @@
1
- import React from 'react';
2
- export declare const HIDDEN_INPUT_HELPER_IS_DRAFT = "IS_DRAFT";
3
- export declare const useDraftFormHelpers: (isDefaultDraft?: boolean) => {
4
- isRequired: (value: string) => boolean | string;
5
- toggleIsDraft: (isDraft: boolean) => void;
6
- isDraft: () => boolean;
7
- DraftFieldHelper: () => React.ReactElement;
8
- };
@@ -1,7 +0,0 @@
1
- import i18n from 'i18next';
2
- import type { UseTranslationResponse } from 'react-i18next';
3
- export declare const FORM_FIELDS_NAMESPACE = "form-fields";
4
- export declare const initFormFieldsI18n: () => void;
5
- export declare const translateInTestsAndStories: (key: string, params?: Record<string, string | number> | undefined) => string;
6
- export declare const useFormFieldsTranslation: () => UseTranslationResponse<typeof FORM_FIELDS_NAMESPACE, typeof i18n>;
7
- export { i18n };