@reykjavik/hanna-react 0.10.141 → 0.10.143

package/CHANGELOG.md

@@ -4,6 +4,21 @@
 
 - ... <!-- Add new lines here. -->
 
+## 0.10.143
+
+_2024-12-06_
++
+- `Datepicker:`
+  - fix: Timezone mismatch in `isoMode` (emitted UTC-based dates, not local)
+
+## 0.10.142
+
+_2024-11-28_
+
+- feat: Deprecate `focus-visible` polyfill module; browser support is now good
+- `Datepicker`:
+  - fix: Set `minDate` prop values to `T00:00` to allow manual min date input
+
 ## 0.10.141
 
 _2024-11-25_

package/Datepicker.js

@@ -108,6 +108,13 @@ const defaultDatepickerTexts = {
         ],
     },
 };
+const toLocalIsoDate = (date) => {
+    if (!date) {
+        return undefined;
+    }
+    const localDate = new Date(date.getTime() - date.getTimezoneOffset() * 60000);
+    return localDate.toISOString().split('T')[0];
+};
 /**
  * A compo
  *
@@ -116,6 +123,8 @@ const defaultDatepickerTexts = {
 const Datepicker = (props) => {
     const { placeholder, dateFormat, name, startDate, endDate, minDate, maxDate, isStartDate = false, isEndDate = false, onChange, datepickerExtraProps, inputRef, isoMode, texts, lang = props.localeCode, // eslint-disable-line deprecation/deprecation
     fieldWrapperProps, } = (0, FormField_js_1.groupFormFieldWrapperProps)(props);
+    // Make sure all minDates are at the start of the day
+    const minDateNormalized = minDate ? new Date(minDate.setHours(0, 0, 0, 0)) : undefined;
     const [value, setValue] = utils_js_1.useMixedControlState.raw(props.value || props.initialDate, // eslint-disable-line deprecation/deprecation
     props.defaultValue, 'value');
     /*
@@ -152,7 +161,7 @@ const Datepicker = (props) => {
                             (elm === null || elm === void 0 ? void 0 : elm.querySelector('input')) || undefined;
                         return elm;
                     }) }, addFocusProps()),
-                isoMode && (react_1.default.createElement("input", { type: "hidden", name: name, value: value === null || value === void 0 ? void 0 : value.toISOString().slice(0, 10) })),
+                isoMode && react_1.default.createElement("input", { type: "hidden", name: name, value: toLocalIsoDate(value) }),
                 react_1.default.createElement(ReactDatepicker_js_1.ReactDatePicker, Object.assign({ required: inputProps.required, disabled: inputProps.disabled, readOnly: inputProps.readOnly, selected: value, name: isoMode ? undefined : name, locale: lang || i18n_1.DEFAULT_LANG, dateFormat: normalizedDateFormats, onChange: (date) => {
                         date = date || undefined;
                         setValue(date);
@@ -164,7 +173,7 @@ const Datepicker = (props) => {
                     }, placeholderText: placeholder, 
                     // TODO: Implement this
                     // selectsRange
-                    minDate: minDate, maxDate: maxDate, startDate: startDate, endDate: endDate, selectsStart: isStartDate, selectsEnd: isEndDate, formatWeekDay: (weekday) => weekday.charAt(0).toUpperCase(), showYearDropdown: true, scrollableYearDropdown: true, yearDropdownItemNumber: 15, showMonthDropdown: true }, inputProps, txts, datepickerExtraProps))));
+                    minDate: minDateNormalized, maxDate: maxDate, startDate: startDate, endDate: endDate, selectsStart: isStartDate, selectsEnd: isEndDate, formatWeekDay: (weekday) => weekday.charAt(0).toUpperCase(), showYearDropdown: true, scrollableYearDropdown: true, yearDropdownItemNumber: 15, showMonthDropdown: true }, inputProps, txts, datepickerExtraProps))));
         } })));
 };
 exports.Datepicker = Datepicker;

package/esm/Datepicker.js

@@ -103,6 +103,13 @@ const defaultDatepickerTexts = {
         ],
     },
 };
+const toLocalIsoDate = (date) => {
+    if (!date) {
+        return undefined;
+    }
+    const localDate = new Date(date.getTime() - date.getTimezoneOffset() * 60000);
+    return localDate.toISOString().split('T')[0];
+};
 /**
  * A compo
  *
@@ -111,6 +118,8 @@ const defaultDatepickerTexts = {
 export const Datepicker = (props) => {
     const { placeholder, dateFormat, name, startDate, endDate, minDate, maxDate, isStartDate = false, isEndDate = false, onChange, datepickerExtraProps, inputRef, isoMode, texts, lang = props.localeCode, // eslint-disable-line deprecation/deprecation
     fieldWrapperProps, } = groupFormFieldWrapperProps(props);
+    // Make sure all minDates are at the start of the day
+    const minDateNormalized = minDate ? new Date(minDate.setHours(0, 0, 0, 0)) : undefined;
     const [value, setValue] = useMixedControlState.raw(props.value || props.initialDate, // eslint-disable-line deprecation/deprecation
     props.defaultValue, 'value');
     /*
@@ -147,7 +156,7 @@ export const Datepicker = (props) => {
                             (elm === null || elm === void 0 ? void 0 : elm.querySelector('input')) || undefined;
                         return elm;
                     }) }, addFocusProps()),
-                isoMode && (React.createElement("input", { type: "hidden", name: name, value: value === null || value === void 0 ? void 0 : value.toISOString().slice(0, 10) })),
+                isoMode && React.createElement("input", { type: "hidden", name: name, value: toLocalIsoDate(value) }),
                 React.createElement(ReactDatePicker, Object.assign({ required: inputProps.required, disabled: inputProps.disabled, readOnly: inputProps.readOnly, selected: value, name: isoMode ? undefined : name, locale: lang || DEFAULT_LANG, dateFormat: normalizedDateFormats, onChange: (date) => {
                         date = date || undefined;
                         setValue(date);
@@ -159,7 +168,7 @@ export const Datepicker = (props) => {
                     }, placeholderText: placeholder, 
                     // TODO: Implement this
                     // selectsRange
-                    minDate: minDate, maxDate: maxDate, startDate: startDate, endDate: endDate, selectsStart: isStartDate, selectsEnd: isEndDate, formatWeekDay: (weekday) => weekday.charAt(0).toUpperCase(), showYearDropdown: true, scrollableYearDropdown: true, yearDropdownItemNumber: 15, showMonthDropdown: true }, inputProps, txts, datepickerExtraProps))));
+                    minDate: minDateNormalized, maxDate: maxDate, startDate: startDate, endDate: endDate, selectsStart: isStartDate, selectsEnd: isEndDate, formatWeekDay: (weekday) => weekday.charAt(0).toUpperCase(), showYearDropdown: true, scrollableYearDropdown: true, yearDropdownItemNumber: 15, showMonthDropdown: true }, inputProps, txts, datepickerExtraProps))));
         } })));
 };
 export default Datepicker;

package/esm/focus-visible.js

@@ -1,3 +1,11 @@
 // expose `focus-visible` to consumers of `@reykjavik/hanna-react`
 // without requiring them to install it as a dependency in their project.
 import '@reykjavik/hanna-utils/focus-visible';
+/** @deprecated  This polyfill is not needed anymore  (Will be removed in v0.11) */
+if (process.env.NODE_ENV !== 'production') {
+    console.warn('Deprecation Warning:\n' +
+        'The `focus-visible` polyfill isn not needed anymore as browser support ' +
+        '  is now widespread. You can safely remove all imports of the ' +
+        '`@reykjavik/hanna-react/focus-visible` module from your project..\n' +
+        '(This module will be removed in v0.11 of `@reykjavik/hanna-react`)');
+}

package/focus-visible.js

@@ -3,3 +3,11 @@ Object.defineProperty(exports, "__esModule", { value: true });
 // expose `focus-visible` to consumers of `@reykjavik/hanna-react`
 // without requiring them to install it as a dependency in their project.
 require("@reykjavik/hanna-utils/focus-visible");
+/** @deprecated  This polyfill is not needed anymore  (Will be removed in v0.11) */
+if (process.env.NODE_ENV !== 'production') {
+    console.warn('Deprecation Warning:\n' +
+        'The `focus-visible` polyfill isn not needed anymore as browser support ' +
+        '  is now widespread. You can safely remove all imports of the ' +
+        '`@reykjavik/hanna-react/focus-visible` module from your project..\n' +
+        '(This module will be removed in v0.11 of `@reykjavik/hanna-react`)');
+}

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@reykjavik/hanna-react",
-	"version": "0.10.141",
+	"version": "0.10.143",
 	"author": "Reykjavík (http://www.reykjavik.is)",
 	"contributors": [
 		"Hugsmiðjan ehf (http://www.hugsmidjan.is)",