refactor: remove slice and add scroll

2026-07-24 18:51:00 +03:30
1 changed files with 12 additions and 4 deletions
@@ -9,6 +9,7 @@ interface Product {
  category: string;
  brand: string;
 }
+
 function generate5kMockProducts(): Product[] {
  const categories = [
    "Electronics",
@@ -57,12 +58,19 @@ export default function CmdkTestDemo() {
        onOpenChange={() => setOpened(false)}
        label="Global Command Menu"
      >
-        <Command.Input placeholder="Search Tab ..." autoFocus />
-
-        <Command.List>
+        <Command.Input placeholder="Search Tab ..." autoFocus></Command.Input>
+        <Command.List
+          style={{
+            minHeight: "100px",
+            maxHeight: "400px",
+            height: "var(--cmdk-list-height)",
+            overflowY: "auto",
+            transition: "height 100ms ease",
+          }}
+        >
          <Command.Empty>No results found.</Command.Empty>
          <Command.Group>
-            {actions.slice(0, 50).map((action) => (
+            {actions.map((action) => (
              <Command.Item
                key={action.id}
                value={`${action.label} ${action.description}`}