@carlonicora/nextjs-jsonapi 1.135.1 → 1.136.0

package/dist/billing/index.mjs

@@ -48,7 +48,7 @@ import {
   TabsList,
   TabsTrigger,
   useCurrentUserContext
-} from "../chunk-EF2HVXOV.mjs";
+} from "../chunk-2KXPQHZU.mjs";
 import {
   getRoleId,
   getStripePublishableKey

package/dist/{chunk-EF2HVXOV.mjs → chunk-2KXPQHZU.mjs}

@@ -10117,7 +10117,7 @@ import { useRef as useRef17 } from "react";
 import dynamic from "next/dynamic";
 import React17 from "react";
 import { jsx as jsx86 } from "react/jsx-runtime";
-var BlockNoteEditor = dynamic(() => import("./BlockNoteEditor-FAPCNKXZ.mjs"), {
+var BlockNoteEditor = dynamic(() => import("./BlockNoteEditor-JVZ2HDAU.mjs"), {
   ssr: false
 });
 var BlockNoteEditorContainer = React17.memo(/* @__PURE__ */ __name(function EditorContainer(props) {
@@ -14812,16 +14812,19 @@ __name(ReactMarkdownContainer, "ReactMarkdownContainer");
 // src/components/containers/RoundPageContainerTitle.tsx
 import { InfoIcon as InfoIcon2 } from "lucide-react";
 import { jsx as jsx160, jsxs as jsxs93 } from "react/jsx-runtime";
+var HEADER_ROW_MIN_H = "min-h-[53px]";
 function RoundPageContainerTitle({
   module,
   details,
+  detailsTitle,
+  detailsIcon,
   showDetails,
   setShowDetails
 }) {
   const { title } = useSharedContext();
   const isMobile = useIsMobile();
   return /* @__PURE__ */ jsxs93("div", { className: "flex w-full flex-col border-b", children: [
-    /* @__PURE__ */ jsxs93("div", { className: cn(`flex w-full flex-row items-center gap-x-2 p-4 justify-between`), children: [
+    /* @__PURE__ */ jsxs93("div", { className: cn(`flex w-full flex-row items-center gap-x-2 p-4 justify-between`, HEADER_ROW_MIN_H), children: [
       !isMobile ? /* @__PURE__ */ jsxs93("div", { className: "flex w-full gap-x-4", children: [
         /* @__PURE__ */ jsxs93("div", { className: "text-muted-foreground flex items-center gap-x-2 text-lg font-light whitespace-nowrap", children: [
           title.titleActions,
@@ -14845,10 +14848,14 @@ function RoundPageContainerTitle({
               variant: showDetails ? `ghost` : `default`,
               onClick: () => setShowDetails(!showDetails),
               className: cn(`cursor-pointer`),
-              children: /* @__PURE__ */ jsx160(InfoIcon2, {})
+              children: detailsIcon ?? /* @__PURE__ */ jsx160(InfoIcon2, {})
             }
           ) }),
-          /* @__PURE__ */ jsx160(TooltipContent, { children: showDetails ? "Hide details" : "Show details" })
+          /* @__PURE__ */ jsxs93(TooltipContent, { children: [
+            showDetails ? "Hide" : "Show",
+            " ",
+            detailsTitle ?? "details"
+          ] })
         ] })
       ] })
     ] }),
@@ -14881,26 +14888,36 @@ function RoundPageContainer({
   forceHeader,
   header,
   layout: layout2 = "tabs",
-  onSectionChange
+  onSectionChange,
+  testId,
+  defaultDetailsOpen = false,
+  detailsTitle,
+  detailsIcon
 }) {
   const headerChildren = useHeaderChildren();
   const headerLeftContent = useHeaderLeftContent();
   const headerLogo = useHeaderLogo();
   const headerMobileChildren = useHeaderMobileChildren();
-  const [showDetails, setShowDetailsState] = useState51(false);
+  const [showDetails, setShowDetailsState] = useState51(defaultDetailsOpen);
   const isMobile = useIsMobile();
   const [mounted, setMounted] = useState51(false);
   useEffect41(() => {
-    const match = document.cookie.split("; ").find((row) => row.startsWith(`${DETAILS_COOKIE_NAME}=`));
-    if (match?.split("=")[1] === "true") setShowDetailsState(true);
+    const match = document.cookie.split("; ").find((row) => row.startsWith(`${detailsCookieName}=`));
+    const stored = match?.split("=")[1];
+    if (stored === "true") setShowDetailsState(true);
+    else if (stored === "false") setShowDetailsState(false);
   }, []);
   useEffect41(() => {
     setMounted(true);
   }, []);
-  const setShowDetails = useCallback27((value) => {
-    setShowDetailsState(value);
-    document.cookie = `${DETAILS_COOKIE_NAME}=${value}; path=/; max-age=${DETAILS_COOKIE_MAX_AGE}`;
-  }, []);
+  const detailsCookieName = module?.name ? `${DETAILS_COOKIE_NAME}_${module.name}` : DETAILS_COOKIE_NAME;
+  const setShowDetails = useCallback27(
+    (value) => {
+      setShowDetailsState(value);
+      document.cookie = `${detailsCookieName}=${value}; path=/; max-age=${DETAILS_COOKIE_MAX_AGE}`;
+    },
+    [detailsCookieName]
+  );
   const searchParams = useSearchParams();
   const section = searchParams.get("section");
   const rewriteUrl = useUrlRewriter();
@@ -14945,10 +14962,17 @@ function RoundPageContainer({
           children: headerChildren
         }
       ),
-      /* @__PURE__ */ jsxs94("div", { className: cn("flex h-[calc(100vh-3rem)] w-full flex-col", isMobile ? "gap-1 p-1 pt-0" : "p-2 pt-0 pl-0"), children: [
-        /* @__PURE__ */ jsx161("div", { className: cn("bg-background flex min-h-0 w-full flex-1", isMobile ? "" : "rounded-lg border p-0"), children: /* @__PURE__ */ jsx161("div", { className: "flex w-full flex-col" }) }),
-        /* @__PURE__ */ jsx161(MobileNavigationBar, {})
-      ] })
+      /* @__PURE__ */ jsxs94(
+        "div",
+        {
+          "data-testid": testId,
+          className: cn("flex h-[calc(100vh-3rem)] w-full flex-col", isMobile ? "gap-1 p-1 pt-0" : "p-2 pt-0 pl-0"),
+          children: [
+            /* @__PURE__ */ jsx161("div", { className: cn("bg-background flex min-h-0 w-full flex-1", isMobile ? "" : "rounded-lg border p-0"), children: /* @__PURE__ */ jsx161("div", { className: "flex w-full flex-col" }) }),
+            /* @__PURE__ */ jsx161(MobileNavigationBar, {})
+          ]
+        }
+      )
     ] });
   }
   return /* @__PURE__ */ jsxs94(Fragment24, { children: [
@@ -14962,194 +14986,213 @@ function RoundPageContainer({
         children: headerChildren
       }
     ),
-    /* @__PURE__ */ jsxs94("div", { className: cn(`flex h-[calc(100vh-3rem)] w-full flex-col`, isMobile ? "gap-1 p-1 pt-0" : "p-2 pt-0 pl-0"), children: [
-      /* @__PURE__ */ jsxs94("div", { className: "bg-background flex min-h-0 w-full flex-1 rounded-lg border p-0", children: [
-        /* @__PURE__ */ jsxs94("div", { className: "flex w-full flex-col", children: [
-          (!fullWidth || forceHeader) && /* @__PURE__ */ jsx161(
-            RoundPageContainerTitle,
-            {
-              module,
-              details,
-              showDetails,
-              setShowDetails,
-              fullWidth
-            }
-          ),
-          /* @__PURE__ */ jsx161("div", { className: "flex h-full w-full overflow-hidden", children: layout2 === "rail" && tabs ? (
-            // Rail layout: the vertical-tab navigation is a flush-left
-            // sidebar of the card and the content fills the full remaining
-            // width (like `fullWidth`) — NOT the centred max-w-6xl column.
-            /* @__PURE__ */ jsxs94(
-              Tabs,
-              {
-                value: activeTab,
-                onValueChange: handleTabChange,
-                orientation: "horizontal",
-                className: "flex h-full min-w-0 grow overflow-hidden data-[orientation=horizontal]:flex-row",
-                children: [
-                  /* @__PURE__ */ jsx161(
-                    "aside",
-                    {
-                      "data-testid": "round-page-rail",
-                      className: "hidden shrink-0 border-r p-4 md:flex md:w-56 md:flex-col md:overflow-y-auto",
-                      children: /* @__PURE__ */ jsxs94(TabsList, { className: "flex h-auto flex-col items-stretch gap-0.5 bg-transparent p-0", children: [
-                        ungrouped.map((tab) => /* @__PURE__ */ jsx161(TabsTrigger, { value: tabValue(tab), className: railTriggerClass, children: tab.contentLabel ?? tab.label }, tab.label)),
-                        groups.map((group) => /* @__PURE__ */ jsxs94(Fragment23, { children: [
-                          /* @__PURE__ */ jsx161(
-                            "div",
-                            {
-                              role: "presentation",
-                              className: "text-muted-foreground px-3 pt-3 pb-1 text-[10px] font-bold tracking-wider uppercase",
-                              children: group.label
-                            }
-                          ),
-                          group.items.map((tab) => /* @__PURE__ */ jsx161(TabsTrigger, { value: tabValue(tab), className: railTriggerClass, children: tab.contentLabel ?? tab.label }, tab.label))
-                        ] }, group.label))
-                      ] })
-                    }
-                  ),
-                  /* @__PURE__ */ jsxs94("div", { className: "flex min-w-0 grow flex-col overflow-hidden", children: [
-                    /* @__PURE__ */ jsx161("div", { "data-testid": "round-page-rail-select", className: "p-2 md:hidden", children: /* @__PURE__ */ jsxs94(
-                      Select,
-                      {
-                        items: tabItems,
-                        value: activeTab,
-                        onValueChange: (value) => {
-                          if (value) handleTabChange(value);
-                        },
-                        children: [
-                          /* @__PURE__ */ jsx161(SelectTrigger, { className: "w-full", children: /* @__PURE__ */ jsx161(SelectValue, {}) }),
-                          /* @__PURE__ */ jsxs94(SelectContent, { children: [
-                            ungrouped.map((tab) => /* @__PURE__ */ jsx161(SelectItem, { value: tabValue(tab), children: tab.contentLabel ?? tab.label }, tab.label)),
-                            groups.map((group) => /* @__PURE__ */ jsxs94(SelectGroup, { children: [
-                              /* @__PURE__ */ jsx161(SelectLabel, { children: group.label }),
-                              group.items.map((tab) => /* @__PURE__ */ jsx161(SelectItem, { value: tabValue(tab), children: tab.contentLabel ?? tab.label }, tab.label))
+    /* @__PURE__ */ jsxs94(
+      "div",
+      {
+        "data-testid": testId,
+        className: cn(`flex h-[calc(100vh-3rem)] w-full flex-col`, isMobile ? "gap-1 p-1 pt-0" : "p-2 pt-0 pl-0"),
+        children: [
+          /* @__PURE__ */ jsxs94("div", { className: "bg-background flex min-h-0 w-full flex-1 rounded-lg border p-0", children: [
+            /* @__PURE__ */ jsxs94("div", { className: "flex w-full flex-col", children: [
+              (!fullWidth || forceHeader) && /* @__PURE__ */ jsx161(
+                RoundPageContainerTitle,
+                {
+                  module,
+                  details,
+                  detailsTitle,
+                  detailsIcon,
+                  showDetails,
+                  setShowDetails,
+                  fullWidth
+                }
+              ),
+              /* @__PURE__ */ jsx161("div", { className: "flex h-full w-full overflow-hidden", children: layout2 === "rail" && tabs ? (
+                // Rail layout: the vertical-tab navigation is a flush-left
+                // sidebar of the card and the content fills the full remaining
+                // width (like `fullWidth`) — NOT the centred max-w-6xl column.
+                /* @__PURE__ */ jsxs94(
+                  Tabs,
+                  {
+                    value: activeTab,
+                    onValueChange: handleTabChange,
+                    orientation: "horizontal",
+                    className: "flex h-full min-w-0 grow overflow-hidden data-[orientation=horizontal]:flex-row",
+                    children: [
+                      /* @__PURE__ */ jsx161(
+                        "aside",
+                        {
+                          "data-testid": "round-page-rail",
+                          className: "hidden shrink-0 border-r p-4 md:flex md:w-56 md:flex-col md:overflow-y-auto",
+                          children: /* @__PURE__ */ jsxs94(TabsList, { className: "flex h-auto flex-col items-stretch gap-0.5 bg-transparent p-0", children: [
+                            ungrouped.map((tab) => /* @__PURE__ */ jsx161(TabsTrigger, { value: tabValue(tab), className: railTriggerClass, children: tab.contentLabel ?? tab.label }, tab.label)),
+                            groups.map((group) => /* @__PURE__ */ jsxs94(Fragment23, { children: [
+                              /* @__PURE__ */ jsx161(
+                                "div",
+                                {
+                                  role: "presentation",
+                                  className: "text-muted-foreground px-3 pt-3 pb-1 text-[10px] font-bold tracking-wider uppercase",
+                                  children: group.label
+                                }
+                              ),
+                              group.items.map((tab) => /* @__PURE__ */ jsx161(TabsTrigger, { value: tabValue(tab), className: railTriggerClass, children: tab.contentLabel ?? tab.label }, tab.label))
                             ] }, group.label))
                           ] })
-                        ]
-                      }
-                    ) }),
-                    /* @__PURE__ */ jsx161(
-                      "div",
-                      {
-                        className: cn(
-                          `min-w-0 grow`,
-                          activeFillHeight ? `flex flex-col overflow-hidden` : `overflow-y-auto p-4`
-                        ),
-                        children: /* @__PURE__ */ jsxs94(
-                          "div",
+                        }
+                      ),
+                      /* @__PURE__ */ jsxs94("div", { className: "flex min-w-0 grow flex-col overflow-hidden", children: [
+                        /* @__PURE__ */ jsx161("div", { "data-testid": "round-page-rail-select", className: "p-2 md:hidden", children: /* @__PURE__ */ jsxs94(
+                          Select,
                           {
-                            className: cn(
-                              activeFillHeight ? `flex min-h-0 w-full flex-1 flex-col` : `mx-auto w-full max-w-6xl`
-                            ),
+                            items: tabItems,
+                            value: activeTab,
+                            onValueChange: (value) => {
+                              if (value) handleTabChange(value);
+                            },
                             children: [
-                              header,
-                              tabs.map((tab) => /* @__PURE__ */ jsx161(
-                                TabsContent,
-                                {
-                                  value: tabValue(tab),
-                                  className: tab.fillHeight ? `flex min-h-0 w-full flex-1 flex-col` : ``,
-                                  children: tab.content
-                                },
-                                tab.label
-                              )),
-                              children && /* @__PURE__ */ jsx161("div", { className: "flex", children })
+                              /* @__PURE__ */ jsx161(SelectTrigger, { className: "w-full", children: /* @__PURE__ */ jsx161(SelectValue, {}) }),
+                              /* @__PURE__ */ jsxs94(SelectContent, { children: [
+                                ungrouped.map((tab) => /* @__PURE__ */ jsx161(SelectItem, { value: tabValue(tab), children: tab.contentLabel ?? tab.label }, tab.label)),
+                                groups.map((group) => /* @__PURE__ */ jsxs94(SelectGroup, { children: [
+                                  /* @__PURE__ */ jsx161(SelectLabel, { children: group.label }),
+                                  group.items.map((tab) => /* @__PURE__ */ jsx161(SelectItem, { value: tabValue(tab), children: tab.contentLabel ?? tab.label }, tab.label))
+                                ] }, group.label))
+                              ] })
                             ]
                           }
-                        )
-                      }
-                    )
-                  ] })
-                ]
-              }
-            )
-          ) : /* @__PURE__ */ jsx161(
-            "div",
-            {
-              className: cn(
-                `grow`,
-                isMobile ? `p-2` : `p-4`,
-                activeFillHeight ? `flex flex-col overflow-hidden` : `overflow-y-auto`,
-                fullWidth && `p-0`
-              ),
-              children: /* @__PURE__ */ jsxs94(
-                "div",
-                {
-                  className: cn(
-                    `mx-auto max-w-6xl space-y-8`,
-                    activeFillHeight && `flex w-full flex-1 min-h-0 flex-col space-y-0`,
-                    fullWidth && `max-w-full w-full p-0 h-full`
-                  ),
-                  children: [
-                    header,
-                    tabs ? /* @__PURE__ */ jsxs94(Fragment24, { children: [
-                      /* @__PURE__ */ jsxs94(
-                        Tabs,
-                        {
-                          value: activeTab,
-                          className: cn(`w-full`, activeFillHeight && `flex flex-1 min-h-0 flex-col`),
-                          onValueChange: handleTabChange,
-                          children: [
-                            isMobile ? /* @__PURE__ */ jsx161("div", { className: "p-0", children: /* @__PURE__ */ jsxs94(
-                              Select,
-                              {
-                                items: tabItems,
-                                value: activeTab,
-                                onValueChange: (value) => {
-                                  if (value) handleTabChange(value);
-                                },
-                                children: [
-                                  /* @__PURE__ */ jsx161(SelectTrigger, { className: "w-full", children: /* @__PURE__ */ jsx161(SelectValue, {}) }),
-                                  /* @__PURE__ */ jsx161(SelectContent, { children: tabs.map((tab) => /* @__PURE__ */ jsx161(SelectItem, { value: tabValue(tab), children: tab.contentLabel ?? tab.label }, tab.label)) })
-                                ]
-                              }
-                            ) }) : /* @__PURE__ */ jsx161("div", { className: "p-4", children: /* @__PURE__ */ jsx161(TabsList, { children: tabs.map((tab) => /* @__PURE__ */ jsx161(TabsTrigger, { value: tabValue(tab), className: "px-4", children: tab.contentLabel ?? tab.label }, tab.label)) }) }),
-                            /* @__PURE__ */ jsx161(
+                        ) }),
+                        /* @__PURE__ */ jsx161(
+                          "div",
+                          {
+                            className: cn(
+                              `min-w-0 grow`,
+                              activeFillHeight ? `flex flex-col overflow-hidden` : `overflow-y-auto p-4`
+                            ),
+                            children: /* @__PURE__ */ jsxs94(
                               "div",
                               {
                                 className: cn(
-                                  `flex w-full `,
-                                  isMobile ? `` : `px-4`,
-                                  activeFillHeight ? `flex-1 min-h-0` : `overflow-y-auto`
+                                  activeFillHeight ? `flex min-h-0 w-full flex-1 flex-col` : `mx-auto w-full max-w-6xl`
                                 ),
-                                children: tabs.map((tab) => /* @__PURE__ */ jsx161(
-                                  TabsContent,
-                                  {
-                                    value: tabValue(tab),
-                                    className: tab.fillHeight ? `flex flex-1 min-h-0 w-full flex-col` : `pb-20`,
-                                    children: tab.content
-                                  },
-                                  tab.label
-                                ))
+                                children: [
+                                  header,
+                                  tabs.map((tab) => /* @__PURE__ */ jsx161(
+                                    TabsContent,
+                                    {
+                                      value: tabValue(tab),
+                                      className: tab.fillHeight ? `flex min-h-0 w-full flex-1 flex-col` : ``,
+                                      children: tab.content
+                                    },
+                                    tab.label
+                                  )),
+                                  children && /* @__PURE__ */ jsx161("div", { className: "flex", children })
+                                ]
                               }
                             )
-                          ]
-                        }
+                          }
+                        )
+                      ] })
+                    ]
+                  }
+                )
+              ) : /* @__PURE__ */ jsx161(
+                "div",
+                {
+                  className: cn(
+                    `grow`,
+                    isMobile ? `p-2` : `p-4`,
+                    activeFillHeight ? `flex flex-col overflow-hidden` : `overflow-y-auto`,
+                    fullWidth && `p-0`
+                  ),
+                  children: /* @__PURE__ */ jsxs94(
+                    "div",
+                    {
+                      className: cn(
+                        `mx-auto max-w-6xl space-y-8`,
+                        activeFillHeight && `flex w-full flex-1 min-h-0 flex-col space-y-0`,
+                        fullWidth && `max-w-full w-full p-0 h-full`
                       ),
-                      children && /* @__PURE__ */ jsx161("div", { className: cn(`flex`, isMobile ? `px-2` : `px-4`), children })
-                    ] }) : children
-                  ]
+                      children: [
+                        header,
+                        tabs ? /* @__PURE__ */ jsxs94(Fragment24, { children: [
+                          /* @__PURE__ */ jsxs94(
+                            Tabs,
+                            {
+                              value: activeTab,
+                              className: cn(`w-full`, activeFillHeight && `flex flex-1 min-h-0 flex-col`),
+                              onValueChange: handleTabChange,
+                              children: [
+                                isMobile ? /* @__PURE__ */ jsx161("div", { className: "p-0", children: /* @__PURE__ */ jsxs94(
+                                  Select,
+                                  {
+                                    items: tabItems,
+                                    value: activeTab,
+                                    onValueChange: (value) => {
+                                      if (value) handleTabChange(value);
+                                    },
+                                    children: [
+                                      /* @__PURE__ */ jsx161(SelectTrigger, { className: "w-full", children: /* @__PURE__ */ jsx161(SelectValue, {}) }),
+                                      /* @__PURE__ */ jsx161(SelectContent, { children: tabs.map((tab) => /* @__PURE__ */ jsx161(SelectItem, { value: tabValue(tab), children: tab.contentLabel ?? tab.label }, tab.label)) })
+                                    ]
+                                  }
+                                ) }) : /* @__PURE__ */ jsx161("div", { className: "p-4", children: /* @__PURE__ */ jsx161(TabsList, { children: tabs.map((tab) => /* @__PURE__ */ jsx161(TabsTrigger, { value: tabValue(tab), className: "px-4", children: tab.contentLabel ?? tab.label }, tab.label)) }) }),
+                                /* @__PURE__ */ jsx161(
+                                  "div",
+                                  {
+                                    className: cn(
+                                      `flex w-full `,
+                                      isMobile ? `` : `px-4`,
+                                      activeFillHeight ? `flex-1 min-h-0` : `overflow-y-auto`
+                                    ),
+                                    children: tabs.map((tab) => /* @__PURE__ */ jsx161(
+                                      TabsContent,
+                                      {
+                                        value: tabValue(tab),
+                                        className: tab.fillHeight ? `flex flex-1 min-h-0 w-full flex-col` : `pb-20`,
+                                        children: tab.content
+                                      },
+                                      tab.label
+                                    ))
+                                  }
+                                )
+                              ]
+                            }
+                          ),
+                          children && /* @__PURE__ */ jsx161("div", { className: cn(`flex`, isMobile ? `px-2` : `px-4`), children })
+                        ] }) : children
+                      ]
+                    }
+                  )
                 }
-              )
-            }
-          ) })
-        ] }),
-        details && (isMobile ? /* @__PURE__ */ jsx161(Sheet, { open: showDetails, onOpenChange: setShowDetails, children: /* @__PURE__ */ jsxs94(SheetContent, { side: "right", children: [
-          /* @__PURE__ */ jsx161(SheetHeader, { children: /* @__PURE__ */ jsx161(SheetTitle, { children: "Details" }) }),
-          /* @__PURE__ */ jsx161("div", { className: "overflow-y-auto p-6 pt-0", children: details })
-        ] }) }) : /* @__PURE__ */ jsx161(
-          "div",
-          {
-            className: cn(
-              "h-full shrink-0 overflow-hidden overflow-y-auto transition-all duration-300 ease-in-out",
-              showDetails ? "w-96 border-l p-4 opacity-100" : "ml-0 w-0 border-l-0 p-0 opacity-0"
-            ),
-            children: details
-          }
-        ))
-      ] }),
-      /* @__PURE__ */ jsx161(MobileNavigationBar, {})
-    ] })
+              ) })
+            ] }),
+            details && (isMobile ? /* @__PURE__ */ jsx161(Sheet, { open: showDetails, onOpenChange: setShowDetails, children: /* @__PURE__ */ jsxs94(SheetContent, { side: "right", children: [
+              /* @__PURE__ */ jsx161(SheetHeader, { children: /* @__PURE__ */ jsx161(SheetTitle, { children: detailsTitle ?? "Details" }) }),
+              /* @__PURE__ */ jsx161("div", { className: "overflow-y-auto p-6 pt-0", children: details })
+            ] }) }) : /* @__PURE__ */ jsxs94(
+              "div",
+              {
+                className: cn(
+                  // `flex-col` + a separate scroll body below: the header must stay
+                  // put while the panel content scrolls. Scrolling on this element
+                  // (as it did before) would carry the header away with the content.
+                  "flex h-full shrink-0 flex-col overflow-hidden transition-all duration-300 ease-in-out",
+                  showDetails ? "w-96 border-l opacity-100" : "ml-0 w-0 border-l-0 opacity-0"
+                ),
+                children: [
+                  detailsTitle && // Mirrors RoundPageContainerTitle's structure exactly — border on an
+                  // OUTER wrapper, height floor on the INNER row. Putting the border
+                  // inside the measured row instead leaves this header 1px short of
+                  // the page title bar, since `box-sizing: border-box` absorbs it.
+                  /* @__PURE__ */ jsx161("div", { className: "shrink-0 border-b", children: /* @__PURE__ */ jsx161("div", { className: cn("flex items-center p-4", HEADER_ROW_MIN_H), children: /* @__PURE__ */ jsx161("span", { className: "text-primary truncate text-sm font-semibold", children: detailsTitle }) }) }),
+                  /* @__PURE__ */ jsx161("div", { className: "min-h-0 flex-1 overflow-y-auto p-4", children: details })
+                ]
+              }
+            ))
+          ] }),
+          /* @__PURE__ */ jsx161(MobileNavigationBar, {})
+        ]
+      }
+    )
   ] });
 }
 __name(RoundPageContainer, "RoundPageContainer");
@@ -23572,6 +23615,7 @@ export {
   PageContainer,
   partitionTabs,
   ReactMarkdownContainer,
+  HEADER_ROW_MIN_H,
   RoundPageContainerTitle,
   RoundPageContainer,
   TabsContainer,
@@ -23799,4 +23843,4 @@ export {
   useOAuthClients,
   useOAuthClient
 };
-//# sourceMappingURL=chunk-EF2HVXOV.mjs.map
+//# sourceMappingURL=chunk-2KXPQHZU.mjs.map