@octane-xplat/canvas 0.8.0 → 0.10.0

package/README.md

@@ -0,0 +1,56 @@
+# `@octane-xplat/canvas`
+
+```sh
+pnpm add @octane-xplat/canvas
+```
+
+A GPU/canvas surface for Octane xplat apps: the DOM `<canvas>` on web and
+`@nativescript/canvas` on iOS/Android — 2D, WebGL/WebGL2, and
+WebGPU/WGSL context kinds behind one `getContext` contract.
+
+```tsx
+import { Canvas } from '@octane-xplat/canvas'
+
+export function Drawing() {
+	return (
+		<Canvas
+			context="2d"
+			width={640}
+			height={480}
+			onReady={({ context }) => {
+				if (!context) return
+				context.fillStyle = '#2563eb'
+				context.fillRect(0, 0, 80, 80)
+			}}
+		/>
+	)
+}
+```
+
+Pass `context` to have the leaf resolve it before `onReady`, or omit it and
+call `getContext` yourself — one kind per canvas, decided on first call.
+`onReady` fires after mount on web and on the plugin's `ready` event on
+native (earlier `getContext` calls can return null). For WebGPU,
+`getGPU()` normalizes adapter/device acquisition across targets.
+
+```tsx
+import { Canvas, getGPU } from '@octane-xplat/canvas'
+
+export function DeferredCanvas() {
+	return (
+		<Canvas
+			onReady={({ canvas }) => {
+				const context = canvas.getContext('2d')
+				if (context) context.fillRect(0, 0, 20, 20)
+			}}
+		/>
+	)
+}
+const gpu = getGPU()
+const adapter = await gpu?.requestAdapter()
+const device = await adapter?.requestDevice()
+```
+
+Per-target limits are recorded in
+[known limits](../../docs/verify/known-limits.md). Exercised by
+[`CanvasDemo`](../demos/src/CanvasDemo.tsrx) (including a WGSL path).

package/dist/native/octane-client-build.json

