[BUG] - DatePicker's scroll function is not working on showMonthAndYearPickers mode

NextUI Version

2.3.6

Describe the bug

When the year/month selection box of nextui/datepicker is opened, a script error occurs, causing the scroll function to not work. Clicking the upper or lower part to scroll or select a date does not cause any issues. Detailed information related to this problem is provided below.

package.ts

"dependencies": {
    "@auth/core": "^0.27.0",
    "@auth/hasura-adapter": "^0.7.2",
    "@graphql-codegen/cli": "^5.0.2",
    "@hookform/resolvers": "^3.3.4",
    "@nextui-org/react": "^2.3.6",
    "@nextui-org/spinner": "^2.0.28",
    "@radix-ui/react-alert-dialog": "^1.0.5",
    "@radix-ui/react-checkbox": "^1.0.4",
    "@radix-ui/react-dialog": "^1.0.5",
    "@radix-ui/react-dropdown-menu": "^2.0.6",
    "@radix-ui/react-icons": "^1.3.0",
    "@radix-ui/react-label": "^2.0.2",
    "@radix-ui/react-popover": "^1.0.7",
    "@radix-ui/react-radio-group": "^1.1.3",
    "@radix-ui/react-scroll-area": "^1.0.5",
    "@radix-ui/react-select": "^2.0.0",
    "@radix-ui/react-separator": "^1.0.3",
    "@radix-ui/react-slot": "^1.0.2",
    "@radix-ui/react-switch": "^1.0.3",
    "@radix-ui/react-toast": "^1.1.5",
    "@radix-ui/react-tooltip": "^1.0.7",
    "@react-email/container": "0.0.11",
    "@react-email/html": "0.0.7",
    "@react-email/section": "0.0.11",
    "@react-email/text": "0.0.7",
    "@swc/helpers": "^0.5.11",
    "@tanstack/react-table": "^8.14.0",
    "@vercel/analytics": "^1.2.2",
    "@vercel/speed-insights": "^1.0.10",
    "ag-grid-community": "~31.2.0",
    "ag-grid-react": "^31.2.0",
    "class-variance-authority": "^0.7.0",
    "clsx": "^2.1.0",
    "cmdk": "^0.2.1",
    "date-fns": "^3.4.0",
    "framer-motion": "^11.1.8",
    "graphql": "^16.8.1",
    "graphql-request": "^6.1.0",
    "jsonwebtoken": "^9.0.2",
    "libphonenumber-js": "^1.11.1",
    "next": "^14.2.3",
    "next-auth": "beta",
    "next-themes": "^0.2.1",
    "nodemailer": "^6.9.10",
    "radix-ui": "^1.0.1",
    "react": "^18",
    "react-day-picker": "^8.10.0",
    "react-dom": "^18",
    "react-email": "^2.1.3",
    "react-hook-form": "^7.51.0",
    "react-phone-number-input": "^3.4.1",
    "react-resizable-panels": "^2.0.12",
    "sonner": "^1.4.3",
    "tailwind-merge": "^2.2.1",
    "tailwindcss-animate": "^1.0.7",
    "zod": "^3.22.4"
  }

page.tsx

                        <Dialog>
                          <DialogTrigger asChild>
                            <Button variant="ghost" size="icon"><ChevronRightIcon /></Button>
                          </DialogTrigger>
                          <DialogContent className="sm:max-w-[400px] sm:min-h-[160px] p-0 border-none">
                            <Form {...formWA}>
                              <form onSubmit={formWA.handleSubmit(onSubmitWorkAnniversary)} className="space-y-8">
                                <FormField
                                  control={formWA.control}
                                  name="work_anniversary"
                                  render={({ field }) => (
                                    <FormItem>
                                      <div className="flex flex-col space-y-5 mx-4 my-2">
                                        <div className="mb-3">
                                          <FormLabel className="text-lg font-semibold">Work Anniversary</FormLabel>
                                        </div>
                                        <div className="space-y-3">
                                          <div className="flex flex-row items-center">
                                            <DatePicker
                                              classNames={{calendar: "pointer-events-auto"}}
                                              aria-label="Work Anniversary"
                                              variant="bordered"
                                              showMonthAndYearPickers
                                              defaultValue={parseDate(user?.work_anniversary?.toString() || today(getLocalTimeZone()).toString())}
                                              maxValue={today(getLocalTimeZone())}
                                              {...field}
                                            />
                                          </div>
                                          <Separator />
                                          <div className="text-right">
                                            <DialogClose asChild>
                                              <Button variant="ghost" id="closeWADialog" className="mr-2 mb-1">Discard</Button>
                                            </DialogClose>
                                            <Button type="submit">Save changes</Button>
                                          </div>
                                        </div>
                                      </div>
                                    </FormItem>
                                  )} 
                                />
                              </form>
                            </Form>
                          </DialogContent>
                        </Dialog>

