@adecore/ui 0.50.1 → 0.50.3

package/dist/command-palette/virtual.js

@@ -80,9 +80,28 @@ export function CommandPaletteVirtualList({
     }
     const highlight = (index_0, reason) => {
       const row = itemRows[index_0];
-      if (row !== undefined && reason !== 'pointer') {
-        virtualizer.scrollToIndex(row, {
-          align: reason === 'none' ? 'start' : 'auto'
+      if (row === undefined || reason === 'pointer') {
+        return;
+      }
+      // The first item of a group brings its label along, so the list never opens on half a label.
+      const label = row > 0 && rows[row - 1].index === -1 ? row - 1 : null;
+      if (reason === 'none') {
+        const target = label ?? row;
+        if (target === 0) {
+          virtualizer.scrollToOffset(0);
+        } else {
+          virtualizer.scrollToIndex(target, {
+            align: 'start'
+          });
+        }
+        return;
+      }
+      virtualizer.scrollToIndex(row, {
+        align: 'auto'
+      });
+      if (label !== null) {
+        virtualizer.scrollToIndex(label, {
+          align: 'auto'
         });
       }
     };
@@ -92,7 +111,7 @@ export function CommandPaletteVirtualList({
         scroll.current = null;
       }
     };
-  }, [scroll, virtualizer, itemRows]);
+  }, [scroll, virtualizer, itemRows, rows]);
   const visible = virtualizer.getVirtualItems();
   const visibleGroups = new Map();
   for (const item of visible) {

package/dist/theme.css

@@ -842,7 +842,8 @@
         min-width: 0;
         min-height: 0;
         overflow: hidden;
-        border-radius: 0 12px 12px 0;
+        /* Rounded where it meets the window's top, square where it stands on the window's bottom. */
+        border-radius: 0 12px 0 0;
         /* The surface its regions draw, so no lighter ground shows where the rounded edge cuts them. Roomy shows its gaps in it. */
         background: var(--surface);
         box-shadow: 0 0 0 1px var(--border), var(--sheet-shadow);
@@ -881,6 +882,8 @@
     .ade-workspace-sidebar[data-auto], .ade-workspace-side-panel[data-auto] { display: contents; }
     .ade-workspace[data-layout="roomy"],
     .ade-workspace[data-layout="roomy"] > .ade-workspace-sheet { background: var(--separator); }
+    /* The gaps already set the sheet apart, and a shadow over them reads as a smudge. */
+    .ade-workspace[data-layout="roomy"] > .ade-workspace-sheet { box-shadow: 0 0 0 1px var(--border); }
     .ade-workspace[data-layout="roomy"] > .ade-workspace-sheet > .ade-workspace-center { gap: 8px; }
     .ade-workspace[data-layout="roomy"] > .ade-workspace-sheet > .ade-workspace-sidebar:not([data-auto]) { margin-right: 8px; }
     .ade-workspace[data-layout="roomy"] > .ade-workspace-side-panel:not([data-auto]) { margin-left: 8px; }

package/dist/workspace/Workspace.js

@@ -270,7 +270,7 @@ export function Workspace(t0) {
   if ($[63] !== t23 || $[64] !== t24) {
     t25 = {
       top: t23,
-      right: true,
+      right: false,
       bottom: true,
       left: t24
     };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@adecore/ui",
-  "version": "0.50.1",
+  "version": "0.50.3",
   "description": "React components, a theme, formatters and a settings dialog for desktop-grade apps on React 19, Base UI and Tailwind 4.",
   "license": "FSL-1.1-MIT",
   "author": "Bas Milius",

package/src/command-palette/virtual.tsx

@@ -90,8 +90,29 @@ export function CommandPaletteVirtualList<ItemValue, Group extends { items: read
         const highlight = (index: number, reason: string): void => {
             const row = itemRows[index];
 
-            if (row !== undefined && reason !== 'pointer') {
-                virtualizer.scrollToIndex(row, { align: reason === 'none' ? 'start' : 'auto' });
+            if (row === undefined || reason === 'pointer') {
+                return;
+            }
+
+            // The first item of a group brings its label along, so the list never opens on half a label.
+            const label = row > 0 && rows[row - 1]!.index === -1 ? row - 1 : null;
+
+            if (reason === 'none') {
+                const target = label ?? row;
+
+                if (target === 0) {
+                    virtualizer.scrollToOffset(0);
+                } else {
+                    virtualizer.scrollToIndex(target, { align: 'start' });
+                }
+
+                return;
+            }
+
+            virtualizer.scrollToIndex(row, { align: 'auto' });
+
+            if (label !== null) {
+                virtualizer.scrollToIndex(label, { align: 'auto' });
             }
         };
 
@@ -102,7 +123,7 @@ export function CommandPaletteVirtualList<ItemValue, Group extends { items: read
                 scroll.current = null;
             }
         };
-    }, [scroll, virtualizer, itemRows]);
+    }, [scroll, virtualizer, itemRows, rows]);
 
     const visible = virtualizer.getVirtualItems();
     const visibleGroups = new Map<number, typeof visible>();

package/src/theme.css

@@ -842,7 +842,8 @@
         min-width: 0;
         min-height: 0;
         overflow: hidden;
-        border-radius: 0 12px 12px 0;
+        /* Rounded where it meets the window's top, square where it stands on the window's bottom. */
+        border-radius: 0 12px 0 0;
         /* The surface its regions draw, so no lighter ground shows where the rounded edge cuts them. Roomy shows its gaps in it. */
         background: var(--surface);
         box-shadow: 0 0 0 1px var(--border), var(--sheet-shadow);
@@ -881,6 +882,8 @@
     .ade-workspace-sidebar[data-auto], .ade-workspace-side-panel[data-auto] { display: contents; }
     .ade-workspace[data-layout="roomy"],
     .ade-workspace[data-layout="roomy"] > .ade-workspace-sheet { background: var(--separator); }
+    /* The gaps already set the sheet apart, and a shadow over them reads as a smudge. */
+    .ade-workspace[data-layout="roomy"] > .ade-workspace-sheet { box-shadow: 0 0 0 1px var(--border); }
     .ade-workspace[data-layout="roomy"] > .ade-workspace-sheet > .ade-workspace-center { gap: 8px; }
     .ade-workspace[data-layout="roomy"] > .ade-workspace-sheet > .ade-workspace-sidebar:not([data-auto]) { margin-right: 8px; }
     .ade-workspace[data-layout="roomy"] > .ade-workspace-side-panel:not([data-auto]) { margin-left: 8px; }

package/src/workspace/Workspace.tsx

@@ -85,8 +85,8 @@ export function Workspace({
         }
     });
 
-    // The content ends at the sheet's own edge, whatever stands beside it.
-    const context = { layout, edges: { top: !hasToolbar, right: true, bottom: true, left: !leftOpen } };
+    // The sheet's right edge is rounded, so panes along it keep their corners, whatever stands beside the sheet.
+    const context = { layout, edges: { top: !hasToolbar, right: false, bottom: true, left: !leftOpen } };
 
     return (
         <WorkspaceContext value={context}>