updated the public api of the renderer

src/main.ts

@@ -1,7 +1,8 @@
 import { checkExists } from '/src/util/types';
-import { renderRoot } from '/src/renderer/runtime/runtime';
-import { createElement } from '/src/renderer/element';
 import { createProgram } from '/src/util/webgl/create';
+import { createElement } from '/src/renderer/element';
+import { Node } from '/src/renderer/state_tree/state_tree';
+import { render } from '/src/renderer/index';
 import { Main } from '/src/ui/main.ts';
 
 const fragmentSource = `
@@ -41,7 +42,7 @@ document.addEventListener('DOMContentLoaded', function () {
   const context = checkExists(canvas.getContext('webgl'), 'expected the context to exist');
   const program = createProgram(context, vertexSource, fragmentSource);
 
-  renderRoot([
+  render([
     createElement('set-program', {
       program,
       children: [
@@ -52,7 +53,7 @@ document.addEventListener('DOMContentLoaded', function () {
         })
       ],
     }),
-  ], context, function onComplete(fiber) {
-    console.log(fiber);
+  ], context, function onComplete(nodes: readonly Node[]) {
+    console.log(nodes);
   });
 });

src/renderer/index.ts

@@ -0,0 +1,14 @@
+import { Element } from '/src/renderer/element';
+import { Node } from '/src/renderer/state_tree/state_tree';
+import { Painter } from '/src/renderer/runtime/painter';
+import { createRenderer } from '/src/renderer/runtime/renderer';
+import { createRuntime } from '/src/renderer/runtime/runtime';
+
+export function render(
+    elements: Element[],
+    context: WebGLRenderingContext,
+    onComplete: (node: Node[]) => void,
+) {
+  const runtime = createRuntime(new Painter(context), createRenderer(context));
+  onComplete(runtime.renderRoot(elements));
+}

src/renderer/runtime/renderer.ts

@@ -99,9 +99,7 @@ export class Renderer {
   };
 }
 
-export function createRenderer(
-    context: WebGLRenderingContext,
-) {
+export function createRenderer(context: WebGLRenderingContext) {
   const { requestIdleCallback, cancelIdleCallback } = createRequestIdleCallback();
 
   return new Renderer(

src/renderer/runtime/runtime.ts

@@ -1,9 +1,9 @@
 import { Element } from '/src/renderer/element';
 import { Node } from '/src/renderer/state_tree/state_tree';
 import { Painter } from './painter';
-import { Renderer, createRenderer } from './renderer';
+import { Renderer } from './renderer';
 
-class Runtime {
+export class Runtime {
   private rootNodes: Node[] = [];
 
   constructor(
@@ -24,11 +24,6 @@ class Runtime {
   };
 }
 
-export function renderRoot(
-    elements: Element[],
-    context: WebGLRenderingContext,
-    onComplete: (node: Node[]) => void,
-) {
-  const runtime = new Runtime(new Painter(context), createRenderer(context));
-  onComplete(runtime.renderRoot(elements));
+export function createRuntime(painter: Painter, renderer: Renderer): Runtime {
+  return new Runtime(painter, renderer);
 }