@mauroandre/velojs 0.0.4 → 0.0.5
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.
- package/README.md +36 -37
- package/bin/velojs.js +1 -14
- package/dist/cli.d.ts +1 -0
- package/dist/cli.js +59 -0
- package/dist/client.d.ts +5 -0
- package/dist/client.js +19 -0
- package/dist/components.d.ts +81 -0
- package/dist/components.js +26 -0
- package/{src/config.ts → dist/config.d.ts} +1 -7
- package/dist/config.js +6 -0
- package/dist/cookie.d.ts +1 -0
- package/dist/cookie.js +8 -0
- package/dist/factory.js +5 -0
- package/dist/hooks.d.ts +119 -0
- package/dist/hooks.js +72 -0
- package/{src/index.ts → dist/index.d.ts} +1 -15
- package/dist/index.js +7 -0
- package/dist/init.d.ts +1 -0
- package/dist/init.js +149 -0
- package/dist/server.d.ts +14 -0
- package/dist/server.js +168 -0
- package/{src/types.ts → dist/types.d.ts} +0 -6
- package/dist/types.js +1 -0
- package/dist/vite.d.ts +22 -0
- package/dist/vite.js +448 -0
- package/package.json +21 -46
- package/src/cli.ts +0 -84
- package/src/client.tsx +0 -79
- package/src/components.tsx +0 -155
- package/src/cookie.ts +0 -7
- package/src/hooks.tsx +0 -266
- package/src/init.ts +0 -188
- package/src/server.tsx +0 -347
- package/src/vite.ts +0 -937
- /package/{src/factory.ts → dist/factory.d.ts} +0 -0
package/README.md
CHANGED
|
@@ -13,10 +13,10 @@ Fullstack web framework with SSR, hydration, and file-based conventions.
|
|
|
13
13
|
### Create a new project
|
|
14
14
|
|
|
15
15
|
```bash
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
npm install
|
|
19
|
-
|
|
16
|
+
npx @mauroandre/velojs init my-app
|
|
17
|
+
cd my-app
|
|
18
|
+
npm install
|
|
19
|
+
npx velojs dev
|
|
20
20
|
```
|
|
21
21
|
|
|
22
22
|
### Project structure
|
|
@@ -38,7 +38,7 @@ my-app/
|
|
|
38
38
|
|
|
39
39
|
```typescript
|
|
40
40
|
import { defineConfig } from "vite";
|
|
41
|
-
import { veloPlugin } from "velojs/vite";
|
|
41
|
+
import { veloPlugin } from "@mauroandre/velojs/vite";
|
|
42
42
|
|
|
43
43
|
export default defineConfig({
|
|
44
44
|
plugins: [veloPlugin()],
|
|
@@ -52,7 +52,7 @@ export default defineConfig({
|
|
|
52
52
|
"scripts": {
|
|
53
53
|
"dev": "velojs dev",
|
|
54
54
|
"build": "velojs build",
|
|
55
|
-
"start": "
|
|
55
|
+
"start": "velojs start"
|
|
56
56
|
}
|
|
57
57
|
}
|
|
58
58
|
```
|
|
@@ -63,7 +63,7 @@ The root component renders the HTML shell. It must accept `children` and include
|
|
|
63
63
|
|
|
64
64
|
```tsx
|
|
65
65
|
import type { ComponentChildren } from "preact";
|
|
66
|
-
import { Scripts } from "velojs";
|
|
66
|
+
import { Scripts } from "@mauroandre/velojs";
|
|
67
67
|
|
|
68
68
|
export const Component = ({ children }: { children?: ComponentChildren }) => (
|
|
69
69
|
<html lang="en">
|
|
@@ -97,7 +97,7 @@ Runs on the server only. Use it to connect to databases, create indexes, registe
|
|
|
97
97
|
|
|
98
98
|
```typescript
|
|
99
99
|
import type { Hono } from "hono";
|
|
100
|
-
import { addRoutes, onServer } from "velojs/server";
|
|
100
|
+
import { addRoutes, onServer } from "@mauroandre/velojs/server";
|
|
101
101
|
|
|
102
102
|
// Connect to database
|
|
103
103
|
import { connectDB } from "../db/engine.js";
|
|
@@ -121,7 +121,7 @@ setInterval(() => runCleanup().catch(console.error), 60_000);
|
|
|
121
121
|
### app/routes.tsx — Route definitions
|
|
122
122
|
|
|
123
123
|
```typescript
|
|
124
|
-
import type { AppRoutes } from "velojs";
|
|
124
|
+
import type { AppRoutes } from "@mauroandre/velojs";
|
|
125
125
|
import * as Root from "./client-root.js";
|
|
126
126
|
import * as Home from "./pages/Home.js";
|
|
127
127
|
|
|
@@ -139,8 +139,8 @@ export default [
|
|
|
139
139
|
### app/pages/Home.tsx — First page
|
|
140
140
|
|
|
141
141
|
```typescript
|
|
142
|
-
import type { LoaderArgs } from "velojs";
|
|
143
|
-
import { useLoader } from "velojs/hooks";
|
|
142
|
+
import type { LoaderArgs } from "@mauroandre/velojs";
|
|
143
|
+
import { useLoader } from "@mauroandre/velojs/hooks";
|
|
144
144
|
|
|
145
145
|
export const loader = async ({ c }: LoaderArgs) => {
|
|
146
146
|
return { message: "Hello, VeloJS!" };
|
|
@@ -177,7 +177,7 @@ Routes are defined in `app/routes.tsx` as a tree structure. Each node can have a
|
|
|
177
177
|
|
|
178
178
|
```typescript
|
|
179
179
|
// app/routes.tsx
|
|
180
|
-
import type { AppRoutes } from "velojs";
|
|
180
|
+
import type { AppRoutes } from "@mauroandre/velojs";
|
|
181
181
|
import * as Root from "./client-root.js";
|
|
182
182
|
import * as AuthLayout from "./auth/Layout.js";
|
|
183
183
|
import * as Login from "./auth/Login.js";
|
|
@@ -228,7 +228,7 @@ Root (isRoot — <html>, <head>, <body>)
|
|
|
228
228
|
|
|
229
229
|
```typescript
|
|
230
230
|
// app/client-root.tsx — Root component
|
|
231
|
-
import { Scripts } from "velojs";
|
|
231
|
+
import { Scripts } from "@mauroandre/velojs";
|
|
232
232
|
|
|
233
233
|
export const Component = ({ children }: { children: any }) => (
|
|
234
234
|
<html>
|
|
@@ -327,8 +327,8 @@ export default [
|
|
|
327
327
|
|
|
328
328
|
```typescript
|
|
329
329
|
// app/admin/Users.tsx
|
|
330
|
-
import type { LoaderArgs, ActionArgs } from "velojs";
|
|
331
|
-
import { useLoader } from "velojs/hooks";
|
|
330
|
+
import type { LoaderArgs, ActionArgs } from "@mauroandre/velojs";
|
|
331
|
+
import { useLoader } from "@mauroandre/velojs/hooks";
|
|
332
332
|
|
|
333
333
|
interface User { id: string; name: string; }
|
|
334
334
|
|
|
@@ -423,7 +423,7 @@ Use for global/shared data loaded in a Layout and exported to child modules. Run
|
|
|
423
423
|
|
|
424
424
|
```typescript
|
|
425
425
|
// app/admin/Layout.tsx
|
|
426
|
-
import { Loader } from "velojs/hooks";
|
|
426
|
+
import { Loader } from "@mauroandre/velojs/hooks";
|
|
427
427
|
|
|
428
428
|
export const { data: globalData } = Loader<GlobalType>();
|
|
429
429
|
|
|
@@ -471,7 +471,7 @@ export const action_login = async ({
|
|
|
471
471
|
const { authenticate } = await import("./auth.service.js");
|
|
472
472
|
const token = await authenticate(body.email, body.password);
|
|
473
473
|
|
|
474
|
-
const { setCookie } = await import("velojs/cookie");
|
|
474
|
+
const { setCookie } = await import("@mauroandre/velojs/cookie");
|
|
475
475
|
setCookie(c!, "session", token, { path: "/" });
|
|
476
476
|
|
|
477
477
|
return { ok: true };
|
|
@@ -535,7 +535,7 @@ touch(items);
|
|
|
535
535
|
Navigation with type-safe module references or string paths.
|
|
536
536
|
|
|
537
537
|
```typescript
|
|
538
|
-
import { Link } from "velojs";
|
|
538
|
+
import { Link } from "@mauroandre/velojs";
|
|
539
539
|
import * as UserPage from "./users/UserDetail.js";
|
|
540
540
|
import * as LoginPage from "./auth/Login.js";
|
|
541
541
|
|
|
@@ -588,7 +588,7 @@ The `~/` prefix escapes the nest context and navigates from the root. Use it whe
|
|
|
588
588
|
Injects necessary scripts and styles in `<head>`.
|
|
589
589
|
|
|
590
590
|
```tsx
|
|
591
|
-
import { Scripts } from "velojs";
|
|
591
|
+
import { Scripts } from "@mauroandre/velojs";
|
|
592
592
|
|
|
593
593
|
export const Component = ({ children }) => (
|
|
594
594
|
<html>
|
|
@@ -635,8 +635,8 @@ Use `createMiddleware` from `velojs/factory` (wraps Hono's middleware):
|
|
|
635
635
|
|
|
636
636
|
```typescript
|
|
637
637
|
// app/modules/auth/auth.middleware.ts
|
|
638
|
-
import { createMiddleware } from "velojs/factory";
|
|
639
|
-
import { getCookie } from "velojs/cookie";
|
|
638
|
+
import { createMiddleware } from "@mauroandre/velojs/factory";
|
|
639
|
+
import { getCookie } from "@mauroandre/velojs/cookie";
|
|
640
640
|
|
|
641
641
|
export const authMiddleware = createMiddleware(async (c, next) => {
|
|
642
642
|
const token = getCookie(c, "session");
|
|
@@ -731,7 +731,7 @@ Register custom Hono routes before page/action routes. Call in `app/server.tsx`.
|
|
|
731
731
|
|
|
732
732
|
```typescript
|
|
733
733
|
// app/server.tsx
|
|
734
|
-
import { addRoutes } from "velojs/server";
|
|
734
|
+
import { addRoutes } from "@mauroandre/velojs/server";
|
|
735
735
|
import type { Hono } from "hono";
|
|
736
736
|
|
|
737
737
|
addRoutes((app: Hono) => {
|
|
@@ -759,7 +759,7 @@ addRoutes((app: Hono) => {
|
|
|
759
759
|
Use Hono's `streamSSE` for real-time server-to-client communication.
|
|
760
760
|
|
|
761
761
|
```typescript
|
|
762
|
-
import { addRoutes } from "velojs/server";
|
|
762
|
+
import { addRoutes } from "@mauroandre/velojs/server";
|
|
763
763
|
|
|
764
764
|
addRoutes((app) => {
|
|
765
765
|
app.get("/api/events", async (c) => {
|
|
@@ -828,7 +828,7 @@ addRoutes((app) => {
|
|
|
828
828
|
Access the underlying Node.js HTTP server. Useful for WebSocket handlers.
|
|
829
829
|
|
|
830
830
|
```typescript
|
|
831
|
-
import { onServer } from "velojs/server";
|
|
831
|
+
import { onServer } from "@mauroandre/velojs/server";
|
|
832
832
|
|
|
833
833
|
onServer((httpServer) => {
|
|
834
834
|
const { WebSocketServer } = await import("ws");
|
|
@@ -860,7 +860,7 @@ Callbacks queue until the server starts. If called after startup, executes immed
|
|
|
860
860
|
| Variable | Default | Description |
|
|
861
861
|
|----------|---------|-------------|
|
|
862
862
|
| `SERVER_PORT` | `3000` | Server port |
|
|
863
|
-
| `NODE_ENV` | — | `
|
|
863
|
+
| `NODE_ENV` | — | Set automatically by `velojs start`. Enables static file serving |
|
|
864
864
|
| `STATIC_BASE_URL` | `""` | CDN/bucket prefix for static assets |
|
|
865
865
|
|
|
866
866
|
---
|
|
@@ -924,14 +924,14 @@ Hooks (`useParams`, `useQuery`, `usePathname`, `Loader`, `useLoader`) access thi
|
|
|
924
924
|
|
|
925
925
|
| Import | Contents |
|
|
926
926
|
|--------|----------|
|
|
927
|
-
|
|
|
928
|
-
|
|
|
929
|
-
|
|
|
930
|
-
|
|
|
931
|
-
|
|
|
932
|
-
|
|
|
933
|
-
|
|
|
934
|
-
|
|
|
927
|
+
| `@mauroandre/velojs` | Types (`AppRoutes`, `ActionArgs`, `LoaderArgs`, `Metadata`), `Scripts`, `Link`, `defineConfig` |
|
|
928
|
+
| `@mauroandre/velojs/server` | `startServer`, `createApp`, `addRoutes`, `onServer`, `serverDataStorage` |
|
|
929
|
+
| `@mauroandre/velojs/client` | `startClient` |
|
|
930
|
+
| `@mauroandre/velojs/hooks` | `Loader`, `useLoader`, `useParams`, `useQuery`, `useNavigate`, `usePathname`, `touch` |
|
|
931
|
+
| `@mauroandre/velojs/cookie` | `getCookie`, `setCookie`, `deleteCookie`, `getSignedCookie`, `setSignedCookie` |
|
|
932
|
+
| `@mauroandre/velojs/factory` | `createMiddleware`, `createFactory` |
|
|
933
|
+
| `@mauroandre/velojs/vite` | `veloPlugin` |
|
|
934
|
+
| `@mauroandre/velojs/config` | `defineConfig`, `VeloConfig` |
|
|
935
935
|
|
|
936
936
|
---
|
|
937
937
|
|
|
@@ -1003,10 +1003,9 @@ COPY package.json package-lock.json ./
|
|
|
1003
1003
|
RUN npm ci --omit=dev
|
|
1004
1004
|
COPY --from=builder /app/dist ./dist
|
|
1005
1005
|
|
|
1006
|
-
ENV NODE_ENV=production
|
|
1007
1006
|
ENV SERVER_PORT=3000
|
|
1008
1007
|
EXPOSE 3000
|
|
1009
|
-
CMD ["
|
|
1008
|
+
CMD ["npx", "velojs", "start"]
|
|
1010
1009
|
```
|
|
1011
1010
|
|
|
1012
1011
|
### Build output
|
|
@@ -1020,7 +1019,7 @@ velojs build
|
|
|
1020
1019
|
# server.js # SSR server entry (single file)
|
|
1021
1020
|
```
|
|
1022
1021
|
|
|
1023
|
-
In production,
|
|
1022
|
+
In production, `velojs start` sets `NODE_ENV=production` automatically and serves static files from `dist/client/`.
|
|
1024
1023
|
|
|
1025
1024
|
### Static assets on CDN
|
|
1026
1025
|
|
|
@@ -1036,7 +1035,7 @@ The `<Scripts />` component and CSS `url()` references will use this prefix auto
|
|
|
1036
1035
|
|
|
1037
1036
|
## Included Dependencies
|
|
1038
1037
|
|
|
1039
|
-
VeloJS includes everything you need. A single `npm install velojs` brings:
|
|
1038
|
+
VeloJS includes everything you need. A single `npm install @mauroandre/velojs` brings:
|
|
1040
1039
|
|
|
1041
1040
|
- **Hono** — HTTP server and routing
|
|
1042
1041
|
- **Preact** — UI rendering (SSR + client)
|
package/bin/velojs.js
CHANGED
|
@@ -1,15 +1,2 @@
|
|
|
1
1
|
#!/usr/bin/env node
|
|
2
|
-
|
|
3
|
-
import { spawnSync } from "node:child_process";
|
|
4
|
-
import { dirname, resolve } from "node:path";
|
|
5
|
-
import { fileURLToPath } from "node:url";
|
|
6
|
-
|
|
7
|
-
const __dirname = dirname(fileURLToPath(import.meta.url));
|
|
8
|
-
const cliPath = resolve(__dirname, "../src/cli.ts");
|
|
9
|
-
|
|
10
|
-
const result = spawnSync("npx", ["tsx", cliPath, ...process.argv.slice(2)], {
|
|
11
|
-
stdio: "inherit",
|
|
12
|
-
cwd: process.cwd(),
|
|
13
|
-
});
|
|
14
|
-
|
|
15
|
-
process.exit(result.status ?? 0);
|
|
2
|
+
import "../dist/cli.js";
|
package/dist/cli.d.ts
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
package/dist/cli.js
ADDED
|
@@ -0,0 +1,59 @@
|
|
|
1
|
+
import { spawnSync as o } from "node:child_process";
|
|
2
|
+
import { resolve as l } from "node:path";
|
|
3
|
+
const r = process.argv.slice(2), s = r[0], c = (e, n = []) => {
|
|
4
|
+
const i = o(e, n, {
|
|
5
|
+
stdio: "inherit",
|
|
6
|
+
cwd: process.cwd()
|
|
7
|
+
});
|
|
8
|
+
process.exit(i.status ?? 0);
|
|
9
|
+
}, a = () => {
|
|
10
|
+
c("npx", ["vite", ...r.slice(1)]);
|
|
11
|
+
}, d = () => {
|
|
12
|
+
console.log("Building client..."), o("npx", ["vite", "build"], { stdio: "inherit", cwd: process.cwd() }), console.log("Building server..."), o("npx", ["vite", "build", "--mode", "server"], { stdio: "inherit", cwd: process.cwd() }), console.log("Build complete!");
|
|
13
|
+
}, p = () => {
|
|
14
|
+
process.env.NODE_ENV = "production";
|
|
15
|
+
const e = l(process.cwd(), "dist/server.js");
|
|
16
|
+
c("node", [e]);
|
|
17
|
+
}, t = () => {
|
|
18
|
+
console.log(`
|
|
19
|
+
VeloJS CLI
|
|
20
|
+
|
|
21
|
+
Usage:
|
|
22
|
+
velojs <command>
|
|
23
|
+
|
|
24
|
+
Commands:
|
|
25
|
+
init Create a new VeloJS project
|
|
26
|
+
dev Start development server
|
|
27
|
+
build Build for production (client + server)
|
|
28
|
+
start Start production server
|
|
29
|
+
|
|
30
|
+
Examples:
|
|
31
|
+
velojs init my-app
|
|
32
|
+
velojs dev
|
|
33
|
+
velojs build
|
|
34
|
+
velojs start
|
|
35
|
+
`);
|
|
36
|
+
};
|
|
37
|
+
switch (s) {
|
|
38
|
+
case "init": {
|
|
39
|
+
const { runInit: e } = await import("./init.js");
|
|
40
|
+
await e(r[1]);
|
|
41
|
+
break;
|
|
42
|
+
}
|
|
43
|
+
case "dev":
|
|
44
|
+
a();
|
|
45
|
+
break;
|
|
46
|
+
case "build":
|
|
47
|
+
d();
|
|
48
|
+
break;
|
|
49
|
+
case "start":
|
|
50
|
+
p();
|
|
51
|
+
break;
|
|
52
|
+
case "help":
|
|
53
|
+
case "--help":
|
|
54
|
+
case "-h":
|
|
55
|
+
t();
|
|
56
|
+
break;
|
|
57
|
+
default:
|
|
58
|
+
s && console.error(`Unknown command: ${s}`), t(), process.exit(1);
|
|
59
|
+
}
|
package/dist/client.d.ts
ADDED
package/dist/client.js
ADDED
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
import { jsx as r } from "preact/jsx-runtime";
|
|
2
|
+
import { hydrate as l } from "preact";
|
|
3
|
+
import { Router as p, Route as s, Switch as h } from "wouter-preact";
|
|
4
|
+
const u = (e, o = !1) => e.map((t, n) => {
|
|
5
|
+
const c = t.module.Component;
|
|
6
|
+
if (!t.children)
|
|
7
|
+
return /* @__PURE__ */ r(s, { path: t.path || "", children: /* @__PURE__ */ r(c, {}) }, n);
|
|
8
|
+
const i = u(t.children, !!t.path);
|
|
9
|
+
return t.isRoot ? /* @__PURE__ */ r(h, { children: i }, n) : t.path ? /* @__PURE__ */ r(s, { path: t.path, nest: !0, children: /* @__PURE__ */ r(c, { children: /* @__PURE__ */ r(h, { children: i }) }) }, n) : /* @__PURE__ */ r(c, { children: /* @__PURE__ */ r(h, { children: i }) }, n);
|
|
10
|
+
}), m = ({ routes: e }) => {
|
|
11
|
+
const o = u(e);
|
|
12
|
+
return /* @__PURE__ */ r(p, { children: o });
|
|
13
|
+
}, R = (e) => {
|
|
14
|
+
const { routes: o } = e, t = document.querySelector("body");
|
|
15
|
+
t && l(/* @__PURE__ */ r(m, { routes: o }), t);
|
|
16
|
+
};
|
|
17
|
+
export {
|
|
18
|
+
R as startClient
|
|
19
|
+
};
|
|
@@ -0,0 +1,81 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* VeloJS Components
|
|
3
|
+
* Components that can be used in the app for script/style injection
|
|
4
|
+
*/
|
|
5
|
+
import { Link as WouterLink } from "wouter-preact";
|
|
6
|
+
interface ScriptsProps {
|
|
7
|
+
/**
|
|
8
|
+
* Base path for static assets in production
|
|
9
|
+
* @default ""
|
|
10
|
+
*/
|
|
11
|
+
basePath?: string;
|
|
12
|
+
/**
|
|
13
|
+
* Path to the favicon file relative to the public directory
|
|
14
|
+
* Set to false to disable favicon injection
|
|
15
|
+
* @default "/favicon.ico"
|
|
16
|
+
*/
|
|
17
|
+
favicon?: string | false;
|
|
18
|
+
}
|
|
19
|
+
/**
|
|
20
|
+
* Injects the necessary scripts and styles for VeloJS.
|
|
21
|
+
* In dev mode: injects Vite HMR client and velo client script
|
|
22
|
+
* In production: injects compiled CSS and JS
|
|
23
|
+
*
|
|
24
|
+
* @example
|
|
25
|
+
* ```tsx
|
|
26
|
+
* <head>
|
|
27
|
+
* <Scripts />
|
|
28
|
+
* </head>
|
|
29
|
+
* ```
|
|
30
|
+
*/
|
|
31
|
+
export declare function Scripts({ basePath, favicon }?: ScriptsProps): import("preact").JSX.Element;
|
|
32
|
+
import type { ComponentProps } from "preact";
|
|
33
|
+
import type { RouteModule } from "./types.js";
|
|
34
|
+
type WouterLinkProps = ComponentProps<typeof WouterLink>;
|
|
35
|
+
type LinkProps = Omit<WouterLinkProps, "to" | "href"> & {
|
|
36
|
+
/**
|
|
37
|
+
* Destination - can be a string path or a module with metadata
|
|
38
|
+
*/
|
|
39
|
+
to: string | RouteModule;
|
|
40
|
+
/**
|
|
41
|
+
* URL parameters to substitute in the path
|
|
42
|
+
* e.g., { id: "123" } replaces :id with 123
|
|
43
|
+
*/
|
|
44
|
+
params?: Record<string, string>;
|
|
45
|
+
/**
|
|
46
|
+
* Query string parameters appended to the URL
|
|
47
|
+
* e.g., { company: "abc" } appends ?company=abc
|
|
48
|
+
*/
|
|
49
|
+
search?: Record<string, string> | undefined;
|
|
50
|
+
/**
|
|
51
|
+
* When true, ignores current URL params and uses fullPath as-is
|
|
52
|
+
* By default, params are extracted from current URL and substituted
|
|
53
|
+
* @default false
|
|
54
|
+
*/
|
|
55
|
+
absolute?: boolean;
|
|
56
|
+
};
|
|
57
|
+
/**
|
|
58
|
+
* Substitutes :param placeholders in a path with actual values
|
|
59
|
+
*/
|
|
60
|
+
export declare function substituteParams(path: string, params: Record<string, string>): string;
|
|
61
|
+
/**
|
|
62
|
+
* Link component for navigation.
|
|
63
|
+
* Accepts either a string path or a route module.
|
|
64
|
+
*
|
|
65
|
+
* @example
|
|
66
|
+
* ```tsx
|
|
67
|
+
* // With string path
|
|
68
|
+
* <Link to="/login">Login</Link>
|
|
69
|
+
*
|
|
70
|
+
* // With route module (relative - uses path, works with nest)
|
|
71
|
+
* <Link to={McpPage}>MCP</Link>
|
|
72
|
+
*
|
|
73
|
+
* // With route module (absolute - uses fullPath)
|
|
74
|
+
* <Link to={LoginPage} absolute>Login</Link>
|
|
75
|
+
*
|
|
76
|
+
* // With explicit params
|
|
77
|
+
* <Link to={UserPage} params={{ id: "123" }}>View User</Link>
|
|
78
|
+
* ```
|
|
79
|
+
*/
|
|
80
|
+
export declare function Link({ to, params, search, absolute, ...rest }: LinkProps): import("preact").JSX.Element;
|
|
81
|
+
export {};
|
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
import { jsx as i, jsxs as u, Fragment as m } from "preact/jsx-runtime";
|
|
2
|
+
import { Link as p } from "wouter-preact";
|
|
3
|
+
function y({ basePath: t, favicon: n = "/favicon.ico" } = {}) {
|
|
4
|
+
t = t || process.env.STATIC_BASE_URL || "";
|
|
5
|
+
const e = n !== !1 && /* @__PURE__ */ i("link", { rel: "icon", href: `${t}${n}`, type: "image/x-icon" });
|
|
6
|
+
return /* @__PURE__ */ u(m, { children: [
|
|
7
|
+
e,
|
|
8
|
+
/* @__PURE__ */ i("link", { rel: "stylesheet", href: `${t}/client.css` }),
|
|
9
|
+
/* @__PURE__ */ i("script", { type: "module", src: `${t}/client.js` })
|
|
10
|
+
] });
|
|
11
|
+
}
|
|
12
|
+
function $(t, n) {
|
|
13
|
+
let e = t;
|
|
14
|
+
for (const [r, c] of Object.entries(n))
|
|
15
|
+
e = e.replace(`:${r}`, c);
|
|
16
|
+
return e;
|
|
17
|
+
}
|
|
18
|
+
function S({ to: t, params: n, search: e, absolute: r, ...c }) {
|
|
19
|
+
const o = typeof t != "string", s = o ? (r ? t.metadata?.fullPath : t.metadata?.path) ?? "/" : t, l = n ? $(s, n) : s, a = o && r ? `~${l}` : l, f = e ? `?${new URLSearchParams(e).toString()}` : "";
|
|
20
|
+
return /* @__PURE__ */ i(p, { to: `${a}${f}`, ...c });
|
|
21
|
+
}
|
|
22
|
+
export {
|
|
23
|
+
S as Link,
|
|
24
|
+
y as Scripts,
|
|
25
|
+
$ as substituteParams
|
|
26
|
+
};
|
|
@@ -4,26 +4,20 @@ export interface VeloConfig {
|
|
|
4
4
|
* @default "./app"
|
|
5
5
|
*/
|
|
6
6
|
appDirectory?: string;
|
|
7
|
-
|
|
8
7
|
/**
|
|
9
8
|
* Arquivo de rotas com export default AppRoutes
|
|
10
9
|
* @default "routes.tsx"
|
|
11
10
|
*/
|
|
12
11
|
routesFile?: string;
|
|
13
|
-
|
|
14
12
|
/**
|
|
15
13
|
* Arquivo de inicialização do servidor (custom init, sem velojs imports)
|
|
16
14
|
* @default "server.tsx"
|
|
17
15
|
*/
|
|
18
16
|
serverInit?: string;
|
|
19
|
-
|
|
20
17
|
/**
|
|
21
18
|
* Arquivo de inicialização do cliente (custom init, sem velojs imports)
|
|
22
19
|
* @default "client.tsx"
|
|
23
20
|
*/
|
|
24
21
|
clientInit?: string;
|
|
25
22
|
}
|
|
26
|
-
|
|
27
|
-
export function defineConfig(config: VeloConfig): VeloConfig {
|
|
28
|
-
return config;
|
|
29
|
-
}
|
|
23
|
+
export declare function defineConfig(config: VeloConfig): VeloConfig;
|
package/dist/config.js
ADDED
package/dist/cookie.d.ts
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { getCookie, getSignedCookie, setCookie, setSignedCookie, deleteCookie, } from "hono/cookie";
|
package/dist/cookie.js
ADDED
package/dist/factory.js
ADDED
package/dist/hooks.d.ts
ADDED
|
@@ -0,0 +1,119 @@
|
|
|
1
|
+
import { type Signal } from "@preact/signals";
|
|
2
|
+
/**
|
|
3
|
+
* Força o signal a notificar mudanças após mutação de propriedades aninhadas
|
|
4
|
+
*
|
|
5
|
+
* Uso:
|
|
6
|
+
* ```tsx
|
|
7
|
+
* word.isChecked = !word.isChecked; // muta
|
|
8
|
+
* touch(pathAppliedData); // notifica
|
|
9
|
+
* ```
|
|
10
|
+
*/
|
|
11
|
+
export declare function touch<T>(sig: Signal<T | null>): void;
|
|
12
|
+
/**
|
|
13
|
+
* Hidrata dados do loader fora de componentes (SSR only)
|
|
14
|
+
* Apenas lê do __PAGE_DATA__, nunca faz fetch
|
|
15
|
+
*
|
|
16
|
+
* Use para dados globais/compartilhados carregados no Layout.
|
|
17
|
+
* Para dados de página com suporte a navegação SPA, use useLoader() dentro do Component.
|
|
18
|
+
*
|
|
19
|
+
* Uso:
|
|
20
|
+
* ```tsx
|
|
21
|
+
* // No Layout - carrega dados globais
|
|
22
|
+
* export const { data: globalData } = Loader<GlobalType>();
|
|
23
|
+
*
|
|
24
|
+
* // No componente do Layout
|
|
25
|
+
* export const Component = ({ children }) => <div>{globalData.value?.name}{children}</div>;
|
|
26
|
+
*
|
|
27
|
+
* // Em outros módulos - importa o dado do Layout
|
|
28
|
+
* import { globalData } from "./Layout.js";
|
|
29
|
+
* ```
|
|
30
|
+
*
|
|
31
|
+
* @param moduleId - Injetado automaticamente pelo veloPlugin
|
|
32
|
+
*/
|
|
33
|
+
export declare function Loader<T>(moduleId?: string): {
|
|
34
|
+
data: Signal<T | null>;
|
|
35
|
+
loading: Signal<boolean>;
|
|
36
|
+
};
|
|
37
|
+
/**
|
|
38
|
+
* Hook para acessar dados do loader dentro de componentes
|
|
39
|
+
* Suporta SSR hydration e navegação SPA (faz fetch se necessário)
|
|
40
|
+
*
|
|
41
|
+
* Uso:
|
|
42
|
+
* ```tsx
|
|
43
|
+
* export const Component = () => {
|
|
44
|
+
* const { data, loading } = useLoader<MyType>();
|
|
45
|
+
* return <div>{data.value?.name}</div>;
|
|
46
|
+
* };
|
|
47
|
+
*
|
|
48
|
+
* // Com deps (ex: recarregar ao trocar de rota)
|
|
49
|
+
* const params = useParams();
|
|
50
|
+
* const { data } = useLoader<MyType>([params.id]);
|
|
51
|
+
* ```
|
|
52
|
+
*
|
|
53
|
+
* @param moduleId - Injetado automaticamente pelo veloPlugin
|
|
54
|
+
* @param deps - Array de dependências (triggers re-fetch quando mudam)
|
|
55
|
+
*/
|
|
56
|
+
export declare function useLoader<T>(): {
|
|
57
|
+
data: Signal<T | null>;
|
|
58
|
+
loading: Signal<boolean>;
|
|
59
|
+
refetch: () => void;
|
|
60
|
+
};
|
|
61
|
+
export declare function useLoader<T>(deps: any[]): {
|
|
62
|
+
data: Signal<T | null>;
|
|
63
|
+
loading: Signal<boolean>;
|
|
64
|
+
refetch: () => void;
|
|
65
|
+
};
|
|
66
|
+
export declare function useLoader<T>(moduleId: string, deps?: any[]): {
|
|
67
|
+
data: Signal<T | null>;
|
|
68
|
+
loading: Signal<boolean>;
|
|
69
|
+
refetch: () => void;
|
|
70
|
+
};
|
|
71
|
+
/**
|
|
72
|
+
* Hook para navegação programática
|
|
73
|
+
*
|
|
74
|
+
* Uso:
|
|
75
|
+
* ```tsx
|
|
76
|
+
* const navigate = useNavigate();
|
|
77
|
+
* navigate("/outra-pagina");
|
|
78
|
+
* ```
|
|
79
|
+
*/
|
|
80
|
+
export declare function useNavigate(): <S = any>(to: string | URL, options?: {
|
|
81
|
+
replace?: boolean;
|
|
82
|
+
state?: S;
|
|
83
|
+
transition?: boolean;
|
|
84
|
+
}) => void;
|
|
85
|
+
/**
|
|
86
|
+
* Hook para acessar parâmetros da rota (funciona em SSR e cliente)
|
|
87
|
+
*
|
|
88
|
+
* Uso:
|
|
89
|
+
* ```tsx
|
|
90
|
+
* // Rota: /teste/:pathAppliedId/avaliacao/:assessmentRatingIndex
|
|
91
|
+
* const params = useParams();
|
|
92
|
+
* console.log(params.pathAppliedId, params.assessmentRatingIndex);
|
|
93
|
+
* ```
|
|
94
|
+
*/
|
|
95
|
+
export declare function useParams<T extends Record<string, string> = Record<string, string>>(): T;
|
|
96
|
+
/**
|
|
97
|
+
* Hook para acessar query string da rota (funciona em SSR e cliente)
|
|
98
|
+
*
|
|
99
|
+
* Uso:
|
|
100
|
+
* ```tsx
|
|
101
|
+
* // URL: /teste?foo=bar&baz=123
|
|
102
|
+
* const query = useQuery();
|
|
103
|
+
* console.log(query.foo, query.baz);
|
|
104
|
+
* ```
|
|
105
|
+
*/
|
|
106
|
+
export declare function useQuery<T extends Record<string, string> = Record<string, string>>(): T;
|
|
107
|
+
/**
|
|
108
|
+
* Hook para acessar o pathname completo da URL (funciona em SSR e cliente)
|
|
109
|
+
* Diferente do useLocation do wouter que retorna path relativo ao contexto nest,
|
|
110
|
+
* este hook sempre retorna o pathname absoluto.
|
|
111
|
+
*
|
|
112
|
+
* Uso:
|
|
113
|
+
* ```tsx
|
|
114
|
+
* const pathname = usePathname();
|
|
115
|
+
* // Em /admin/colaboradores sempre retorna "/admin/colaboradores"
|
|
116
|
+
* // (não "/" como useLocation retornaria dentro do contexto /admin)
|
|
117
|
+
* ```
|
|
118
|
+
*/
|
|
119
|
+
export declare function usePathname(): string;
|