@iblai/iblai-js 1.22.6 → 1.23.1

package/dist/web-containers/source/next/index.esm.js

@@ -6,7 +6,7 @@ import { useGetUserMetadataQuery, useGetUserMetadataEdxQuery, useUpdateUserMetad
 import { getInitials, useTenantMetadata, WithPermissions, useStripeUpgrade, openExternalUrl, CHAT_AREA_SIZE, isAlphaNumeric32, checkRbacPermission, selectNumberOfActiveChatMessages, useUsername, selectStreaming, isLoggedIn, TOOLS, isSafariBrowser, useShowAttachment, useShowVoiceCall, useShowVoiceRecorder, useMentorSettings, selectShowingSharedChat, selectRbacPermissions, useShowFreeTrialDialog, useEmbedMode, chatInputSliceSelectors, useResponsive, useAccessingPublicRoute, useVisitingTenant, useModelFileUploadCapabilities, useChatFileUpload, useVoiceChat, selectAttachedFiles, MENTOR_CHAT_DOCUMENTS_EXTENSIONS, removeFile, chatInputSliceActions, chatActions, WithFormPermissions, useTenantContext, TimeTracker, advancedTabsProperties, defaultSessionIds, ANONYMOUS_USERNAME as ANONYMOUS_USERNAME$2, redirectToAuthSpaJoinTenant, selectActiveTab, useAxdToken, useWelcomeMessage, markdownToPlainText, useCachedSessionId, use402ErrorCheck, selectTokenEnabled, selectToken, useServiceWorker, useUserAgreement, useAdvancedChat, sendMessageToParentWebsite, useMentorTools, useFileDragDrop, eventBus, RemoteEvents, selectEnableChatActionsPopup, advancedTabs, isInIframe, getAuthSpaJoinUrl, addMessage, clearFiles, MENTOR_VISIBILITY } from '@iblai/web-utils';
 import { useDispatch, useSelector } from 'react-redux';
 import { toast } from 'sonner';
-import { useSearchParams, useParams, usePathname } from 'next/navigation';
+import { useSearchParams, useParams, useRouter, usePathname } from 'next/navigation';
 import Image$4 from 'next/image';
 import Link$2 from 'next/link';
 import * as ReactDOM from 'react-dom';
@@ -18,7 +18,7 @@ import { MentorVisibilityEnum, TransportEnum, PromptVisibilityEnum } from '@ibla
 import '@reduxjs/toolkit/query';
 import dynamic from 'next/dynamic';
 import Script from 'next/script';
-import { useRouter } from 'next/router';
+import { useRouter as useRouter$1 } from 'next/router';
 import { Room, RoomEvent, ConnectionState, VideoPresets, Track, ParticipantEvent } from 'livekit-client';
 import { RoomContext, RoomAudioRenderer, VideoConference, formatChatMessageLinks, useRoomContext } from '@livekit/components-react';
 import { createRoot } from 'react-dom/client';
@@ -49337,12 +49337,12 @@ const __iconNode$oC = [
   ["path", { d: "M5 12H2a10 10 0 0 0 20 0h-3", key: "1hv3nh" }],
   ["circle", { cx: "12", cy: "5", r: "3", key: "rqqgnr" }]
 ];
-const Anchor$3 = createLucideIcon("anchor", __iconNode$oC);
+const Anchor$4 = createLucideIcon("anchor", __iconNode$oC);
 
 var anchor = /*#__PURE__*/Object.freeze({
     __proto__: null,
     __iconNode: __iconNode$oC,
-    default: Anchor$3
+    default: Anchor$4
 });
 
 /**
@@ -90901,8 +90901,8 @@ const arrow$2 = (options, deps) => {
 };
 
 // packages/react/arrow/src/arrow.tsx
-var NAME$8 = "Arrow";
-var Arrow$3 = React.forwardRef((props, forwardedRef) => {
+var NAME$9 = "Arrow";
+var Arrow$5 = React.forwardRef((props, forwardedRef) => {
   const { children, width = 10, height = 5, ...arrowProps } = props;
   return /* @__PURE__ */ jsx(
     Primitive$4.svg,
@@ -90917,8 +90917,8 @@ var Arrow$3 = React.forwardRef((props, forwardedRef) => {
     }
   );
 });
