@contentful/field-editor-date 2.0.11 → 2.0.12

package/dist/cjs/TimepickerInput.js

@@ -56,6 +56,7 @@ function _interop_require_wildcard(obj, nodeInterop) {
 const validInputFormats = [
     'hh:mm a',
     'h:mm a',
+    'HH:mm',
     'hh:mm',
     'kk:mm',
     'k:mm',
@@ -98,8 +99,9 @@ const TimepickerInput = ({ disabled, uses12hClock, time = '12:00', ampm = 'AM',
         const parsedTime = parseRawInput(selectedTime);
         const value = parsedTime ?? getDefaultTime();
         setSelectedTime(formatToString(uses12hClock, value));
+        const timeStr = uses12hClock ? (0, _datefns.format)(value, 'hh:mm') : (0, _datefns.format)(value, 'HH:mm');
         onChange({
-            time: (0, _datefns.format)(value, 'hh:mm'),
+            time: timeStr,
             ampm: (0, _datefns.format)(value, 'a').toUpperCase()
         });
     }, [

package/dist/cjs/TimepickerInput.spec.js

@@ -5,7 +5,13 @@ Object.defineProperty(exports, "__esModule", {
 const _react = /*#__PURE__*/ _interop_require_wildcard(require("react"));
 require("@testing-library/jest-dom/extend-expect");
 const _react1 = require("@testing-library/react");
+const _userevent = /*#__PURE__*/ _interop_require_default(require("@testing-library/user-event"));
 const _TimepickerInput = require("./TimepickerInput");
+function _interop_require_default(obj) {
+    return obj && obj.__esModule ? obj : {
+        default: obj
+    };
+}
 function _getRequireWildcardCache(nodeInterop) {
     if (typeof WeakMap !== "function") return null;
     var cacheBabelInterop = new WeakMap();
@@ -72,4 +78,127 @@ describe('TimepickerInput', ()=>{
         }));
         expect(getByTestId('time-input')).toHaveValue('23:00');
     });
+    describe('onChange on blur — 24h mode', ()=>{
+        it('emits 19:00 (not 07:00) when user types 19:00 in 24h mode', ()=>{
+            const onChange = jest.fn();
+            const { getByTestId } = (0, _react1.render)(/*#__PURE__*/ _react.createElement(_TimepickerInput.TimepickerInput, {
+                disabled: false,
+                uses12hClock: false,
+                time: "19:00",
+                ampm: "PM",
+                onChange: onChange
+            }));
+            _userevent.default.clear(getByTestId('time-input'));
+            _userevent.default.type(getByTestId('time-input'), '19:00');
+            _userevent.default.tab();
+            expect(onChange).toHaveBeenCalledWith({
+                time: '19:00',
+                ampm: 'PM'
+            });
+        });
+        it('emits 23:59 (not 11:59) when user types 23:59 in 24h mode', ()=>{
+            const onChange = jest.fn();
+            const { getByTestId } = (0, _react1.render)(/*#__PURE__*/ _react.createElement(_TimepickerInput.TimepickerInput, {
+                disabled: false,
+                uses12hClock: false,
+                time: "23:59",
+                ampm: "PM",
+                onChange: onChange
+            }));
+            _userevent.default.clear(getByTestId('time-input'));
+            _userevent.default.type(getByTestId('time-input'), '23:59');
+            _userevent.default.tab();
+            expect(onChange).toHaveBeenCalledWith({
+                time: '23:59',
+                ampm: 'PM'
+            });
+        });
+        it('emits 00:00 when user types 00:00 in 24h mode', ()=>{
+            const onChange = jest.fn();
+            const { getByTestId } = (0, _react1.render)(/*#__PURE__*/ _react.createElement(_TimepickerInput.TimepickerInput, {
+                disabled: false,
+                uses12hClock: false,
+                time: "00:00",
+                ampm: "AM",
+                onChange: onChange
+            }));
+            _userevent.default.clear(getByTestId('time-input'));
+            _userevent.default.type(getByTestId('time-input'), '00:00');
+            _userevent.default.tab();
+            expect(onChange).toHaveBeenCalledWith({
+                time: '00:00',
+                ampm: 'AM'
+            });
+        });
+        it('emits 12:00 (noon) correctly in 24h mode', ()=>{
+            const onChange = jest.fn();
+            const { getByTestId } = (0, _react1.render)(/*#__PURE__*/ _react.createElement(_TimepickerInput.TimepickerInput, {
+                disabled: false,
+                uses12hClock: false,
+                time: "12:00",
+                ampm: "PM",
+                onChange: onChange
+            }));
+            _userevent.default.clear(getByTestId('time-input'));
+            _userevent.default.type(getByTestId('time-input'), '12:00');
+            _userevent.default.tab();
+            expect(onChange).toHaveBeenCalledWith({
+                time: '12:00',
+                ampm: 'PM'
+            });
+        });
+        it('emits 13:00 (not 01:00) when user types 13:00 in 24h mode', ()=>{
+            const onChange = jest.fn();
+            const { getByTestId } = (0, _react1.render)(/*#__PURE__*/ _react.createElement(_TimepickerInput.TimepickerInput, {
+                disabled: false,
+                uses12hClock: false,
+                time: "13:00",
+                ampm: "PM",
+                onChange: onChange
+            }));
+            _userevent.default.clear(getByTestId('time-input'));
+            _userevent.default.type(getByTestId('time-input'), '13:00');
+            _userevent.default.tab();
+            expect(onChange).toHaveBeenCalledWith({
+                time: '13:00',
+                ampm: 'PM'
+            });
+        });
+    });
+    describe('onChange on blur — 12h mode', ()=>{
+        it('emits 07:00 AM correctly in 12h mode', ()=>{
+            const onChange = jest.fn();
+            const { getByTestId } = (0, _react1.render)(/*#__PURE__*/ _react.createElement(_TimepickerInput.TimepickerInput, {
+                disabled: false,
+                uses12hClock: true,
+                time: "07:00",
+                ampm: "AM",
+                onChange: onChange
+            }));
+            _userevent.default.clear(getByTestId('time-input'));
+            _userevent.default.type(getByTestId('time-input'), '07:00 AM');
+            _userevent.default.tab();
+            expect(onChange).toHaveBeenCalledWith({
+                time: '07:00',
+                ampm: 'AM'
+            });
+        });
+        it('emits 07:00 PM correctly in 12h mode', ()=>{
+            const onChange = jest.fn();
+            const { getByTestId } = (0, _react1.render)(/*#__PURE__*/ _react.createElement(_TimepickerInput.TimepickerInput, {
+                disabled: false,
+                uses12hClock: true,
+                time: "07:00",
+                ampm: "PM",
+                onChange: onChange
+            }));
+            _userevent.default.clear(getByTestId('time-input'));
+            _userevent.default.type(getByTestId('time-input'), '07:00 PM');
+            _userevent.default.tab();
+            expect(onChange).toHaveBeenCalledWith({
+                time: '07:00',
+                ampm: 'PM'
+            });
+        });
+    });
 });

package/dist/cjs/utils/data.spec.js

@@ -380,4 +380,42 @@ describe('date utils', ()=>{
             expect((0, _date.getDefaultAMPM)()).toBe('AM');
         });
     });