Error

Warning: Received `true` for a non-boolean attribute `inert`.

If you want to write it to the DOM, pass a string instead: inert="true" or inert={value.toString()}.
    at tr
    at tbody
    at MotionComponent (webpack-internal:///(app-pages-browser)/./node_modules/@nextui-org/calendar/dist/chunk-B4KYWKCZ.mjs:297:65)
    at table
    at CalendarMonth (webpack-internal:///(app-pages-browser)/./node_modules/@nextui-org/calendar/dist/chunk-BC7ZAO5D.mjs:27:13)
    at div
    at LazyMotion (webpack-internal:///(app-pages-browser)/./node_modules/@nextui-org/calendar/dist/chunk-B4KYWKCZ.mjs:1581:11)
    at MotionConfig (webpack-internal:///(app-pages-browser)/./node_modules/@nextui-org/calendar/dist/chunk-B4KYWKCZ.mjs:1552:11)
    at PopChildMeasure (webpack-internal:///(app-pages-browser)/./node_modules/@nextui-org/calendar/dist/chunk-B4KYWKCZ.mjs:1284:23)
    at PopChild (webpack-internal:///(app-pages-browser)/./node_modules/@nextui-org/calendar/dist/chunk-B4KYWKCZ.mjs:1302:11)
    at PresenceChild (webpack-internal:///(app-pages-browser)/./node_modules/@nextui-org/calendar/dist/chunk-B4KYWKCZ.mjs:1346:11)
    at AnimatePresence (webpack-internal:///(app-pages-browser)/./node_modules/@nextui-org/calendar/dist/chunk-B4KYWKCZ.mjs:1442:11)
    at div
    at div
    at MotionComponent (webpack-internal:///(app-pages-browser)/./node_modules/framer-motion/dist/es/motion/index.mjs:50:65)
    at LazyMotion (webpack-internal:///(app-pages-browser)/./node_modules/framer-motion/dist/es/components/LazyMotion/index.mjs:49:23)
    at eval (webpack-internal:///(app-pages-browser)/./node_modules/@nextui-org/framer-utils/dist/chunk-YB52MSCE.mjs:19:13)
    at div
    at CalendarBase (webpack-internal:///(app-pages-browser)/./node_modules/@nextui-org/calendar/dist/chunk-GUY3NB7J.mjs:42:13)
    at Calendar (webpack-internal:///(app-pages-browser)/./node_modules/@nextui-org/calendar/dist/chunk-XYQCUCH6.mjs:19:111)
    at div
    at div
    at MotionComponent (webpack-internal:///(app-pages-browser)/./node_modules/framer-motion/dist/es/motion/index.mjs:50:65)
    at LazyMotion (webpack-internal:///(app-pages-browser)/./node_modules/framer-motion/dist/es/components/LazyMotion/index.mjs:49:23)
    at eval (webpack-internal:///(app-pages-browser)/./node_modules/@nextui-org/popover/dist/chunk-VGNVQLL4.mjs:29:11)
    at div
    at $9bf71ea28793e738$export$20e40289641fbbb6 (webpack-internal:///(app-pages-browser)/./node_modules/@react-aria/focus/dist/FocusScope.mjs:38:21)
    at $f1ab8c75478c6f73$export$cf75428e0b9ed1ea (webpack-internal:///(app-pages-browser)/./node_modules/@react-aria/interactions/dist/PressResponder.mjs:51:64)
    at $337b884510726a0d$export$c6fdb837b070b4ff (webpack-internal:///(app-pages-browser)/./node_modules/@react-aria/overlays/dist/Overlay.mjs:41:75)
    at eval (webpack-internal:///(app-pages-browser)/./node_modules/@nextui-org/popover/dist/chunk-VGNVQLL4.mjs:63:11)
    at PresenceChild (webpack-internal:///(app-pages-browser)/./node_modules/@nextui-org/date-picker/dist/chunk-7YLWKTAM.mjs:305:11)
    at AnimatePresence (webpack-internal:///(app-pages-browser)/./node_modules/@nextui-org/date-picker/dist/chunk-7YLWKTAM.mjs:402:11)
    at DatePicker (webpack-internal:///(app-pages-browser)/./node_modules/@nextui-org/date-picker/dist/chunk-RQWXGSSE.mjs:31:336)
    at div
    at div
    at div
    at div
    at eval (webpack-internal:///(app-pages-browser)/./src/components/ui/form.tsx:74:11)
    at Controller (webpack-internal:///(app-pages-browser)/./node_modules/react-hook-form/dist/index.esm.mjs:564:37)
    at FormField (webpack-internal:///(app-pages-browser)/./src/components/ui/form.tsx:29:14)
    at form
    at FormProvider (webpack-internal:///(app-pages-browser)/./node_modules/react-hook-form/dist/index.esm.mjs:182:13)
    at div
    at eval (webpack-internal:///(app-pages-browser)/./node_modules/@radix-ui/react-primitive/dist/index.mjs:44:26)
    at eval (webpack-internal:///(app-pages-browser)/./node_modules/@radix-ui/react-dismissable-layer/dist/index.mjs:44:42)
    at eval (webpack-internal:///(app-pages-browser)/./node_modules/@radix-ui/react-slot/dist/index.mjs:46:23)
    at eval (webpack-internal:///(app-pages-browser)/./node_modules/@radix-ui/react-slot/dist/index.mjs:20:23)
    at eval (webpack-internal:///(app-pages-browser)/./node_modules/@radix-ui/react-primitive/dist/index.mjs:44:26)
    at eval (webpack-internal:///(app-pages-browser)/./node_modules/@radix-ui/react-focus-scope/dist/index.mjs:32:19)
    at eval (webpack-internal:///(app-pages-browser)/./node_modules/@radix-ui/react-dialog/dist/index.mjs:274:28)
    at eval (webpack-internal:///(app-pages-browser)/./node_modules/@radix-ui/react-dialog/dist/index.mjs:206:102)
    at $921a889cee6df7e8$export$99c2b779aa4e8b8b (webpack-internal:///(app-pages-browser)/./node_modules/@radix-ui/react-presence/dist/index.mjs:28:22)
    at eval (webpack-internal:///(app-pages-browser)/./node_modules/@radix-ui/react-dialog/dist/index.mjs:191:108)
    at eval (webpack-internal:///(app-pages-browser)/./node_modules/@radix-ui/react-slot/dist/index.mjs:46:23)
    at eval (webpack-internal:///(app-pages-browser)/./node_modules/@radix-ui/react-slot/dist/index.mjs:20:23)
    at eval (webpack-internal:///(app-pages-browser)/./node_modules/@radix-ui/react-primitive/dist/index.mjs:44:26)
    at eval (webpack-internal:///(app-pages-browser)/./node_modules/@radix-ui/react-portal/dist/index.mjs:24:24)
    at $921a889cee6df7e8$export$99c2b779aa4e8b8b (webpack-internal:///(app-pages-browser)/./node_modules/@radix-ui/react-presence/dist/index.mjs:28:22)
    at Provider (webpack-internal:///(app-pages-browser)/./node_modules/@radix-ui/react-context/dist/index.mjs:47:28)
    at $5d3850c4d0b4e6c7$export$dad7c95542bacce0 (webpack-internal:///(app-pages-browser)/./node_modules/@radix-ui/react-dialog/dist/index.mjs:133:28)
    at _c1 (webpack-internal:///(app-pages-browser)/./src/components/ui/dialog.tsx:44:11)
    at Provider (webpack-internal:///(app-pages-browser)/./node_modules/@radix-ui/react-context/dist/index.mjs:47:28)
    at $5d3850c4d0b4e6c7$export$3ddf2d174ce01153 (webpack-internal:///(app-pages-browser)/./node_modules/@radix-ui/react-dialog/dist/index.mjs:77:28)
    at div
    at div
    at div
    at div
    at div
    at PanelWithForwardedRef (webpack-internal:///(app-pages-browser)/./node_modules/react-resizable-panels/dist/react-resizable-panels.browser.development.esm.js:61:3)
    at forwardRef(Panel)
    at div
    at PanelGroupWithForwardedRef (webpack-internal:///(app-pages-browser)/./node_modules/react-resizable-panels/dist/react-resizable-panels.browser.development.esm.js:1623:3)
    at forwardRef(PanelGroup)
    at ResizablePanelGroup (webpack-internal:///(app-pages-browser)/./src/components/ui/resizable.tsx:16:11)
    at div
    at eval (webpack-internal:///(app-pages-browser)/./node_modules/@radix-ui/react-primitive/dist/index.mjs:44:26)
    at eval (webpack-internal:///(app-pages-browser)/./node_modules/@radix-ui/react-dismissable-layer/dist/index.mjs:44:42)
    at eval (webpack-internal:///(app-pages-browser)/./node_modules/@radix-ui/react-slot/dist/index.mjs:46:23)
    at eval (webpack-internal:///(app-pages-browser)/./node_modules/@radix-ui/react-slot/dist/index.mjs:20:23)
    at eval (webpack-internal:///(app-pages-browser)/./node_modules/@radix-ui/react-primitive/dist/index.mjs:44:26)
    at eval (webpack-internal:///(app-pages-browser)/./node_modules/@radix-ui/react-focus-scope/dist/index.mjs:32:19)
    at eval (webpack-internal:///(app-pages-browser)/./node_modules/@radix-ui/react-dialog/dist/index.mjs:274:28)
    at eval (webpack-internal:///(app-pages-browser)/./node_modules/@radix-ui/react-dialog/dist/index.mjs:206:102)
    at $921a889cee6df7e8$export$99c2b779aa4e8b8b (webpack-internal:///(app-pages-browser)/./node_modules/@radix-ui/react-presence/dist/index.mjs:28:22)
    at eval (webpack-internal:///(app-pages-browser)/./node_modules/@radix-ui/react-dialog/dist/index.mjs:191:108)
    at eval (webpack-internal:///(app-pages-browser)/./node_modules/@radix-ui/react-slot/dist/index.mjs:46:23)
    at eval (webpack-internal:///(app-pages-browser)/./node_modules/@radix-ui/react-slot/dist/index.mjs:20:23)
    at eval (webpack-internal:///(app-pages-browser)/./node_modules/@radix-ui/react-primitive/dist/index.mjs:44:26)
    at eval (webpack-internal:///(app-pages-browser)/./node_modules/@radix-ui/react-portal/dist/index.mjs:24:24)
    at $921a889cee6df7e8$export$99c2b779aa4e8b8b (webpack-internal:///(app-pages-browser)/./node_modules/@radix-ui/react-presence/dist/index.mjs:28:22)
    at Provider (webpack-internal:///(app-pages-browser)/./node_modules/@radix-ui/react-context/dist/index.mjs:47:28)
    at $5d3850c4d0b4e6c7$export$dad7c95542bacce0 (webpack-internal:///(app-pages-browser)/./node_modules/@radix-ui/react-dialog/dist/index.mjs:133:28)
    at _c1 (webpack-internal:///(app-pages-browser)/./src/components/ui/dialog.tsx:44:11)
    at Provider (webpack-internal:///(app-pages-browser)/./node_modules/@radix-ui/react-context/dist/index.mjs:47:28)
    at $5d3850c4d0b4e6c7$export$3ddf2d174ce01153 (webpack-internal:///(app-pages-browser)/./node_modules/@radix-ui/react-dialog/dist/index.mjs:77:28)
    at Settings (webpack-internal:///(app-pages-browser)/./src/components/settings.tsx:59:90)
    at div
    at div
    at div
    at div
    at div
    at Header (Server)
    at main
    at div
    at div
    at $f57aed4a881a3485$var$OverlayContainerDOM (webpack-internal:///(app-pages-browser)/./node_modules/@react-aria/overlays/dist/useModal.mjs:64:54)
    at $f57aed4a881a3485$export$178405afcd8c5eb (webpack-internal:///(app-pages-browser)/./node_modules/@react-aria/overlays/dist/useModal.mjs:31:21)
    at $f57aed4a881a3485$export$bf688221f59024e5
    at $18f2051aff69b9bf$export$a54013f0d02a8f82 (webpack-internal:///(app-pages-browser)/./node_modules/@react-aria/i18n/dist/context.mjs:28:19)
    at NextUIProvider (webpack-internal:///(app-pages-browser)/./node_modules/@nextui-org/system/dist/chunk-VIKBOFDY.mjs:22:11)
    at Provider (webpack-internal:///(app-pages-browser)/./node_modules/@radix-ui/react-context/dist/index.mjs:47:28)
    at $a093c7e1ec25a057$export$f78649fb9ca566b8 (webpack-internal:///(app-pages-browser)/./node_modules/@radix-ui/react-tooltip/dist/index.mjs:72:29)
    at f (webpack-internal:///(app-pages-browser)/./node_modules/next-themes/dist/index.module.js:8:597)
    at $ (webpack-internal:///(app-pages-browser)/./node_modules/next-themes/dist/index.module.js:8:348)
    at ThemeProvider (webpack-internal:///(app-pages-browser)/./src/components/providers.tsx:12:11)
    at SessionProvider (webpack-internal:///(app-pages-browser)/./node_modules/next-auth/react.js:245:13)
    at body
    at html
    at RootLayout (Server)
    at RedirectErrorBoundary (webpack-internal:///(app-pages-browser)/./node_modules/next/dist/client/components/redirect-boundary.js:74:9)
    at RedirectBoundary (webpack-internal:///(app-pages-browser)/./node_modules/next/dist/client/components/redirect-boundary.js:82:11)
    at NotFoundErrorBoundary (webpack-internal:///(app-pages-browser)/./node_modules/next/dist/client/components/not-found-boundary.js:76:9)
    at NotFoundBoundary (webpack-internal:///(app-pages-browser)/./node_modules/next/dist/client/components/not-found-boundary.js:84:11)
    at DevRootNotFoundBoundary (webpack-internal:///(app-pages-browser)/./node_modules/next/dist/client/components/dev-root-not-found-boundary.js:33:11)
    at ReactDevOverlay (webpack-internal:///(app-pages-browser)/./node_modules/next/dist/client/components/react-dev-overlay/app/ReactDevOverlay.js:87:9)
    at HotReload (webpack-internal:///(app-pages-browser)/./node_modules/next/dist/client/components/react-dev-overlay/app/hot-reloader-client.js:321:11)
    at Router (webpack-internal:///(app-pages-browser)/./node_modules/next/dist/client/components/app-router.js:207:11)
    at ErrorBoundaryHandler (webpack-internal:///(app-pages-browser)/./node_modules/next/dist/client/components/error-boundary.js:113:9)
    at ErrorBoundary (webpack-internal:///(app-pages-browser)/./node_modules/next/dist/client/components/error-boundary.js:160:11)
    at AppRouter (webpack-internal:///(app-pages-browser)/./node_modules/next/dist/client/components/app-router.js:577:13)
    at ServerRoot (webpack-internal:///(app-pages-browser)/./node_modules/next/dist/client/app-index.js:112:27)
    at Root (webpack-internal:///(app-pages-browser)/./node_modules/next/dist/client/app-index.js:117:11)

Your Example Website or App

No response

Steps to Reproduce the Bug or Issue

Click date area to open calendar
Click year area to open year/month select box
Scroll up or down

Expected behavior

Scrolling function work

Screenshots or Videos