🔧 fix+chore: Resolve Overflow in Settings Modal & Upgrade to Headless UI 2.0 (#2661)

* fix: dropdown overflow

* fix: make dropdown work on mobile

* feat: update headlessui to 2.0 and use portal

* feat: rewrite modal using headlessui

* fix: applying of maxHeight

* fix: optimize backdrop for dark mode

* fix: rendering dropdown width

* feat: match small screen layout to radix-ui dialog

* revert: mobile modifications

* fix: modal animations

* fix: z-index

* chore: Migrate from HeadlessUI 1.0 to 2.0

* fix: h2 nesting

* fix: use lighter border for PopoverButtons

* feat: Move modal to the top if using a small screen

* fix: mobile position

* fix: frontend tests

* feat: use row layout in mobile instead of col

* fix: remove config path from tsconfig

* fix: fix dropdown tests (gpt4o ftw!)

* feat: Upgrade to latest headlessui version

* fix:test1

* fix: ThemeSelector test

* fix: re-add speech tab

* style: use pl and pr-3

* fix: speech tab dropdowns

* style: use maxHeight for language

* feat: convert DropdownNoState to v2.0

* fix: use v2 params for voiceDropdown

* style: reduce maxHeight for VoiceDropdown and set fixed width

* chore: rebuild package-lock

* style(fix): copy over the same styles for the settingsTab

* style(fix): use -top-1 for speech tabs

* style(fix): use max-w-[400px]

---------

Co-authored-by: Danny Avila <danny@librechat.ai>

client/src/components/Nav/SettingsTabs/Speech/Speech.tsx

@@ -130,7 +130,7 @@ function Speech() {
     <Tabs.Content
       value={SettingsTabValues.SPEECH}
       role="tabpanel"
-      className="w-full px-4 md:min-h-[300px]"
+      className="w-full md:min-h-[271px]"
       ref={contentRef}
     >
       <Tabs.Root
@@ -138,8 +138,8 @@ function Speech() {
         orientation="horizontal"
         value={advancedMode ? 'advanced' : 'simple'}
       >
-        <div className="sticky top-0 z-50 bg-white dark:bg-gray-700">
-          <Tabs.List className="sticky top-0 mb-4 flex justify-center bg-white dark:bg-gray-700">
+        <div className="sticky -top-1 z-50 mb-4 bg-white dark:bg-gray-700">
+          <Tabs.List className="flex justify-center bg-white dark:bg-gray-700">
             <Tabs.Trigger
               onClick={() => setAdvancedMode(false)}
               className={cn(