feat(framework-react-lynx-web): dispatcher-based component routing

Replace the per-component bridge-entry model with a single dispatcher
entry. Users write one `.storybook/lynx-preview.tsx` that registers
components via `createLynxStorybook({ components })`, and stories
reference them by name via `parameters.lynx.component`. The `entry:`
and `url:` forms remain as escape hatches.

- Add `src/runtime.ts` exporting `createLynxStorybook` (runs inside
  the Lynx bundle, not in Storybook's preview iframe)
- Wire `./runtime` subpath export (build-config + package.json exports
  + bundler.entries)
- Preset auto-detects `.storybook/lynx-preview.*` and injects it as a
  synthetic `__storybook__` rspeedy entry alongside user entries
- Preview resolves `url → entry → component` with distinct error paths
- Migrate sandbox to dispatcher model, add Card component + story,
  make lynx.config.ts a proper app config with `source.entry`

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

Author: fi3ework

packages/framework-react-lynx-web/README.md

@@ -15,8 +15,7 @@ npm install storybook-react-lynx-web-rsbuild \
 ```
 
 You also need a `lynx.config.ts` in your project root that invokes
-`pluginReactLynx()` and lists every component you want to render as a
-`source.entry` — see [Usage](#usage).
+`pluginReactLynx()` — see [Usage](#usage).
 
 ## Usage
 
@@ -37,7 +36,8 @@ const config: StorybookConfig = {
 export default config
 ```
 
-In your project root `lynx.config.ts`:
+In your project root `lynx.config.ts` — no `source.entry` required for
+the common case; the framework injects its own dispatcher entry:
 
 ```ts
 import { pluginReactLynx } from '@lynx-js/react-rsbuild-plugin'
@@ -49,28 +49,27 @@ export default defineConfig({
     web: {},
     lynx: {},
   },
-  source: {
-    entry: {
-      // One entry per component you want to render in Storybook.
-      Button: './src/components/button-entry.tsx',
-    },
-  },
 })
 ```
 
-Each entry file simply mounts your component:
+Create `.storybook/lynx-preview.tsx` and register every component you
+want to expose to stories:
 
 ```tsx
-// src/components/button-entry.tsx
-import { root } from '@lynx-js/react'
+// .storybook/lynx-preview.tsx
+import { createLynxStorybook } from 'storybook-react-lynx-web-rsbuild/runtime'
 
-import { Button } from './Button.tsx'
-import './Button.css'
+import { Button } from '../src/components/Button.tsx'
+import '../src/components/Button.css'
 
-root.render(<Button />)
+createLynxStorybook({
+  components: {
+    Button: () => <Button />,
+  },
+})
 ```
 
-Then write a story that points at the built `.web.bundle`:
+Then write a story and reference the component by name:
 
 ```ts
 // src/components/Button.stories.ts
@@ -80,7 +79,11 @@ const meta = {
   title: 'Example/Button',
   parameters: {
     lynx: {
-      url: '/lynx-bundles/Button.web.bundle',
+      // Matches a key from the `components` map in lynx-preview.tsx.
+      // The framework dispatches to it via a single auto-injected
+      // `__storybook__.web.bundle`, so you don't add a `source.entry`
+      // per component.
+      component: 'Button',
     },
   },
   argTypes: {
@@ -97,6 +100,26 @@ export const Primary: Story = {
 }
 ```
 
+### Escape hatches: `entry` and `url`
+
+For advanced cases — custom prefixes, remote bundles, bundles outside
+the dispatcher — two lower-level forms of `parameters.lynx` are still
+supported. Prefer `component:` above for day-to-day use.
+
+```ts
+// Reference a named rspeedy entry from your own lynx.config.ts:
+parameters: { lynx: { entry: 'LegacyApp' } }
+
+// Or point at any URL directly (remote or otherwise):
+parameters: { lynx: { url: 'https://cdn.example.com/my.web.bundle' } }
+```
+
+Resolution order is `url` → `entry` → `component`. If the active
+`component:` is not registered in `.storybook/lynx-preview.tsx`, the
+runtime dispatcher renders an empty placeholder; if the whole
+`.storybook/lynx-preview.*` file is missing, the preview shows an
+inline error telling you where to create it.
+
 Read Storybook args inside your component via `useGlobalProps()` from
 `@lynx-js/react`. Augment the `GlobalProps` interface for type safety:
 
@@ -135,8 +158,9 @@ framework: {
 ### `lynxBundlePrefix`
 
 URL prefix under which compiled `.web.bundle` files are served. Defaults
-to `/lynx-bundles`. Your story's `parameters.lynx.url` must start with
-this prefix.
+to `/lynx-bundles`. The dispatcher and the `entry:` shortcut pick this
+up automatically; stories that pass an explicit `parameters.lynx.url`
+must include the matching prefix themselves.
 
 ## Features
 

packages/framework-react-lynx-web/build-config.ts

@@ -16,6 +16,10 @@ const config: BuildEntries = {
         entryPoint: './src/preview-runtime.ts',
         dts: false,
       },
+      {
+        exportEntries: ['./runtime'],
+        entryPoint: './src/runtime.ts',
+      },
     ],
     node: [
       {

packages/framework-react-lynx-web/package.json

@@ -36,7 +36,11 @@
       "types": "./dist/preview.d.ts",
       "default": "./dist/preview.js"
     },
-    "./preview-runtime": "./dist/preview-runtime.js"
+    "./preview-runtime": "./dist/preview-runtime.js",
+    "./runtime": {
+      "types": "./dist/runtime.d.ts",
+      "default": "./dist/runtime.js"
+    }
   },
   "files": [
     "dist/**/*",
@@ -64,6 +68,7 @@
     "typescript": "^5.9.3"
   },
   "peerDependencies": {
+    "@lynx-js/react": ">=0.100.0",
     "@lynx-js/rspeedy": ">=0.10.0",
     "@lynx-js/web-core": ">=0.6.0",
     "@lynx-js/web-elements": ">=0.6.0",
@@ -82,7 +87,8 @@
       "./src/index.ts",
       "./src/preset.ts",
       "./src/preview.ts",
-      "./src/preview-runtime.ts"
+      "./src/preview-runtime.ts",
+      "./src/runtime.ts"
     ],
     "platform": "node"
   }