@flightdev/ui 2.0.0 → 4.0.0
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 +285 -70
- package/dist/{chunk-XTDK7ME5.js → chunk-S4DTUQII.js} +246 -19
- package/dist/chunk-S4DTUQII.js.map +1 -0
- package/dist/core/index.d.ts +423 -3
- package/dist/core/index.js +23 -2
- package/dist/core/index.js.map +1 -0
- package/dist/index.d.ts +2 -3
- package/dist/index.js +29 -5
- package/dist/index.js.map +1 -0
- package/package.json +11 -181
- package/.turbo/turbo-build.log +0 -81
- package/.turbo/turbo-lint.log +0 -40
- package/.turbo/turbo-typecheck.log +0 -4
- package/TESTING.md +0 -124
- package/dist/adapter-MMD-iHNx.d.ts +0 -424
- package/dist/adapters/tier-1/angular.d.ts +0 -60
- package/dist/adapters/tier-1/angular.js +0 -2
- package/dist/adapters/tier-1/index.d.ts +0 -7
- package/dist/adapters/tier-1/index.js +0 -7
- package/dist/adapters/tier-1/qwik.d.ts +0 -55
- package/dist/adapters/tier-1/qwik.js +0 -2
- package/dist/adapters/tier-1/react.d.ts +0 -67
- package/dist/adapters/tier-1/react.js +0 -2
- package/dist/adapters/tier-1/solid.d.ts +0 -45
- package/dist/adapters/tier-1/solid.js +0 -2
- package/dist/adapters/tier-1/svelte.d.ts +0 -48
- package/dist/adapters/tier-1/svelte.js +0 -2
- package/dist/adapters/tier-1/vue.d.ts +0 -47
- package/dist/adapters/tier-1/vue.js +0 -2
- package/dist/adapters/tier-2/index.d.ts +0 -7
- package/dist/adapters/tier-2/index.js +0 -7
- package/dist/adapters/tier-2/inferno.d.ts +0 -31
- package/dist/adapters/tier-2/inferno.js +0 -2
- package/dist/adapters/tier-2/lit.d.ts +0 -34
- package/dist/adapters/tier-2/lit.js +0 -2
- package/dist/adapters/tier-2/marko.d.ts +0 -59
- package/dist/adapters/tier-2/marko.js +0 -2
- package/dist/adapters/tier-2/mithril.d.ts +0 -31
- package/dist/adapters/tier-2/mithril.js +0 -2
- package/dist/adapters/tier-2/preact.d.ts +0 -33
- package/dist/adapters/tier-2/preact.js +0 -2
- package/dist/adapters/tier-2/stencil.d.ts +0 -52
- package/dist/adapters/tier-2/stencil.js +0 -2
- package/dist/adapters/tier-3/alpine.d.ts +0 -73
- package/dist/adapters/tier-3/alpine.js +0 -2
- package/dist/adapters/tier-3/hotwire.d.ts +0 -71
- package/dist/adapters/tier-3/hotwire.js +0 -2
- package/dist/adapters/tier-3/htmx.d.ts +0 -88
- package/dist/adapters/tier-3/htmx.js +0 -2
- package/dist/adapters/tier-3/index.d.ts +0 -7
- package/dist/adapters/tier-3/index.js +0 -7
- package/dist/adapters/tier-3/petite-vue.d.ts +0 -56
- package/dist/adapters/tier-3/petite-vue.js +0 -2
- package/dist/adapters/tier-3/stimulus.d.ts +0 -63
- package/dist/adapters/tier-3/stimulus.js +0 -2
- package/dist/adapters/tier-3/vanilla.d.ts +0 -63
- package/dist/adapters/tier-3/vanilla.js +0 -2
- package/dist/chunk-2SNQ6PTM.js +0 -217
- package/dist/chunk-3D4XMIZI.js +0 -136
- package/dist/chunk-3HU6GSQ4.js +0 -125
- package/dist/chunk-4PZDNFL7.js +0 -148
- package/dist/chunk-5IBLFTYL.js +0 -114
- package/dist/chunk-64JZJ7OK.js +0 -142
- package/dist/chunk-7ZJI3QU2.js +0 -132
- package/dist/chunk-CE4FJHQJ.js +0 -133
- package/dist/chunk-DTCAUBH5.js +0 -87
- package/dist/chunk-NTASPOHG.js +0 -106
- package/dist/chunk-OI2AMQLG.js +0 -152
- package/dist/chunk-Q7HUE44H.js +0 -106
- package/dist/chunk-QH3LOWXU.js +0 -155
- package/dist/chunk-QIVAK6BH.js +0 -103
- package/dist/chunk-V34XPVGK.js +0 -103
- package/dist/chunk-VK7ZPMO7.js +0 -221
- package/dist/chunk-X6CNUW6T.js +0 -136
- package/dist/chunk-YFGSHW5S.js +0 -121
- package/dist/chunk-ZAJVSE7J.js +0 -90
- package/docs/ADAPTERS.md +0 -946
- package/docs/PATTERNS.md +0 -836
- package/src/adapters/tier-1/angular.ts +0 -223
- package/src/adapters/tier-1/index.ts +0 -12
- package/src/adapters/tier-1/qwik.ts +0 -177
- package/src/adapters/tier-1/react.ts +0 -330
- package/src/adapters/tier-1/solid.ts +0 -222
- package/src/adapters/tier-1/svelte.ts +0 -211
- package/src/adapters/tier-1/vue.ts +0 -234
- package/src/adapters/tier-2/index.ts +0 -12
- package/src/adapters/tier-2/inferno.ts +0 -149
- package/src/adapters/tier-2/lit.ts +0 -191
- package/src/adapters/tier-2/marko.ts +0 -199
- package/src/adapters/tier-2/mithril.ts +0 -152
- package/src/adapters/tier-2/preact.ts +0 -133
- package/src/adapters/tier-2/stencil.ts +0 -214
- package/src/adapters/tier-3/alpine.ts +0 -218
- package/src/adapters/tier-3/hotwire.ts +0 -254
- package/src/adapters/tier-3/htmx.ts +0 -263
- package/src/adapters/tier-3/index.ts +0 -12
- package/src/adapters/tier-3/petite-vue.ts +0 -163
- package/src/adapters/tier-3/stimulus.ts +0 -233
- package/src/adapters/tier-3/vanilla.ts +0 -252
- package/src/ambient.d.ts +0 -310
- package/src/core/adapter.ts +0 -366
- package/src/core/index.ts +0 -56
- package/src/core/registry.ts +0 -518
- package/src/core/types.ts +0 -461
- package/src/htmx.ts +0 -134
- package/src/index.ts +0 -263
- package/test/__mocks__/stencil-core.ts +0 -19
- package/test/__mocks__/stencil-hydrate.ts +0 -15
- package/test/adapters/tier-1.test.ts +0 -206
- package/test/adapters/tier-2.test.ts +0 -175
- package/test/adapters/tier-3.test.ts +0 -284
- package/test/contracts/adapter.contract.ts +0 -293
- package/test/core/core.test.ts +0 -310
- package/test/errors/error-handling.test.ts +0 -454
- package/test/integration/htmx.integration.test.ts +0 -246
- package/test/integration/react.integration.test.ts +0 -271
- package/test/integration/registry.integration.test.ts +0 -308
- package/tsconfig.json +0 -22
- package/tsup.config.ts +0 -93
- package/vitest.config.ts +0 -101
package/dist/core/index.d.ts
CHANGED
|
@@ -1,5 +1,425 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
1
|
+
/**
|
|
2
|
+
* @flightdev/ui - Core Type Definitions
|
|
3
|
+
*
|
|
4
|
+
* Universal type system for all UI framework adapters.
|
|
5
|
+
* Supports SSR, streaming, islands architecture, and resumable hydration.
|
|
6
|
+
*
|
|
7
|
+
* @module @flightdev/ui/core/types
|
|
8
|
+
* @version 2.0.0
|
|
9
|
+
*/
|
|
10
|
+
/**
|
|
11
|
+
* Adapter capabilities flags.
|
|
12
|
+
* Used for feature detection and optimization decisions.
|
|
13
|
+
*/
|
|
14
|
+
interface AdapterCapabilities {
|
|
15
|
+
/** Supports streaming SSR via renderToStream */
|
|
16
|
+
streaming: boolean;
|
|
17
|
+
/** Supports partial/selective hydration */
|
|
18
|
+
partialHydration: boolean;
|
|
19
|
+
/** Supports islands architecture */
|
|
20
|
+
islands: boolean;
|
|
21
|
+
/** Supports resumable hydration (Qwik-style serialization) */
|
|
22
|
+
resumable: boolean;
|
|
23
|
+
/** Supports Static Site Generation */
|
|
24
|
+
ssg: boolean;
|
|
25
|
+
/** Supports Client-Side Rendering only */
|
|
26
|
+
csr: boolean;
|
|
27
|
+
/** Supports Server Components (React Server Components, etc) */
|
|
28
|
+
serverComponents: boolean;
|
|
29
|
+
}
|
|
30
|
+
/**
|
|
31
|
+
* Default capabilities for adapters that don't specify their own
|
|
32
|
+
*/
|
|
33
|
+
declare const DEFAULT_CAPABILITIES: AdapterCapabilities;
|
|
34
|
+
/**
|
|
35
|
+
* Adapter tier classification.
|
|
36
|
+
*
|
|
37
|
+
* - tier-1: Full support, first-class citizens (React, Vue, Angular, Svelte, Solid, Qwik)
|
|
38
|
+
* - tier-2: SSR + Hydration support (Preact, Lit, Marko, Stencil, Mithril, Inferno)
|
|
39
|
+
* - tier-3: HTML-first, minimal JS (HTMX, Alpine, Hotwire, Stimulus, Web Components)
|
|
40
|
+
*/
|
|
41
|
+
type AdapterTier = 'tier-1' | 'tier-2' | 'tier-3';
|
|
42
|
+
/**
|
|
43
|
+
* Tier metadata for documentation and tooling
|
|
44
|
+
*/
|
|
45
|
+
interface TierInfo {
|
|
46
|
+
tier: AdapterTier;
|
|
47
|
+
name: string;
|
|
48
|
+
description: string;
|
|
49
|
+
features: string[];
|
|
50
|
+
}
|
|
51
|
+
declare const TIER_INFO: Record<AdapterTier, TierInfo>;
|
|
52
|
+
/**
|
|
53
|
+
* Universal component wrapper type
|
|
54
|
+
*/
|
|
55
|
+
interface Component<P = Record<string, unknown>> {
|
|
56
|
+
/** The actual component (React element, Vue component, HTML string, etc) */
|
|
57
|
+
component: unknown;
|
|
58
|
+
/** Props to pass to the component */
|
|
59
|
+
props?: P;
|
|
60
|
+
/** Slots/children content */
|
|
61
|
+
children?: unknown;
|
|
62
|
+
/** Component identifier for hydration */
|
|
63
|
+
id?: string;
|
|
64
|
+
}
|
|
65
|
+
/**
|
|
66
|
+
* Render context passed to adapters
|
|
67
|
+
*/
|
|
68
|
+
interface RenderContext {
|
|
69
|
+
/** Current request URL */
|
|
70
|
+
url?: string;
|
|
71
|
+
/** Request headers */
|
|
72
|
+
headers?: Headers;
|
|
73
|
+
/** Server-side cookies */
|
|
74
|
+
cookies?: Map<string, string>;
|
|
75
|
+
/** Locale for i18n */
|
|
76
|
+
locale?: string;
|
|
77
|
+
/** Custom context data */
|
|
78
|
+
data?: Record<string, unknown>;
|
|
79
|
+
/** AbortSignal for cancellation */
|
|
80
|
+
signal?: AbortSignal;
|
|
81
|
+
}
|
|
82
|
+
/**
|
|
83
|
+
* Result of a render operation
|
|
84
|
+
*/
|
|
85
|
+
interface RenderResult {
|
|
86
|
+
/** The rendered HTML string */
|
|
87
|
+
html: string;
|
|
88
|
+
/** Head elements (meta, title, link, etc) */
|
|
89
|
+
head?: string;
|
|
90
|
+
/** Hydration data to pass to client */
|
|
91
|
+
hydrationData?: Record<string, unknown>;
|
|
92
|
+
/** CSS to inline in the document */
|
|
93
|
+
css?: string;
|
|
94
|
+
/** Scripts to inject */
|
|
95
|
+
scripts?: string[];
|
|
96
|
+
/** HTTP status code (for error pages, redirects) */
|
|
97
|
+
status?: number;
|
|
98
|
+
/** HTTP headers to set */
|
|
99
|
+
headers?: Record<string, string>;
|
|
100
|
+
/** Timing information for performance monitoring */
|
|
101
|
+
timing?: RenderTiming;
|
|
102
|
+
}
|
|
103
|
+
/**
|
|
104
|
+
* Render timing information
|
|
105
|
+
*/
|
|
106
|
+
interface RenderTiming {
|
|
107
|
+
/** Total render time in milliseconds */
|
|
108
|
+
total: number;
|
|
109
|
+
/** Time to first byte */
|
|
110
|
+
ttfb?: number;
|
|
111
|
+
/** Component render times */
|
|
112
|
+
components?: Map<string, number>;
|
|
113
|
+
}
|
|
114
|
+
/**
|
|
115
|
+
* Streaming render options
|
|
116
|
+
*/
|
|
117
|
+
interface StreamingOptions {
|
|
118
|
+
/** Emit shell HTML before async content resolves */
|
|
119
|
+
emitShellEarly?: boolean;
|
|
120
|
+
/** Timeout for streaming (ms) */
|
|
121
|
+
timeout?: number;
|
|
122
|
+
/** Callback when shell is ready */
|
|
123
|
+
onShellReady?: () => void;
|
|
124
|
+
/** Callback when shell errors */
|
|
125
|
+
onShellError?: (error: Error) => void;
|
|
126
|
+
/** Callback when all content is ready */
|
|
127
|
+
onAllReady?: () => void;
|
|
128
|
+
/** Callback for each error during streaming */
|
|
129
|
+
onError?: (error: Error, errorInfo?: unknown) => void;
|
|
130
|
+
}
|
|
131
|
+
/**
|
|
132
|
+
* Streaming render result
|
|
133
|
+
*/
|
|
134
|
+
interface StreamingRenderResult {
|
|
135
|
+
/** The readable stream of HTML chunks */
|
|
136
|
+
stream: ReadableStream<Uint8Array>;
|
|
137
|
+
/** Promise that resolves when streaming is complete */
|
|
138
|
+
done: Promise<void>;
|
|
139
|
+
/** Abort the stream */
|
|
140
|
+
abort: () => void;
|
|
141
|
+
}
|
|
142
|
+
/**
|
|
143
|
+
* Island hydration strategy
|
|
144
|
+
*/
|
|
145
|
+
type IslandHydrationStrategy = 'load' | 'idle' | 'visible' | 'media' | 'interaction' | 'none';
|
|
146
|
+
/**
|
|
147
|
+
* Island configuration options
|
|
148
|
+
*/
|
|
149
|
+
interface IslandOptions {
|
|
150
|
+
/** Hydration strategy */
|
|
151
|
+
hydrate?: IslandHydrationStrategy;
|
|
152
|
+
/** For 'media' strategy: the media query */
|
|
153
|
+
media?: string;
|
|
154
|
+
/** For 'interaction' strategy: events to listen for */
|
|
155
|
+
on?: string[];
|
|
156
|
+
/** Island priority (higher = hydrate first) */
|
|
157
|
+
priority?: number;
|
|
158
|
+
/** Fallback content while loading */
|
|
159
|
+
fallback?: string;
|
|
160
|
+
}
|
|
161
|
+
/**
|
|
162
|
+
* Island definition
|
|
163
|
+
*/
|
|
164
|
+
interface Island {
|
|
165
|
+
/** Unique island identifier */
|
|
166
|
+
id: string;
|
|
167
|
+
/** The component to render */
|
|
168
|
+
component: unknown;
|
|
169
|
+
/** Component props */
|
|
170
|
+
props?: Record<string, unknown>;
|
|
171
|
+
/** Island options */
|
|
172
|
+
options?: IslandOptions;
|
|
173
|
+
/** Rendered HTML placeholder */
|
|
174
|
+
placeholder?: string;
|
|
175
|
+
}
|
|
176
|
+
/**
|
|
177
|
+
* Universal UI Adapter Interface (Version 2)
|
|
178
|
+
*
|
|
179
|
+
* All UI framework adapters must implement this interface.
|
|
180
|
+
* Optional methods are for advanced features (streaming, islands, etc).
|
|
181
|
+
*/
|
|
182
|
+
interface UIAdapterV2 {
|
|
183
|
+
/** Unique adapter identifier (e.g., 'react', 'vue', 'angular') */
|
|
184
|
+
readonly id: string;
|
|
185
|
+
/** Human-readable adapter name */
|
|
186
|
+
readonly name: string;
|
|
187
|
+
/** Framework name */
|
|
188
|
+
readonly framework: string;
|
|
189
|
+
/** Framework version compatibility */
|
|
190
|
+
readonly frameworkVersion?: string;
|
|
191
|
+
/** Adapter tier classification */
|
|
192
|
+
readonly tier: AdapterTier;
|
|
193
|
+
/** Supported capabilities */
|
|
194
|
+
readonly capabilities: AdapterCapabilities;
|
|
195
|
+
/**
|
|
196
|
+
* Render a component to an HTML string.
|
|
197
|
+
* This is the primary SSR method.
|
|
198
|
+
*/
|
|
199
|
+
renderToString(component: Component, context?: RenderContext): Promise<RenderResult>;
|
|
200
|
+
/**
|
|
201
|
+
* Generate the hydration script for client-side hydration.
|
|
202
|
+
*/
|
|
203
|
+
getHydrationScript(result: RenderResult): string;
|
|
204
|
+
/**
|
|
205
|
+
* Get the client-side entry point code.
|
|
206
|
+
*/
|
|
207
|
+
getClientEntry(): string;
|
|
208
|
+
/**
|
|
209
|
+
* Render a component as a stream (for streaming SSR).
|
|
210
|
+
* Only available if capabilities.streaming is true.
|
|
211
|
+
*/
|
|
212
|
+
renderToStream?(component: Component, context?: RenderContext, options?: StreamingOptions): StreamingRenderResult;
|
|
213
|
+
/**
|
|
214
|
+
* Create an island wrapper for partial hydration.
|
|
215
|
+
* Only available if capabilities.islands is true.
|
|
216
|
+
*/
|
|
217
|
+
createIsland?(component: unknown, props?: Record<string, unknown>, options?: IslandOptions): Island;
|
|
218
|
+
/**
|
|
219
|
+
* Hydrate an island on the client.
|
|
220
|
+
*/
|
|
221
|
+
hydrateIsland?(element: Element, island: Island): void;
|
|
222
|
+
/**
|
|
223
|
+
* Serialize component state for resumable hydration.
|
|
224
|
+
* Only available if capabilities.resumable is true.
|
|
225
|
+
*/
|
|
226
|
+
serializeState?(state: unknown): string;
|
|
227
|
+
/**
|
|
228
|
+
* Resume from serialized state.
|
|
229
|
+
*/
|
|
230
|
+
resumeFromState?(serialized: string): unknown;
|
|
231
|
+
/**
|
|
232
|
+
* Initialize the adapter (load dependencies, warm up caches, etc).
|
|
233
|
+
*/
|
|
234
|
+
init?(): Promise<void>;
|
|
235
|
+
/**
|
|
236
|
+
* Clean up resources.
|
|
237
|
+
*/
|
|
238
|
+
dispose?(): Promise<void>;
|
|
239
|
+
/**
|
|
240
|
+
* Transform a component for SSR if needed.
|
|
241
|
+
*/
|
|
242
|
+
transformForSSR?(component: unknown): unknown;
|
|
243
|
+
}
|
|
244
|
+
/**
|
|
245
|
+
* Legacy V1 adapter interface for backward compatibility.
|
|
246
|
+
* @deprecated Use UIAdapterV2 instead
|
|
247
|
+
*/
|
|
248
|
+
interface UIAdapterV1 {
|
|
249
|
+
readonly name: string;
|
|
250
|
+
readonly framework: string;
|
|
251
|
+
renderToString(component: Component): Promise<RenderResult>;
|
|
252
|
+
getHydrationScript(result: RenderResult): string;
|
|
253
|
+
getClientEntry(): string;
|
|
254
|
+
transformForSSR?(component: unknown): unknown;
|
|
255
|
+
}
|
|
256
|
+
/**
|
|
257
|
+
* Type alias for backward compatibility
|
|
258
|
+
* @deprecated Use UIAdapterV2 instead
|
|
259
|
+
*/
|
|
260
|
+
type UIAdapter = UIAdapterV1;
|
|
261
|
+
/**
|
|
262
|
+
* UI configuration for Flight
|
|
263
|
+
*/
|
|
264
|
+
interface UIConfig {
|
|
265
|
+
/** The UI adapter to use */
|
|
266
|
+
adapter: UIAdapterV2 | UIAdapterV1;
|
|
267
|
+
/** Enable streaming SSR */
|
|
268
|
+
streaming?: boolean;
|
|
269
|
+
/** Hydration strategy */
|
|
270
|
+
hydration?: 'full' | 'partial' | 'progressive' | 'none';
|
|
271
|
+
/** Islands mode */
|
|
272
|
+
islands?: boolean;
|
|
273
|
+
/** Default island hydration strategy */
|
|
274
|
+
defaultIslandStrategy?: IslandHydrationStrategy;
|
|
275
|
+
}
|
|
276
|
+
/**
|
|
277
|
+
* Extract props type from a component
|
|
278
|
+
*/
|
|
279
|
+
type ComponentProps<C> = C extends Component<infer P> ? P : never;
|
|
280
|
+
/**
|
|
281
|
+
* Check if adapter supports a capability
|
|
282
|
+
*/
|
|
283
|
+
type HasCapability<A extends UIAdapterV2, C extends keyof AdapterCapabilities> = A['capabilities'][C] extends true ? true : false;
|
|
284
|
+
|
|
285
|
+
/**
|
|
286
|
+
* @flightdev/ui - Base Adapter Class
|
|
287
|
+
*
|
|
288
|
+
* Abstract base class providing common functionality for all UI adapters.
|
|
289
|
+
* Extend this class to create new framework adapters.
|
|
290
|
+
*
|
|
291
|
+
* @module @flightdev/ui/core/adapter
|
|
292
|
+
* @version 2.0.0
|
|
293
|
+
*/
|
|
294
|
+
|
|
295
|
+
/**
|
|
296
|
+
* Abstract base class for UI adapters.
|
|
297
|
+
*
|
|
298
|
+
* Provides common functionality and sensible defaults.
|
|
299
|
+
* Subclasses must implement the abstract methods.
|
|
300
|
+
*
|
|
301
|
+
* @example
|
|
302
|
+
* ```typescript
|
|
303
|
+
* class MyAdapter extends BaseUIAdapter {
|
|
304
|
+
* readonly id = 'my-framework';
|
|
305
|
+
* readonly name = 'My Framework';
|
|
306
|
+
* readonly framework = 'my-framework';
|
|
307
|
+
* readonly tier = 'tier-2';
|
|
308
|
+
*
|
|
309
|
+
* async renderToString(component: Component): Promise<RenderResult> {
|
|
310
|
+
* // Implementation
|
|
311
|
+
* }
|
|
312
|
+
* }
|
|
313
|
+
* ```
|
|
314
|
+
*/
|
|
315
|
+
declare abstract class BaseUIAdapter implements UIAdapterV2 {
|
|
316
|
+
abstract readonly id: string;
|
|
317
|
+
abstract readonly name: string;
|
|
318
|
+
abstract readonly framework: string;
|
|
319
|
+
abstract readonly tier: AdapterTier;
|
|
320
|
+
readonly capabilities: AdapterCapabilities;
|
|
321
|
+
readonly frameworkVersion?: string;
|
|
322
|
+
abstract renderToString(component: Component, context?: RenderContext): Promise<RenderResult>;
|
|
323
|
+
/**
|
|
324
|
+
* Generate hydration script.
|
|
325
|
+
* Override for framework-specific hydration.
|
|
326
|
+
*/
|
|
327
|
+
getHydrationScript(result: RenderResult): string;
|
|
328
|
+
/**
|
|
329
|
+
* Get client entry point code.
|
|
330
|
+
* Override for framework-specific client initialization.
|
|
331
|
+
*/
|
|
332
|
+
getClientEntry(): string;
|
|
333
|
+
/**
|
|
334
|
+
* Escape HTML entities to prevent XSS
|
|
335
|
+
*/
|
|
336
|
+
protected escapeHtml(str: string): string;
|
|
337
|
+
/**
|
|
338
|
+
* Serialize props to JSON for hydration
|
|
339
|
+
*/
|
|
340
|
+
protected serializeProps(props: unknown): string;
|
|
341
|
+
/**
|
|
342
|
+
* JSON replacer for serialization
|
|
343
|
+
*/
|
|
344
|
+
protected jsonReplacer(_key: string, value: unknown): unknown;
|
|
345
|
+
/**
|
|
346
|
+
* Create a hydration marker comment
|
|
347
|
+
*/
|
|
348
|
+
protected createHydrationMarker(id: string, type?: 'start' | 'end'): string;
|
|
349
|
+
/**
|
|
350
|
+
* Wrap content with hydration markers
|
|
351
|
+
*/
|
|
352
|
+
protected wrapWithMarkers(id: string, content: string): string;
|
|
353
|
+
/**
|
|
354
|
+
* Generate a unique component ID
|
|
355
|
+
*/
|
|
356
|
+
protected generateId(): string;
|
|
357
|
+
/**
|
|
358
|
+
* Create timing information
|
|
359
|
+
*/
|
|
360
|
+
protected createTiming(startTime: number): {
|
|
361
|
+
total: number;
|
|
362
|
+
};
|
|
363
|
+
/**
|
|
364
|
+
* Merge render context with defaults
|
|
365
|
+
*/
|
|
366
|
+
protected mergeContext(context?: RenderContext): RenderContext;
|
|
367
|
+
/**
|
|
368
|
+
* Render to stream (override if capabilities.streaming is true)
|
|
369
|
+
*/
|
|
370
|
+
renderToStream?(_component: Component, _context?: RenderContext, _options?: StreamingOptions): StreamingRenderResult;
|
|
371
|
+
/**
|
|
372
|
+
* Create an island (default implementation)
|
|
373
|
+
* Override for framework-specific island behavior.
|
|
374
|
+
*/
|
|
375
|
+
createIsland(component: unknown, props?: Record<string, unknown>, options?: IslandOptions): Island;
|
|
376
|
+
/**
|
|
377
|
+
* Hydrate an island on the client
|
|
378
|
+
*/
|
|
379
|
+
hydrateIsland?(_element: Element, _island: Island): void;
|
|
380
|
+
/**
|
|
381
|
+
* Serialize state for resumability
|
|
382
|
+
*/
|
|
383
|
+
serializeState?(state: unknown): string;
|
|
384
|
+
/**
|
|
385
|
+
* Resume from serialized state
|
|
386
|
+
*/
|
|
387
|
+
resumeFromState?(serialized: string): unknown;
|
|
388
|
+
/**
|
|
389
|
+
* JSON reviver for deserialization
|
|
390
|
+
*/
|
|
391
|
+
protected jsonReviver(_key: string, value: unknown): unknown;
|
|
392
|
+
/**
|
|
393
|
+
* Initialize the adapter
|
|
394
|
+
*/
|
|
395
|
+
init(): Promise<void>;
|
|
396
|
+
/**
|
|
397
|
+
* Clean up resources
|
|
398
|
+
*/
|
|
399
|
+
dispose(): Promise<void>;
|
|
400
|
+
}
|
|
401
|
+
/**
|
|
402
|
+
* Wrap a V1 adapter to make it compatible with V2 interface.
|
|
403
|
+
*
|
|
404
|
+
* @example
|
|
405
|
+
* ```typescript
|
|
406
|
+
* const legacyAdapter = oldReact();
|
|
407
|
+
* const v2Adapter = wrapV1Adapter(legacyAdapter, 'tier-1');
|
|
408
|
+
* ```
|
|
409
|
+
*/
|
|
410
|
+
declare function wrapV1Adapter(v1Adapter: UIAdapterV1, tier?: AdapterTier): UIAdapterV2;
|
|
411
|
+
/**
|
|
412
|
+
* Check if an adapter is V2 compatible
|
|
413
|
+
*/
|
|
414
|
+
declare function isV2Adapter(adapter: unknown): adapter is UIAdapterV2;
|
|
415
|
+
/**
|
|
416
|
+
* Check if an adapter supports a specific capability
|
|
417
|
+
*/
|
|
418
|
+
declare function hasCapability(adapter: UIAdapterV2, capability: keyof AdapterCapabilities): boolean;
|
|
419
|
+
/**
|
|
420
|
+
* Get all capabilities of an adapter as an array
|
|
421
|
+
*/
|
|
422
|
+
declare function getCapabilities(adapter: UIAdapterV2): (keyof AdapterCapabilities)[];
|
|
3
423
|
|
|
4
424
|
/**
|
|
5
425
|
* @flightdev/ui - Adapter Registry
|
|
@@ -158,4 +578,4 @@ declare const adapterRegistry: AdapterRegistry;
|
|
|
158
578
|
*/
|
|
159
579
|
declare function registerBuiltinAdapters(): void;
|
|
160
580
|
|
|
161
|
-
export { AdapterCapabilities, type AdapterLoader, type AdapterMetadata, AdapterTier, type RegistryQueryOptions, UIAdapterV2, adapterRegistry, registerBuiltinAdapters };
|
|
581
|
+
export { type AdapterCapabilities, type AdapterLoader, type AdapterMetadata, type AdapterTier, BaseUIAdapter, type Component, type ComponentProps, DEFAULT_CAPABILITIES, type HasCapability, type Island, type IslandHydrationStrategy, type IslandOptions, type RegistryQueryOptions, type RenderContext, type RenderResult, type RenderTiming, type StreamingOptions, type StreamingRenderResult, TIER_INFO, type TierInfo, type UIAdapter, type UIAdapterV1, type UIAdapterV2, type UIConfig, adapterRegistry, getCapabilities, hasCapability, isV2Adapter, registerBuiltinAdapters, wrapV1Adapter };
|
package/dist/core/index.js
CHANGED
|
@@ -1,2 +1,23 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
1
|
+
import {
|
|
2
|
+
BaseUIAdapter,
|
|
3
|
+
DEFAULT_CAPABILITIES,
|
|
4
|
+
TIER_INFO,
|
|
5
|
+
adapterRegistry,
|
|
6
|
+
getCapabilities,
|
|
7
|
+
hasCapability,
|
|
8
|
+
isV2Adapter,
|
|
9
|
+
registerBuiltinAdapters,
|
|
10
|
+
wrapV1Adapter
|
|
11
|
+
} from "../chunk-S4DTUQII.js";
|
|
12
|
+
export {
|
|
13
|
+
BaseUIAdapter,
|
|
14
|
+
DEFAULT_CAPABILITIES,
|
|
15
|
+
TIER_INFO,
|
|
16
|
+
adapterRegistry,
|
|
17
|
+
getCapabilities,
|
|
18
|
+
hasCapability,
|
|
19
|
+
isV2Adapter,
|
|
20
|
+
registerBuiltinAdapters,
|
|
21
|
+
wrapV1Adapter
|
|
22
|
+
};
|
|
23
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}
|
package/dist/index.d.ts
CHANGED
|
@@ -1,6 +1,5 @@
|
|
|
1
|
-
import {
|
|
2
|
-
export {
|
|
3
|
-
export { AdapterLoader, AdapterMetadata, RegistryQueryOptions, adapterRegistry, registerBuiltinAdapters } from './core/index.js';
|
|
1
|
+
import { UIAdapterV2, UIAdapterV1, IslandHydrationStrategy, UIConfig, Component, RenderContext, RenderResult } from './core/index.js';
|
|
2
|
+
export { AdapterCapabilities, AdapterLoader, AdapterMetadata, AdapterTier, BaseUIAdapter, ComponentProps, DEFAULT_CAPABILITIES, HasCapability, Island, IslandOptions, RegistryQueryOptions, RenderTiming, StreamingOptions, StreamingRenderResult, TIER_INFO, TierInfo, UIAdapter, adapterRegistry, getCapabilities, hasCapability, isV2Adapter, registerBuiltinAdapters, wrapV1Adapter } from './core/index.js';
|
|
4
3
|
|
|
5
4
|
/**
|
|
6
5
|
* @flightdev/ui - Universal UI Framework Layer
|
package/dist/index.js
CHANGED
|
@@ -1,6 +1,14 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
1
|
+
import {
|
|
2
|
+
BaseUIAdapter,
|
|
3
|
+
DEFAULT_CAPABILITIES,
|
|
4
|
+
TIER_INFO,
|
|
5
|
+
adapterRegistry,
|
|
6
|
+
getCapabilities,
|
|
7
|
+
hasCapability,
|
|
8
|
+
isV2Adapter,
|
|
9
|
+
registerBuiltinAdapters,
|
|
10
|
+
wrapV1Adapter
|
|
11
|
+
} from "./chunk-S4DTUQII.js";
|
|
4
12
|
|
|
5
13
|
// src/index.ts
|
|
6
14
|
function defineUI(adapter, options = {}) {
|
|
@@ -67,5 +75,21 @@ function getPackageInfo() {
|
|
|
67
75
|
totalAdapters: 18
|
|
68
76
|
};
|
|
69
77
|
}
|
|
70
|
-
|
|
71
|
-
|
|
78
|
+
export {
|
|
79
|
+
BaseUIAdapter,
|
|
80
|
+
DEFAULT_CAPABILITIES,
|
|
81
|
+
TIER_INFO,
|
|
82
|
+
VERSION,
|
|
83
|
+
adapterRegistry,
|
|
84
|
+
defineUI,
|
|
85
|
+
getCapabilities,
|
|
86
|
+
getPackageInfo,
|
|
87
|
+
hasCapability,
|
|
88
|
+
isV2Adapter,
|
|
89
|
+
registerBuiltinAdapters,
|
|
90
|
+
renderPage,
|
|
91
|
+
renderPageStream,
|
|
92
|
+
toHTML,
|
|
93
|
+
wrapV1Adapter
|
|
94
|
+
};
|
|
95
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/index.ts"],"sourcesContent":["/**\r\n * @flightdev/ui - Universal UI Framework Layer\r\n *\r\n * Universal SSR and hydration for 18+ UI frameworks.\r\n * From React to Angular, Vue to HTMX, Svelte to Web Components.\r\n *\r\n * @module @flightdev/ui\r\n * @version 2.0.0\r\n *\r\n * @example Basic Usage\r\n * ```typescript\r\n * import { defineUI } from '@flightdev/ui';\r\n * import { react } from '@flightdev/ui/react';\r\n *\r\n * export default defineUI(react());\r\n * ```\r\n *\r\n * @example With Streaming SSR\r\n * ```typescript\r\n * import { defineUI } from '@flightdev/ui';\r\n * import { react } from '@flightdev/ui/react';\r\n *\r\n * export default defineUI(react(), {\r\n * streaming: true,\r\n * hydration: 'progressive',\r\n * });\r\n * ```\r\n *\r\n * @example Using Adapter Registry\r\n * ```typescript\r\n * import { adapterRegistry } from '@flightdev/ui';\r\n *\r\n * // Get adapter dynamically\r\n * const adapter = await adapterRegistry.get('vue');\r\n *\r\n * // List all by tier\r\n * const tier1 = adapterRegistry.listByTier('tier-1');\r\n * ```\r\n */\r\n\r\n// ============================================================================\r\n// Core Types & Utilities\r\n// ============================================================================\r\n\r\nexport type {\r\n // Capability System\r\n AdapterCapabilities,\r\n AdapterTier,\r\n TierInfo,\r\n\r\n // Component & Rendering\r\n Component,\r\n ComponentProps,\r\n RenderContext,\r\n RenderResult,\r\n RenderTiming,\r\n\r\n // Streaming\r\n StreamingOptions,\r\n StreamingRenderResult,\r\n\r\n // Islands Architecture\r\n IslandHydrationStrategy,\r\n IslandOptions,\r\n Island,\r\n\r\n // Adapter Interfaces\r\n UIAdapterV2,\r\n UIAdapterV1,\r\n UIAdapter,\r\n UIConfig,\r\n\r\n // Utility Types\r\n HasCapability,\r\n} from './core/types.js';\r\n\r\nexport {\r\n DEFAULT_CAPABILITIES,\r\n TIER_INFO,\r\n} from './core/types.js';\r\n\r\n// Base Adapter & Utilities\r\nexport {\r\n BaseUIAdapter,\r\n wrapV1Adapter,\r\n isV2Adapter,\r\n hasCapability,\r\n getCapabilities,\r\n} from './core/adapter.js';\r\n\r\n// Registry\r\nexport type {\r\n AdapterLoader,\r\n AdapterMetadata,\r\n RegistryQueryOptions,\r\n} from './core/registry.js';\r\n\r\nexport {\r\n adapterRegistry,\r\n registerBuiltinAdapters,\r\n} from './core/registry.js';\r\n\r\n// ============================================================================\r\n// Factory Function\r\n// ============================================================================\r\n\r\nimport type { UIAdapterV2, UIAdapterV1, UIConfig, IslandHydrationStrategy } from './core/types.js';\r\n\r\n/**\r\n * Define UI configuration for Flight.\r\n *\r\n * @example\r\n * ```typescript\r\n * import { defineUI } from '@flightdev/ui';\r\n * import { react } from '@flightdev/ui/react';\r\n *\r\n * export const ui = defineUI(react(), {\r\n * streaming: true,\r\n * hydration: 'progressive',\r\n * });\r\n * ```\r\n */\r\nexport function defineUI(\r\n adapter: UIAdapterV2 | UIAdapterV1,\r\n options: {\r\n streaming?: boolean;\r\n hydration?: 'full' | 'partial' | 'progressive' | 'none';\r\n islands?: boolean;\r\n defaultIslandStrategy?: IslandHydrationStrategy;\r\n } = {}\r\n): UIConfig {\r\n return {\r\n adapter,\r\n streaming: options.streaming ?? false,\r\n hydration: options.hydration ?? 'full',\r\n islands: options.islands ?? false,\r\n defaultIslandStrategy: options.defaultIslandStrategy ?? 'idle',\r\n };\r\n}\r\n\r\n// ============================================================================\r\n// Render Utilities\r\n// ============================================================================\r\n\r\nimport type { Component, RenderResult, RenderContext } from './core/types.js';\r\nimport { isV2Adapter } from './core/adapter.js';\r\n\r\n/**\r\n * Render a page with the configured UI adapter.\r\n */\r\nexport async function renderPage(\r\n config: UIConfig,\r\n component: Component,\r\n context?: RenderContext\r\n): Promise<RenderResult> {\r\n const result = await config.adapter.renderToString(component, context);\r\n\r\n // Add hydration script if needed\r\n if (config.hydration !== 'none') {\r\n const hydrationScript = config.adapter.getHydrationScript(result);\r\n result.scripts = [...(result.scripts ?? []), hydrationScript];\r\n }\r\n\r\n return result;\r\n}\r\n\r\n/**\r\n * Render a page as a stream (if adapter supports streaming).\r\n */\r\nexport function renderPageStream(\r\n config: UIConfig,\r\n component: Component,\r\n context?: RenderContext\r\n): ReadableStream<Uint8Array> | null {\r\n if (!isV2Adapter(config.adapter) || !config.adapter.capabilities.streaming) {\r\n return null;\r\n }\r\n\r\n const streamResult = config.adapter.renderToStream?.(component, context);\r\n return streamResult?.stream ?? null;\r\n}\r\n\r\n/**\r\n * Generate full HTML document from render result.\r\n */\r\nexport function toHTML(\r\n result: RenderResult,\r\n options: {\r\n lang?: string;\r\n title?: string;\r\n meta?: Record<string, string>;\r\n charset?: string;\r\n viewport?: string;\r\n } = {}\r\n): string {\r\n const {\r\n lang = 'en',\r\n title = 'Flight App',\r\n meta = {},\r\n charset = 'UTF-8',\r\n viewport = 'width=device-width, initial-scale=1.0',\r\n } = options;\r\n\r\n const metaTags = Object.entries(meta)\r\n .map(([name, content]) => `<meta name=\"${name}\" content=\"${content}\">`)\r\n .join('\\n ');\r\n\r\n const scripts = result.scripts\r\n ?.map((s) => (s.startsWith('<script') ? s : `<script>${s}</script>`))\r\n .join('\\n ') ?? '';\r\n\r\n return `<!DOCTYPE html>\r\n<html lang=\"${lang}\">\r\n <head>\r\n <meta charset=\"${charset}\">\r\n <meta name=\"viewport\" content=\"${viewport}\">\r\n <title>${title}</title>\r\n ${metaTags}\r\n ${result.head ?? ''}\r\n ${result.css ? `<style>${result.css}</style>` : ''}\r\n </head>\r\n <body>\r\n <div id=\"app\">${result.html}</div>\r\n ${scripts}\r\n </body>\r\n</html>`;\r\n}\r\n\r\n// ============================================================================\r\n// Convenience Re-exports (Backward Compatibility)\r\n// ============================================================================\r\n\r\n// These maintain backward compatibility with v1 imports\r\n// e.g., import { react } from '@flightdev/ui'\r\n\r\n// Note: For tree-shaking, prefer deep imports:\r\n// import { react } from '@flightdev/ui/react'\r\n\r\n// ============================================================================\r\n// Version & Info\r\n// ============================================================================\r\n\r\n/**\r\n * Package version\r\n */\r\nexport const VERSION = '2.0.0';\r\n\r\n/**\r\n * Get information about the UI package\r\n */\r\nexport function getPackageInfo() {\r\n return {\r\n name: '@flightdev/ui',\r\n version: VERSION,\r\n description: 'Universal UI Framework Layer - SSR/hydration for 18+ frameworks',\r\n tiers: {\r\n 'tier-1': ['react', 'vue', 'angular', 'svelte', 'solid', 'qwik'],\r\n 'tier-2': ['preact', 'lit', 'marko', 'stencil', 'mithril', 'inferno'],\r\n 'tier-3': ['htmx', 'alpine', 'hotwire', 'stimulus', 'petite-vue', 'vanilla'],\r\n },\r\n totalAdapters: 18,\r\n };\r\n}\r\n"],"mappings":";;;;;;;;;;;;;AA0HO,SAAS,SACZ,SACA,UAKI,CAAC,GACG;AACR,SAAO;AAAA,IACH;AAAA,IACA,WAAW,QAAQ,aAAa;AAAA,IAChC,WAAW,QAAQ,aAAa;AAAA,IAChC,SAAS,QAAQ,WAAW;AAAA,IAC5B,uBAAuB,QAAQ,yBAAyB;AAAA,EAC5D;AACJ;AAYA,eAAsB,WAClB,QACA,WACA,SACqB;AACrB,QAAM,SAAS,MAAM,OAAO,QAAQ,eAAe,WAAW,OAAO;AAGrE,MAAI,OAAO,cAAc,QAAQ;AAC7B,UAAM,kBAAkB,OAAO,QAAQ,mBAAmB,MAAM;AAChE,WAAO,UAAU,CAAC,GAAI,OAAO,WAAW,CAAC,GAAI,eAAe;AAAA,EAChE;AAEA,SAAO;AACX;AAKO,SAAS,iBACZ,QACA,WACA,SACiC;AACjC,MAAI,CAAC,YAAY,OAAO,OAAO,KAAK,CAAC,OAAO,QAAQ,aAAa,WAAW;AACxE,WAAO;AAAA,EACX;AAEA,QAAM,eAAe,OAAO,QAAQ,iBAAiB,WAAW,OAAO;AACvE,SAAO,cAAc,UAAU;AACnC;AAKO,SAAS,OACZ,QACA,UAMI,CAAC,GACC;AACN,QAAM;AAAA,IACF,OAAO;AAAA,IACP,QAAQ;AAAA,IACR,OAAO,CAAC;AAAA,IACR,UAAU;AAAA,IACV,WAAW;AAAA,EACf,IAAI;AAEJ,QAAM,WAAW,OAAO,QAAQ,IAAI,EAC/B,IAAI,CAAC,CAAC,MAAM,OAAO,MAAM,eAAe,IAAI,cAAc,OAAO,IAAI,EACrE,KAAK,QAAQ;AAElB,QAAM,UAAU,OAAO,SACjB,IAAI,CAAC,MAAO,EAAE,WAAW,SAAS,IAAI,IAAI,WAAW,CAAC,WAAY,EACnE,KAAK,QAAQ,KAAK;AAEvB,SAAO;AAAA,cACG,IAAI;AAAA;AAAA,qBAEG,OAAO;AAAA,qCACS,QAAQ;AAAA,aAChC,KAAK;AAAA,MACZ,QAAQ;AAAA,MACR,OAAO,QAAQ,EAAE;AAAA,MACjB,OAAO,MAAM,UAAU,OAAO,GAAG,aAAa,EAAE;AAAA;AAAA;AAAA,oBAGlC,OAAO,IAAI;AAAA,MACzB,OAAO;AAAA;AAAA;AAGb;AAmBO,IAAM,UAAU;AAKhB,SAAS,iBAAiB;AAC7B,SAAO;AAAA,IACH,MAAM;AAAA,IACN,SAAS;AAAA,IACT,aAAa;AAAA,IACb,OAAO;AAAA,MACH,UAAU,CAAC,SAAS,OAAO,WAAW,UAAU,SAAS,MAAM;AAAA,MAC/D,UAAU,CAAC,UAAU,OAAO,SAAS,WAAW,WAAW,SAAS;AAAA,MACpE,UAAU,CAAC,QAAQ,UAAU,WAAW,YAAY,cAAc,SAAS;AAAA,IAC/E;AAAA,IACA,eAAe;AAAA,EACnB;AACJ;","names":[]}
|