@@ -1,6 +1,6 @@
 {
   "version": 1,
-  "buildId": "5e0f5c59-ea8a-4253-90b4-f17f9d7f30d5",
+  "buildId": "266c5beb-953a-44be-a98f-964cada3fb26",
   "mode": "production",
   "capabilities": {
     "independentHydration": false

package/dist/web/octane-client-build.json

@@ -1,6 +1,6 @@
 {
   "version": 1,
-  "buildId": "a5853361-5a4d-40e8-8fab-5c4ecf162294",
+  "buildId": "03fdb1cd-295a-4650-8734-16e8c367bd74",
   "mode": "production",
   "capabilities": {
     "independentHydration": false

package/package.json

@@ -1,25 +1,25 @@
 {
   "name": "@octane-xplat/canvas",
-  "version": "0.8.0",
+  "version": "0.10.0",
   "description": "Canvas/GPU surface for Octane xplat — web <canvas> + @nativescript/canvas (2D, WebGL/WebGL2, WebGPU/WGSL)",
   "keywords": [
-    "octane",
-    "xplat",
-    "cross-platform",
     "canvas",
+    "cross-platform",
+    "gpu",
+    "graphics",
+    "nativescript",
+    "octane",
     "webgl",
     "webgl2",
     "webgpu",
     "wgsl",
-    "gpu",
-    "graphics",
-    "nativescript"
+    "xplat"
   ],
-  "license": "MIT",
   "homepage": "https://github.com/octane-xplat/octane-xplat/tree/main/packages/canvas",
+  "license": "MIT",
   "repository": {
     "type": "git",
-    "url": "git+https://github.com/octane-xplat/octane-xplat.git",
+    "url": "https://github.com/octane-xplat/octane-xplat",
     "directory": "packages/canvas"
   },
   "files": [
@@ -47,7 +47,7 @@
     "@nativescript/core": "9.1.2",
     "@octanejs/vite-plugin": "0.1.61",
     "octane": "0.6.3",
-    "tsrx-typegen": "0.2.0",
+    "tsrx-typegen": "0.2.2",
     "typescript": "5.9.3",
     "vite": "8.3.0"
   },

package/src/gpu.ts

@@ -1,8 +1,8 @@
-import { GPU } from '@nativescript/canvas';
+import { GPU } from '@nativescript/canvas'
 
 /** getGPU — returns the plugin's GPU shim (wgpu over Metal/Vulkan). Same
  *  spec-shaped surface as web's `navigator.gpu`: `requestAdapter()` +
  *  `getPreferredCanvasFormat()`. */
 export function getGPU(): any {
-	return new GPU();
+	return new GPU()
 }

package/src/gpu.web.ts

@@ -3,5 +3,5 @@
  *  returned object is spec-shaped: `requestAdapter()` +
  *  `getPreferredCanvasFormat()`. */
 export function getGPU(): any {
-	return (globalThis.navigator as any)?.gpu ?? null;
+	return (globalThis.navigator as any)?.gpu ?? null
 }

package/src/index.ts

@@ -1,5 +1,5 @@
 // Platform barrels — explicit .tsrx leaf imports (moduleSuffixes don't
 // reach .tsrx; same convention as @octane-xplat/ui index.*.ts).
-export { Canvas } from './Canvas.tsrx';
-export { getGPU } from './gpu';
-export type { CanvasProps, CanvasContextKind, CanvasReady } from './props';
+export { Canvas } from './Canvas.tsrx'
+export { getGPU } from './gpu'
+export type { CanvasProps, CanvasContextKind, CanvasReady } from './props'

package/src/index.web.ts

@@ -1,5 +1,5 @@
 // Platform barrels — explicit .tsrx leaf imports (moduleSuffixes don't
 // reach .tsrx; same convention as @octane-xplat/ui index.*.ts).
-export { Canvas } from './Canvas.web.tsrx';
-export { getGPU } from './gpu.web';
-export type { CanvasProps, CanvasContextKind, CanvasReady } from './props';
+export { Canvas } from './Canvas.web.tsrx'
+export { getGPU } from './gpu.web'
+export type { CanvasProps, CanvasContextKind, CanvasReady } from './props'

package/src/props.ts

@@ -1,33 +1,28 @@
-export type CanvasContextKind =
-	| '2d'
-	| 'webgl'
-	| 'webgl2'
-	| 'webgpu'
-	| 'bitmaprenderer';
+export type CanvasContextKind = '2d' | 'webgl' | 'webgl2' | 'webgpu' | 'bitmaprenderer'
 
 export interface CanvasReady {
 	/** HTMLCanvasElement on web, the plugin's Canvas view on native —
 	 *  both expose `getContext()`. */
-	canvas: any;
+	canvas: any
 	/** The resolved context for the `context` prop, or null when that
 	 *  kind is unsupported/unavailable. WebGPU still needs a device —
 	 *  `getGPU()` normalizes adapter/device acquisition. */
-	context: any;
+	context: any
 }
 
 export interface CanvasProps {
-	className?: any;
-	style?: any;
-	id?: string;
+	className?: any
+	style?: any
+	id?: string
 	/** Context kind resolved before `onReady` fires. Omit to defer
 	 *  `getContext` to user code (only one kind per canvas — call once). */
-	context?: CanvasContextKind;
+	context?: CanvasContextKind
 	/** Web: after mount. Native: the plugin's `ready` event (fires when the
 	 *  GPU surface exists — earlier `getContext` calls can return null). */
-	onReady?: (ready: CanvasReady) => void;
+	onReady?: (ready: CanvasReady) => void
 	/** Numeric values map to the element's width/height — on web that is
 	 *  the canvas *drawing buffer* size (pair with style for display
 	 *  size), on native dip size. */
-	width?: string | number;
-	height?: string | number;
+	width?: string | number
+	height?: string | number
 }