-Arrow$3.displayName = NAME$8;
-var Root$e = Arrow$3;
+Arrow$5.displayName = NAME$9;
+var Root$g = Arrow$5;
 
 // packages/react/use-size/src/use-size.tsx
 function useSize$1(element) {
@@ -90956,20 +90956,20 @@ function useSize$1(element) {
   return size;
 }
 
-var POPPER_NAME$1 = "Popper";
-var [createPopperContext$1, createPopperScope$1] = createContextScope$1(POPPER_NAME$1);
-var [PopperProvider$1, usePopperContext$1] = createPopperContext$1(POPPER_NAME$1);
-var Popper$1 = (props) => {
+var POPPER_NAME$2 = "Popper";
+var [createPopperContext$2, createPopperScope$2] = createContextScope$1(POPPER_NAME$2);
+var [PopperProvider$2, usePopperContext$2] = createPopperContext$2(POPPER_NAME$2);
+var Popper$2 = (props) => {
   const { __scopePopper, children } = props;
   const [anchor, setAnchor] = React.useState(null);
-  return /* @__PURE__ */ jsx(PopperProvider$1, { scope: __scopePopper, anchor, onAnchorChange: setAnchor, children });
+  return /* @__PURE__ */ jsx(PopperProvider$2, { scope: __scopePopper, anchor, onAnchorChange: setAnchor, children });
 };
-Popper$1.displayName = POPPER_NAME$1;
-var ANCHOR_NAME$3 = "PopperAnchor";
-var PopperAnchor$1 = React.forwardRef(
+Popper$2.displayName = POPPER_NAME$2;
+var ANCHOR_NAME$4 = "PopperAnchor";
+var PopperAnchor$2 = React.forwardRef(
   (props, forwardedRef) => {
     const { __scopePopper, virtualRef, ...anchorProps } = props;
-    const context = usePopperContext$1(ANCHOR_NAME$3, __scopePopper);
+    const context = usePopperContext$2(ANCHOR_NAME$4, __scopePopper);
     const ref = React.useRef(null);
     const composedRefs = useComposedRefs$1(forwardedRef, ref);
     React.useEffect(() => {
@@ -90978,10 +90978,10 @@ var PopperAnchor$1 = React.forwardRef(
     return virtualRef ? null : /* @__PURE__ */ jsx(Primitive$4.div, { ...anchorProps, ref: composedRefs });
   }
 );
-PopperAnchor$1.displayName = ANCHOR_NAME$3;
-var CONTENT_NAME$8 = "PopperContent";
-var [PopperContentProvider$1, useContentContext$1] = createPopperContext$1(CONTENT_NAME$8);
-var PopperContent$1 = React.forwardRef(
+PopperAnchor$2.displayName = ANCHOR_NAME$4;
+var CONTENT_NAME$b = "PopperContent";
+var [PopperContentProvider$2, useContentContext$2] = createPopperContext$2(CONTENT_NAME$b);
+var PopperContent$2 = React.forwardRef(
   (props, forwardedRef) => {
     const {
       __scopePopper,
@@ -90999,7 +90999,7 @@ var PopperContent$1 = React.forwardRef(
       onPlaced,
       ...contentProps
     } = props;
-    const context = usePopperContext$1(CONTENT_NAME$8, __scopePopper);
+    const context = usePopperContext$2(CONTENT_NAME$b, __scopePopper);
     const [content, setContent] = React.useState(null);
     const composedRefs = useComposedRefs$1(forwardedRef, (node) => setContent(node));
     const [arrow, setArrow] = React.useState(null);
@@ -91012,7 +91012,7 @@ var PopperContent$1 = React.forwardRef(
     const hasExplicitBoundaries = boundary.length > 0;
     const detectOverflowOptions = {
       padding: collisionPadding,
-      boundary: boundary.filter(isNotNull$1),
+      boundary: boundary.filter(isNotNull$2),
       // with `strategy: 'fixed'`, this is the only way to get it to respect boundaries
       altBoundary: hasExplicitBoundaries
     };
@@ -91050,11 +91050,11 @@ var PopperContent$1 = React.forwardRef(
           }
         }),
         arrow && arrow$2({ element: arrow, padding: arrowPadding }),
-        transformOrigin$2({ arrowWidth, arrowHeight }),
+        transformOrigin$3({ arrowWidth, arrowHeight }),
         hideWhenDetached && hide({ strategy: "referenceHidden", ...detectOverflowOptions })
       ]
     });
-    const [placedSide, placedAlign] = getSideAndAlignFromPlacement$1(placement);
+    const [placedSide, placedAlign] = getSideAndAlignFromPlacement$2(placement);
     const handlePlaced = useCallbackRef$2(onPlaced);
     useLayoutEffect2$1(() => {
       if (isPositioned) {
@@ -91093,7 +91093,7 @@ var PopperContent$1 = React.forwardRef(
         },
         dir: props.dir,
         children: /* @__PURE__ */ jsx(
-          PopperContentProvider$1,
+          PopperContentProvider$2,
           {
             scope: __scopePopper,
             placedSide,
@@ -91122,18 +91122,18 @@ var PopperContent$1 = React.forwardRef(
     );
   }
 );
-PopperContent$1.displayName = CONTENT_NAME$8;
-var ARROW_NAME$6 = "PopperArrow";
-var OPPOSITE_SIDE$1 = {
+PopperContent$2.displayName = CONTENT_NAME$b;
+var ARROW_NAME$8 = "PopperArrow";
+var OPPOSITE_SIDE$2 = {
   top: "bottom",
   right: "left",
   bottom: "top",
   left: "right"
 };
-var PopperArrow$1 = React.forwardRef(function PopperArrow2(props, forwardedRef) {
+var PopperArrow$2 = React.forwardRef(function PopperArrow2(props, forwardedRef) {
   const { __scopePopper, ...arrowProps } = props;
-  const contentContext = useContentContext$1(ARROW_NAME$6, __scopePopper);
-  const baseSide = OPPOSITE_SIDE$1[contentContext.placedSide];
+  const contentContext = useContentContext$2(ARROW_NAME$8, __scopePopper);
+  const baseSide = OPPOSITE_SIDE$2[contentContext.placedSide];
   return (
     // we have to use an extra wrapper because `ResizeObserver` (used by `useSize`)
     // doesn't report size as we'd expect on SVG elements.
@@ -91162,7 +91162,7 @@ var PopperArrow$1 = React.forwardRef(function PopperArrow2(props, forwardedRef)
           visibility: contentContext.shouldHideArrow ? "hidden" : void 0
         },
         children: /* @__PURE__ */ jsx(
-          Root$e,
+          Root$g,
           {
             ...arrowProps,
             ref: forwardedRef,
@@ -91177,11 +91177,11 @@ var PopperArrow$1 = React.forwardRef(function PopperArrow2(props, forwardedRef)
     )
   );
 });
-PopperArrow$1.displayName = ARROW_NAME$6;
-function isNotNull$1(value) {
+PopperArrow$2.displayName = ARROW_NAME$8;
+function isNotNull$2(value) {
   return value !== null;
 }
-var transformOrigin$2 = (options) => ({
+var transformOrigin$3 = (options) => ({
   name: "transformOrigin",
   options,
   fn(data) {
@@ -91190,7 +91190,7 @@ var transformOrigin$2 = (options) => ({
     const isArrowHidden = cannotCenterArrow;
     const arrowWidth = isArrowHidden ? 0 : options.arrowWidth;
     const arrowHeight = isArrowHidden ? 0 : options.arrowHeight;
-    const [placedSide, placedAlign] = getSideAndAlignFromPlacement$1(placement);
+    const [placedSide, placedAlign] = getSideAndAlignFromPlacement$2(placement);
     const noArrowAlign = { start: "0%", center: "50%", end: "100%" }[placedAlign];
     const arrowXCenter = (middlewareData.arrow?.x ?? 0) + arrowWidth / 2;
     const arrowYCenter = (middlewareData.arrow?.y ?? 0) + arrowHeight / 2;
@@ -91212,24 +91212,24 @@ var transformOrigin$2 = (options) => ({
     return { data: { x, y } };
   }
 });
-function getSideAndAlignFromPlacement$1(placement) {
+function getSideAndAlignFromPlacement$2(placement) {
   const [side, align = "center"] = placement.split("-");
   return [side, align];
 }
-var Root2$8 = Popper$1;
-var Anchor$2 = PopperAnchor$1;
-var Content$2 = PopperContent$1;
-var Arrow$2 = PopperArrow$1;
+var Root2$a = Popper$2;
+var Anchor$3 = PopperAnchor$2;
+var Content$3 = PopperContent$2;
+var Arrow$4 = PopperArrow$2;
 
-var PORTAL_NAME$8 = "Portal";
-var Portal$6 = React.forwardRef((props, forwardedRef) => {
+var PORTAL_NAME$9 = "Portal";
+var Portal$7 = React.forwardRef((props, forwardedRef) => {
   const { container: containerProp, ...portalProps } = props;
   const [mounted, setMounted] = React.useState(false);
   useLayoutEffect2$1(() => setMounted(true), []);
   const container = containerProp || mounted && globalThis?.document?.body;
   return container ? ReactDOM__default.createPortal(/* @__PURE__ */ jsx(Primitive$4.div, { ...portalProps, ref: forwardedRef }), container) : null;
 });
-Portal$6.displayName = PORTAL_NAME$8;
+Portal$7.displayName = PORTAL_NAME$9;
 
 function useStateMachine$4(initialState, machine) {
   return React.useReducer((state, event) => {
@@ -91560,7 +91560,7 @@ function focusFirst$3(candidates, preventScroll = false) {
 function wrapArray$3(array, startIndex) {
   return array.map((_, index) => array[(startIndex + index) % array.length]);
 }
-var Root$d = RovingFocusGroup$1;
+var Root$f = RovingFocusGroup$1;
 var Item$3 = RovingFocusGroupItem$1;
 
 var getDefaultParent = function (originalTarget) {
@@ -92473,16 +92473,16 @@ var MENU_NAME = "Menu";
 var [Collection$3, useCollection$3, createCollectionScope$3] = createCollection$2(MENU_NAME);
 var [createMenuContext, createMenuScope] = createContextScope$1(MENU_NAME, [
   createCollectionScope$3,
-  createPopperScope$1,
+  createPopperScope$2,
   createRovingFocusGroupScope$1
 ]);
-var usePopperScope$3 = createPopperScope$1();
+var usePopperScope$4 = createPopperScope$2();
 var useRovingFocusGroupScope$2 = createRovingFocusGroupScope$1();
 var [MenuProvider, useMenuContext] = createMenuContext(MENU_NAME);
 var [MenuRootProvider, useMenuRootContext] = createMenuContext(MENU_NAME);
 var Menu = (props) => {
   const { __scopeMenu, open = false, children, dir, onOpenChange, modal = true } = props;
-  const popperScope = usePopperScope$3(__scopeMenu);
+  const popperScope = usePopperScope$4(__scopeMenu);
   const [content, setContent] = React.useState(null);
   const isUsingKeyboardRef = React.useRef(false);
   const handleOpenChange = useCallbackRef$2(onOpenChange);
@@ -92501,7 +92501,7 @@ var Menu = (props) => {
       document.removeEventListener("pointermove", handlePointer, { capture: true });
     };
   }, []);
-  return /* @__PURE__ */ jsx(Root2$8, { ...popperScope, children: /* @__PURE__ */ jsx(
+  return /* @__PURE__ */ jsx(Root2$a, { ...popperScope, children: /* @__PURE__ */ jsx(
     MenuProvider,
     {
       scope: __scopeMenu,
@@ -92524,39 +92524,39 @@ var Menu = (props) => {
   ) });
 };
 Menu.displayName = MENU_NAME;
-var ANCHOR_NAME$2 = "MenuAnchor";
+var ANCHOR_NAME$3 = "MenuAnchor";
 var MenuAnchor = React.forwardRef(
   (props, forwardedRef) => {
     const { __scopeMenu, ...anchorProps } = props;
-    const popperScope = usePopperScope$3(__scopeMenu);
-    return /* @__PURE__ */ jsx(Anchor$2, { ...popperScope, ...anchorProps, ref: forwardedRef });
+    const popperScope = usePopperScope$4(__scopeMenu);
+    return /* @__PURE__ */ jsx(Anchor$3, { ...popperScope, ...anchorProps, ref: forwardedRef });
   }
 );
-MenuAnchor.displayName = ANCHOR_NAME$2;
-var PORTAL_NAME$7 = "MenuPortal";
-var [PortalProvider$2, usePortalContext$2] = createMenuContext(PORTAL_NAME$7, {
+MenuAnchor.displayName = ANCHOR_NAME$3;
+var PORTAL_NAME$8 = "MenuPortal";
+var [PortalProvider$3, usePortalContext$3] = createMenuContext(PORTAL_NAME$8, {
   forceMount: void 0
 });
 var MenuPortal = (props) => {
   const { __scopeMenu, forceMount, children, container } = props;
-  const context = useMenuContext(PORTAL_NAME$7, __scopeMenu);
-  return /* @__PURE__ */ jsx(PortalProvider$2, { scope: __scopeMenu, forceMount, children: /* @__PURE__ */ jsx(Presence$3, { present: forceMount || context.open, children: /* @__PURE__ */ jsx(Portal$6, { asChild: true, container, children }) }) });
+  const context = useMenuContext(PORTAL_NAME$8, __scopeMenu);
+  return /* @__PURE__ */ jsx(PortalProvider$3, { scope: __scopeMenu, forceMount, children: /* @__PURE__ */ jsx(Presence$3, { present: forceMount || context.open, children: /* @__PURE__ */ jsx(Portal$7, { asChild: true, container, children }) }) });
 };
-MenuPortal.displayName = PORTAL_NAME$7;
-var CONTENT_NAME$7 = "MenuContent";
-var [MenuContentProvider, useMenuContentContext] = createMenuContext(CONTENT_NAME$7);
+MenuPortal.displayName = PORTAL_NAME$8;
+var CONTENT_NAME$a = "MenuContent";
+var [MenuContentProvider, useMenuContentContext] = createMenuContext(CONTENT_NAME$a);
 var MenuContent = React.forwardRef(
   (props, forwardedRef) => {
-    const portalContext = usePortalContext$2(CONTENT_NAME$7, props.__scopeMenu);
+    const portalContext = usePortalContext$3(CONTENT_NAME$a, props.__scopeMenu);
     const { forceMount = portalContext.forceMount, ...contentProps } = props;
-    const context = useMenuContext(CONTENT_NAME$7, props.__scopeMenu);
-    const rootContext = useMenuRootContext(CONTENT_NAME$7, props.__scopeMenu);
+    const context = useMenuContext(CONTENT_NAME$a, props.__scopeMenu);
+    const rootContext = useMenuRootContext(CONTENT_NAME$a, props.__scopeMenu);
     return /* @__PURE__ */ jsx(Collection$3.Provider, { scope: props.__scopeMenu, children: /* @__PURE__ */ jsx(Presence$3, { present: forceMount || context.open, children: /* @__PURE__ */ jsx(Collection$3.Slot, { scope: props.__scopeMenu, children: rootContext.modal ? /* @__PURE__ */ jsx(MenuRootContentModal, { ...contentProps, ref: forwardedRef }) : /* @__PURE__ */ jsx(MenuRootContentNonModal, { ...contentProps, ref: forwardedRef }) }) }) });
   }
 );
 var MenuRootContentModal = React.forwardRef(
   (props, forwardedRef) => {
-    const context = useMenuContext(CONTENT_NAME$7, props.__scopeMenu);
+    const context = useMenuContext(CONTENT_NAME$a, props.__scopeMenu);
     const ref = React.useRef(null);
     const composedRefs = useComposedRefs$1(forwardedRef, ref);
     React.useEffect(() => {
@@ -92582,7 +92582,7 @@ var MenuRootContentModal = React.forwardRef(
   }
 );
 var MenuRootContentNonModal = React.forwardRef((props, forwardedRef) => {
-  const context = useMenuContext(CONTENT_NAME$7, props.__scopeMenu);
+  const context = useMenuContext(CONTENT_NAME$a, props.__scopeMenu);
   return /* @__PURE__ */ jsx(
     MenuContentImpl,
     {
@@ -92614,9 +92614,9 @@ var MenuContentImpl = React.forwardRef(
       disableOutsideScroll,
       ...contentProps
     } = props;
-    const context = useMenuContext(CONTENT_NAME$7, __scopeMenu);
-    const rootContext = useMenuRootContext(CONTENT_NAME$7, __scopeMenu);
-    const popperScope = usePopperScope$3(__scopeMenu);
+    const context = useMenuContext(CONTENT_NAME$a, __scopeMenu);
+    const rootContext = useMenuRootContext(CONTENT_NAME$a, __scopeMenu);
+    const popperScope = usePopperScope$4(__scopeMenu);
     const rovingFocusGroupScope = useRovingFocusGroupScope$2(__scopeMenu);
     const getItems = useCollection$3(__scopeMenu);
     const [currentItemId, setCurrentItemId] = React.useState(null);
@@ -92705,7 +92705,7 @@ var MenuContentImpl = React.forwardRef(
                 onInteractOutside,
                 onDismiss,
                 children: /* @__PURE__ */ jsx(
-                  Root$d,
+                  Root$f,
                   {
                     asChild: true,
                     ...rovingFocusGroupScope,
@@ -92719,7 +92719,7 @@ var MenuContentImpl = React.forwardRef(
                     }),
                     preventScrollOnEntryFocus: true,
                     children: /* @__PURE__ */ jsx(
-                      Content$2,
+                      Content$3,
                       {
                         role: "menu",
                         "aria-orientation": "vertical",
@@ -92778,7 +92778,7 @@ var MenuContentImpl = React.forwardRef(
     );
   }
 );
-MenuContent.displayName = CONTENT_NAME$7;
+MenuContent.displayName = CONTENT_NAME$a;
 var GROUP_NAME$3 = "MenuGroup";
 var MenuGroup = React.forwardRef(
   (props, forwardedRef) => {
@@ -93003,15 +93003,15 @@ var MenuSeparator = React.forwardRef(
   }
 );
 MenuSeparator.displayName = SEPARATOR_NAME$2;
-var ARROW_NAME$5 = "MenuArrow";
+var ARROW_NAME$7 = "MenuArrow";
 var MenuArrow = React.forwardRef(
   (props, forwardedRef) => {
     const { __scopeMenu, ...arrowProps } = props;
-    const popperScope = usePopperScope$3(__scopeMenu);
-    return /* @__PURE__ */ jsx(Arrow$2, { ...popperScope, ...arrowProps, ref: forwardedRef });
+    const popperScope = usePopperScope$4(__scopeMenu);
+    return /* @__PURE__ */ jsx(Arrow$4, { ...popperScope, ...arrowProps, ref: forwardedRef });
   }
 );
-MenuArrow.displayName = ARROW_NAME$5;
+MenuArrow.displayName = ARROW_NAME$7;
 var SUB_NAME = "MenuSub";
 var [MenuSubProvider, useMenuSubContext] = createMenuContext(SUB_NAME);
 var SUB_TRIGGER_NAME$1 = "MenuSubTrigger";
@@ -93118,10 +93118,10 @@ MenuSubTrigger.displayName = SUB_TRIGGER_NAME$1;
 var SUB_CONTENT_NAME$1 = "MenuSubContent";
 var MenuSubContent = React.forwardRef(
   (props, forwardedRef) => {
-    const portalContext = usePortalContext$2(CONTENT_NAME$7, props.__scopeMenu);
+    const portalContext = usePortalContext$3(CONTENT_NAME$a, props.__scopeMenu);
     const { forceMount = portalContext.forceMount, ...subContentProps } = props;
-    const context = useMenuContext(CONTENT_NAME$7, props.__scopeMenu);
-    const rootContext = useMenuRootContext(CONTENT_NAME$7, props.__scopeMenu);
+    const context = useMenuContext(CONTENT_NAME$a, props.__scopeMenu);
+    const rootContext = useMenuRootContext(CONTENT_NAME$a, props.__scopeMenu);
     const subContext = useMenuSubContext(SUB_CONTENT_NAME$1, props.__scopeMenu);
     const ref = React.useRef(null);
     const composedRefs = useComposedRefs$1(forwardedRef, ref);
@@ -93218,8 +93218,8 @@ function whenMouse(handler) {
 }
 var Root3$1 = Menu;
 var Anchor2$1 = MenuAnchor;
-var Portal$5 = MenuPortal;
-var Content2$5 = MenuContent;
+var Portal$6 = MenuPortal;
+var Content2$6 = MenuContent;
 var Group = MenuGroup;
 var Label$4 = MenuLabel;
 var Item2$2 = MenuItem;
@@ -93272,11 +93272,11 @@ var DropdownMenu$1 = (props) => {
   );
 };
 DropdownMenu$1.displayName = DROPDOWN_MENU_NAME;
-var TRIGGER_NAME$5 = "DropdownMenuTrigger";
+var TRIGGER_NAME$7 = "DropdownMenuTrigger";
 var DropdownMenuTrigger$1 = React.forwardRef(
   (props, forwardedRef) => {
     const { __scopeDropdownMenu, disabled = false, ...triggerProps } = props;
-    const context = useDropdownMenuContext(TRIGGER_NAME$5, __scopeDropdownMenu);
+    const context = useDropdownMenuContext(TRIGGER_NAME$7, __scopeDropdownMenu);
     const menuScope = useMenuScope(__scopeDropdownMenu);
     return /* @__PURE__ */ jsx(Anchor2$1, { asChild: true, ...menuScope, children: /* @__PURE__ */ jsx(
       Primitive$4.button,
@@ -93307,23 +93307,23 @@ var DropdownMenuTrigger$1 = React.forwardRef(
     ) });
   }
 );
-DropdownMenuTrigger$1.displayName = TRIGGER_NAME$5;
-var PORTAL_NAME$6 = "DropdownMenuPortal";
+DropdownMenuTrigger$1.displayName = TRIGGER_NAME$7;
+var PORTAL_NAME$7 = "DropdownMenuPortal";
 var DropdownMenuPortal = (props) => {
   const { __scopeDropdownMenu, ...portalProps } = props;
   const menuScope = useMenuScope(__scopeDropdownMenu);
-  return /* @__PURE__ */ jsx(Portal$5, { ...menuScope, ...portalProps });
+  return /* @__PURE__ */ jsx(Portal$6, { ...menuScope, ...portalProps });
 };
-DropdownMenuPortal.displayName = PORTAL_NAME$6;
-var CONTENT_NAME$6 = "DropdownMenuContent";
+DropdownMenuPortal.displayName = PORTAL_NAME$7;
+var CONTENT_NAME$9 = "DropdownMenuContent";
 var DropdownMenuContent$1 = React.forwardRef(
   (props, forwardedRef) => {
     const { __scopeDropdownMenu, ...contentProps } = props;
-    const context = useDropdownMenuContext(CONTENT_NAME$6, __scopeDropdownMenu);
+    const context = useDropdownMenuContext(CONTENT_NAME$9, __scopeDropdownMenu);
     const menuScope = useMenuScope(__scopeDropdownMenu);
     const hasInteractedOutsideRef = React.useRef(false);
     return /* @__PURE__ */ jsx(
-      Content2$5,
+      Content2$6,
       {
         id: context.contentId,
         "aria-labelledby": context.triggerId,
@@ -93356,7 +93356,7 @@ var DropdownMenuContent$1 = React.forwardRef(
     );
   }
 );
-DropdownMenuContent$1.displayName = CONTENT_NAME$6;
+DropdownMenuContent$1.displayName = CONTENT_NAME$9;
 var GROUP_NAME$2 = "DropdownMenuGroup";
 var DropdownMenuGroup = React.forwardRef(
   (props, forwardedRef) => {
@@ -93419,7 +93419,7 @@ var DropdownMenuSeparator$1 = React.forwardRef((props, forwardedRef) => {
   return /* @__PURE__ */ jsx(Separator$3, { ...menuScope, ...separatorProps, ref: forwardedRef });
 });
 DropdownMenuSeparator$1.displayName = SEPARATOR_NAME$1;
-var ARROW_NAME$4 = "DropdownMenuArrow";
+var ARROW_NAME$6 = "DropdownMenuArrow";
 var DropdownMenuArrow = React.forwardRef(
   (props, forwardedRef) => {
     const { __scopeDropdownMenu, ...arrowProps } = props;
@@ -93427,7 +93427,7 @@ var DropdownMenuArrow = React.forwardRef(
     return /* @__PURE__ */ jsx(Arrow2$1, { ...menuScope, ...arrowProps, ref: forwardedRef });
   }
 );
-DropdownMenuArrow.displayName = ARROW_NAME$4;
+DropdownMenuArrow.displayName = ARROW_NAME$6;
 var SUB_TRIGGER_NAME = "DropdownMenuSubTrigger";
 var DropdownMenuSubTrigger = React.forwardRef((props, forwardedRef) => {
   const { __scopeDropdownMenu, ...subTriggerProps } = props;
@@ -93460,10 +93460,10 @@ var DropdownMenuSubContent = React.forwardRef((props, forwardedRef) => {
   );
 });
 DropdownMenuSubContent.displayName = SUB_CONTENT_NAME;
-var Root2$7 = DropdownMenu$1;
-var Trigger$4 = DropdownMenuTrigger$1;
+var Root2$9 = DropdownMenu$1;
+var Trigger$5 = DropdownMenuTrigger$1;
 var Portal2$1 = DropdownMenuPortal;
-var Content2$4 = DropdownMenuContent$1;
+var Content2$5 = DropdownMenuContent$1;
 var Item2$1 = DropdownMenuItem$1;
 var Separator2 = DropdownMenuSeparator$1;
 
@@ -93473,14 +93473,14 @@ function useFloatingPortalContainer() {
 }
 
 function DropdownMenu({ ...props }) {
-    return jsx(Root2$7, { "data-slot": "dropdown-menu", ...props });
+    return jsx(Root2$9, { "data-slot": "dropdown-menu", ...props });
 }
 function DropdownMenuTrigger({ ...props }) {
-    return jsx(Trigger$4, { "data-slot": "dropdown-menu-trigger", ...props });
+    return jsx(Trigger$5, { "data-slot": "dropdown-menu-trigger", ...props });
 }
 function DropdownMenuContent({ className, sideOffset = 4, ...props }) {
     const portalContainer = useFloatingPortalContainer();
-    return (jsx(Portal2$1, { container: portalContainer !== null && portalContainer !== void 0 ? portalContainer : undefined, children: jsx(Content2$4, { "data-slot": "dropdown-menu-content", "data-iblai-dialog-interaction-layer": true, sideOffset: sideOffset, className: cn('bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 max-h-(--radix-dropdown-menu-content-available-height) min-w-[8rem] origin-(--radix-dropdown-menu-content-transform-origin) overflow-x-hidden overflow-y-auto rounded-md border p-1 shadow-md', className), ...props }) }));
+    return (jsx(Portal2$1, { container: portalContainer !== null && portalContainer !== void 0 ? portalContainer : undefined, children: jsx(Content2$5, { "data-slot": "dropdown-menu-content", "data-iblai-dialog-interaction-layer": true, sideOffset: sideOffset, className: cn('bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 max-h-(--radix-dropdown-menu-content-available-height) min-w-[8rem] origin-(--radix-dropdown-menu-content-transform-origin) overflow-x-hidden overflow-y-auto rounded-md border p-1 shadow-md', className), ...props }) }));
 }
 function DropdownMenuItem({ className, inset, variant = 'default', ...props }) {
     return (jsx(Item2$1, { "data-slot": "dropdown-menu-item", "data-inset": inset, "data-variant": variant, className: cn("focus:bg-accent focus:text-accent-foreground data-[variant=destructive]:text-destructive data-[variant=destructive]:focus:bg-destructive/10 dark:data-[variant=destructive]:focus:bg-destructive/20 data-[variant=destructive]:focus:text-destructive data-[variant=destructive]:*:[svg]:!text-destructive [&_svg:not([class*='text-'])]:text-muted-foreground relative flex cursor-default items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 data-[inset]:pl-8 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4", className), ...props }));
@@ -93833,12 +93833,12 @@ function useImageLoadingStatus(src, { referrerPolicy, crossOrigin }) {
   }, [image, crossOrigin, referrerPolicy]);
   return loadingStatus;
 }
-var Root$c = Avatar$1;
+var Root$e = Avatar$1;
 var Image$2 = AvatarImage$1;
 var Fallback = AvatarFallback$1;
 
-const Avatar = React.forwardRef(({ className, onClick, ...props }, ref) => (jsx(Root$c, { ref: ref, className: cn("relative flex h-10 w-10 shrink-0 overflow-hidden rounded-full", className), onClick: onClick, ...props })));
-Avatar.displayName = Root$c.displayName;
+const Avatar = React.forwardRef(({ className, onClick, ...props }, ref) => (jsx(Root$e, { ref: ref, className: cn("relative flex h-10 w-10 shrink-0 overflow-hidden rounded-full", className), onClick: onClick, ...props })));
+Avatar.displayName = Root$e.displayName;
 const AvatarImage = React.forwardRef(({ className, onClick, ...props }, ref) => (jsx(Image$2, { ref: ref, className: cn("aspect-square h-full w-full cursor-pointer rounded-full border-0 object-cover", // Changed object-center to object-cover for better image fitting
     className), onClick: onClick, ...props })));
 AvatarImage.displayName = "AvatarImage";
@@ -93881,7 +93881,7 @@ function usePrevious$1(value) {
 }
 
 // packages/react/visually-hidden/src/visually-hidden.tsx
-var NAME$7 = "VisuallyHidden";
+var NAME$8 = "VisuallyHidden";
 var VisuallyHidden$2 = React.forwardRef(
   (props, forwardedRef) => {
     return /* @__PURE__ */ jsx(
@@ -93907,7 +93907,7 @@ var VisuallyHidden$2 = React.forwardRef(
     );
   }
 );
-VisuallyHidden$2.displayName = NAME$7;
+VisuallyHidden$2.displayName = NAME$8;
 
 var OPEN_KEYS = [" ", "Enter", "ArrowUp", "ArrowDown"];
 var SELECTION_KEYS = [" ", "Enter"];
@@ -93915,9 +93915,9 @@ var SELECT_NAME = "Select";
 var [Collection$2, useCollection$2, createCollectionScope$2] = createCollection$2(SELECT_NAME);
 var [createSelectContext] = createContextScope$1(SELECT_NAME, [
   createCollectionScope$2,
-  createPopperScope$1
+  createPopperScope$2
 ]);
-var usePopperScope$2 = createPopperScope$1();
+var usePopperScope$3 = createPopperScope$2();
 var [SelectProvider, useSelectContext] = createSelectContext(SELECT_NAME);
 var [SelectNativeOptionsProvider, useSelectNativeOptionsContext] = createSelectContext(SELECT_NAME);
 var Select$2 = (props) => {
@@ -93937,7 +93937,7 @@ var Select$2 = (props) => {
     required,
     form
   } = props;
-  const popperScope = usePopperScope$2(__scopeSelect);
+  const popperScope = usePopperScope$3(__scopeSelect);
   const [trigger, setTrigger] = React.useState(null);
   const [valueNode, setValueNode] = React.useState(null);
   const [valueNodeHasChildren, setValueNodeHasChildren] = React.useState(false);
@@ -93956,7 +93956,7 @@ var Select$2 = (props) => {
   const isFormControl = trigger ? form || !!trigger.closest("form") : true;
   const [nativeOptionsSet, setNativeOptionsSet] = React.useState(/* @__PURE__ */ new Set());
   const nativeSelectKey = Array.from(nativeOptionsSet).map((option) => option.props.value).join(";");
-  return /* @__PURE__ */ jsx(Root2$8, { ...popperScope, children: /* @__PURE__ */ jsxs(
+  return /* @__PURE__ */ jsx(Root2$a, { ...popperScope, children: /* @__PURE__ */ jsxs(
     SelectProvider,
     {
       required,
@@ -94017,12 +94017,12 @@ var Select$2 = (props) => {
   ) });
 };
 Select$2.displayName = SELECT_NAME;
-var TRIGGER_NAME$4 = "SelectTrigger";
+var TRIGGER_NAME$6 = "SelectTrigger";
 var SelectTrigger$1 = React.forwardRef(
   (props, forwardedRef) => {
     const { __scopeSelect, disabled = false, ...triggerProps } = props;
-    const popperScope = usePopperScope$2(__scopeSelect);
-    const context = useSelectContext(TRIGGER_NAME$4, __scopeSelect);
+    const popperScope = usePopperScope$3(__scopeSelect);
+    const context = useSelectContext(TRIGGER_NAME$6, __scopeSelect);
     const isDisabled = context.disabled || disabled;
     const composedRefs = useComposedRefs$1(forwardedRef, context.onTriggerChange);
     const getItems = useCollection$2(__scopeSelect);
@@ -94047,7 +94047,7 @@ var SelectTrigger$1 = React.forwardRef(
         };
       }
     };
-    return /* @__PURE__ */ jsx(Anchor$2, { asChild: true, ...popperScope, children: /* @__PURE__ */ jsx(
+    return /* @__PURE__ */ jsx(Anchor$3, { asChild: true, ...popperScope, children: /* @__PURE__ */ jsx(
       Primitive$4.button,
       {
         type: "button",
@@ -94094,7 +94094,7 @@ var SelectTrigger$1 = React.forwardRef(
     ) });
   }
 );
-SelectTrigger$1.displayName = TRIGGER_NAME$4;
+SelectTrigger$1.displayName = TRIGGER_NAME$6;
 var VALUE_NAME = "SelectValue";
 var SelectValue$1 = React.forwardRef(
   (props, forwardedRef) => {
@@ -94126,15 +94126,15 @@ var SelectIcon = React.forwardRef(
   }
 );
 SelectIcon.displayName = ICON_NAME;
-var PORTAL_NAME$5 = "SelectPortal";
+var PORTAL_NAME$6 = "SelectPortal";
 var SelectPortal = (props) => {
-  return /* @__PURE__ */ jsx(Portal$6, { asChild: true, ...props });
+  return /* @__PURE__ */ jsx(Portal$7, { asChild: true, ...props });
 };
-SelectPortal.displayName = PORTAL_NAME$5;
-var CONTENT_NAME$5 = "SelectContent";
+SelectPortal.displayName = PORTAL_NAME$6;
+var CONTENT_NAME$8 = "SelectContent";
 var SelectContent$1 = React.forwardRef(
   (props, forwardedRef) => {
-    const context = useSelectContext(CONTENT_NAME$5, props.__scopeSelect);
+    const context = useSelectContext(CONTENT_NAME$8, props.__scopeSelect);
     const [fragment, setFragment] = React.useState();
     useLayoutEffect2$1(() => {
       setFragment(new DocumentFragment());
@@ -94149,9 +94149,9 @@ var SelectContent$1 = React.forwardRef(
     return /* @__PURE__ */ jsx(SelectContentImpl, { ...props, ref: forwardedRef });
   }
 );
-SelectContent$1.displayName = CONTENT_NAME$5;
+SelectContent$1.displayName = CONTENT_NAME$8;
 var CONTENT_MARGIN = 10;
-var [SelectContentProvider, useSelectContentContext] = createSelectContext(CONTENT_NAME$5);
+var [SelectContentProvider, useSelectContentContext] = createSelectContext(CONTENT_NAME$8);
 var CONTENT_IMPL_NAME = "SelectContentImpl";
 var Slot$2 = createSlot$1("SelectContent.RemoveScroll");
 var SelectContentImpl = React.forwardRef(
@@ -94177,7 +94177,7 @@ var SelectContentImpl = React.forwardRef(
       //
       ...contentProps
     } = props;
-    const context = useSelectContext(CONTENT_NAME$5, __scopeSelect);
+    const context = useSelectContext(CONTENT_NAME$8, __scopeSelect);
     const [content, setContent] = React.useState(null);
     const [viewport, setViewport] = React.useState(null);
     const composedRefs = useComposedRefs$1(forwardedRef, (node) => setContent(node));
@@ -94390,8 +94390,8 @@ SelectContentImpl.displayName = CONTENT_IMPL_NAME;
 var ITEM_ALIGNED_POSITION_NAME = "SelectItemAlignedPosition";
 var SelectItemAlignedPosition = React.forwardRef((props, forwardedRef) => {
   const { __scopeSelect, onPlaced, ...popperProps } = props;
-  const context = useSelectContext(CONTENT_NAME$5, __scopeSelect);
-  const contentContext = useSelectContentContext(CONTENT_NAME$5, __scopeSelect);
+  const context = useSelectContext(CONTENT_NAME$8, __scopeSelect);
+  const contentContext = useSelectContentContext(CONTENT_NAME$8, __scopeSelect);
   const [contentWrapper, setContentWrapper] = React.useState(null);
   const [content, setContent] = React.useState(null);
   const composedRefs = useComposedRefs$1(forwardedRef, (node) => setContent(node));
@@ -94559,9 +94559,9 @@ var SelectPopperPosition = React.forwardRef((props, forwardedRef) => {
     collisionPadding = CONTENT_MARGIN,
     ...popperProps
   } = props;
-  const popperScope = usePopperScope$2(__scopeSelect);
+  const popperScope = usePopperScope$3(__scopeSelect);
   return /* @__PURE__ */ jsx(
-    Content$2,
+    Content$3,
     {
       ...popperScope,
       ...popperProps,
@@ -94585,7 +94585,7 @@ var SelectPopperPosition = React.forwardRef((props, forwardedRef) => {
   );
 });
 SelectPopperPosition.displayName = POPPER_POSITION_NAME;
-var [SelectViewportProvider, useSelectViewportContext] = createSelectContext(CONTENT_NAME$5, {});
+var [SelectViewportProvider, useSelectViewportContext] = createSelectContext(CONTENT_NAME$8, {});
 var VIEWPORT_NAME$2 = "SelectViewport";
 var SelectViewport = React.forwardRef(
   (props, forwardedRef) => {
@@ -94934,17 +94934,17 @@ var SelectSeparator$1 = React.forwardRef(
   }
 );
 SelectSeparator$1.displayName = SEPARATOR_NAME;
-var ARROW_NAME$3 = "SelectArrow";
+var ARROW_NAME$5 = "SelectArrow";
 var SelectArrow = React.forwardRef(
   (props, forwardedRef) => {
     const { __scopeSelect, ...arrowProps } = props;
-    const popperScope = usePopperScope$2(__scopeSelect);
-    const context = useSelectContext(ARROW_NAME$3, __scopeSelect);
-    const contentContext = useSelectContentContext(ARROW_NAME$3, __scopeSelect);
-    return context.open && contentContext.position === "popper" ? /* @__PURE__ */ jsx(Arrow$2, { ...popperScope, ...arrowProps, ref: forwardedRef }) : null;
+    const popperScope = usePopperScope$3(__scopeSelect);
+    const context = useSelectContext(ARROW_NAME$5, __scopeSelect);
+    const contentContext = useSelectContentContext(ARROW_NAME$5, __scopeSelect);
+    return context.open && contentContext.position === "popper" ? /* @__PURE__ */ jsx(Arrow$4, { ...popperScope, ...arrowProps, ref: forwardedRef }) : null;
   }
 );
-SelectArrow.displayName = ARROW_NAME$3;
+SelectArrow.displayName = ARROW_NAME$5;
 function shouldShowPlaceholder(value) {
   return value === "" || value === void 0;
 }
@@ -95012,12 +95012,12 @@ function findNextItem(items, search, currentItem) {
 function wrapArray$1(array, startIndex) {
   return array.map((_, index) => array[(startIndex + index) % array.length]);
 }
-var Root2$6 = Select$2;
-var Trigger$3 = SelectTrigger$1;
+var Root2$8 = Select$2;
+var Trigger$4 = SelectTrigger$1;
 var Value = SelectValue$1;
 var Icon$3 = SelectIcon;
-var Portal$4 = SelectPortal;
-var Content2$3 = SelectContent$1;
+var Portal$5 = SelectPortal;
+var Content2$4 = SelectContent$1;
 var Viewport$2 = SelectViewport;
 var Label$3 = SelectLabel$1;
 var Item$2 = SelectItem$1;
@@ -95027,22 +95027,22 @@ var ScrollUpButton = SelectScrollUpButton$1;
 var ScrollDownButton = SelectScrollDownButton$1;
 var Separator$2 = SelectSeparator$1;
 
-const Select$1 = Root2$6;
+const Select$1 = Root2$8;
 const SelectValue = Value;
-const SelectTrigger = React.forwardRef(({ className, children, ...props }, ref) => (jsxs(Trigger$3, { ref: ref, className: cn('border-input ring-offset-background data-[placeholder]:text-muted-foreground focus:ring-ring flex h-9 w-full items-center justify-between rounded-md border bg-transparent px-3 py-2 text-sm whitespace-nowrap focus:ring-1 focus:outline-none disabled:cursor-not-allowed disabled:opacity-50 [&>span]:line-clamp-1', className), ...props, children: [children, jsx(Icon$3, { asChild: true, children: jsx(ChevronDown, { className: "h-4 w-4 opacity-50" }) })] })));
-SelectTrigger.displayName = Trigger$3.displayName;
+const SelectTrigger = React.forwardRef(({ className, children, ...props }, ref) => (jsxs(Trigger$4, { ref: ref, className: cn('border-input ring-offset-background data-[placeholder]:text-muted-foreground focus:ring-ring flex h-9 w-full items-center justify-between rounded-md border bg-transparent px-3 py-2 text-sm whitespace-nowrap focus:ring-1 focus:outline-none disabled:cursor-not-allowed disabled:opacity-50 [&>span]:line-clamp-1', className), ...props, children: [children, jsx(Icon$3, { asChild: true, children: jsx(ChevronDown, { className: "h-4 w-4 opacity-50" }) })] })));
+SelectTrigger.displayName = Trigger$4.displayName;
 const SelectScrollUpButton = React.forwardRef(({ className, ...props }, ref) => (jsx(ScrollUpButton, { ref: ref, className: cn('flex cursor-default items-center justify-center py-1', className), ...props, children: jsx(ChevronUp, { className: "h-4 w-4" }) })));
 SelectScrollUpButton.displayName = ScrollUpButton.displayName;
 const SelectScrollDownButton = React.forwardRef(({ className, ...props }, ref) => (jsx(ScrollDownButton, { ref: ref, className: cn('flex cursor-default items-center justify-center py-1', className), ...props, children: jsx(ChevronDown, { className: "h-4 w-4" }) })));
 SelectScrollDownButton.displayName = ScrollDownButton.displayName;
 const SelectContent = React.forwardRef(({ className, children, position = 'popper', ...props }, ref) => {
     const portalContainer = useFloatingPortalContainer();
-    return (jsx(Portal$4, { container: portalContainer !== null && portalContainer !== void 0 ? portalContainer : undefined, children: jsxs(Content2$3, { ref: ref, className: cn('bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 relative z-50 max-h-60 min-w-[8rem] overflow-hidden rounded-md border shadow-md', position === 'popper' &&
+    return (jsx(Portal$5, { container: portalContainer !== null && portalContainer !== void 0 ? portalContainer : undefined, children: jsxs(Content2$4, { ref: ref, className: cn('bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 relative z-50 max-h-60 min-w-[8rem] overflow-hidden rounded-md border shadow-md', position === 'popper' &&
                 'data-[side=bottom]:translate-y-1 data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=top]:-translate-y-1', className), position: position, ...props, children: [jsx(SelectScrollUpButton, {}), jsx(Viewport$2, { className: cn('h-[var(--radix-select-viewport-height)] overflow-auto p-1', position === 'popper' && 'w-full min-w-[var(--radix-select-trigger-width)]'), style: {
                         '--radix-select-viewport-height': 'var(--radix-select-content-available-height)',
                     }, children: children }), jsx(SelectScrollDownButton, {})] }) }));
 });
-SelectContent.displayName = Content2$3.displayName;
+SelectContent.displayName = Content2$4.displayName;
 const SelectLabel = React.forwardRef(({ className, ...props }, ref) => (jsx(Label$3, { ref: ref, className: cn('px-2 py-1.5 text-sm font-semibold', className), ...props })));
 SelectLabel.displayName = Label$3.displayName;
 const SelectItem = React.forwardRef(({ className, children, ...props }, ref) => (jsxs(Item$2, { ref: ref, className: cn('focus:bg-accent focus:text-accent-foreground relative flex w-full cursor-default items-center rounded-sm py-1.5 pr-8 pl-2 text-sm outline-none select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50', className), ...props, children: [jsx("span", { className: "absolute right-2 flex h-3.5 w-3.5 items-center justify-center", children: jsx(ItemIndicator, { children: jsx(Check, { className: "h-4 w-4" }) }) }), jsx(ItemText, { children: children })] })));
@@ -95445,18 +95445,18 @@ function handleAndDispatchCustomEvent$2(name, handler, detail, { discrete }) {
     target.dispatchEvent(event);
   }
 }
-var Root$b = DismissableLayer$1;
+var Root$d = DismissableLayer$1;
 var Branch$1 = DismissableLayerBranch$1;
 
-var PORTAL_NAME$4 = "Portal";
-var Portal$3 = React.forwardRef((props, forwardedRef) => {
+var PORTAL_NAME$5 = "Portal";
+var Portal$4 = React.forwardRef((props, forwardedRef) => {
   const { container: containerProp, ...portalProps } = props;
   const [mounted, setMounted] = React.useState(false);
   useLayoutEffect2$1(() => setMounted(true), []);
   const container = containerProp || mounted && globalThis?.document?.body;
   return container ? ReactDOM__default.createPortal(/* @__PURE__ */ jsx(Primitive$2.div, { ...portalProps, ref: forwardedRef }), container) : null;
 });
-Portal$3.displayName = PORTAL_NAME$4;
+Portal$4.displayName = PORTAL_NAME$5;
 
 function useStateMachine$3(initialState, machine) {
   return React.useReducer((state, event) => {
@@ -95663,7 +95663,7 @@ var VISUALLY_HIDDEN_STYLES$1 = Object.freeze({
   whiteSpace: "nowrap",
   wordWrap: "normal"
 });
-var NAME$6 = "VisuallyHidden";
+var NAME$7 = "VisuallyHidden";
 var VisuallyHidden$1 = React.forwardRef(
   (props, forwardedRef) => {
     return /* @__PURE__ */ jsx(
@@ -95676,7 +95676,7 @@ var VisuallyHidden$1 = React.forwardRef(
     );
   }
 );
-VisuallyHidden$1.displayName = NAME$6;
+VisuallyHidden$1.displayName = NAME$7;
 
 var PROVIDER_NAME$1 = "ToastProvider";
 var [Collection$1, useCollection$1, createCollectionScope$1] = createCollection$1("Toast");
@@ -96035,7 +96035,7 @@ var ToastImpl = React.forwardRef(
       ),
       /* @__PURE__ */ jsx(ToastInteractiveProvider, { scope: __scopeToast, onClose: handleClose, children: ReactDOM.createPortal(
         /* @__PURE__ */ jsx(Collection$1.ItemSlot, { scope: __scopeToast, children: /* @__PURE__ */ jsx(
-          Root$b,
+          Root$d,
           {
             asChild: true,
             onEscapeKeyDown: composeEventHandlers$1(onEscapeKeyDown, () => {
@@ -96139,7 +96139,7 @@ var ToastAnnounce = (props) => {
     const timer = window.setTimeout(() => setIsAnnounced(true), 1e3);
     return () => window.clearTimeout(timer);
   }, []);
-  return isAnnounced ? null : /* @__PURE__ */ jsx(Portal$3, { asChild: true, children: /* @__PURE__ */ jsx(VisuallyHidden$1, { ...announceProps, children: renderAnnounceText && /* @__PURE__ */ jsxs(Fragment$1, { children: [
+  return isAnnounced ? null : /* @__PURE__ */ jsx(Portal$4, { asChild: true, children: /* @__PURE__ */ jsx(VisuallyHidden$1, { ...announceProps, children: renderAnnounceText && /* @__PURE__ */ jsxs(Fragment$1, { children: [
     context.label,
     " ",
     children
@@ -96282,7 +96282,7 @@ function focusFirst$1(candidates) {
 }
 var Provider$1 = ToastProvider$1;
 var Viewport$1 = ToastViewport$1;
-var Root2$5 = Toast$1;
+var Root2$7 = Toast$1;
 var Title = ToastTitle$1;
 var Description = ToastDescription$1;
 var Action$1 = ToastAction$1;
@@ -96303,9 +96303,9 @@ const toastVariants = cva("group pointer-events-auto relative flex w-full items-
     },
 });
 const Toast = React.forwardRef(({ className, variant, ...props }, ref) => {
-    return (jsx(Root2$5, { ref: ref, className: cn(toastVariants({ variant }), className), ...props }));
+    return (jsx(Root2$7, { ref: ref, className: cn(toastVariants({ variant }), className), ...props }));
 });
-Toast.displayName = Root2$5.displayName;
+Toast.displayName = Root2$7.displayName;
 const ToastAction = React.forwardRef(({ className, ...props }, ref) => (jsx(Action$1, { ref: ref, className: cn("inline-flex h-8 shrink-0 items-center justify-center rounded-md border bg-transparent px-3 text-sm font-medium ring-offset-background transition-colors hover:bg-secondary focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 group-[.destructive]:border-muted/40 group-[.destructive]:hover:border-destructive/30 group-[.destructive]:hover:bg-destructive group-[.destructive]:hover:text-destructive-foreground group-[.destructive]:focus:ring-destructive", className), ...props })));
 ToastAction.displayName = Action$1.displayName;
 const ToastClose = React.forwardRef(({ className, ...props }, ref) => (jsx(Close, { ref: ref, className: cn("absolute right-2 top-2 rounded-md p-1 text-foreground/50 opacity-0 transition-opacity hover:text-foreground focus:opacity-100 focus:outline-none focus:ring-2 group-hover:opacity-100 group-[.destructive]:text-red-300 group-[.destructive]:hover:text-red-50 group-[.destructive]:focus:ring-red-400 group-[.destructive]:focus:ring-offset-red-600", className), "toast-close": "", ...props, children: jsx(X$2, { className: "h-4 w-4" }) })));
@@ -96350,7 +96350,7 @@ var Switch$1 = React.forwardRef(
           role: "switch",
           "aria-checked": checked,
           "aria-required": required,
-          "data-state": getState$3(checked),
+          "data-state": getState$4(checked),
           "data-disabled": disabled ? "" : void 0,
           disabled,
           value,
@@ -96391,7 +96391,7 @@ var SwitchThumb = React.forwardRef(
     return /* @__PURE__ */ jsx(
       Primitive$2.span,
       {
-        "data-state": getState$3(context.checked),
+        "data-state": getState$4(context.checked),
         "data-disabled": context.disabled ? "" : void 0,
         ...thumbProps,
         ref: forwardedRef
@@ -96450,14 +96450,14 @@ var SwitchBubbleInput = React.forwardRef(
   }
 );
 SwitchBubbleInput.displayName = BUBBLE_INPUT_NAME$1;
-function getState$3(checked) {
+function getState$4(checked) {
   return checked ? "checked" : "unchecked";
 }
-var Root$a = Switch$1;
+var Root$c = Switch$1;
 var Thumb = SwitchThumb;
 
-const Switch = React.forwardRef(({ className, ...props }, ref) => (jsx(Root$a, { className: cn("peer inline-flex h-5 w-9 shrink-0 cursor-pointer items-center rounded-full border-2 border-transparent shadow-sm transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:bg-primary data-[state=unchecked]:bg-input", className), ...props, ref: ref, children: jsx(Thumb, { className: cn("pointer-events-none block h-4 w-4 rounded-full bg-background shadow-lg ring-0 transition-transform data-[state=checked]:translate-x-4 data-[state=unchecked]:translate-x-0") }) })));
-Switch.displayName = Root$a.displayName;
+const Switch = React.forwardRef(({ className, ...props }, ref) => (jsx(Root$c, { className: cn("peer inline-flex h-5 w-9 shrink-0 cursor-pointer items-center rounded-full border-2 border-transparent shadow-sm transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:bg-primary data-[state=unchecked]:bg-input", className), ...props, ref: ref, children: jsx(Thumb, { className: cn("pointer-events-none block h-4 w-4 rounded-full bg-background shadow-lg ring-0 transition-transform data-[state=checked]:translate-x-4 data-[state=unchecked]:translate-x-0") }) })));
+Switch.displayName = Root$c.displayName;
 
 var TABS_NAME = "Tabs";
 var [createTabsContext] = createContextScope$1(TABS_NAME, [
@@ -96514,7 +96514,7 @@ var TabsList$1 = React.forwardRef(
     const context = useTabsContext(TAB_LIST_NAME, __scopeTabs);
     const rovingFocusGroupScope = useRovingFocusGroupScope$1(__scopeTabs);
     return /* @__PURE__ */ jsx(
-      Root$d,
+      Root$f,
       {
         asChild: true,
         ...rovingFocusGroupScope,
@@ -96535,11 +96535,11 @@ var TabsList$1 = React.forwardRef(
   }
 );
 TabsList$1.displayName = TAB_LIST_NAME;
-var TRIGGER_NAME$3 = "TabsTrigger";
+var TRIGGER_NAME$5 = "TabsTrigger";
 var TabsTrigger$1 = React.forwardRef(
   (props, forwardedRef) => {
     const { __scopeTabs, value, disabled = false, ...triggerProps } = props;
-    const context = useTabsContext(TRIGGER_NAME$3, __scopeTabs);
+    const context = useTabsContext(TRIGGER_NAME$5, __scopeTabs);
     const rovingFocusGroupScope = useRovingFocusGroupScope$1(__scopeTabs);
     const triggerId = makeTriggerId(context.baseId, value);
     const contentId = makeContentId(context.baseId, value);
@@ -96586,12 +96586,12 @@ var TabsTrigger$1 = React.forwardRef(
     );
   }
 );
-TabsTrigger$1.displayName = TRIGGER_NAME$3;
-var CONTENT_NAME$4 = "TabsContent";
+TabsTrigger$1.displayName = TRIGGER_NAME$5;
+var CONTENT_NAME$7 = "TabsContent";
 var TabsContent$1 = React.forwardRef(
   (props, forwardedRef) => {
     const { __scopeTabs, value, forceMount, children, ...contentProps } = props;
-    const context = useTabsContext(CONTENT_NAME$4, __scopeTabs);
+    const context = useTabsContext(CONTENT_NAME$7, __scopeTabs);
     const triggerId = makeTriggerId(context.baseId, value);
     const contentId = makeContentId(context.baseId, value);
     const isSelected = value === context.value;
@@ -96621,25 +96621,25 @@ var TabsContent$1 = React.forwardRef(
     ) });
   }
 );
-TabsContent$1.displayName = CONTENT_NAME$4;
+TabsContent$1.displayName = CONTENT_NAME$7;
 function makeTriggerId(baseId, value) {
   return `${baseId}-trigger-${value}`;
 }
 function makeContentId(baseId, value) {
   return `${baseId}-content-${value}`;
 }
-var Root2$4 = Tabs$1;
+var Root2$6 = Tabs$1;
 var List = TabsList$1;
-var Trigger$2 = TabsTrigger$1;
-var Content$1 = TabsContent$1;
+var Trigger$3 = TabsTrigger$1;
+var Content$2 = TabsContent$1;
 
-const Tabs = Root2$4;
+const Tabs = Root2$6;
 const TabsList = React.forwardRef(({ className, ...props }, ref) => (jsx(List, { ref: ref, className: cn("bg-muted text-muted-foreground inline-flex h-9 items-center justify-center rounded-lg p-1", className), ...props })));
 TabsList.displayName = List.displayName;
-const TabsTrigger = React.forwardRef(({ className, ...props }, ref) => (jsx(Trigger$2, { ref: ref, className: cn("ring-offset-background focus-visible:ring-ring data-[state=active]:bg-background data-[state=active]:text-foreground inline-flex items-center justify-center rounded-md px-3 py-1 text-sm font-medium whitespace-nowrap transition-all focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:outline-none disabled:pointer-events-none disabled:opacity-50 data-[state=active]:shadow", className), ...props })));
-TabsTrigger.displayName = Trigger$2.displayName;
-const TabsContent = React.forwardRef(({ className, ...props }, ref) => (jsx(Content$1, { ref: ref, className: cn("ring-offset-background focus-visible:ring-ring mt-2 focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:outline-none", className), ...props })));
-TabsContent.displayName = Content$1.displayName;
+const TabsTrigger = React.forwardRef(({ className, ...props }, ref) => (jsx(Trigger$3, { ref: ref, className: cn("ring-offset-background focus-visible:ring-ring data-[state=active]:bg-background data-[state=active]:text-foreground inline-flex items-center justify-center rounded-md px-3 py-1 text-sm font-medium whitespace-nowrap transition-all focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:outline-none disabled:pointer-events-none disabled:opacity-50 data-[state=active]:shadow", className), ...props })));
+TabsTrigger.displayName = Trigger$3.displayName;
+const TabsContent = React.forwardRef(({ className, ...props }, ref) => (jsx(Content$2, { ref: ref, className: cn("ring-offset-background focus-visible:ring-ring mt-2 focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:outline-none", className), ...props })));
+TabsContent.displayName = Content$2.displayName;
 
 /**
  * Default locale for the application
@@ -101872,6 +101872,26 @@ var ltiTabLabels$3 = {
 		toolError: "Something went wrong with the LTI tool"
 	}
 };
+var platformSidebar$3 = {
+	collapseSidebar: "Collapse sidebar",
+	expandSidebar: "Expand sidebar",
+	mainNavigation: "Main navigation",
+	notifications: "Notifications",
+	invites: "Invites",
+	management: "Management",
+	integrations: "Integrations",
+	monetization: "Monetization",
+	advanced: "Advanced",
+	support: "Support",
+	accountTabOrganization: "Organization",
+	accountTabBilling: "Billing",
+	accountDescOrganization: "Manage your organization settings.",
+	accountDescManagement: "Manage users and their permissions in the system.",
+	accountDescIntegrations: "Manage your integrations with other services.",
+	accountDescMonetization: "Configure paywalls, pricing, and revenue.",
+	accountDescAdvanced: "Configure advanced organization settings.",
+	accountDescBilling: "Manage your billing and subscription."
+};
 var en = {
 	accessTabAddAccess: accessTabAddAccess$3,
 	accessTabLabels: accessTabLabels$3,
@@ -102106,7 +102126,8 @@ var en = {
 	workflowsCreateWorkflowModal: workflowsCreateWorkflowModal$3,
 	workflowsDeleteWorkflowModal: workflowsDeleteWorkflowModal$3,
 	workflowsToolDialogs: workflowsToolDialogs$3,
-	ltiTabLabels: ltiTabLabels$3
+	ltiTabLabels: ltiTabLabels$3,
+	platformSidebar: platformSidebar$3
 };
 
 var accessTabAddAccess$2 = {
@@ -107154,6 +107175,26 @@ var ltiTabLabels$2 = {
 		toolError: "Un problème est survenu avec l'outil LTI"
 	}
 };
+var platformSidebar$2 = {
+	collapseSidebar: "Réduire la barre latérale",
+	expandSidebar: "Développer la barre latérale",
+	mainNavigation: "Navigation principale",
+	notifications: "Notifications",
+	invites: "Invitations",
+	management: "Gestion",
+	integrations: "Intégrations",
+	monetization: "Monétisation",
+	advanced: "Avancé",
+	support: "Support",
+	accountTabOrganization: "Organisation",
+	accountTabBilling: "Facturation",
+	accountDescOrganization: "Gérez les paramètres de votre organisation.",
+	accountDescManagement: "Gérez les utilisateurs et leurs permissions dans le système.",
+	accountDescIntegrations: "Gérez vos intégrations avec d'autres services.",
+	accountDescMonetization: "Configurez les paywalls, la tarification et les revenus.",
+	accountDescAdvanced: "Configurez les paramètres avancés de l'organisation.",
+	accountDescBilling: "Gérez votre facturation et votre abonnement."
+};
 var fr = {
 	accessTabAddAccess: accessTabAddAccess$2,
 	accessTabLabels: accessTabLabels$2,
@@ -107388,7 +107429,8 @@ var fr = {
 	workflowsCreateWorkflowModal: workflowsCreateWorkflowModal$2,
 	workflowsDeleteWorkflowModal: workflowsDeleteWorkflowModal$2,
 	workflowsToolDialogs: workflowsToolDialogs$2,
-	ltiTabLabels: ltiTabLabels$2
+	ltiTabLabels: ltiTabLabels$2,
+	platformSidebar: platformSidebar$2
 };
 
 var accessTabAddAccess$1 = {
@@ -112436,6 +112478,26 @@ var ltiTabLabels$1 = {
 		toolError: "Algo salió mal con la herramienta LTI"
 	}
 };
+var platformSidebar$1 = {
+	collapseSidebar: "Contraer barra lateral",
+	expandSidebar: "Expandir barra lateral",
+	mainNavigation: "Navegación principal",
+	notifications: "Notificaciones",
+	invites: "Invitaciones",
+	management: "Gestión",
+	integrations: "Integraciones",
+	monetization: "Monetización",
+	advanced: "Avanzado",
+	support: "Soporte",
+	accountTabOrganization: "Organización",
+	accountTabBilling: "Facturación",
+	accountDescOrganization: "Gestiona los ajustes de tu organización.",
+	accountDescManagement: "Gestiona los usuarios y sus permisos en el sistema.",
+	accountDescIntegrations: "Gestiona tus integraciones con otros servicios.",
+	accountDescMonetization: "Configura muros de pago, precios e ingresos.",
+	accountDescAdvanced: "Configura los ajustes avanzados de la organización.",
+	accountDescBilling: "Gestiona tu facturación y suscripción."
+};
 var es = {
 	accessTabAddAccess: accessTabAddAccess$1,
 	accessTabLabels: accessTabLabels$1,
@@ -112670,7 +112732,8 @@ var es = {
 	workflowsCreateWorkflowModal: workflowsCreateWorkflowModal$1,
 	workflowsDeleteWorkflowModal: workflowsDeleteWorkflowModal$1,
 	workflowsToolDialogs: workflowsToolDialogs$1,
-	ltiTabLabels: ltiTabLabels$1
+	ltiTabLabels: ltiTabLabels$1,
+	platformSidebar: platformSidebar$1
 };
 
 var accessTabAddAccess = {
@@ -117718,6 +117781,26 @@ var ltiTabLabels = {
 		toolError: "LTI 工具出现问题"
 	}
 };
+var platformSidebar = {
+	collapseSidebar: "收起侧边栏",
+	expandSidebar: "展开侧边栏",
+	mainNavigation: "主导航",
+	notifications: "通知",
+	invites: "邀请",
+	management: "管理",
+	integrations: "集成",
+	monetization: "变现",
+	advanced: "高级",
+	support: "支持",
+	accountTabOrganization: "组织",
+	accountTabBilling: "账单",
+	accountDescOrganization: "管理您的组织设置。",
+	accountDescManagement: "管理系统中的用户及其权限。",
+	accountDescIntegrations: "管理与其他服务的集成。",
+	accountDescMonetization: "配置付费墙、定价和收入。",
+	accountDescAdvanced: "配置组织的高级设置。",
+	accountDescBilling: "管理您的账单和订阅。"
+};
 var zh = {
 	accessTabAddAccess: accessTabAddAccess,
 	accessTabLabels: accessTabLabels,
@@ -117952,7 +118035,8 @@ var zh = {
 	workflowsCreateWorkflowModal: workflowsCreateWorkflowModal,
 	workflowsDeleteWorkflowModal: workflowsDeleteWorkflowModal,
 	workflowsToolDialogs: workflowsToolDialogs,
-	ltiTabLabels: ltiTabLabels
+	ltiTabLabels: ltiTabLabels,
+	platformSidebar: platformSidebar
 };
 
 /**
@@ -122884,8 +122968,8 @@ function handleAndDispatchCustomEvent(name, handler, detail, { discrete }) {
 }
 
 // src/arrow.tsx
-var NAME$5 = "Arrow";
-var Arrow$1 = React.forwardRef((props, forwardedRef) => {
+var NAME$6 = "Arrow";
+var Arrow$3 = React.forwardRef((props, forwardedRef) => {
   const { children, width = 10, height = 5, ...arrowProps } = props;
   return /* @__PURE__ */ jsx(
     Primitive$3.svg,
@@ -122900,23 +122984,23 @@ var Arrow$1 = React.forwardRef((props, forwardedRef) => {
     }
   );
 });
-Arrow$1.displayName = NAME$5;
-var Root$9 = Arrow$1;
+Arrow$3.displayName = NAME$6;
+var Root$b = Arrow$3;
 
-var POPPER_NAME = "Popper";
-var [createPopperContext, createPopperScope] = createContextScope$1(POPPER_NAME);
-var [PopperProvider, usePopperContext] = createPopperContext(POPPER_NAME);
-var Popper = (props) => {
+var POPPER_NAME$1 = "Popper";
+var [createPopperContext$1, createPopperScope$1] = createContextScope$1(POPPER_NAME$1);
+var [PopperProvider$1, usePopperContext$1] = createPopperContext$1(POPPER_NAME$1);
+var Popper$1 = (props) => {
   const { __scopePopper, children } = props;
   const [anchor, setAnchor] = React.useState(null);
-  return /* @__PURE__ */ jsx(PopperProvider, { scope: __scopePopper, anchor, onAnchorChange: setAnchor, children });
+  return /* @__PURE__ */ jsx(PopperProvider$1, { scope: __scopePopper, anchor, onAnchorChange: setAnchor, children });
 };
-Popper.displayName = POPPER_NAME;
-var ANCHOR_NAME$1 = "PopperAnchor";
-var PopperAnchor = React.forwardRef(
+Popper$1.displayName = POPPER_NAME$1;
+var ANCHOR_NAME$2 = "PopperAnchor";
+var PopperAnchor$1 = React.forwardRef(
   (props, forwardedRef) => {
     const { __scopePopper, virtualRef, ...anchorProps } = props;
-    const context = usePopperContext(ANCHOR_NAME$1, __scopePopper);
+    const context = usePopperContext$1(ANCHOR_NAME$2, __scopePopper);
     const ref = React.useRef(null);
     const composedRefs = useComposedRefs$1(forwardedRef, ref);
     React.useEffect(() => {
@@ -122925,10 +123009,10 @@ var PopperAnchor = React.forwardRef(
     return virtualRef ? null : /* @__PURE__ */ jsx(Primitive$3.div, { ...anchorProps, ref: composedRefs });
   }
 );
-PopperAnchor.displayName = ANCHOR_NAME$1;
-var CONTENT_NAME$3 = "PopperContent";
-var [PopperContentProvider, useContentContext] = createPopperContext(CONTENT_NAME$3);
-var PopperContent = React.forwardRef(
+PopperAnchor$1.displayName = ANCHOR_NAME$2;
+var CONTENT_NAME$6 = "PopperContent";
+var [PopperContentProvider$1, useContentContext$1] = createPopperContext$1(CONTENT_NAME$6);
+var PopperContent$1 = React.forwardRef(
   (props, forwardedRef) => {
     const {
       __scopePopper,
@@ -122946,7 +123030,7 @@ var PopperContent = React.forwardRef(
       onPlaced,
       ...contentProps
     } = props;
-    const context = usePopperContext(CONTENT_NAME$3, __scopePopper);
+    const context = usePopperContext$1(CONTENT_NAME$6, __scopePopper);
     const [content, setContent] = React.useState(null);
     const composedRefs = useComposedRefs$1(forwardedRef, (node) => setContent(node));
     const [arrow, setArrow] = React.useState(null);
@@ -122959,7 +123043,7 @@ var PopperContent = React.forwardRef(
     const hasExplicitBoundaries = boundary.length > 0;
     const detectOverflowOptions = {
       padding: collisionPadding,
-      boundary: boundary.filter(isNotNull),
+      boundary: boundary.filter(isNotNull$1),
       // with `strategy: 'fixed'`, this is the only way to get it to respect boundaries
       altBoundary: hasExplicitBoundaries
     };
@@ -122997,11 +123081,11 @@ var PopperContent = React.forwardRef(
           }
         }),
         arrow && arrow$2({ element: arrow, padding: arrowPadding }),
-        transformOrigin$1({ arrowWidth, arrowHeight }),
+        transformOrigin$2({ arrowWidth, arrowHeight }),
         hideWhenDetached && hide({ strategy: "referenceHidden", ...detectOverflowOptions })
       ]
     });
-    const [placedSide, placedAlign] = getSideAndAlignFromPlacement(placement);
+    const [placedSide, placedAlign] = getSideAndAlignFromPlacement$1(placement);
     const handlePlaced = useCallbackRef$2(onPlaced);
     useLayoutEffect2$1(() => {
       if (isPositioned) {
@@ -123040,7 +123124,7 @@ var PopperContent = React.forwardRef(
         },
         dir: props.dir,
         children: /* @__PURE__ */ jsx(
-          PopperContentProvider,
+          PopperContentProvider$1,
           {
             scope: __scopePopper,
             placedSide,
@@ -123069,18 +123153,18 @@ var PopperContent = React.forwardRef(
     );
   }
 );
-PopperContent.displayName = CONTENT_NAME$3;
-var ARROW_NAME$2 = "PopperArrow";
-var OPPOSITE_SIDE = {
+PopperContent$1.displayName = CONTENT_NAME$6;
+var ARROW_NAME$4 = "PopperArrow";
+var OPPOSITE_SIDE$1 = {
   top: "bottom",
   right: "left",
   bottom: "top",
   left: "right"
 };
-var PopperArrow = React.forwardRef(function PopperArrow2(props, forwardedRef) {
+var PopperArrow$1 = React.forwardRef(function PopperArrow2(props, forwardedRef) {
   const { __scopePopper, ...arrowProps } = props;
-  const contentContext = useContentContext(ARROW_NAME$2, __scopePopper);
-  const baseSide = OPPOSITE_SIDE[contentContext.placedSide];
+  const contentContext = useContentContext$1(ARROW_NAME$4, __scopePopper);
+  const baseSide = OPPOSITE_SIDE$1[contentContext.placedSide];
   return (
     // we have to use an extra wrapper because `ResizeObserver` (used by `useSize`)
     // doesn't report size as we'd expect on SVG elements.
@@ -123109,7 +123193,7 @@ var PopperArrow = React.forwardRef(function PopperArrow2(props, forwardedRef) {
           visibility: contentContext.shouldHideArrow ? "hidden" : void 0
         },
         children: /* @__PURE__ */ jsx(
-          Root$9,
+          Root$b,
           {
             ...arrowProps,
             ref: forwardedRef,
@@ -123124,11 +123208,11 @@ var PopperArrow = React.forwardRef(function PopperArrow2(props, forwardedRef) {
     )
   );
 });
-PopperArrow.displayName = ARROW_NAME$2;
-function isNotNull(value) {
+PopperArrow$1.displayName = ARROW_NAME$4;
+function isNotNull$1(value) {
   return value !== null;
 }
-var transformOrigin$1 = (options) => ({
+var transformOrigin$2 = (options) => ({
   name: "transformOrigin",
   options,
   fn(data) {
@@ -123137,7 +123221,7 @@ var transformOrigin$1 = (options) => ({
     const isArrowHidden = cannotCenterArrow;
     const arrowWidth = isArrowHidden ? 0 : options.arrowWidth;
     const arrowHeight = isArrowHidden ? 0 : options.arrowHeight;
-    const [placedSide, placedAlign] = getSideAndAlignFromPlacement(placement);
+    const [placedSide, placedAlign] = getSideAndAlignFromPlacement$1(placement);
     const noArrowAlign = { start: "0%", center: "50%", end: "100%" }[placedAlign];
     const arrowXCenter = (middlewareData.arrow?.x ?? 0) + arrowWidth / 2;
     const arrowYCenter = (middlewareData.arrow?.y ?? 0) + arrowHeight / 2;
@@ -123159,24 +123243,24 @@ var transformOrigin$1 = (options) => ({
     return { data: { x, y } };
   }
 });
-function getSideAndAlignFromPlacement(placement) {
+function getSideAndAlignFromPlacement$1(placement) {
   const [side, align = "center"] = placement.split("-");
   return [side, align];
 }
-var Root2$3 = Popper;
-var Anchor$1 = PopperAnchor;
-var Content = PopperContent;
-var Arrow = PopperArrow;
+var Root2$5 = Popper$1;
+var Anchor$2 = PopperAnchor$1;
+var Content$1 = PopperContent$1;
+var Arrow$2 = PopperArrow$1;
 
-var PORTAL_NAME$3 = "Portal";
-var Portal$2 = React.forwardRef((props, forwardedRef) => {
+var PORTAL_NAME$4 = "Portal";
+var Portal$3 = React.forwardRef((props, forwardedRef) => {
   const { container: containerProp, ...portalProps } = props;
   const [mounted, setMounted] = React.useState(false);
   useLayoutEffect2$1(() => setMounted(true), []);
   const container = containerProp || mounted && globalThis?.document?.body;
   return container ? ReactDOM__default.createPortal(/* @__PURE__ */ jsx(Primitive$3.div, { ...portalProps, ref: forwardedRef }), container) : null;
 });
-Portal$2.displayName = PORTAL_NAME$3;
+Portal$3.displayName = PORTAL_NAME$4;
 
 function useStateMachine$2(initialState, machine) {
   return React.useReducer((state, event) => {
@@ -123317,7 +123401,7 @@ var VISUALLY_HIDDEN_STYLES = Object.freeze({
   whiteSpace: "nowrap",
   wordWrap: "normal"
 });
-var NAME$4 = "VisuallyHidden";
+var NAME$5 = "VisuallyHidden";
 var VisuallyHidden = React.forwardRef(
   (props, forwardedRef) => {
     return /* @__PURE__ */ jsx(
@@ -123330,13 +123414,13 @@ var VisuallyHidden = React.forwardRef(
     );
   }
 );
-VisuallyHidden.displayName = NAME$4;
-var Root$8 = VisuallyHidden;
+VisuallyHidden.displayName = NAME$5;
+var Root$a = VisuallyHidden;
 
 var [createTooltipContext] = createContextScope$1("Tooltip", [
-  createPopperScope
+  createPopperScope$1
 ]);
-var usePopperScope$1 = createPopperScope();
+var usePopperScope$2 = createPopperScope$1();
 var PROVIDER_NAME = "TooltipProvider";
 var DEFAULT_DELAY_DURATION = 700;
 var TOOLTIP_OPEN = "tooltip.open";
@@ -123396,7 +123480,7 @@ var Tooltip$2 = (props) => {
     delayDuration: delayDurationProp
   } = props;
   const providerContext = useTooltipProviderContext(TOOLTIP_NAME, props.__scopeTooltip);
-  const popperScope = usePopperScope$1(__scopeTooltip);
+  const popperScope = usePopperScope$2(__scopeTooltip);
   const [trigger, setTrigger] = React.useState(null);
   const contentId = useId$1();
   const openTimerRef = React.useRef(0);
@@ -123447,7 +123531,7 @@ var Tooltip$2 = (props) => {
       }
     };
   }, []);
-  return /* @__PURE__ */ jsx(Root2$3, { ...popperScope, children: /* @__PURE__ */ jsx(
+  return /* @__PURE__ */ jsx(Root2$5, { ...popperScope, children: /* @__PURE__ */ jsx(
     TooltipContextProvider,
     {
       scope: __scopeTooltip,
@@ -123476,13 +123560,13 @@ var Tooltip$2 = (props) => {
   ) });
 };
 Tooltip$2.displayName = TOOLTIP_NAME;
-var TRIGGER_NAME$2 = "TooltipTrigger";
+var TRIGGER_NAME$4 = "TooltipTrigger";
 var TooltipTrigger$1 = React.forwardRef(
   (props, forwardedRef) => {
     const { __scopeTooltip, ...triggerProps } = props;
-    const context = useTooltipContext(TRIGGER_NAME$2, __scopeTooltip);
-    const providerContext = useTooltipProviderContext(TRIGGER_NAME$2, __scopeTooltip);
-    const popperScope = usePopperScope$1(__scopeTooltip);
+    const context = useTooltipContext(TRIGGER_NAME$4, __scopeTooltip);
+    const providerContext = useTooltipProviderContext(TRIGGER_NAME$4, __scopeTooltip);
+    const popperScope = usePopperScope$2(__scopeTooltip);
     const ref = React.useRef(null);
     const composedRefs = useComposedRefs$1(forwardedRef, ref, context.onTriggerChange);
     const isPointerDownRef = React.useRef(false);
@@ -123491,7 +123575,7 @@ var TooltipTrigger$1 = React.forwardRef(
     React.useEffect(() => {
       return () => document.removeEventListener("pointerup", handlePointerUp);
     }, [handlePointerUp]);
-    return /* @__PURE__ */ jsx(Anchor$1, { asChild: true, ...popperScope, children: /* @__PURE__ */ jsx(
+    return /* @__PURE__ */ jsx(Anchor$2, { asChild: true, ...popperScope, children: /* @__PURE__ */ jsx(
       Primitive$3.button,
       {
         "aria-describedby": context.open ? context.contentId : void 0,
@@ -123525,29 +123609,29 @@ var TooltipTrigger$1 = React.forwardRef(
     ) });
   }
 );
-TooltipTrigger$1.displayName = TRIGGER_NAME$2;
-var PORTAL_NAME$2 = "TooltipPortal";
-var [PortalProvider$1, usePortalContext$1] = createTooltipContext(PORTAL_NAME$2, {
+TooltipTrigger$1.displayName = TRIGGER_NAME$4;
+var PORTAL_NAME$3 = "TooltipPortal";
+var [PortalProvider$2, usePortalContext$2] = createTooltipContext(PORTAL_NAME$3, {
   forceMount: void 0
 });
 var TooltipPortal = (props) => {
   const { __scopeTooltip, forceMount, children, container } = props;
-  const context = useTooltipContext(PORTAL_NAME$2, __scopeTooltip);
-  return /* @__PURE__ */ jsx(PortalProvider$1, { scope: __scopeTooltip, forceMount, children: /* @__PURE__ */ jsx(Presence$1, { present: forceMount || context.open, children: /* @__PURE__ */ jsx(Portal$2, { asChild: true, container, children }) }) });
+  const context = useTooltipContext(PORTAL_NAME$3, __scopeTooltip);
+  return /* @__PURE__ */ jsx(PortalProvider$2, { scope: __scopeTooltip, forceMount, children: /* @__PURE__ */ jsx(Presence$1, { present: forceMount || context.open, children: /* @__PURE__ */ jsx(Portal$3, { asChild: true, container, children }) }) });
 };
-TooltipPortal.displayName = PORTAL_NAME$2;
-var CONTENT_NAME$2 = "TooltipContent";
+TooltipPortal.displayName = PORTAL_NAME$3;
+var CONTENT_NAME$5 = "TooltipContent";
 var TooltipContent$1 = React.forwardRef(
   (props, forwardedRef) => {
-    const portalContext = usePortalContext$1(CONTENT_NAME$2, props.__scopeTooltip);
+    const portalContext = usePortalContext$2(CONTENT_NAME$5, props.__scopeTooltip);
     const { forceMount = portalContext.forceMount, side = "top", ...contentProps } = props;
-    const context = useTooltipContext(CONTENT_NAME$2, props.__scopeTooltip);
+    const context = useTooltipContext(CONTENT_NAME$5, props.__scopeTooltip);
     return /* @__PURE__ */ jsx(Presence$1, { present: forceMount || context.open, children: context.disableHoverableContent ? /* @__PURE__ */ jsx(TooltipContentImpl, { side, ...contentProps, ref: forwardedRef }) : /* @__PURE__ */ jsx(TooltipContentHoverable, { side, ...contentProps, ref: forwardedRef }) });
   }
 );
 var TooltipContentHoverable = React.forwardRef((props, forwardedRef) => {
-  const context = useTooltipContext(CONTENT_NAME$2, props.__scopeTooltip);
-  const providerContext = useTooltipProviderContext(CONTENT_NAME$2, props.__scopeTooltip);
+  const context = useTooltipContext(CONTENT_NAME$5, props.__scopeTooltip);
+  const providerContext = useTooltipProviderContext(CONTENT_NAME$5, props.__scopeTooltip);
   const ref = React.useRef(null);
   const composedRefs = useComposedRefs$1(forwardedRef, ref);
   const [pointerGraceArea, setPointerGraceArea] = React.useState(null);
@@ -123618,8 +123702,8 @@ var TooltipContentImpl = React.forwardRef(
       onPointerDownOutside,
       ...contentProps
     } = props;
-    const context = useTooltipContext(CONTENT_NAME$2, __scopeTooltip);
-    const popperScope = usePopperScope$1(__scopeTooltip);
+    const context = useTooltipContext(CONTENT_NAME$5, __scopeTooltip);
+    const popperScope = usePopperScope$2(__scopeTooltip);
     const { onClose } = context;
     React.useEffect(() => {
       document.addEventListener(TOOLTIP_OPEN, onClose);
@@ -123645,7 +123729,7 @@ var TooltipContentImpl = React.forwardRef(
         onFocusOutside: (event) => event.preventDefault(),
         onDismiss: onClose,
         children: /* @__PURE__ */ jsxs(
-          Content,
+          Content$1,
           {
             "data-state": context.stateAttribute,
             ...popperScope,
@@ -123664,7 +123748,7 @@ var TooltipContentImpl = React.forwardRef(
             },
             children: [
               /* @__PURE__ */ jsx(Slottable$2, { children }),
-              /* @__PURE__ */ jsx(VisuallyHiddenContentContextProvider, { scope: __scopeTooltip, isInside: true, children: /* @__PURE__ */ jsx(Root$8, { id: context.contentId, role: "tooltip", children: ariaLabel || children }) })
+              /* @__PURE__ */ jsx(VisuallyHiddenContentContextProvider, { scope: __scopeTooltip, isInside: true, children: /* @__PURE__ */ jsx(Root$a, { id: context.contentId, role: "tooltip", children: ariaLabel || children }) })
             ]
           }
         )
@@ -123672,20 +123756,20 @@ var TooltipContentImpl = React.forwardRef(
     );
   }
 );
-TooltipContent$1.displayName = CONTENT_NAME$2;
-var ARROW_NAME$1 = "TooltipArrow";
+TooltipContent$1.displayName = CONTENT_NAME$5;
+var ARROW_NAME$3 = "TooltipArrow";
 var TooltipArrow = React.forwardRef(
   (props, forwardedRef) => {
     const { __scopeTooltip, ...arrowProps } = props;
-    const popperScope = usePopperScope$1(__scopeTooltip);
+    const popperScope = usePopperScope$2(__scopeTooltip);
     const visuallyHiddenContentContext = useVisuallyHiddenContentContext(
-      ARROW_NAME$1,
+      ARROW_NAME$3,
       __scopeTooltip
     );
-    return visuallyHiddenContentContext.isInside ? null : /* @__PURE__ */ jsx(Arrow, { ...popperScope, ...arrowProps, ref: forwardedRef });
+    return visuallyHiddenContentContext.isInside ? null : /* @__PURE__ */ jsx(Arrow$2, { ...popperScope, ...arrowProps, ref: forwardedRef });
   }
 );
-TooltipArrow.displayName = ARROW_NAME$1;
+TooltipArrow.displayName = ARROW_NAME$3;
 function getExitSideFromRect(point, rect) {
   const top = Math.abs(rect.top - point.y);
   const bottom = Math.abs(rect.bottom - point.y);
@@ -123803,9 +123887,9 @@ function getHullPresorted(points) {
 }
 var Provider = TooltipProvider$1;
 var Root3 = Tooltip$2;
-var Trigger$1 = TooltipTrigger$1;
-var Portal$1 = TooltipPortal;
-var Content2$2 = TooltipContent$1;
+var Trigger$2 = TooltipTrigger$1;
+var Portal$2 = TooltipPortal;
+var Content2$3 = TooltipContent$1;
 var Arrow2 = TooltipArrow;
 
 function TooltipProvider({ delayDuration = 0, ...props }) {
@@ -123815,10 +123899,10 @@ function Tooltip$1({ ...props }) {
     return (jsx(TooltipProvider, { children: jsx(Root3, { "data-slot": "tooltip", ...props }) }));
 }
 function TooltipTrigger({ ...props }) {
-    return jsx(Trigger$1, { "data-slot": "tooltip-trigger", ...props });
+    return jsx(Trigger$2, { "data-slot": "tooltip-trigger", ...props });
 }
 function TooltipContent({ className, sideOffset = 0, children, ...props }) {
-    return (jsx(Portal$1, { children: jsxs(Content2$2, { "data-slot": "tooltip-content", sideOffset: sideOffset, className: cn("bg-primary text-primary-foreground animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 w-fit origin-(--radix-tooltip-content-transform-origin) rounded-md px-3 py-1.5 text-xs text-balance", className), ...props, children: [children, jsx(Arrow2, { className: "bg-primary fill-primary z-50 size-2.5 translate-y-[calc(-50%_-_2px)] rotate-45 rounded-[2px]" })] }) }));
+    return (jsx(Portal$2, { children: jsxs(Content2$3, { "data-slot": "tooltip-content", sideOffset: sideOffset, className: cn("bg-primary text-primary-foreground animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 w-fit origin-(--radix-tooltip-content-transform-origin) rounded-md px-3 py-1.5 text-xs text-balance", className), ...props, children: [children, jsx(Arrow2, { className: "bg-primary fill-primary z-50 size-2.5 translate-y-[calc(-50%_-_2px)] rotate-45 rounded-[2px]" })] }) }));
 }
 
 // packages/react/context/src/createContext.tsx
@@ -124108,11 +124192,11 @@ function getInvalidValueError(propValue, componentName) {
 
 Defaulting to \`null\`.`;
 }
-var Root$7 = Progress$1;
+var Root$9 = Progress$1;
 var Indicator$2 = ProgressIndicator;
 
-const Progress = React.forwardRef(({ className, value, ...props }, ref) => (jsx(Root$7, { ref: ref, className: cn('bg-secondary relative h-4 w-full overflow-hidden rounded-full', className), ...props, children: jsx(Indicator$2, { className: "bg-primary h-full w-full flex-1 transition-all", style: { transform: `translateX(-${100 - (value || 0)}%)` } }) })));
-Progress.displayName = Root$7.displayName;
+const Progress = React.forwardRef(({ className, value, ...props }, ref) => (jsx(Root$9, { ref: ref, className: cn('bg-secondary relative h-4 w-full overflow-hidden rounded-full', className), ...props, children: jsx(Indicator$2, { className: "bg-primary h-full w-full flex-1 transition-all", style: { transform: `translateX(-${100 - (value || 0)}%)` } }) })));
+Progress.displayName = Root$9.displayName;
 
 var SLOTTABLE_IDENTIFIER = Symbol("radix.slottable");
 // @__NO_SIDE_EFFECTS__
@@ -124136,7 +124220,7 @@ var AlertDialog$1 = (props) => {
   return /* @__PURE__ */ jsx(DialogPrimitive.Root, { ...dialogScope, ...alertDialogProps, modal: true });
 };
 AlertDialog$1.displayName = ROOT_NAME;
-var TRIGGER_NAME$1 = "AlertDialogTrigger";
+var TRIGGER_NAME$3 = "AlertDialogTrigger";
 var AlertDialogTrigger = React.forwardRef(
   (props, forwardedRef) => {
     const { __scopeAlertDialog, ...triggerProps } = props;
@@ -124144,14 +124228,14 @@ var AlertDialogTrigger = React.forwardRef(
     return /* @__PURE__ */ jsx(DialogPrimitive.Trigger, { ...dialogScope, ...triggerProps, ref: forwardedRef });
   }
 );
-AlertDialogTrigger.displayName = TRIGGER_NAME$1;
-var PORTAL_NAME$1 = "AlertDialogPortal";
+AlertDialogTrigger.displayName = TRIGGER_NAME$3;
+var PORTAL_NAME$2 = "AlertDialogPortal";
 var AlertDialogPortal$1 = (props) => {
   const { __scopeAlertDialog, ...portalProps } = props;
   const dialogScope = useDialogScope(__scopeAlertDialog);
   return /* @__PURE__ */ jsx(DialogPrimitive.Portal, { ...dialogScope, ...portalProps });
 };
-AlertDialogPortal$1.displayName = PORTAL_NAME$1;
+AlertDialogPortal$1.displayName = PORTAL_NAME$2;
 var OVERLAY_NAME = "AlertDialogOverlay";
 var AlertDialogOverlay$1 = React.forwardRef(
   (props, forwardedRef) => {
@@ -124161,8 +124245,8 @@ var AlertDialogOverlay$1 = React.forwardRef(
   }
 );
 AlertDialogOverlay$1.displayName = OVERLAY_NAME;
-var CONTENT_NAME$1 = "AlertDialogContent";
-var [AlertDialogContentProvider, useAlertDialogContentContext] = createAlertDialogContext(CONTENT_NAME$1);
+var CONTENT_NAME$4 = "AlertDialogContent";
+var [AlertDialogContentProvider, useAlertDialogContentContext] = createAlertDialogContext(CONTENT_NAME$4);
 var Slottable = createSlottable("AlertDialogContent");
 var AlertDialogContent$1 = React.forwardRef(
   (props, forwardedRef) => {
@@ -124174,7 +124258,7 @@ var AlertDialogContent$1 = React.forwardRef(
     return /* @__PURE__ */ jsx(
       DialogPrimitive.WarningProvider,
       {
-        contentName: CONTENT_NAME$1,
+        contentName: CONTENT_NAME$4,
         titleName: TITLE_NAME,
         docsSlug: "alert-dialog",
         children: /* @__PURE__ */ jsx(AlertDialogContentProvider, { scope: __scopeAlertDialog, cancelRef, children: /* @__PURE__ */ jsxs(
@@ -124200,7 +124284,7 @@ var AlertDialogContent$1 = React.forwardRef(
     );
   }
 );
-AlertDialogContent$1.displayName = CONTENT_NAME$1;
+AlertDialogContent$1.displayName = CONTENT_NAME$4;
 var TITLE_NAME = "AlertDialogTitle";
 var AlertDialogTitle$1 = React.forwardRef(
   (props, forwardedRef) => {
@@ -124238,11 +124322,11 @@ var AlertDialogCancel$1 = React.forwardRef(
 );
 AlertDialogCancel$1.displayName = CANCEL_NAME;
 var DescriptionWarning = ({ contentRef }) => {
-  const MESSAGE = `\`${CONTENT_NAME$1}\` requires a description for the component to be accessible for screen reader users.
+  const MESSAGE = `\`${CONTENT_NAME$4}\` requires a description for the component to be accessible for screen reader users.
 
-You can add a description to the \`${CONTENT_NAME$1}\` by passing a \`${DESCRIPTION_NAME}\` component as a child, which also benefits sighted users by adding visible context to the dialog.
+You can add a description to the \`${CONTENT_NAME$4}\` by passing a \`${DESCRIPTION_NAME}\` component as a child, which also benefits sighted users by adding visible context to the dialog.
 
-Alternatively, you can use your own component as a description by assigning it an \`id\` and passing the same value to the \`aria-describedby\` prop in \`${CONTENT_NAME$1}\`. If the description is confusing or duplicative for sighted users, you can use the \`@radix-ui/react-visually-hidden\` primitive as a wrapper around your description component.
+Alternatively, you can use your own component as a description by assigning it an \`id\` and passing the same value to the \`aria-describedby\` prop in \`${CONTENT_NAME$4}\`. If the description is confusing or duplicative for sighted users, you can use the \`@radix-ui/react-visually-hidden\` primitive as a wrapper around your description component.
 
 For more information, see https://radix-ui.com/primitives/docs/components/alert-dialog`;
   React.useEffect(() => {
@@ -124253,21 +124337,21 @@ For more information, see https://radix-ui.com/primitives/docs/components/alert-
   }, [MESSAGE, contentRef]);
   return null;
 };
-var Root2$2 = AlertDialog$1;
+var Root2$4 = AlertDialog$1;
 var Portal2 = AlertDialogPortal$1;
 var Overlay2 = AlertDialogOverlay$1;
-var Content2$1 = AlertDialogContent$1;
+var Content2$2 = AlertDialogContent$1;
 var Action = AlertDialogAction$1;
 var Cancel = AlertDialogCancel$1;
 var Title2 = AlertDialogTitle$1;
 var Description2 = AlertDialogDescription$1;
 
-const AlertDialog = Root2$2;
+const AlertDialog = Root2$4;
 const AlertDialogPortal = Portal2;
 const AlertDialogOverlay = React.forwardRef(({ className, ...props }, ref) => (jsx(Overlay2, { className: cn('data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0 z-50 bg-black/80', className), ...props, ref: ref })));
 AlertDialogOverlay.displayName = Overlay2.displayName;
-const AlertDialogContent = React.forwardRef(({ className, ...props }, ref) => (jsxs(AlertDialogPortal, { children: [jsx(AlertDialogOverlay, {}), jsx(Content2$1, { ref: ref, className: cn('bg-background data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] fixed top-[50%] left-[50%] z-50 grid w-full max-w-lg translate-x-[-50%] translate-y-[-50%] gap-4 border p-6 shadow-lg duration-200 sm:rounded-lg', className), ...props })] })));
-AlertDialogContent.displayName = Content2$1.displayName;
+const AlertDialogContent = React.forwardRef(({ className, ...props }, ref) => (jsxs(AlertDialogPortal, { children: [jsx(AlertDialogOverlay, {}), jsx(Content2$2, { ref: ref, className: cn('bg-background data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] fixed top-[50%] left-[50%] z-50 grid w-full max-w-lg translate-x-[-50%] translate-y-[-50%] gap-4 border p-6 shadow-lg duration-200 sm:rounded-lg', className), ...props })] })));
+AlertDialogContent.displayName = Content2$2.displayName;
 const AlertDialogHeader = ({ className, ...props }) => (jsx("div", { className: cn('flex flex-col space-y-2 text-center sm:text-left', className), ...props }));
 AlertDialogHeader.displayName = 'AlertDialogHeader';
 const AlertDialogFooter = ({ className, ...props }) => (jsx("div", { className: cn('flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2', className), ...props }));
@@ -125170,7 +125254,7 @@ var Primitive = NODES.reduce((primitive, node) => {
   return { ...primitive, [node]: Node };
 }, {});
 
-var NAME$3 = "Label";
+var NAME$4 = "Label";
 var Label$2 = React.forwardRef((props, forwardedRef) => {
   return /* @__PURE__ */ jsx(
     Primitive.label,
@@ -125186,12 +125270,12 @@ var Label$2 = React.forwardRef((props, forwardedRef) => {
     }
   );
 });
-Label$2.displayName = NAME$3;
-var Root$6 = Label$2;
+Label$2.displayName = NAME$4;
+var Root$8 = Label$2;
 
 const labelVariants = cva("text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70");
-const Label$1 = React.forwardRef(({ className, ...props }, ref) => (jsx(Root$6, { ref: ref, className: cn(labelVariants(), className), ...props })));
-Label$1.displayName = Root$6.displayName;
+const Label$1 = React.forwardRef(({ className, ...props }, ref) => (jsx(Root$8, { ref: ref, className: cn(labelVariants(), className), ...props })));
+Label$1.displayName = Root$8.displayName;
 
 var dayjs_min = {exports: {}};
 
@@ -173815,7 +173899,7 @@ var Checkbox$1 = React.forwardRef(
           role: "checkbox",
           "aria-checked": isIndeterminate(checked) ? "mixed" : checked,
           "aria-required": required,
-          "data-state": getState$2(checked),
+          "data-state": getState$3(checked),
           "data-disabled": disabled ? "" : void 0,
           disabled,
           value,
@@ -173860,7 +173944,7 @@ var CheckboxIndicator = React.forwardRef(
     return /* @__PURE__ */ jsx(Presence$1, { present: forceMount || isIndeterminate(context.state) || context.state === true, children: /* @__PURE__ */ jsx(
       Primitive$3.span,
       {
-        "data-state": getState$2(context.state),
+        "data-state": getState$3(context.state),
         "data-disabled": context.disabled ? "" : void 0,
         ...indicatorProps,
         ref: forwardedRef,
@@ -173926,14 +174010,14 @@ CheckboxBubbleInput.displayName = BUBBLE_INPUT_NAME;
 function isIndeterminate(checked) {
   return checked === "indeterminate";
 }
-function getState$2(checked) {
+function getState$3(checked) {
   return isIndeterminate(checked) ? "indeterminate" : checked ? "checked" : "unchecked";
 }
-var Root$5 = Checkbox$1;
+var Root$7 = Checkbox$1;
 var Indicator$1 = CheckboxIndicator;
 
-const Checkbox = React.forwardRef(({ className, ...props }, ref) => (jsx(Root$5, { ref: ref, className: cn("peer border-primary focus-visible:ring-ring h-4 w-4 shrink-0 rounded-sm border shadow-sm focus-visible:ring-1 focus-visible:outline-none disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:bg-blue-500 data-[state=checked]:text-white", className), ...props, children: jsx(Indicator$1, { className: cn("flex items-center justify-center text-current"), children: jsx(Check, { className: "h-4 w-4" }) }) })));
-Checkbox.displayName = Root$5.displayName;
+const Checkbox = React.forwardRef(({ className, ...props }, ref) => (jsx(Root$7, { ref: ref, className: cn("peer border-primary focus-visible:ring-ring h-4 w-4 shrink-0 rounded-sm border shadow-sm focus-visible:ring-1 focus-visible:outline-none disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:bg-blue-500 data-[state=checked]:text-white", className), ...props, children: jsx(Indicator$1, { className: cn("flex items-center justify-center text-current"), children: jsx(Check, { className: "h-4 w-4" }) }) })));
+Checkbox.displayName = Root$7.displayName;
 
 function CoursesTab({ tenant, currentPage, itemsPerPage, hasManageUsersPermission = false, }) {
     var _a;
@@ -174851,9 +174935,9 @@ const AdvancedPagination = ({ currentPage, totalPages, onPageChange, totalCount,
 
 var POPOVER_NAME = "Popover";
 var [createPopoverContext] = createContextScope$1(POPOVER_NAME, [
-  createPopperScope$1
+  createPopperScope$2
 ]);
-var usePopperScope = createPopperScope$1();
+var usePopperScope$1 = createPopperScope$2();
 var [PopoverProvider, usePopoverContext] = createPopoverContext(POPOVER_NAME);
 var Popover$1 = (props) => {
   const {
@@ -174864,7 +174948,7 @@ var Popover$1 = (props) => {
     onOpenChange,
     modal = false
   } = props;
-  const popperScope = usePopperScope(__scopePopover);
+  const popperScope = usePopperScope$1(__scopePopover);
   const triggerRef = React.useRef(null);
   const [hasCustomAnchor, setHasCustomAnchor] = React.useState(false);
   const [open = false, setOpen] = useControllableState$2({
@@ -174872,7 +174956,7 @@ var Popover$1 = (props) => {
     defaultProp: defaultOpen,
     onChange: onOpenChange
   });
-  return /* @__PURE__ */ jsx(Root2$8, { ...popperScope, children: /* @__PURE__ */ jsx(
+  return /* @__PURE__ */ jsx(Root2$a, { ...popperScope, children: /* @__PURE__ */ jsx(
     PopoverProvider,
     {
       scope: __scopePopover,
@@ -174890,27 +174974,27 @@ var Popover$1 = (props) => {
   ) });
 };
 Popover$1.displayName = POPOVER_NAME;
-var ANCHOR_NAME = "PopoverAnchor";
+var ANCHOR_NAME$1 = "PopoverAnchor";
 var PopoverAnchor$1 = React.forwardRef(
   (props, forwardedRef) => {
     const { __scopePopover, ...anchorProps } = props;
-    const context = usePopoverContext(ANCHOR_NAME, __scopePopover);
-    const popperScope = usePopperScope(__scopePopover);
+    const context = usePopoverContext(ANCHOR_NAME$1, __scopePopover);
+    const popperScope = usePopperScope$1(__scopePopover);
     const { onCustomAnchorAdd, onCustomAnchorRemove } = context;
     React.useEffect(() => {
       onCustomAnchorAdd();
       return () => onCustomAnchorRemove();
     }, [onCustomAnchorAdd, onCustomAnchorRemove]);
-    return /* @__PURE__ */ jsx(Anchor$2, { ...popperScope, ...anchorProps, ref: forwardedRef });
+    return /* @__PURE__ */ jsx(Anchor$3, { ...popperScope, ...anchorProps, ref: forwardedRef });
   }
 );
-PopoverAnchor$1.displayName = ANCHOR_NAME;
-var TRIGGER_NAME = "PopoverTrigger";
+PopoverAnchor$1.displayName = ANCHOR_NAME$1;
+var TRIGGER_NAME$2 = "PopoverTrigger";
 var PopoverTrigger$1 = React.forwardRef(
   (props, forwardedRef) => {
     const { __scopePopover, ...triggerProps } = props;
-    const context = usePopoverContext(TRIGGER_NAME, __scopePopover);
-    const popperScope = usePopperScope(__scopePopover);
+    const context = usePopoverContext(TRIGGER_NAME$2, __scopePopover);
+    const popperScope = usePopperScope$1(__scopePopover);
     const composedTriggerRef = useComposedRefs$1(forwardedRef, context.triggerRef);
     const trigger = /* @__PURE__ */ jsx(
       Primitive$4.button,
@@ -174919,40 +175003,40 @@ var PopoverTrigger$1 = React.forwardRef(
         "aria-haspopup": "dialog",
         "aria-expanded": context.open,
         "aria-controls": context.contentId,
-        "data-state": getState$1(context.open),
+        "data-state": getState$2(context.open),
         ...triggerProps,
         ref: composedTriggerRef,
         onClick: composeEventHandlers$2(props.onClick, context.onOpenToggle)
       }
     );
-    return context.hasCustomAnchor ? trigger : /* @__PURE__ */ jsx(Anchor$2, { asChild: true, ...popperScope, children: trigger });
+    return context.hasCustomAnchor ? trigger : /* @__PURE__ */ jsx(Anchor$3, { asChild: true, ...popperScope, children: trigger });
   }
 );
-PopoverTrigger$1.displayName = TRIGGER_NAME;
-var PORTAL_NAME = "PopoverPortal";
-var [PortalProvider, usePortalContext] = createPopoverContext(PORTAL_NAME, {
+PopoverTrigger$1.displayName = TRIGGER_NAME$2;
+var PORTAL_NAME$1 = "PopoverPortal";
+var [PortalProvider$1, usePortalContext$1] = createPopoverContext(PORTAL_NAME$1, {
   forceMount: void 0
 });
 var PopoverPortal = (props) => {
   const { __scopePopover, forceMount, children, container } = props;
-  const context = usePopoverContext(PORTAL_NAME, __scopePopover);
-  return /* @__PURE__ */ jsx(PortalProvider, { scope: __scopePopover, forceMount, children: /* @__PURE__ */ jsx(Presence$3, { present: forceMount || context.open, children: /* @__PURE__ */ jsx(Portal$6, { asChild: true, container, children }) }) });
+  const context = usePopoverContext(PORTAL_NAME$1, __scopePopover);
+  return /* @__PURE__ */ jsx(PortalProvider$1, { scope: __scopePopover, forceMount, children: /* @__PURE__ */ jsx(Presence$3, { present: forceMount || context.open, children: /* @__PURE__ */ jsx(Portal$7, { asChild: true, container, children }) }) });
 };
-PopoverPortal.displayName = PORTAL_NAME;
-var CONTENT_NAME = "PopoverContent";
+PopoverPortal.displayName = PORTAL_NAME$1;
+var CONTENT_NAME$3 = "PopoverContent";
 var PopoverContent$1 = React.forwardRef(
   (props, forwardedRef) => {
-    const portalContext = usePortalContext(CONTENT_NAME, props.__scopePopover);
+    const portalContext = usePortalContext$1(CONTENT_NAME$3, props.__scopePopover);
     const { forceMount = portalContext.forceMount, ...contentProps } = props;
-    const context = usePopoverContext(CONTENT_NAME, props.__scopePopover);
+    const context = usePopoverContext(CONTENT_NAME$3, props.__scopePopover);
     return /* @__PURE__ */ jsx(Presence$3, { present: forceMount || context.open, children: context.modal ? /* @__PURE__ */ jsx(PopoverContentModal, { ...contentProps, ref: forwardedRef }) : /* @__PURE__ */ jsx(PopoverContentNonModal, { ...contentProps, ref: forwardedRef }) });
   }
 );
-PopoverContent$1.displayName = CONTENT_NAME;
+PopoverContent$1.displayName = CONTENT_NAME$3;
 var Slot = createSlot$1("PopoverContent.RemoveScroll");
 var PopoverContentModal = React.forwardRef(
   (props, forwardedRef) => {
-    const context = usePopoverContext(CONTENT_NAME, props.__scopePopover);
+    const context = usePopoverContext(CONTENT_NAME$3, props.__scopePopover);
     const contentRef = React.useRef(null);
     const composedRefs = useComposedRefs$1(forwardedRef, contentRef);
     const isRightClickOutsideRef = React.useRef(false);
@@ -174992,7 +175076,7 @@ var PopoverContentModal = React.forwardRef(
 );
 var PopoverContentNonModal = React.forwardRef(
   (props, forwardedRef) => {
-    const context = usePopoverContext(CONTENT_NAME, props.__scopePopover);
+    const context = usePopoverContext(CONTENT_NAME$3, props.__scopePopover);
     const hasInteractedOutsideRef = React.useRef(false);
     const hasPointerDownOutsideRef = React.useRef(false);
     return /* @__PURE__ */ jsx(
@@ -175044,8 +175128,8 @@ var PopoverContentImpl = React.forwardRef(
       onInteractOutside,
       ...contentProps
     } = props;
-    const context = usePopoverContext(CONTENT_NAME, __scopePopover);
-    const popperScope = usePopperScope(__scopePopover);
+    const context = usePopoverContext(CONTENT_NAME$3, __scopePopover);
+    const popperScope = usePopperScope$1(__scopePopover);
     useFocusGuards();
     return /* @__PURE__ */ jsx(
       FocusScope,
@@ -175066,9 +175150,9 @@ var PopoverContentImpl = React.forwardRef(
             onFocusOutside,
             onDismiss: () => context.onOpenChange(false),
             children: /* @__PURE__ */ jsx(
-              Content$2,
+              Content$3,
               {
-                "data-state": getState$1(context.open),
+                "data-state": getState$2(context.open),
                 role: "dialog",
                 id: context.contentId,
                 ...popperScope,
@@ -175110,38 +175194,38 @@ var PopoverClose = React.forwardRef(
   }
 );
 PopoverClose.displayName = CLOSE_NAME;
-var ARROW_NAME = "PopoverArrow";
+var ARROW_NAME$2 = "PopoverArrow";
 var PopoverArrow = React.forwardRef(
   (props, forwardedRef) => {
     const { __scopePopover, ...arrowProps } = props;
-    const popperScope = usePopperScope(__scopePopover);
-    return /* @__PURE__ */ jsx(Arrow$2, { ...popperScope, ...arrowProps, ref: forwardedRef });
+    const popperScope = usePopperScope$1(__scopePopover);
+    return /* @__PURE__ */ jsx(Arrow$4, { ...popperScope, ...arrowProps, ref: forwardedRef });
   }
 );
-PopoverArrow.displayName = ARROW_NAME;
-function getState$1(open) {
+PopoverArrow.displayName = ARROW_NAME$2;
+function getState$2(open) {
   return open ? "open" : "closed";
 }
-var Root2$1 = Popover$1;
+var Root2$3 = Popover$1;
 var Anchor2 = PopoverAnchor$1;
-var Trigger = PopoverTrigger$1;
-var Portal = PopoverPortal;
-var Content2 = PopoverContent$1;
+var Trigger$1 = PopoverTrigger$1;
+var Portal$1 = PopoverPortal;
+var Content2$1 = PopoverContent$1;
 
-const Popover = Root2$1;
-const PopoverTrigger = Trigger;
+const Popover = Root2$3;
+const PopoverTrigger = Trigger$1;
 const PopoverAnchor = Anchor2;
 const PopoverContent = React.forwardRef(({ className, align = 'center', sideOffset = 4, portalled = true, container, ...props }, ref) => {
     var _a;
     const portalContainer = useFloatingPortalContainer();
     const resolvedContainer = (_a = container !== null && container !== void 0 ? container : portalContainer) !== null && _a !== void 0 ? _a : undefined;
-    const content = (jsx(Content2, { ref: ref, "data-iblai-dialog-interaction-layer": true, align: align, sideOffset: sideOffset, className: cn('bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 w-72 rounded-md border p-4 shadow-md outline-none', className), ...props }));
+    const content = (jsx(Content2$1, { ref: ref, "data-iblai-dialog-interaction-layer": true, align: align, sideOffset: sideOffset, className: cn('bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 w-72 rounded-md border p-4 shadow-md outline-none', className), ...props }));
     if (!portalled) {
         return content;
     }
-    return jsx(Portal, { container: resolvedContainer, children: content });
+    return jsx(Portal$1, { container: resolvedContainer, children: content });
 });
-PopoverContent.displayName = Content2.displayName;
+PopoverContent.displayName = Content2$1.displayName;
 
 function UsersTab({ tenant, onInviteClick, currentSpa, showGradebookTab = false, }) {
     const t = useT();
@@ -178564,7 +178648,7 @@ function PreviousMonthButton(props) {
  * @group Components
  * @see https://daypicker.dev/guides/custom-components
  */
-function Root$4(props) {
+function Root$6(props) {
     const { rootRef, ...rest } = props;
     return React__default.createElement("div", { ...rest, ref: rootRef });
 }
@@ -178672,7 +178756,7 @@ var components$1 = /*#__PURE__*/Object.freeze({
     NextMonthButton: NextMonthButton,
     Option: Option,
     PreviousMonthButton: PreviousMonthButton,
-    Root: Root$4,
+    Root: Root$6,
     Select: Select,
     Week: Week,
     WeekNumber: WeekNumber,
@@ -210964,7 +211048,7 @@ function useUncontrolledState({
   return uncontrolledState;
 }
 
-var NAME$2 = "Toggle";
+var NAME$3 = "Toggle";
 var Toggle$1 = React.forwardRef((props, forwardedRef) => {
   const { pressed: pressedProp, defaultPressed = false, onPressedChange, ...buttonProps } = props;
   const [pressed = false, setPressed] = useControllableState({
@@ -210989,8 +211073,8 @@ var Toggle$1 = React.forwardRef((props, forwardedRef) => {
     }
   );
 });
-Toggle$1.displayName = NAME$2;
-var Root$3 = Toggle$1;
+Toggle$1.displayName = NAME$3;
+var Root$5 = Toggle$1;
 
 const toggleVariants = cva('inline-flex items-center justify-center rounded-md text-sm font-medium ring-offset-background transition-colors hover:bg-muted hover:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 data-[state=on]:bg-accent data-[state=on]:text-accent-foreground', {
     variants: {
@@ -211009,11 +211093,11 @@ const toggleVariants = cva('inline-flex items-center justify-center rounded-md t
         size: 'default',
     },
 });
-const Toggle = React.forwardRef(({ className, variant, size, ...props }, ref) => (jsx(Root$3, { ref: ref, className: cn(toggleVariants({ variant, size, className })), ...props })));
-Toggle.displayName = Root$3.displayName;
+const Toggle = React.forwardRef(({ className, variant, size, ...props }, ref) => (jsx(Root$5, { ref: ref, className: cn(toggleVariants({ variant, size, className })), ...props })));
+Toggle.displayName = Root$5.displayName;
 
 // src/separator.tsx
-var NAME$1 = "Separator";
+var NAME$2 = "Separator";
 var DEFAULT_ORIENTATION = "horizontal";
 var ORIENTATIONS = ["horizontal", "vertical"];
 var Separator$1 = React.forwardRef((props, forwardedRef) => {
@@ -211031,14 +211115,14 @@ var Separator$1 = React.forwardRef((props, forwardedRef) => {
     }
   );
 });
-Separator$1.displayName = NAME$1;
+Separator$1.displayName = NAME$2;
 function isValidOrientation(orientation) {
   return ORIENTATIONS.includes(orientation);
 }
-var Root$2 = Separator$1;
+var Root$4 = Separator$1;
 
-const Separator = React.forwardRef(({ className, orientation = "horizontal", decorative = true, ...props }, ref) => (jsx(Root$2, { ref: ref, decorative: decorative, orientation: orientation, className: cn("shrink-0 bg-border", orientation === "horizontal" ? "h-[1px] w-full" : "h-full w-[1px]", className), ...props })));
-Separator.displayName = Root$2.displayName;
+const Separator = React.forwardRef(({ className, orientation = "horizontal", decorative = true, ...props }, ref) => (jsx(Root$4, { ref: ref, decorative: decorative, orientation: orientation, className: cn("shrink-0 bg-border", orientation === "horizontal" ? "h-[1px] w-full" : "h-full w-[1px]", className), ...props })));
+Separator.displayName = Root$4.displayName;
 
 // Custom Div extension to preserve div elements with inline styles
 const Div = Node3.create({
@@ -211875,7 +211959,7 @@ function focusFirst(candidates, preventScroll = false) {
 function wrapArray(array, startIndex) {
   return array.map((_, index) => array[(startIndex + index) % array.length]);
 }
-var Root$1 = RovingFocusGroup;
+var Root$3 = RovingFocusGroup;
 var Item = RovingFocusGroupItem;
 
 // packages/react/use-size/src/useSize.tsx
@@ -212078,7 +212162,7 @@ var Radio = React.forwardRef(
           type: "button",
           role: "radio",
           "aria-checked": checked,
-          "data-state": getState(checked),
+          "data-state": getState$1(checked),
           "data-disabled": disabled ? "" : void 0,
           disabled,
           value,
@@ -212119,7 +212203,7 @@ var RadioIndicator = React.forwardRef(
     return /* @__PURE__ */ jsx(Presence, { present: forceMount || context.checked, children: /* @__PURE__ */ jsx(
       Primitive$1.span,
       {
-        "data-state": getState(context.checked),
+        "data-state": getState$1(context.checked),
         "data-disabled": context.disabled ? "" : void 0,
         ...indicatorProps,
         ref: forwardedRef
@@ -212164,7 +212248,7 @@ var BubbleInput = (props) => {
     }
   );
 };
-function getState(checked) {
+function getState$1(checked) {
   return checked ? "checked" : "unchecked";
 }
 var ARROW_KEYS = ["ArrowUp", "ArrowDown", "ArrowLeft", "ArrowRight"];
@@ -212208,7 +212292,7 @@ var RadioGroup$1 = React.forwardRef(
         value,
         onValueChange: setValue,
         children: /* @__PURE__ */ jsx(
-          Root$1,
+          Root$3,
           {
             asChild: true,
             ...rovingFocusGroupScope,
@@ -212300,12 +212384,12 @@ var RadioGroupIndicator = React.forwardRef(
   }
 );
 RadioGroupIndicator.displayName = INDICATOR_NAME2;
-var Root2 = RadioGroup$1;
+var Root2$2 = RadioGroup$1;
 var Item2 = RadioGroupItem$1;
 var Indicator = RadioGroupIndicator;
 
 function RadioGroup({ className, ...props }) {
-    return (jsx(Root2, { "data-slot": "radio-group", className: cn('grid gap-3', className), ...props }));
+    return (jsx(Root2$2, { "data-slot": "radio-group", className: cn('grid gap-3', className), ...props }));
 }
 function RadioGroupItem({ className, ...props }) {
     return (jsx(Item2, { "data-slot": "radio-group-item", className: cn('border-input text-primary focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive dark:bg-input/30 aspect-square size-4 shrink-0 rounded-full border shadow-xs transition-[color,box-shadow] outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50', className), ...props, children: jsx(Indicator, { "data-slot": "radio-group-indicator", className: "relative flex items-center justify-center", children: jsx(Circle, { className: "fill-primary absolute top-1/2 left-1/2 size-2 -translate-x-1/2 -translate-y-1/2" }) }) }));
@@ -255515,9 +255599,1011 @@ function NavBar({ username, isAuthenticated = false, onNewChat, onSettings, onLo
     return (jsxs("header", { className: "flex h-20 shrink-0 items-center gap-2 bg-white px-4 border-b border-[#D0E0FF]", children: [jsx(SidebarTrigger, { className: "-ml-1" }), mentorName && !showMentorDropdown && (jsx("div", { className: "flex items-center gap-2 ml-4", children: jsx("h1", { className: "text-lg font-semibold text-gray-900", children: mentorName }) })), mentorName && showMentorDropdown && (jsxs(DropdownMenu, { children: [jsx(DropdownMenuTrigger, { asChild: true, children: jsxs(Button$1, { variant: "ghost", className: "gap-2 text-gray-900 hover:bg-gray-100 ml-4", children: [jsx("span", { className: "font-semibold", children: mentorName }), jsx(ChevronDown, { className: "h-4 w-4" })] }) }), jsxs(DropdownMenuContent, { align: "start", className: "w-[200px]", children: [jsx(DropdownMenuItem, { children: t('navbar.switchAgent') }), jsx(DropdownMenuItem, { children: t('navbar.exploreAgents') })] })] })), jsxs("div", { className: "flex items-center gap-2 ml-auto", children: [onNewChat && (jsxs(Button$1, { variant: "ghost", size: "sm", onClick: onNewChat, className: "gap-2 text-[#646464] hover:text-[#484848] hover:bg-transparent", children: [jsx(MessageSquare, { className: "h-4 w-4" }), jsx("span", { className: "hidden sm:inline", children: t('navbar.newChat') })] })), isAuthenticated ? (jsxs(DropdownMenu, { children: [jsx(DropdownMenuTrigger, { asChild: true, children: jsxs(Button$1, { variant: "ghost", size: "sm", className: "gap-2 text-[#646464] hover:text-[#484848] hover:bg-transparent", children: [jsxs(Avatar, { className: "h-6 w-6", children: [jsx(AvatarImage, { src: `https://api.dicebear.com/7.x/initials/svg?seed=${username}` }), jsx(AvatarFallback, { children: username === null || username === void 0 ? void 0 : username.charAt(0).toUpperCase() })] }), jsx("span", { className: "hidden sm:inline", children: username })] }) }), jsxs(DropdownMenuContent, { align: "end", className: "w-[180px] rounded-md border border-gray-200 bg-white p-2 shadow-lg", children: [additionalMenuItems.map((item, index) => (jsxs(React__default.Fragment, { children: [item.separator && jsx(DropdownMenuSeparator, {}), jsxs(DropdownMenuItem, { onClick: item.onClick, className: "flex cursor-pointer items-center rounded-md px-3 py-2 text-sm text-gray-700 hover:bg-gray-100", children: [jsx(item.icon, { className: "mr-3 h-4 w-4 text-gray-600" }), item.label] })] }, item.label))), onSettings && (jsxs(DropdownMenuItem, { onClick: onSettings, className: "flex cursor-pointer items-center rounded-md px-3 py-2 text-sm text-gray-700 hover:bg-gray-100", children: [jsx(Settings$1, { className: "mr-3 h-4 w-4 text-gray-600" }), t('common.settings')] })), onLogout && (jsxs(Fragment$1, { children: [jsx(DropdownMenuSeparator, {}), jsxs(DropdownMenuItem, { onClick: onLogout, className: "flex cursor-pointer items-center rounded-md px-3 py-2 text-sm text-gray-700 hover:bg-gray-100", children: [jsx(LogOut, { className: "mr-3 h-4 w-4 text-gray-600" }), t('common.logout')] })] }))] })] })) : (onLogin && (jsxs(Button$1, { onClick: onLogin, size: "sm", className: "gap-2", children: [jsx(LogIn, { className: "h-4 w-4" }), t('common.login')] })))] })] }));
 }
 
+var COLLAPSIBLE_NAME = "Collapsible";
+var [createCollapsibleContext] = createContextScope$1(COLLAPSIBLE_NAME);
+var [CollapsibleProvider, useCollapsibleContext] = createCollapsibleContext(COLLAPSIBLE_NAME);
+var Collapsible$1 = React.forwardRef(
+  (props, forwardedRef) => {
+    const {
+      __scopeCollapsible,
+      open: openProp,
+      defaultOpen,
+      disabled,
+      onOpenChange,
+      ...collapsibleProps
+    } = props;
+    const [open, setOpen] = useControllableState$1({
+      prop: openProp,
+      defaultProp: defaultOpen ?? false,
+      onChange: onOpenChange,
+      caller: COLLAPSIBLE_NAME
+    });
+    return /* @__PURE__ */ jsx(
+      CollapsibleProvider,
+      {
+        scope: __scopeCollapsible,
+        disabled,
+        contentId: useId$1(),
+        open,
+        onOpenToggle: React.useCallback(() => setOpen((prevOpen) => !prevOpen), [setOpen]),
+        children: /* @__PURE__ */ jsx(
+          Primitive$2.div,
+          {
+            "data-state": getState(open),
+            "data-disabled": disabled ? "" : void 0,
+            ...collapsibleProps,
+            ref: forwardedRef
+          }
+        )
+      }
+    );
+  }
+);
+Collapsible$1.displayName = COLLAPSIBLE_NAME;
+var TRIGGER_NAME$1 = "CollapsibleTrigger";
+var CollapsibleTrigger$1 = React.forwardRef(
+  (props, forwardedRef) => {
+    const { __scopeCollapsible, ...triggerProps } = props;
+    const context = useCollapsibleContext(TRIGGER_NAME$1, __scopeCollapsible);
+    return /* @__PURE__ */ jsx(
+      Primitive$2.button,
+      {
+        type: "button",
+        "aria-controls": context.contentId,
+        "aria-expanded": context.open || false,
+        "data-state": getState(context.open),
+        "data-disabled": context.disabled ? "" : void 0,
+        disabled: context.disabled,
+        ...triggerProps,
+        ref: forwardedRef,
+        onClick: composeEventHandlers$1(props.onClick, context.onOpenToggle)
+      }
+    );
+  }
+);
+CollapsibleTrigger$1.displayName = TRIGGER_NAME$1;
+var CONTENT_NAME$2 = "CollapsibleContent";
+var CollapsibleContent$1 = React.forwardRef(
+  (props, forwardedRef) => {
+    const { forceMount, ...contentProps } = props;
+    const context = useCollapsibleContext(CONTENT_NAME$2, props.__scopeCollapsible);
+    return /* @__PURE__ */ jsx(Presence$2, { present: forceMount || context.open, children: ({ present }) => /* @__PURE__ */ jsx(CollapsibleContentImpl, { ...contentProps, ref: forwardedRef, present }) });
+  }
+);
+CollapsibleContent$1.displayName = CONTENT_NAME$2;
+var CollapsibleContentImpl = React.forwardRef((props, forwardedRef) => {
+  const { __scopeCollapsible, present, children, ...contentProps } = props;
+  const context = useCollapsibleContext(CONTENT_NAME$2, __scopeCollapsible);
+  const [isPresent, setIsPresent] = React.useState(present);
+  const ref = React.useRef(null);
+  const composedRefs = useComposedRefs$1(forwardedRef, ref);
+  const heightRef = React.useRef(0);
+  const height = heightRef.current;
+  const widthRef = React.useRef(0);
+  const width = widthRef.current;
+  const isOpen = context.open || isPresent;
+  const isMountAnimationPreventedRef = React.useRef(isOpen);
+  const originalStylesRef = React.useRef(void 0);
+  React.useEffect(() => {
+    const rAF = requestAnimationFrame(() => isMountAnimationPreventedRef.current = false);
+    return () => cancelAnimationFrame(rAF);
+  }, []);
+  useLayoutEffect2$1(() => {
+    const node = ref.current;
+    if (node) {
+      originalStylesRef.current = originalStylesRef.current || {
+        transitionDuration: node.style.transitionDuration,
+        animationName: node.style.animationName
+      };
+      node.style.transitionDuration = "0s";
+      node.style.animationName = "none";
+      const rect = node.getBoundingClientRect();
+      heightRef.current = rect.height;
+      widthRef.current = rect.width;
+      if (!isMountAnimationPreventedRef.current) {
+        node.style.transitionDuration = originalStylesRef.current.transitionDuration;
+        node.style.animationName = originalStylesRef.current.animationName;
+      }
+      setIsPresent(present);
+    }
+  }, [context.open, present]);
+  return /* @__PURE__ */ jsx(
+    Primitive$2.div,
+    {
+      "data-state": getState(context.open),
+      "data-disabled": context.disabled ? "" : void 0,
+      id: context.contentId,
+      hidden: !isOpen,
+      ...contentProps,
+      ref: composedRefs,
+      style: {
+        [`--radix-collapsible-content-height`]: height ? `${height}px` : void 0,
+        [`--radix-collapsible-content-width`]: width ? `${width}px` : void 0,
+        ...props.style
+      },
+      children: isOpen && children
+    }
+  );
+});
+function getState(open) {
+  return open ? "open" : "closed";
+}
+var Root$2 = Collapsible$1;
+
+const Collapsible = Root$2;
+const CollapsibleTrigger = CollapsibleTrigger$1;
+const CollapsibleContent = CollapsibleContent$1;
+
+// src/arrow.tsx
+var NAME$1 = "Arrow";
+var Arrow$1 = React.forwardRef((props, forwardedRef) => {
+  const { children, width = 10, height = 5, ...arrowProps } = props;
+  return /* @__PURE__ */ jsx(
+    Primitive$2.svg,
+    {
+      ...arrowProps,
+      ref: forwardedRef,
+      width,
+      height,
+      viewBox: "0 0 30 10",
+      preserveAspectRatio: "none",
+      children: props.asChild ? children : /* @__PURE__ */ jsx("polygon", { points: "0,0 30,0 15,10" })
+    }
+  );
+});
+Arrow$1.displayName = NAME$1;
+var Root$1 = Arrow$1;
+
+var POPPER_NAME = "Popper";
+var [createPopperContext, createPopperScope] = createContextScope$1(POPPER_NAME);
+var [PopperProvider, usePopperContext] = createPopperContext(POPPER_NAME);
+var Popper = (props) => {
+  const { __scopePopper, children } = props;
+  const [anchor, setAnchor] = React.useState(null);
+  return /* @__PURE__ */ jsx(PopperProvider, { scope: __scopePopper, anchor, onAnchorChange: setAnchor, children });
+};
+Popper.displayName = POPPER_NAME;
+var ANCHOR_NAME = "PopperAnchor";
+var PopperAnchor = React.forwardRef(
+  (props, forwardedRef) => {
+    const { __scopePopper, virtualRef, ...anchorProps } = props;
+    const context = usePopperContext(ANCHOR_NAME, __scopePopper);
+    const ref = React.useRef(null);
+    const composedRefs = useComposedRefs$1(forwardedRef, ref);
+    const anchorRef = React.useRef(null);
+    React.useEffect(() => {
+      const previousAnchor = anchorRef.current;
+      anchorRef.current = virtualRef?.current || ref.current;
+      if (previousAnchor !== anchorRef.current) {
+        context.onAnchorChange(anchorRef.current);
+      }
+    });
+    return virtualRef ? null : /* @__PURE__ */ jsx(Primitive$2.div, { ...anchorProps, ref: composedRefs });
+  }
+);
+PopperAnchor.displayName = ANCHOR_NAME;
+var CONTENT_NAME$1 = "PopperContent";
+var [PopperContentProvider, useContentContext] = createPopperContext(CONTENT_NAME$1);
+var PopperContent = React.forwardRef(
+  (props, forwardedRef) => {
+    const {
+      __scopePopper,
+      side = "bottom",
+      sideOffset = 0,
+      align = "center",
+      alignOffset = 0,
+      arrowPadding = 0,
+      avoidCollisions = true,
+      collisionBoundary = [],
+      collisionPadding: collisionPaddingProp = 0,
+      sticky = "partial",
+      hideWhenDetached = false,
+      updatePositionStrategy = "optimized",
+      onPlaced,
+      ...contentProps
+    } = props;
+    const context = usePopperContext(CONTENT_NAME$1, __scopePopper);
+    const [content, setContent] = React.useState(null);
+    const composedRefs = useComposedRefs$1(forwardedRef, (node) => setContent(node));
+    const [arrow, setArrow] = React.useState(null);
+    const arrowSize = useSize$1(arrow);
+    const arrowWidth = arrowSize?.width ?? 0;
+    const arrowHeight = arrowSize?.height ?? 0;
+    const desiredPlacement = side + (align !== "center" ? "-" + align : "");
+    const collisionPadding = typeof collisionPaddingProp === "number" ? collisionPaddingProp : { top: 0, right: 0, bottom: 0, left: 0, ...collisionPaddingProp };
+    const boundary = Array.isArray(collisionBoundary) ? collisionBoundary : [collisionBoundary];
+    const hasExplicitBoundaries = boundary.length > 0;
+    const detectOverflowOptions = {
+      padding: collisionPadding,
+      boundary: boundary.filter(isNotNull),
+      // with `strategy: 'fixed'`, this is the only way to get it to respect boundaries
+      altBoundary: hasExplicitBoundaries
+    };
+    const { refs, floatingStyles, placement, isPositioned, middlewareData } = useFloating({
+      // default to `fixed` strategy so users don't have to pick and we also avoid focus scroll issues
+      strategy: "fixed",
+      placement: desiredPlacement,
+      whileElementsMounted: (...args) => {
+        const cleanup = autoUpdate(...args, {
+          animationFrame: updatePositionStrategy === "always"
+        });
+        return cleanup;
+      },
+      elements: {
+        reference: context.anchor
+      },
+      middleware: [
+        offset({ mainAxis: sideOffset + arrowHeight, alignmentAxis: alignOffset }),
+        avoidCollisions && shift$1({
+          mainAxis: true,
+          crossAxis: false,
+          limiter: sticky === "partial" ? limitShift() : void 0,
+          ...detectOverflowOptions
+        }),
+        avoidCollisions && flip({ ...detectOverflowOptions }),
+        size({
+          ...detectOverflowOptions,
+          apply: ({ elements, rects, availableWidth, availableHeight }) => {
+            const { width: anchorWidth, height: anchorHeight } = rects.reference;
+            const contentStyle = elements.floating.style;
+            contentStyle.setProperty("--radix-popper-available-width", `${availableWidth}px`);
+            contentStyle.setProperty("--radix-popper-available-height", `${availableHeight}px`);
+            contentStyle.setProperty("--radix-popper-anchor-width", `${anchorWidth}px`);
+            contentStyle.setProperty("--radix-popper-anchor-height", `${anchorHeight}px`);
+          }
+        }),
+        arrow && arrow$2({ element: arrow, padding: arrowPadding }),
+        transformOrigin$1({ arrowWidth, arrowHeight }),
+        hideWhenDetached && hide({ strategy: "referenceHidden", ...detectOverflowOptions })
+      ]
+    });
+    const [placedSide, placedAlign] = getSideAndAlignFromPlacement(placement);
+    const handlePlaced = useCallbackRef$2(onPlaced);
+    useLayoutEffect2$1(() => {
+      if (isPositioned) {
+        handlePlaced?.();
+      }
+    }, [isPositioned, handlePlaced]);
+    const arrowX = middlewareData.arrow?.x;
+    const arrowY = middlewareData.arrow?.y;
+    const cannotCenterArrow = middlewareData.arrow?.centerOffset !== 0;
+    const [contentZIndex, setContentZIndex] = React.useState();
+    useLayoutEffect2$1(() => {
+      if (content) setContentZIndex(window.getComputedStyle(content).zIndex);
+    }, [content]);
+    return /* @__PURE__ */ jsx(
+      "div",
+      {
+        ref: refs.setFloating,
+        "data-radix-popper-content-wrapper": "",
+        style: {
+          ...floatingStyles,
+          transform: isPositioned ? floatingStyles.transform : "translate(0, -200%)",
+          // keep off the page when measuring
+          minWidth: "max-content",
+          zIndex: contentZIndex,
+          ["--radix-popper-transform-origin"]: [
+            middlewareData.transformOrigin?.x,
+            middlewareData.transformOrigin?.y
+          ].join(" "),
+          // hide the content if using the hide middleware and should be hidden
+          // set visibility to hidden and disable pointer events so the UI behaves
+          // as if the PopperContent isn't there at all
+          ...middlewareData.hide?.referenceHidden && {
+            visibility: "hidden",
+            pointerEvents: "none"
+          }
+        },
+        dir: props.dir,
+        children: /* @__PURE__ */ jsx(
+          PopperContentProvider,
+          {
+            scope: __scopePopper,
+            placedSide,
+            onArrowChange: setArrow,
+            arrowX,
+            arrowY,
+            shouldHideArrow: cannotCenterArrow,
+            children: /* @__PURE__ */ jsx(
+              Primitive$2.div,
+              {
+                "data-side": placedSide,
+                "data-align": placedAlign,
+                ...contentProps,
+                ref: composedRefs,
+                style: {
+                  ...contentProps.style,
+                  // if the PopperContent hasn't been placed yet (not all measurements done)
+                  // we prevent animations so that users's animation don't kick in too early referring wrong sides
+                  animation: !isPositioned ? "none" : void 0
+                }
+              }
+            )
+          }
+        )
+      }
+    );
+  }
+);
+PopperContent.displayName = CONTENT_NAME$1;
+var ARROW_NAME$1 = "PopperArrow";
+var OPPOSITE_SIDE = {
+  top: "bottom",
+  right: "left",
+  bottom: "top",
+  left: "right"
+};
+var PopperArrow = React.forwardRef(function PopperArrow2(props, forwardedRef) {
+  const { __scopePopper, ...arrowProps } = props;
+  const contentContext = useContentContext(ARROW_NAME$1, __scopePopper);
+  const baseSide = OPPOSITE_SIDE[contentContext.placedSide];
+  return (
+    // we have to use an extra wrapper because `ResizeObserver` (used by `useSize`)
+    // doesn't report size as we'd expect on SVG elements.
+    // it reports their bounding box which is effectively the largest path inside the SVG.
+    /* @__PURE__ */ jsx(
+      "span",
+      {
+        ref: contentContext.onArrowChange,
+        style: {
+          position: "absolute",
+          left: contentContext.arrowX,
+          top: contentContext.arrowY,
+          [baseSide]: 0,
+          transformOrigin: {
+            top: "",
+            right: "0 0",
+            bottom: "center 0",
+            left: "100% 0"
+          }[contentContext.placedSide],
+          transform: {
+            top: "translateY(100%)",
+            right: "translateY(50%) rotate(90deg) translateX(-50%)",
+            bottom: `rotate(180deg)`,
+            left: "translateY(50%) rotate(-90deg) translateX(50%)"
+          }[contentContext.placedSide],
+          visibility: contentContext.shouldHideArrow ? "hidden" : void 0
+        },
+        children: /* @__PURE__ */ jsx(
+          Root$1,
+          {
+            ...arrowProps,
+            ref: forwardedRef,
+            style: {
+              ...arrowProps.style,
+              // ensures the element can be measured correctly (mostly for if SVG)
+              display: "block"
+            }
+          }
+        )
+      }
+    )
+  );
+});
+PopperArrow.displayName = ARROW_NAME$1;
+function isNotNull(value) {
+  return value !== null;
+}
+var transformOrigin$1 = (options) => ({
+  name: "transformOrigin",
+  options,
+  fn(data) {
+    const { placement, rects, middlewareData } = data;
+    const cannotCenterArrow = middlewareData.arrow?.centerOffset !== 0;
+    const isArrowHidden = cannotCenterArrow;
+    const arrowWidth = isArrowHidden ? 0 : options.arrowWidth;
+    const arrowHeight = isArrowHidden ? 0 : options.arrowHeight;
+    const [placedSide, placedAlign] = getSideAndAlignFromPlacement(placement);
+    const noArrowAlign = { start: "0%", center: "50%", end: "100%" }[placedAlign];
+    const arrowXCenter = (middlewareData.arrow?.x ?? 0) + arrowWidth / 2;
+    const arrowYCenter = (middlewareData.arrow?.y ?? 0) + arrowHeight / 2;
+    let x = "";
+    let y = "";
+    if (placedSide === "bottom") {
+      x = isArrowHidden ? noArrowAlign : `${arrowXCenter}px`;
+      y = `${-arrowHeight}px`;
+    } else if (placedSide === "top") {
+      x = isArrowHidden ? noArrowAlign : `${arrowXCenter}px`;
+      y = `${rects.floating.height + arrowHeight}px`;
+    } else if (placedSide === "right") {
+      x = `${-arrowHeight}px`;
+      y = isArrowHidden ? noArrowAlign : `${arrowYCenter}px`;
+    } else if (placedSide === "left") {
+      x = `${rects.floating.width + arrowHeight}px`;
+      y = isArrowHidden ? noArrowAlign : `${arrowYCenter}px`;
+    }
+    return { data: { x, y } };
+  }
+});
+function getSideAndAlignFromPlacement(placement) {
+  const [side, align = "center"] = placement.split("-");
+  return [side, align];
+}
+var Root2$1 = Popper;
+var Anchor$1 = PopperAnchor;
+var Content = PopperContent;
+var Arrow = PopperArrow;
+
+var originalBodyUserSelect;
+var HOVERCARD_NAME = "HoverCard";
+var [createHoverCardContext] = createContextScope$1(HOVERCARD_NAME, [
+  createPopperScope
+]);
+var usePopperScope = createPopperScope();
+var [HoverCardProvider, useHoverCardContext] = createHoverCardContext(HOVERCARD_NAME);
+var HoverCard$1 = (props) => {
+  const {
+    __scopeHoverCard,
+    children,
+    open: openProp,
+    defaultOpen,
+    onOpenChange,
+    openDelay = 700,
+    closeDelay = 300
+  } = props;
+  const popperScope = usePopperScope(__scopeHoverCard);
+  const openTimerRef = React.useRef(0);
+  const closeTimerRef = React.useRef(0);
+  const hasSelectionRef = React.useRef(false);
+  const isPointerDownOnContentRef = React.useRef(false);
+  const [open, setOpen] = useControllableState$1({
+    prop: openProp,
+    defaultProp: defaultOpen ?? false,
+    onChange: onOpenChange,
+    caller: HOVERCARD_NAME
+  });
+  const handleOpen = React.useCallback(() => {
+    clearTimeout(closeTimerRef.current);
+    openTimerRef.current = window.setTimeout(() => setOpen(true), openDelay);
+  }, [openDelay, setOpen]);
+  const handleClose = React.useCallback(() => {
+    clearTimeout(openTimerRef.current);
+    if (!hasSelectionRef.current && !isPointerDownOnContentRef.current) {
+      closeTimerRef.current = window.setTimeout(() => setOpen(false), closeDelay);
+    }
+  }, [closeDelay, setOpen]);
+  const handleDismiss = React.useCallback(() => setOpen(false), [setOpen]);
+  React.useEffect(() => {
+    return () => {
+      clearTimeout(openTimerRef.current);
+      clearTimeout(closeTimerRef.current);
+    };
+  }, []);
+  return /* @__PURE__ */ jsx(
+    HoverCardProvider,
+    {
+      scope: __scopeHoverCard,
+      open,
+      onOpenChange: setOpen,
+      onOpen: handleOpen,
+      onClose: handleClose,
+      onDismiss: handleDismiss,
+      hasSelectionRef,
+      isPointerDownOnContentRef,
+      children: /* @__PURE__ */ jsx(Root2$1, { ...popperScope, children })
+    }
+  );
+};
+HoverCard$1.displayName = HOVERCARD_NAME;
+var TRIGGER_NAME = "HoverCardTrigger";
+var HoverCardTrigger$1 = React.forwardRef(
+  (props, forwardedRef) => {
+    const { __scopeHoverCard, ...triggerProps } = props;
+    const context = useHoverCardContext(TRIGGER_NAME, __scopeHoverCard);
+    const popperScope = usePopperScope(__scopeHoverCard);
+    return /* @__PURE__ */ jsx(Anchor$1, { asChild: true, ...popperScope, children: /* @__PURE__ */ jsx(
+      Primitive$2.a,
+      {
+        "data-state": context.open ? "open" : "closed",
+        ...triggerProps,
+        ref: forwardedRef,
+        onPointerEnter: composeEventHandlers$1(props.onPointerEnter, excludeTouch(context.onOpen)),
+        onPointerLeave: composeEventHandlers$1(props.onPointerLeave, excludeTouch(context.onClose)),
+        onFocus: composeEventHandlers$1(props.onFocus, context.onOpen),
+        onBlur: composeEventHandlers$1(props.onBlur, context.onClose),
+        onTouchStart: composeEventHandlers$1(props.onTouchStart, (event) => event.preventDefault())
+      }
+    ) });
+  }
+);
+HoverCardTrigger$1.displayName = TRIGGER_NAME;
+var PORTAL_NAME = "HoverCardPortal";
+var [PortalProvider, usePortalContext] = createHoverCardContext(PORTAL_NAME, {
+  forceMount: void 0
+});
+var HoverCardPortal = (props) => {
+  const { __scopeHoverCard, forceMount, children, container } = props;
+  const context = useHoverCardContext(PORTAL_NAME, __scopeHoverCard);
+  return /* @__PURE__ */ jsx(PortalProvider, { scope: __scopeHoverCard, forceMount, children: /* @__PURE__ */ jsx(Presence$2, { present: forceMount || context.open, children: /* @__PURE__ */ jsx(Portal$4, { asChild: true, container, children }) }) });
+};
+HoverCardPortal.displayName = PORTAL_NAME;
+var CONTENT_NAME = "HoverCardContent";
+var HoverCardContent$1 = React.forwardRef(
+  (props, forwardedRef) => {
+    const portalContext = usePortalContext(CONTENT_NAME, props.__scopeHoverCard);
+    const { forceMount = portalContext.forceMount, ...contentProps } = props;
+    const context = useHoverCardContext(CONTENT_NAME, props.__scopeHoverCard);
+    return /* @__PURE__ */ jsx(Presence$2, { present: forceMount || context.open, children: /* @__PURE__ */ jsx(
+      HoverCardContentImpl,
+      {
+        "data-state": context.open ? "open" : "closed",
+        ...contentProps,
+        onPointerEnter: composeEventHandlers$1(props.onPointerEnter, excludeTouch(context.onOpen)),
+        onPointerLeave: composeEventHandlers$1(props.onPointerLeave, excludeTouch(context.onClose)),
+        ref: forwardedRef
+      }
+    ) });
+  }
+);
+HoverCardContent$1.displayName = CONTENT_NAME;
+var HoverCardContentImpl = React.forwardRef((props, forwardedRef) => {
+  const {
+    __scopeHoverCard,
+    onEscapeKeyDown,
+    onPointerDownOutside,
+    onFocusOutside,
+    onInteractOutside,
+    ...contentProps
+  } = props;
+  const context = useHoverCardContext(CONTENT_NAME, __scopeHoverCard);
+  const popperScope = usePopperScope(__scopeHoverCard);
+  const ref = React.useRef(null);
+  const composedRefs = useComposedRefs$1(forwardedRef, ref);
+  const [containSelection, setContainSelection] = React.useState(false);
+  React.useEffect(() => {
+    if (containSelection) {
+      const body = document.body;
+      originalBodyUserSelect = body.style.userSelect || body.style.webkitUserSelect;
+      body.style.userSelect = "none";
+      body.style.webkitUserSelect = "none";
+      return () => {
+        body.style.userSelect = originalBodyUserSelect;
+        body.style.webkitUserSelect = originalBodyUserSelect;
+      };
+    }
+  }, [containSelection]);
+  React.useEffect(() => {
+    if (ref.current) {
+      const handlePointerUp = () => {
+        setContainSelection(false);
+        context.isPointerDownOnContentRef.current = false;
+        setTimeout(() => {
+          const hasSelection = document.getSelection()?.toString() !== "";
+          if (hasSelection) context.hasSelectionRef.current = true;
+        });
+      };
+      document.addEventListener("pointerup", handlePointerUp);
+      return () => {
+        document.removeEventListener("pointerup", handlePointerUp);
+        context.hasSelectionRef.current = false;
+        context.isPointerDownOnContentRef.current = false;
+      };
+    }
+  }, [context.isPointerDownOnContentRef, context.hasSelectionRef]);
+  React.useEffect(() => {
+    if (ref.current) {
+      const tabbables = getTabbableNodes(ref.current);
+      tabbables.forEach((tabbable) => tabbable.setAttribute("tabindex", "-1"));
+    }
+  });
+  return /* @__PURE__ */ jsx(
+    DismissableLayer$1,
+    {
+      asChild: true,
+      disableOutsidePointerEvents: false,
+      onInteractOutside,
+      onEscapeKeyDown,
+      onPointerDownOutside,
+      onFocusOutside: composeEventHandlers$1(onFocusOutside, (event) => {
+        event.preventDefault();
+      }),
+      onDismiss: context.onDismiss,
+      children: /* @__PURE__ */ jsx(
+        Content,
+        {
+          ...popperScope,
+          ...contentProps,
+          onPointerDown: composeEventHandlers$1(contentProps.onPointerDown, (event) => {
+            if (event.currentTarget.contains(event.target)) {
+              setContainSelection(true);
+            }
+            context.hasSelectionRef.current = false;
+            context.isPointerDownOnContentRef.current = true;
+          }),
+          ref: composedRefs,
+          style: {
+            ...contentProps.style,
+            userSelect: containSelection ? "text" : void 0,
+            // Safari requires prefix
+            WebkitUserSelect: containSelection ? "text" : void 0,
+            // re-namespace exposed content custom properties
+            ...{
+              "--radix-hover-card-content-transform-origin": "var(--radix-popper-transform-origin)",
+              "--radix-hover-card-content-available-width": "var(--radix-popper-available-width)",
+              "--radix-hover-card-content-available-height": "var(--radix-popper-available-height)",
+              "--radix-hover-card-trigger-width": "var(--radix-popper-anchor-width)",
+              "--radix-hover-card-trigger-height": "var(--radix-popper-anchor-height)"
+            }
+          }
+        }
+      )
+    }
+  );
+});
+var ARROW_NAME = "HoverCardArrow";
+var HoverCardArrow = React.forwardRef(
+  (props, forwardedRef) => {
+    const { __scopeHoverCard, ...arrowProps } = props;
+    const popperScope = usePopperScope(__scopeHoverCard);
+    return /* @__PURE__ */ jsx(Arrow, { ...popperScope, ...arrowProps, ref: forwardedRef });
+  }
+);
+HoverCardArrow.displayName = ARROW_NAME;
+function excludeTouch(eventHandler) {
+  return (event) => event.pointerType === "touch" ? void 0 : eventHandler();
+}
+function getTabbableNodes(container) {
+  const nodes = [];
+  const walker = document.createTreeWalker(container, NodeFilter.SHOW_ELEMENT, {
+    acceptNode: (node) => {
+      return node.tabIndex >= 0 ? NodeFilter.FILTER_ACCEPT : NodeFilter.FILTER_SKIP;
+    }
+  });
+  while (walker.nextNode()) nodes.push(walker.currentNode);
+  return nodes;
+}
+var Root2 = HoverCard$1;
+var Trigger = HoverCardTrigger$1;
+var Portal = HoverCardPortal;
+var Content2 = HoverCardContent$1;
+
+const HoverCard = Root2;
+const HoverCardTrigger = Trigger;
+const HoverCardContent = React.forwardRef(({ className, align = 'center', sideOffset = 4, ...props }, ref) => (
+// Portal lifts the content out of the trigger's stacking/clipping
+// context. Without it, hover-cards rendered from inside `<Sidebar>`
+// (which has `overflow-hidden` and lives in a `z-10` container) get
+// clipped at the sidebar edge and hidden behind the main content.
+jsx(Portal, { children: jsx(Content2, { ref: ref, align: align, sideOffset: sideOffset, className: cn('bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 w-64 rounded-md border p-4 shadow-md outline-none', className), ...props }) })));
+HoverCardContent.displayName = Content2.displayName;
+
+/** Muted icon/label color shared by every nav row. Exported so host apps
+ * can build custom sections that match the shell's palette. */
+const PLATFORM_SIDEBAR_NAV_MUTED = '#5f5f61';
+const PLATFORM_SIDEBAR_FLYOUT_TITLE_COLOR = '#646676';
+const PLATFORM_SIDEBAR_FLYOUT_ITEM_COLOR = '#1f1f20';
+const PLATFORM_SIDEBAR_NAV_ACTIVE_BG_OPEN = 'data-[state=open]:bg-[#cfe8fa]/40 data-[state=open]:hover:bg-[#cfe8fa]/50';
+const SidebarNavCallbackContext = React.createContext({});
+const PlatformSidebarNavCallbackProvider = SidebarNavCallbackContext.Provider;
+/** After-nav callback (closes the mobile sheet, etc.) for items rendered
+ * anywhere inside the PlatformSidebar — including host-app custom sections. */
+function usePlatformSidebarNavCallback() {
+    return React.useContext(SidebarNavCallbackContext);
+}
+function PlatformSidebarCollapsedLabelFlyout({ label, children, }) {
+    return (jsxs(HoverCard, { openDelay: 180, closeDelay: 120, children: [jsx(HoverCardTrigger, { asChild: true, children: children }), jsx(HoverCardContent, { side: "right", align: "start", sideOffset: 10, className: "z-[200] w-max max-w-[280px] min-w-[120px] rounded-2xl border border-[#e6e6e8] bg-white px-3 py-2.5 shadow-[0_10px_40px_-12px_rgba(15,23,42,0.18)]", children: jsx("span", { className: "text-[13px] leading-tight font-medium", style: { color: PLATFORM_SIDEBAR_FLYOUT_TITLE_COLOR }, children: label }) })] }));
+}
+function PlatformSidebarNavDivider() {
+    return jsx("div", { role: "separator", className: "my-2.5 h-px w-full shrink-0 bg-[#e9e9ea]", "aria-hidden": true });
+}
+function PlatformSidebarSubNavItem({ id, label, href, exact, emptyState, onItemSelect, }) {
+    const { onAfterNav } = usePlatformSidebarNavCallback();
+    const router = useRouter();
+    const pathname = usePathname();
+    const [isPending, startTransition] = React.useTransition();
+    const active = React.useMemo(() => {
+        if (!href || !pathname)
+            return false;
+        if (href === '/')
+            return pathname === '/';
+        const normalizedHref = href.endsWith('/') ? href.slice(0, -1) : href;
+        const normalizedPath = pathname.endsWith('/') ? pathname.slice(0, -1) : pathname;
+        if (exact)
+            return normalizedPath === normalizedHref;
+        return normalizedPath === normalizedHref || normalizedPath.startsWith(`${normalizedHref}/`);
+    }, [href, pathname, exact]);
+    return (jsxs("button", { type: "button", disabled: isPending || emptyState, "aria-busy": isPending, className: cn('flex w-full min-w-0 cursor-pointer items-center gap-2 rounded-md px-2 py-2 text-left text-[14px] font-normal transition-colors', emptyState
+            ? 'cursor-default text-[#94a3b8] italic hover:bg-transparent'
+            : active
+                ? 'bg-[#eef6fc] text-[#1e40af]'
+                : 'text-[#4a5568] hover:bg-[#f4f4f4]', isPending && 'opacity-70'), onClick: () => {
+            if (emptyState)
+                return;
+            const result = onItemSelect === null || onItemSelect === void 0 ? void 0 : onItemSelect(id);
+            if (result === false)
+                return;
+            if (href) {
+                if (/^https?:\/\//i.test(href)) {
+                    window.open(href, '_blank', 'noopener,noreferrer');
+                }
+                else {
+                    startTransition(() => {
+                        router.push(href);
+                    });
+                }
+            }
+            onAfterNav === null || onAfterNav === void 0 ? void 0 : onAfterNav();
+        }, children: [jsx("span", { className: "min-w-0 flex-1 truncate", children: label }), isPending && (jsx(LoaderCircle, { className: "size-3.5 shrink-0 animate-spin text-[#7d7e82]", "aria-hidden": true }))] }));
+}
+function PlatformSidebarCollapsedNavFlyout({ icon: Icon, label, items, onIconClick, onItemSelect, }) {
+    const router = useRouter();
+    const { onAfterNav } = usePlatformSidebarNavCallback();
+    return (jsxs(HoverCard, { openDelay: 180, closeDelay: 120, children: [jsx(HoverCardTrigger, { asChild: true, children: jsx("button", { type: "button", onClick: onIconClick, className: "text-foreground inline-flex size-8 shrink-0 cursor-pointer items-center justify-center rounded-[8px] transition-colors outline-none hover:bg-[#f0f0f0] focus-visible:ring-2 focus-visible:ring-[#c4c4c8] focus-visible:ring-offset-2 focus-visible:ring-offset-[#fafafa]", "aria-label": label, children: jsx(Icon, { className: "size-4 shrink-0", style: { color: PLATFORM_SIDEBAR_NAV_MUTED }, strokeWidth: 1.5 }) }) }), jsxs(HoverCardContent, { side: "right", align: "start", sideOffset: 10, className: "z-[200] flex max-h-[70vh] w-max max-w-[280px] min-w-[200px] flex-col rounded-2xl border border-[#e6e6e8] bg-white px-3 py-2.5 shadow-[0_10px_40px_-12px_rgba(15,23,42,0.18)]", children: [jsx("div", { className: "mb-1.5 flex shrink-0 flex-wrap items-center gap-2", children: jsx("span", { className: "text-[13px] leading-tight font-medium", style: { color: PLATFORM_SIDEBAR_FLYOUT_TITLE_COLOR }, children: label }) }), jsx("ul", { className: "scrollbar-thin m-0 min-h-0 list-none space-y-0 overflow-y-auto p-0 pr-1", children: items.map((item) => (jsx("li", { children: jsx("button", { type: "button", onClick: () => {
+                                    if ((onItemSelect === null || onItemSelect === void 0 ? void 0 : onItemSelect(item.id)) === false)
+                                        return;
+                                    if (item.href)
+                                        router.push(item.href);
+                                    onAfterNav === null || onAfterNav === void 0 ? void 0 : onAfterNav();
+                                }, className: cn('flex w-full cursor-pointer rounded-md px-1.5 py-1.5 text-left text-[14px] leading-snug font-medium transition-colors', item.emptyState
+                                    ? 'cursor-default text-[#94a3b8] italic hover:bg-transparent'
+                                    : 'hover:bg-[#f4f4f4]'), style: item.emptyState ? undefined : { color: PLATFORM_SIDEBAR_FLYOUT_ITEM_COLOR }, children: item.label }) }, item.id))) })] })] }));
+}
+function PlatformSidebarNavSection({ collapsed, menu, open, onOpenChange, onCollapsedIconClick, onItemSelect, }) {
+    const Icon = menu.icon;
+    if (collapsed) {
+        return (jsx(PlatformSidebarCollapsedNavFlyout, { icon: Icon, label: menu.label, items: menu.items, onIconClick: onCollapsedIconClick, onItemSelect: onItemSelect }));
+    }
+    const triggerClassName = cn('flex h-9 w-full min-w-0 cursor-pointer items-center gap-2 rounded-md px-2 text-left text-[14px] font-normal text-[#5f5f61] outline-none transition-colors hover:bg-[#f4f4f4] focus-visible:ring-2 focus-visible:ring-[#cfe8fa] focus-visible:ring-offset-2 focus-visible:ring-offset-[#fafafa]', PLATFORM_SIDEBAR_NAV_ACTIVE_BG_OPEN);
+    return (jsxs(Collapsible, { open: open, onOpenChange: onOpenChange, className: "w-full", children: [jsx(CollapsibleTrigger, { asChild: true, children: jsxs("button", { type: "button", className: triggerClassName, children: [jsx(Icon, { className: "size-4 shrink-0", style: { color: PLATFORM_SIDEBAR_NAV_MUTED }, strokeWidth: 1.5 }), jsx("span", { className: "min-w-0 flex-1 truncate", children: menu.label }), open ? (jsx(ChevronDown, { className: "size-4 shrink-0 text-[#7d7e82]", "aria-hidden": true })) : (jsx(ChevronRight, { className: "size-4 shrink-0 text-[#7d7e82]", "aria-hidden": true }))] }) }), jsx(CollapsibleContent, { className: "overflow-hidden", children: jsx("div", { className: "mt-0.5 mr-1 ml-1.5 border-l-2 border-[#e2e8f0] pb-0.5 pl-2.5", children: jsx("ul", { className: "flex flex-col gap-0.5", role: "list", children: menu.items.map((item) => (jsx("li", { children: jsx(PlatformSidebarSubNavItem, { ...item, onItemSelect: onItemSelect }) }, item.id))) }) }) })] }));
+}
+
+const DEFAULT_SUPPORT_URL = 'https://ibl.ai/docs';
+/**
+ * The INVARIANT footer visibility rules, shared by every SPA:
+ *
+ *  - Notifications: gated by the host-supplied user-type signal only —
+ *    regular users have notifications too.
+ *  - Live admins get the admin cluster narrowed by their RBAC platform
+ *    permissions (Invites, Management, Monetization) plus the ungated
+ *    Integrations and Advanced rows.
+ *  - Trial-gated non-admins (main/advertising tenants) and anonymous
+ *    users get the FULL admin cluster; the host's `onAction` handler is
+ *    expected to route clicks to the upgrade dialog / login instead of
+ *    the real surface.
+ *  - A genuine non-admin in an RBAC-enabled tenant sees only the rows
+ *    whose platform permission they actually hold. Integrations and
+ *    Advanced have no dedicated RBAC permission, so they stay
+ *    admin/trial/anonymous-only.
+ */
+function usePlatformSidebarFooterActions(config) {
+    const t = useT();
+    const { isAdmin, isLiveAdmin, showTrialGatedAdminMenu, showAnonymousAdminMenu, enableRbac, rbacPermissions, tenantKey, currentTenant, notificationsAllowed, invitesUserTypeAllowed, } = config;
+    return React.useMemo(() => {
+        var _a;
+        const actions = [];
+        if (notificationsAllowed) {
+            actions.push({
+                id: 'notifications',
+                label: t('platformSidebar.notifications'),
+                icon: Bell,
+            });
+        }
+        const tenantKeyForRbac = (_a = currentTenant === null || currentTenant === void 0 ? void 0 : currentTenant.key) !== null && _a !== void 0 ? _a : tenantKey;
+        const hasInviteUserPermission = checkRbacPermission(rbacPermissions, `/platforms/${tenantKeyForRbac}/#can_invite`, enableRbac);
+        // Management surfaces a row when ANY of its sub-tab permissions
+        // resolves true — matches the Admin component's `hasManagementPermissions`.
+        const hasManagementPermissions = checkRbacPermission(rbacPermissions, `/platforms/${tenantKeyForRbac}/#can_manage_users`, enableRbac) ||
+            checkRbacPermission(rbacPermissions, `/groups/#list`, enableRbac) ||
+            checkRbacPermission(rbacPermissions, `/policies/#list`, enableRbac) ||
+            checkRbacPermission(rbacPermissions, `/roles/#list`, enableRbac) ||
+            checkRbacPermission(rbacPermissions, `/usergroups/#list|/platforms/${tenantKeyForRbac}/#can_invite`, enableRbac) ||
+            checkRbacPermission(rbacPermissions, `/watchedgroups/#list`, enableRbac);
+        const hasMonetizationPermission = checkRbacPermission(rbacPermissions, `/platforms/${tenantKeyForRbac}/#can_sell_items`, enableRbac);
+        const canMonetize = !!(currentTenant === null || currentTenant === void 0 ? void 0 : currentTenant.enable_monetization) && hasMonetizationPermission;
+        if (isLiveAdmin) {
+            if (hasInviteUserPermission && invitesUserTypeAllowed) {
+                actions.push({ id: 'invites', label: t('platformSidebar.invites'), icon: Mail });
+            }
+            if (hasManagementPermissions) {
+                actions.push({
+                    id: 'management',
+                    label: t('platformSidebar.management'),
+                    icon: Users,
+                });
+            }
+            actions.push({
+                id: 'integrations',
+                label: t('platformSidebar.integrations'),
+                icon: KeyRound,
+            });
+            if (canMonetize) {
+                actions.push({
+                    id: 'monetization',
+                    label: t('platformSidebar.monetization'),
+                    icon: Coins,
+                });
+            }
+            actions.push({
+                id: 'advanced',
+                label: t('platformSidebar.advanced'),
+                icon: Settings$1,
+            });
+        }
+        else if (showTrialGatedAdminMenu || showAnonymousAdminMenu) {
+            // Full admin cluster; the host's onAction routes these to the
+            // upgrade dialog (trial users) or the auth SPA login (anonymous).
+            actions.push({ id: 'invites', label: t('platformSidebar.invites'), icon: Mail });
+            actions.push({
+                id: 'management',
+                label: t('platformSidebar.management'),
+                icon: Users,
+            });
+            actions.push({
+                id: 'integrations',
+                label: t('platformSidebar.integrations'),
+                icon: KeyRound,
+            });
+            actions.push({
+                id: 'monetization',
+                label: t('platformSidebar.monetization'),
+                icon: Coins,
+            });
+            actions.push({
+                id: 'advanced',
+                label: t('platformSidebar.advanced'),
+                icon: Settings$1,
+            });
+        }
+        else if (!isAdmin && enableRbac) {
+            // A GENUINE non-admin in an RBAC-enabled tenant sees ONLY the rows
+            // whose platform permission they actually hold. The `enableRbac`
+            // guard is required because `checkRbacPermission` returns true when
+            // RBAC is off, which would otherwise expose these to every non-admin.
+            if (hasInviteUserPermission) {
+                actions.push({ id: 'invites', label: t('platformSidebar.invites'), icon: Mail });
+            }
+            if (hasManagementPermissions) {
+                actions.push({
+                    id: 'management',
+                    label: t('platformSidebar.management'),
+                    icon: Users,
+                });
+            }
+            if (canMonetize) {
+                actions.push({
+                    id: 'monetization',
+                    label: t('platformSidebar.monetization'),
+                    icon: Coins,
+                });
+            }
+        }
+        return actions;
+    }, [
+        t,
+        isAdmin,
+        isLiveAdmin,
+        showTrialGatedAdminMenu,
+        showAnonymousAdminMenu,
+        enableRbac,
+        rbacPermissions,
+        tenantKey,
+        currentTenant,
+        notificationsAllowed,
+        invitesUserTypeAllowed,
+    ]);
+}
+function PlatformSidebarFooter({ collapsed, config, }) {
+    var _a;
+    const t = useT();
+    const actions = usePlatformSidebarFooterActions(config);
+    const supportUrl = (_a = config.supportUrl) !== null && _a !== void 0 ? _a : DEFAULT_SUPPORT_URL;
+    if (collapsed) {
+        return (jsxs("div", { className: "flex shrink-0 flex-col items-center gap-0.5 border-t border-[#e2e8f0] px-2 py-3", children: [actions.map((action) => {
+                    const Icon = action.icon;
+                    return (jsx(PlatformSidebarCollapsedLabelFlyout, { label: action.label, children: jsx("button", { type: "button", className: "inline-flex size-10 cursor-pointer items-center justify-center rounded-lg text-[#5f5f61] transition-colors hover:bg-[#f0f0f0]", "aria-label": action.label, onClick: () => config.onAction(action.id), children: jsx(Icon, { className: "size-4 shrink-0", strokeWidth: 1.5 }) }) }, action.id));
+                }), jsx(PlatformSidebarCollapsedLabelFlyout, { label: t('platformSidebar.support'), children: jsx("a", { href: supportUrl, target: "_blank", rel: "noopener noreferrer", className: "inline-flex size-10 items-center justify-center rounded-lg text-[#5f5f61] transition-colors hover:bg-[#f0f0f0]", "aria-label": t('platformSidebar.support'), children: jsx(BookOpen, { className: "size-4 shrink-0", strokeWidth: 1.5 }) }) })] }));
+    }
+    return (jsxs("div", { className: "shrink-0 space-y-0.5 border-t border-[#e2e8f0] px-2 py-2", children: [actions.map((action) => {
+                const Icon = action.icon;
+                return (jsxs("button", { type: "button", className: "flex h-9 w-full min-w-0 cursor-pointer items-center gap-2 rounded-md px-2 text-left text-[14px] font-normal text-[#5f5f61] transition-colors hover:bg-[#f4f4f4]", onClick: () => config.onAction(action.id), children: [jsx(Icon, { className: "size-4 shrink-0", style: { color: PLATFORM_SIDEBAR_NAV_MUTED }, strokeWidth: 1.5 }), jsx("span", { className: "min-w-0 flex-1 truncate", children: action.label })] }, action.id));
+            }), jsxs("a", { href: supportUrl, target: "_blank", rel: "noopener noreferrer", className: "flex h-9 w-full min-w-0 items-center gap-2 rounded-md px-2 text-left text-[14px] font-normal text-[#5f5f61] transition-colors hover:bg-[#f4f4f4]", children: [jsx(BookOpen, { className: "size-4 shrink-0", style: { color: PLATFORM_SIDEBAR_NAV_MUTED }, strokeWidth: 1.5 }), jsx("span", { className: "min-w-0 flex-1 truncate", children: t('platformSidebar.support') })] })] }));
+}
+
+/**
+ * Renders one of the organization-level tab components in its own
+ * dialog — `Admin` (Users), `IntegrationsTab` (API), `BillingTab`,
+ * `MonetizationTab`, `AdvancedTab` (Settings). Each sidebar footer
+ * action opens this dialog with a different `tab`; the body switches
+ * the component, so there's no shared tab rail and nothing to hide.
+ *
+ * `organization` doesn't have a sidebar footer entry today, but it's
+ * defined for completeness so adding "Organization" later is a one-line
+ * change.
+ */
+function PlatformAccountSheet({ tab, onClose, tenantKey, username, email, onInviteClick, mainPlatformKey, authUrl, currentSpa, platformBaseDomain, }) {
+    const t = useT();
+    const open = tab !== null;
+    const accountTabTitles = {
+        organization: t('platformSidebar.accountTabOrganization'),
+        management: t('platformSidebar.management'),
+        integrations: t('platformSidebar.integrations'),
+        monetization: t('platformSidebar.monetization'),
+        advanced: t('platformSidebar.advanced'),
+        billing: t('platformSidebar.accountTabBilling'),
+    };
+    const accountTabDescriptions = {
+        organization: t('platformSidebar.accountDescOrganization'),
+        management: t('platformSidebar.accountDescManagement'),
+        integrations: t('platformSidebar.accountDescIntegrations'),
+        monetization: t('platformSidebar.accountDescMonetization'),
+        advanced: t('platformSidebar.accountDescAdvanced'),
+        billing: t('platformSidebar.accountDescBilling'),
+    };
+    return (jsx(Dialog, { open: open, onOpenChange: (o) => !o && onClose(), children: jsxs(DialogContent, { className: "mx-auto my-auto flex h-[90vh] w-[95vw] max-w-none flex-col justify-between gap-0 rounded-lg p-0 sm:max-w-7xl", children: [jsxs(DialogHeader, { className: "flex-shrink-0 border-b border-gray-200 p-4 pt-[30px]", children: [jsx(DialogTitle, { className: "text-lg font-medium text-gray-900 dark:text-gray-100", children: tab ? accountTabTitles[tab] : '' }), jsx(DialogDescription, { className: "text-sm leading-relaxed text-gray-600", children: tab ? accountTabDescriptions[tab] : '' })] }), jsxs("div", { className: "min-h-0 flex-1 overflow-y-auto p-6", children: [tab === 'management' && (jsx(Admin, { tenant: tenantKey, onInviteClick: onInviteClick, 
+                            // RBAC is off for this entry point — admin users see every
+                            // sub-tab. Tenant-level access is already gated by the
+                            // sidebar footer visibility rules.
+                            hasUserTabPermission: true, hasGroupsTabPermission: true, hasRolesTabPermission: true, hasPoliciesTabPermission: true, hasTeamsTabPermission: true, hasAlertsTabPermission: true, hasInviteUserPermission: true, hasCreateTeamPermission: true, enableRbac: false, rbacPermissions: {} })), tab === 'integrations' && jsx(IntegrationsTab, { tenantKey: tenantKey, username: username }), tab === 'billing' && (jsx(BillingTab, { tenant: tenantKey, username: username, mainPlatformKey: mainPlatformKey, currentUserEmail: email })), tab === 'monetization' && jsx(MonetizationTab, { platformKey: tenantKey, authURL: authUrl }), tab === 'advanced' && (jsx(AdvancedTab, { platformKey: tenantKey, username: username, currentSPA: currentSpa, authURL: authUrl, currentPlatformBaseDomain: platformBaseDomain }))] })] }) }));
+}
+
+/**
+ * Cross-SPA sidebar shell.
+ *
+ * Invariant chrome (owned here): header with logo slot + collapse
+ * toggle, the collapsed icon rail behavior, single-open accordion state
+ * for sections, and the footer cluster (Notifications, Invites,
+ * Management, Integrations, Monetization, Advanced, Support) with its
+ * RBAC/admin visibility rules.
+ *
+ * Variable content (owned by the host SPA): the primary action button
+ * (e.g. "New Chat") and the nav sections — declarative menus or fully
+ * custom sections rendered through `PlatformSidebarSectionContext`.
+ */
+function PlatformSidebar({ logo, primaryAction, sections, footer, openSectionId, onOpenSectionChange, onAfterNav: onAfterNavProp, className, sidebarInnerClassName, }) {
+    var _a;
+    const t = useT();
+    const { state, open, openMobile, setOpenMobile, toggleSidebar, isMobile } = useSidebar();
+    const isExpanded = isMobile ? openMobile : open;
+    const railCollapsed = !isMobile && !open;
+    const onAfterNav = React.useCallback(() => {
+        if (isMobile)
+            setOpenMobile(false);
+        onAfterNavProp === null || onAfterNavProp === void 0 ? void 0 : onAfterNavProp();
+    }, [isMobile, setOpenMobile, onAfterNavProp]);
+    // Single-open accordion for sections. Controlled when `openSectionId`
+    // is provided, uncontrolled otherwise.
+    const [internalOpenSection, setInternalOpenSection] = React.useState(null);
+    const isControlled = openSectionId !== undefined;
+    const openSection = isControlled ? openSectionId : internalOpenSection;
+    const setOpenSection = React.useCallback((sectionId) => {
+        if (!isControlled)
+            setInternalOpenSection(sectionId);
+        onOpenSectionChange === null || onOpenSectionChange === void 0 ? void 0 : onOpenSectionChange(sectionId);
+    }, [isControlled, onOpenSectionChange]);
+    const expandFromRail = React.useCallback((sectionId) => {
+        toggleSidebar();
+        setOpenSection(sectionId);
+    }, [toggleSidebar, setOpenSection]);
+    const sectionContext = React.useCallback((sectionId) => ({
+        collapsed: railCollapsed,
+        open: openSection === sectionId,
+        onOpenChange: (o) => setOpenSection(o ? sectionId : null),
+        expandFromRail: () => expandFromRail(sectionId),
+        onAfterNav,
+    }), [railCollapsed, openSection, setOpenSection, expandFromRail, onAfterNav]);
+    const renderSection = (section) => {
+        if (section.type === 'divider') {
+            return jsx(PlatformSidebarNavDivider, {}, section.id);
+        }
+        if (section.type === 'custom') {
+            return (jsx(React.Fragment, { children: section.render(sectionContext(section.id)) }, section.id));
+        }
+        if (section.menu.items.length === 0)
+            return null;
+        const ctx = sectionContext(section.menu.id);
+        return (jsx(PlatformSidebarNavSection, { collapsed: railCollapsed, menu: section.menu, open: ctx.open, onOpenChange: ctx.onOpenChange, onItemSelect: section.onItemSelect, onCollapsedIconClick: railCollapsed ? ctx.expandFromRail : undefined }, section.menu.id));
+    };
+    const PrimaryActionIcon = (_a = primaryAction === null || primaryAction === void 0 ? void 0 : primaryAction.icon) !== null && _a !== void 0 ? _a : SquarePen;
+    return (jsx(PlatformSidebarNavCallbackProvider, { value: { onAfterNav }, children: jsx(Sidebar, { collapsible: "icon", variant: "sidebar", className: cn('flex flex-col border-r border-[#e9e9ea]', className), sidebarInnerClassName: sidebarInnerClassName !== null && sidebarInnerClassName !== void 0 ? sidebarInnerClassName : 'bg-[#fafafa]', children: jsxs("aside", { "data-state": state, className: cn('flex h-full flex-col', railCollapsed ? 'w-[65px]' : 'w-full'), children: [jsx("div", { className: cn('shrink-0', railCollapsed ? 'px-2 pt-[18px] pb-[25px]' : 'px-[10px] py-[10px]'), children: jsxs("div", { className: cn('flex items-center gap-2 font-sans', railCollapsed ? 'justify-center px-0' : 'px-1'), children: [!railCollapsed && (jsxs(Fragment$1, { children: [jsx("span", { className: "size-7 shrink-0", "aria-hidden": true }), jsx("div", { className: "flex min-w-0 flex-1 items-center justify-center", children: logo })] })), jsx(PlatformSidebarCollapsedLabelFlyout, { label: isExpanded
+                                        ? t('platformSidebar.collapseSidebar')
+                                        : t('platformSidebar.expandSidebar'), children: jsx("button", { type: "button", onClick: toggleSidebar, className: "inline-flex size-7 shrink-0 cursor-pointer items-center justify-center rounded-md font-sans text-[#7d7e82] transition-colors hover:bg-[#f0f0f0]", "aria-label": isExpanded
+                                            ? t('platformSidebar.collapseSidebar')
+                                            : t('platformSidebar.expandSidebar'), "aria-expanded": isExpanded, children: jsx("svg", { width: 20, height: 20, viewBox: "0 0 20 20", fill: "currentColor", xmlns: "http://www.w3.org/2000/svg", className: "shrink-0", "aria-hidden": true, children: jsx("path", { d: "M16.5 4A1.5 1.5 0 0 1 18 5.5v9a1.5 1.5 0 0 1-1.5 1.5h-13A1.5 1.5 0 0 1 2 14.5v-9A1.5 1.5 0 0 1 3.5 4zM7 15h9.5a.5.5 0 0 0 .5-.5v-9a.5.5 0 0 0-.5-.5H7zM3.5 5a.5.5 0 0 0-.5.5v9a.5.5 0 0 0 .5.5H6V5z" }) }) }) })] }) }), railCollapsed ? (jsxs("nav", { className: "flex min-h-0 flex-1 flex-col items-center gap-1 overflow-y-auto px-2 pt-1 pb-2", "aria-label": t('platformSidebar.mainNavigation'), children: [primaryAction && (jsx(PlatformSidebarCollapsedLabelFlyout, { label: primaryAction.label, children: jsx("button", { type: "button", onClick: primaryAction.onClick, className: "text-foreground inline-flex size-8 shrink-0 cursor-pointer items-center justify-center rounded-[8px] border border-[#e0e0e2] bg-white transition-colors hover:bg-[#f8f8f9]", "aria-label": primaryAction.label, children: jsx(PrimaryActionIcon, { className: "size-4 shrink-0", strokeWidth: 1.5 }) }) })), sections.map(renderSection)] })) : (jsx("nav", { className: "min-h-0 flex-1 overflow-y-auto px-2 pt-1 pb-2", "aria-label": t('platformSidebar.mainNavigation'), children: jsxs("div", { className: "space-y-0.5", children: [primaryAction && (jsx("div", { className: "px-0 pb-0.5", children: jsxs("button", { type: "button", onClick: primaryAction.onClick, className: "inline-flex h-9 w-full cursor-pointer items-center justify-start gap-2 rounded-[8px] border border-[#e0e0e2] bg-white px-2 text-[14px] font-normal text-[#687482] antialiased transition-colors hover:bg-[#f8f8f9] active:bg-[#f2f2f3]", children: [jsx(PrimaryActionIcon, { className: "size-4 shrink-0", strokeWidth: 1.5, "aria-hidden": true }), jsx("span", { children: primaryAction.label })] }) })), sections.map(renderSection)] }) })), footer && jsx(PlatformSidebarFooter, { collapsed: railCollapsed, config: footer })] }) }) }));
+}
+
 function useTimeTracker(config) {
     var _a;
-    const router = useRouter();
+    const router = useRouter$1();
     const trackerRef = useRef(null);
     const enabledRef = useRef((_a = config.enabled) !== null && _a !== void 0 ? _a : true);
     const getCurrentUrl = useCallback(() => {
@@ -256566,8 +257652,8 @@ const CourseContentLayout = ({ courseId, isPlatformAdmin, currentTenant, tabHref
                                         }, children: children }) })] })] })] }) }));
 };
 
-const CustomSwitch = React.forwardRef(({ className, checked, onCheckedChange, ...props }, ref) => (jsx(Root$a, { checked: checked, onCheckedChange: onCheckedChange, className: cn('peer focus-visible:ring-ring focus-visible:ring-offset-background inline-flex h-6 w-11 shrink-0 cursor-pointer items-center rounded-full border-2 border-transparent transition-colors focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:outline-none disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:bg-blue-500 data-[state=unchecked]:bg-gray-200', className), ...props, ref: ref, children: jsx(Thumb, { className: cn('pointer-events-none block h-5 w-5 rounded-full bg-white shadow-lg ring-0 transition-transform data-[state=checked]:translate-x-5 data-[state=unchecked]:translate-x-0') }) })));
-CustomSwitch.displayName = Root$a.displayName;
+const CustomSwitch = React.forwardRef(({ className, checked, onCheckedChange, ...props }, ref) => (jsx(Root$c, { checked: checked, onCheckedChange: onCheckedChange, className: cn('peer focus-visible:ring-ring focus-visible:ring-offset-background inline-flex h-6 w-11 shrink-0 cursor-pointer items-center rounded-full border-2 border-transparent transition-colors focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:outline-none disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:bg-blue-500 data-[state=unchecked]:bg-gray-200', className), ...props, ref: ref, children: jsx(Thumb, { className: cn('pointer-events-none block h-5 w-5 rounded-full bg-white shadow-lg ring-0 transition-transform data-[state=checked]:translate-x-5 data-[state=unchecked]:translate-x-0') }) })));
+CustomSwitch.displayName = Root$c.displayName;
 
 /**
  * Label contract for the Settings tab and its two sub-modals.
@@ -321530,5 +322616,5 @@ var index_es = /*#__PURE__*/Object.freeze({
     vectorsRatio: vectorsRatio
 });
 
-export { AGENT_ACCESS_TAB_LABELS, AGENT_API_TAB_LABELS, AGENT_DATASETS_TAB_LABELS, AGENT_DISCLAIMERS_TAB_LABELS, AGENT_EMBED_TAB_LABELS, AGENT_HISTORY_TAB_LABELS, AGENT_LLM_TAB_LABELS, AGENT_LTI_TAB_LABELS, AGENT_MEMORY_TAB_LABELS, AGENT_PICKER_LABELS, AGENT_PRIVACY_TAB_LABELS, AGENT_PROMPTS_TAB_LABELS, AGENT_SAFETY_TAB_LABELS, AGENT_SCREENSHARE_TAB_LABELS, AGENT_SEARCH_LABELS, AGENT_SETTINGS_TAB_LABELS, AGENT_TASKS_TAB_LABELS, AGENT_TOOLS_TAB_LABELS, AGENT_VOICE_TAB_LABELS, Account, AgentAccessTab, AgentApiTab, AgentCard, AgentDatasetsTab, AgentDisclaimersTab, AgentEmbedTab, AgentEmptyState, AgentHistoryTab, AgentLLMTab, AgentLtiTab, AgentMemoryTab, AgentPrivacyTab, AgentPromptsTab, AgentSafetyTab, AgentScreenShareTab, AgentSearch, AgentSearchFilters, AgentSearchInput, AgentSettingsProvider, AgentSettingsTab, AgentTasksTab, AgentToolsTab, AgentVoiceTab, AppSidebar, CATALOGS, Chat, ClientErrorPage, ConversationStarters$1 as ConversationStarters, CopyButton, CopyMentorModal, CourseBox, CourseContentLayout, CourseContentTabPage, CreatePathwayModal, CredentialDetailModal, CredentialMiniBox, DEFAULT_LOCALE, DeleteMentorModal, EMPTY_PROGRAM_SETTINGS_FORM, EdxIframe, ErrorPage, GreetingMethod, McpTab, MediaBox, MentorSelectionGrid, NavBar, OrganizationTab, PathwayDetailModal, ProfileInfoCards, ProfileTabs, ProgramDetailModal, ProjectsSidebarDropdown, SUPPORTED_LOCALES, SidebarInset, SidebarProvider, SidebarTrigger, SsoLogin, StarButton, UserProfileDropdown, UserProfileModal, WebContainersI18nProvider, formatDateString, getCatalog, getLLMProviderDetails, initializeLocalStorageWithObject, isValidLocale, resolveAgentPickerLabels, resolveAgentSearchLabels, resolveSettingsTabLabels, useAgentSearch, useAgentSearchWithPagination, useAgentSettings, useAgentStar, useGetChatDetails, useSidebar, useT, useTimeTracker, useWebContainersI18n, useWebContainersLocale };
+export { AGENT_ACCESS_TAB_LABELS, AGENT_API_TAB_LABELS, AGENT_DATASETS_TAB_LABELS, AGENT_DISCLAIMERS_TAB_LABELS, AGENT_EMBED_TAB_LABELS, AGENT_HISTORY_TAB_LABELS, AGENT_LLM_TAB_LABELS, AGENT_LTI_TAB_LABELS, AGENT_MEMORY_TAB_LABELS, AGENT_PICKER_LABELS, AGENT_PRIVACY_TAB_LABELS, AGENT_PROMPTS_TAB_LABELS, AGENT_SAFETY_TAB_LABELS, AGENT_SCREENSHARE_TAB_LABELS, AGENT_SEARCH_LABELS, AGENT_SETTINGS_TAB_LABELS, AGENT_TASKS_TAB_LABELS, AGENT_TOOLS_TAB_LABELS, AGENT_VOICE_TAB_LABELS, Account, AgentAccessTab, AgentApiTab, AgentCard, AgentDatasetsTab, AgentDisclaimersTab, AgentEmbedTab, AgentEmptyState, AgentHistoryTab, AgentLLMTab, AgentLtiTab, AgentMemoryTab, AgentPrivacyTab, AgentPromptsTab, AgentSafetyTab, AgentScreenShareTab, AgentSearch, AgentSearchFilters, AgentSearchInput, AgentSettingsProvider, AgentSettingsTab, AgentTasksTab, AgentToolsTab, AgentVoiceTab, AppSidebar, CATALOGS, Chat, ClientErrorPage, ConversationStarters$1 as ConversationStarters, CopyButton, CopyMentorModal, CourseBox, CourseContentLayout, CourseContentTabPage, CreatePathwayModal, CredentialDetailModal, CredentialMiniBox, DEFAULT_LOCALE, DeleteMentorModal, EMPTY_PROGRAM_SETTINGS_FORM, EdxIframe, ErrorPage, GreetingMethod, McpTab, MediaBox, MentorSelectionGrid, NavBar, OrganizationTab, PLATFORM_SIDEBAR_FLYOUT_ITEM_COLOR, PLATFORM_SIDEBAR_FLYOUT_TITLE_COLOR, PLATFORM_SIDEBAR_NAV_ACTIVE_BG_OPEN, PLATFORM_SIDEBAR_NAV_MUTED, PathwayDetailModal, PlatformAccountSheet, PlatformSidebar, PlatformSidebarCollapsedLabelFlyout, PlatformSidebarCollapsedNavFlyout, PlatformSidebarFooter, PlatformSidebarNavDivider, PlatformSidebarNavSection, PlatformSidebarSubNavItem, ProfileInfoCards, ProfileTabs, ProgramDetailModal, ProjectsSidebarDropdown, SUPPORTED_LOCALES, SidebarInset, SidebarProvider, SidebarTrigger, SsoLogin, StarButton, UserProfileDropdown, UserProfileModal, WebContainersI18nProvider, formatDateString, getCatalog, getLLMProviderDetails, initializeLocalStorageWithObject, isValidLocale, resolveAgentPickerLabels, resolveAgentSearchLabels, resolveSettingsTabLabels, useAgentSearch, useAgentSearchWithPagination, useAgentSettings, useAgentStar, useGetChatDetails, usePlatformSidebarFooterActions, usePlatformSidebarNavCallback, useSidebar, useT, useTimeTracker, useWebContainersI18n, useWebContainersLocale };
 //# sourceMappingURL=index.esm.js.map