@nextclaw/ui 0.14.1-beta.0 → 0.14.1

package/src/features/chat/features/message/utils/chat-message-tool-card.utils.ts

@@ -150,17 +150,18 @@ export function resolveToolCardStatus(params: {
   ChatToolPartViewModel,
   "kind" | "hasResult" | "statusTone" | "statusLabel"
 > {
+  const { cancelled, error, result, status, texts } = params;
   const rawStatus =
-    typeof params.status === "string" ? params.status.trim().toLowerCase() : "";
+    typeof status === "string" ? status.trim().toLowerCase() : "";
   const hasError =
-    typeof params.error === "string" && params.error.trim().length > 0;
-  const isCancelled = params.cancelled === true || rawStatus === "cancelled";
+    typeof error === "string" && error.trim().length > 0;
+  const isCancelled = cancelled === true || rawStatus === "cancelled";
   if (isCancelled) {
     return {
       kind: "result",
       hasResult: true,
       statusTone: "cancelled",
-      statusLabel: params.texts.toolStatusCancelledLabel,
+      statusLabel: texts.toolStatusCancelledLabel,
     };
   }
   if (hasError || rawStatus === "error") {
@@ -168,15 +169,15 @@ export function resolveToolCardStatus(params: {
       kind: "result",
       hasResult: true,
       statusTone: "error",
-      statusLabel: params.texts.toolStatusFailedLabel,
+      statusLabel: texts.toolStatusFailedLabel,
     };
   }
-  if (rawStatus === "result" || params.result != null) {
+  if (rawStatus === "result" || result != null) {
     return {
       kind: "result",
       hasResult: true,
       statusTone: "success",
-      statusLabel: params.texts.toolStatusCompletedLabel,
+      statusLabel: texts.toolStatusCompletedLabel,
     };
   }
   if (rawStatus === "partial-call") {
@@ -184,14 +185,14 @@ export function resolveToolCardStatus(params: {
       kind: "call",
       hasResult: false,
       statusTone: "running",
-      statusLabel: params.texts.toolStatusRunningLabel,
+      statusLabel: texts.toolStatusRunningLabel,
     };
   }
   return {
     kind: "call",
     hasResult: false,
     statusTone: "running",
-    statusLabel: params.texts.toolStatusRunningLabel,
+    statusLabel: texts.toolStatusRunningLabel,
   };
 }
 

package/src/features/chat/features/message/utils/file-operation/diff.utils.ts

@@ -24,16 +24,17 @@ export function buildRawPreviewBlock(params: {
   oldStartLine?: number | null;
   newStartLine?: number | null;
 }): ParsedBlock | null {
-  const previewText = params.text.trim();
+  const { newStartLine: rawNewStartLine, oldStartLine: rawOldStartLine, operation, path, text } = params;
+  const previewText = text.trim();
   if (!previewText) {
     return null;
   }
   const previewKind =
-    params.operation?.trim().toLowerCase() === "write" ? "add" : "context";
+    operation?.trim().toLowerCase() === "write" ? "add" : "context";
   const oldStartLine =
-    typeof params.oldStartLine === "number" ? params.oldStartLine : 1;
+    typeof rawOldStartLine === "number" ? rawOldStartLine : 1;
   const newStartLine =
-    typeof params.newStartLine === "number" ? params.newStartLine : 1;
+    typeof rawNewStartLine === "number" ? rawNewStartLine : 1;
   const lines = buildPreviewLines({
     text: previewText,
     kind: previewKind,
@@ -41,10 +42,10 @@ export function buildRawPreviewBlock(params: {
     newStartLine,
   });
   return {
-    path: params.path,
+    path,
     display: "preview",
     caption: buildCaption({
-      operation: params.operation,
+      operation,
       lines,
     }),
     lines,
@@ -62,10 +63,11 @@ export function buildFullReplaceBlock(params: {
   oldStartLine?: number | null;
   newStartLine?: number | null;
 }): ParsedBlock | null {
+  const { afterText, beforeText, operation, path } = params;
   const { oldStartLine, newStartLine } = readDefaultDiffStartLines(params);
   const lines = buildLineDiff({
-    beforeText: params.beforeText ?? "",
-    afterText: params.afterText ?? "",
+    beforeText: beforeText ?? "",
+    afterText: afterText ?? "",
     oldStartLine,
     newStartLine,
   });
@@ -74,16 +76,16 @@ export function buildFullReplaceBlock(params: {
     return null;
   }
   return {
-    path: params.path,
+    path,
     display: "diff",
     caption: buildCaption({
-      operation: params.operation,
+      operation,
       lines,
     }),
     lines: limited.lines,
     ...(limited.truncated ? { fullLines: lines } : {}),
-    ...(params.beforeText != null ? { beforeText: params.beforeText } : {}),
-    ...(params.afterText != null ? { afterText: params.afterText } : {}),
+    ...(beforeText != null ? { beforeText } : {}),
+    ...(afterText != null ? { afterText } : {}),
     ...(typeof oldStartLine === "number" ? { oldStartLine } : {}),
     ...(typeof newStartLine === "number" ? { newStartLine } : {}),
     truncated: limited.truncated,
@@ -95,23 +97,24 @@ function updateApplyPatchCursor(params: {
   flushCurrent: () => void;
   setCurrent: (path: string, operation: string) => void;
 }): boolean {
-  if (params.line.startsWith("*** Update File: ")) {
-    params.flushCurrent();
-    params.setCurrent(
-      params.line.slice("*** Update File: ".length).trim(),
+  const { flushCurrent, line, setCurrent } = params;
+  if (line.startsWith("*** Update File: ")) {
+    flushCurrent();
+    setCurrent(
+      line.slice("*** Update File: ".length).trim(),
       "update",
     );
     return true;
   }
-  if (params.line.startsWith("*** Add File: ")) {
-    params.flushCurrent();
-    params.setCurrent(params.line.slice("*** Add File: ".length).trim(), "add");
+  if (line.startsWith("*** Add File: ")) {
+    flushCurrent();
+    setCurrent(line.slice("*** Add File: ".length).trim(), "add");
     return true;
   }
-  if (params.line.startsWith("*** Delete File: ")) {
-    params.flushCurrent();
-    params.setCurrent(
-      params.line.slice("*** Delete File: ".length).trim(),
+  if (line.startsWith("*** Delete File: ")) {
+    flushCurrent();
+    setCurrent(
+      line.slice("*** Delete File: ".length).trim(),
       "delete",
     );
     return true;
@@ -128,18 +131,18 @@ function appendPatchLine(params: {
   oldLineNumber?: number;
   newLineNumber?: number;
 } {
-  const { currentLines, line } = params;
+  const { currentLines, line, newLineNumber, oldLineNumber } = params;
   if (line.startsWith("+")) {
     currentLines.push(
       createLine({
         kind: "add",
         text: line.slice(1),
-        newLineNumber: params.newLineNumber,
+        newLineNumber,
       }),
     );
     return {
-      oldLineNumber: params.oldLineNumber,
-      newLineNumber: incrementLineNumber(params.newLineNumber),
+      oldLineNumber,
+      newLineNumber: incrementLineNumber(newLineNumber),
     };
   }
   if (line.startsWith("-")) {
@@ -147,12 +150,12 @@ function appendPatchLine(params: {
       createLine({
         kind: "remove",
         text: line.slice(1),
-        oldLineNumber: params.oldLineNumber,
+        oldLineNumber,
       }),
     );
     return {
-      oldLineNumber: incrementLineNumber(params.oldLineNumber),
-      newLineNumber: params.newLineNumber,
+      oldLineNumber: incrementLineNumber(oldLineNumber),
+      newLineNumber,
     };
   }
   if (line.startsWith(" ")) {
@@ -160,18 +163,18 @@ function appendPatchLine(params: {
       createLine({
         kind: "context",
         text: line.slice(1),
-        oldLineNumber: params.oldLineNumber,
-        newLineNumber: params.newLineNumber,
+        oldLineNumber,
+        newLineNumber,
       }),
     );
     return {
-      oldLineNumber: incrementLineNumber(params.oldLineNumber),
-      newLineNumber: incrementLineNumber(params.newLineNumber),
+      oldLineNumber: incrementLineNumber(oldLineNumber),
+      newLineNumber: incrementLineNumber(newLineNumber),
     };
   }
   return {
-    oldLineNumber: params.oldLineNumber,
-    newLineNumber: params.newLineNumber,
+    oldLineNumber,
+    newLineNumber,
   };
 }
 

package/src/features/chat/features/message/utils/file-operation/line-builder.utils.ts

@@ -19,14 +19,15 @@ export function createLine(params: {
   oldLineNumber?: number;
   newLineNumber?: number;
 }): ChatFileOperationLineViewModel {
+  const { kind, newLineNumber, oldLineNumber, text } = params;
   return {
-    kind: params.kind,
-    text: params.text,
-    ...(typeof params.oldLineNumber === "number"
-      ? { oldLineNumber: params.oldLineNumber }
+    kind,
+    text,
+    ...(typeof oldLineNumber === "number"
+      ? { oldLineNumber }
       : {}),
-    ...(typeof params.newLineNumber === "number"
-      ? { newLineNumber: params.newLineNumber }
+    ...(typeof newLineNumber === "number"
+      ? { newLineNumber }
       : {}),
   };
 }
@@ -51,18 +52,19 @@ export function buildPreviewLines(params: {
   oldStartLine: number;
   newStartLine: number;
 }): ChatFileOperationLineViewModel[] {
-  return splitLines(params.text).map((line, index) =>
-    params.kind === "add"
+  const { kind, newStartLine, oldStartLine, text } = params;
+  return splitLines(text).map((line, index) =>
+    kind === "add"
       ? createLine({
           kind: "add",
           text: line,
-          newLineNumber: params.newStartLine + index,
+          newLineNumber: newStartLine + index,
         })
       : createLine({
           kind: "context",
           text: line,
-          oldLineNumber: params.oldStartLine + index,
-          newLineNumber: params.newStartLine + index,
+          oldLineNumber: oldStartLine + index,
+          newLineNumber: newStartLine + index,
         }),
   );
 }
@@ -73,10 +75,11 @@ function buildFallbackDiffLines(params: {
   oldStartLine?: number;
   newStartLine?: number;
 }): ChatFileOperationLineViewModel[] {
-  let oldLineNumber = params.oldStartLine;
-  let newLineNumber = params.newStartLine;
+  const { afterLines, beforeLines, newStartLine, oldStartLine } = params;
+  let oldLineNumber = oldStartLine;
+  let newLineNumber = newStartLine;
   return [
-    ...params.beforeLines.map((line) => {
+    ...beforeLines.map((line) => {
       const nextLine = createLine({
         kind: "remove",
         text: line,
@@ -85,7 +88,7 @@ function buildFallbackDiffLines(params: {
       oldLineNumber = incrementLineNumber(oldLineNumber);
       return nextLine;
     }),
-    ...params.afterLines.map((line) => {
+    ...afterLines.map((line) => {
       const nextLine = createLine({
         kind: "add",
         text: line,
@@ -101,22 +104,23 @@ function buildLcsMatrix(params: {
   beforeLines: string[];
   afterLines: string[];
 }): number[][] {
+  const { afterLines, beforeLines } = params;
   const matrix: number[][] = Array.from(
-    { length: params.beforeLines.length + 1 },
-    () => Array.from({ length: params.afterLines.length + 1 }, () => 0),
+    { length: beforeLines.length + 1 },
+    () => Array.from({ length: afterLines.length + 1 }, () => 0),
   );
   for (
-    let beforeIndex = params.beforeLines.length - 1;
+    let beforeIndex = beforeLines.length - 1;
     beforeIndex >= 0;
     beforeIndex -= 1
   ) {
     for (
-      let afterIndex = params.afterLines.length - 1;
+      let afterIndex = afterLines.length - 1;
       afterIndex >= 0;
       afterIndex -= 1
     ) {
       matrix[beforeIndex]![afterIndex] =
-        params.beforeLines[beforeIndex] === params.afterLines[afterIndex]
+        beforeLines[beforeIndex] === afterLines[afterIndex]
           ? (matrix[beforeIndex + 1]![afterIndex + 1] ?? 0) + 1
           : Math.max(
               matrix[beforeIndex + 1]![afterIndex] ?? 0,
@@ -136,33 +140,36 @@ function appendRemainingDiffLines(params: {
   oldLineNumber?: number;
   newLineNumber?: number;
 }): void {
+  const { afterIndex, afterLines, beforeIndex, beforeLines, lines, newLineNumber: initialNewLineNumber, oldLineNumber: initialOldLineNumber } = params;
+  let oldLineNumber = initialOldLineNumber;
+  let newLineNumber = initialNewLineNumber;
   for (
-    let index = params.beforeIndex;
-    index < params.beforeLines.length;
+    let index = beforeIndex;
+    index < beforeLines.length;
     index += 1
   ) {
-    params.lines.push(
+    lines.push(
       createLine({
         kind: "remove",
-        text: params.beforeLines[index] ?? "",
-        oldLineNumber: params.oldLineNumber,
+        text: beforeLines[index] ?? "",
+        oldLineNumber,
       }),
     );
-    params.oldLineNumber = incrementLineNumber(params.oldLineNumber);
+    oldLineNumber = incrementLineNumber(oldLineNumber);
   }
   for (
-    let index = params.afterIndex;
-    index < params.afterLines.length;
+    let index = afterIndex;
+    index < afterLines.length;
     index += 1
   ) {
-    params.lines.push(
+    lines.push(
       createLine({
         kind: "add",
-        text: params.afterLines[index] ?? "",
-        newLineNumber: params.newLineNumber,
+        text: afterLines[index] ?? "",
+        newLineNumber,
       }),
     );
-    params.newLineNumber = incrementLineNumber(params.newLineNumber);
+    newLineNumber = incrementLineNumber(newLineNumber);
   }
 }
 
@@ -172,14 +179,15 @@ export function buildLineDiff(params: {
   oldStartLine?: number;
   newStartLine?: number;
 }): ChatFileOperationLineViewModel[] {
-  const beforeLines = splitLines(params.beforeText);
-  const afterLines = splitLines(params.afterText);
+  const { afterText, beforeText, newStartLine, oldStartLine } = params;
+  const beforeLines = splitLines(beforeText);
+  const afterLines = splitLines(afterText);
   if (beforeLines.length * afterLines.length > MAX_DIFF_MATRIX_CELLS) {
     return buildFallbackDiffLines({
       beforeLines,
       afterLines,
-      oldStartLine: params.oldStartLine,
-      newStartLine: params.newStartLine,
+      oldStartLine,
+      newStartLine,
     });
   }
 
@@ -190,8 +198,8 @@ export function buildLineDiff(params: {
   const lines: ChatFileOperationLineViewModel[] = [];
   let beforeIndex = 0;
   let afterIndex = 0;
-  let oldLineNumber = params.oldStartLine;
-  let newLineNumber = params.newStartLine;
+  let oldLineNumber = oldStartLine;
+  let newLineNumber = newStartLine;
   while (beforeIndex < beforeLines.length && afterIndex < afterLines.length) {
     if (beforeLines[beforeIndex] === afterLines[afterIndex]) {
       lines.push(

package/src/features/chat/features/message/utils/file-operation/parsed-block.utils.ts

@@ -20,10 +20,11 @@ export function buildCaption(params: {
   operation?: string | null;
   lines: ChatFileOperationLineViewModel[];
 }): string | undefined {
-  const additions = params.lines.filter((line) => line.kind === "add").length;
-  const deletions = params.lines.filter((line) => line.kind === "remove").length;
+  const { lines, operation } = params;
+  const additions = lines.filter((line) => line.kind === "add").length;
+  const deletions = lines.filter((line) => line.kind === "remove").length;
   const parts: string[] = [];
-  const normalizedOperation = params.operation?.trim().toLowerCase() ?? "";
+  const normalizedOperation = operation?.trim().toLowerCase() ?? "";
   if (normalizedOperation && normalizedOperation !== "update") {
     parts.push(normalizedOperation);
   }
@@ -46,20 +47,21 @@ export function readDefaultDiffStartLines(params: {
   oldStartLine?: number;
   newStartLine?: number;
 } {
-  const normalizedOperation = params.operation?.trim().toLowerCase() ?? "";
+  const { afterText, beforeText, newStartLine: rawNewStartLine, oldStartLine: rawOldStartLine, operation } = params;
+  const normalizedOperation = operation?.trim().toLowerCase() ?? "";
   const oldStartLine =
-    typeof params.oldStartLine === "number"
-      ? params.oldStartLine
+    typeof rawOldStartLine === "number"
+      ? rawOldStartLine
       : (normalizedOperation === "delete" ||
             normalizedOperation === "remove") &&
-          params.beforeText != null
+          beforeText != null
         ? 1
         : undefined;
   const newStartLine =
-    typeof params.newStartLine === "number"
-      ? params.newStartLine
+    typeof rawNewStartLine === "number"
+      ? rawNewStartLine
       : (normalizedOperation === "write" || normalizedOperation === "add") &&
-          params.afterText != null
+          afterText != null
         ? 1
         : undefined;
   return { oldStartLine, newStartLine };
@@ -83,16 +85,17 @@ export function buildParsedPatchBlock(params: {
   operation: string | null;
   lines: ChatFileOperationLineViewModel[];
 }): ParsedBlock {
-  const limited = limitLines(params.lines);
+  const { lines, operation, path } = params;
+  const limited = limitLines(lines);
   return {
-    path: params.path,
+    path,
     display: "diff",
     caption: buildCaption({
-      operation: params.operation,
-      lines: params.lines,
+      operation,
+      lines,
     }),
     lines: limited.lines,
-    ...(limited.truncated ? { fullLines: params.lines } : {}),
+    ...(limited.truncated ? { fullLines: lines } : {}),
     truncated: limited.truncated,
   };
 }

package/src/features/chat/features/session/components/chat-sidebar-project-groups.tsx

@@ -1,6 +1,6 @@
 import { useMemo, useState, type ReactNode } from 'react';
 import { Plus } from 'lucide-react';
-import { ChatSidebarCreateMenu } from "@/features/chat/features/session-type/components/chat-sidebar-create-menu";
+import { ChatSessionTypeMenu } from "@/features/chat/features/session-type/components/chat-session-type-menu";
 import { Popover, PopoverContent, PopoverTrigger } from '@/shared/components/ui/popover';
 import { IconActionButton } from '@/shared/components/ui/actions/icon-action-button';
 import type { ChatInputSnapshot } from '@/features/chat/stores/chat-input.store';
@@ -77,8 +77,9 @@ export function ChatSidebarProjectGroups(props: ChatSidebarProjectGroupsProps) {
                     align="end"
                     className="w-56 rounded-2xl border border-gray-200/80 bg-white p-1.5 shadow-[0_24px_60px_-28px_rgba(15,23,42,0.38)]"
                   >
-                    <ChatSidebarCreateMenu
+                    <ChatSessionTypeMenu
                       options={sessionTypeOptions}
+                      selectedSessionType={preferredSessionType}
                       onSelect={(sessionType) => {
                         onCreateSession(sessionType, group.projectRoot);
                         setOpenProjectRoot(null);

package/src/features/chat/features/session/components/session-header/__tests__/chat-session-project-badge.test.tsx

@@ -2,6 +2,7 @@ import { render, screen, waitFor } from '@testing-library/react';
 import userEvent from '@testing-library/user-event';
 import { beforeEach, describe, expect, it, vi } from 'vitest';
 import { ChatSessionProjectBadge } from '@/features/chat/features/session/components/session-header/chat-session-project-badge';
+import { createPopoverAvailableHeightLimit } from '@/shared/components/ui/popover';
 
 const mocks = vi.hoisted(() => ({
   updateSessionProject: vi.fn(),
@@ -15,6 +16,17 @@ vi.mock('@/features/chat/features/session/components/session-header/chat-session
   ChatSessionProjectDialog: () => null,
 }));
 
+function renderProjectBadge() {
+  return render(
+    <ChatSessionProjectBadge
+      sessionKey="session-1"
+      projectName="project-alpha"
+      projectRoot="/tmp/project-alpha"
+      persistToServer
+    />
+  );
+}
+
 describe('ChatSessionProjectBadge', () => {
   beforeEach(() => {
     mocks.updateSessionProject.mockReset();
@@ -24,31 +36,26 @@ describe('ChatSessionProjectBadge', () => {
   it('shows project actions inside the badge popover', async () => {
     const user = userEvent.setup();
 
-    render(
-      <ChatSessionProjectBadge
-        sessionKey="session-1"
-        projectName="project-alpha"
-        projectRoot="/tmp/project-alpha"
-        persistToServer
-      />
-    );
+    renderProjectBadge();
 
     await user.click(screen.getByRole('button', { name: 'Set Project Directory' }));
 
     expect(screen.getAllByText('Set Project Directory').length).toBeGreaterThan(0);
     expect(screen.getByText('Clear Project Directory')).toBeTruthy();
-    expect(screen.getByText('/tmp/project-alpha')).toBeTruthy();
+    const projectRoot = screen.getByText('/tmp/project-alpha');
+    expect(projectRoot).toBeTruthy();
+
+    const boundedPopover = projectRoot.closest('[style*="max-height"]') as HTMLElement | null;
+    expect(boundedPopover?.style.maxHeight).toBe(
+      createPopoverAvailableHeightLimit('18rem')
+    );
+    expect(boundedPopover?.style.maxHeight).toContain('max(0px');
+    expect(boundedPopover?.style.maxHeight).toContain('100vh');
+    expect(boundedPopover?.style.maxHeight).toContain('2rem');
   });
 
   it('uses the neutral header tag styling instead of a highlighted accent color', () => {
-    render(
-      <ChatSessionProjectBadge
-        sessionKey="session-1"
-        projectName="project-alpha"
-        projectRoot="/tmp/project-alpha"
-        persistToServer
-      />
-    );
+    renderProjectBadge();
 
     const trigger = screen.getByRole('button', { name: 'Set Project Directory' });
     expect(trigger.className).toContain('border-gray-200');
@@ -59,14 +66,7 @@ describe('ChatSessionProjectBadge', () => {
   it('clears the current project from the badge popover', async () => {
     const user = userEvent.setup();
 
-    render(
-      <ChatSessionProjectBadge
-        sessionKey="session-1"
-        projectName="project-alpha"
-        projectRoot="/tmp/project-alpha"
-        persistToServer
-      />
-    );
+    renderProjectBadge();
 
     await user.click(screen.getByRole('button', { name: 'Set Project Directory' }));
     await user.click(screen.getByText('Clear Project Directory'));

package/src/features/chat/features/session/components/session-header/chat-session-project-badge.tsx

@@ -3,7 +3,12 @@ import { ChevronDown, FolderOpen, FolderX, Pencil } from 'lucide-react';
 import { useChatSessionProject } from '@/features/chat/features/session/hooks/use-chat-session-project';
 import { ChatSessionHeaderMenuItem } from './chat-session-header-menu-item';
 import { ChatSessionProjectDialog } from './chat-session-project-dialog';
-import { Popover, PopoverContent, PopoverTrigger } from '@/shared/components/ui/popover';
+import {
+  Popover,
+  PopoverContent,
+  PopoverTrigger,
+  createPopoverAvailableHeightLimit,
+} from '@/shared/components/ui/popover';
 import { t } from '@/shared/lib/i18n';
 
 type ChatSessionProjectBadgeProps = {
@@ -13,6 +18,10 @@ type ChatSessionProjectBadgeProps = {
   persistToServer: boolean;
 };
 
+const SESSION_PROJECT_MENU_STYLE = {
+  maxHeight: createPopoverAvailableHeightLimit('18rem'),
+};
+
 export function ChatSessionProjectBadge({
   sessionKey,
   projectName,
@@ -57,7 +66,11 @@ export function ChatSessionProjectBadge({
             </span>
           </button>
         </PopoverTrigger>
-        <PopoverContent align="start" className="w-72 p-2">
+        <PopoverContent
+          align="start"
+          className="w-72 p-2"
+          style={SESSION_PROJECT_MENU_STYLE}
+        >
           <div className="px-3 pb-2 pt-1">
             <div className="text-[11px] font-medium uppercase tracking-wider text-gray-500">
               {projectName}

package/src/features/chat/features/session-type/components/__tests__/chat-session-type-menu.test.tsx

@@ -0,0 +1,24 @@
+import { render, screen } from "@testing-library/react";
+import { describe, expect, it, vi } from "vitest";
+import { ChatSessionTypeMenu } from "@/features/chat/features/session-type/components/chat-session-type-menu";
+import { createPopoverAvailableHeightLimit } from "@/shared/components/ui/popover";
+
+const options = [
+  { value: "native", label: "Native", ready: true },
+  { value: "codex", label: "Codex", ready: true },
+];
+
+describe("ChatSessionTypeMenu", () => {
+  it("keeps the session type menu height bounded", () => {
+    render(<ChatSessionTypeMenu options={options} onSelect={vi.fn()} />);
+
+    const createMenu = screen.getByText("Session Type").parentElement;
+    expect(createMenu?.style.maxHeight).toBe(
+      createPopoverAvailableHeightLimit("18rem"),
+    );
+    expect(createMenu?.style.maxHeight).toContain("max(0px");
+    expect(createMenu?.style.maxHeight).toContain("100vh");
+    expect(createMenu?.style.maxHeight).toContain("2rem");
+    expect(createMenu?.className).toContain("overflow-y-auto");
+  });
+});