feat(date-input, date-range): upgrade react-day-picker to v9

Upgrades react-day-picker to remove the dependency on React 18

__mocks__/jest/styleMock.js

@@ -0,0 +1 @@
+module.exports = {};

jest.config.ts

@@ -1,4 +1,5 @@
 import { Config } from "jest";
+
 import coverageThresholds from "./coverage-thresholds.json";
 
 const isCI = process.env.CI === "true";
@@ -30,6 +31,9 @@ const config: Config = {
     "^.+\\.(js|mjs|jsx|ts|tsx)$": "babel-jest",
     "^.+\\.svg$": "<rootDir>/svgTransform.mjs",
   },
+  moduleNameMapper: {
+    "\\.(css|less)$": "<rootDir>/__mocks__/jest/styleMock.js",
+  },
 };
 
 export default config;

package.json

@@ -195,7 +195,7 @@
     "lodash": "^4.17.21",
     "polished": "^4.2.2",
     "prop-types": "^15.8.1",
-    "react-day-picker": "~7.4.10",
+    "react-day-picker": "9.3.0",
     "react-dnd": "^15.1.2",
     "react-dnd-html5-backend": "^15.1.3",
     "react-is": "^17.0.2",

playwright/components/date-input/index.ts

@@ -1,9 +1,10 @@
 import type { Page } from "@playwright/test";
+
 import { DAY_PICKER_WRAPPER, DAY_PICKER_HEADING } from "./locators";
 
 // component preview locators
 
 export const dayPickerWrapper = (page: Page) =>
   page.locator(DAY_PICKER_WRAPPER);
 export const dayPickerHeading = (page: Page) =>
-  page.locator(DAY_PICKER_HEADING).locator("div");
+  page.locator(DAY_PICKER_HEADING);

playwright/components/date-input/locators.ts

@@ -1,3 +1,3 @@
 // component preview locators
-export const DAY_PICKER_WRAPPER = 'div[class="DayPicker-wrapper"]';
-export const DAY_PICKER_HEADING = ".DayPicker-Caption";
+export const DAY_PICKER_WRAPPER = 'div[class="rdp-root"]';
+export const DAY_PICKER_HEADING = 'span[class="rdp-caption_label"]';