autosuspense 0.1.13 → 0.2.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.
Files changed (38) hide show
  1. package/dist/components/suspense/AutoSuspense.d.ts +1 -1
  2. package/dist/components/suspense/AutoSuspense.d.ts.map +1 -1
  3. package/dist/components/suspense/AutoSuspense.js +4 -9
  4. package/dist/functions/Suspend.d.ts +4 -0
  5. package/dist/functions/Suspend.d.ts.map +1 -0
  6. package/dist/functions/Suspend.js +22 -0
  7. package/dist/functions/index.d.ts +3 -0
  8. package/dist/functions/index.d.ts.map +1 -0
  9. package/dist/functions/index.js +2 -0
  10. package/dist/hooks/index.d.ts +1 -2
  11. package/dist/hooks/index.d.ts.map +1 -1
  12. package/dist/hooks/index.js +1 -2
  13. package/dist/hooks/useSuspenseBoundary.d.ts +3 -0
  14. package/dist/hooks/useSuspenseBoundary.d.ts.map +1 -0
  15. package/dist/hooks/useSuspenseBoundary.js +19 -0
  16. package/dist/hooks/useSuspenseFallback.d.ts.map +1 -1
  17. package/dist/hooks/useSuspenseFallback.js +5 -4
  18. package/dist/index.d.ts +2 -1
  19. package/dist/index.d.ts.map +1 -1
  20. package/dist/index.js +2 -1
  21. package/dist/types/FallbackRegistry.d.ts +6 -2
  22. package/dist/types/FallbackRegistry.d.ts.map +1 -1
  23. package/dist/utils/renderNode.d.ts.map +1 -1
  24. package/dist/utils/renderNode.js +8 -2
  25. package/package.json +1 -1
  26. package/src/components/suspense/AutoSuspense.tsx +8 -12
  27. package/src/functions/Suspend.tsx +33 -0
  28. package/src/functions/index.ts +2 -0
  29. package/src/hooks/index.ts +1 -2
  30. package/src/hooks/useSuspenseBoundary.ts +22 -0
  31. package/src/hooks/useSuspenseFallback.ts +5 -4
  32. package/src/index.ts +2 -1
  33. package/src/types/FallbackRegistry.ts +7 -2
  34. package/src/utils/renderNode.tsx +28 -0
  35. package/tsconfig.tsbuildinfo +1 -1
  36. package/src/hooks/useSuspenseProvider.ts +0 -0
  37. package/src/types/PrefabFactory.ts +0 -5
  38. package/src/utils/renderNode.ts +0 -20
@@ -1,6 +1,6 @@
1
1
  import * as React from "react";
2
2
  export declare const AutoSuspense: ({ children, prefab, }: {
3
3
  children: React.ReactNode;
4
- prefab?: Record<string, React.ReactElement>;
4
+ prefab?: Record<string, React.ReactElement | React.ComponentType<any>>;
5
5
  }) => JSX.Element;
6
6
  //# sourceMappingURL=AutoSuspense.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"AutoSuspense.d.ts","sourceRoot":"","sources":["../../../src/components/suspense/AutoSuspense.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAU/B,eAAO,MAAM,YAAY,GAAI,uBAG1B;IACD,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,MAAM,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,KAAK,CAAC,YAAY,CAAC,CAAC;CAC7C,gBAqBA,CAAC"}