+    describe('buildFieldValue — date does not shift due to timezone offset', ()=>{
+        it('April 27 23:00-02:00 round-trips as April 27 (UTC would parse as April 28 01:00Z)', ()=>{
+            const result = (0, _date.userInputFromDatetime)({
+                value: '2026-04-27T23:00-02:00',
+                uses12hClock: false
+            });
+            const built = (0, _date.buildFieldValue)({
+                data: result,
+                usesTime: true,
+                usesTimezone: true
+            });
+            expect(built.valid).toBe('2026-04-27T23:00-02:00');
+        });
+        it('April 28 01:00+02:00 round-trips as April 28 (UTC would parse as April 27 23:00Z)', ()=>{
+            const result = (0, _date.userInputFromDatetime)({
+                value: '2026-04-28T01:00+02:00',
+                uses12hClock: false
+            });
+            const built = (0, _date.buildFieldValue)({
+                data: result,
+                usesTime: true,
+                usesTimezone: true
+            });
+            expect(built.valid).toBe('2026-04-28T01:00+02:00');
+        });
+        it('preserves date for 23:59-01:00 (UTC: April 28 00:59Z → would show as April 28)', ()=>{
+            const result = (0, _date.userInputFromDatetime)({
+                value: '2026-06-15T23:59-01:00',
+                uses12hClock: false
+            });
+            const built = (0, _date.buildFieldValue)({
+                data: result,
+                usesTime: true,
+                usesTimezone: true
+            });
+            expect(built.valid).toBe('2026-06-15T23:59-01:00');
+        });
+    });
 });

package/dist/cjs/utils/date.js

