@kubb/react-fabric 0.10.0 → 0.11.1

package/dist/{reactPlugin-B4xarQJX.d.cts → reactPlugin-DdQ8nZeK.d.cts}

@@ -1,4 +1,5 @@
-import { o as Plugin } from "./Fabric-C61uYmUy.cjs";
+import { o as Plugin } from "./Fabric-BELBf-bX.cjs";
+import { o as KubbElement } from "./types-f5qVBVRo.cjs";
 import { ElementType } from "react";
 
 //#region src/plugins/reactPlugin.d.ts
@@ -12,15 +13,15 @@ type Options = {
   debug?: boolean;
 };
 type ExtendOptions = {
-  render(App: ElementType): Promise<void>;
-  renderToString(App: ElementType): Promise<string>;
+  render(App: KubbElement | ElementType): Promise<void>;
+  renderToString(App: KubbElement | ElementType): Promise<string>;
   waitUntilExit(): Promise<void>;
 };
 declare global {
   namespace Kubb {
     interface Fabric {
-      render(App: ElementType): Promise<void>;
-      renderToString(App: ElementType): Promise<string>;
+      render(App: KubbElement | ElementType): Promise<void>;
+      renderToString(App: KubbElement | ElementType): Promise<string>;
       waitUntilExit(): Promise<void>;
     }
   }
@@ -28,4 +29,4 @@ declare global {
 declare const reactPlugin: Plugin<Options, ExtendOptions>;
 //#endregion
 export { reactPlugin as n, Options as t };
-//# sourceMappingURL=reactPlugin-B4xarQJX.d.cts.map
+//# sourceMappingURL=reactPlugin-DdQ8nZeK.d.cts.map

package/dist/{types-BL7PkfqA.d.ts → types-QgmDVUxV.d.ts}

@@ -1,6 +1,59 @@
-import { b as Source, g as Import, h as File, p as Export } from "./Fabric-DitK3IEP.js";
+import { b as Source, c as FileManager, g as Import, h as File, p as Export } from "./Fabric-DbJhvsCq.js";
 import React, { JSX, Key, ReactNode } from "react";
 
+//#region ../fabric-core/src/utils/TreeNode.d.ts
+type BarrelData = {
+  file?: File;
+  path: string;
+  name: string;
+};
+type Graph = {
+  nodes: Array<{
+    id: string;
+    label: string;
+  }>;
+  edges: Array<{
+    from: string;
+    to: string;
+  }>;
+};
+declare class TreeNode<TData = unknown> {
+  #private;
+  data: TData;
+  parent?: TreeNode<TData>;
+  children: Array<TreeNode<TData>>;
+  constructor(data: TData, parent?: TreeNode<TData>);
+  addChild(data: TData): TreeNode<TData>;
+  getChildByName(name: string): TreeNode<TData> | undefined;
+  get leaves(): Array<TreeNode<TData>>;
+  forEach(callback: (node: TreeNode<TData>) => void): this;
+  findDeep(predicate: (node: TreeNode<TData>) => boolean): TreeNode<TData> | undefined;
+  static toGraph(root: TreeNode<BarrelData>): Graph;
+  static fromFiles(files: Array<File>, rootFolder?: string): TreeNode<BarrelData> | null;
+}
+//#endregion
+//#region ../fabric-core/src/composables/useNodeTree.d.ts
+type ComponentNode = {
+  type: string;
+  props: Record<string, unknown>;
+};
+//#endregion
+//#region ../fabric-core/src/contexts/RootContext.d.ts
+type RootContextProps = {
+  /**
+   * Exit (unmount) the whole app.
+   */
+  exit: (error?: Error) => void;
+  /**
+   * TreeNode representing the tree structure of the app.
+   */
+  treeNode: TreeNode<ComponentNode>;
+  /**
+   * FileManager instance for managing files within the app.
+   */
+  fileManager: FileManager;
+};
+//#endregion
 //#region ../fabric-core/src/types.d.ts
 type JSDoc = {
   comments: string[];
@@ -102,5 +155,5 @@ type KubbImportProps = Import;
 type KubbExportProps = Export;
 type LineBreakProps = React.DetailedHTMLProps<React.HTMLAttributes<HTMLBRElement>, HTMLBRElement>;
 //#endregion
-export { Params as _, Key as a, KubbFileProps as c, KubbSourceProps as d, KubbTextProps as f, Param as g, FunctionParams as h, ElementNames as i, KubbImportProps as l, TextNode as m, DOMNode as n, KubbElement as o, LineBreakProps as p, DOMNodeAttribute as r, KubbExportProps as s, DOMElement as t, KubbNode as u, createFunctionParams as v, JSDoc as y };
-//# sourceMappingURL=types-BL7PkfqA.d.ts.map
+export { Params as _, Key as a, RootContextProps as b, KubbFileProps as c, KubbSourceProps as d, KubbTextProps as f, Param as g, FunctionParams as h, ElementNames as i, KubbImportProps as l, TextNode as m, DOMNode as n, KubbElement as o, LineBreakProps as p, DOMNodeAttribute as r, KubbExportProps as s, DOMElement as t, KubbNode as u, createFunctionParams as v, ComponentNode as x, JSDoc as y };
+//# sourceMappingURL=types-QgmDVUxV.d.ts.map

package/dist/{types-BdOHT5YF.d.cts → types-f5qVBVRo.d.cts}

@@ -1,6 +1,59 @@
-import { b as Source, g as Import, h as File, p as Export } from "./Fabric-C61uYmUy.cjs";
+import { b as Source, c as FileManager, g as Import, h as File, p as Export } from "./Fabric-BELBf-bX.cjs";
 import React, { JSX, Key, ReactNode } from "react";
 
+//#region ../fabric-core/src/utils/TreeNode.d.ts
+type BarrelData = {
+  file?: File;
+  path: string;
+  name: string;
+};
+type Graph = {
+  nodes: Array<{
+    id: string;
+    label: string;
+  }>;
+  edges: Array<{
+    from: string;
+    to: string;
+  }>;
+};
+declare class TreeNode<TData = unknown> {
+  #private;
+  data: TData;
+  parent?: TreeNode<TData>;
+  children: Array<TreeNode<TData>>;
+  constructor(data: TData, parent?: TreeNode<TData>);
+  addChild(data: TData): TreeNode<TData>;
+  getChildByName(name: string): TreeNode<TData> | undefined;
+  get leaves(): Array<TreeNode<TData>>;
+  forEach(callback: (node: TreeNode<TData>) => void): this;
+  findDeep(predicate: (node: TreeNode<TData>) => boolean): TreeNode<TData> | undefined;
+  static toGraph(root: TreeNode<BarrelData>): Graph;
+  static fromFiles(files: Array<File>, rootFolder?: string): TreeNode<BarrelData> | null;
+}
+//#endregion
+//#region ../fabric-core/src/composables/useNodeTree.d.ts
+type ComponentNode = {
+  type: string;
+  props: Record<string, unknown>;
+};
+//#endregion
+//#region ../fabric-core/src/contexts/RootContext.d.ts
+type RootContextProps = {
+  /**
+   * Exit (unmount) the whole app.
+   */
+  exit: (error?: Error) => void;
+  /**
+   * TreeNode representing the tree structure of the app.
+   */
+  treeNode: TreeNode<ComponentNode>;
+  /**
+   * FileManager instance for managing files within the app.
+   */
+  fileManager: FileManager;
+};
+//#endregion
 //#region ../fabric-core/src/types.d.ts
 type JSDoc = {
   comments: string[];
@@ -102,5 +155,5 @@ type KubbImportProps = Import;
 type KubbExportProps = Export;
 type LineBreakProps = React.DetailedHTMLProps<React.HTMLAttributes<HTMLBRElement>, HTMLBRElement>;
 //#endregion
-export { Params as _, Key as a, KubbFileProps as c, KubbSourceProps as d, KubbTextProps as f, Param as g, FunctionParams as h, ElementNames as i, KubbImportProps as l, TextNode as m, DOMNode as n, KubbElement as o, LineBreakProps as p, DOMNodeAttribute as r, KubbExportProps as s, DOMElement as t, KubbNode as u, createFunctionParams as v, JSDoc as y };
-//# sourceMappingURL=types-BdOHT5YF.d.cts.map
+export { Params as _, Key as a, RootContextProps as b, KubbFileProps as c, KubbSourceProps as d, KubbTextProps as f, Param as g, FunctionParams as h, ElementNames as i, KubbImportProps as l, TextNode as m, DOMNode as n, KubbElement as o, LineBreakProps as p, DOMNodeAttribute as r, KubbExportProps as s, DOMElement as t, KubbNode as u, createFunctionParams as v, ComponentNode as x, JSDoc as y };
+//# sourceMappingURL=types-f5qVBVRo.d.cts.map

package/dist/types.d.cts

@@ -1,3 +1,3 @@
-import { _ as KubbFile_d_exports, a as FabricOptions, i as FabricMode, n as FabricConfig, r as FabricContext } from "./Fabric-C61uYmUy.cjs";
-import { _ as Params, a as Key, c as KubbFileProps, d as KubbSourceProps, f as KubbTextProps, g as Param, i as ElementNames, l as KubbImportProps, m as TextNode, n as DOMNode, o as KubbElement, p as LineBreakProps, r as DOMNodeAttribute, s as KubbExportProps, t as DOMElement, u as KubbNode, y as JSDoc } from "./types-BdOHT5YF.cjs";
-export { DOMElement, DOMNode, DOMNodeAttribute, ElementNames, FabricConfig, FabricContext, FabricMode, FabricOptions, JSDoc, Key, KubbElement, KubbExportProps, KubbFile_d_exports as KubbFile, KubbFileProps, KubbImportProps, KubbNode, KubbSourceProps, KubbTextProps, LineBreakProps, Param, Params, TextNode };
+import { _ as KubbFile_d_exports, a as FabricOptions, i as FabricMode, n as FabricConfig, r as FabricContext } from "./Fabric-BELBf-bX.cjs";
+import { _ as Params, a as Key, b as RootContextProps, c as KubbFileProps, d as KubbSourceProps, f as KubbTextProps, g as Param, i as ElementNames, l as KubbImportProps, m as TextNode, n as DOMNode, o as KubbElement, p as LineBreakProps, r as DOMNodeAttribute, s as KubbExportProps, t as DOMElement, u as KubbNode, x as ComponentNode, y as JSDoc } from "./types-f5qVBVRo.cjs";
+export { ComponentNode, DOMElement, DOMNode, DOMNodeAttribute, ElementNames, FabricConfig, FabricContext, FabricMode, FabricOptions, JSDoc, Key, KubbElement, KubbExportProps, KubbFile_d_exports as KubbFile, KubbFileProps, KubbImportProps, KubbNode, KubbSourceProps, KubbTextProps, LineBreakProps, Param, Params, RootContextProps, TextNode };

package/dist/types.d.ts

@@ -1,3 +1,3 @@
-import { _ as KubbFile_d_exports, a as FabricOptions, i as FabricMode, n as FabricConfig, r as FabricContext } from "./Fabric-DitK3IEP.js";
-import { _ as Params, a as Key, c as KubbFileProps, d as KubbSourceProps, f as KubbTextProps, g as Param, i as ElementNames, l as KubbImportProps, m as TextNode, n as DOMNode, o as KubbElement, p as LineBreakProps, r as DOMNodeAttribute, s as KubbExportProps, t as DOMElement, u as KubbNode, y as JSDoc } from "./types-BL7PkfqA.js";
-export { DOMElement, DOMNode, DOMNodeAttribute, ElementNames, FabricConfig, FabricContext, FabricMode, FabricOptions, JSDoc, Key, KubbElement, KubbExportProps, KubbFile_d_exports as KubbFile, KubbFileProps, KubbImportProps, KubbNode, KubbSourceProps, KubbTextProps, LineBreakProps, Param, Params, TextNode };
+import { _ as KubbFile_d_exports, a as FabricOptions, i as FabricMode, n as FabricConfig, r as FabricContext } from "./Fabric-DbJhvsCq.js";
+import { _ as Params, a as Key, b as RootContextProps, c as KubbFileProps, d as KubbSourceProps, f as KubbTextProps, g as Param, i as ElementNames, l as KubbImportProps, m as TextNode, n as DOMNode, o as KubbElement, p as LineBreakProps, r as DOMNodeAttribute, s as KubbExportProps, t as DOMElement, u as KubbNode, x as ComponentNode, y as JSDoc } from "./types-QgmDVUxV.js";
+export { ComponentNode, DOMElement, DOMNode, DOMNodeAttribute, ElementNames, FabricConfig, FabricContext, FabricMode, FabricOptions, JSDoc, Key, KubbElement, KubbExportProps, KubbFile_d_exports as KubbFile, KubbFileProps, KubbImportProps, KubbNode, KubbSourceProps, KubbTextProps, LineBreakProps, Param, Params, RootContextProps, TextNode };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kubb/react-fabric",
-  "version": "0.10.0",
+  "version": "0.11.1",
   "description": "React integration for Kubb, providing JSX runtime support and React component generation capabilities for code generation plugins.",
   "keywords": [
     "react",
@@ -111,7 +111,7 @@
     "react-devtools-core": "6.1.2",
     "signal-exit": "^4.1.0",
     "ws": "8.18.0",
-    "@kubb/fabric-core": "0.10.0"
+    "@kubb/fabric-core": "0.11.1"
   },
   "devDependencies": {
     "@types/react": "^19.2.8",

package/src/Runtime.tsx

@@ -1,5 +1,5 @@
 import process from 'node:process'
-import type { FileManager } from '@kubb/fabric-core'
+import { type FileManager, TreeNode } from '@kubb/fabric-core'
 import type { ReactNode } from 'react'
 import { ConcurrentRoot } from 'react-reconciler/constants.js'
 import { onExit } from 'signal-exit'
@@ -7,7 +7,7 @@ import { Root } from './components/Root.tsx'
 import { createNode } from './dom.ts'
 import type { FiberRoot } from './Renderer.ts'
 import { Renderer } from './Renderer.ts'
-import type { DOMElement } from './types.ts'
+import type { ComponentNode, DOMElement } from './types.ts'
 import { processFiles } from './utils/processFiles.ts'
 import { squashTextNodes } from './utils/squashTextNodes.ts'
 
@@ -167,11 +167,16 @@ export class Runtime {
   }
 
   async render(node: ReactNode): Promise<void> {
-    const element = (
-      <Root onExit={this.onExit.bind(this)} onError={this.onError.bind(this)}>
-        {node}
-      </Root>
-    )
+    const treeNode = new TreeNode<ComponentNode>({ type: 'Root', props: {} })
+    const props = {
+      fileManager: this.fileManager,
+      treeNode,
+      onExit: this.onExit.bind(this),
+      onError: this.onError.bind(this),
+    }
+    treeNode.data.props = props
+
+    const element = <Root {...props}>{node}</Root>
 
     Renderer.updateContainerSync(element, this.#container, null, null)
     Renderer.flushSyncWork()
@@ -186,11 +191,16 @@ export class Runtime {
   }
 
   async renderToString(node: ReactNode): Promise<string> {
-    const element = (
-      <Root onExit={this.onExit.bind(this)} onError={this.onError.bind(this)}>
-        {node}
-      </Root>
-    )
+    const treeNode = new TreeNode<ComponentNode>({ type: 'Root', props: {} })
+    const props = {
+      fileManager: this.fileManager,
+      treeNode,
+      onExit: this.onExit.bind(this),
+      onError: this.onError.bind(this),
+    }
+    treeNode.data.props = props
+
+    const element = <Root {...props}>{node}</Root>
 
     Renderer.updateContainerSync(element, this.#container, null, null)
     Renderer.flushSyncWork()

package/src/components/App.tsx

@@ -1,17 +1,33 @@
-import { AppContext, provide, RootContext, useContext } from '@kubb/fabric-core'
+import { AppContext, NodeTreeContext, provide, RootContext, useContext, useNodeTree } from '@kubb/fabric-core'
 import type { KubbNode } from '../types.ts'
 
-type Props<TMeta = unknown> = {
-  readonly children?: KubbNode
-  readonly meta: TMeta
+export type AppProps<TMeta extends object = object> = {
+  /**
+   * Metadata associated with the App.
+   */
+  meta?: TMeta
+  /**
+   * Children nodes.
+   */
+  children?: KubbNode
 }
 
 /**
- * Provides the current app context (meta and exit) to descendants.
- * This component mirrors the Fabric app container in React.
+ * App container containing the AppContext carrying `meta` and an `exit` hook.
  */
-export function App<TMeta = unknown>({ meta, children }: Props<TMeta>) {
+export function App<TMeta extends object = object>({ children, ...props }: AppProps<TMeta>) {
+  const { meta = {} } = props
+
   const { exit } = useContext(RootContext)
+
+  const nodeTree = useNodeTree()
+
+  if (nodeTree) {
+    const childTree = nodeTree.addChild({ type: 'App', props })
+
+    provide(NodeTreeContext, childTree)
+  }
+
   provide(AppContext, { exit, meta })
 
   return children

package/src/components/Const.tsx

@@ -1,8 +1,8 @@
+import { NodeTreeContext, provide, useNodeTree } from '@kubb/fabric-core'
 import type { JSDoc, Key, KubbNode } from '../types.ts'
-
 import { createJSDoc } from '../utils/createJSDoc.ts'
 
-type Props = {
+export type ConstProps = {
   key?: Key
   /**
    * Name of the const
@@ -24,13 +24,26 @@ type Props = {
    * Use of `const` assertions
    */
   asConst?: boolean
+  /**
+   * Children nodes.
+   */
   children?: KubbNode
 }
 
 /**
- * Renders a constant declaration. Supports optional export, type and JSDoc.
+ * Generates a TypeScript constant declaration.
  */
-export function Const({ name, export: canExport, type, JSDoc, asConst, children }: Props) {
+export function Const({ children, ...props }: ConstProps) {
+  const { name, export: canExport, type, JSDoc, asConst } = props
+
+  const nodeTree = useNodeTree()
+
+  if (nodeTree) {
+    const childTree = nodeTree.addChild({ type: 'Const', props })
+
+    provide(NodeTreeContext, childTree)
+  }
+
   return (
     <>
       {JSDoc?.comments && (

package/src/components/File.tsx

@@ -1,4 +1,4 @@
-import { FileCollector, FileCollectorContext, provide, useContext } from '@kubb/fabric-core'
+import { FileContext, NodeTreeContext, provide, useFile, useFileManager, useNodeTree } from '@kubb/fabric-core'
 import type { KubbFile } from '@kubb/fabric-core/types'
 import type { Key, KubbNode } from '../types.ts'
 
@@ -34,31 +34,39 @@ type Props<TMeta> = BaseProps & {
 }
 
 /**
- * Registers a file in the FileCollector context and provides a scoped collector
- * for children. When `baseName` and `path` are provided the file will be
- * registered so it can be emitted by the collector later.
+ * Adds files to the FileManager
  */
-export function File<TMeta extends object = object>({ children, ...rest }: Props<TMeta>) {
-  const collector = useContext(FileCollectorContext, new FileCollector())
-  provide(FileCollectorContext, collector)
+export function File<TMeta extends object = object>({ children, ...props }: Props<TMeta>) {
+  const { baseName, path, meta = {}, footer, banner } = props
 
-  if (!rest.baseName || !rest.path) {
+  const fileManager = useFileManager()
+  const nodeTree = useNodeTree()
+
+  if (nodeTree) {
+    const childTree = nodeTree.addChild({ type: 'File', props })
+
+    provide(NodeTreeContext, childTree)
+  }
+
+  if (!baseName || !path) {
     return <>{children}</>
   }
 
-  // Register this file with the collector
-  collector.add({
-    baseName: rest.baseName,
-    path: rest.path,
-    meta: rest.meta || ({} as TMeta),
-    banner: rest.banner,
-    footer: rest.footer,
+  const file: KubbFile.File = {
+    baseName,
+    path,
+    meta,
+    banner,
+    footer,
     sources: [],
     imports: [],
     exports: [],
-  })
+  }
+
+  const [resolvedFile] = fileManager.add(file)
+  provide(FileContext, resolvedFile)
 
-  return <kubb-file {...rest}>{children}</kubb-file>
+  return <kubb-file {...props}>{children}</kubb-file>
 }
 
 File.displayName = 'KubbFile'
@@ -74,7 +82,17 @@ type FileSourceProps = Omit<KubbFile.Source, 'value'> & {
  * Marks a block of source text to be associated with the current file when
  * rendering with the FileCollector. Children are treated as the source string.
  */
-function FileSource({ isTypeOnly, name, isExportable, isIndexable, children }: FileSourceProps) {
+function FileSource({ children, ...props }: FileSourceProps) {
+  const { name, isExportable, isIndexable, isTypeOnly } = props
+
+  const nodeTree = useNodeTree()
+
+  if (nodeTree) {
+    const childTree = nodeTree.addChild({ type: 'FileSource', props })
+
+    provide(NodeTreeContext, childTree)
+  }
+
   return (
     <kubb-source name={name} isTypeOnly={isTypeOnly} isExportable={isExportable} isIndexable={isIndexable}>
       {children}
@@ -84,7 +102,7 @@ function FileSource({ isTypeOnly, name, isExportable, isIndexable, children }: F
 
 FileSource.displayName = 'KubbFileSource'
 
-type FileExportProps = KubbFile.Export & { key?: Key }
+export type FileExportProps = KubbFile.Export & { key?: Key }
 
 /**
  * File.Export
@@ -92,21 +110,62 @@ type FileExportProps = KubbFile.Export & { key?: Key }
  * Declares an export entry for the current file. This will be collected by
  * the FileCollector for later emission.
  */
-function FileExport({ name, path, isTypeOnly, asAlias }: FileExportProps) {
-  return <kubb-export name={name} path={path} isTypeOnly={isTypeOnly || false} asAlias={asAlias} />
+function FileExport(props: FileExportProps) {
+  const { name, path, isTypeOnly, asAlias } = props
+
+  const nodeTree = useNodeTree()
+  const file = useFile()
+
+  if (nodeTree) {
+    const childTree = nodeTree.addChild({ type: 'FileExport', props })
+
+    provide(NodeTreeContext, childTree)
+  }
+
+  if (file) {
+    file.exports.push({
+      name,
+      path,
+      asAlias,
+      isTypeOnly,
+    })
+  }
+
+  return <kubb-export name={name} path={path} isTypeOnly={isTypeOnly} asAlias={asAlias} />
 }
 
 FileExport.displayName = 'KubbFileExport'
 
-type FileImportProps = KubbFile.Import & { key?: Key }
+export type FileImportProps = KubbFile.Import & { key?: Key }
 
 /**
  * File.Import
  *
  * Declares an import entry for the current file.
  */
-function FileImport({ name, root, path, isTypeOnly, isNameSpace }: FileImportProps) {
-  return <kubb-import name={name} root={root} path={path} isNameSpace={isNameSpace} isTypeOnly={isTypeOnly || false} />
+function FileImport(props: FileImportProps) {
+  const { name, root, path, isTypeOnly, isNameSpace } = props
+
+  const nodeTree = useNodeTree()
+  const file = useFile()
+
+  if (nodeTree) {
+    const childTree = nodeTree.addChild({ type: 'FileImport', props })
+
+    provide(NodeTreeContext, childTree)
+  }
+
+  if (file) {
+    file.imports.push({
+      name,
+      path,
+      root,
+      isNameSpace,
+      isTypeOnly,
+    })
+  }
+
+  return <kubb-import name={name} root={root} path={path} isNameSpace={isNameSpace} isTypeOnly={isTypeOnly} />
 }
 
 FileImport.displayName = 'KubbFileImport'

package/src/components/Function.tsx

@@ -1,4 +1,5 @@
-import type { JSDoc, Key, KubbNode } from '../types.ts'
+import { NodeTreeContext, provide, useNodeTree } from '@kubb/fabric-core'
+import type { JSDoc, Key } from '../types.ts'
 import { createJSDoc } from '../utils/createJSDoc.ts'
 import { Indent } from './Indent.tsx'
 
@@ -29,7 +30,6 @@ type Props = {
    * Generics that needs to be added for TypeScript.
    */
   generics?: string | string[]
-
   /**
    * ReturnType(see async for adding Promise type).
    */
@@ -38,14 +38,26 @@ type Props = {
    * Options for JSdocs.
    */
   JSDoc?: JSDoc
-  children?: KubbNode
+  /**
+   * Children nodes.
+   */
+  children?: string
 }
 
 /**
- * Renders a function definition using the Fabric templating primitives.
- * Supports optional export/default/async flags, generics, params and JSDoc.
+ * Generates a TypeScript function declaration.
  */
-export function Function({ name, default: isDefault, export: canExport, async, generics, params, returnType, JSDoc, children }: Props) {
+export function Function({ children, ...props }: Props) {
+  const { name, default: isDefault, export: canExport, async, generics, params, returnType, JSDoc } = props
+
+  const nodeTree = useNodeTree()
+
+  if (nodeTree) {
+    const childTree = nodeTree.addChild({ type: 'Function', props })
+
+    provide(NodeTreeContext, childTree)
+  }
+
   return (
     <>
       {JSDoc?.comments && (
@@ -97,7 +109,16 @@ type ArrowFunctionProps = Props & {
  * Renders an arrow function definition. Supports the same flags as `Function`.
  * Use `singleLine` to render the body as a single-line expression.
  */
-function ArrowFunction({ name, default: isDefault, export: canExport, async, generics, params, returnType, JSDoc, singleLine, children }: ArrowFunctionProps) {
+function ArrowFunction({ children, ...props }: ArrowFunctionProps) {
+  const { name, default: isDefault, export: canExport, async, generics, params, returnType, JSDoc, singleLine } = props
+
+  const nodeTree = useNodeTree()
+
+  if (nodeTree) {
+    const childTree = nodeTree.addChild({ type: 'ArrowFunction', props })
+
+    provide(NodeTreeContext, childTree)
+  }
   return (
     <>
       {JSDoc?.comments && (

package/src/components/Root.tsx

@@ -1,7 +1,7 @@
-import { provide, RootContext } from '@kubb/fabric-core'
+import { type FileManager, NodeTreeContext, provide, RootContext, type TreeNode } from '@kubb/fabric-core'
 import { Component } from 'react'
 
-import type { KubbNode } from '../types.ts'
+import type { ComponentNode, KubbNode } from '../types.ts'
 
 type ErrorBoundaryProps = {
   onError: (error: Error) => void
@@ -33,28 +33,35 @@ class ErrorBoundary extends Component<{
   }
 }
 
-type RootProps = {
+export type RootProps = {
   /**
-   * Exit (unmount) hook
+   * Exit (unmount) the whole app.
    */
-  readonly onExit: (error?: Error) => void
+  onExit: (error?: Error) => void
   /**
-   * Error hook
+   * Error hook receiving runtime exceptions.
    */
-  readonly onError: (error: Error) => void
-  readonly children?: KubbNode
+  onError: (error: Error) => void
+  /**
+   * TreeNode representing the tree structure of the app.
+   */
+  treeNode: TreeNode<ComponentNode>
+  /**
+   * FileManager instance for managing files within the app.
+   */
+  fileManager: FileManager
+  /**
+   * Children nodes.
+   */
+  children?: KubbNode
 }
 
 /**
- * Provides the root context (exit hook) and wraps children into an
- * ErrorBoundary so errors can be forwarded to the `onError` handler.
- *
- * This component provides the root behaviour for the React Fabric runtime.
- *
- * Returns a React node tree representing the root of the Fabric app.
+ * This component provides the root behavior for the Fabric runtime.
  */
-export function Root({ onError, onExit, children }: RootProps) {
-  provide(RootContext, { exit: onExit })
+export function Root({ onError, onExit, treeNode, fileManager, children }: RootProps) {
+  provide(RootContext, { exit: onExit, treeNode, fileManager })
+  provide(NodeTreeContext, treeNode)
 
   return (
     <ErrorBoundary

package/src/components/Type.tsx

@@ -1,7 +1,8 @@
+import { NodeTreeContext, provide, useNodeTree } from '@kubb/fabric-core'
 import type { JSDoc, Key, KubbNode } from '../types.ts'
 import { createJSDoc } from '../utils/createJSDoc.ts'
 
-type Props = {
+export type TypeProps = {
   key?: Key
   /**
    * Name of the type, this needs to start with a capital letter.
@@ -15,14 +16,26 @@ type Props = {
    * Options for JSdocs.
    */
   JSDoc?: JSDoc
+  /**
+   * Children nodes.
+   */
   children?: KubbNode
 }
 
 /**
- * Renders a TypeScript type alias. Validates that the provided name starts
- * with a capital letter and optionally emits JSDoc comments.
+ * Generates a TypeScript type declaration.
  */
-export function Type({ name, export: canExport, JSDoc, children }: Props) {
+export function Type({ children, ...props }: TypeProps) {
+  const { name, export: canExport, JSDoc } = props
+
+  const nodeTree = useNodeTree()
+
+  if (nodeTree) {
+    const childTree = nodeTree.addChild({ type: 'Type', props })
+
+    provide(NodeTreeContext, childTree)
+  }
+
   if (name.charAt(0).toUpperCase() !== name.charAt(0)) {
     throw new Error('Name should start with a capital letter(see TypeScript types)')
   }