1
+ {"version":3,"file":"AutoSuspense.d.ts","sourceRoot":"","sources":["../../../src/components/suspense/AutoSuspense.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAS/B,eAAO,MAAM,YAAY,0BAGtB;IACD,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,MAAM,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,KAAK,CAAC,YAAY,GAAG,KAAK,CAAC,aAAa,CAAC,GAAG,CAAC,CAAC,CAAC;CACxE,gBAkBA,CAAC"}
@@ -6,16 +6,11 @@ import { defaultPrefab } from "../prefabs/defaultPrefab";
6
6
  export const AutoSuspense = ({ children, prefab = defaultPrefab, }) => {
7
7
  const registryRef = React.useRef({
8
8
  nodes: new Map(),
9
- currentParent: null,
10
9
  prebuild: new Map(Object.entries(prefab)),
11
10
  });
12
- if (registryRef.current === null) {
13
- registryRef.current = {
14
- nodes: new Map(),
15
- currentParent: null,
16
- prebuild: new Map(Object.entries(prefab)),
17
- };
18
- }
19
11
  const fallback = _jsx(GeneratedFallback, { registry: registryRef.current });
20
- return (_jsx(FallbackContext.Provider, { value: registryRef.current, children: _jsx(React.Suspense, { fallback: fallback, children: children }) }));
12
+ return (_jsx(FallbackContext.Provider, { value: {
13
+ registry: registryRef.current,
14
+ parentId: null,
15
+ }, children: _jsx(React.Suspense, { fallback: fallback, children: children }) }));
21
16
  };
@@ -0,0 +1,4 @@
1
+ import * as React from "react";
2
+ import { FallbackDescriptor } from "../types/FallbackRegistry";
3
+ export declare function Suspend<T extends object>(Component: React.ComponentType<T>, fallback?: FallbackDescriptor): (props: T) => JSX.Element;
4
+ //# sourceMappingURL=Suspend.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Suspend.d.ts","sourceRoot":"","sources":["../../src/functions/Suspend.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAmB,kBAAkB,EAAE,MAAM,2BAA2B,CAAC;AAGhF,wBAAgB,OAAO,CAAC,CAAC,SAAS,MAAM,EACtC,SAAS,EAAE,KAAK,CAAC,aAAa,CAAC,CAAC,CAAC,EACjC,QAAQ,CAAC,EAAE,kBAAkB,WAEE,CAAC,iBAwBjC"}
@@ -0,0 +1,22 @@
1
+ import { jsx as _jsx } from "react/jsx-runtime";
2
+ import * as React from "react";
3
+ import { FallbackContext } from "../types/FallbackRegistry";
4
+ import { useCompatId } from "../hooks/useCompatId";
5
+ export function Suspend(Component, fallback) {
6
+ return function Wrapped(props) {
7
+ const ctx = React.useContext(FallbackContext);
8
+ const id = useCompatId();
9
+ if (!ctx) {
10
+ return _jsx(Component, { ...props });
11
+ }
12
+ const { registry, parentId } = ctx;
13
+ if (!registry.nodes.has(id)) {
14
+ registry.nodes.set(id, {
15
+ id,
16
+ element: fallback ?? Component,
17
+ parent: parentId,
18
+ });
19
+ }
20
+ return (_jsx(FallbackContext.Provider, { value: { registry, parentId: id }, children: _jsx(Component, { ...props }) }));
21
+ };
22
+ }
@@ -0,0 +1,3 @@
1
+ import { Suspend } from "./Suspend";
2
+ export { Suspend };
3
+ //# sourceMappingURL=index.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/functions/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AACpC,OAAO,EAAC,OAAO,EAAC,CAAC"}
@@ -0,0 +1,2 @@
1
+ import { Suspend } from "./Suspend";
2
+ export { Suspend };
@@ -1,3 +1,2 @@
1
- import { useSuspenseFallback } from "./useSuspenseFallback";
2
- export { useSuspenseFallback };
1
+ export {};
3
2
  //# sourceMappingURL=index.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/hooks/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,mBAAmB,EAAE,MAAM,uBAAuB,CAAC;AAC5D,OAAO,EAAE,mBAAmB,EAAE,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/hooks/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,CAAC"}
@@ -1,2 +1 @@
1
- import { useSuspenseFallback } from "./useSuspenseFallback";
2
- export { useSuspenseFallback };
1
+ export {};
@@ -0,0 +1,3 @@
1
+ import { FallbackDescriptor } from "../types/FallbackRegistry";
2
+ export declare function useSuspenseBoundary(element: FallbackDescriptor): void;
3
+ //# sourceMappingURL=useSuspenseBoundary.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"useSuspenseBoundary.d.ts","sourceRoot":"","sources":["../../src/hooks/useSuspenseBoundary.ts"],"names":[],"mappings":"AACA,OAAO,EAAmB,kBAAkB,EAAE,MAAM,2BAA2B,CAAC;AAGhF,wBAAgB,mBAAmB,CAAC,OAAO,EAAE,kBAAkB,GAAG,IAAI,CAiBrE"}
@@ -0,0 +1,19 @@
1
+ import { useContext } from "react";
2
+ import { FallbackContext } from "../types/FallbackRegistry";
3
+ import { useCompatId } from "./useCompatId";
4
+ export function useSuspenseBoundary(element) {
5
+ const registry = useContext(FallbackContext);
6
+ const id = useCompatId();
7
+ if (!registry)
8
+ return;
9
+ if (registry.registry.nodes.has(id))
10
+ return;
11
+ const parentId = registry.parentId;
12
+ registry.registry.nodes.set(id, {
13
+ id,
14
+ element,
15
+ parent: parentId,
16
+ isBoundary: true,
17
+ });
18
+ registry.parentId = id;
19
+ }
@@ -1 +1 @@
1
- {"version":3,"file":"useSuspenseFallback.d.ts","sourceRoot":"","sources":["../../src/hooks/useSuspenseFallback.ts"],"names":[],"mappings":"AACA,OAAO,EAAmB,kBAAkB,EAAE,MAAM,2BAA2B,CAAC;AAGhF,wBAAgB,mBAAmB,CAAC,OAAO,EAAE,kBAAkB,GAAG,IAAI,CAgBrE"}
1
+ {"version":3,"file":"useSuspenseFallback.d.ts","sourceRoot":"","sources":["../../src/hooks/useSuspenseFallback.ts"],"names":[],"mappings":"AACA,OAAO,EAAmB,kBAAkB,EAAE,MAAM,2BAA2B,CAAC;AAIhF,wBAAgB,mBAAmB,CAAC,OAAO,EAAE,kBAAkB,GAAG,IAAI,CAgBrE"}
@@ -1,18 +1,19 @@
1
1
  import { useContext } from "react";
2
2
  import { FallbackContext } from "../types/FallbackRegistry";
3
3
  import { useCompatId } from "./useCompatId";
4
+ // Depricated hook, core logic changed
4
5
  export function useSuspenseFallback(element) {
5
6
  const registry = useContext(FallbackContext);
6
7
  const id = useCompatId();
7
8
  if (!registry)
8
9
  return;
9
- if (registry.nodes.has(id))
10
+ if (registry.registry.nodes.has(id))
10
11
  return;
11
- const parentId = registry.currentParent;
12
- registry.nodes.set(id, {
12
+ const parentId = registry.parentId;
13
+ registry.registry.nodes.set(id, {
13
14
  id,
14
15
  element,
15
16
  parent: parentId,
16
17
  });
17
- registry.currentParent = id;
18
+ registry.parentId = id;
18
19
  }
package/dist/index.d.ts CHANGED
@@ -1,3 +1,4 @@
1
1
  export { AutoSuspense } from "./components";
2
- export { useSuspenseFallback } from "./hooks";
2
+ export * from "./hooks";
3
+ export * from "./functions";
3
4
  //# sourceMappingURL=index.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,cAAc,CAAC;AAC5C,OAAO,EAAE,mBAAmB,EAAE,MAAM,SAAS,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,cAAc,CAAC;AAC5C,cAAc,SAAS,CAAC;AACxB,cAAc,aAAa,CAAC"}
package/dist/index.js CHANGED
@@ -1,2 +1,3 @@
1
1
  export { AutoSuspense } from "./components";
2
- export { useSuspenseFallback } from "./hooks";
2
+ export * from "./hooks";
3
+ export * from "./functions";
@@ -3,12 +3,16 @@ export type Node = {
3
3
  id: string;
4
4
  element: FallbackDescriptor;
5
5
  parent: string | null;
6
+ isBoundary?: boolean;
6
7
  };
7
8
  export type FallbackRegistry = {
8
9
  nodes: Map<string, Node>;
9
- currentParent: string | null;
10
10
  prebuild: Map<string, React.ReactElement | React.ComponentType<any>>;
11
11
  };
12
12
  export type FallbackDescriptor = string | React.ReactElement | React.ComponentType;
13
- export declare const FallbackContext: React.Context<FallbackRegistry | null>;
13
+ export type FallbackContextValue = {
14
+ registry: FallbackRegistry;
15
+ parentId: string | null;
16
+ };
17
+ export declare const FallbackContext: React.Context<FallbackContextValue | null>;
14
18
  //# sourceMappingURL=FallbackRegistry.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"FallbackRegistry.d.ts","sourceRoot":"","sources":["../../src/types/FallbackRegistry.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,MAAM,MAAM,IAAI,GAAG;IACjB,EAAE,EAAE,MAAM,CAAC;IACX,OAAO,EAAE,kBAAkB,CAAC;IAC5B,MAAM,EAAE,MAAM,GAAG,IAAI,CAAC;CACvB,CAAC;AAEF,MAAM,MAAM,gBAAgB,GAAG;IAC7B,KAAK,EAAE,GAAG,CAAC,MAAM,EAAE,IAAI,CAAC,CAAC;IACzB,aAAa,EAAE,MAAM,GAAG,IAAI,CAAC;IAC7B,QAAQ,EAAE,GAAG,CAAC,MAAM,EAAE,KAAK,CAAC,YAAY,GAAG,KAAK,CAAC,aAAa,CAAC,GAAG,CAAC,CAAC,CAAC;CACtE,CAAC;AAEF,MAAM,MAAM,kBAAkB,GAC1B,MAAM,GACN,KAAK,CAAC,YAAY,GAClB,KAAK,CAAC,aAAa,CAAC;AAExB,eAAO,MAAM,eAAe,wCAE3B,CAAC"}
1
+ {"version":3,"file":"FallbackRegistry.d.ts","sourceRoot":"","sources":["../../src/types/FallbackRegistry.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,MAAM,MAAM,IAAI,GAAG;IACjB,EAAE,EAAE,MAAM,CAAC;IACX,OAAO,EAAE,kBAAkB,CAAC;IAC5B,MAAM,EAAE,MAAM,GAAG,IAAI,CAAC;IACtB,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB,CAAC;AAEF,MAAM,MAAM,gBAAgB,GAAG;IAC7B,KAAK,EAAE,GAAG,CAAC,MAAM,EAAE,IAAI,CAAC,CAAC;IACzB,QAAQ,EAAE,GAAG,CAAC,MAAM,EAAE,KAAK,CAAC,YAAY,GAAG,KAAK,CAAC,aAAa,CAAC,GAAG,CAAC,CAAC,CAAC;CACtE,CAAC;AAEF,MAAM,MAAM,kBAAkB,GAC1B,MAAM,GACN,KAAK,CAAC,YAAY,GAClB,KAAK,CAAC,aAAa,CAAC;AAExB,MAAM,MAAM,oBAAoB,GAAG;IACjC,QAAQ,EAAE,gBAAgB,CAAC;IAC3B,QAAQ,EAAE,MAAM,GAAG,IAAI,CAAC;CACzB,CAAC;AAEF,eAAO,MAAM,eAAe,4CAE3B,CAAC"}
@@ -1 +1 @@
1
- {"version":3,"file":"renderNode.d.ts","sourceRoot":"","sources":["../../src/utils/renderNode.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,KAAK,EAAE,gBAAgB,EAAE,IAAI,EAAE,MAAM,2BAA2B,CAAC;AAGxE,wBAAgB,UAAU,CAExB,IAAI,EAAE,IAAI,EACV,QAAQ,EAAE,GAAG,CAAC,MAAM,GAAG,IAAI,EAAE,IAAI,EAAE,CAAC,EACpC,QAAQ,EAAE,gBAAgB,GACzB,KAAK,CAAC,YAAY,GAAG,IAAI,CAU3B"}
1
+ {"version":3,"file":"renderNode.d.ts","sourceRoot":"","sources":["../../src/utils/renderNode.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAmB,MAAM,OAAO,CAAC;AACxC,OAAO,KAAK,EAAE,gBAAgB,EAAE,IAAI,EAAE,MAAM,2BAA2B,CAAC;AAIxE,wBAAgB,UAAU,CACxB,IAAI,EAAE,IAAI,EACV,QAAQ,EAAE,GAAG,CAAC,MAAM,GAAG,IAAI,EAAE,IAAI,EAAE,CAAC,EACpC,QAAQ,EAAE,gBAAgB,GACzB,KAAK,CAAC,YAAY,GAAG,IAAI,CAkB3B"}
@@ -1,9 +1,15 @@
1
- import React from "react";
1
+ import { jsx as _jsx } from "react/jsx-runtime";
2
+ import React, { Suspense } from "react";
2
3
  import { resolveElement } from "./resolveElement";
4
+ import { Block } from "../components/prefabs/prebuilt/Block";
3
5
  export function renderNode(node, childMap, registry) {
4
6
  const children = childMap.get(node.id) ?? [];
5
7
  const resolvedEle = resolveElement(node.element, registry);
6
8
  if (!resolvedEle)
7
9
  return null;
8
- return React.cloneElement(resolvedEle, { key: node.id }, children.map((child) => renderNode(child, childMap, registry)));
10
+ const renderedChildren = children.map((child) => renderNode(child, childMap, registry));
11
+ if (node.isBoundary) {
12
+ return (_jsx(Suspense, { fallback: _jsx(Block, {}), children: React.cloneElement(resolvedEle, {}, renderedChildren) }, node.id));
13
+ }
14
+ return React.cloneElement(resolvedEle, { key: node.id }, renderedChildren);
9
15
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "autosuspense",
3
- "version": "0.1.13",
3
+ "version": "0.2.0",
4
4
  "description": "Automatic suspense wiring block for React.",
5
5
  "license": "ISC",
6
6
  "type": "commonjs",
@@ -6,33 +6,29 @@ import {
6
6
  FallbackRegistry,
7
7
  } from "../../types/FallbackRegistry";
8
8
  import { defaultPrefab } from "../prefabs/defaultPrefab";
9
- import { PrefabFactory } from "../../types/PrefabFactory";
10
9
 
11
10
  export const AutoSuspense = ({
12
11
  children,
13
12
  prefab = defaultPrefab,
14
13
  }: {
15
14
  children: React.ReactNode;
16
- prefab?: Record<string, React.ReactElement>;
15
+ prefab?: Record<string, React.ReactElement | React.ComponentType<any>>;
17
16
  }) => {
18
17
  const registryRef = React.useRef<FallbackRegistry>({
19
18
  nodes: new Map(),
20
- currentParent: null,
21
19
  prebuild: new Map(Object.entries(prefab)),
22
20
  });
23
21
 
24
- if (registryRef.current === null) {
25
- registryRef.current = {
26
- nodes: new Map(),
27
- currentParent: null,
28
- prebuild: new Map(Object.entries(prefab)),
29
- };
30
- }
31
22
  const fallback = <GeneratedFallback registry={registryRef.current} />;
32
23
 
33
24
  return (
34
- <FallbackContext.Provider value={registryRef.current}>
35
- <React.Suspense fallback={fallback}>{children}</React.Suspense>
25
+ <FallbackContext.Provider
26
+ value={{
27
+ registry: registryRef.current,
28
+ parentId: null,
29
+ }}
30
+ >
31
+ <React.Suspense fallback={fallback}>{children}</React.Suspense>
36
32
  </FallbackContext.Provider>
37
33
  );
38
34
  };
@@ -0,0 +1,33 @@
1
+ import * as React from "react";
2
+ import { FallbackContext, FallbackDescriptor } from "../types/FallbackRegistry";
3
+ import { useCompatId } from "../hooks/useCompatId";
4
+
5
+ export function Suspend<T extends object>(
6
+ Component: React.ComponentType<T>,
7
+ fallback?: FallbackDescriptor,
8
+ ) {
9
+ return function Wrapped(props: T) {
10
+ const ctx = React.useContext(FallbackContext);
11
+ const id = useCompatId();
12
+
13
+ if (!ctx) {
14
+ return <Component {...props} />;
15
+ }
16
+
17
+ const { registry, parentId } = ctx;
18
+
19
+ if (!registry.nodes.has(id)) {
20
+ registry.nodes.set(id, {
21
+ id,
22
+ element: fallback ?? (Component as React.ComponentType<any>),
23
+ parent: parentId,
24
+ });
25
+ }
26
+
27
+ return (
28
+ <FallbackContext.Provider value={{ registry, parentId: id }}>
29
+ <Component {...props} />
30
+ </FallbackContext.Provider>
31
+ );
32
+ };
33
+ }
@@ -0,0 +1,2 @@
1
+ import { Suspend } from "./Suspend";
2
+ export { Suspend };
@@ -1,2 +1 @@
1
- import { useSuspenseFallback } from "./useSuspenseFallback";
2
- export { useSuspenseFallback };
1
+ export {};
@@ -0,0 +1,22 @@
1
+ import { useContext } from "react";
2
+ import { FallbackContext, FallbackDescriptor } from "../types/FallbackRegistry";
3
+ import { useCompatId } from "./useCompatId";
4
+
5
+ export function useSuspenseBoundary(element: FallbackDescriptor): void {
6
+ const registry = useContext(FallbackContext);
7
+ const id = useCompatId();
8
+
9
+ if (!registry) return;
10
+ if (registry.registry.nodes.has(id)) return;
11
+
12
+ const parentId = registry.parentId;
13
+
14
+ registry.registry.nodes.set(id, {
15
+ id,
16
+ element,
17
+ parent: parentId,
18
+ isBoundary: true,
19
+ });
20
+
21
+ registry.parentId = id;
22
+ }
@@ -2,20 +2,21 @@ import { useContext } from "react";
2
2
  import { FallbackContext, FallbackDescriptor } from "../types/FallbackRegistry";
3
3
  import { useCompatId } from "./useCompatId";
4
4
 
5
+ // Depricated hook, core logic changed
5
6
  export function useSuspenseFallback(element: FallbackDescriptor): void {
6
7
  const registry = useContext(FallbackContext);
7
8
  const id = useCompatId();
8
9
 
9
10
  if (!registry) return;
10
- if (registry.nodes.has(id)) return;
11
+ if (registry.registry.nodes.has(id)) return;
11
12
 
12
- const parentId = registry.currentParent;
13
+ const parentId = registry.parentId;
13
14
 
14
- registry.nodes.set(id, {
15
+ registry.registry.nodes.set(id, {
15
16
  id,
16
17
  element,
17
18
  parent: parentId,
18
19
  });
19
20
 
20
- registry.currentParent = id;
21
+ registry.parentId = id;
21
22
  }
package/src/index.ts CHANGED
@@ -1,2 +1,3 @@
1
1
  export { AutoSuspense } from "./components";
2
- export { useSuspenseFallback } from "./hooks";
2
+ export * from "./hooks";
3
+ export * from "./functions";
@@ -4,11 +4,11 @@ export type Node = {
4
4
  id: string;
5
5
  element: FallbackDescriptor;
6
6
  parent: string | null;
7
+ isBoundary?: boolean;
7
8
  };
8
9
 
9
10
  export type FallbackRegistry = {
10
11
  nodes: Map<string, Node>;
11
- currentParent: string | null;
12
12
  prebuild: Map<string, React.ReactElement | React.ComponentType<any>>;
13
13
  };
14
14
 
@@ -17,6 +17,11 @@ export type FallbackDescriptor =
17
17
  | React.ReactElement
18
18
  | React.ComponentType;
19
19
 
20
- export const FallbackContext = React.createContext<FallbackRegistry | null>(
20
+ export type FallbackContextValue = {
21
+ registry: FallbackRegistry;
22
+ parentId: string | null;
23
+ };
24
+
25
+ export const FallbackContext = React.createContext<FallbackContextValue | null>(
21
26
  null,
22
27
  );
@@ -0,0 +1,28 @@
1
+ import React, { Suspense } from "react";
2
+ import type { FallbackRegistry, Node } from "../types/FallbackRegistry";
3
+ import { resolveElement } from "./resolveElement";
4
+ import { Block } from "../components/prefabs/prebuilt/Block";
5
+
6
+ export function renderNode(
7
+ node: Node,
8
+ childMap: Map<string | null, Node[]>,
9
+ registry: FallbackRegistry,
10
+ ): React.ReactElement | null {
11
+ const children = childMap.get(node.id) ?? [];
12
+ const resolvedEle = resolveElement(node.element, registry);
13
+ if (!resolvedEle) return null;
14
+
15
+ const renderedChildren = children.map((child) =>
16
+ renderNode(child, childMap, registry),
17
+ );
18
+
19
+ if (node.isBoundary) {
20
+ return (
21
+ <Suspense key={node.id} fallback={<Block />}>
22
+ {React.cloneElement(resolvedEle, {}, renderedChildren)}
23
+ </Suspense>
24
+ );
25
+ }
26
+
27
+ return React.cloneElement(resolvedEle, { key: node.id }, renderedChildren);
28
+ }
@@ -1 +1 @@
1
- {"root":["./src/index.ts","./src/components/index.ts","./src/components/prefabs/defaultprefab.tsx","./src/components/prefabs/prebuilt/block.tsx","./src/components/prefabs/prebuilt/card.tsx","./src/components/prefabs/prebuilt/list.tsx","./src/components/suspense/autosuspense.tsx","./src/components/suspense/generatedfallback.tsx","./src/hooks/index.ts","./src/hooks/usecompatid.ts","./src/hooks/usesuspensefallback.ts","./src/hooks/usesuspenseprovider.ts","./src/types/fallbackregistry.ts","./src/utils/buildtree.ts","./src/utils/rendernode.ts","./src/utils/resolveelement.ts"],"version":"5.9.3"}
1
+ {"root":["./src/index.ts","./src/components/index.ts","./src/components/prefabs/defaultprefab.tsx","./src/components/prefabs/prebuilt/block.tsx","./src/components/prefabs/prebuilt/card.tsx","./src/components/prefabs/prebuilt/list.tsx","./src/components/suspense/autosuspense.tsx","./src/components/suspense/generatedfallback.tsx","./src/functions/suspend.tsx","./src/functions/index.ts","./src/hooks/index.ts","./src/hooks/usecompatid.ts","./src/hooks/usesuspenseboundary.ts","./src/hooks/usesuspensefallback.ts","./src/types/fallbackregistry.ts","./src/utils/buildtree.ts","./src/utils/rendernode.tsx","./src/utils/resolveelement.ts"],"version":"5.6.3"}
File without changes
@@ -1,5 +0,0 @@
1
- import * as React from "react";
2
-
3
- export type PrefabFactory = (props: {
4
- children?: React.ReactNode;
5
- }) => React.ReactElement;
@@ -1,20 +0,0 @@
1
- import React from "react";
2
- import type { FallbackRegistry, Node } from "../types/FallbackRegistry";
3
- import { resolveElement } from "./resolveElement";
4
-
5
- export function renderNode(
6
-
7
- node: Node,
8
- childMap: Map<string | null, Node[]>,
9
- registry: FallbackRegistry,
10
- ): React.ReactElement | null {
11
- const children = childMap.get(node.id) ?? [];
12
- const resolvedEle = resolveElement(node.element, registry);
13
- if (!resolvedEle) return null;
14
-
15
- return React.cloneElement(
16
- resolvedEle,
17
- { key: node.id },
18
- children.map((child) => renderNode(child, childMap, registry)),
19
- );
20
- }