@solidrt/core 0.0.25 → 0.0.27

package/AGENTS.md

@@ -84,7 +84,7 @@ tsconfig.json - the two load-bearing lines are jsx + jsxImportSource:
 ```
 
 Peer deps @solidjs/signals and @solidjs/universal must match (currently
-2.0.0-beta.15); bun resolves them from peerDependencies.
+2.0.0-beta.17); bun resolves them from peerDependencies.
 
 ## Element model (the parts that are easy to get wrong)
 

package/examples/gpu-pipeline.tsx

@@ -0,0 +1,82 @@
+// createPipeline compiles a custom GLSL ES 3.00 vertex+fragment pair that draws
+// an interleaved vertex buffer into a texture, here a spinning cube with depth
+// testing. The vertex shader declares `in` attributes matching the pipeline's
+// attribute list (locations are resolved by name) and its own varyings; the
+// fragment preamble provides fragColor/iResolution/iTime but no vUV. Uniforms
+// are driven exactly like createShader: declaratively via the <texture> params
+// prop, applied at the next repaint.
+import { render, onFrame, createSignal } from "@solidrt/core"
+import { createBuffer, createPipeline } from "@solidrt/core/gpu"
+
+let VERTEX = `
+in vec3 aPos;
+in vec3 aColor;
+out vec3 vColor;
+uniform float uTime;
+
+void main() {
+  float cy = cos(uTime), sy = sin(uTime);
+  float cx = cos(uTime * 0.7), sx = sin(uTime * 0.7);
+  mat3 rotY = mat3(cy, 0.0, -sy, 0.0, 1.0, 0.0, sy, 0.0, cy);
+  mat3 rotX = mat3(1.0, 0.0, 0.0, 0.0, cx, sx, 0.0, -sx, cx);
+  vec3 p = rotX * (rotY * aPos);
+  p.z += 2.5;
+
+  // Perspective projection (near 1, far 10). Clip y is negated: the target's
+  // memory row 0 is clip y = -1, and Impeller samples row 0 as the top, so
+  // camera-up needs the flip to be displayed up.
+  float f = 2.0;
+  float a = 11.0 / 9.0;
+  float b = -20.0 / 9.0;
+  gl_Position = vec4(p.x * f, -p.y * f, p.z * a + b, p.z);
+  vColor = aColor;
+}
+`
+
+let FRAGMENT = `
+in vec3 vColor;
+void main() {
+  fragColor = vec4(vColor, 1.0);
+}
+`
+
+// Interleaved [pos vec3, color vec3], 6 faces x 2 triangles, one color per face.
+function cube(): Float32Array {
+  type Vec3 = [number, number, number]
+  let verts: number[] = []
+  let quad = (a: Vec3, b: Vec3, c: Vec3, d: Vec3, color: Vec3) => {
+    for (let p of [a, b, c, a, c, d]) verts.push(p[0], p[1], p[2], color[0], color[1], color[2])
+  }
+  let s = 0.5
+  quad([-s, -s, s], [s, -s, s], [s, s, s], [-s, s, s], [0.9, 0.3, 0.3]) // front
+  quad([s, -s, -s], [-s, -s, -s], [-s, s, -s], [s, s, -s], [0.3, 0.9, 0.4]) // back
+  quad([s, -s, s], [s, -s, -s], [s, s, -s], [s, s, s], [0.3, 0.5, 0.9]) // right
+  quad([-s, -s, -s], [-s, -s, s], [-s, s, s], [-s, s, -s], [0.9, 0.8, 0.3]) // left
+  quad([-s, s, s], [s, s, s], [s, s, -s], [-s, s, -s], [0.8, 0.4, 0.9]) // top
+  quad([-s, -s, -s], [s, -s, -s], [s, -s, s], [-s, -s, s], [0.4, 0.9, 0.9]) // bottom
+  return new Float32Array(verts)
+}
+
+function App() {
+  let bufferId = createBuffer(cube())
+  let id = createPipeline(VERTEX, FRAGMENT, 512, 512, {
+    params: { uTime: 0 },
+    attributes: [
+      { name: "aPos", format: "vec3" },
+      { name: "aColor", format: "vec3" },
+    ],
+    buffer: bufferId,
+    depth: true,
+    clearColor: [0.08, 0.08, 0.12, 1],
+  })
+  let [time, setTime] = createSignal(0)
+  onFrame((tick) => setTime(tick / 1000))
+
+  return (
+    <window alignItems="center" justifyContent="center">
+      <texture src={id} params={{ uTime: time() }} width={400} height={400} />
+    </window>
+  )
+}
+
+render(() => <App />)

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@solidrt/core",
-  "version": "0.0.25",
+  "version": "0.0.27",
   "license": "MIT",
   "author": "Antoine van Wel",
   "type": "module",
@@ -27,11 +27,11 @@
     "colord": "^2.9.3"
   },
   "devDependencies": {
-    "@solidrt/flux-types": "0.0.25"
+    "@solidrt/flux-types": "0.0.27"
   },
   "peerDependencies": {
-    "@solidjs/signals": "2.0.0-beta.15",
-    "@solidjs/universal": "2.0.0-beta.15",
-    "solid-js": "2.0.0-beta.15"
+    "@solidjs/signals": "2.0.0-beta.17",
+    "@solidjs/universal": "2.0.0-beta.17",
+    "solid-js": "2.0.0-beta.17"
   }
 }

package/src/gamepad.ts

@@ -0,0 +1,56 @@
+import { createSignal } from "@solidjs/signals"
+import { on } from "srt:events"
+
+// Gamepad State: a reactive mirror of the runtime's sticky "gamepads" event.
+//
+// The runtime coalesces pad activity to at most one snapshot per main-loop
+// iteration and replays the latest one on subscribe, so the first read
+// already sees any connected pads. Runtimes without gamepad support never
+// emit the event and the accessor stays [].
+
+/**
+ * One connected gamepad's current state. `buttons` holds the names of the
+ * currently-pressed buttons, using SDL3's positional names ("south", "east",
+ * "west", "north", "dpadUp", "dpadDown", "dpadLeft", "dpadRight", "start",
+ * "back", "guide", "leftShoulder", "rightShoulder", "leftStick",
+ * "rightStick"). `axes` has sticks ("leftX", "leftY", "rightX", "rightY") in
+ * -1..1 and triggers ("leftTrigger", "rightTrigger") in 0..1.
+ */
+export interface GamepadState {
+  /** Runtime instance id: unique per connection, not stable across reconnects. */
+  id: number
+  name: string
+  buttons: string[]
+  axes: Record<string, number>
+  /**
+   * True when the device has an SDL controller-database mapping, so button
+   * and axis names reflect verified physical positions. False for raw HID
+   * joysticks: they still report, but names are assigned positionally in W3C
+   * standard-mapping order (button 0 is "south", ..., overflow "button17"...;
+   * axes 0-3 are "leftX"..."rightY", overflow "axis4"...), a d-pad hat folds
+   * into the "dpad*" names, and analog triggers, if any, appear wherever the
+   * device puts them (e.g. as *button* names "leftTrigger"/"rightTrigger" at
+   * indices 6/7) rather than as the trigger axes mapped pads have.
+   */
+  mapped: boolean
+}
+
+let gamepadsAccessor: (() => (GamepadState | null)[]) | undefined
+
+/**
+ * Connected gamepads as a reactive accessor. Slots are stable web-style: a
+ * pad keeps its index for its whole connection, disconnecting leaves a null
+ * hole, and the next connect fills the lowest free slot - so slot index works
+ * as a persistent player number. Read inside a tracked scope (JSX, memo,
+ * effect, onFrame) to re-run on pad activity.
+ */
+export function gamepads(): (GamepadState | null)[] {
+  if (!gamepadsAccessor) {
+    // ownedWrite: the sticky event replays synchronously inside on(), which
+    // may run within a tracked scope's first read (see environment.ts).
+    let [pads, setPads] = createSignal<(GamepadState | null)[]>([], { ownedWrite: true })
+    on("gamepads", (e: { pads?: (GamepadState | null)[] }) => setPads(e.pads ?? []))
+    gamepadsAccessor = pads
+  }
+  return gamepadsAccessor()
+}

package/src/gpu.ts

@@ -19,6 +19,12 @@ import * as gpu from "flux:gpu"
 // `<texture params={...}>` when a `<texture>` element is already in the tree.
 export { destroyTexture, setShaderParams, uploadTexture } from "flux:gpu"
 
+// Pipeline plumbing re-exported raw: setDrawCount re-renders a pipeline after
+// its buffer gained or lost dynamic geometry; destroyBuffer is the manual
+// cleanup path for buffers created outside a reactive scope.
+export { destroyBuffer, setDrawCount } from "flux:gpu"
+export type { Topology, VertexAttribute } from "flux:gpu"
+
 // captureSnapshot renders a node to a texture and readTexture reads any
 // texture's bytes back. Re-exported raw (no reactive auto-cleanup wrapper):
 // captureSnapshot resolves asynchronously, by which point the reactive owner is
@@ -79,4 +85,71 @@ export function createShader(
   let id = gpu.createShader(fragmentSrc, width, height, params, textures)
   if (getOwner()) onCleanup(() => gpu.destroyTexture(id))
   return id
+}
+
+// View any TypedArray or ArrayBuffer as a Uint8Array over the same memory,
+// without copying, so vertex data can be authored as Float32Array.
+function toUint8(data: ArrayBuffer | ArrayBufferView): Uint8Array {
+  if (data instanceof Uint8Array) return data
+  if (data instanceof ArrayBuffer) return new Uint8Array(data)
+  return new Uint8Array(data.buffer, data.byteOffset, data.byteLength)
+}
+
+/**
+ * Compiles a GLSL ES 3.00 vertex+fragment pipeline and renders it into a
+ * texture, returning the texture id (usable anywhere a normal texture id is,
+ * e.g. `<texture src>`). Unlike `createShader` the vertex stage is yours:
+ * declare `in` attributes matching `opts.attributes` (one interleaved vertex
+ * in `opts.buffer`, a {@link createBuffer} id) and your own varyings toward
+ * the fragment stage. Both sources may reference `iResolution`/`iTime` and any
+ * `uniform float` they declare; drive values with `<texture src={id}
+ * params={{...}} />` or `setShaderParams`, exactly like a fragment shader.
+ * `opts.depth` attaches a private depth buffer (cleared + tested per render);
+ * `opts.vertexCount` defaults to the whole buffer and can be changed later
+ * with `setDrawCount`. Frees the texture and GL program when the reactive
+ * owner is disposed; create outside any reactive scope for app-lifetime
+ * pipelines.
+ */
+export function createPipeline(
+  vertexSrc: string,
+  fragmentSrc: string,
+  width: number,
+  height: number,
+  opts?: {
+    params?: Record<string, number>
+    textures?: Record<string, number>
+    attributes?: gpu.VertexAttribute[]
+    buffer?: number
+    topology?: gpu.Topology
+    vertexCount?: number
+    depth?: boolean
+    clearColor?: [number, number, number, number]
+  },
+): number {
+  let id = gpu.createPipeline(vertexSrc, fragmentSrc, width, height, opts)
+  if (getOwner()) onCleanup(() => gpu.destroyTexture(id))
+  return id
+}
+
+/**
+ * Creates a vertex buffer for pipeline attributes from raw data (typically a
+ * Float32Array laid out to match the pipeline's interleaved attribute list).
+ * Update it later with {@link writeBuffer}; the buffer's byte size is fixed at
+ * creation, so reserve room up front for dynamic geometry. Freed automatically
+ * when the reactive owner is disposed; created outside a reactive scope you
+ * must call `destroyBuffer` yourself. Destroy pipelines before their buffer.
+ */
+export function createBuffer(data: ArrayBuffer | ArrayBufferView): number {
+  let id = gpu.createBuffer(toUint8(data))
+  if (getOwner()) onCleanup(() => gpu.destroyBuffer(id))
+  return id
+}
+
+/**
+ * Overwrites part of a vertex buffer at `byteOffset` (default 0). Every
+ * pipeline drawing from the buffer re-renders with its last-applied params,
+ * so geometry-only changes reach the screen without a params update.
+ */
+export function writeBuffer(id: number, data: ArrayBuffer | ArrayBufferView, byteOffset?: number): void {
+  gpu.writeBuffer(id, toUint8(data), byteOffset)
 }

package/src/index.ts

@@ -8,6 +8,8 @@ export { setPointerCapture, releasePointerCapture } from "./window"
 export { windowSize, safeArea, displayScale, windowFocused, keyboardHeight } from "./window"
 export { env } from "./environment"
 export type { InputDevices, SystemTheme, Orientation } from "./environment"
+export { gamepads } from "./gamepad"
+export type { GamepadState } from "./gamepad"
 export { capabilities } from "./capabilities"
 export type { Capabilities, WindowSizeClass } from "./capabilities"
 export { createTexture } from "./gpu"

package/src/renderer.ts

@@ -87,6 +87,34 @@ function removeNode(parent: ProxyNode, node: ProxyNode): void {
   }
 }
 
+// Applies a single prop to a node: routes events to the handler registry,
+// parses color strings/gradients, and forwards everything else to the tree.
+// Shared by the renderer's setProperty hook and by createElement, which since
+// the dom-expressions "universal" template passes static props inline as a
+// second argument rather than as separate setProp calls.
+function applyProp<T>(node: ProxyNode, name: string, value: T): void {
+  if (!node) return
+
+  // console.debug("[srt] applyProp", node.id, name, value)
+
+  if (/^on[A-Z]/.test(name) && (value == null || typeof value === "function")) {
+    setEventHandler(node.id, name, value as Function | null | undefined)
+    return
+  }
+
+  if (name === "color" && isGradient(value)) {
+    tree.setProperty(node.id, name, value)
+    return
+  }
+
+  if (name === "color" && typeof value === "string") {
+    tree.setProperty(node.id, name, parseColor(value))
+    return
+  }
+
+  tree.setProperty(node.id, name, value)
+}
+
 export let {
   effect,
   memo,
@@ -101,7 +129,7 @@ export let {
   applyRef,
   ref,
 } = createRenderer<ProxyNode>({
-  createElement: (elementType: string): ProxyNode => {
+  createElement: (elementType: string, props?: Record<string, any>): ProxyNode => {
     let proxy = createProxyNode(elementType)
 
     // console.debug("[srt] createElement", proxy.id, elementType)
@@ -109,6 +137,15 @@ export let {
     if (elementType === "window") tree.createRoot(proxy.id)
     else tree.createNode(proxy.id, elementType)
 
+    // The universal JSX template hands static props here as an object; children
+    // and ref arrive through their own hooks, so skip them.
+    if (props) {
+      for (let name in props) {
+        if (name === "children" || name === "ref") continue
+        applyProp(proxy, name, props[name])
+      }
+    }
+
     return proxy
   },
 
@@ -127,26 +164,8 @@ export let {
 
   isTextNode: (node: ProxyNode): boolean => node?.elementType === "d-span",
   setProperty: <T>(node: ProxyNode, name: string, value: T): void => {
-    if (!node) return
-
     // console.debug("[srt] setProperty", node.id, name, value)
-
-    if (/^on[A-Z]/.test(name) && (value == null || typeof value === "function")) {
-      setEventHandler(node.id, name, value as Function | null | undefined)
-      return
-    }
-
-    if (name === "color" && isGradient(value)) {
-      tree.setProperty(node.id, name, value)
-      return
-    }
-
-    if (name === "color" && typeof value === "string") {
-      tree.setProperty(node.id, name, parseColor(value))
-      return
-    }
-
-    tree.setProperty(node.id, name, value)
+    applyProp(node, name, value)
   },
 
   insertNode: (parent: ProxyNode, node: ProxyNode, anchor?: ProxyNode): void => {

package/src/runtime-modules.d.ts

@@ -40,6 +40,15 @@ declare module "srt:dev" {
   export function connect(address: string): void
   export function discover(): void
   export function stop(): void
+  /**
+   * Register a named debug command, listable and callable from the dev server
+   * (the list_debug / call_debug MCP tools). `args` arrives JSON-parsed; the
+   * return value must be JSON-serializable and synchronous (promises are not
+   * awaited). Re-registering a name replaces it; registrations reset on hot
+   * reload, so register at module init. Callable in every build, but only dev
+   * clients ever invoke commands.
+   */
+  export function registerDebug(name: string, fn: (args?: any) => unknown): void
 }
 
 // Frame draw (lattice runner). renderFrame() synchronously renders the current