@@ -33,10 +33,8 @@ function parseUtcOffset(datetimeString) {
     return match[1] === 'Z' ? '+00:00' : match[1];
 }
 function fieldValueToDate(datetimeString) {
-    if (!datetimeString) {
-        return null;
-    }
-    const date = (0, _datefns.parseISO)(datetimeString);
+    if (!datetimeString) return null;
+    const date = (0, _datefns.parse)(datetimeString.slice(0, 10), 'yyyy-MM-dd', new Date(0));
     return (0, _datefns.isValid)(date) ? date : null;
 }
 function timeFromUserInput(input) {

package/dist/esm/TimepickerInput.js

@@ -5,6 +5,7 @@ import { parse, format, isValid } from 'date-fns';
 const validInputFormats = [
     'hh:mm a',
     'h:mm a',
+    'HH:mm',
     'hh:mm',
     'kk:mm',
     'k:mm',
@@ -47,8 +48,9 @@ export const TimepickerInput = ({ disabled, uses12hClock, time = '12:00', ampm =
         const parsedTime = parseRawInput(selectedTime);
         const value = parsedTime ?? getDefaultTime();
         setSelectedTime(formatToString(uses12hClock, value));
+        const timeStr = uses12hClock ? format(value, 'hh:mm') : format(value, 'HH:mm');
         onChange({
-            time: format(value, 'hh:mm'),
+            time: timeStr,
             ampm: format(value, 'a').toUpperCase()
         });
     }, [

package/dist/esm/TimepickerInput.spec.js

@@ -1,6 +1,7 @@
 import * as React from 'react';
 import '@testing-library/jest-dom/extend-expect';
 import { cleanup, configure, render } from '@testing-library/react';
+import userEvent from '@testing-library/user-event';
 import { TimepickerInput } from './TimepickerInput';
 configure({
     testIdAttribute: 'data-test-id'
@@ -27,4 +28,127 @@ describe('TimepickerInput', ()=>{
         }));
         expect(getByTestId('time-input')).toHaveValue('23:00');
     });
+    describe('onChange on blur — 24h mode', ()=>{
+        it('emits 19:00 (not 07:00) when user types 19:00 in 24h mode', ()=>{
+            const onChange = jest.fn();
+            const { getByTestId } = render(/*#__PURE__*/ React.createElement(TimepickerInput, {
+                disabled: false,
+                uses12hClock: false,
+                time: "19:00",
+                ampm: "PM",
+                onChange: onChange
+            }));
+            userEvent.clear(getByTestId('time-input'));
+            userEvent.type(getByTestId('time-input'), '19:00');
+            userEvent.tab();
+            expect(onChange).toHaveBeenCalledWith({
+                time: '19:00',
+                ampm: 'PM'
+            });
+        });
+        it('emits 23:59 (not 11:59) when user types 23:59 in 24h mode', ()=>{
+            const onChange = jest.fn();
+            const { getByTestId } = render(/*#__PURE__*/ React.createElement(TimepickerInput, {
+                disabled: false,
+                uses12hClock: false,
+                time: "23:59",
+                ampm: "PM",
+                onChange: onChange
+            }));
+            userEvent.clear(getByTestId('time-input'));
+            userEvent.type(getByTestId('time-input'), '23:59');
+            userEvent.tab();
+            expect(onChange).toHaveBeenCalledWith({
+                time: '23:59',
+                ampm: 'PM'
+            });
+        });
+        it('emits 00:00 when user types 00:00 in 24h mode', ()=>{
+            const onChange = jest.fn();
+            const { getByTestId } = render(/*#__PURE__*/ React.createElement(TimepickerInput, {
+                disabled: false,
+                uses12hClock: false,
+                time: "00:00",
+                ampm: "AM",
+                onChange: onChange
+            }));
+            userEvent.clear(getByTestId('time-input'));
+            userEvent.type(getByTestId('time-input'), '00:00');
+            userEvent.tab();
+            expect(onChange).toHaveBeenCalledWith({
+                time: '00:00',
+                ampm: 'AM'
+            });
+        });
+        it('emits 12:00 (noon) correctly in 24h mode', ()=>{
+            const onChange = jest.fn();
+            const { getByTestId } = render(/*#__PURE__*/ React.createElement(TimepickerInput, {
+                disabled: false,
+                uses12hClock: false,
+                time: "12:00",
+                ampm: "PM",
+                onChange: onChange
+            }));
+            userEvent.clear(getByTestId('time-input'));
+            userEvent.type(getByTestId('time-input'), '12:00');
+            userEvent.tab();
+            expect(onChange).toHaveBeenCalledWith({
+                time: '12:00',
+                ampm: 'PM'
+            });
+        });
+        it('emits 13:00 (not 01:00) when user types 13:00 in 24h mode', ()=>{
+            const onChange = jest.fn();
+            const { getByTestId } = render(/*#__PURE__*/ React.createElement(TimepickerInput, {
+                disabled: false,
+                uses12hClock: false,
+                time: "13:00",
+                ampm: "PM",
+                onChange: onChange
+            }));
+            userEvent.clear(getByTestId('time-input'));
+            userEvent.type(getByTestId('time-input'), '13:00');
+            userEvent.tab();
+            expect(onChange).toHaveBeenCalledWith({
+                time: '13:00',
+                ampm: 'PM'
+            });
+        });
+    });
+    describe('onChange on blur — 12h mode', ()=>{
+        it('emits 07:00 AM correctly in 12h mode', ()=>{
+            const onChange = jest.fn();
+            const { getByTestId } = render(/*#__PURE__*/ React.createElement(TimepickerInput, {
+                disabled: false,
+                uses12hClock: true,
+                time: "07:00",
+                ampm: "AM",
+                onChange: onChange
+            }));
+            userEvent.clear(getByTestId('time-input'));
+            userEvent.type(getByTestId('time-input'), '07:00 AM');
+            userEvent.tab();
+            expect(onChange).toHaveBeenCalledWith({
+                time: '07:00',
+                ampm: 'AM'
+            });
+        });
+        it('emits 07:00 PM correctly in 12h mode', ()=>{
+            const onChange = jest.fn();
+            const { getByTestId } = render(/*#__PURE__*/ React.createElement(TimepickerInput, {
+                disabled: false,
+                uses12hClock: true,
+                time: "07:00",
+                ampm: "PM",
+                onChange: onChange
+            }));
+            userEvent.clear(getByTestId('time-input'));
+            userEvent.type(getByTestId('time-input'), '07:00 PM');
+            userEvent.tab();
+            expect(onChange).toHaveBeenCalledWith({
+                time: '07:00',
+                ampm: 'PM'
+            });
+        });
+    });
 });

package/dist/esm/utils/data.spec.js

@@ -376,4 +376,42 @@ describe('date utils', ()=>{
             expect(getDefaultAMPM()).toBe('AM');
         });
     });
