feat(board): ensure Cmd/Ctrl click correctly selects items in grid editor

apps/nextjs/src/components/board/sections/grid/fixed-grid-item.tsx

@@ -17,6 +17,7 @@ import {
 } from "~/components/board/layout";
 import type { GridPlacement } from "~/components/board/layout";
 import { useSectionContext } from "../section-context";
+import { useBoardSelection } from "~/components/board/selection/board-selection-context";
 import { beginGridTransaction, commitGridTransaction, previewGridMove, previewGridResize } from "./dnd";
 import type { GridTransaction } from "./dnd";
 import { useGridEditorRuntimeStatus } from "./grid-editor-runtime";
@@ -48,6 +49,17 @@ export const FixedGridItem = ({
   const { section, items, innerSections, columnCount, maxRowCount, announce } = useSectionContext();
   const { commitSectionGrid } = useGridLayoutActions();
   const [isKeyboardEditing, setIsKeyboardEditing] = useState(false);
+  const { isSelected, toggleSelectItem, selectedItemIds } = useBoardSelection();
+  const selected = item.type === "item" && isSelected(item.id);
+
+  const handleClickCapture = (event: React.MouseEvent) => {
+    if (!isEditorActive || item.type !== "item") return;
+    if (event.metaKey || event.ctrlKey || (selectedItemIds.size > 0 && !event.shiftKey)) {
+      event.preventDefault();
+      event.stopPropagation();
+      toggleSelectItem(item.id);
+    }
+  };
   const instructionsId = useId();
   const isEditorActive = isEditMode && runtimeStatus === "ready";
   const placement = toPlacement(item);
@@ -178,6 +190,8 @@ export const FixedGridItem = ({
   return (
     <Box
       {...semantics}
+      onClickCapture={handleClickCapture}
+      data-board-item-selected={selected ? "true" : undefined}
       className={combineClasses(isEditorActive ? classes.editorEntry : classes.staticItem)}
       style={isEditorActive ? { position: "relative", width: "100%", height: "100%" } : getLogicalItemStyle(placement)}
       data-grid-item-id={isEditorActive ? undefined : item.id}

apps/nextjs/src/components/board/sections/grid/grid-editor.tsx

@@ -1239,6 +1239,7 @@ const getPreferredRegisteredGridTarget = (
 
 const preventGridDragActivation = (event: PointerEvent, source: DomDraggable) => {
   if (document.body.hasAttribute("data-board-grid-interacting")) return true;
+  if (event.metaKey || event.ctrlKey) return true;
   const target = event.target;
   const activationElement = source.handle ?? source.element;
   if (!(target instanceof Element) || target === activationElement) return false;