weifuwu 0.31.0 → 0.31.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,28 +1,92 @@
1
- import type { ReactOptions, ReactMiddleware } from './types.ts';
1
+ import { type ReactElement, type ComponentType } from 'react';
2
+ import { type Middleware } from '../types.ts';
3
+ import type { Router } from '../core/router.ts';
4
+ import type { ReactOptions, ReactRouterOptions, ReactAppOptions } from './types.ts';
2
5
  /**
3
- * React SSR middleware.
6
+ * React SSR middleware — injects `ctx.render(path, opts?)`.
4
7
  *
5
- * Injects ctx.render() and ctx.renderStream() for server-side rendering
6
- * React components to HTML. Supports layout composition via mount nesting.
8
+ * Options:
9
+ * - `layout`: Wrap every page in a shared layout component (nav, footer, etc.)
10
+ *
11
+ * For Tailwind CSS: use `tailwindDev` middleware.
12
+ * For client bundles: use `esbuildDev` middleware.
7
13
  *
8
14
  * @example
9
15
  * ```ts
10
- * app.use(react({
11
- * layout: ({ children }) => (
12
- * <html><body><div id="root">{children}</div></body></html>
13
- * ),
16
+ * app.use(tailwindDev({ '/assets/tailwind.css': { entry: './styles/input.css' } }))
17
+ * app.use(esbuildDev({ '/assets/client.js': { entry: './client.ts', ... } }))
18
+ * app.use(react({ layout: './components/PageShell.tsx' }))
19
+ * app.get('/', (_req, ctx) => ctx.render('./pages/HomePage.tsx', {
20
+ * stylesheets: ['/assets/tailwind.css'],
21
+ * bootstrapModules: ['/assets/client.js'],
14
22
  * }))
23
+ * ```
24
+ */
25
+ /**
26
+ * React SSR middleware — injects `ctx.render(path, opts?)`.
27
+ *
28
+ * **Lightweight mode** (no `pages`): returns middleware for `app.use()`.
29
+ * Use with manual `app.get()` + `ctx.render()`.
15
30
  *
16
- * app.get('/', async (req, ctx) => {
17
- * return ctx.render(<Home />, { data: { title: 'Home' } })
31
+ * **Full mode** (has `pages`): returns a plugin for `app.plugin()`.
32
+ * Handles routing, data loading, Tailwind, client bundle, and error pages.
33
+ */
34
+ export declare function react(opts?: ReactOptions): Middleware;
35
+ export declare function react(opts: ReactAppOptions): (app: Router) => void;
36
+ /**
37
+ * Auto-register routes from a shared route config.
38
+ *
39
+ * Use a single routes file shared between server and client to eliminate duplication.
40
+ * Routes with data dependencies use the `loaders` option — request ctx is passed
41
+ * to the loader, which can throw `HttpError` for non-200 status codes.
42
+ *
43
+ * @example
44
+ * ```ts
45
+ * // routes.ts — shared by server and client
46
+ * export const routes = {
47
+ * '/': () => import('./pages/Home.tsx'),
48
+ * '/users': () => import('./pages/Users.tsx'),
49
+ * '/users/:id': () => import('./pages/UserDetail.tsx'),
50
+ * }
51
+ *
52
+ * // server.ts
53
+ * import { reactRouter } from 'weifuwu/react'
54
+ * import { routes } from './routes.ts'
55
+ *
56
+ * reactRouter(app, routes, {
57
+ * layout: './layouts/Root.tsx',
58
+ * stylesheets: ['/assets/tailwind.css'],
59
+ * bootstrapModules: ['/assets/client.js'],
60
+ * loaders: {
61
+ * '/users': async (ctx) => ({ users: await db.listUsers() }),
62
+ * '/users/:id': async (ctx) => {
63
+ * const user = await db.findUser(ctx.params.id)
64
+ * if (!user) throw new HttpError('Not found', 404)
65
+ * return { user }
66
+ * },
67
+ * },
18
68
  * })
69
+ *
70
+ * // client.ts — same routes config, no loaders
71
+ * import { createBrowserRouter } from 'weifuwu/react/client'
72
+ * import { routes } from './routes.ts'
73
+ *
74
+ * createBrowserRouter({ layout: Root, routes })
19
75
  * ```
20
76
  */
21
- export declare function react(opts?: ReactOptions): ReactMiddleware;
77
+ export declare function reactRouter(app: Router, routes: Record<string, () => Promise<{
78
+ default: ComponentType;
79
+ }>>, opts?: ReactRouterOptions): void;
80
+ /**
81
+ * Client-side navigation link. Renders as `<a>` on the server.
82
+ * On the client, intercepted by `createBrowserRouter` for SPA navigation.
83
+ */
84
+ export declare function Link({ href, children, ...props }: {
85
+ href: string;
86
+ children: React.ReactNode;
87
+ [key: string]: unknown;
88
+ }): ReactElement;
89
+ export { ErrorBoundary } from './error-boundary.ts';
22
90
  export { useServerData } from './hooks.ts';
23
91
  export { ServerDataContext } from './context.ts';
24
- export { Link, useParams, useNavigate, useRevalidate, Form, useNavigation } from './navigation.ts';
25
- export type { LinkProps, FormProps, NavigationState } from './navigation.ts';
26
- export { ErrorBoundary } from './error-boundary.ts';
27
- export type { ErrorBoundaryProps } from './error-boundary.ts';
28
- export type { ReactOptions, RenderOptions, ReactInjected } from './types.ts';
92
+ export type { ReactOptions, RenderOptions, ReactRouterOptions, ReactAppOptions } from './types.ts';