+    describe('buildFieldValue — date does not shift due to timezone offset', ()=>{
+        it('April 27 23:00-02:00 round-trips as April 27 (UTC would parse as April 28 01:00Z)', ()=>{
+            const result = userInputFromDatetime({
+                value: '2026-04-27T23:00-02:00',
+                uses12hClock: false
+            });
+            const built = buildFieldValue({
+                data: result,
+                usesTime: true,
+                usesTimezone: true
+            });
+            expect(built.valid).toBe('2026-04-27T23:00-02:00');
+        });
+        it('April 28 01:00+02:00 round-trips as April 28 (UTC would parse as April 27 23:00Z)', ()=>{
+            const result = userInputFromDatetime({
+                value: '2026-04-28T01:00+02:00',
+                uses12hClock: false
+            });
+            const built = buildFieldValue({
+                data: result,
+                usesTime: true,
+                usesTimezone: true
+            });
+            expect(built.valid).toBe('2026-04-28T01:00+02:00');
+        });
+        it('preserves date for 23:59-01:00 (UTC: April 28 00:59Z → would show as April 28)', ()=>{
+            const result = userInputFromDatetime({
+                value: '2026-06-15T23:59-01:00',
+                uses12hClock: false
+            });
+            const built = buildFieldValue({
+                data: result,
+                usesTime: true,
+                usesTimezone: true
+            });
+            expect(built.valid).toBe('2026-06-15T23:59-01:00');
+        });
+    });
 });

package/dist/esm/utils/date.js

@@ -1,4 +1,4 @@
-import { format, getHours, getMinutes, isValid, parse, parseISO, set } from 'date-fns';
+import { format, getHours, getMinutes, isValid, parse, set } from 'date-fns';
 const ZONE_RX = /(Z|[+-]\d{2}[:+]?\d{2})$/;
 function startOfTodayOffset() {
     return format(new Date(), 'xxx');
@@ -9,10 +9,8 @@ function parseUtcOffset(datetimeString) {
     return match[1] === 'Z' ? '+00:00' : match[1];
 }
 function fieldValueToDate(datetimeString) {
-    if (!datetimeString) {
-        return null;
-    }
-    const date = parseISO(datetimeString);
+    if (!datetimeString) return null;
+    const date = parse(datetimeString.slice(0, 10), 'yyyy-MM-dd', new Date(0));
     return isValid(date) ? date : null;
 }
 function timeFromUserInput(input) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@contentful/field-editor-date",
-  "version": "2.0.11",
+  "version": "2.0.12",
   "main": "dist/cjs/index.js",
   "module": "dist/esm/index.js",
   "types": "dist/types/index.d.ts",
@@ -57,5 +57,5 @@
   "publishConfig": {
     "registry": "https://npm.pkg.github.com/"
   },
-  "gitHead": "039b71a95db2959bed3977a571b512233a5e375c"
+  "gitHead": "011bb99013e7bb1c58fbc5f870b81bd3aba38b95"
 }