From c9c425c0ca2dda0222acb9626a8c970b687e1bd8 Mon Sep 17 00:00:00 2001 From: AbhishekA1509 Date: Thu, 27 Nov 2025 11:56:18 +0530 Subject: [PATCH 1/4] refactor: replace react-dates with react-day-picker for date selection - Updated package.json to remove react-dates and add react-day-picker. - Created DateTimePicker component using react-day-picker, supporting both single and range date selection. - Removed SingleDatePickerComponent as it is no longer needed. - Added new styles for the DateTimePicker component. - Updated constants and types to accommodate changes in date handling. - Removed old date picker styles and configurations related to react-dates. - Adjusted Vite configuration to exclude react-dates from manual chunks. --- package-lock.json | 375 +++++------------- package.json | 6 +- .../Components/DatePicker/DateTimePicker.scss | 71 ++++ .../Components/DatePicker/DateTimePicker.tsx | 207 +++++++--- .../DatePicker/SingleDatePickerComponent.tsx | 80 ---- .../{constants.ts => constants.tsx} | 67 ++-- .../Components/DatePicker/datePicker.scss | 103 ----- src/Shared/Components/DatePicker/index.ts | 1 - src/Shared/Components/DatePicker/types.ts | 49 ++- src/Shared/Components/DatePicker/utils.tsx | 3 +- vite.config.ts | 4 - 11 files changed, 394 insertions(+), 572 deletions(-) create mode 100644 src/Shared/Components/DatePicker/DateTimePicker.scss delete mode 100644 src/Shared/Components/DatePicker/SingleDatePickerComponent.tsx rename src/Shared/Components/DatePicker/{constants.ts => constants.tsx} (65%) delete mode 100644 src/Shared/Components/DatePicker/datePicker.scss diff --git a/package-lock.json b/package-lock.json index 5a8d826bc..b3c98fb27 100644 --- a/package-lock.json +++ b/package-lock.json @@ -39,7 +39,7 @@ "qrcode.react": "^4.2.0", "react-canvas-confetti": "^2.0.7", "react-csv": "^2.2.2", - "react-dates": "^21.8.0", + "react-day-picker": "^9.11.2", "react-draggable": "^4.4.5", "react-international-phone": "^4.5.0", "react-virtualized-sticky-tree": "^3.0.0-beta18", @@ -697,6 +697,12 @@ "w3c-keyname": "^2.2.4" } }, + "node_modules/@date-fns/tz": { + "version": "1.4.1", + "resolved": "https://registry.npmjs.org/@date-fns/tz/-/tz-1.4.1.tgz", + "integrity": "sha512-P5LUNhtbj6YfI3iJjw5EL9eUAG6OitD0W3fWQcpQjDRc/QIsL0tRNuO1PcDvPccWL1fSTXXdE1ds+l95DV/OFA==", + "license": "MIT" + }, "node_modules/@emnapi/runtime": { "version": "1.3.1", "resolved": "https://registry.npmjs.org/@emnapi/runtime/-/runtime-1.3.1.tgz", @@ -4725,34 +4731,6 @@ "node": ">=8" } }, - "node_modules/airbnb-prop-types": { - "version": "2.16.0", - "resolved": "https://registry.npmjs.org/airbnb-prop-types/-/airbnb-prop-types-2.16.0.tgz", - "integrity": "sha512-7WHOFolP/6cS96PhKNrslCLMYAI8yB1Pp6u6XmxozQOiZbsI5ycglZr5cHhBFfuRcQQjzCMith5ZPZdYiJCxUg==", - "deprecated": "This package has been renamed to 'prop-types-tools'", - "dependencies": { - "array.prototype.find": "^2.1.1", - "function.prototype.name": "^1.1.2", - "is-regex": "^1.1.0", - "object-is": "^1.1.2", - "object.assign": "^4.1.0", - "object.entries": "^1.1.2", - "prop-types": "^15.7.2", - "prop-types-exact": "^1.2.0", - "react-is": "^16.13.1" - }, - "funding": { - "url": "https://github.com/sponsors/ljharb" - }, - "peerDependencies": { - "react": "^0.14 || ^15.0.0 || ^16.0.0-alpha" - } - }, - "node_modules/airbnb-prop-types/node_modules/react-is": { - "version": "16.13.1", - "resolved": "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz", - "integrity": "sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ==" - }, "node_modules/ajv": { "version": "8.17.1", "resolved": "https://registry.npmjs.org/ajv/-/ajv-8.17.1.tgz", @@ -4873,6 +4851,7 @@ "version": "1.0.1", "resolved": "https://registry.npmjs.org/array-buffer-byte-length/-/array-buffer-byte-length-1.0.1.tgz", "integrity": "sha512-ahC5W1xgou+KTXix4sAO8Ki12Q+jf4i0+tmk3sC+zgcynshkHxzpXdImBehiUYKKKDwvfFiJl1tZt6ewscS1Mg==", + "dev": true, "dependencies": { "call-bind": "^1.0.5", "is-array-buffer": "^3.0.4" @@ -4904,24 +4883,6 @@ "url": "https://github.com/sponsors/ljharb" } }, - "node_modules/array.prototype.find": { - "version": "2.2.3", - "resolved": "https://registry.npmjs.org/array.prototype.find/-/array.prototype.find-2.2.3.tgz", - "integrity": "sha512-fO/ORdOELvjbbeIfZfzrXFMhYHGofRGqd+am9zm3tZ4GlJINj/pA2eITyfd65Vg6+ZbHd/Cys7stpoRSWtQFdA==", - "dependencies": { - "call-bind": "^1.0.7", - "define-properties": "^1.2.1", - "es-abstract": "^1.23.2", - "es-object-atoms": "^1.0.0", - "es-shim-unscopables": "^1.0.2" - }, - "engines": { - "node": ">= 0.4" - }, - "funding": { - "url": "https://github.com/sponsors/ljharb" - } - }, "node_modules/array.prototype.findlast": { "version": "1.2.5", "resolved": "https://registry.npmjs.org/array.prototype.findlast/-/array.prototype.findlast-1.2.5.tgz", @@ -4966,6 +4927,7 @@ "version": "1.3.2", "resolved": "https://registry.npmjs.org/array.prototype.flat/-/array.prototype.flat-1.3.2.tgz", "integrity": "sha512-djYB+Zx2vLewY8RWlNCUdHjDXs2XOgm602S9E7P/UpHgfeHL00cRiIF+IN/G/aUJ7kGPb6yO/ErDI5V2s8iycA==", + "dev": true, "dependencies": { "call-bind": "^1.0.2", "define-properties": "^1.2.0", @@ -5017,6 +4979,7 @@ "version": "1.0.3", "resolved": "https://registry.npmjs.org/arraybuffer.prototype.slice/-/arraybuffer.prototype.slice-1.0.3.tgz", "integrity": "sha512-bMxMKAjg13EBSVscxTaYA4mRc5t1UAXa2kXiGTNfZ079HIWXEkKmkgFrh/nJqamaLSrXO5H4WFFkPEaLJWbs3A==", + "dev": true, "dependencies": { "array-buffer-byte-length": "^1.0.1", "call-bind": "^1.0.5", @@ -5062,6 +5025,7 @@ "version": "1.0.7", "resolved": "https://registry.npmjs.org/available-typed-arrays/-/available-typed-arrays-1.0.7.tgz", "integrity": "sha512-wvUjBtSGN7+7SjNpq/9M2Tg350UZD3q62IFZLbRAR1bSMlCo1ZaeW+BJ+D090e4hIIZLBcTDWe4Mh4jvUDajzQ==", + "dev": true, "dependencies": { "possible-typed-array-names": "^1.0.0" }, @@ -5142,11 +5106,6 @@ "node": ">=8" } }, - "node_modules/brcast": { - "version": "2.0.2", - "resolved": "https://registry.npmjs.org/brcast/-/brcast-2.0.2.tgz", - "integrity": "sha512-Tfn5JSE7hrUlFcOoaLzVvkbgIemIorMIyoMr3TgvszWW7jFt2C9PdeMLtysYD9RU0MmU17b69+XJG1eRY2OBRg==" - }, "node_modules/browserslist": { "version": "4.25.0", "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-4.25.0.tgz", @@ -5578,11 +5537,6 @@ "integrity": "sha512-JsPKdmh8ZkmnHxDk55FZ1TqVLvEQTvoByJZRN9jzI0UjxK/QgAmsphz7PGtqgPieQZ/CQcHWXCR7ATDNhGe+YA==", "dev": true }, - "node_modules/consolidated-events": { - "version": "2.0.2", - "resolved": "https://registry.npmjs.org/consolidated-events/-/consolidated-events-2.0.2.tgz", - "integrity": "sha512-2/uRVMdRypf5z/TW/ncD/66l75P5hH2vM/GR8Jf8HLc2xnfJtmina6F6du8+v4Z2vTrMo7jC+W1tmEEuuELgkQ==" - }, "node_modules/convert-source-map": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/convert-source-map/-/convert-source-map-2.0.0.tgz", @@ -5853,6 +5807,7 @@ "version": "1.0.1", "resolved": "https://registry.npmjs.org/data-view-buffer/-/data-view-buffer-1.0.1.tgz", "integrity": "sha512-0lht7OugA5x3iJLOWFhWK/5ehONdprk0ISXqVFn/NFrDu+cuc8iADFrGQz5BnRK7LLU3JmkbXSxaqX+/mXYtUA==", + "dev": true, "dependencies": { "call-bind": "^1.0.6", "es-errors": "^1.3.0", @@ -5869,6 +5824,7 @@ "version": "1.0.1", "resolved": "https://registry.npmjs.org/data-view-byte-length/-/data-view-byte-length-1.0.1.tgz", "integrity": "sha512-4J7wRJD3ABAzr8wP+OcIcqq2dlUKp4DVflx++hs5h5ZKydWMI6/D/fAot+yh6g2tHh8fLFTvNOaVN357NvSrOQ==", + "dev": true, "dependencies": { "call-bind": "^1.0.7", "es-errors": "^1.3.0", @@ -5885,6 +5841,7 @@ "version": "1.0.0", "resolved": "https://registry.npmjs.org/data-view-byte-offset/-/data-view-byte-offset-1.0.0.tgz", "integrity": "sha512-t/Ygsytq+R995EJ5PZlD4Cu56sWa8InXySaViRzw9apusqsOO2bQP+SbYzAhR0pFKoB+43lYy8rWban9JSuXnA==", + "dev": true, "dependencies": { "call-bind": "^1.0.6", "es-errors": "^1.3.0", @@ -5897,6 +5854,22 @@ "url": "https://github.com/sponsors/ljharb" } }, + "node_modules/date-fns": { + "version": "4.1.0", + "resolved": "https://registry.npmjs.org/date-fns/-/date-fns-4.1.0.tgz", + "integrity": "sha512-Ukq0owbQXxa/U3EGtsdVBkR1w7KOQ5gIBqdH2hkvknzZPYvBxb/aa6E8L7tmjFtkwZBu3UXBbjIgPo/Ez4xaNg==", + "license": "MIT", + "funding": { + "type": "github", + "url": "https://github.com/sponsors/kossnocorp" + } + }, + "node_modules/date-fns-jalali": { + "version": "4.1.0-0", + "resolved": "https://registry.npmjs.org/date-fns-jalali/-/date-fns-jalali-4.1.0-0.tgz", + "integrity": "sha512-hTIP/z+t+qKwBDcmmsnmjWTduxCg+5KfdqWQvb2X/8C9+knYY6epN/pfxdDuyVlSVeFz0sM5eEfwIUQ70U4ckg==", + "license": "MIT" + }, "node_modules/dayjs": { "version": "1.11.13", "resolved": "https://registry.npmjs.org/dayjs/-/dayjs-1.11.13.tgz", @@ -5964,14 +5937,6 @@ "integrity": "sha512-oIPzksmTg4/MriiaYGO+okXDT7ztn/w3Eptv/+gSIdMdKsJo0u4CfYNFJPy+4SKMuCqGw2wxnA+URMg3t8a/bQ==", "dev": true }, - "node_modules/deepmerge": { - "version": "1.5.2", - "resolved": "https://registry.npmjs.org/deepmerge/-/deepmerge-1.5.2.tgz", - "integrity": "sha512-95k0GDqvBjZavkuvzx/YqVLv/6YYa17fz6ILMSf7neqQITCPbnfEnQvEgMPNjH4kgobe7+WIL0yJEHku+H3qtQ==", - "engines": { - "node": ">=0.10.0" - } - }, "node_modules/define-data-property": { "version": "1.1.4", "resolved": "https://registry.npmjs.org/define-data-property/-/define-data-property-1.1.4.tgz", @@ -5992,6 +5957,7 @@ "version": "1.2.1", "resolved": "https://registry.npmjs.org/define-properties/-/define-properties-1.2.1.tgz", "integrity": "sha512-8QmQKqEASLd5nx0U1B1okLElbUuuttJ/AnYmRXbbbGDWh6uS208EjD4Xqq/I9wK7u0v6O08XhTWnt5XtEbR6Dg==", + "dev": true, "dependencies": { "define-data-property": "^1.0.1", "has-property-descriptors": "^1.0.0", @@ -6044,18 +6010,6 @@ "node": "^14.15.0 || ^16.10.0 || >=18.0.0" } }, - "node_modules/direction": { - "version": "1.0.4", - "resolved": "https://registry.npmjs.org/direction/-/direction-1.0.4.tgz", - "integrity": "sha512-GYqKi1aH7PJXxdhTeZBFrg8vUBeKXi+cNprXsC1kpJcbcVnV9wBsrOu1cQEdG0WeQwlfHiy3XvnKfIrJ2R0NzQ==", - "bin": { - "direction": "cli.js" - }, - "funding": { - "type": "github", - "url": "https://github.com/sponsors/wooorm" - } - }, "node_modules/discontinuous-range": { "version": "1.0.0", "resolved": "https://registry.npmjs.org/discontinuous-range/-/discontinuous-range-1.0.0.tgz", @@ -6073,17 +6027,6 @@ "node": ">=6.0.0" } }, - "node_modules/document.contains": { - "version": "1.0.2", - "resolved": "https://registry.npmjs.org/document.contains/-/document.contains-1.0.2.tgz", - "integrity": "sha512-YcvYFs15mX8m3AO1QNQy3BlIpSMfNRj3Ujk2BEJxsZG+HZf7/hZ6jr7mDpXrF8q+ff95Vef5yjhiZxm8CGJr6Q==", - "dependencies": { - "define-properties": "^1.1.3" - }, - "funding": { - "url": "https://github.com/sponsors/ljharb" - } - }, "node_modules/dom-accessibility-api": { "version": "0.5.16", "resolved": "https://registry.npmjs.org/dom-accessibility-api/-/dom-accessibility-api-0.5.16.tgz", @@ -6238,18 +6181,6 @@ "url": "https://github.com/fb55/entities?sponsor=1" } }, - "node_modules/enzyme-shallow-equal": { - "version": "1.0.7", - "resolved": "https://registry.npmjs.org/enzyme-shallow-equal/-/enzyme-shallow-equal-1.0.7.tgz", - "integrity": "sha512-/um0GFqUXnpM9SvKtje+9Tjoz3f1fpBC3eXRFrNs8kpYn69JljciYP7KZTqM/YQbUY9KUjvKB4jo/q+L6WGGvg==", - "dependencies": { - "hasown": "^2.0.0", - "object-is": "^1.1.5" - }, - "funding": { - "url": "https://github.com/sponsors/ljharb" - } - }, "node_modules/error-ex": { "version": "1.3.2", "resolved": "https://registry.npmjs.org/error-ex/-/error-ex-1.3.2.tgz", @@ -6262,6 +6193,7 @@ "version": "1.23.3", "resolved": "https://registry.npmjs.org/es-abstract/-/es-abstract-1.23.3.tgz", "integrity": "sha512-e+HfNH61Bj1X9/jLc5v1owaLYuHdeHHSQlkhCBiTK8rBvKaULl/beGMxwrMXjpYrv4pz22BlY570vVePA2ho4A==", + "dev": true, "dependencies": { "array-buffer-byte-length": "^1.0.1", "arraybuffer.prototype.slice": "^1.0.3", @@ -6393,6 +6325,7 @@ "version": "2.0.3", "resolved": "https://registry.npmjs.org/es-set-tostringtag/-/es-set-tostringtag-2.0.3.tgz", "integrity": "sha512-3T8uNMC3OQTHkFUsFq8r/BwAXLHvU/9O9mE0fBc/MY5iq/8H7ncvO947LmYA6ldWw9Uh8Yhf25zu6n7nML5QWQ==", + "dev": true, "dependencies": { "get-intrinsic": "^1.2.4", "has-tostringtag": "^1.0.2", @@ -6406,6 +6339,7 @@ "version": "1.0.2", "resolved": "https://registry.npmjs.org/es-shim-unscopables/-/es-shim-unscopables-1.0.2.tgz", "integrity": "sha512-J3yBRXCzDu4ULnQwxyToo/OjdMx6akgVC7K6few0a7F/0wLtmKKN7I73AH5T2836UuXRqN7Qg+IIUw/+YJksRw==", + "dev": true, "dependencies": { "hasown": "^2.0.0" } @@ -6414,6 +6348,7 @@ "version": "1.2.1", "resolved": "https://registry.npmjs.org/es-to-primitive/-/es-to-primitive-1.2.1.tgz", "integrity": "sha512-QCOllgZJtaUo9miYBcLChTUaHNjJF3PYs1VidD7AwiEj1kYxKeQTctLAezAOH5ZKRH0g2IgPn6KwB4IT8iRpvA==", + "dev": true, "dependencies": { "is-callable": "^1.1.4", "is-date-object": "^1.0.1", @@ -7376,6 +7311,7 @@ "version": "0.3.3", "resolved": "https://registry.npmjs.org/for-each/-/for-each-0.3.3.tgz", "integrity": "sha512-jqYfLp7mo9vIyQf8ykW2v7A+2N4QjeCeI5+Dz9XraiO1ign81wjiH7Fb9vSOWvQfNtmSa4H2RoQTrrXivdUZmw==", + "dev": true, "dependencies": { "is-callable": "^1.1.3" } @@ -7472,6 +7408,7 @@ "version": "1.1.6", "resolved": "https://registry.npmjs.org/function.prototype.name/-/function.prototype.name-1.1.6.tgz", "integrity": "sha512-Z5kx79swU5P27WEayXM1tBi5Ze/lbIyiNgU3qyXUOf9b2rgXYyF9Dy9Cx+IQv/Lc8WCG6L82zwUPpSS9hGehIg==", + "dev": true, "dependencies": { "call-bind": "^1.0.2", "define-properties": "^1.2.0", @@ -7489,6 +7426,7 @@ "version": "1.2.3", "resolved": "https://registry.npmjs.org/functions-have-names/-/functions-have-names-1.2.3.tgz", "integrity": "sha512-xckBUXyTIqT97tq2x2AMb+g163b5JFysYk0x4qxNFwbfQkmNZoiRHb6sPzI9/QV33WeuvVYBUIiD4NzNIyqaRQ==", + "dev": true, "funding": { "url": "https://github.com/sponsors/ljharb" } @@ -7546,6 +7484,7 @@ "version": "1.0.2", "resolved": "https://registry.npmjs.org/get-symbol-description/-/get-symbol-description-1.0.2.tgz", "integrity": "sha512-g0QYk1dZBxGwk+Ngc+ltRH2IBp2f7zBkBMBJZCDerh6EhlhSR6+9irMCuT/09zD6qkarHUSn529sK/yL4S27mg==", + "dev": true, "dependencies": { "call-bind": "^1.0.5", "es-errors": "^1.3.0", @@ -7602,18 +7541,6 @@ "node": ">=10.13.0" } }, - "node_modules/global-cache": { - "version": "1.2.1", - "resolved": "https://registry.npmjs.org/global-cache/-/global-cache-1.2.1.tgz", - "integrity": "sha512-EOeUaup5DgWKlCMhA9YFqNRIlZwoxt731jCh47WBV9fQqHgXhr3Fa55hfgIUqilIcPsfdNKN7LHjrNY+Km40KA==", - "dependencies": { - "define-properties": "^1.1.2", - "is-symbol": "^1.0.1" - }, - "engines": { - "node": ">= 0.4" - } - }, "node_modules/globals": { "version": "11.12.0", "resolved": "https://registry.npmjs.org/globals/-/globals-11.12.0.tgz", @@ -7626,6 +7553,7 @@ "version": "1.0.4", "resolved": "https://registry.npmjs.org/globalthis/-/globalthis-1.0.4.tgz", "integrity": "sha512-DpLKbNU4WylpxJykQujfCcwYWiV/Jhm50Goo0wrVILAv5jOr9d+H+UR3PhSCD2rCCEIg0uc+G+muBTwD54JhDQ==", + "dev": true, "dependencies": { "define-properties": "^1.2.1", "gopd": "^1.0.1" @@ -7669,6 +7597,7 @@ "version": "1.0.2", "resolved": "https://registry.npmjs.org/has-bigints/-/has-bigints-1.0.2.tgz", "integrity": "sha512-tSvCKtBr9lkF0Ex0aQiP9N+OpV4zi2r/Nee5VkRDbaqv35RLYMzbwQfFSZZH0kR+Rd6302UJZ2p/bJCEoR3VoQ==", + "dev": true, "funding": { "url": "https://github.com/sponsors/ljharb" } @@ -7696,6 +7625,7 @@ "version": "1.0.3", "resolved": "https://registry.npmjs.org/has-proto/-/has-proto-1.0.3.tgz", "integrity": "sha512-SJ1amZAJUiZS+PhsVLf5tGydlaVB8EdFpaSO4gmiUKUOxk8qzn5AIy4ZeJUmh22znIdk/uMAUT2pl3FxzVUH+Q==", + "dev": true, "engines": { "node": ">= 0.4" }, @@ -7718,6 +7648,7 @@ "version": "1.0.2", "resolved": "https://registry.npmjs.org/has-tostringtag/-/has-tostringtag-1.0.2.tgz", "integrity": "sha512-NqADB8VjPFLM2V0VvHUewwwsw0ZWBaIdgo+ieHtK3hasLz4qeCRjYcqfB6AQrBggRKppKF8L52/VqdVsO47Dlw==", + "dev": true, "dependencies": { "has-symbols": "^1.0.3" }, @@ -7807,6 +7738,7 @@ "version": "3.3.2", "resolved": "https://registry.npmjs.org/hoist-non-react-statics/-/hoist-non-react-statics-3.3.2.tgz", "integrity": "sha512-/gGivxi8JPKWNm/W0jSmzcMPpfpPLc3dY/6GxhX2hQ9iGj3aDfklV4ET7NjKpSinLpJ5vafa9iiGIEZg10SfBw==", + "peer": true, "dependencies": { "react-is": "^16.7.0" } @@ -7814,7 +7746,8 @@ "node_modules/hoist-non-react-statics/node_modules/react-is": { "version": "16.13.1", "resolved": "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz", - "integrity": "sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ==" + "integrity": "sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ==", + "peer": true }, "node_modules/html-void-elements": { "version": "3.0.0", @@ -7931,6 +7864,7 @@ "version": "1.0.7", "resolved": "https://registry.npmjs.org/internal-slot/-/internal-slot-1.0.7.tgz", "integrity": "sha512-NGnrKwXzSms2qUUih/ILZ5JBqNTSa1+ZmP6flaIp6KmSElgE9qdndzS3cqjrDovwFdmwsGsLdeFgB6suw+1e9g==", + "dev": true, "dependencies": { "es-errors": "^1.3.0", "hasown": "^2.0.0", @@ -7960,6 +7894,7 @@ "version": "3.0.4", "resolved": "https://registry.npmjs.org/is-array-buffer/-/is-array-buffer-3.0.4.tgz", "integrity": "sha512-wcjaerHw0ydZwfhiKbXJWLDY8A7yV7KhjQOpb83hGgGfId/aQa4TOvwyzn2PuswW2gPCYEL/nEAiSVpdOj1lXw==", + "dev": true, "dependencies": { "call-bind": "^1.0.2", "get-intrinsic": "^1.2.1" @@ -7995,6 +7930,7 @@ "version": "1.0.4", "resolved": "https://registry.npmjs.org/is-bigint/-/is-bigint-1.0.4.tgz", "integrity": "sha512-zB9CruMamjym81i2JZ3UMn54PKGsQzsJeo6xvN3HJJ4CAsQNB6iRutp2To77OfCNuoxspsIhzaPoO1zyCEhFOg==", + "dev": true, "dependencies": { "has-bigints": "^1.0.1" }, @@ -8006,6 +7942,7 @@ "version": "1.1.2", "resolved": "https://registry.npmjs.org/is-boolean-object/-/is-boolean-object-1.1.2.tgz", "integrity": "sha512-gDYaKHJmnj4aWxyj6YHyXVpdQawtVLHU5cb+eztPGczf6cjuTdwve5ZIEfgXqH4e57An1D1AKf8CZ3kYrQRqYA==", + "dev": true, "dependencies": { "call-bind": "^1.0.2", "has-tostringtag": "^1.0.0" @@ -8030,6 +7967,7 @@ "version": "1.2.7", "resolved": "https://registry.npmjs.org/is-callable/-/is-callable-1.2.7.tgz", "integrity": "sha512-1BC0BVFhS/p0qtw6enp8e+8OD0UrK0oFLztSjNzhcKA3WDuJxxAPXzPuPtKkjEY9UUoEWlX/8fgKeu2S8i9JTA==", + "dev": true, "engines": { "node": ">= 0.4" }, @@ -8055,6 +7993,7 @@ "version": "1.0.1", "resolved": "https://registry.npmjs.org/is-data-view/-/is-data-view-1.0.1.tgz", "integrity": "sha512-AHkaJrsUVW6wq6JS8y3JnM/GJF/9cf+k20+iDzlSaJrinEo5+7vRiteOSwBhHRiAyQATN1AmY4hwzxJKPmYf+w==", + "dev": true, "dependencies": { "is-typed-array": "^1.1.13" }, @@ -8069,6 +8008,7 @@ "version": "1.0.5", "resolved": "https://registry.npmjs.org/is-date-object/-/is-date-object-1.0.5.tgz", "integrity": "sha512-9YQaSxsAiSwcvS33MBk3wTCVnWK+HhF8VZR2jRxehM16QcVOdHqPn4VPHmRK4lSr38n9JriurInLcP90xsYNfQ==", + "dev": true, "dependencies": { "has-tostringtag": "^1.0.0" }, @@ -8168,6 +8108,7 @@ "version": "2.0.3", "resolved": "https://registry.npmjs.org/is-negative-zero/-/is-negative-zero-2.0.3.tgz", "integrity": "sha512-5KoIu2Ngpyek75jXodFvnafB6DJgr3u8uuK0LEZJjrU19DrMD3EVERaR8sjz8CCGgpZvxPl9SuE1GMVPFHx1mw==", + "dev": true, "engines": { "node": ">= 0.4" }, @@ -8187,6 +8128,7 @@ "version": "1.0.7", "resolved": "https://registry.npmjs.org/is-number-object/-/is-number-object-1.0.7.tgz", "integrity": "sha512-k1U0IRzLMo7ZlYIfzRu23Oh6MiIFasgpb9X76eqfFZAqwH44UI4KTBvBYIZ1dSL9ZzChTB9ShHfLkR4pdW5krQ==", + "dev": true, "dependencies": { "has-tostringtag": "^1.0.0" }, @@ -8210,6 +8152,7 @@ "version": "1.1.4", "resolved": "https://registry.npmjs.org/is-regex/-/is-regex-1.1.4.tgz", "integrity": "sha512-kvRdxDsxZjhzUX07ZnLydzS1TU/TJlTUHHY4YLL87e37oUA49DfkLqgy+VjFocowy29cKvcSiu+kIv728jTTVg==", + "dev": true, "dependencies": { "call-bind": "^1.0.2", "has-tostringtag": "^1.0.0" @@ -8237,6 +8180,7 @@ "version": "1.0.3", "resolved": "https://registry.npmjs.org/is-shared-array-buffer/-/is-shared-array-buffer-1.0.3.tgz", "integrity": "sha512-nA2hv5XIhLR3uVzDDfCIknerhx8XUKnstuOERPNNIinXG7v9u+ohXF67vxm4TPTEPU6lm61ZkwP3c9PCB97rhg==", + "dev": true, "dependencies": { "call-bind": "^1.0.7" }, @@ -8263,6 +8207,7 @@ "version": "1.0.7", "resolved": "https://registry.npmjs.org/is-string/-/is-string-1.0.7.tgz", "integrity": "sha512-tE2UXzivje6ofPW7l23cjDOMa09gb7xlAqG6jG5ej6uPV32TlWP3NKPigtaGeHNu9fohccRYvIiZMfOOnOYUtg==", + "dev": true, "dependencies": { "has-tostringtag": "^1.0.0" }, @@ -8277,6 +8222,7 @@ "version": "1.0.4", "resolved": "https://registry.npmjs.org/is-symbol/-/is-symbol-1.0.4.tgz", "integrity": "sha512-C/CPBqKWnvdcxqIARxyOh4v1UUEOCHpgDa0WYgpKDFMszcrPcffg5uhwSgPCLD2WWxmq6isisz87tzT01tuGhg==", + "dev": true, "dependencies": { "has-symbols": "^1.0.2" }, @@ -8287,15 +8233,11 @@ "url": "https://github.com/sponsors/ljharb" } }, - "node_modules/is-touch-device": { - "version": "1.0.1", - "resolved": "https://registry.npmjs.org/is-touch-device/-/is-touch-device-1.0.1.tgz", - "integrity": "sha512-LAYzo9kMT1b2p19L/1ATGt2XcSilnzNlyvq6c0pbPRVisLbAPpLqr53tIJS00kvrTkj0HtR8U7+u8X0yR8lPSw==" - }, "node_modules/is-typed-array": { "version": "1.1.13", "resolved": "https://registry.npmjs.org/is-typed-array/-/is-typed-array-1.1.13.tgz", "integrity": "sha512-uZ25/bUAlUY5fR4OKT4rZQEBrzQWYV9ZJYGGsUmEJ6thodVJ1HX64ePQ6Z0qPWP+m+Uq6e9UugrE38jeYsDSMw==", + "dev": true, "dependencies": { "which-typed-array": "^1.1.14" }, @@ -8322,6 +8264,7 @@ "version": "1.0.2", "resolved": "https://registry.npmjs.org/is-weakref/-/is-weakref-1.0.2.tgz", "integrity": "sha512-qctsuLZmIQ0+vSSMfoVvyFe2+GSEvnmZ2ezTup1SBse9+twCCeial6EEi3Nc2KFcf6+qz2FBPnjXsk8xhKSaPQ==", + "dev": true, "dependencies": { "call-bind": "^1.0.2" }, @@ -9578,6 +9521,7 @@ "version": "2.30.1", "resolved": "https://registry.npmjs.org/moment/-/moment-2.30.1.tgz", "integrity": "sha512-uEmtNhbDOrWPFS+hdjFCBfy9f2YoyzRpwcl+DqpC6taX21FzsTLQVbMV/W7PzNSX6x/bhC1zA3c2UQ5NzH6how==", + "dev": true, "engines": { "node": "*" } @@ -9717,6 +9661,7 @@ "version": "1.13.2", "resolved": "https://registry.npmjs.org/object-inspect/-/object-inspect-1.13.2.tgz", "integrity": "sha512-IRZSRuzJiynemAXPYtPe5BoI/RESNYR7TYm50MC5Mqbd3Jmw5y790sErYw3V6SryFJD64b74qQQs9wn5Bg/k3g==", + "dev": true, "engines": { "node": ">= 0.4" }, @@ -9728,6 +9673,7 @@ "version": "1.1.6", "resolved": "https://registry.npmjs.org/object-is/-/object-is-1.1.6.tgz", "integrity": "sha512-F8cZ+KfGlSGi09lJT7/Nd6KJZ9ygtvYC0/UYYLI9nmQKLMnydpB9yvbv9K1uSkEu7FU9vYPmVwLg328tX+ot3Q==", + "dev": true, "dependencies": { "call-bind": "^1.0.7", "define-properties": "^1.2.1" @@ -9751,6 +9697,7 @@ "version": "4.1.5", "resolved": "https://registry.npmjs.org/object.assign/-/object.assign-4.1.5.tgz", "integrity": "sha512-byy+U7gp+FVwmyzKPYhW2h5l3crpmGsxl7X2s8y43IgxvG4g3QZ6CffDtsNQy1WsmZpQbO+ybo0AlW7TY6DcBQ==", + "dev": true, "dependencies": { "call-bind": "^1.0.5", "define-properties": "^1.2.1", @@ -9768,6 +9715,7 @@ "version": "1.1.8", "resolved": "https://registry.npmjs.org/object.entries/-/object.entries-1.1.8.tgz", "integrity": "sha512-cmopxi8VwRIAw/fkijJohSfpef5PdN0pMQJN6VC/ZKvn0LIknWD8KtgY6KlQdEc4tIjcQ3HxSMmnvtzIscdaYQ==", + "dev": true, "dependencies": { "call-bind": "^1.0.7", "define-properties": "^1.2.1", @@ -9813,6 +9761,7 @@ "version": "1.2.0", "resolved": "https://registry.npmjs.org/object.values/-/object.values-1.2.0.tgz", "integrity": "sha512-yBYjY9QX2hnRmZHAjG/f13MzmBzxzYgQhFrke06TTyKY5zSTEqkOeukBzIdVA3j3ulu8Qa3MbVFShV7T2RmGtQ==", + "dev": true, "dependencies": { "call-bind": "^1.0.7", "define-properties": "^1.2.1", @@ -10187,11 +10136,6 @@ "node": ">=8" } }, - "node_modules/performance-now": { - "version": "2.1.0", - "resolved": "https://registry.npmjs.org/performance-now/-/performance-now-2.1.0.tgz", - "integrity": "sha512-7EAHlyLHI56VEIdK57uwHdHKIaAGbnXPiw0yWbarQZOKaKpvUIgW0jWRVLiatnM+XXlSwsanIBH/hzGMJulMow==" - }, "node_modules/picocolors": { "version": "1.1.1", "resolved": "https://registry.npmjs.org/picocolors/-/picocolors-1.1.1.tgz", @@ -10255,6 +10199,7 @@ "version": "1.0.0", "resolved": "https://registry.npmjs.org/possible-typed-array-names/-/possible-typed-array-names-1.0.0.tgz", "integrity": "sha512-d7Uw+eZoloe0EHDIYoe+bQ5WXnGMOpmiZFTuMWCwpjzzkL2nTjcKiAk4hh8TjnGye2TwWOk3UXucZ+3rbmBa8Q==", + "dev": true, "engines": { "node": ">= 0.4" } @@ -10366,22 +10311,6 @@ "react-is": "^16.13.1" } }, - "node_modules/prop-types-exact": { - "version": "1.2.5", - "resolved": "https://registry.npmjs.org/prop-types-exact/-/prop-types-exact-1.2.5.tgz", - "integrity": "sha512-wHDhA5TSSvU07gdzsdeT/FZg6zay94K4Y7swSK4YsRG3moWB0Qsp9g1Y5BBausP1HF8K4UeVe2Xt7ZFJByKp6A==", - "dependencies": { - "call-bind": "^1.0.7", - "es-errors": "^1.3.0", - "hasown": "^2.0.2", - "isarray": "^2.0.5", - "object.assign": "^4.1.5", - "reflect.ownkeys": "^1.1.4" - }, - "engines": { - "node": ">= 0.8" - } - }, "node_modules/prop-types/node_modules/react-is": { "version": "16.13.1", "resolved": "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz", @@ -10459,14 +10388,6 @@ } ] }, - "node_modules/raf": { - "version": "3.4.1", - "resolved": "https://registry.npmjs.org/raf/-/raf-3.4.1.tgz", - "integrity": "sha512-Sq4CW4QhwOHE8ucn6J34MqtZCeWFP2aQSmrlroYgqAV1PjStIhJXxYuTgUIfkEk7zTLjmIjLmU5q+fbD1NnOJA==", - "dependencies": { - "performance-now": "^2.1.0" - } - }, "node_modules/railroad-diagrams": { "version": "1.0.0", "resolved": "https://registry.npmjs.org/railroad-diagrams/-/railroad-diagrams-1.0.0.tgz", @@ -10516,33 +10437,25 @@ "integrity": "sha512-RG5hOcZKZFigIGE8LxIEV/OgS1vigFQT4EkaHeKgyuCbUAu9Nbd/1RYq++bJcJJ9VOqO/n9TZRADsXNDR4VEpw==", "license": "MIT" }, - "node_modules/react-dates": { - "version": "21.8.0", - "resolved": "https://registry.npmjs.org/react-dates/-/react-dates-21.8.0.tgz", - "integrity": "sha512-PPriGqi30CtzZmoHiGdhlA++YPYPYGCZrhydYmXXQ6RAvAsaONcPtYgXRTLozIOrsQ5mSo40+DiA5eOFHnZ6xw==", - "dependencies": { - "airbnb-prop-types": "^2.15.0", - "consolidated-events": "^1.1.1 || ^2.0.0", - "enzyme-shallow-equal": "^1.0.0", - "is-touch-device": "^1.0.1", - "lodash": "^4.1.1", - "object.assign": "^4.1.0", - "object.values": "^1.1.0", - "prop-types": "^15.7.2", - "raf": "^3.4.1", - "react-moment-proptypes": "^1.6.0", - "react-outside-click-handler": "^1.2.4", - "react-portal": "^4.2.0", - "react-with-direction": "^1.3.1", - "react-with-styles": "^4.1.0", - "react-with-styles-interface-css": "^6.0.0" + "node_modules/react-day-picker": { + "version": "9.11.2", + "resolved": "https://registry.npmjs.org/react-day-picker/-/react-day-picker-9.11.2.tgz", + "integrity": "sha512-TD/xMUGg2oiKX8jUR21MST5pj+7Y36097YtnDHQFlIcZOu3mbLLw2B2JqEByEGrR3HHveWYnKlyls6WqJgohAg==", + "license": "MIT", + "dependencies": { + "@date-fns/tz": "^1.4.1", + "date-fns": "^4.1.0", + "date-fns-jalali": "^4.1.0-0" + }, + "engines": { + "node": ">=18" + }, + "funding": { + "type": "individual", + "url": "https://github.com/sponsors/gpbl" }, "peerDependencies": { - "@babel/runtime": "^7.0.0", - "moment": "^2.18.1", - "react": "^0.14 || ^15.5.4 || ^16.1.1", - "react-dom": "^0.14 || ^15.5.4 || ^16.1.1", - "react-with-direction": "^1.3.1" + "react": ">=16.8.0" } }, "node_modules/react-dom": { @@ -10616,45 +10529,6 @@ "react-dom": ">0.13.0" } }, - "node_modules/react-moment-proptypes": { - "version": "1.8.1", - "resolved": "https://registry.npmjs.org/react-moment-proptypes/-/react-moment-proptypes-1.8.1.tgz", - "integrity": "sha512-Er940DxWoObfIqPrZNfwXKugjxMIuk1LAuEzn23gytzV6hKS/sw108wibi9QubfMN4h+nrlje8eUCSbQRJo2fQ==", - "dependencies": { - "moment": ">=1.6.0" - }, - "peerDependencies": { - "moment": ">=1.6.0" - } - }, - "node_modules/react-outside-click-handler": { - "version": "1.3.0", - "resolved": "https://registry.npmjs.org/react-outside-click-handler/-/react-outside-click-handler-1.3.0.tgz", - "integrity": "sha512-Te/7zFU0oHpAnctl//pP3hEAeobfeHMyygHB8MnjP6sX5OR8KHT1G3jmLsV3U9RnIYo+Yn+peJYWu+D5tUS8qQ==", - "dependencies": { - "airbnb-prop-types": "^2.15.0", - "consolidated-events": "^1.1.1 || ^2.0.0", - "document.contains": "^1.0.1", - "object.values": "^1.1.0", - "prop-types": "^15.7.2" - }, - "peerDependencies": { - "react": "^0.14 || >=15", - "react-dom": "^0.14 || >=15" - } - }, - "node_modules/react-portal": { - "version": "4.2.2", - "resolved": "https://registry.npmjs.org/react-portal/-/react-portal-4.2.2.tgz", - "integrity": "sha512-vS18idTmevQxyQpnde0Td6ZcUlv+pD8GTyR42n3CHUQq9OHi1C4jDE4ZWEbEsrbrLRhSECYiao58cvocwMtP7Q==", - "dependencies": { - "prop-types": "^15.5.8" - }, - "peerDependencies": { - "react": "^16.0.0-0 || ^17.0.0-0 || ^18.0.0-0", - "react-dom": "^16.0.0-0 || ^17.0.0-0 || ^18.0.0-0" - } - }, "node_modules/react-refresh": { "version": "0.17.0", "resolved": "https://registry.npmjs.org/react-refresh/-/react-refresh-0.17.0.tgz", @@ -10771,55 +10645,6 @@ "react-dom": ">=18.0.0" } }, - "node_modules/react-with-direction": { - "version": "1.4.0", - "resolved": "https://registry.npmjs.org/react-with-direction/-/react-with-direction-1.4.0.tgz", - "integrity": "sha512-ybHNPiAmaJpoWwugwqry9Hd1Irl2hnNXlo/2SXQBwbLn/jGMauMS2y9jw+ydyX5V9ICryCqObNSthNt5R94xpg==", - "dependencies": { - "airbnb-prop-types": "^2.16.0", - "brcast": "^2.0.2", - "deepmerge": "^1.5.2", - "direction": "^1.0.4", - "hoist-non-react-statics": "^3.3.2", - "object.assign": "^4.1.2", - "object.values": "^1.1.5", - "prop-types": "^15.7.2" - }, - "peerDependencies": { - "react": "^0.14 || ^15 || ^16", - "react-dom": "^0.14 || ^15 || ^16" - } - }, - "node_modules/react-with-styles": { - "version": "4.2.0", - "resolved": "https://registry.npmjs.org/react-with-styles/-/react-with-styles-4.2.0.tgz", - "integrity": "sha512-tZCTY27KriRNhwHIbg1NkSdTTOSfXDg6Z7s+Q37mtz0Ym7Sc7IOr3PzVt4qJhJMW6Nkvfi3g34FuhtiGAJCBQA==", - "dependencies": { - "airbnb-prop-types": "^2.14.0", - "hoist-non-react-statics": "^3.2.1", - "object.assign": "^4.1.0", - "prop-types": "^15.7.2", - "react-with-direction": "^1.3.1" - }, - "peerDependencies": { - "@babel/runtime": "^7.0.0", - "react": ">=0.14", - "react-with-direction": "^1.3.1" - } - }, - "node_modules/react-with-styles-interface-css": { - "version": "6.0.0", - "resolved": "https://registry.npmjs.org/react-with-styles-interface-css/-/react-with-styles-interface-css-6.0.0.tgz", - "integrity": "sha512-6khSG1Trf4L/uXOge/ZAlBnq2O2PEXlQEqAhCRbvzaQU4sksIkdwpCPEl6d+DtP3+IdhyffTWuHDO9lhe1iYvA==", - "dependencies": { - "array.prototype.flat": "^1.2.1", - "global-cache": "^1.2.1" - }, - "peerDependencies": { - "@babel/runtime": "^7.0.0", - "react-with-styles": "^3.0.0 || ^4.0.0" - } - }, "node_modules/readdirp": { "version": "4.0.2", "resolved": "https://registry.npmjs.org/readdirp/-/readdirp-4.0.2.tgz", @@ -10866,21 +10691,6 @@ "url": "https://github.com/sponsors/ljharb" } }, - "node_modules/reflect.ownkeys": { - "version": "1.1.4", - "resolved": "https://registry.npmjs.org/reflect.ownkeys/-/reflect.ownkeys-1.1.4.tgz", - "integrity": "sha512-iUNmtLgzudssL+qnTUosCmnq3eczlrVd1wXrgx/GhiI/8FvwrTYWtCJ9PNvWIRX+4ftupj2WUfB5mu5s9t6LnA==", - "dependencies": { - "call-bind": "^1.0.2", - "define-properties": "^1.2.0", - "es-abstract": "^1.22.1", - "es-set-tostringtag": "^2.0.1", - "globalthis": "^1.0.3" - }, - "funding": { - "url": "https://github.com/sponsors/ljharb" - } - }, "node_modules/regenerator-runtime": { "version": "0.14.1", "resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.14.1.tgz", @@ -10912,6 +10722,7 @@ "version": "1.5.3", "resolved": "https://registry.npmjs.org/regexp.prototype.flags/-/regexp.prototype.flags-1.5.3.tgz", "integrity": "sha512-vqlC04+RQoFalODCbCumG2xIOvapzVMHwsyIGM/SIE8fRhFFsXeH8/QQ+s0T0kDAhKc4k30s73/0ydkHQz6HlQ==", + "dev": true, "dependencies": { "call-bind": "^1.0.7", "define-properties": "^1.2.1", @@ -11161,6 +10972,7 @@ "version": "1.1.2", "resolved": "https://registry.npmjs.org/safe-array-concat/-/safe-array-concat-1.1.2.tgz", "integrity": "sha512-vj6RsCsWBCf19jIeHEfkRMw8DPiBb+DMXklQ/1SGDHOMlHdPUkZXFQ2YdplS23zESTijAcurb1aSgJA3AgMu1Q==", + "dev": true, "dependencies": { "call-bind": "^1.0.7", "get-intrinsic": "^1.2.4", @@ -11178,6 +10990,7 @@ "version": "1.0.3", "resolved": "https://registry.npmjs.org/safe-regex-test/-/safe-regex-test-1.0.3.tgz", "integrity": "sha512-CdASjNJPvRa7roO6Ra/gLYBTzYzzPyyBXxIMdGW3USQLyjWEls2RgW5UBTXaQVp+OrpeCK3bLem8smtmheoRuw==", + "dev": true, "dependencies": { "call-bind": "^1.0.6", "es-errors": "^1.3.0", @@ -11248,6 +11061,7 @@ "version": "2.0.2", "resolved": "https://registry.npmjs.org/set-function-name/-/set-function-name-2.0.2.tgz", "integrity": "sha512-7PGFlmtwsEADb0WYyvCMa1t+yke6daIG4Wirafur5kcf+MhUnPms1UeR0CKQdTZD81yESwMHbtn+TR+dMviakQ==", + "dev": true, "dependencies": { "define-data-property": "^1.1.4", "es-errors": "^1.3.0", @@ -11346,6 +11160,7 @@ "version": "1.0.6", "resolved": "https://registry.npmjs.org/side-channel/-/side-channel-1.0.6.tgz", "integrity": "sha512-fDW/EZ6Q9RiO8eFG8Hj+7u/oW+XrPTIChwCOM2+th2A6OblDtYYIpve9m+KvI9Z4C9qSEXlaGR6bTEYHReuglA==", + "dev": true, "dependencies": { "call-bind": "^1.0.7", "es-errors": "^1.3.0", @@ -11639,6 +11454,7 @@ "version": "1.2.9", "resolved": "https://registry.npmjs.org/string.prototype.trim/-/string.prototype.trim-1.2.9.tgz", "integrity": "sha512-klHuCNxiMZ8MlsOihJhJEBJAiMVqU3Z2nEXWfWnIqjN0gEFS9J9+IxKozWWtQGcgoa1WUZzLjKPTr4ZHNFTFxw==", + "dev": true, "dependencies": { "call-bind": "^1.0.7", "define-properties": "^1.2.1", @@ -11656,6 +11472,7 @@ "version": "1.0.8", "resolved": "https://registry.npmjs.org/string.prototype.trimend/-/string.prototype.trimend-1.0.8.tgz", "integrity": "sha512-p73uL5VCHCO2BZZ6krwwQE3kCzM7NKmis8S//xEC6fQonchbum4eP6kR4DLEjQFO3Wnj3Fuo8NM0kOSjVdHjZQ==", + "dev": true, "dependencies": { "call-bind": "^1.0.7", "define-properties": "^1.2.1", @@ -11669,6 +11486,7 @@ "version": "1.0.8", "resolved": "https://registry.npmjs.org/string.prototype.trimstart/-/string.prototype.trimstart-1.0.8.tgz", "integrity": "sha512-UXSH262CSZY1tfu3G3Secr6uGLCFVPMhIqHjlgCUtCCcgihYc/xKs9djMTMUOb2j1mVSeU8EU6NWc/iQKU6Gfg==", + "dev": true, "dependencies": { "call-bind": "^1.0.7", "define-properties": "^1.2.1", @@ -12089,6 +11907,7 @@ "version": "1.0.2", "resolved": "https://registry.npmjs.org/typed-array-buffer/-/typed-array-buffer-1.0.2.tgz", "integrity": "sha512-gEymJYKZtKXzzBzM4jqa9w6Q1Jjm7x2d+sh19AdsD4wqnMPDYyvwpsIc2Q/835kHuo3BEQ7CjelGhfTsoBb2MQ==", + "dev": true, "dependencies": { "call-bind": "^1.0.7", "es-errors": "^1.3.0", @@ -12102,6 +11921,7 @@ "version": "1.0.1", "resolved": "https://registry.npmjs.org/typed-array-byte-length/-/typed-array-byte-length-1.0.1.tgz", "integrity": "sha512-3iMJ9q0ao7WE9tWcaYKIptkNBuOIcZCCT0d4MRvuuH88fEoEH62IuQe0OtraD3ebQEoTRk8XCBoknUNc1Y67pw==", + "dev": true, "dependencies": { "call-bind": "^1.0.7", "for-each": "^0.3.3", @@ -12120,6 +11940,7 @@ "version": "1.0.2", "resolved": "https://registry.npmjs.org/typed-array-byte-offset/-/typed-array-byte-offset-1.0.2.tgz", "integrity": "sha512-Ous0vodHa56FviZucS2E63zkgtgrACj7omjwd/8lTEMEPFFyjfixMZ1ZXenpgCFBBt4EC1J2XsyVS2gkG0eTFA==", + "dev": true, "dependencies": { "available-typed-arrays": "^1.0.7", "call-bind": "^1.0.7", @@ -12139,6 +11960,7 @@ "version": "1.0.6", "resolved": "https://registry.npmjs.org/typed-array-length/-/typed-array-length-1.0.6.tgz", "integrity": "sha512-/OxDN6OtAk5KBpGb28T+HZc2M+ADtvRxXrKKbUwtsLgdoxgX13hyy7ek6bFRl5+aBs2yZzB0c4CnQfAtVypW/g==", + "dev": true, "dependencies": { "call-bind": "^1.0.7", "for-each": "^0.3.3", @@ -12183,6 +12005,7 @@ "version": "1.0.2", "resolved": "https://registry.npmjs.org/unbox-primitive/-/unbox-primitive-1.0.2.tgz", "integrity": "sha512-61pPlCD9h51VoreyJ0BReideM3MDKMKnh6+V9L08331ipq6Q8OFXZYiqP6n/tbHx4s5I9uRhcye6BrbkizkBDw==", + "dev": true, "dependencies": { "call-bind": "^1.0.2", "has-bigints": "^1.0.2", @@ -12614,6 +12437,7 @@ "version": "1.0.2", "resolved": "https://registry.npmjs.org/which-boxed-primitive/-/which-boxed-primitive-1.0.2.tgz", "integrity": "sha512-bwZdv0AKLpplFY2KZRX6TvyuN7ojjr7lwkg6ml0roIy9YeuSr7JS372qlNW18UQYzgYK9ziGcerWqZOmEn9VNg==", + "dev": true, "dependencies": { "is-bigint": "^1.0.1", "is-boolean-object": "^1.1.0", @@ -12673,6 +12497,7 @@ "version": "1.1.15", "resolved": "https://registry.npmjs.org/which-typed-array/-/which-typed-array-1.1.15.tgz", "integrity": "sha512-oV0jmFtUky6CXfkqehVvBP/LSWJ2sy4vWMioiENyJLePrBO/yKyV9OyJySfAKosh+RYkIl5zJCNZ8/4JncrpdA==", + "dev": true, "dependencies": { "available-typed-arrays": "^1.0.7", "call-bind": "^1.0.7", diff --git a/package.json b/package.json index 3625d2ac5..95ec2b710 100644 --- a/package.json +++ b/package.json @@ -129,7 +129,7 @@ "qrcode.react": "^4.2.0", "react-canvas-confetti": "^2.0.7", "react-csv": "^2.2.2", - "react-dates": "^21.8.0", + "react-day-picker": "^9.11.2", "react-draggable": "^4.4.5", "react-international-phone": "^4.5.0", "react-virtualized-sticky-tree": "^3.0.0-beta18", @@ -138,10 +138,6 @@ }, "overrides": { "cross-spawn": "^7.0.5", - "react-dates": { - "react": "^17.0.2", - "react-dom": "^17.0.2" - }, "vite-plugin-svgr": { "vite": "6.3.5" }, diff --git a/src/Shared/Components/DatePicker/DateTimePicker.scss b/src/Shared/Components/DatePicker/DateTimePicker.scss new file mode 100644 index 000000000..0c889af0d --- /dev/null +++ b/src/Shared/Components/DatePicker/DateTimePicker.scss @@ -0,0 +1,71 @@ +.date-time-picker { + --rdp-accent-color: var(--B500); + --rdp-accent-background-color: var(--N700); + --rdp-day_button-border-radius: 0; + --rdp-day_button-border: 2px solid transparent; + --rdp-selected-border: none; + --rdp-today-color: var(--rdp-accent-color); + --rdp-range_middle-background-color: var(--O500); + --rdp-range_middle-color: inherit; + --rdp-range_start-color: var(--N100); + --rdp-range_start-background: linear-gradient(var(--O200), transparent 50%, var(--rdp-range_middle-background-color) 50%); + --rdp-range_start-date-background-color: var(--rdp-accent-color); + --rdp-range_end-background: linear-gradient(var(--O200), var(--rdp-range_middle-background-color) 50%, transparent 50%); + --rdp-range_end-color: var(--N100); + --rdp-range_end-date-background-color: var(--rdp-accent-color); + --rdp-week_number-border-radius: 100%; + --rdp-week_number-border: 2px solid var(--R100); + + .rdp-day { + border: 1px solid var(--border-primary); + + &_button { + color: var(--N900); + font-size: 14px; + font-weight: 400; + line-height: 20px; + border-radius: 0; + width: 100%; + height: 100%; + + &:hover { + background: var(--bg-hover); + } + } + } + + .rdp-day.rdp-hidden { + border: none; + } + + .rdp-day.rdp-selected { + .rdp-day_button { + background: var(--B100); + color: var(--B500); + font-size: 14px; + font-weight: 600; + line-height: 20px; + border: none; + border-radius: 0; + width: 100%; + height: 100%; + } + } + + .rdp-caption_label { + color: var(--N900); + font-size: 16px; + font-weight: 600; + } + + .rdp-month_grid { + margin-top: 12px; + } + + .rdp-weekday { + color: var(--N700); + font-size: 12px; + font-weight: 600; + line-height: 20px; + } +} \ No newline at end of file diff --git a/src/Shared/Components/DatePicker/DateTimePicker.tsx b/src/Shared/Components/DatePicker/DateTimePicker.tsx index 5b4c22dc6..b47c17ee9 100644 --- a/src/Shared/Components/DatePicker/DateTimePicker.tsx +++ b/src/Shared/Components/DatePicker/DateTimePicker.tsx @@ -14,31 +14,38 @@ * limitations under the License. */ -import { useEffect, useState } from 'react' -import { SingleDatePicker } from 'react-dates' -import CustomizableCalendarDay from 'react-dates/esm/components/CustomizableCalendarDay' +import { useMemo, useRef } from 'react' +import { DateRange, DayPicker, OnSelectHandler } from 'react-day-picker' import { SelectInstance } from 'react-select' -import moment from 'moment' +import dayjs from 'dayjs' -import { ReactComponent as CalendarIcon } from '@Icons/ic-calendar.svg' import { ReactComponent as ClockIcon } from '@Icons/ic-clock.svg' import { ReactComponent as ICWarning } from '@Icons/ic-warning.svg' +import { DATE_TIME_FORMATS } from '@Common/Constants' import { ComponentSizeType } from '@Shared/constants' +import { getUniqueId } from '@Shared/Helpers' -import 'react-dates/initialize' - -import { DATE_TIME_FORMATS } from '../../../Common' -import { useFocusTrapControl } from '../DTFocusTrap' -import { SelectPicker } from '../SelectPicker' -import { customDayStyles, DATE_PICKER_IDS, DATE_PICKER_PLACEHOLDER } from './constants' -import { DateTimePickerProps } from './types' +import { Icon } from '../Icon' +import { Popover, usePopover } from '../Popover' +import { SelectPicker, SelectPickerOptionType } from '../SelectPicker' +import { DATE_PICKER_CUSTOM_COMPONENTS, DATE_PICKER_IDS, DATE_PICKER_PLACEHOLDER } from './constants' +import { DateTimePickerProps, UpdateDateRangeType } from './types' import { DEFAULT_TIME_OPTIONS, getTimeValue, updateDate, updateTime } from './utils' -import './datePicker.scss' -import 'react-dates/lib/css/_datepicker.css' +import 'react-day-picker/style.css' +import './DateTimePicker.scss' + +const isDateUpdateRange = ( + isRange: boolean, + handler: DateTimePickerProps['onChange'], +): handler is UpdateDateRangeType => isRange const DateTimePicker = ({ date: dateObject = new Date(), + dateRange = { + from: new Date(), + to: new Date(), + }, onChange, timePickerProps = {} as SelectInstance, disabled, @@ -49,38 +56,137 @@ const DateTimePicker = ({ readOnly = false, isTodayBlocked = false, dataTestIdForTime = DATE_PICKER_IDS.TIME, - dataTestidForDate = DATE_PICKER_IDS.DATE, - openDirection = 'down', error = '', + isRangePicker = false, + blockPreviousDates = true, }: DateTimePickerProps) => { + const calendarPopoverId = useRef(getUniqueId()) + + const { open, overlayProps, popoverProps, triggerProps, scrollableRef } = usePopover({ + id: `date-time-picker-popover-${calendarPopoverId.current}`, + alignment: 'end', + variant: 'overlay', + }) + + const parsedPopoverProps = useMemo( + () => ({ + ...popoverProps, + className: `${popoverProps.className} w-100 p-12 date-time-picker`, + style: { + ...popoverProps.style, + maxWidth: 'none', + }, + }), + [popoverProps], + ) + + const parsedOverlayProps = useMemo( + () => ({ + ...overlayProps, + initialFocus: false, + }), + [overlayProps], + ) + const time = getTimeValue(dateObject) const selectedTimeOption = DEFAULT_TIME_OPTIONS.find((option) => option.value === time) ?? DEFAULT_TIME_OPTIONS[0] - const [isFocused, setFocused] = useState(false) + const handleTimeChange = (option: SelectPickerOptionType) => { + if (isDateUpdateRange(isRangePicker, onChange)) { + return + } + onChange(updateTime(dateObject, option.value).value) + } - const { disableFocusTrap, resumeFocusTrap } = useFocusTrapControl() + const handleRangeSelect: OnSelectHandler = (range) => { + if (isDateUpdateRange(isRangePicker, onChange)) { + const fromDate = range.from ? range.from : new Date() + const toDate = range.to ? range.to : undefined - const handleFocusChange = ({ focused }) => { - setFocused(focused) + onChange({ + from: fromDate, + to: toDate, + }) + } } - const handleDateChange = (event) => { - onChange(updateDate(dateObject, event?.toDate())) + + const handleSingleDateSelect: OnSelectHandler = (date) => { + if (!isDateUpdateRange(isRangePicker, onChange)) { + const updatedDate = date ? updateDate(dateObject, date) : null + onChange(updatedDate) + } } - const handleTimeChange = (option) => { - onChange(updateTime(dateObject, option.value).value) + const getDisabledState = () => { + if (readOnly) { + return true + } + + if (isTodayBlocked) { + const today = new Date() + return (date: Date) => date <= today + } + + if (blockPreviousDates) { + const today = new Date() + return (date: Date) => date < today + } + + return false } - const today = moment() - // Function to disable dates including today and all past dates - const isDayBlocked = (day) => isTodayBlocked && !day.isAfter(today) + const renderDatePicker = () => { + if (isRangePicker) { + return ( + + ) + } - useEffect(() => { - if (isFocused) { - disableFocusTrap() - return + return ( + + ) + } + + const renderInputLabel = () => { + if (isRangePicker) { + const fromDate = dateRange.from ? dayjs(dateRange.from).format(DATE_TIME_FORMATS.DD_MMM_YYYY) : '' + const toDate = dateRange.to ? dayjs(dateRange.to).format(DATE_TIME_FORMATS.DD_MMM_YYYY) : '...' + + return `${fromDate} - ${toDate}` } - resumeFocusTrap() - }, [isFocused]) + + return dayjs(dateObject).format(DATE_TIME_FORMATS.DD_MMM_YYYY) + } + + const triggerElement = ( + , + }} + /> + ) return (
@@ -90,28 +196,19 @@ const DateTimePicker = ({ )}
- } - hideKeyboardShortcutsPanel - withFullScreenPortal={false} - orientation="horizontal" - readOnly={readOnly || false} - customInputIcon={} - inputIconPosition="after" - displayFormat={DATE_TIME_FORMATS.DD_MMM_YYYY} - data-testid={dataTestidForDate} - isDayBlocked={isDayBlocked} - disabled={disabled} - appendToBody - /> + +
+ {renderDatePicker()} +
+
+ {!hideTimeSelect && (
day.isSame(moment(), 'day') - -/** - * - * @param date Date value to be displayed - * @param handleDatesChange Function to handle date change - * @param readOnly Value to make date picker read only - * @param isTodayBlocked Value to block today's date - * @returns - */ - -const SingleDatePickerComponent = ({ - date, - handleDatesChange, - readOnly, - isTodayBlocked, - displayFormat, - dataTestId, -}: SingleDatePickerProps) => { - const [focused, setFocused] = useState(false) - - const handleFocusChange = (props) => { - setFocused(props.focused) - } - - const renderCustomDay = (props) => - - return ( - renderCustomDay(props)} - hideKeyboardShortcutsPanel - withFullScreenPortal={false} - orientation="horizontal" - readOnly={readOnly || false} - isDayBlocked={isTodayBlocked ? blockToday : undefined} - customInputIcon={} - inputIconPosition="after" - displayFormat={displayFormat} - data-testid={dataTestId} - /> - ) -} -export default SingleDatePickerComponent diff --git a/src/Shared/Components/DatePicker/constants.ts b/src/Shared/Components/DatePicker/constants.tsx similarity index 65% rename from src/Shared/Components/DatePicker/constants.ts rename to src/Shared/Components/DatePicker/constants.tsx index 976fbb6ca..dd2277789 100644 --- a/src/Shared/Components/DatePicker/constants.ts +++ b/src/Shared/Components/DatePicker/constants.tsx @@ -14,38 +14,14 @@ * limitations under the License. */ -const selectedStyles = { - background: 'var(--B100)', - color: 'var(--B500)', +import { ButtonHTMLAttributes } from 'react' +import { CustomComponents } from 'react-day-picker' - hover: { - background: 'var(--B500)', - color: 'var(--N0)', - }, -} - -const selectedSpanStyles = { - background: 'var(--B100)', - color: 'var(--B500)', - hover: { - background: 'var(--B500)', - color: 'var(--N0)', - }, -} - -const hoveredSpanStyles = { - background: 'var(--B100)', - color: 'var(--B500)', -} +import { noop } from '@Common/Helper' +import { ComponentSizeType } from '@Shared/constants' -export const customDayStyles = { - selectedStartStyles: selectedStyles, - selectedEndStyles: selectedStyles, - hoveredSpanStyles, - selectedSpanStyles, - selectedStyles, - border: 'none', -} +import { Button, ButtonStyleType, ButtonVariantType } from '../Button' +import { Icon } from '../Icon' export const MONTHLY_DATES_CONFIG = { 'Day 1': '1', @@ -145,3 +121,34 @@ export const DATE_PICKER_IDS = { MONTH: 'month_picker', TIME: 'time_picker', } + +export const DATE_PICKER_CUSTOM_COMPONENTS: Partial = { + NextMonthButton: ({ onClick, className }: ButtonHTMLAttributes) => ( +
+
+ ), + PreviousMonthButton: ({ onClick, className }: ButtonHTMLAttributes) => ( +
+
+ ), +} diff --git a/src/Shared/Components/DatePicker/datePicker.scss b/src/Shared/Components/DatePicker/datePicker.scss deleted file mode 100644 index 49f3b1949..000000000 --- a/src/Shared/Components/DatePicker/datePicker.scss +++ /dev/null @@ -1,103 +0,0 @@ -/* - * Copyright (c) 2024. Devtron Inc. - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -.SingleDatePicker_picker { - z-index: calc(var(--modal-index) + 1) !important; -} - -.date-time-picker { - .SingleDatePicker { - width: 100%; - } - - .SingleDatePickerInput { - display: flex !important; - width: 100%; - background-color: var(--bg-secondary); - margin-right: 0 !important; - padding: 0 !important; - height: 36px !important; - overflow: hidden; - border: 1px solid var(--N200); - border-radius: 4px; - - &:hover { - border: 1px solid var(--N400); - } - - &:focus, - &:focus-visible, - &:focus-within { - border: 1px solid var(--B500); - } - - &__disabled { - background-color: var(--N100); - border-color: var(--N200); - } - } - - .SingleDatePickerInput_calendarIcon { - padding: 0 !important; - margin: 0 !important; - padding-right: 8px !important; - background-color: transparent !important; - height: 34px !important; - display: flex; - align-items: center; - - &:focus-visible { - outline: none; - } - } - - .SingleDatePickerInput__withBorder { - .DateInput { - line-height: 20px !important; - height: 34px; - background-color: transparent; - width: 100%; - - &:focus-visible { - outline: none; - } - } - - .DateInput_input { - font-size: 13px; - border-bottom: none; - cursor: pointer; - background-color: transparent; - color: var(--N900); - - &__focused + .DateInput_fang { - display: none; - } - - &__disabled { - cursor: not-allowed; - } - } - } - - .DateInput_input { - padding: 6px 8px !important; - - &__disabled { - font-style: normal; - } - } -} diff --git a/src/Shared/Components/DatePicker/index.ts b/src/Shared/Components/DatePicker/index.ts index aced868c3..88b5a9d0f 100644 --- a/src/Shared/Components/DatePicker/index.ts +++ b/src/Shared/Components/DatePicker/index.ts @@ -17,7 +17,6 @@ export * from './constants' export { default as DateTimePicker } from './DateTimePicker' export * from './MonthlySelect' -export { default as SingleDatePickerComponent } from './SingleDatePickerComponent' export * from './TimeSelect' export * from './types' export * from './utils' diff --git a/src/Shared/Components/DatePicker/types.ts b/src/Shared/Components/DatePicker/types.ts index 82cafc3cf..862cf4911 100644 --- a/src/Shared/Components/DatePicker/types.ts +++ b/src/Shared/Components/DatePicker/types.ts @@ -14,7 +14,6 @@ * limitations under the License. */ -import { SingleDatePickerShape } from 'react-dates' import { SelectInstance } from 'react-select' import { Moment } from 'moment' @@ -103,9 +102,18 @@ export interface TimeSelectProps { selectedTimeOption: DateSelectPickerType } -export interface DateTimePickerProps - extends Pick, - Pick { +interface DateRangeType { + from: Date + to?: Date +} + +export type UpdateDateRangeType = (dateRange: DateRangeType) => void +export type UpdateSingleDateType = (date: Date) => void + +export type DateTimePickerProps = Pick< + TimeSelectProps, + 'timePickerProps' | 'error' | 'disabled' | 'dataTestIdForTime' +> & { /** * Props for the date picker */ @@ -122,10 +130,6 @@ export interface DateTimePickerProps * If true, the field is required and asterisk is shown */ required?: boolean - /** - * To hide time selector - */ - hideTimeSelect?: boolean /** * To make the field read only */ @@ -134,12 +138,23 @@ export interface DateTimePickerProps * To block today's date */ isTodayBlocked?: boolean - /** - * Data test id for date picker - */ - dataTestidForDate?: string - /** - * Function to handle date change - */ - onChange: (date: Date) => void -} + blockPreviousDates?: boolean +} & ( + | { + isRangePicker: true + hideTimeSelect: true + dateRange: DateRangeType + onChange: UpdateDateRangeType + date?: never + } + | { + isRangePicker?: false + date: TimeSelectProps['date'] + onChange: UpdateSingleDateType + /** + * To hide time selector + */ + hideTimeSelect?: boolean + dateRange?: never + } + ) diff --git a/src/Shared/Components/DatePicker/utils.tsx b/src/Shared/Components/DatePicker/utils.tsx index 5ef41b568..33166f8bb 100644 --- a/src/Shared/Components/DatePicker/utils.tsx +++ b/src/Shared/Components/DatePicker/utils.tsx @@ -29,8 +29,7 @@ export const MONTHLY_DATE_OPTIONS = Object.entries(MONTHLY_DATES_CONFIG).map(([l * Return the options for the time in label and value format * @type {SelectPickerOptionType[]} */ -// eslint-disable-next-line import/prefer-default-export -export const DEFAULT_TIME_OPTIONS: SelectPickerOptionType[] = Object.entries(TIME_OPTIONS_CONFIG).map( +export const DEFAULT_TIME_OPTIONS: SelectPickerOptionType[] = Object.entries(TIME_OPTIONS_CONFIG).map( ([label, value]) => ({ label, value, diff --git a/vite.config.ts b/vite.config.ts index bbf0c0665..5c782fa6b 100644 --- a/vite.config.ts +++ b/vite.config.ts @@ -64,10 +64,6 @@ export default defineConfig({ assetFileNames: 'assets/[name][extname]', entryFileNames: '[name].js', manualChunks(id: string) { - if (id.includes('/node_modules/react-dates')) { - return '@react-dates' - } - if (id.includes('/node_modules/framer-motion')) { return '@framer-motion' } From e86023413b1e15b270e338959507656a720c92f9 Mon Sep 17 00:00:00 2001 From: AbhishekA1509 Date: Thu, 27 Nov 2025 12:00:31 +0530 Subject: [PATCH 2/4] refactor: remove @types/react-dates from dependencies --- package-lock.json | 21 --------------------- package.json | 1 - 2 files changed, 22 deletions(-) diff --git a/package-lock.json b/package-lock.json index b3c98fb27..e6ddfe36b 100644 --- a/package-lock.json +++ b/package-lock.json @@ -60,7 +60,6 @@ "@types/json-schema": "^7.0.15", "@types/react": "17.0.39", "@types/react-csv": "^1.1.10", - "@types/react-dates": "^21.8.6", "@types/react-dom": "17.0.13", "@types/react-router-dom": "^5.3.3", "@typescript-eslint/eslint-plugin": "8.3.0", @@ -4157,17 +4156,6 @@ "@types/react": "*" } }, - "node_modules/@types/react-dates": { - "version": "21.8.6", - "resolved": "https://registry.npmjs.org/@types/react-dates/-/react-dates-21.8.6.tgz", - "integrity": "sha512-fDF322SOXAxstapv0/oruiPx9kY4DiiaEHYAVvXdPfQhi/hdaONsA9dFw5JBNPAWz7Niuwk+UUhxPU98h70TjA==", - "dev": true, - "dependencies": { - "@types/react": "*", - "@types/react-outside-click-handler": "*", - "moment": "^2.26.0" - } - }, "node_modules/@types/react-dom": { "version": "17.0.13", "resolved": "https://registry.npmjs.org/@types/react-dom/-/react-dom-17.0.13.tgz", @@ -4177,15 +4165,6 @@ "@types/react": "*" } }, - "node_modules/@types/react-outside-click-handler": { - "version": "1.3.4", - "resolved": "https://registry.npmjs.org/@types/react-outside-click-handler/-/react-outside-click-handler-1.3.4.tgz", - "integrity": "sha512-kLuYIa9nWk1n0ywJPbVWqOEIRg0mh3vumriCHbz6LUObJw4rXYx9inDm8G579BtnH8vC0wKfrTq5c2y/K/Xzww==", - "dev": true, - "dependencies": { - "@types/react": "*" - } - }, "node_modules/@types/react-router": { "version": "5.1.20", "resolved": "https://registry.npmjs.org/@types/react-router/-/react-router-5.1.20.tgz", diff --git a/package.json b/package.json index 95ec2b710..de47bfb77 100644 --- a/package.json +++ b/package.json @@ -50,7 +50,6 @@ "@types/json-schema": "^7.0.15", "@types/react": "17.0.39", "@types/react-csv": "^1.1.10", - "@types/react-dates": "^21.8.6", "@types/react-dom": "17.0.13", "@types/react-router-dom": "^5.3.3", "@typescript-eslint/eslint-plugin": "8.3.0", From d21b7080f2b8896d81371cc920623b67197d9bfc Mon Sep 17 00:00:00 2001 From: AbhishekA1509 Date: Mon, 1 Dec 2025 13:21:20 +0530 Subject: [PATCH 3/4] feat: enhance DateTimePicker with range selection and disabled state styling --- .../Components/DatePicker/DateTimePicker.scss | 7 ++ .../Components/DatePicker/DateTimePicker.tsx | 74 ++++++++++++++----- src/Shared/Components/DatePicker/types.ts | 18 ++++- 3 files changed, 75 insertions(+), 24 deletions(-) diff --git a/src/Shared/Components/DatePicker/DateTimePicker.scss b/src/Shared/Components/DatePicker/DateTimePicker.scss index 0c889af0d..5456d0ed9 100644 --- a/src/Shared/Components/DatePicker/DateTimePicker.scss +++ b/src/Shared/Components/DatePicker/DateTimePicker.scss @@ -52,6 +52,13 @@ } } + .rdp-day.rdp-disabled { + .rdp-day_button { + opacity: 0.5; + cursor: not-allowed; + } + } + .rdp-caption_label { color: var(--N900); font-size: 16px; diff --git a/src/Shared/Components/DatePicker/DateTimePicker.tsx b/src/Shared/Components/DatePicker/DateTimePicker.tsx index b47c17ee9..dbcc9bd33 100644 --- a/src/Shared/Components/DatePicker/DateTimePicker.tsx +++ b/src/Shared/Components/DatePicker/DateTimePicker.tsx @@ -40,11 +40,16 @@ const isDateUpdateRange = ( handler: DateTimePickerProps['onChange'], ): handler is UpdateDateRangeType => isRange +const getTodayDate = (): Date => { + const today = dayjs() + return today.toDate() +} + const DateTimePicker = ({ - date: dateObject = new Date(), + date: dateObject = getTodayDate(), dateRange = { - from: new Date(), - to: new Date(), + from: getTodayDate(), + to: getTodayDate(), }, onChange, timePickerProps = {} as SelectInstance, @@ -54,12 +59,15 @@ const DateTimePicker = ({ required, hideTimeSelect = false, readOnly = false, - isTodayBlocked = false, dataTestIdForTime = DATE_PICKER_IDS.TIME, error = '', isRangePicker = false, + isTodayBlocked = false, blockPreviousDates = true, + isOutsideRange, + rangeShortcutOptions, }: DateTimePickerProps) => { + const today = getTodayDate() const calendarPopoverId = useRef(getUniqueId()) const { open, overlayProps, popoverProps, triggerProps, scrollableRef } = usePopover({ @@ -97,7 +105,7 @@ const DateTimePicker = ({ onChange(updateTime(dateObject, option.value).value) } - const handleRangeSelect: OnSelectHandler = (range) => { + const handleDateRangeChange = (range: DateRange) => { if (isDateUpdateRange(isRangePicker, onChange)) { const fromDate = range.from ? range.from : new Date() const toDate = range.to ? range.to : undefined @@ -109,6 +117,14 @@ const DateTimePicker = ({ } } + const handleRangeSelect: OnSelectHandler = (range) => { + handleDateRangeChange(range) + } + + const getRangeUpdateHandler = (range: DateRange) => () => { + handleDateRangeChange(range) + } + const handleSingleDateSelect: OnSelectHandler = (date) => { if (!isDateUpdateRange(isRangePicker, onChange)) { const updatedDate = date ? updateDate(dateObject, date) : null @@ -121,33 +137,50 @@ const DateTimePicker = ({ return true } + const isOutsideRangeFn = isOutsideRange || (() => false) + if (isTodayBlocked) { - const today = new Date() return (date: Date) => date <= today } if (blockPreviousDates) { - const today = new Date() - return (date: Date) => date < today + return (date: Date) => date < today || isOutsideRangeFn(date) } - return false + return isOutsideRangeFn } const renderDatePicker = () => { if (isRangePicker) { return ( - +
+ {!!rangeShortcutOptions?.length && ( +
+ {rangeShortcutOptions.map(({ label: optionLabel, value, onClick }) => ( + + ))} +
+ )} + + +
) } @@ -185,6 +218,7 @@ const DateTimePicker = ({ value: '', startIcon: , }} + size={ComponentSizeType.large} /> ) diff --git a/src/Shared/Components/DatePicker/types.ts b/src/Shared/Components/DatePicker/types.ts index 862cf4911..ba6183046 100644 --- a/src/Shared/Components/DatePicker/types.ts +++ b/src/Shared/Components/DatePicker/types.ts @@ -114,10 +114,6 @@ export type DateTimePickerProps = Pick< TimeSelectProps, 'timePickerProps' | 'error' | 'disabled' | 'dataTestIdForTime' > & { - /** - * Props for the date picker - */ - datePickerProps?: any /** * Id for the component */ @@ -139,12 +135,25 @@ export type DateTimePickerProps = Pick< */ isTodayBlocked?: boolean blockPreviousDates?: boolean + isOutsideRange?: (day: Date) => boolean } & ( | { isRangePicker: true hideTimeSelect: true dateRange: DateRangeType onChange: UpdateDateRangeType + rangeShortcutOptions?: ( + | { + label: string + onClick: () => void + value?: never + } + | { + label: string + onClick?: never + value: DateRangeType + } + )[] date?: never } | { @@ -156,5 +165,6 @@ export type DateTimePickerProps = Pick< */ hideTimeSelect?: boolean dateRange?: never + rangeShortcutOptions?: never } ) From f27592a25cb4b3674e1d2be075e14125fb2f8af6 Mon Sep 17 00:00:00 2001 From: AbhishekA1509 Date: Mon, 1 Dec 2025 14:18:16 +0530 Subject: [PATCH 4/4] chore: bump version to 1.20.6-pre-53 and update DateTimePicker logic --- package-lock.json | 4 ++-- package.json | 2 +- src/Shared/Components/DatePicker/DateTimePicker.tsx | 6 ++++-- 3 files changed, 7 insertions(+), 5 deletions(-) diff --git a/package-lock.json b/package-lock.json index e6ddfe36b..582b0b51c 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,12 +1,12 @@ { "name": "@devtron-labs/devtron-fe-common-lib", - "version": "1.20.6-pre-51", + "version": "1.20.6-pre-53", "lockfileVersion": 3, "requires": true, "packages": { "": { "name": "@devtron-labs/devtron-fe-common-lib", - "version": "1.20.6-pre-51", + "version": "1.20.6-pre-53", "hasInstallScript": true, "license": "ISC", "dependencies": { diff --git a/package.json b/package.json index de47bfb77..11f7b3c67 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "@devtron-labs/devtron-fe-common-lib", - "version": "1.20.6-pre-51", + "version": "1.20.6-pre-53", "description": "Supporting common component library", "type": "module", "main": "dist/index.js", diff --git a/src/Shared/Components/DatePicker/DateTimePicker.tsx b/src/Shared/Components/DatePicker/DateTimePicker.tsx index dbcc9bd33..233663eee 100644 --- a/src/Shared/Components/DatePicker/DateTimePicker.tsx +++ b/src/Shared/Components/DatePicker/DateTimePicker.tsx @@ -67,7 +67,6 @@ const DateTimePicker = ({ isOutsideRange, rangeShortcutOptions, }: DateTimePickerProps) => { - const today = getTodayDate() const calendarPopoverId = useRef(getUniqueId()) const { open, overlayProps, popoverProps, triggerProps, scrollableRef } = usePopover({ @@ -137,10 +136,13 @@ const DateTimePicker = ({ return true } + const today = getTodayDate() + today.setHours(0, 0, 0, 0) + const isOutsideRangeFn = isOutsideRange || (() => false) if (isTodayBlocked) { - return (date: Date) => date <= today + return (date: Date) => date <= today || isOutsideRangeFn(date) } if (blockPreviousDates) {