diff --git a/packages/react-runtime/README.md b/packages/react-runtime/README.md index 705061bb09..0091ac867c 100644 --- a/packages/react-runtime/README.md +++ b/packages/react-runtime/README.md @@ -29,8 +29,16 @@ npm install @object-ui/react-runtime ## Usage ```tsx +import type { ComponentType } from 'react'; import { ReactRunner } from '@object-ui/react-runtime'; +// Whatever your app already has to hand: the values it injects into the runtime +// scope, and the sink it reports errors to. +declare const ObjectGrid: ComponentType; +declare const useAdapter: () => unknown; +declare const data: unknown; +declare const report: (error: Error) => void; + hi

// ✅ bare JSX -function Page() { return

; } // ✅ function declaration -() =>

hi

// ✅ arrow expression -class Page extends React.Component {} // ✅ class - -const Page = () =>

; // ❌ exports nothing — see below -const Page = () =>

; -export default Page; // ✅ export it explicitly +// `React` is always in the runtime scope, so a source never imports it. +declare const React: typeof import('react'); + +

hi

// ✅ bare JSX +function PageFunction() { return

; } // ✅ function declaration +() =>

hi

// ✅ arrow expression +class PageClass extends React.Component {} // ✅ class + +const PageNotExported = () =>

; // ❌ exports nothing — see below +const PageExported = () =>

; +export default PageExported; // ✅ export it explicitly ``` +Each line above is a **separate source** — they are alternatives, not one file. +They carry different names only so the block compiles as a single program; the +rule is about the shape the source *starts with*, never about the name. + The `const Page = …` form is the one authors reach for most, and it does **not** get the implicit export. It used to render a blank page with no error anywhere; it now throws with a message naming the fix, which `fallback` surfaces. @@ -81,6 +96,11 @@ There is no module resolver. `import x from 'y'` compiles to a `require('y')` that reads `scope.import`: ```tsx +import { ReactRunner } from '@object-ui/react-runtime'; + +declare const code: string; +declare const dateFns: Record; + ``` @@ -116,6 +136,13 @@ Build the scope with `useMemo` (or hoist it to module scope) and keep its dependencies stable. ```tsx +import { useMemo, type ComponentType } from 'react'; +import { ReactRunner } from '@object-ui/react-runtime'; + +declare const src: string; +declare const ObjectGrid: ComponentType; +declare const data: unknown; + // ❌ new object every render — the page remounts and loses its useState @@ -135,6 +162,9 @@ just transpile/eval failures. New inputs clear it and recompile. ```ts import { generateElement, transform, type Scope } from '@object-ui/react-runtime'; +declare const code: string; +declare const scope: Scope; + transform(code) // JSX/TS → JS (classic runtime, imports → require) generateElement(code, scope) // transpile + eval → ReactElement | null (throws, see above) ``` diff --git a/scripts/check-doc-snippet-types.mjs b/scripts/check-doc-snippet-types.mjs index 610eee05e8..a4a25bc305 100644 --- a/scripts/check-doc-snippet-types.mjs +++ b/scripts/check-doc-snippet-types.mjs @@ -737,8 +737,6 @@ const UNGATED_DOCS = { '3 parse diagnostic(s) — blocks fenced `ts` that are bare object literals or elided bodies', 'packages/providers/README.md': '7 undefined-name diagnostic(s) — blocks continue an earlier block, or use ambient names the page never defines; plus TS2741x1 — candidate real defects, un-triaged', - 'packages/react-runtime/README.md': - '25 undefined-name diagnostic(s) — blocks continue an earlier block, or use ambient names the page never defines; plus TS2813x1 TS2814x1 — candidate real defects, un-triaged', }; // ── Fence scanning ───────────────────────────────────────────────────────────