@remix-run/cli 0.3.0 → 0.3.1

package/dist/lib/help-text.js

@@ -39,5 +39,5 @@ function formatHeading(title, target) {
     return boldLightBlue(title, target);
 }
 function highlightSyntax(text, target) {
-    return text.replace(/(--[A-Za-z0-9-]+|-[A-Za-z]|\[[A-Za-z][A-Za-z0-9-]*\]|<[^>\n]+>)/g, (token) => lightYellow(token, target));
+    return text.replace(/(?<![^\s[,|])(--[A-Za-z0-9-]+|-[A-Za-z])(?=$|[\s,\]|])|\[[A-Za-z][A-Za-z0-9-]*\]|<[^>\n]+>/g, (token) => lightYellow(token, target));
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@remix-run/cli",
-  "version": "0.3.0",
+  "version": "0.3.1",
   "description": "Command-line interface for Remix",
   "author": "Michael Jackson <mjijackson@gmail.com>",
   "license": "MIT",
@@ -31,14 +31,14 @@
   },
   "dependencies": {
     "semver": "^7.7.4",
-    "@remix-run/test": "^0.4.0",
-    "@remix-run/terminal": "^0.1.0"
+    "@remix-run/terminal": "^0.1.1",
+    "@remix-run/test": "^0.4.1"
   },
   "devDependencies": {
     "@types/node": "^24.6.0",
     "@types/semver": "^7.5.8",
     "@typescript/native-preview": "7.0.0-dev.20251125.1",
-    "@remix-run/assert": "^0.2.0"
+    "@remix-run/assert": "^0.2.1"
   },
   "keywords": [
     "remix",

package/src/lib/help-text.ts

@@ -82,7 +82,8 @@ function formatHeading(title: string, target: NodeJS.WriteStream): string {
 }
 
 function highlightSyntax(text: string, target: NodeJS.WriteStream): string {
-  return text.replace(/(--[A-Za-z0-9-]+|-[A-Za-z]|\[[A-Za-z][A-Za-z0-9-]*\]|<[^>\n]+>)/g, (token) =>
-    lightYellow(token, target),
+  return text.replace(
+    /(?<![^\s[,|])(--[A-Za-z0-9-]+|-[A-Za-z])(?=$|[\s,\]|])|\[[A-Za-z][A-Za-z0-9-]*\]|<[^>\n]+>/g,
+    (token) => lightYellow(token, target),
   )
 }

package/template/.agents/skills/remix/SKILL.md

@@ -34,7 +34,7 @@ A Remix app has four main pieces:
 - **Middleware** composes request lifecycle behavior and populates typed context via
   `context.set(Key, value)`.
 - **Components** render UI with `remix/ui`. This is not React. A component receives a
-  `handle`, reads current props from `handle.props`, and returns a render function.
+  `handle`, reads current props from `handle.props`, and returns a zero-argument render function.
 
 ## When To Use This Skill
 
@@ -198,9 +198,9 @@ When code could live in multiple places:
   need the harness
 - Outside actions and controllers, only use `getContext()` when `asyncContext()` is in the
   middleware stack
-- Remix Component is not React: read props from `handle.props`, keep state in setup-scope
-  variables, call `handle.update()` explicitly, and do DOM-sensitive work in event handlers or
-  `queueTask(...)`, not in render
+- Remix Component is not React: write `function Name(handle: Handle<Props>) { return () => ... }`,
+  read props from `handle.props`, keep state in setup-scope variables, call `handle.update()`
+  explicitly, and do DOM-sensitive work in event handlers or `queueTask(...)`, not in render
 - Prefer host-element mixins via `mix={mixin(...)}` for behavior and styling instead of inventing
   custom host prop conventions. Use `mix={[...]}` only when composing multiple mixins
 - Hydrated `clientEntry(...)` props must be serializable. Do not pass functions, class instances, or
@@ -282,8 +282,6 @@ what it exports. Open the linked reference file when you need full examples.
   `form`, `resources` when defining `app/routes.ts`
 - `remix/node-fetch-server` — default Node adapter for new apps. Use `createRequestListener` with
   `node:http`, `node:https`, or `node:http2` in `server.ts` when booting the template-style app
-- `remix/node-serve` — managed high-performance Node server. Use `serve` when you want Remix to
-  manage the server lifecycle, TLS options, or uWebSockets.js setup around a Fetch handler
 - `remix/assets` — browser asset server. Use for `createAssetServer` when serving compiled
   scripts and styles, getting public hrefs, and emitting preloads. Configure a `basePath`, and
   keep `fileMap` URL patterns relative to it. Shared compiler options such as `target`,

package/template/.agents/skills/remix/references/component-model.md

@@ -20,7 +20,10 @@ For host-element behavior (event handlers, styles, refs, animations), see
 A component has two phases:
 
 1. **Setup phase** — runs once when the component is created
-2. **Render phase** — returned function runs on initial render and every update
+2. **Render phase** — returned zero-argument function runs on initial render and every update
+
+The component shape is `function Component(handle: Handle<Props>) { return () => ... }`. Props are
+available as `handle.props` in setup scope and are updated before every render.
 
 ```tsx
 import { on, type Handle } from 'remix/ui'

package/template/.agents/skills/remix/references/middleware-and-server.md

@@ -229,5 +229,4 @@ runtime behavior such as host/protocol handling, TLS, HTTP/2, WebSockets, deploy
 test-only server setup.
 
 Use `remix/node-fetch-server` when you want to keep owning a standard Node `http`, `https`, or
-`http2` server directly. Use `remix/node-serve` and `serve()` when you want a managed
-high-performance server with `server.ready`, TLS options, or uWebSockets.js setup.
+`http2` server directly.

package/template/app/middleware/render.tsx

@@ -9,9 +9,10 @@ import { assetServer } from '../assets.ts'
 
 export function render() {
   return renderWith(
-    () =>
+    ({ request }) =>
       function render(node: RemixNode, init?: ResponseInit) {
         let stream = renderToStream(node, {
+          signal: request.signal,
           // Server rendering turns client entries into browser module URLs.
           async resolveClientEntry(entryId, component) {
             if (!entryId.startsWith('file://')) {

package/template/server.ts

@@ -10,7 +10,9 @@ const server = http.createServer(
     try {
       return await router.fetch(request)
     } catch (error) {
-      console.error(error)
+      if (!(request.signal.aborted && error === request.signal.reason)) {
+        console.error(error)
+      }
       return new Response('Internal Server Error', { status: 500 })
     }
   }),