@dxos/react-ui-canvas 0.9.1-main.c7dcc2e112 → 0.10.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dxos/react-ui-canvas",
-  "version": "0.9.1-main.c7dcc2e112",
+  "version": "0.10.0",
   "description": "A canvas component.",
   "homepage": "https://dxos.org",
   "bugs": "https://github.com/dxos/dxos/issues",
@@ -31,30 +31,30 @@
     "d3": "^7.9.0",
     "react-resize-detector": "^11.0.1",
     "transformation-matrix": "^2.16.1",
-    "@dxos/debug": "0.9.1-main.c7dcc2e112",
-    "@dxos/invariant": "0.9.1-main.c7dcc2e112",
-    "@dxos/log": "0.9.1-main.c7dcc2e112",
-    "@dxos/util": "0.9.1-main.c7dcc2e112"
+    "@dxos/invariant": "0.10.0",
+    "@dxos/util": "0.10.0",
+    "@dxos/log": "0.10.0",
+    "@dxos/debug": "0.10.0"
   },
   "devDependencies": {
     "@types/d3": "^7.4.3",
-    "@types/react": "~19.2.7",
+    "@types/react": "~19.2.17",
     "@types/react-dom": "~19.2.3",
-    "effect": "3.21.3",
-    "react": "~19.2.3",
-    "react-dom": "~19.2.3",
+    "effect": "3.21.4",
+    "react": "~19.2.7",
+    "react-dom": "~19.2.7",
     "vite": "^8.0.16",
-    "@dxos/random": "0.9.1-main.c7dcc2e112",
-    "@dxos/storybook-utils": "0.9.1-main.c7dcc2e112",
-    "@dxos/react-ui": "0.9.1-main.c7dcc2e112",
-    "@dxos/ui-theme": "0.9.1-main.c7dcc2e112"
+    "@dxos/react-ui": "0.10.0",
+    "@dxos/random": "0.10.0",
+    "@dxos/storybook-utils": "0.10.0",
+    "@dxos/ui-theme": "0.10.0"
   },
   "peerDependencies": {
-    "effect": "3.21.3",
-    "react": "~19.2.3",
-    "react-dom": "~19.2.3",
-    "@dxos/react-ui": "0.9.1-main.c7dcc2e112",
-    "@dxos/ui-theme": "0.9.1-main.c7dcc2e112"
+    "effect": "3.21.4",
+    "react": "~19.2.7",
+    "react-dom": "~19.2.7",
+    "@dxos/react-ui": "0.10.0",
+    "@dxos/ui-theme": "0.10.0"
   },
   "publishConfig": {
     "access": "public"

package/src/components/CellGrid/CellGrid.stories.tsx

@@ -2,7 +2,7 @@
 // Copyright 2026 DXOS.org
 //
 
-import { RegistryContext, Registry } from '@effect-atom/atom-react';
+import { Registry, RegistryContext } from '@effect-atom/atom-react';
 import { type Meta, type StoryObj } from '@storybook/react-vite';
 import React, { useContext, useEffect, useMemo, useRef, useState } from 'react';
 
@@ -79,7 +79,7 @@ const makeLcg = (seed: number) => {
 
 type Variant = 'sequencer' | 'data-viz';
 
-type StoryProps = Pick<CellGridProps, 'headers'> & {
+type StoryArgs = Pick<CellGridProps, 'headers'> & {
   variant: Variant;
   tool: Tool;
   numCols: number;
@@ -89,7 +89,7 @@ type StoryProps = Pick<CellGridProps, 'headers'> & {
   playback: boolean;
 };
 
-const DefaultStory = ({ variant, tool, numCols, numRows, cellWidth, cellHeight, playback, headers }: StoryProps) => {
+const DefaultStory = ({ variant, tool, numCols, numRows, cellWidth, cellHeight, playback, headers }: StoryArgs) => {
   const registry = useContext(RegistryContext);
 
   const atoms = useMemo(

package/src/components/CellGrid/CellGrid.tsx

@@ -10,8 +10,8 @@ import type { ThemedClassName } from '@dxos/react-ui';
 import { mx } from '@dxos/ui-theme';
 
 import { Ruler, TrackHeader } from './headers';
-import { attachPointerHandlers, attachWheelHandlers, type PointerHandlers } from './input';
-import { drawCells, drawOverlay, type OverlayStyle, type RenderCell, type StaticLayerStyle } from './render';
+import { type PointerHandlers, attachPointerHandlers, attachWheelHandlers } from './input';
+import { type OverlayStyle, type RenderCell, type StaticLayerStyle, drawCells, drawOverlay } from './render';
 import type { CellGridAtoms } from './state/atoms';
 import type { Cell, Headers, Row } from './state/types';
 

package/src/components/Grid/Grid.tsx

@@ -54,7 +54,13 @@ export const GridComponent = forwardRef<SVGSVGElement, GridProps>(
       <svg
         {...testId('dx-canvas-grid')}
         ref={svgRef}
-        className={mx('dx-fullscreen pointer-events-none touch-none select-none', 'stroke-neutral-500', classNames)}
+        // `dx-fullscreen` (absolute inset-0) does not stretch a replaced <svg> element — without an explicit
+        // size it falls back to the intrinsic 300x150, clipping the 100%-sized grid rects. Force full size.
+        className={mx(
+          'dx-fullscreen w-full h-full pointer-events-none touch-none select-none',
+          'stroke-neutral-500',
+          classNames,
+        )}
       >
         {/* NOTE: The pattern is offset so that the middle of the pattern aligns with the grid. */}
         <defs>