@flightdev/ui 2.0.0 → 2.0.1
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/.turbo/turbo-build.log +25 -25
- package/README.md +5 -5
- package/TESTING.md +5 -5
- package/docs/ADAPTERS.md +32 -32
- package/docs/PATTERNS.md +12 -12
- package/package.json +7 -1
package/.turbo/turbo-build.log
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
|
|
2
|
-
> @flightdev/ui@2.0.
|
|
2
|
+
> @flightdev/ui@2.0.1 build E:\testear framework\Flight\packages\ui
|
|
3
3
|
> tsup
|
|
4
4
|
|
|
5
5
|
[34mCLI[39m Building entry: src/index.ts, src/core/index.ts, src/adapters/tier-1/angular.ts, src/adapters/tier-1/index.ts, src/adapters/tier-1/qwik.ts, src/adapters/tier-1/react.ts, src/adapters/tier-1/solid.ts, src/adapters/tier-1/svelte.ts, src/adapters/tier-1/vue.ts, src/adapters/tier-2/index.ts, src/adapters/tier-2/inferno.ts, src/adapters/tier-2/lit.ts, src/adapters/tier-2/marko.ts, src/adapters/tier-2/mithril.ts, src/adapters/tier-2/preact.ts, src/adapters/tier-2/stencil.ts, src/adapters/tier-3/alpine.ts, src/adapters/tier-3/hotwire.ts, src/adapters/tier-3/htmx.ts, src/adapters/tier-3/index.ts, src/adapters/tier-3/petite-vue.ts, src/adapters/tier-3/stimulus.ts, src/adapters/tier-3/vanilla.ts
|
|
@@ -9,52 +9,52 @@
|
|
|
9
9
|
[34mCLI[39m Target: node20
|
|
10
10
|
[34mCLI[39m Cleaning output folder
|
|
11
11
|
[34mESM[39m Build start
|
|
12
|
+
[34mDTS[39m Build start
|
|
12
13
|
[32mESM[39m [1mdist\adapters\tier-3\alpine.js [22m[32m156.00 B[39m
|
|
13
14
|
[32mESM[39m [1mdist\adapters\tier-3\htmx.js [22m[32m164.00 B[39m
|
|
14
15
|
[32mESM[39m [1mdist\adapters\tier-3\hotwire.js [22m[32m174.00 B[39m
|
|
16
|
+
[32mESM[39m [1mdist\chunk-Q7HUE44H.js [22m[32m3.03 KB[39m
|
|
15
17
|
[32mESM[39m [1mdist\adapters\tier-3\index.js [22m[32m638.00 B[39m
|
|
16
|
-
[32mESM[39m [1mdist\adapters\tier-3\stimulus.js [22m[32m160.00 B[39m
|
|
17
18
|
[32mESM[39m [1mdist\adapters\tier-3\petite-vue.js [22m[32m155.00 B[39m
|
|
19
|
+
[32mESM[39m [1mdist\adapters\tier-1\vue.js [22m[32m117.00 B[39m
|
|
18
20
|
[32mESM[39m [1mdist\chunk-4PZDNFL7.js [22m[32m4.15 KB[39m
|
|
19
|
-
[32mESM[39m [1mdist\chunk-Q7HUE44H.js [22m[32m3.03 KB[39m
|
|
20
|
-
[32mESM[39m [1mdist\adapters\tier-3\vanilla.js [22m[32m167.00 B[39m
|
|
21
|
-
[32mESM[39m [1mdist\chunk-7ZJI3QU2.js [22m[32m3.72 KB[39m
|
|
22
|
-
[32mESM[39m [1mdist\chunk-CE4FJHQJ.js [22m[32m3.75 KB[39m
|
|
23
|
-
[32mESM[39m [1mdist\adapters\tier-2\index.js [22m[32m422.00 B[39m
|
|
24
21
|
[32mESM[39m [1mdist\chunk-ZAJVSE7J.js [22m[32m2.42 KB[39m
|
|
25
|
-
[32mESM[39m [1mdist\adapters\tier-
|
|
22
|
+
[32mESM[39m [1mdist\adapters\tier-2\index.js [22m[32m422.00 B[39m
|
|
23
|
+
[32mESM[39m [1mdist\chunk-CE4FJHQJ.js [22m[32m3.75 KB[39m
|
|
26
24
|
[32mESM[39m [1mdist\adapters\tier-2\inferno.js [22m[32m129.00 B[39m
|
|
27
|
-
[32mESM[39m [1mdist\
|
|
28
|
-
[32mESM[39m [1mdist\adapters\tier-2\preact.js [22m[32m126.00 B[39m
|
|
29
|
-
[32mESM[39m [1mdist\adapters\tier-2\mithril.js [22m[32m129.00 B[39m
|
|
25
|
+
[32mESM[39m [1mdist\chunk-OI2AMQLG.js [22m[32m4.29 KB[39m
|
|
30
26
|
[32mESM[39m [1mdist\chunk-QIVAK6BH.js [22m[32m2.83 KB[39m
|
|
31
27
|
[32mESM[39m [1mdist\adapters\tier-2\lit.js [22m[32m117.00 B[39m
|
|
32
|
-
[32mESM[39m [1mdist\adapters\tier-2\
|
|
28
|
+
[32mESM[39m [1mdist\adapters\tier-2\marko.js [22m[32m123.00 B[39m
|
|
29
|
+
[32mESM[39m [1mdist\adapters\tier-2\mithril.js [22m[32m129.00 B[39m
|
|
33
30
|
[32mESM[39m [1mdist\chunk-YFGSHW5S.js [22m[32m3.68 KB[39m
|
|
31
|
+
[32mESM[39m [1mdist\adapters\tier-2\stencil.js [22m[32m129.00 B[39m
|
|
32
|
+
[32mESM[39m [1mdist\chunk-7ZJI3QU2.js [22m[32m3.72 KB[39m
|
|
33
|
+
[32mESM[39m [1mdist\core\index.js [22m[32m228.00 B[39m
|
|
34
34
|
[32mESM[39m [1mdist\chunk-V34XPVGK.js [22m[32m2.76 KB[39m
|
|
35
|
+
[32mESM[39m [1mdist\chunk-5IBLFTYL.js [22m[32m2.80 KB[39m
|
|
35
36
|
[32mESM[39m [1mdist\chunk-DTCAUBH5.js [22m[32m2.21 KB[39m
|
|
36
37
|
[32mESM[39m [1mdist\adapters\tier-1\angular.js [22m[32m129.00 B[39m
|
|
37
|
-
[32mESM[39m [1mdist\chunk-OI2AMQLG.js [22m[32m4.29 KB[39m
|
|
38
|
-
[32mESM[39m [1mdist\chunk-5IBLFTYL.js [22m[32m2.80 KB[39m
|
|
39
|
-
[32mESM[39m [1mdist\core\index.js [22m[32m228.00 B[39m
|
|
40
|
-
[32mESM[39m [1mdist\adapters\tier-1\qwik.js [22m[32m120.00 B[39m
|
|
41
38
|
[32mESM[39m [1mdist\chunk-3HU6GSQ4.js [22m[32m3.89 KB[39m
|
|
39
|
+
[32mESM[39m [1mdist\adapters\tier-1\qwik.js [22m[32m120.00 B[39m
|
|
42
40
|
[32mESM[39m [1mdist\adapters\tier-1\index.js [22m[32m412.00 B[39m
|
|
43
|
-
[32mESM[39m [1mdist\
|
|
44
|
-
[32mESM[39m [1mdist\adapters\tier-
|
|
45
|
-
[32mESM[39m [1mdist\chunk-QH3LOWXU.js [22m[32m3.96 KB[39m
|
|
41
|
+
[32mESM[39m [1mdist\adapters\tier-2\preact.js [22m[32m126.00 B[39m
|
|
42
|
+
[32mESM[39m [1mdist\adapters\tier-3\stimulus.js [22m[32m160.00 B[39m
|
|
46
43
|
[32mESM[39m [1mdist\adapters\tier-1\solid.js [22m[32m123.00 B[39m
|
|
44
|
+
[32mESM[39m [1mdist\adapters\tier-3\vanilla.js [22m[32m167.00 B[39m
|
|
45
|
+
[32mESM[39m [1mdist\adapters\tier-1\react.js [22m[32m123.00 B[39m
|
|
47
46
|
[32mESM[39m [1mdist\chunk-3D4XMIZI.js [22m[32m3.82 KB[39m
|
|
47
|
+
[32mESM[39m [1mdist\index.js [22m[32m2.47 KB[39m
|
|
48
|
+
[32mESM[39m [1mdist\chunk-QH3LOWXU.js [22m[32m3.96 KB[39m
|
|
48
49
|
[32mESM[39m [1mdist\adapters\tier-1\svelte.js [22m[32m126.00 B[39m
|
|
49
|
-
[32mESM[39m [1mdist\chunk-
|
|
50
|
-
[32mESM[39m [1mdist\chunk-VK7ZPMO7.js [22m[32m6.50 KB[39m
|
|
50
|
+
[32mESM[39m [1mdist\chunk-XTDK7ME5.js [22m[32m10.12 KB[39m
|
|
51
51
|
[32mESM[39m [1mdist\chunk-64JZJ7OK.js [22m[32m3.82 KB[39m
|
|
52
|
+
[32mESM[39m [1mdist\chunk-VK7ZPMO7.js [22m[32m6.50 KB[39m
|
|
53
|
+
[32mESM[39m [1mdist\chunk-NTASPOHG.js [22m[32m2.95 KB[39m
|
|
52
54
|
[32mESM[39m [1mdist\chunk-X6CNUW6T.js [22m[32m3.56 KB[39m
|
|
53
55
|
[32mESM[39m [1mdist\chunk-2SNQ6PTM.js [22m[32m5.54 KB[39m
|
|
54
|
-
[32mESM[39m
|
|
55
|
-
[
|
|
56
|
-
[34mDTS[39m Build start
|
|
57
|
-
[32mDTS[39m ⚡️ Build success in 19743ms
|
|
56
|
+
[32mESM[39m ⚡️ Build success in 986ms
|
|
57
|
+
[32mDTS[39m ⚡️ Build success in 13519ms
|
|
58
58
|
[32mDTS[39m [1mdist\adapters\tier-1\index.d.ts [22m[32m548.00 B[39m
|
|
59
59
|
[32mDTS[39m [1mdist\adapters\tier-2\index.d.ts [22m[32m563.00 B[39m
|
|
60
60
|
[32mDTS[39m [1mdist\adapters\tier-3\index.d.ts [22m[32m806.00 B[39m
|
package/README.md
CHANGED
|
@@ -1,11 +1,11 @@
|
|
|
1
|
-
# @
|
|
1
|
+
# @flightdev/ui
|
|
2
2
|
|
|
3
3
|
Headless UI components for Flight Framework. Accessible, unstyled primitives for building design systems.
|
|
4
4
|
|
|
5
5
|
## Installation
|
|
6
6
|
|
|
7
7
|
```bash
|
|
8
|
-
npm install @
|
|
8
|
+
npm install @flightdev/ui
|
|
9
9
|
```
|
|
10
10
|
|
|
11
11
|
## Components
|
|
@@ -13,7 +13,7 @@ npm install @flight-framework/ui
|
|
|
13
13
|
### Dialog (Modal)
|
|
14
14
|
|
|
15
15
|
```tsx
|
|
16
|
-
import { Dialog, DialogTrigger, DialogContent, DialogTitle } from '@
|
|
16
|
+
import { Dialog, DialogTrigger, DialogContent, DialogTitle } from '@flightdev/ui/react';
|
|
17
17
|
|
|
18
18
|
function App() {
|
|
19
19
|
return (
|
|
@@ -31,7 +31,7 @@ function App() {
|
|
|
31
31
|
### Dropdown Menu
|
|
32
32
|
|
|
33
33
|
```tsx
|
|
34
|
-
import { Menu, MenuTrigger, MenuContent, MenuItem } from '@
|
|
34
|
+
import { Menu, MenuTrigger, MenuContent, MenuItem } from '@flightdev/ui/react';
|
|
35
35
|
|
|
36
36
|
function App() {
|
|
37
37
|
return (
|
|
@@ -49,7 +49,7 @@ function App() {
|
|
|
49
49
|
### Tabs
|
|
50
50
|
|
|
51
51
|
```tsx
|
|
52
|
-
import { Tabs, TabList, Tab, TabPanel } from '@
|
|
52
|
+
import { Tabs, TabList, Tab, TabPanel } from '@flightdev/ui/react';
|
|
53
53
|
|
|
54
54
|
function App() {
|
|
55
55
|
return (
|
package/TESTING.md
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
# @
|
|
1
|
+
# @flightdev/ui Testing Guide
|
|
2
2
|
|
|
3
3
|
This document describes how to run tests, add new tests, and maintain coverage for the UI package.
|
|
4
4
|
|
|
@@ -6,16 +6,16 @@ This document describes how to run tests, add new tests, and maintain coverage f
|
|
|
6
6
|
|
|
7
7
|
```bash
|
|
8
8
|
# Run all tests
|
|
9
|
-
pnpm --filter @
|
|
9
|
+
pnpm --filter @flightdev/ui test
|
|
10
10
|
|
|
11
11
|
# Run with coverage
|
|
12
|
-
pnpm --filter @
|
|
12
|
+
pnpm --filter @flightdev/ui test:coverage
|
|
13
13
|
|
|
14
14
|
# Run specific test file
|
|
15
|
-
pnpm --filter @
|
|
15
|
+
pnpm --filter @flightdev/ui test -- --testPathPattern="react"
|
|
16
16
|
|
|
17
17
|
# Watch mode (development)
|
|
18
|
-
pnpm --filter @
|
|
18
|
+
pnpm --filter @flightdev/ui test:watch
|
|
19
19
|
```
|
|
20
20
|
|
|
21
21
|
## Test Structure
|
package/docs/ADAPTERS.md
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
# UI Adapter System
|
|
2
2
|
|
|
3
|
-
This document provides comprehensive documentation for the `@
|
|
3
|
+
This document provides comprehensive documentation for the `@flightdev/ui` adapter system, including tier classifications, implementation patterns, and enterprise usage examples.
|
|
4
4
|
|
|
5
5
|
## Table of Contents
|
|
6
6
|
|
|
@@ -31,8 +31,8 @@ The Flight UI adapter system provides a unified interface for rendering componen
|
|
|
31
31
|
### Quick Start
|
|
32
32
|
|
|
33
33
|
```typescript
|
|
34
|
-
import { defineUI } from '@
|
|
35
|
-
import { react } from '@
|
|
34
|
+
import { defineUI } from '@flightdev/ui';
|
|
35
|
+
import { react } from '@flightdev/ui/react';
|
|
36
36
|
|
|
37
37
|
export default defineUI(react({
|
|
38
38
|
streaming: true,
|
|
@@ -91,8 +91,8 @@ Full-featured React 18+ SSR adapter with streaming and hydration support.
|
|
|
91
91
|
**Basic Usage**:
|
|
92
92
|
|
|
93
93
|
```typescript
|
|
94
|
-
import { defineUI } from '@
|
|
95
|
-
import { react } from '@
|
|
94
|
+
import { defineUI } from '@flightdev/ui';
|
|
95
|
+
import { react } from '@flightdev/ui/react';
|
|
96
96
|
|
|
97
97
|
export default defineUI(react());
|
|
98
98
|
```
|
|
@@ -100,7 +100,7 @@ export default defineUI(react());
|
|
|
100
100
|
**With Options**:
|
|
101
101
|
|
|
102
102
|
```typescript
|
|
103
|
-
import { react } from '@
|
|
103
|
+
import { react } from '@flightdev/ui/react';
|
|
104
104
|
|
|
105
105
|
const adapter = react({
|
|
106
106
|
streaming: true,
|
|
@@ -117,7 +117,7 @@ const adapter = react({
|
|
|
117
117
|
**Streaming SSR Example**:
|
|
118
118
|
|
|
119
119
|
```typescript
|
|
120
|
-
import { react } from '@
|
|
120
|
+
import { react } from '@flightdev/ui/react';
|
|
121
121
|
|
|
122
122
|
const adapter = react();
|
|
123
123
|
|
|
@@ -194,7 +194,7 @@ Vue 3 SSR adapter with streaming and islands support.
|
|
|
194
194
|
**Basic Usage**:
|
|
195
195
|
|
|
196
196
|
```typescript
|
|
197
|
-
import { vue } from '@
|
|
197
|
+
import { vue } from '@flightdev/ui/vue';
|
|
198
198
|
|
|
199
199
|
const adapter = vue({
|
|
200
200
|
streaming: true,
|
|
@@ -204,7 +204,7 @@ const adapter = vue({
|
|
|
204
204
|
**SSR Example**:
|
|
205
205
|
|
|
206
206
|
```typescript
|
|
207
|
-
import { vue } from '@
|
|
207
|
+
import { vue } from '@flightdev/ui/vue';
|
|
208
208
|
import App from './App.vue';
|
|
209
209
|
|
|
210
210
|
const adapter = vue();
|
|
@@ -223,7 +223,7 @@ const result = await adapter.renderToString({
|
|
|
223
223
|
Solid SSR adapter with streaming support.
|
|
224
224
|
|
|
225
225
|
```typescript
|
|
226
|
-
import { solid } from '@
|
|
226
|
+
import { solid } from '@flightdev/ui/solid';
|
|
227
227
|
|
|
228
228
|
const adapter = solid({
|
|
229
229
|
streaming: true,
|
|
@@ -243,7 +243,7 @@ Qwik adapter with resumable hydration support.
|
|
|
243
243
|
**Resumability**: Qwik serializes component state to HTML, enabling zero-JS-until-interaction. This is the only Tier 1 adapter with `resumable: true`.
|
|
244
244
|
|
|
245
245
|
```typescript
|
|
246
|
-
import { qwik } from '@
|
|
246
|
+
import { qwik } from '@flightdev/ui/qwik';
|
|
247
247
|
|
|
248
248
|
const adapter = qwik();
|
|
249
249
|
|
|
@@ -279,7 +279,7 @@ Tier 2 adapters provide SSR and hydration with framework-specific optimizations.
|
|
|
279
279
|
Lightweight React alternative with smaller bundle size.
|
|
280
280
|
|
|
281
281
|
```typescript
|
|
282
|
-
import { preact } from '@
|
|
282
|
+
import { preact } from '@flightdev/ui/preact';
|
|
283
283
|
|
|
284
284
|
const adapter = preact();
|
|
285
285
|
|
|
@@ -294,7 +294,7 @@ const result = await adapter.renderToString({
|
|
|
294
294
|
Web Components SSR with declarative hydration.
|
|
295
295
|
|
|
296
296
|
```typescript
|
|
297
|
-
import { lit } from '@
|
|
297
|
+
import { lit } from '@flightdev/ui/lit';
|
|
298
298
|
|
|
299
299
|
const adapter = lit();
|
|
300
300
|
|
|
@@ -310,7 +310,7 @@ const result = await adapter.renderToString({
|
|
|
310
310
|
Streaming SSR with progressive enhancement.
|
|
311
311
|
|
|
312
312
|
```typescript
|
|
313
|
-
import { marko } from '@
|
|
313
|
+
import { marko } from '@flightdev/ui/marko';
|
|
314
314
|
|
|
315
315
|
const adapter = marko();
|
|
316
316
|
|
|
@@ -345,7 +345,7 @@ Server-driven UI with HTML over the wire.
|
|
|
345
345
|
**Basic Usage**:
|
|
346
346
|
|
|
347
347
|
```typescript
|
|
348
|
-
import { htmx } from '@
|
|
348
|
+
import { htmx } from '@flightdev/ui/htmx';
|
|
349
349
|
|
|
350
350
|
const adapter = htmx({
|
|
351
351
|
version: '2.0.2',
|
|
@@ -356,7 +356,7 @@ const adapter = htmx({
|
|
|
356
356
|
**Template Helpers**:
|
|
357
357
|
|
|
358
358
|
```typescript
|
|
359
|
-
import { htmx, hxGet, hxPost, hx, attrsToString } from '@
|
|
359
|
+
import { htmx, hxGet, hxPost, hx, attrsToString } from '@flightdev/ui/htmx';
|
|
360
360
|
|
|
361
361
|
// Create hx-get attributes
|
|
362
362
|
const loadMoreAttrs = hxGet('/api/items?page=2', {
|
|
@@ -420,7 +420,7 @@ function renderPage(items) {
|
|
|
420
420
|
Declarative reactivity sprinkled on HTML.
|
|
421
421
|
|
|
422
422
|
```typescript
|
|
423
|
-
import { alpine, xData } from '@
|
|
423
|
+
import { alpine, xData } from '@flightdev/ui/alpine';
|
|
424
424
|
|
|
425
425
|
const adapter = alpine({
|
|
426
426
|
plugins: ['intersect', 'persist'],
|
|
@@ -440,7 +440,7 @@ const counter = xData({ count: 0 }, `
|
|
|
440
440
|
Turbo + Stimulus for server-rendered applications.
|
|
441
441
|
|
|
442
442
|
```typescript
|
|
443
|
-
import { hotwire } from '@
|
|
443
|
+
import { hotwire } from '@flightdev/ui/hotwire';
|
|
444
444
|
|
|
445
445
|
const adapter = hotwire({
|
|
446
446
|
turbo: true,
|
|
@@ -457,7 +457,7 @@ const adapter = hotwire({
|
|
|
457
457
|
Render different parts of your application with different frameworks.
|
|
458
458
|
|
|
459
459
|
```typescript
|
|
460
|
-
import { adapterRegistry, registerBuiltinAdapters } from '@
|
|
460
|
+
import { adapterRegistry, registerBuiltinAdapters } from '@flightdev/ui';
|
|
461
461
|
|
|
462
462
|
registerBuiltinAdapters();
|
|
463
463
|
|
|
@@ -499,8 +499,8 @@ async function renderPage(request) {
|
|
|
499
499
|
Start with HTML, enhance with JavaScript where needed.
|
|
500
500
|
|
|
501
501
|
```typescript
|
|
502
|
-
import { htmx } from '@
|
|
503
|
-
import { react } from '@
|
|
502
|
+
import { htmx } from '@flightdev/ui/htmx';
|
|
503
|
+
import { react } from '@flightdev/ui/react';
|
|
504
504
|
|
|
505
505
|
// Render base page with HTMX
|
|
506
506
|
const htmxAdapter = htmx();
|
|
@@ -534,7 +534,7 @@ const basePage = await htmxAdapter.renderToString({
|
|
|
534
534
|
Select adapters based on required capabilities.
|
|
535
535
|
|
|
536
536
|
```typescript
|
|
537
|
-
import { adapterRegistry, registerBuiltinAdapters } from '@
|
|
537
|
+
import { adapterRegistry, registerBuiltinAdapters } from '@flightdev/ui';
|
|
538
538
|
|
|
539
539
|
registerBuiltinAdapters();
|
|
540
540
|
|
|
@@ -570,7 +570,7 @@ const adapter = await adapterRegistry.get(adapterId);
|
|
|
570
570
|
Handle errors gracefully during streaming SSR.
|
|
571
571
|
|
|
572
572
|
```typescript
|
|
573
|
-
import { react } from '@
|
|
573
|
+
import { react } from '@flightdev/ui/react';
|
|
574
574
|
|
|
575
575
|
const adapter = react();
|
|
576
576
|
|
|
@@ -601,7 +601,7 @@ const { stream, done, abort } = adapter.renderToStream(
|
|
|
601
601
|
Cache rendered HTML for frequently accessed pages.
|
|
602
602
|
|
|
603
603
|
```typescript
|
|
604
|
-
import { react } from '@
|
|
604
|
+
import { react } from '@flightdev/ui/react';
|
|
605
605
|
|
|
606
606
|
const adapter = react();
|
|
607
607
|
const cache = new Map();
|
|
@@ -643,13 +643,13 @@ Extend `BaseUIAdapter` to create custom framework adapters.
|
|
|
643
643
|
### Minimal Implementation
|
|
644
644
|
|
|
645
645
|
```typescript
|
|
646
|
-
import { BaseUIAdapter } from '@
|
|
646
|
+
import { BaseUIAdapter } from '@flightdev/ui/core';
|
|
647
647
|
import type {
|
|
648
648
|
Component,
|
|
649
649
|
RenderResult,
|
|
650
650
|
RenderContext,
|
|
651
651
|
AdapterCapabilities
|
|
652
|
-
} from '@
|
|
652
|
+
} from '@flightdev/ui/core/types';
|
|
653
653
|
|
|
654
654
|
export class MyFrameworkAdapter extends BaseUIAdapter {
|
|
655
655
|
readonly id = 'my-framework';
|
|
@@ -716,7 +716,7 @@ export function myFramework(): MyFrameworkAdapter {
|
|
|
716
716
|
### Adding Streaming Support
|
|
717
717
|
|
|
718
718
|
```typescript
|
|
719
|
-
import { StreamingRenderResult, StreamingOptions } from '@
|
|
719
|
+
import { StreamingRenderResult, StreamingOptions } from '@flightdev/ui/core/types';
|
|
720
720
|
|
|
721
721
|
export class MyStreamingAdapter extends BaseUIAdapter {
|
|
722
722
|
// ... base implementation ...
|
|
@@ -774,7 +774,7 @@ export class MyStreamingAdapter extends BaseUIAdapter {
|
|
|
774
774
|
### Registering Custom Adapters
|
|
775
775
|
|
|
776
776
|
```typescript
|
|
777
|
-
import { adapterRegistry } from '@
|
|
777
|
+
import { adapterRegistry } from '@flightdev/ui';
|
|
778
778
|
import { myFramework } from './my-framework-adapter';
|
|
779
779
|
|
|
780
780
|
// Register your adapter
|
|
@@ -821,8 +821,8 @@ const adapter = await adapterRegistry.get('my-framework');
|
|
|
821
821
|
### From React to Preact
|
|
822
822
|
|
|
823
823
|
```diff
|
|
824
|
-
- import { react } from '@
|
|
825
|
-
+ import { preact } from '@
|
|
824
|
+
- import { react } from '@flightdev/ui/react';
|
|
825
|
+
+ import { preact } from '@flightdev/ui/preact';
|
|
826
826
|
|
|
827
827
|
- export default defineUI(react());
|
|
828
828
|
+ export default defineUI(preact());
|
|
@@ -838,8 +838,8 @@ Component compatibility: Most React components work in Preact. Check for:
|
|
|
838
838
|
Both have similar reactivity models but different syntax.
|
|
839
839
|
|
|
840
840
|
```diff
|
|
841
|
-
- import { vue } from '@
|
|
842
|
-
+ import { svelte } from '@
|
|
841
|
+
- import { vue } from '@flightdev/ui/vue';
|
|
842
|
+
+ import { svelte } from '@flightdev/ui/svelte';
|
|
843
843
|
|
|
844
844
|
- export default defineUI(vue());
|
|
845
845
|
+ export default defineUI(svelte());
|
package/docs/PATTERNS.md
CHANGED
|
@@ -22,7 +22,7 @@ Use different adapters for different sections of your application.
|
|
|
22
22
|
|
|
23
23
|
```typescript
|
|
24
24
|
// flight.config.ts
|
|
25
|
-
import { defineConfig } from '@
|
|
25
|
+
import { defineConfig } from '@flightdev/core';
|
|
26
26
|
|
|
27
27
|
export default defineConfig({
|
|
28
28
|
ui: {
|
|
@@ -42,7 +42,7 @@ export default defineConfig({
|
|
|
42
42
|
**Implementation**:
|
|
43
43
|
|
|
44
44
|
```typescript
|
|
45
|
-
import { adapterRegistry, registerBuiltinAdapters } from '@
|
|
45
|
+
import { adapterRegistry, registerBuiltinAdapters } from '@flightdev/ui';
|
|
46
46
|
|
|
47
47
|
registerBuiltinAdapters();
|
|
48
48
|
|
|
@@ -73,8 +73,8 @@ class RouterWithAdapters {
|
|
|
73
73
|
Each client type gets optimized responses.
|
|
74
74
|
|
|
75
75
|
```typescript
|
|
76
|
-
import { react } from '@
|
|
77
|
-
import { htmx } from '@
|
|
76
|
+
import { react } from '@flightdev/ui/react';
|
|
77
|
+
import { htmx } from '@flightdev/ui/htmx';
|
|
78
78
|
|
|
79
79
|
async function handleRequest(request: Request) {
|
|
80
80
|
const userAgent = request.headers.get('User-Agent') || '';
|
|
@@ -97,7 +97,7 @@ async function handleRequest(request: Request) {
|
|
|
97
97
|
Minimize JavaScript while maintaining interactivity.
|
|
98
98
|
|
|
99
99
|
```typescript
|
|
100
|
-
import { react } from '@
|
|
100
|
+
import { react } from '@flightdev/ui/react';
|
|
101
101
|
|
|
102
102
|
const adapter = react();
|
|
103
103
|
|
|
@@ -164,7 +164,7 @@ function renderArticle(article) {
|
|
|
164
164
|
Handle errors at different levels during streaming SSR.
|
|
165
165
|
|
|
166
166
|
```typescript
|
|
167
|
-
import { react } from '@
|
|
167
|
+
import { react } from '@flightdev/ui/react';
|
|
168
168
|
|
|
169
169
|
const adapter = react();
|
|
170
170
|
|
|
@@ -301,9 +301,9 @@ Load adapters only when needed.
|
|
|
301
301
|
|
|
302
302
|
```typescript
|
|
303
303
|
const adapterLoaders = {
|
|
304
|
-
react: () => import('@
|
|
305
|
-
vue: () => import('@
|
|
306
|
-
htmx: () => import('@
|
|
304
|
+
react: () => import('@flightdev/ui/react'),
|
|
305
|
+
vue: () => import('@flightdev/ui/vue'),
|
|
306
|
+
htmx: () => import('@flightdev/ui/htmx'),
|
|
307
307
|
};
|
|
308
308
|
|
|
309
309
|
class LazyAdapterRegistry {
|
|
@@ -718,7 +718,7 @@ async function safeRender(adapter: UIAdapterV2, props: unknown) {
|
|
|
718
718
|
|
|
719
719
|
```typescript
|
|
720
720
|
import { describe, it, expect } from 'vitest';
|
|
721
|
-
import { react } from '@
|
|
721
|
+
import { react } from '@flightdev/ui/react';
|
|
722
722
|
|
|
723
723
|
describe('React Adapter', () => {
|
|
724
724
|
it('renders component to string', async () => {
|
|
@@ -751,7 +751,7 @@ describe('React Adapter', () => {
|
|
|
751
751
|
|
|
752
752
|
```typescript
|
|
753
753
|
import { describe, it, expect, beforeAll } from 'vitest';
|
|
754
|
-
import { adapterRegistry, registerBuiltinAdapters } from '@
|
|
754
|
+
import { adapterRegistry, registerBuiltinAdapters } from '@flightdev/ui';
|
|
755
755
|
|
|
756
756
|
describe('SSR Integration', () => {
|
|
757
757
|
beforeAll(() => {
|
|
@@ -797,7 +797,7 @@ describe('SSR Integration', () => {
|
|
|
797
797
|
|
|
798
798
|
```typescript
|
|
799
799
|
import { describe, it, expect } from 'vitest';
|
|
800
|
-
import { react } from '@
|
|
800
|
+
import { react } from '@flightdev/ui/react';
|
|
801
801
|
|
|
802
802
|
describe('Performance', () => {
|
|
803
803
|
it('renders within acceptable time', async () => {
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@flightdev/ui",
|
|
3
|
-
"version": "2.0.
|
|
3
|
+
"version": "2.0.1",
|
|
4
4
|
"description": "Flight Universal UI Adapters - SSR/hydration for 18+ frameworks: React, Vue, Angular, Svelte, Solid, Qwik, Marko, Lit, HTMX, Alpine.js, Stencil, and more",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"main": "./dist/index.js",
|
|
@@ -217,6 +217,12 @@
|
|
|
217
217
|
"engines": {
|
|
218
218
|
"node": ">=20.0.0"
|
|
219
219
|
},
|
|
220
|
+
"homepage": "https://github.com/EliosLT/FlightDev",
|
|
221
|
+
"repository": {
|
|
222
|
+
"url": "https://github.com/EliosLT/FlightDev.git",
|
|
223
|
+
"directory": "packages/ui",
|
|
224
|
+
"type": "git"
|
|
225
|
+
},
|
|
220
226
|
"scripts": {
|
|
221
227
|
"build": "tsup",
|
|
222
228
|
"dev": "tsup --watch",
|