@reckona/mreact-compat 0.0.160 → 0.0.161
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/dist/class-component.d.ts +5 -0
- package/dist/class-component.d.ts.map +1 -1
- package/dist/class-component.js +36 -11
- package/dist/class-component.js.map +1 -1
- package/dist/context.d.ts +4 -0
- package/dist/context.d.ts.map +1 -1
- package/dist/context.js +4 -0
- package/dist/context.js.map +1 -1
- package/dist/element.d.ts +28 -0
- package/dist/element.d.ts.map +1 -1
- package/dist/element.js +21 -1
- package/dist/element.js.map +1 -1
- package/dist/event-priority.d.ts +1 -0
- package/dist/event-priority.d.ts.map +1 -1
- package/dist/event-priority.js +1 -0
- package/dist/event-priority.js.map +1 -1
- package/dist/event-replay.d.ts +6 -0
- package/dist/event-replay.d.ts.map +1 -1
- package/dist/event-replay.js +4 -0
- package/dist/event-replay.js.map +1 -1
- package/dist/flight-decoder.d.ts +1 -0
- package/dist/flight-decoder.d.ts.map +1 -1
- package/dist/flight-decoder.js.map +1 -1
- package/dist/flight-protocol.d.ts +2 -0
- package/dist/flight-protocol.d.ts.map +1 -1
- package/dist/flight-protocol.js +1 -0
- package/dist/flight-protocol.js.map +1 -1
- package/dist/flight-types.d.ts +21 -0
- package/dist/flight-types.d.ts.map +1 -1
- package/dist/flight-types.js.map +1 -1
- package/dist/flight.d.ts +7 -0
- package/dist/flight.d.ts.map +1 -1
- package/dist/flight.js +5 -0
- package/dist/flight.js.map +1 -1
- package/dist/hooks-entry.d.ts +2 -0
- package/dist/hooks-entry.d.ts.map +1 -1
- package/dist/hooks-entry.js +1 -0
- package/dist/hooks-entry.js.map +1 -1
- package/dist/hooks.d.ts +36 -0
- package/dist/hooks.d.ts.map +1 -1
- package/dist/hooks.js +42 -10
- package/dist/hooks.js.map +1 -1
- package/dist/host-reconciler.js +30 -30
- package/dist/host-reconciler.js.map +1 -1
- package/dist/hydration.d.ts +2 -0
- package/dist/hydration.d.ts.map +1 -1
- package/dist/hydration.js +1 -0
- package/dist/hydration.js.map +1 -1
- package/dist/index.d.ts +3 -0
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +1 -0
- package/dist/index.js.map +1 -1
- package/dist/internal.d.ts +1 -0
- package/dist/internal.d.ts.map +1 -1
- package/dist/internal.js +1 -0
- package/dist/internal.js.map +1 -1
- package/dist/jsx-dev-runtime.d.ts +5 -0
- package/dist/jsx-dev-runtime.d.ts.map +1 -1
- package/dist/jsx-dev-runtime.js +3 -0
- package/dist/jsx-dev-runtime.js.map +1 -1
- package/dist/jsx-runtime.d.ts +13 -0
- package/dist/jsx-runtime.d.ts.map +1 -1
- package/dist/jsx-runtime.js +4 -0
- package/dist/jsx-runtime.js.map +1 -1
- package/dist/react-default.d.ts +2 -0
- package/dist/react-default.d.ts.map +1 -1
- package/dist/react-default.js +2 -0
- package/dist/react-default.js.map +1 -1
- package/dist/root.d.ts +13 -0
- package/dist/root.d.ts.map +1 -1
- package/dist/root.js +6 -0
- package/dist/root.js.map +1 -1
- package/dist/scheduler.d.ts +23 -0
- package/dist/scheduler.d.ts.map +1 -1
- package/dist/scheduler.js +19 -0
- package/dist/scheduler.js.map +1 -1
- package/dist/server-render.d.ts +1 -0
- package/dist/server-render.d.ts.map +1 -1
- package/dist/server-render.js +1 -0
- package/dist/server-render.js.map +1 -1
- package/package.json +3 -3
- package/src/class-component.ts +47 -11
- package/src/context.ts +4 -0
- package/src/element.ts +33 -6
- package/src/event-priority.ts +1 -0
- package/src/event-replay.ts +6 -0
- package/src/flight-decoder.ts +1 -0
- package/src/flight-protocol.ts +2 -0
- package/src/flight-types.ts +21 -0
- package/src/flight.ts +7 -0
- package/src/hooks-entry.ts +2 -0
- package/src/hooks.ts +55 -15
- package/src/host-reconciler.ts +39 -38
- package/src/hydration.ts +2 -0
- package/src/index.ts +3 -0
- package/src/internal.ts +1 -0
- package/src/jsx-dev-runtime.ts +5 -0
- package/src/jsx-runtime.ts +13 -0
- package/src/react-default.ts +2 -0
- package/src/root.ts +13 -0
- package/src/scheduler.ts +23 -0
- package/src/server-render.ts +1 -0
package/src/class-component.ts
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { renderWithRootRuntime, useLayoutEffect, useRef, type RootRuntime } from "./hooks.js";
|
|
1
|
+
import { renderWithRootRuntime, scheduleRuntimeRerender, useLayoutEffect, useRef, type RootRuntime } from "./hooks.js";
|
|
2
2
|
import { isReactCompatElement, type ReactCompatElement, type ReactCompatNode } from "./element.js";
|
|
3
3
|
import { withHydrationComponentStack, type RenderOptions } from "./hydration.js";
|
|
4
4
|
import type { ReconcileNode, ReconcileResult } from "./reconcile-types.js";
|
|
@@ -48,6 +48,7 @@ export interface ClassComponentType {
|
|
|
48
48
|
getDerivedStateFromError?: (error: Error) => Record<string, unknown> | null;
|
|
49
49
|
}
|
|
50
50
|
|
|
51
|
+
/** Base class-style component contract with state updates and render lifecycle. */
|
|
51
52
|
export interface Component<
|
|
52
53
|
P extends Record<string, unknown> = Record<string, unknown>,
|
|
53
54
|
S extends Record<string, unknown> = Record<string, unknown>,
|
|
@@ -79,6 +80,7 @@ export interface ComponentConstructor {
|
|
|
79
80
|
prototype: Component<any, any>;
|
|
80
81
|
}
|
|
81
82
|
|
|
83
|
+
/** Base class-style component constructor for React-compatible class components. */
|
|
82
84
|
export const Component: ComponentConstructor = function Component<
|
|
83
85
|
P extends Record<string, unknown> = Record<string, unknown>,
|
|
84
86
|
S extends Record<string, unknown> = Record<string, unknown>,
|
|
@@ -117,6 +119,7 @@ Component.prototype.render = function render(): ReactCompatNode {
|
|
|
117
119
|
return null;
|
|
118
120
|
};
|
|
119
121
|
|
|
122
|
+
/** Class-style component contract that skips updates for shallow-equal props and state. */
|
|
120
123
|
export interface PureComponent<
|
|
121
124
|
P extends Record<string, unknown> = Record<string, unknown>,
|
|
122
125
|
S extends Record<string, unknown> = Record<string, unknown>,
|
|
@@ -136,6 +139,7 @@ export interface PureComponentConstructor {
|
|
|
136
139
|
prototype: PureComponent<any, any>;
|
|
137
140
|
}
|
|
138
141
|
|
|
142
|
+
/** Class-style component constructor with shallow prop and state comparison. */
|
|
139
143
|
export const PureComponent: PureComponentConstructor = function PureComponent<
|
|
140
144
|
P extends Record<string, unknown> = Record<string, unknown>,
|
|
141
145
|
S extends Record<string, unknown> = Record<string, unknown>,
|
|
@@ -164,6 +168,7 @@ interface ClassLifecycleSnapshot {
|
|
|
164
168
|
nextState?: Record<string, unknown>;
|
|
165
169
|
force?: boolean;
|
|
166
170
|
snapshot?: unknown;
|
|
171
|
+
callbacks?: (() => void)[];
|
|
167
172
|
}
|
|
168
173
|
|
|
169
174
|
interface ClassUpdateContext {
|
|
@@ -265,6 +270,7 @@ export function renderClassComponentWithRuntime(
|
|
|
265
270
|
options: {
|
|
266
271
|
currentInstance?: ClassComponentInstance;
|
|
267
272
|
hasDirtyDescendant?: boolean;
|
|
273
|
+
allowSkip?: boolean;
|
|
268
274
|
} = {},
|
|
269
275
|
): ClassComponentRenderResult {
|
|
270
276
|
return renderWithRootRuntime(runtime, path, () => {
|
|
@@ -315,6 +321,7 @@ export function renderClassComponentWithRuntime(
|
|
|
315
321
|
didCommitRef.current &&
|
|
316
322
|
snapshot?.force !== true &&
|
|
317
323
|
options.hasDirtyDescendant !== true &&
|
|
324
|
+
options.allowSkip !== false &&
|
|
318
325
|
instance.shouldComponentUpdate?.(props, nextState) === false;
|
|
319
326
|
|
|
320
327
|
instance.props = props;
|
|
@@ -538,14 +545,17 @@ function enqueueClassSetState(
|
|
|
538
545
|
...nextPartial,
|
|
539
546
|
};
|
|
540
547
|
|
|
541
|
-
|
|
548
|
+
const nextSnapshot: ClassLifecycleSnapshot = {
|
|
542
549
|
...snapshot,
|
|
543
550
|
previousState,
|
|
544
551
|
nextState,
|
|
545
|
-
}
|
|
552
|
+
};
|
|
553
|
+
if (callback !== undefined) {
|
|
554
|
+
nextSnapshot.callbacks = [...(snapshot?.callbacks ?? []), callback.bind(instance)];
|
|
555
|
+
}
|
|
556
|
+
classLifecycleSnapshots.set(instance, nextSnapshot);
|
|
546
557
|
|
|
547
558
|
markClassInstanceDirty(instance, updateContext);
|
|
548
|
-
callback?.call(instance);
|
|
549
559
|
}
|
|
550
560
|
|
|
551
561
|
function enqueueClassForceUpdate(
|
|
@@ -559,12 +569,17 @@ function enqueueClassForceUpdate(
|
|
|
559
569
|
return;
|
|
560
570
|
}
|
|
561
571
|
|
|
562
|
-
classLifecycleSnapshots.
|
|
572
|
+
const snapshot = classLifecycleSnapshots.get(instance);
|
|
573
|
+
const nextSnapshot: ClassLifecycleSnapshot = {
|
|
574
|
+
...snapshot,
|
|
563
575
|
previousState: instance.state ?? {},
|
|
564
576
|
force: true,
|
|
565
|
-
}
|
|
577
|
+
};
|
|
578
|
+
if (callback !== undefined) {
|
|
579
|
+
nextSnapshot.callbacks = [...(snapshot?.callbacks ?? []), callback.bind(instance)];
|
|
580
|
+
}
|
|
581
|
+
classLifecycleSnapshots.set(instance, nextSnapshot);
|
|
566
582
|
markClassInstanceDirty(instance, updateContext);
|
|
567
|
-
callback?.call(instance);
|
|
568
583
|
}
|
|
569
584
|
|
|
570
585
|
function markClassInstanceDirty(
|
|
@@ -578,7 +593,7 @@ function markClassInstanceDirty(
|
|
|
578
593
|
if (runtimeInstance !== undefined) {
|
|
579
594
|
runtimeInstance.dirty = true;
|
|
580
595
|
}
|
|
581
|
-
updateContext.runtime
|
|
596
|
+
scheduleRuntimeRerender(updateContext.runtime);
|
|
582
597
|
}
|
|
583
598
|
|
|
584
599
|
export function hasDirtyClassUpdate(
|
|
@@ -660,13 +675,16 @@ function installClassLifecycleEffects(
|
|
|
660
675
|
replacedInstance?: ClassComponentInstance,
|
|
661
676
|
): void {
|
|
662
677
|
useLayoutEffect(() => {
|
|
678
|
+
const lifecycleSnapshot = classLifecycleSnapshots.get(instance);
|
|
679
|
+
|
|
663
680
|
if (replacedInstance !== undefined) {
|
|
664
681
|
replacedInstance.componentWillUnmount?.();
|
|
665
682
|
classUpdateContexts.delete(replacedInstance);
|
|
666
683
|
}
|
|
667
684
|
|
|
668
685
|
if (skipUpdate) {
|
|
669
|
-
|
|
686
|
+
runClassUpdateCallbacks(lifecycleSnapshot);
|
|
687
|
+
deleteClassLifecycleSnapshotIfCurrent(instance, lifecycleSnapshot);
|
|
670
688
|
return;
|
|
671
689
|
}
|
|
672
690
|
|
|
@@ -674,14 +692,15 @@ function installClassLifecycleEffects(
|
|
|
674
692
|
instance.componentDidUpdate?.(
|
|
675
693
|
previousProps ?? {},
|
|
676
694
|
previousState,
|
|
677
|
-
|
|
695
|
+
lifecycleSnapshot?.snapshot,
|
|
678
696
|
);
|
|
679
697
|
} else {
|
|
680
698
|
didCommitRef.current = true;
|
|
681
699
|
instance.componentDidMount?.();
|
|
682
700
|
}
|
|
683
701
|
|
|
684
|
-
|
|
702
|
+
runClassUpdateCallbacks(lifecycleSnapshot);
|
|
703
|
+
deleteClassLifecycleSnapshotIfCurrent(instance, lifecycleSnapshot);
|
|
685
704
|
});
|
|
686
705
|
|
|
687
706
|
useLayoutEffect(() => {
|
|
@@ -693,6 +712,23 @@ function installClassLifecycleEffects(
|
|
|
693
712
|
}, []);
|
|
694
713
|
}
|
|
695
714
|
|
|
715
|
+
function runClassUpdateCallbacks(snapshot: ClassLifecycleSnapshot | undefined): void {
|
|
716
|
+
const callbacks = snapshot?.callbacks ?? [];
|
|
717
|
+
|
|
718
|
+
for (const callback of callbacks) {
|
|
719
|
+
callback();
|
|
720
|
+
}
|
|
721
|
+
}
|
|
722
|
+
|
|
723
|
+
function deleteClassLifecycleSnapshotIfCurrent(
|
|
724
|
+
instance: ClassComponentInstance,
|
|
725
|
+
snapshot: ClassLifecycleSnapshot | undefined,
|
|
726
|
+
): void {
|
|
727
|
+
if (classLifecycleSnapshots.get(instance) === snapshot) {
|
|
728
|
+
classLifecycleSnapshots.delete(instance);
|
|
729
|
+
}
|
|
730
|
+
}
|
|
731
|
+
|
|
696
732
|
function isErrorBoundaryClass(
|
|
697
733
|
type: ClassComponentType,
|
|
698
734
|
instance: ClassComponentInstance,
|
package/src/context.ts
CHANGED
|
@@ -53,6 +53,7 @@ const contextReadObserverState =
|
|
|
53
53
|
current: undefined,
|
|
54
54
|
});
|
|
55
55
|
|
|
56
|
+
/** Creates a context object with Provider and Consumer entries. */
|
|
56
57
|
export function createContext<T>(defaultValue: T): ReactCompatContext<T> {
|
|
57
58
|
const context: ReactCompatContext<T> = {
|
|
58
59
|
defaultValue,
|
|
@@ -94,6 +95,7 @@ function installContextDisplayName<T>(context: ReactCompatContext<T>): void {
|
|
|
94
95
|
});
|
|
95
96
|
}
|
|
96
97
|
|
|
98
|
+
/** Reads the current value for a React-compatible context. */
|
|
97
99
|
export function useContext<T>(context: ReactCompatContextLike<T>): T {
|
|
98
100
|
const value = readContextValue(context);
|
|
99
101
|
contextReadObserverState.current?.(context as ReactCompatContextLike<unknown>, value);
|
|
@@ -213,6 +215,7 @@ export function popContextProvider<T>(provider: ReactCompatProvider<T>): void {
|
|
|
213
215
|
externalContextValues.get(context)?.pop();
|
|
214
216
|
}
|
|
215
217
|
|
|
218
|
+
/** Renders a string while a provider value is active. */
|
|
216
219
|
export function renderContextProviderToString<T>(
|
|
217
220
|
provider: ReactCompatProvider<T>,
|
|
218
221
|
value: T,
|
|
@@ -221,6 +224,7 @@ export function renderContextProviderToString<T>(
|
|
|
221
224
|
return renderWithContextProvider(provider, value, render);
|
|
222
225
|
}
|
|
223
226
|
|
|
227
|
+
/** Renders a string with the current value from a context consumer. */
|
|
224
228
|
export function renderContextConsumerToString<T>(
|
|
225
229
|
consumer: ReactCompatConsumer<T>,
|
|
226
230
|
render: (value: T) => string,
|
package/src/element.ts
CHANGED
|
@@ -6,14 +6,20 @@ export const LAZY_TYPE = Symbol.for("react.lazy");
|
|
|
6
6
|
export const STRICT_MODE_TYPE = Symbol.for("react.strict_mode");
|
|
7
7
|
export const PORTAL_TYPE = Symbol.for("react.portal");
|
|
8
8
|
const REACT_COMPAT_PROVIDER_TYPE = Symbol.for("react.context");
|
|
9
|
+
/** Symbol used to group JSX children without adding a host element. */
|
|
9
10
|
export const Fragment = Symbol.for("react.fragment");
|
|
11
|
+
/** Symbol used to suspend rendering while async content resolves. */
|
|
10
12
|
export const Suspense = Symbol.for("react.suspense");
|
|
13
|
+
/** Symbol used to coordinate multiple suspense boundaries. */
|
|
11
14
|
export const SuspenseList = Symbol.for("react.suspense_list");
|
|
15
|
+
/** Symbol used to mark activity boundaries in React-compatible trees. */
|
|
12
16
|
export const Activity = Symbol.for("react.activity");
|
|
17
|
+
/** Symbol used to measure render work with profiler callbacks. */
|
|
13
18
|
export const Profiler = Symbol.for("react.profiler");
|
|
14
19
|
export const HOST_CHILDREN_ONLY_PROPS_META = Symbol.for(
|
|
15
20
|
"modular.react.host_children_only_props_meta",
|
|
16
21
|
);
|
|
22
|
+
/** Metadata key that links a state value to a reactive text binding. */
|
|
17
23
|
export const REACTIVE_TEXT_BINDING_META = Symbol.for(
|
|
18
24
|
"modular.react.reactive_text_binding_meta",
|
|
19
25
|
);
|
|
@@ -29,6 +35,7 @@ export interface ReactCompatContextProviderShorthand {
|
|
|
29
35
|
Consumer: unknown;
|
|
30
36
|
}
|
|
31
37
|
|
|
38
|
+
/** Element type accepted by createElement, JSX, and renderer entrypoints. */
|
|
32
39
|
export type ElementType<P = Record<string, unknown>> =
|
|
33
40
|
| string
|
|
34
41
|
| typeof Fragment
|
|
@@ -46,6 +53,7 @@ export type ElementType<P = Record<string, unknown>> =
|
|
|
46
53
|
| ((props: P) => ReactCompatNode | PromiseLike<ReactCompatNode>)
|
|
47
54
|
| (new (props: P) => { render(): ReactCompatNode });
|
|
48
55
|
|
|
56
|
+
/** Renderable value accepted by the React-compatible renderer. */
|
|
49
57
|
export type ReactCompatNode =
|
|
50
58
|
| ReactCompatElement
|
|
51
59
|
| ReactCompatPortal
|
|
@@ -56,6 +64,7 @@ export type ReactCompatNode =
|
|
|
56
64
|
| undefined
|
|
57
65
|
| ReactCompatNode[];
|
|
58
66
|
|
|
67
|
+
/** React-compatible element record produced by createElement and JSX transforms. */
|
|
59
68
|
export interface ReactCompatElement<P = Record<string, unknown>> {
|
|
60
69
|
$$typeof: typeof REACT_COMPAT_ELEMENT_TYPE;
|
|
61
70
|
type: ElementType<P>;
|
|
@@ -64,6 +73,7 @@ export interface ReactCompatElement<P = Record<string, unknown>> {
|
|
|
64
73
|
props: P & { children?: ReactCompatNode };
|
|
65
74
|
}
|
|
66
75
|
|
|
76
|
+
/** Portal record that renders children into an external DOM container. */
|
|
67
77
|
export interface ReactCompatPortal {
|
|
68
78
|
$$typeof: typeof PORTAL_TYPE;
|
|
69
79
|
container: Element;
|
|
@@ -71,6 +81,7 @@ export interface ReactCompatPortal {
|
|
|
71
81
|
key: string | null;
|
|
72
82
|
}
|
|
73
83
|
|
|
84
|
+
/** Creates a React-compatible element from a type, config object, and children. */
|
|
74
85
|
export function createElement<P extends Record<string, unknown>>(
|
|
75
86
|
type: ElementType<P>,
|
|
76
87
|
config: (P & ReactReservedProps) | null,
|
|
@@ -125,6 +136,7 @@ export function createElement<P extends Record<string, unknown>>(
|
|
|
125
136
|
};
|
|
126
137
|
}
|
|
127
138
|
|
|
139
|
+
/** Creates a React-compatible element from JSX runtime arguments. */
|
|
128
140
|
export function createElementFromJsxConfig<P extends Record<string, unknown>>(
|
|
129
141
|
type: ElementType<P>,
|
|
130
142
|
config: (P & ReactReservedProps & { children?: ReactCompatNode }) | null,
|
|
@@ -142,8 +154,8 @@ export function createElementFromJsxConfig<P extends Record<string, unknown>>(
|
|
|
142
154
|
const props = (typeof normalizedType === "string"
|
|
143
155
|
? copiedProps
|
|
144
156
|
: applyDefaultProps(normalizedType, copiedProps)) as P & {
|
|
145
|
-
|
|
146
|
-
|
|
157
|
+
children?: ReactCompatNode;
|
|
158
|
+
};
|
|
147
159
|
|
|
148
160
|
if (hasChildren) {
|
|
149
161
|
props.children = children;
|
|
@@ -162,6 +174,7 @@ export function createElementFromJsxConfig<P extends Record<string, unknown>>(
|
|
|
162
174
|
};
|
|
163
175
|
}
|
|
164
176
|
|
|
177
|
+
/** Returns true when a value is a React-compatible element record. */
|
|
165
178
|
export function isReactCompatElement(
|
|
166
179
|
value: unknown,
|
|
167
180
|
): value is ReactCompatElement {
|
|
@@ -172,6 +185,7 @@ export function isReactCompatElement(
|
|
|
172
185
|
);
|
|
173
186
|
}
|
|
174
187
|
|
|
188
|
+
/** Creates a portal that renders children into a DOM container outside the parent tree. */
|
|
175
189
|
export function createPortal(
|
|
176
190
|
children: ReactCompatNode,
|
|
177
191
|
container: Element,
|
|
@@ -185,6 +199,7 @@ export function createPortal(
|
|
|
185
199
|
};
|
|
186
200
|
}
|
|
187
201
|
|
|
202
|
+
/** Returns true when a value is a React-compatible portal record. */
|
|
188
203
|
export function isReactCompatPortal(value: unknown): value is ReactCompatPortal {
|
|
189
204
|
return (
|
|
190
205
|
typeof value === "object" &&
|
|
@@ -193,21 +208,25 @@ export function isReactCompatPortal(value: unknown): value is ReactCompatPortal
|
|
|
193
208
|
);
|
|
194
209
|
}
|
|
195
210
|
|
|
211
|
+
/** Creates a mutable ref object with a null initial current value. */
|
|
196
212
|
export function createRef<T>(): { current: T | null } {
|
|
197
213
|
return { current: null };
|
|
198
214
|
}
|
|
199
215
|
|
|
216
|
+
/** Element type record produced by forwardRef. */
|
|
200
217
|
export interface ForwardRefType<P = Record<string, unknown>> {
|
|
201
218
|
$$typeof: typeof FORWARD_REF_TYPE;
|
|
202
219
|
render: (props: P, ref: unknown) => ReactCompatNode;
|
|
203
220
|
}
|
|
204
221
|
|
|
222
|
+
/** Element type record produced by memo. */
|
|
205
223
|
export interface MemoType<P = Record<string, unknown>> {
|
|
206
224
|
$$typeof: typeof MEMO_TYPE;
|
|
207
225
|
type: ElementType<P>;
|
|
208
226
|
compare?: (previous: P, next: P) => boolean;
|
|
209
227
|
}
|
|
210
228
|
|
|
229
|
+
/** Element type record produced by lazy. */
|
|
211
230
|
export interface LazyType<P = Record<string, unknown>> {
|
|
212
231
|
$$typeof: typeof LAZY_TYPE;
|
|
213
232
|
load: () => Promise<{ default: ElementType<P> }>;
|
|
@@ -217,12 +236,14 @@ export interface LazyType<P = Record<string, unknown>> {
|
|
|
217
236
|
error?: unknown;
|
|
218
237
|
}
|
|
219
238
|
|
|
239
|
+
/** Wraps a component so it can receive a ref as the second render argument. */
|
|
220
240
|
export function forwardRef<P, T>(
|
|
221
241
|
render: (props: P, ref: { current: T | null } | ((value: T | null) => void) | null) => ReactCompatNode,
|
|
222
242
|
): ForwardRefType<P & { ref?: unknown }> {
|
|
223
243
|
return { $$typeof: FORWARD_REF_TYPE, render: render as ForwardRefType<P>["render"] };
|
|
224
244
|
}
|
|
225
245
|
|
|
246
|
+
/** Wraps an element type with optional prop comparison for memoized renders. */
|
|
226
247
|
export function memo<P>(
|
|
227
248
|
type: ElementType<P>,
|
|
228
249
|
compare?: (previous: P, next: P) => boolean,
|
|
@@ -232,6 +253,7 @@ export function memo<P>(
|
|
|
232
253
|
: { $$typeof: MEMO_TYPE, type, compare };
|
|
233
254
|
}
|
|
234
255
|
|
|
256
|
+
/** Creates a lazy element type that resolves its implementation on demand. */
|
|
235
257
|
export function lazy<P>(
|
|
236
258
|
load: () => Promise<{ default: ElementType<P> }>,
|
|
237
259
|
): LazyType<P> {
|
|
@@ -242,8 +264,10 @@ export function lazy<P>(
|
|
|
242
264
|
};
|
|
243
265
|
}
|
|
244
266
|
|
|
267
|
+
/** Symbol used to mark a subtree for strict-mode development checks. */
|
|
245
268
|
export const StrictMode = STRICT_MODE_TYPE;
|
|
246
269
|
|
|
270
|
+
/** Clones an existing element with merged props and optional replacement children. */
|
|
247
271
|
export function cloneElement<P extends Record<string, unknown>>(
|
|
248
272
|
element: ReactCompatElement<P>,
|
|
249
273
|
props: Partial<P> | null,
|
|
@@ -251,10 +275,9 @@ export function cloneElement<P extends Record<string, unknown>>(
|
|
|
251
275
|
): ReactCompatElement<P> {
|
|
252
276
|
const key = props === null || props.key === undefined ? element.key : String(props.key);
|
|
253
277
|
const ref = props === null || props.ref === undefined ? element.ref : props.ref;
|
|
254
|
-
const nextProps =
|
|
255
|
-
|
|
256
|
-
|
|
257
|
-
) as P & { children?: ReactCompatNode };
|
|
278
|
+
const nextProps = copyElementProps(props, element.props) as P & {
|
|
279
|
+
children?: ReactCompatNode;
|
|
280
|
+
};
|
|
258
281
|
|
|
259
282
|
if (children.length === 1) {
|
|
260
283
|
(nextProps as P & { children?: ReactCompatNode }).children = children[0];
|
|
@@ -392,8 +415,10 @@ function hostPropsAreChildrenOnly(props: Record<string, unknown>): boolean {
|
|
|
392
415
|
return true;
|
|
393
416
|
}
|
|
394
417
|
|
|
418
|
+
/** Alias for checking whether a value is a React-compatible element. */
|
|
395
419
|
export const isValidElement = isReactCompatElement;
|
|
396
420
|
|
|
421
|
+
/** Helpers for iterating, counting, flattening, and validating children. */
|
|
397
422
|
export const Children = {
|
|
398
423
|
map<T>(
|
|
399
424
|
children: ReactCompatNode,
|
|
@@ -453,11 +478,13 @@ function flattenChildren(children: ReactCompatNode): ReactCompatNode[] {
|
|
|
453
478
|
return [children];
|
|
454
479
|
}
|
|
455
480
|
|
|
481
|
+
/** Options used to render and observe a React-compatible error boundary. */
|
|
456
482
|
export interface ErrorBoundaryOptions {
|
|
457
483
|
fallback: (error: Error) => ReactCompatNode;
|
|
458
484
|
onError?: (error: Error) => void;
|
|
459
485
|
}
|
|
460
486
|
|
|
487
|
+
/** Creates an error boundary element with a fallback renderer. */
|
|
461
488
|
export function createErrorBoundary(
|
|
462
489
|
options: ErrorBoundaryOptions,
|
|
463
490
|
children: ReactCompatNode,
|
package/src/event-priority.ts
CHANGED
package/src/event-replay.ts
CHANGED
|
@@ -2,11 +2,13 @@ const queuedHydrationEvents = new WeakMap<Element, QueuedHydrationEvent[]>();
|
|
|
2
2
|
const replayedEvents = new WeakSet<Event>();
|
|
3
3
|
const allowedReplayEventTypes = new Set(["click", "input", "change", "submit"]);
|
|
4
4
|
|
|
5
|
+
/** Serialized map of server-rendered event handlers used for hydration replay. */
|
|
5
6
|
export interface EventHydrationManifest {
|
|
6
7
|
version: 1;
|
|
7
8
|
events: EventHydrationManifestEntry[];
|
|
8
9
|
}
|
|
9
10
|
|
|
11
|
+
/** Single event handler entry in a hydration replay manifest. */
|
|
10
12
|
export interface EventHydrationManifestEntry {
|
|
11
13
|
id: string;
|
|
12
14
|
event: string;
|
|
@@ -22,6 +24,7 @@ export interface HydrationEventReplayOptions {
|
|
|
22
24
|
onCapturedEvent?: (event: Event, target: EventTarget) => void;
|
|
23
25
|
}
|
|
24
26
|
|
|
27
|
+
/** Queues a captured event so it can be replayed after hydration. */
|
|
25
28
|
export function queueHydrationEvent(
|
|
26
29
|
container: Element,
|
|
27
30
|
event: Event,
|
|
@@ -40,10 +43,12 @@ export function queueHydrationEvent(
|
|
|
40
43
|
queuedHydrationEvents.set(container, events);
|
|
41
44
|
}
|
|
42
45
|
|
|
46
|
+
/** Captures supported events on a container until hydration can replay them. */
|
|
43
47
|
export function enableHydrationEventReplay(container: Element): () => void {
|
|
44
48
|
return enableHydrationEventReplayForTypes(container, allowedReplayEventTypes);
|
|
45
49
|
}
|
|
46
50
|
|
|
51
|
+
/** Reads an event hydration manifest script from a document or parent node. */
|
|
47
52
|
export function readEventHydrationManifest(
|
|
48
53
|
root: ParentNode = document,
|
|
49
54
|
): EventHydrationManifest | undefined {
|
|
@@ -64,6 +69,7 @@ export function readEventHydrationManifest(
|
|
|
64
69
|
return value;
|
|
65
70
|
}
|
|
66
71
|
|
|
72
|
+
/** Captures only the event types declared by a hydration manifest. */
|
|
67
73
|
export function enableEventHydrationManifestReplay(
|
|
68
74
|
container: Element,
|
|
69
75
|
manifest: EventHydrationManifest | undefined,
|
package/src/flight-decoder.ts
CHANGED
|
@@ -11,6 +11,7 @@ import type {
|
|
|
11
11
|
FlightTypedArrayName,
|
|
12
12
|
} from "./flight-types.js";
|
|
13
13
|
|
|
14
|
+
/** Options used when resolving client and server references while decoding Flight models. */
|
|
14
15
|
export interface DecodeFlightOptions {
|
|
15
16
|
loadClientReference(reference: FlightClientReference): ElementType<Record<string, unknown>>;
|
|
16
17
|
callServerReference?(
|
package/src/flight-protocol.ts
CHANGED
|
@@ -56,12 +56,14 @@ export const reactFlightModelTokens = [
|
|
|
56
56
|
|
|
57
57
|
export type ReactFlightBinaryRowTag = (typeof reactFlightBinaryRowTags)[number];
|
|
58
58
|
|
|
59
|
+
/** Lists the React Flight row tags and model tokens recognized by this package. */
|
|
59
60
|
export interface ReactFlightProtocolCoverage {
|
|
60
61
|
binaryRowTags: string[];
|
|
61
62
|
modelTokens: string[];
|
|
62
63
|
rowTags: string[];
|
|
63
64
|
}
|
|
64
65
|
|
|
66
|
+
/** Returns the React Flight protocol markers currently covered by the decoder. */
|
|
65
67
|
export function getReactFlightProtocolCoverage(): ReactFlightProtocolCoverage {
|
|
66
68
|
return {
|
|
67
69
|
binaryRowTags: [...reactFlightBinaryRowTags],
|
package/src/flight-types.ts
CHANGED
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
/** Client module reference carried by a Flight response. */
|
|
1
2
|
export interface FlightClientReference {
|
|
2
3
|
id: number;
|
|
3
4
|
moduleId: string;
|
|
@@ -5,6 +6,7 @@ export interface FlightClientReference {
|
|
|
5
6
|
chunks?: string[];
|
|
6
7
|
}
|
|
7
8
|
|
|
9
|
+
/** Server action reference carried by a Flight response. */
|
|
8
10
|
export interface FlightServerReference {
|
|
9
11
|
id: number;
|
|
10
12
|
moduleId: string;
|
|
@@ -12,6 +14,7 @@ export interface FlightServerReference {
|
|
|
12
14
|
bound?: FlightModel[];
|
|
13
15
|
}
|
|
14
16
|
|
|
17
|
+
/** Parsed React Flight response with root model and reference tables. */
|
|
15
18
|
export interface FlightResponse {
|
|
16
19
|
version: 1;
|
|
17
20
|
root: FlightModel;
|
|
@@ -19,6 +22,7 @@ export interface FlightResponse {
|
|
|
19
22
|
serverReferences: FlightServerReference[];
|
|
20
23
|
}
|
|
21
24
|
|
|
25
|
+
/** Serializable model value supported by the mreact Flight decoder. */
|
|
22
26
|
export type FlightModel =
|
|
23
27
|
| null
|
|
24
28
|
| string
|
|
@@ -49,6 +53,7 @@ export interface FlightObjectModel {
|
|
|
49
53
|
[key: string]: FlightModel | undefined;
|
|
50
54
|
}
|
|
51
55
|
|
|
56
|
+
/** Flight model record for a rendered element. */
|
|
52
57
|
export interface FlightElementModel {
|
|
53
58
|
kind: "element";
|
|
54
59
|
type: string | FlightClientReferenceModel | { kind: "fragment" };
|
|
@@ -56,56 +61,67 @@ export interface FlightElementModel {
|
|
|
56
61
|
props: Record<string, FlightModel>;
|
|
57
62
|
}
|
|
58
63
|
|
|
64
|
+
/** Flight model record that points at a client reference table entry. */
|
|
59
65
|
export interface FlightClientReferenceModel {
|
|
60
66
|
kind: "client-reference";
|
|
61
67
|
id: number;
|
|
62
68
|
}
|
|
63
69
|
|
|
70
|
+
/** Flight model record that points at a server reference table entry. */
|
|
64
71
|
export interface FlightServerReferenceModel {
|
|
65
72
|
kind: "server-reference";
|
|
66
73
|
id: number;
|
|
67
74
|
}
|
|
68
75
|
|
|
76
|
+
/** Flight model record for a Date value. */
|
|
69
77
|
export interface FlightDateModel {
|
|
70
78
|
kind: "date";
|
|
71
79
|
value: string;
|
|
72
80
|
}
|
|
73
81
|
|
|
82
|
+
/** Flight model record for a bigint value. */
|
|
74
83
|
export interface FlightBigIntModel {
|
|
75
84
|
kind: "bigint";
|
|
76
85
|
value: string;
|
|
77
86
|
}
|
|
78
87
|
|
|
88
|
+
/** Flight model record for non-finite or negative-zero numbers. */
|
|
79
89
|
export interface FlightNumberModel {
|
|
80
90
|
kind: "number";
|
|
81
91
|
value: "Infinity" | "-Infinity" | "NaN" | "-0";
|
|
82
92
|
}
|
|
83
93
|
|
|
94
|
+
/** Flight model record for a global symbol. */
|
|
84
95
|
export interface FlightSymbolModel {
|
|
85
96
|
kind: "symbol";
|
|
86
97
|
name: string;
|
|
87
98
|
}
|
|
88
99
|
|
|
100
|
+
/** Flight model record for a Map value. */
|
|
89
101
|
export interface FlightMapModel {
|
|
90
102
|
kind: "map";
|
|
91
103
|
entries: [FlightModel, FlightModel][];
|
|
92
104
|
}
|
|
93
105
|
|
|
106
|
+
/** Flight model record for a Set value. */
|
|
94
107
|
export interface FlightSetModel {
|
|
95
108
|
kind: "set";
|
|
96
109
|
values: FlightModel[];
|
|
97
110
|
}
|
|
98
111
|
|
|
112
|
+
/** Flight model record for a FormData value. */
|
|
99
113
|
export interface FlightFormDataModel {
|
|
100
114
|
kind: "form-data";
|
|
101
115
|
entries: [string, FlightModel][];
|
|
102
116
|
}
|
|
103
117
|
|
|
118
|
+
/** Flight model record for an iterable value encoded as an array. */
|
|
104
119
|
export interface FlightIterableModel {
|
|
105
120
|
kind: "iterable";
|
|
106
121
|
values: FlightModel[];
|
|
107
122
|
}
|
|
108
123
|
|
|
124
|
+
/** Flight model record for an error thrown while decoding. */
|
|
109
125
|
export interface FlightErrorModel {
|
|
110
126
|
kind: "error";
|
|
111
127
|
name: string;
|
|
@@ -113,27 +129,32 @@ export interface FlightErrorModel {
|
|
|
113
129
|
digest?: string;
|
|
114
130
|
}
|
|
115
131
|
|
|
132
|
+
/** Flight model record for a pending promise chunk. */
|
|
116
133
|
export interface FlightPromiseModel {
|
|
117
134
|
kind: "promise";
|
|
118
135
|
id: number;
|
|
119
136
|
}
|
|
120
137
|
|
|
138
|
+
/** Flight model record for an ArrayBuffer value. */
|
|
121
139
|
export interface FlightArrayBufferModel {
|
|
122
140
|
kind: "array-buffer";
|
|
123
141
|
bytes: number[];
|
|
124
142
|
}
|
|
125
143
|
|
|
144
|
+
/** Flight model record for a typed array value. */
|
|
126
145
|
export interface FlightTypedArrayModel {
|
|
127
146
|
kind: "typed-array";
|
|
128
147
|
arrayType: FlightTypedArrayName;
|
|
129
148
|
bytes: number[];
|
|
130
149
|
}
|
|
131
150
|
|
|
151
|
+
/** Flight model record for a DataView value. */
|
|
132
152
|
export interface FlightDataViewModel {
|
|
133
153
|
kind: "data-view";
|
|
134
154
|
bytes: number[];
|
|
135
155
|
}
|
|
136
156
|
|
|
157
|
+
/** Typed array constructor names supported by the Flight decoder. */
|
|
137
158
|
export type FlightTypedArrayName =
|
|
138
159
|
| "Int8Array"
|
|
139
160
|
| "Uint8Array"
|
package/src/flight.ts
CHANGED
|
@@ -57,6 +57,7 @@ export type {
|
|
|
57
57
|
};
|
|
58
58
|
export type { ReactFlightProtocolCoverage };
|
|
59
59
|
|
|
60
|
+
/** Options for creating a fetch-based server reference caller. */
|
|
60
61
|
export interface FetchServerReferenceCallerOptions {
|
|
61
62
|
fetch?: typeof fetch;
|
|
62
63
|
headers?: Record<string, string>;
|
|
@@ -67,14 +68,17 @@ export interface FetchServerReferenceCallerOptions {
|
|
|
67
68
|
nonce?: string | (() => string);
|
|
68
69
|
}
|
|
69
70
|
|
|
71
|
+
/** Options for decoding a Flight response and hydrating it into a DOM container. */
|
|
70
72
|
export interface HydrateFlightOptions extends DecodeFlightOptions {
|
|
71
73
|
hydrate?: HydrateRootOptions;
|
|
72
74
|
}
|
|
73
75
|
|
|
76
|
+
/** Parses a serialized Flight payload into a Flight response object. */
|
|
74
77
|
export function parseFlightResponse(payload: string | ArrayBuffer | Uint8Array): FlightResponse {
|
|
75
78
|
return parseReactFlightPayload(payload);
|
|
76
79
|
}
|
|
77
80
|
|
|
81
|
+
/** Decodes the root model from a parsed Flight response. */
|
|
78
82
|
export function decodeFlightResponse(
|
|
79
83
|
response: FlightResponse,
|
|
80
84
|
options: DecodeFlightOptions,
|
|
@@ -82,6 +86,7 @@ export function decodeFlightResponse(
|
|
|
82
86
|
return decodeFlightModel(response.root, response, options) as ReactCompatNode;
|
|
83
87
|
}
|
|
84
88
|
|
|
89
|
+
/** Reads and parses a Flight response script from a document or parent node. */
|
|
85
90
|
export function readFlightResponse(
|
|
86
91
|
root: Document | ParentNode,
|
|
87
92
|
id?: string,
|
|
@@ -99,6 +104,7 @@ export function readFlightResponse(
|
|
|
99
104
|
return parseFlightResponse(script.textContent);
|
|
100
105
|
}
|
|
101
106
|
|
|
107
|
+
/** Decodes a Flight response and hydrates the resulting tree into a container. */
|
|
102
108
|
export function hydrateFlightResponse(
|
|
103
109
|
container: Element,
|
|
104
110
|
response: FlightResponse,
|
|
@@ -107,6 +113,7 @@ export function hydrateFlightResponse(
|
|
|
107
113
|
return hydrateRoot(container, decodeFlightResponse(response, options), options.hydrate);
|
|
108
114
|
}
|
|
109
115
|
|
|
116
|
+
/** Creates a server reference caller that POSTs encoded action invocations to an endpoint. */
|
|
110
117
|
export function createFetchServerReferenceCaller(
|
|
111
118
|
endpoint: string,
|
|
112
119
|
options: FetchServerReferenceCallerOptions = {},
|
package/src/hooks-entry.ts
CHANGED
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
/** React-compatible hook and transition APIs for the hooks subpath. */
|
|
1
2
|
export {
|
|
2
3
|
useCallback,
|
|
3
4
|
useDebugValue,
|
|
@@ -21,4 +22,5 @@ export {
|
|
|
21
22
|
useTransition,
|
|
22
23
|
version,
|
|
23
24
|
} from "./hooks.js";
|
|
25
|
+
/** Transition function types for the hooks subpath. */
|
|
24
26
|
export type { StartTransition, TransitionScope } from "./hooks.js";
|