From 9484932f77ce6673d0a82f1563fe831ce4fb2b45 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Pawe=C5=82=20D=C4=85browski?= Date: Mon, 20 Jan 2025 20:20:11 +0100 Subject: [PATCH 1/4] chore: update date-fns to 4.1.0 --- package.json | 2 +- rollup.config.mjs | 20 -------------------- yarn.lock | 10 +++++----- 3 files changed, 6 insertions(+), 26 deletions(-) diff --git a/package.json b/package.json index 6c9c33c504..a567fa39a5 100644 --- a/package.json +++ b/package.json @@ -85,7 +85,7 @@ "dependencies": { "@floating-ui/react": "^0.27.0", "clsx": "^2.1.1", - "date-fns": "^3.6.0" + "date-fns": "^4.1.0" }, "scripts": { "eslint": "eslint --ext .js,.jsx,.ts,.tsx ./src", diff --git a/rollup.config.mjs b/rollup.config.mjs index 6b631e86e8..8022465547 100644 --- a/rollup.config.mjs +++ b/rollup.config.mjs @@ -24,25 +24,6 @@ const banner = `/*! Released under the ${pkg.license} License. */`; -// it's important to mark all subpackages of data-fns as externals -// see https://github.com/Hacker0x01/react-datepicker/issues/1606 -// We're relying on date-fn's package.json `exports` field to -// determine the list of directories to include. -const dateFnsPackageJson = JSON.parse( - fs - .readFileSync( - path.join( - path.dirname(fileURLToPath(import.meta.url)), - "node_modules/date-fns/package.json", - ), - ) - .toString(), -); -const dateFnsSubpackages = Object.keys(dateFnsPackageJson.exports) - .map((key) => key.replace("./", "")) - .filter((key) => key !== "." && key !== "package.json") - .map((key) => `date-fns/${key}`); - const globals = { react: "React", "prop-types": "PropTypes", @@ -109,7 +90,6 @@ const config = { external: [ ...Object.keys(pkg.dependencies || {}), ...Object.keys(pkg.peerDependencies || {}), - ...dateFnsSubpackages, ], }; diff --git a/yarn.lock b/yarn.lock index be3d5e453a..3d2ca9bb78 100644 --- a/yarn.lock +++ b/yarn.lock @@ -4178,10 +4178,10 @@ __metadata: languageName: node linkType: hard -"date-fns@npm:^3.6.0": - version: 3.6.0 - resolution: "date-fns@npm:3.6.0" - checksum: 10c0/0b5fb981590ef2f8e5a3ba6cd6d77faece0ea7f7158948f2eaae7bbb7c80a8f63ae30b01236c2923cf89bb3719c33aeb150c715ea4fe4e86e37dcf06bed42fb6 +"date-fns@npm:^4.1.0": + version: 4.1.0 + resolution: "date-fns@npm:4.1.0" + checksum: 10c0/b79ff32830e6b7faa009590af6ae0fb8c3fd9ffad46d930548fbb5acf473773b4712ae887e156ba91a7b3dc30591ce0f517d69fd83bd9c38650fdc03b4e0bac8 languageName: node linkType: hard @@ -8413,7 +8413,7 @@ __metadata: babel-plugin-transform-react-remove-prop-types: "npm:^0.4.24" clsx: "npm:^2.1.1" core-js: "npm:^3.38.1" - date-fns: "npm:^3.6.0" + date-fns: "npm:^4.1.0" eslint: "npm:^8.57.0" eslint-config-prettier: "npm:^9.1.0" eslint-plugin-import: "npm:^2.29.1" From 06b714550586a61386721ddd089e58c1308abf76 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Pawe=C5=82=20D=C4=85browski?= Date: Mon, 20 Jan 2025 20:40:54 +0100 Subject: [PATCH 2/4] fix: adjust date-fns imports to use a single entrypoint --- src/date_utils.ts | 147 ++++++++++++++++--------------- src/test/calendar_test.test.tsx | 11 ++- src/test/date_utils_test.test.ts | 11 ++- src/test/month_test.test.tsx | 2 +- 4 files changed, 91 insertions(+), 80 deletions(-) diff --git a/src/date_utils.ts b/src/date_utils.ts index 3ab13719e5..f74ddc8299 100644 --- a/src/date_utils.ts +++ b/src/date_utils.ts @@ -1,64 +1,67 @@ -import { addDays } from "date-fns/addDays"; -import { addHours } from "date-fns/addHours"; -import { addMinutes } from "date-fns/addMinutes"; -import { addMonths } from "date-fns/addMonths"; -import { addQuarters } from "date-fns/addQuarters"; -import { addSeconds } from "date-fns/addSeconds"; -import { addWeeks } from "date-fns/addWeeks"; -import { addYears } from "date-fns/addYears"; -import { differenceInCalendarDays } from "date-fns/differenceInCalendarDays"; -import { differenceInCalendarMonths } from "date-fns/differenceInCalendarMonths"; -import { differenceInCalendarQuarters } from "date-fns/differenceInCalendarQuarters"; -import { differenceInCalendarYears } from "date-fns/differenceInCalendarYears"; -import { endOfDay } from "date-fns/endOfDay"; -import { endOfMonth } from "date-fns/endOfMonth"; -import { endOfWeek } from "date-fns/endOfWeek"; -import { endOfYear } from "date-fns/endOfYear"; -import { format, longFormatters } from "date-fns/format"; -import { getDate } from "date-fns/getDate"; -import { getDay } from "date-fns/getDay"; -import { getHours } from "date-fns/getHours"; -import { getISOWeek } from "date-fns/getISOWeek"; -import { getMinutes } from "date-fns/getMinutes"; -import { getMonth } from "date-fns/getMonth"; -import { getQuarter } from "date-fns/getQuarter"; -import { getSeconds } from "date-fns/getSeconds"; -import { getTime } from "date-fns/getTime"; -import { getYear } from "date-fns/getYear"; -import { isAfter } from "date-fns/isAfter"; -import { isBefore } from "date-fns/isBefore"; -import { isDate } from "date-fns/isDate"; -import { isEqual as dfIsEqual } from "date-fns/isEqual"; -import { isSameDay as dfIsSameDay } from "date-fns/isSameDay"; -import { isSameMonth as dfIsSameMonth } from "date-fns/isSameMonth"; -import { isSameQuarter as dfIsSameQuarter } from "date-fns/isSameQuarter"; -import { isSameYear as dfIsSameYear } from "date-fns/isSameYear"; -import { isValid as isValidDate } from "date-fns/isValid"; -import { isWithinInterval } from "date-fns/isWithinInterval"; -import { max } from "date-fns/max"; -import { min } from "date-fns/min"; -import { parse } from "date-fns/parse"; -import { parseISO } from "date-fns/parseISO"; -import { set } from "date-fns/set"; -import { setHours } from "date-fns/setHours"; -import { setMinutes } from "date-fns/setMinutes"; -import { setMonth } from "date-fns/setMonth"; -import { setQuarter } from "date-fns/setQuarter"; -import { setSeconds } from "date-fns/setSeconds"; -import { setYear } from "date-fns/setYear"; -import { startOfDay } from "date-fns/startOfDay"; -import { startOfMonth } from "date-fns/startOfMonth"; -import { startOfQuarter } from "date-fns/startOfQuarter"; -import { startOfWeek } from "date-fns/startOfWeek"; -import { startOfYear } from "date-fns/startOfYear"; -import { subDays } from "date-fns/subDays"; -import { subMonths } from "date-fns/subMonths"; -import { subQuarters } from "date-fns/subQuarters"; -import { subWeeks } from "date-fns/subWeeks"; -import { subYears } from "date-fns/subYears"; -import { toDate } from "date-fns/toDate"; - -import type { Day, Locale as DateFnsLocale } from "date-fns"; +import { + addDays, + addHours, + addMinutes, + addMonths, + addQuarters, + addSeconds, + addWeeks, + addYears, + isEqual as dfIsEqual, + isSameDay as dfIsSameDay, + isSameMonth as dfIsSameMonth, + isSameQuarter as dfIsSameQuarter, + isSameYear as dfIsSameYear, + differenceInCalendarDays, + differenceInCalendarMonths, + differenceInCalendarQuarters, + differenceInCalendarYears, + endOfDay, + endOfMonth, + endOfWeek, + endOfYear, + format, + getDate, + getDay, + getHours, + getISOWeek, + getMinutes, + getMonth, + getQuarter, + getSeconds, + getTime, + getYear, + isAfter, + isBefore, + isDate, + isValid as isValidDate, + isWithinInterval, + longFormatters, + max, + min, + parse, + parseISO, + set, + setHours, + setMinutes, + setMonth, + setQuarter, + setSeconds, + setYear, + startOfDay, + startOfMonth, + startOfQuarter, + startOfWeek, + startOfYear, + subDays, + subMonths, + subQuarters, + subWeeks, + subYears, + toDate, +} from "date-fns"; + +import type { Locale as DateFnsLocale, Day } from "date-fns"; export type DateNumberType = Day; interface LocaleObj @@ -340,21 +343,21 @@ export function setTime( return setHours(setMinutes(setSeconds(date, second), minute), hour); } -export { setMinutes, setHours, setMonth, setQuarter, setYear }; +export { setHours, setMinutes, setMonth, setQuarter, setYear }; // ** Date Getters ** // getDay Returns day of week, getDate returns day of month export { - getSeconds, - getMinutes, + getDate, + getDay, getHours, + getMinutes, getMonth, getQuarter, - getYear, - getDay, - getDate, + getSeconds, getTime, + getYear, }; /** @@ -487,22 +490,22 @@ export function getEndOfMonth(date: Date): Date { // *** Addition *** export { - addSeconds, - addMinutes, addDays, - addWeeks, + addMinutes, addMonths, addQuarters, + addSeconds, + addWeeks, addYears, }; // *** Subtraction *** -export { addHours, subDays, subWeeks, subMonths, subQuarters, subYears }; +export { addHours, subDays, subMonths, subQuarters, subWeeks, subYears }; // ** Date Comparison ** -export { isBefore, isAfter }; +export { isAfter, isBefore }; /** * Checks if two dates are in the same year. diff --git a/src/test/calendar_test.test.tsx b/src/test/calendar_test.test.tsx index 5669aa6c60..5c31b3700a 100644 --- a/src/test/calendar_test.test.tsx +++ b/src/test/calendar_test.test.tsx @@ -3,9 +3,14 @@ */ import { render, fireEvent, act, waitFor } from "@testing-library/react"; -import { setDate, startOfMonth, eachDayOfInterval, endOfMonth } from "date-fns"; -import { endOfYear } from "date-fns/endOfYear"; -import { isSunday } from "date-fns/isSunday"; +import { + setDate, + startOfMonth, + eachDayOfInterval, + endOfMonth, + endOfYear, + isSunday, +} from "date-fns"; import { eo } from "date-fns/locale/eo"; import { fi } from "date-fns/locale/fi"; import React from "react"; diff --git a/src/test/date_utils_test.test.ts b/src/test/date_utils_test.test.ts index a3d5c25117..19d504e74a 100644 --- a/src/test/date_utils_test.test.ts +++ b/src/test/date_utils_test.test.ts @@ -1,8 +1,11 @@ -import { addYears, setSeconds } from "date-fns"; -import { addQuarters } from "date-fns/addQuarters"; +import { + addYears, + setSeconds, + addQuarters, + setHours, + setMinutes, +} from "date-fns"; import { ptBR } from "date-fns/locale/pt-BR"; -import { setHours } from "date-fns/setHours"; -import { setMinutes } from "date-fns/setMinutes"; import { newDate, diff --git a/src/test/month_test.test.tsx b/src/test/month_test.test.tsx index 22bc184aa1..fba4b839ec 100644 --- a/src/test/month_test.test.tsx +++ b/src/test/month_test.test.tsx @@ -1,6 +1,6 @@ /* eslint jest/expect-expect: ["error", { "assertFunctionNames": ["expect", "assertDateRangeInclusive", "runAxe"] }] */ import { render, fireEvent } from "@testing-library/react"; -import { es } from "date-fns/locale"; +import { es } from "date-fns/locale/es"; import React from "react"; import DatePicker from "../"; From e8b771c40b6ad68fcea5ec89e5cee0c3b7f4d688 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Pawe=C5=82=20D=C4=85browski?= Date: Tue, 21 Jan 2025 00:16:02 +0100 Subject: [PATCH 3/4] fix: adjust exports in package.json, fix umd build --- package.json | 9 ++++++++- rollup.config.mjs | 9 ++++++--- 2 files changed, 14 insertions(+), 4 deletions(-) diff --git a/package.json b/package.json index a567fa39a5..4a3c314bde 100644 --- a/package.json +++ b/package.json @@ -7,10 +7,17 @@ "homepage": "https://github.com/Hacker0x01/react-datepicker", "main": "dist/index.js", "types": "dist/index.d.ts", - "browser": "dist/react-datepicker.min.js", "module": "dist/es/index.js", "unpkg": "dist/react-datepicker.min.js", "style": "dist/react-datepicker.min.css", + "exports": { + ".": { + "import": "./dist/es/index.js", + "require": "./dist/index.js", + "types": "./dist/index.d.ts", + "default": "./dist/es/index.js" + } + }, "files": ["*.md", "dist", "lib", "es", "src/stylesheets"], "sideEffects": ["**/*.css"], "keywords": ["react", "datepicker", "calendar", "date", "react-component"], diff --git a/rollup.config.mjs b/rollup.config.mjs index 8022465547..32ae6c49c1 100644 --- a/rollup.config.mjs +++ b/rollup.config.mjs @@ -26,7 +26,10 @@ const banner = `/*! const globals = { react: "React", - "prop-types": "PropTypes", + "react-dom": "ReactDOM", + clsx: "clsx", + "date-fns": "dateFns", + "@floating-ui/react": "FloatingUIReact", }; // NOTE:https://rollupjs.org/migration/#changed-defaults @@ -40,7 +43,7 @@ const config = { input: "src/index.tsx", output: [ { - file: pkg.browser, + file: pkg.unpkg, format: "umd", name: "DatePicker", globals, @@ -49,7 +52,7 @@ const config = { plugins: [terser()], }, { - file: pkg.browser.replace(".min.js", ".js"), + file: pkg.unpkg.replace(".min.js", ".js"), format: "umd", sourcemap: "inline", name: "DatePicker", From d707d7dbe7a58b1d1b45a887f22ba96371cb3183 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Pawe=C5=82=20D=C4=85browski?= Date: Tue, 21 Jan 2025 01:22:09 +0100 Subject: [PATCH 4/4] fix: fix `exports` field --- package.json | 15 ++++++++++----- 1 file changed, 10 insertions(+), 5 deletions(-) diff --git a/package.json b/package.json index 4a3c314bde..6d716726bb 100644 --- a/package.json +++ b/package.json @@ -12,11 +12,16 @@ "style": "dist/react-datepicker.min.css", "exports": { ".": { - "import": "./dist/es/index.js", - "require": "./dist/index.js", - "types": "./dist/index.d.ts", - "default": "./dist/es/index.js" - } + "import": { + "types": "./dist/index.d.ts", + "default": "./dist/es/index.js" + }, + "require": { + "types": "./dist/index.d.ts", + "default": "./dist/index.js" + } + }, + "./dist/*.css": "./dist/*.css" }, "files": ["*.md", "dist", "lib", "es", "src/stylesheets"], "sideEffects": ["**/*.css"],