@alloy-js/core 0.17.0 → 0.18.0-dev.2

package/dist/src/props-combinators.js

@@ -0,0 +1,108 @@
+import { computed, isReactive, proxyRefs, toRefs } from "@vue/reactivity";
+import { untrack } from "./reactivity.js";
+export function mergeProps(...sources) {
+  const target = {};
+  for (let i = 0; i < sources.length; i++) {
+    let source = sources[i];
+    if (typeof source === "function") source = source();
+    if (source) {
+      const descriptors = Object.getOwnPropertyDescriptors(source);
+      for (const key in descriptors) {
+        if (key in target) continue;
+        Object.defineProperty(target, key, {
+          enumerable: true,
+          get() {
+            for (let i = sources.length - 1; i >= 0; i--) {
+              let s = sources[i];
+              if (typeof s === "function") s = s();
+              const v = (s || {})[key];
+              if (v !== undefined) return v;
+            }
+          }
+        });
+      }
+    }
+  }
+  return target;
+}
+export function splitProps(props, ...keys) {
+  if (isReactive(props)) {
+    const refs = untrack(() => toRefs(props));
+    const remainingKeys = new Set(Object.keys(refs));
+    const result = keys.map(keySet => {
+      const resultSet = {};
+      for (const key of keySet) {
+        resultSet[key] = refs[key];
+        remainingKeys.delete(key);
+      }
+      return proxyRefs(resultSet);
+    });
+    const remaining = {};
+    for (const key of remainingKeys) {
+      remaining[key] = refs[key];
+    }
+    return [...result, proxyRefs(remaining)];
+  }
+  const descriptors = Object.getOwnPropertyDescriptors(props);
+  const remainingKeys = new Set(Object.keys(descriptors));
+  const result = keys.map(keySet => {
+    const resultSet = {};
+    for (const key of keySet) {
+      if (key in descriptors) {
+        Object.defineProperty(resultSet, key, descriptors[key]);
+        remainingKeys.delete(key);
+      }
+    }
+    return resultSet;
+  });
+  const remaining = {};
+  for (const key of remainingKeys) {
+    Object.defineProperty(remaining, key, descriptors[key]);
+  }
+  return [...result, remaining];
+}
+
+/**
+ * Applies default values to a props object. Reactive props are handled properly
+ * by ensuring that their value is not accessed by `defaultProps`, avoiding any
+ * unintended side effects.
+ */
+export function defaultProps(props, defaults) {
+  if (isReactive(props)) {
+    const refs = untrack(() => toRefs(props));
+    for (const key in defaults) {
+      const originalRef = refs[key];
+      refs[key] = computed(() => originalRef.value === undefined ? defaults[key] : originalRef.value);
+    }
+    return proxyRefs(refs);
+  }
+  const withDefaults = {};
+  const copied = new Set();
+  for (const key in defaults) {
+    copied.add(key);
+    const desc = Object.getOwnPropertyDescriptor(props, key);
+    if (!desc) {
+      withDefaults[key] = defaults[key];
+      continue;
+    }
+    if (desc.get) {
+      const originalGet = desc.get;
+      desc.get = function () {
+        const value = originalGet.call(this);
+        return value === undefined ? defaults[key] : value;
+      };
+      Object.defineProperty(withDefaults, key, desc);
+    } else {
+      desc.value = desc.value === undefined ? defaults[key] : desc.value;
+      Object.defineProperty(withDefaults, key, desc);
+    }
+  }
+  const descriptors = Object.getOwnPropertyDescriptors(props);
+  for (const key in descriptors) {
+    if (copied.has(key)) {
+      continue;
+    }
+    Object.defineProperty(withDefaults, key, descriptors[key]);
+  }
+  return withDefaults;
+}

package/dist/src/reactive-union-set.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"reactive-union-set.d.ts","sourceRoot":"","sources":["../../src/reactive-union-set.ts"],"names":[],"mappings":"AACA,OAAO,EAEL,aAAa,EAOd,MAAM,iBAAiB,CAAC;AAEzB,MAAM,WAAW,uBAAuB,CAAC,CAAC;IACxC,KAAK,CAAC,EAAE,wBAAwB,CAAC,CAAC,CAAC,CAAC;IACpC,QAAQ,CAAC,EAAE,2BAA2B,CAAC,CAAC,CAAC,CAAC;CAC3C;AAED,MAAM,MAAM,2BAA2B,CAAC,CAAC,IAAI,CAAC,KAAK,EAAE,CAAC,KAAK,IAAI,CAAC;AAChE,MAAM,MAAM,wBAAwB,CAAC,CAAC,IAAI,CAAC,KAAK,EAAE,CAAC,KAAK,CAAC,CAAC;AAE1D,qBAAa,gBAAgB,CAAC,CAAC,CAAE,SAAQ,GAAG,CAAC,CAAC,CAAC;IAC7C,OAAO,CAAC,QAAQ,CAAc;IAC9B,OAAO,CAAC,MAAM,CAAC,CAA8B;IAC7C,OAAO,CAAC,SAAS,CAAC,CAAiC;IACnD,OAAO,CAAC,UAAU,CAA6B;IAC/C,OAAO,CAAC,QAAQ,CAA6D;IAE7E,CAAC,aAAa,CAAC,WAAW,CAAC,UAAQ;IAEnC,OAAO,CAAC,UAAU;IAUlB,OAAO,CAAC,aAAa;gBAYT,OAAO,GAAE,uBAAuB,CAAC,CAAC,CAAM;IAUpD,IAAI,IAAI,WAGP;IAED,CAAC,MAAM,CAAC,QAAQ,CAAC,IAAI,WAAW,CAAC,CAAC,CAAC;IAKnC,IAAI,IAAI,WAAW,CAAC,CAAC,CAAC;IAKtB,MAAM,IAAI,WAAW,CAAC,CAAC,CAAC;IAKxB,OAAO,IAAI,WAAW,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC;IAK9B,GAAG,CAAC,IAAI,EAAE,CAAC;IAaX,MAAM,CAAC,IAAI,EAAE,CAAC;IAkBd,SAAS,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC,CAAC,EAAE,OAAO,GAAE,uBAAuB,CAAC,CAAC,CAAM;IAsClE,gBAAgB,CAAC,CAAC,EAAE,MAAM,EAAE,CAAC,KAAK,EAAE,CAAC,KAAK,CAAC,GAAG,CAAC,EAAE;IAsDjD,WAAW,CAAC,CAAC,EAAE,MAAM,EAAE,CAAC,KAAK,EAAE,CAAC,KAAK,CAAC,GAAG,CAAC,EAAE,GAAG,WAAW,CAAC,CAAC,EAAE,CAAC,CAAC;CA4BjE"}
+{"version":3,"file":"reactive-union-set.d.ts","sourceRoot":"","sources":["../../src/reactive-union-set.ts"],"names":[],"mappings":"AAAA,OAAO,EAEL,aAAa,EAOd,MAAM,iBAAiB,CAAC;AAGzB,MAAM,WAAW,uBAAuB,CAAC,CAAC;IACxC,KAAK,CAAC,EAAE,wBAAwB,CAAC,CAAC,CAAC,CAAC;IACpC,QAAQ,CAAC,EAAE,2BAA2B,CAAC,CAAC,CAAC,CAAC;CAC3C;AAED,MAAM,MAAM,2BAA2B,CAAC,CAAC,IAAI,CAAC,KAAK,EAAE,CAAC,KAAK,IAAI,CAAC;AAChE,MAAM,MAAM,wBAAwB,CAAC,CAAC,IAAI,CAAC,KAAK,EAAE,CAAC,KAAK,CAAC,CAAC;AAE1D,qBAAa,gBAAgB,CAAC,CAAC,CAAE,SAAQ,GAAG,CAAC,CAAC,CAAC;IAC7C,OAAO,CAAC,QAAQ,CAAc;IAC9B,OAAO,CAAC,MAAM,CAAC,CAA8B;IAC7C,OAAO,CAAC,SAAS,CAAC,CAAiC;IACnD,OAAO,CAAC,UAAU,CAA6B;IAC/C,OAAO,CAAC,QAAQ,CAA6D;IAE7E,CAAC,aAAa,CAAC,WAAW,CAAC,UAAQ;IAEnC,OAAO,CAAC,UAAU;IAUlB,OAAO,CAAC,aAAa;gBAYT,OAAO,GAAE,uBAAuB,CAAC,CAAC,CAAM;IAUpD,IAAI,IAAI,WAGP;IAED,CAAC,MAAM,CAAC,QAAQ,CAAC,IAAI,WAAW,CAAC,CAAC,CAAC;IAKnC,IAAI,IAAI,WAAW,CAAC,CAAC,CAAC;IAKtB,MAAM,IAAI,WAAW,CAAC,CAAC,CAAC;IAKxB,OAAO,IAAI,WAAW,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC;IAK9B,GAAG,CAAC,IAAI,EAAE,CAAC;IAaX,MAAM,CAAC,IAAI,EAAE,CAAC;IAkBd,SAAS,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC,CAAC,EAAE,OAAO,GAAE,uBAAuB,CAAC,CAAC,CAAM;IAsClE,gBAAgB,CAAC,CAAC,EAAE,MAAM,EAAE,CAAC,KAAK,EAAE,CAAC,KAAK,CAAC,GAAG,CAAC,EAAE;IAsDjD,WAAW,CAAC,CAAC,EAAE,MAAM,EAAE,CAAC,KAAK,EAAE,CAAC,KAAK,CAAC,GAAG,CAAC,EAAE,GAAG,WAAW,CAAC,CAAC,EAAE,CAAC,CAAC;CA4BjE"}

package/dist/src/reactive-union-set.js

@@ -1,5 +1,5 @@
-import { effect } from "@alloy-js/core/jsx-runtime";
 import { ITERATE_KEY, ReactiveFlags, shallowReactive, shallowReadonly, track, TrackOpTypes, trigger, TriggerOpTypes } from "@vue/reactivity";
+import { effect } from "./reactivity.js";
 export class ReactiveUnionSet extends Set {
   _refcounts = new Map();
   _indexes = [];

package/dist/src/reactivity.d.ts

@@ -0,0 +1,75 @@
+import { ShallowReactive } from "@vue/reactivity";
+import type { RenderedTextTree } from "./render.js";
+import type { Children, ComponentCreator } from "./runtime/component.js";
+import type { OutputSymbol } from "./symbols/output-symbol.js";
+export declare function getElementCache(): ElementCache;
+export type ElementCacheKey = ComponentCreator | (() => unknown) | CustomContext;
+export type ElementCache = Map<ElementCacheKey, RenderedTextTree>;
+export interface Disposable {
+    (): void;
+}
+export interface Context {
+    disposables: Disposable[];
+    owner: Context | null;
+    context?: Record<symbol, unknown>;
+    meta?: Record<string, any>;
+    /**
+     * A cache of RenderTextTree nodes created within this context,
+     * indexed by the component or function which created them.
+     */
+    elementCache: ElementCache;
+    /**
+     * When this context was created by a component, this will
+     * be the component that created it.
+     */
+    componentOwner?: ComponentCreator<unknown>;
+    /**
+     * Whether this context will take an emitted symbol.
+     */
+    takesSymbols: boolean;
+    /**
+     * The symbol that this component has taken.
+     */
+    takenSymbols?: ShallowReactive<Set<OutputSymbol>>;
+}
+export declare function getContext(): Context | null;
+export interface RootOptions {
+    componentOwner?: ComponentCreator<any>;
+}
+export declare function root<T>(fn: (d: Disposable) => T, options?: RootOptions): T;
+export declare function untrack<T>(fn: () => T): T;
+export declare function memo<T>(fn: () => T, equal?: boolean): () => T;
+export declare function effect<T>(fn: (prev?: T) => T, current?: T): void;
+/**
+ * Register a cleanup function which is called when the current reactive scope
+ * is recalculated or disposed. This is useful to clean up any side effects
+ * created in the reactive scope.
+ *
+ * @remarks
+ *
+ * When onCleanup is called inside a component definition, the provided function
+ * is called when the component is removed from the tree. This can be useful to
+ * clean up any side effects created as a result of rendering the component. For
+ * example, if rendering a component creates a symbol, `onCleanup` can be used
+ * to remove the symbol when the component is removed from the tree.
+ *
+ * When onCleanup is called inside a memo or effect, the function is called when
+ * the effect is refreshed (e.g. when a memo or computed recalculates) or
+ * disposed (e.g. it is no longer needed because it is attached to a component
+ * which was removed).
+ */
+export declare function onCleanup(fn: Disposable): void;
+/**
+ * Create a custom reactive context for the children returned by
+ * the provided context.
+ */
+export interface CustomContext {
+    [CUSTOM_CONTEXT_SYM]: true;
+    useCustomContext: (useCb: CustomContextChildrenCallback) => void;
+}
+export type CustomContextChildrenCallback = (child: Children) => void;
+declare const CUSTOM_CONTEXT_SYM: unique symbol;
+export declare function createCustomContext(useCallback: (useChildren: CustomContextChildrenCallback) => void): CustomContext;
+export declare function isCustomContext(child: Children): child is CustomContext;
+export {};
+//# sourceMappingURL=reactivity.d.ts.map

package/dist/src/reactivity.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"reactivity.d.ts","sourceRoot":"","sources":["../../src/reactivity.ts"],"names":[],"mappings":"AAAA,OAAO,EAIL,eAAe,EAIhB,MAAM,iBAAiB,CAAC;AACzB,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AACpD,OAAO,KAAK,EAAE,QAAQ,EAAE,gBAAgB,EAAE,MAAM,wBAAwB,CAAC;AAEzE,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,4BAA4B,CAAC;AAW/D,wBAAgB,eAAe,iBAE9B;AAED,MAAM,MAAM,eAAe,GACvB,gBAAgB,GAChB,CAAC,MAAM,OAAO,CAAC,GACf,aAAa,CAAC;AAElB,MAAM,MAAM,YAAY,GAAG,GAAG,CAAC,eAAe,EAAE,gBAAgB,CAAC,CAAC;AAElE,MAAM,WAAW,UAAU;IACzB,IAAI,IAAI,CAAC;CACV;AAED,MAAM,WAAW,OAAO;IACtB,WAAW,EAAE,UAAU,EAAE,CAAC;IAC1B,KAAK,EAAE,OAAO,GAAG,IAAI,CAAC;IAGtB,OAAO,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IAGlC,IAAI,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;IAE3B;;;OAGG;IACH,YAAY,EAAE,YAAY,CAAC;IAC3B;;;OAGG;IACH,cAAc,CAAC,EAAE,gBAAgB,CAAC,OAAO,CAAC,CAAC;IAE3C;;OAEG;IACH,YAAY,EAAE,OAAO,CAAC;IAEtB;;OAEG;IACH,YAAY,CAAC,EAAE,eAAe,CAAC,GAAG,CAAC,YAAY,CAAC,CAAC,CAAC;CACnD;AAGD,wBAAgB,UAAU,mBAEzB;AAED,MAAM,WAAW,WAAW;IAC1B,cAAc,CAAC,EAAE,gBAAgB,CAAC,GAAG,CAAC,CAAC;CACxC;AAED,wBAAgB,IAAI,CAAC,CAAC,EAAE,EAAE,EAAE,CAAC,CAAC,EAAE,UAAU,KAAK,CAAC,EAAE,OAAO,CAAC,EAAE,WAAW,GAAG,CAAC,CA0B1E;AAED,wBAAgB,OAAO,CAAC,CAAC,EAAE,EAAE,EAAE,MAAM,CAAC,GAAG,CAAC,CAKzC;AAED,wBAAgB,IAAI,CAAC,CAAC,EAAE,EAAE,EAAE,MAAM,CAAC,EAAE,KAAK,CAAC,EAAE,OAAO,GAAG,MAAM,CAAC,CAS7D;AAED,wBAAgB,MAAM,CAAC,CAAC,EAAE,EAAE,EAAE,CAAC,IAAI,CAAC,EAAE,CAAC,KAAK,CAAC,EAAE,OAAO,CAAC,EAAE,CAAC,QAiDzD;AAED;;;;;;;;;;;;;;;;;GAiBG;AACH,wBAAgB,SAAS,CAAC,EAAE,EAAE,UAAU,QAIvC;AAED;;;GAGG;AACH,MAAM,WAAW,aAAa;IAC5B,CAAC,kBAAkB,CAAC,EAAE,IAAI,CAAC;IAC3B,gBAAgB,EAAE,CAAC,KAAK,EAAE,6BAA6B,KAAK,IAAI,CAAC;CAClE;AAED,MAAM,MAAM,6BAA6B,GAAG,CAAC,KAAK,EAAE,QAAQ,KAAK,IAAI,CAAC;AACtE,QAAA,MAAM,kBAAkB,eAAW,CAAC;AAEpC,wBAAgB,mBAAmB,CACjC,WAAW,EAAE,CAAC,WAAW,EAAE,6BAA6B,KAAK,IAAI,GAChE,aAAa,CAOf;AAED,wBAAgB,eAAe,CAAC,KAAK,EAAE,QAAQ,GAAG,KAAK,IAAI,aAAa,CAMvE"}

package/dist/src/reactivity.js

@@ -0,0 +1,141 @@
+import { pauseTracking, resetTracking, shallowRef, stop, effect as vueEffect } from "@vue/reactivity";
+import { scheduler } from "./scheduler.js";
+import { trace, TracePhase } from "./tracer.js";
+
+// check for multiple versions of alloy here.
+if (globalThis.__ALLOY__) {
+  throw new Error("Multiple versions of Alloy are loaded for this project. This will likely cause undesirable behavior.");
+}
+globalThis.__ALLOY__ = true;
+export function getElementCache() {
+  return getContext().elementCache;
+}
+let globalContext = null;
+export function getContext() {
+  return globalContext;
+}
+export function root(fn, options) {
+  const context = {
+    componentOwner: options?.componentOwner,
+    disposables: [],
+    owner: globalContext,
+    context: {},
+    elementCache: new Map(),
+    takesSymbols: false,
+    takenSymbols: undefined
+  };
+  globalContext = context;
+  let ret;
+  try {
+    ret = untrack(() => fn(() => {
+      for (const d of context.disposables) {
+        d();
+      }
+    }));
+  } finally {
+    globalContext = globalContext.owner;
+  }
+  return ret;
+}
+export function untrack(fn) {
+  pauseTracking();
+  const v = fn();
+  resetTracking();
+  return v;
+}
+export function memo(fn, equal) {
+  const o = shallowRef();
+  effect(prev => {
+    const res = fn();
+    // eslint-disable-next-line @typescript-eslint/no-unused-expressions
+    (!equal || prev !== res) && (o.value = res);
+    return res;
+  }, undefined);
+  return () => o.value;
+}
+export function effect(fn, current) {
+  const context = {
+    context: {},
+    disposables: [],
+    owner: globalContext,
+    elementCache: new Map(),
+    takesSymbols: false,
+    takenSymbols: undefined
+  };
+  const cleanupFn = final => {
+    const d = context.disposables;
+    context.disposables = [];
+    for (let k = 0, len = d.length; k < len; k++) d[k]();
+
+    // eslint-disable-next-line @typescript-eslint/no-unused-expressions
+    final && stop(runner);
+  };
+  onCleanup(() => cleanupFn(true));
+  const runner = vueEffect(() => {
+    cleanupFn(false);
+    const oldContext = globalContext;
+    globalContext = context;
+    try {
+      current = fn(current);
+    } finally {
+      globalContext = oldContext;
+    }
+  }, {
+    scheduler: scheduler(() => runner),
+    onTrack(event) {
+      trace(TracePhase.effect.track, () => {
+        return `tracking ${event.target}, ${event.key}`;
+      });
+    },
+    onTrigger(event) {
+      trace(TracePhase.effect.trigger, () => {
+        return `triggering ${event.target}, ${event.key}`;
+      });
+    }
+  });
+
+  // allow recursive effects (recursive option does nothing, possible bug)
+  runner.effect.flags |= 1 << 5;
+}
+
+/**
+ * Register a cleanup function which is called when the current reactive scope
+ * is recalculated or disposed. This is useful to clean up any side effects
+ * created in the reactive scope.
+ *
+ * @remarks
+ *
+ * When onCleanup is called inside a component definition, the provided function
+ * is called when the component is removed from the tree. This can be useful to
+ * clean up any side effects created as a result of rendering the component. For
+ * example, if rendering a component creates a symbol, `onCleanup` can be used
+ * to remove the symbol when the component is removed from the tree.
+ *
+ * When onCleanup is called inside a memo or effect, the function is called when
+ * the effect is refreshed (e.g. when a memo or computed recalculates) or
+ * disposed (e.g. it is no longer needed because it is attached to a component
+ * which was removed).
+ */
+export function onCleanup(fn) {
+  if (globalContext != null) {
+    globalContext.disposables.push(fn);
+  }
+}
+
+/**
+ * Create a custom reactive context for the children returned by
+ * the provided context.
+ */
+
+const CUSTOM_CONTEXT_SYM = Symbol();
+export function createCustomContext(useCallback) {
+  return {
+    [CUSTOM_CONTEXT_SYM]: true,
+    useCustomContext(useCb) {
+      useCallback(useCb);
+    }
+  };
+}
+export function isCustomContext(child) {
+  return typeof child === "object" && child !== null && Object.hasOwn(child, CUSTOM_CONTEXT_SYM);
+}

package/dist/src/render.d.ts

@@ -1,5 +1,6 @@
 import { Doc } from "prettier";
-import { Children, Context } from "./jsx-runtime.js";
+import { Context } from "./reactivity.js";
+import { Children, Component, Props } from "./runtime/component.js";
 /**
  * Turning components into source text involves three different trees produced
  * sequentially:
@@ -119,4 +120,7 @@ export interface PrintTreeOptions {
     tabWidth?: number;
 }
 export declare function printTree(tree: RenderedTextTree, options?: PrintTreeOptions): string;
+export declare function pushStack(component: Component<any>, props: Props): void;
+export declare function popStack(): void;
+export declare function printRenderStack(): void;
 //# sourceMappingURL=render.d.ts.map

package/dist/src/render.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"render.d.ts","sourceRoot":"","sources":["../../src/render.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,GAAG,EAAO,MAAM,UAAU,CAAC;AAIpC,OAAO,EAEL,QAAQ,EACR,OAAO,EAcR,MAAM,kBAAkB,CAAC;AAwB1B;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA8EG;AAEH,MAAM,WAAW,eAAe;IAC9B,IAAI,EAAE,WAAW,CAAC;IAClB,IAAI,EAAE,MAAM,CAAC;IACb,QAAQ,EAAE,CAAC,eAAe,GAAG,UAAU,CAAC,EAAE,CAAC;CAC5C;AAED,MAAM,WAAW,UAAU;IACzB,IAAI,EAAE,MAAM,CAAC;IACb,QAAQ,EAAE,MAAM,CAAC;IACjB,IAAI,EAAE,MAAM,CAAC;IACb,QAAQ,EAAE,MAAM,CAAC;CAClB;AAID,wBAAgB,uBAAuB,CAAC,IAAI,EAAE,gBAAgB,uBAE7D;AAED,eAAO,MAAM,YAAY,eAAW,CAAC;AAErC,MAAM,WAAW,SAAS;IACxB,CAAC,YAAY,CAAC,EAAE,IAAI,CAAC;IACrB,SAAS,CAAC,CAAC,IAAI,EAAE,gBAAgB,GAAG,gBAAgB,CAAC;IACrD,KAAK,CAAC,CACJ,IAAI,EAAE,gBAAgB,EACtB,KAAK,EAAE,CAAC,OAAO,EAAE,gBAAgB,KAAK,GAAG,GACxC,GAAG,CAAC;IACP,OAAO,EAAE,gBAAgB,CAAC;CAC3B;AAED,wBAAgB,oBAAoB,CAClC,OAAO,EAAE,gBAAgB,EACzB,KAAK,EAAE,IAAI,CAAC,SAAS,EAAE,OAAO,YAAY,GAAG,SAAS,CAAC,GACtD,SAAS,CAMX;AAED,wBAAgB,WAAW,CAAC,IAAI,EAAE,OAAO,GAAG,IAAI,IAAI,SAAS,CAE5D;AAED,MAAM,MAAM,gBAAgB,GAAG,CAAC,MAAM,GAAG,gBAAgB,GAAG,SAAS,CAAC,EAAE,CAAC;AAOzE,wBAAgB,MAAM,CACpB,QAAQ,EAAE,QAAQ,EAClB,OAAO,CAAC,EAAE,gBAAgB,GACzB,eAAe,CAuFjB;AAED,wBAAgB,UAAU,CAAC,QAAQ,EAAE,QAAQ,oBAY5C;AAyPD,MAAM,WAAW,gBAAgB;IAC/B;;;OAGG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;IAEpB;;OAEG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAElB;;OAEG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AAOD,wBAAgB,SAAS,CAAC,IAAI,EAAE,gBAAgB,EAAE,OAAO,CAAC,EAAE,gBAAgB,UAc3E"}
+{"version":3,"file":"render.d.ts","sourceRoot":"","sources":["../../src/render.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,GAAG,EAAO,MAAM,UAAU,CAAC;AAKpC,OAAO,EACL,OAAO,EAQR,MAAM,iBAAiB,CAAC;AAEzB,OAAO,EAEL,QAAQ,EACR,SAAS,EAET,KAAK,EACN,MAAM,wBAAwB,CAAC;AA0BhC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA8EG;AAEH,MAAM,WAAW,eAAe;IAC9B,IAAI,EAAE,WAAW,CAAC;IAClB,IAAI,EAAE,MAAM,CAAC;IACb,QAAQ,EAAE,CAAC,eAAe,GAAG,UAAU,CAAC,EAAE,CAAC;CAC5C;AAED,MAAM,WAAW,UAAU;IACzB,IAAI,EAAE,MAAM,CAAC;IACb,QAAQ,EAAE,MAAM,CAAC;IACjB,IAAI,EAAE,MAAM,CAAC;IACb,QAAQ,EAAE,MAAM,CAAC;CAClB;AAID,wBAAgB,uBAAuB,CAAC,IAAI,EAAE,gBAAgB,uBAE7D;AAED,eAAO,MAAM,YAAY,eAAW,CAAC;AAErC,MAAM,WAAW,SAAS;IACxB,CAAC,YAAY,CAAC,EAAE,IAAI,CAAC;IACrB,SAAS,CAAC,CAAC,IAAI,EAAE,gBAAgB,GAAG,gBAAgB,CAAC;IACrD,KAAK,CAAC,CACJ,IAAI,EAAE,gBAAgB,EACtB,KAAK,EAAE,CAAC,OAAO,EAAE,gBAAgB,KAAK,GAAG,GACxC,GAAG,CAAC;IACP,OAAO,EAAE,gBAAgB,CAAC;CAC3B;AAED,wBAAgB,oBAAoB,CAClC,OAAO,EAAE,gBAAgB,EACzB,KAAK,EAAE,IAAI,CAAC,SAAS,EAAE,OAAO,YAAY,GAAG,SAAS,CAAC,GACtD,SAAS,CAMX;AAED,wBAAgB,WAAW,CAAC,IAAI,EAAE,OAAO,GAAG,IAAI,IAAI,SAAS,CAE5D;AAED,MAAM,MAAM,gBAAgB,GAAG,CAAC,MAAM,GAAG,gBAAgB,GAAG,SAAS,CAAC,EAAE,CAAC;AAEzE,wBAAgB,MAAM,CACpB,QAAQ,EAAE,QAAQ,EAClB,OAAO,CAAC,EAAE,gBAAgB,GACzB,eAAe,CAuFjB;AAED,wBAAgB,UAAU,CAAC,QAAQ,EAAE,QAAQ,oBAY5C;AA4QD,MAAM,WAAW,gBAAgB;IAC/B;;;OAGG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;IAEpB;;OAEG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAElB;;OAEG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AAOD,wBAAgB,SAAS,CAAC,IAAI,EAAE,gBAAgB,EAAE,OAAO,CAAC,EAAE,gBAAgB,UAc3E;AA2BD,wBAAgB,SAAS,CAAC,SAAS,EAAE,SAAS,CAAC,GAAG,CAAC,EAAE,KAAK,EAAE,KAAK,QAGhE;AAED,wBAAgB,QAAQ,SAGvB;AAED,wBAAgB,gBAAgB,SAU/B"}

package/dist/src/render.js

@@ -3,9 +3,13 @@ import { doc } from "prettier";
 import prettier from "prettier/doc.js";
 import { useContext } from "./context.js";
 import { SourceFileContext } from "./context/source-file.js";
-import { effect, getContext, getElementCache, isComponentCreator, isCustomContext, isIntrinsicElement, popStack, printRenderStack, pushStack, root, untrack } from "./jsx-runtime.js";
+import { shouldDebug } from "./debug.js";
+import { effect, getContext, getElementCache, isCustomContext, root, untrack } from "./reactivity.js";
 import { isRefkey } from "./refkey.js";
+import { isComponentCreator } from "./runtime/component.js";
+import { isIntrinsicElement } from "./runtime/intrinsic.js";
 import { flushJobs } from "./scheduler.js";
+import { trace, TracePhase } from "./tracer.js";
 const {
   builders: {
     align,
@@ -122,10 +126,6 @@ export function createRenderTreeHook(subtree, hooks) {
 export function isPrintHook(type) {
   return typeof type === "object" && type !== null && printHookTag in type;
 }
-function traceRender(phase, message) {
-  return false;
-  //console.log(`[\x1b[34m${phase}\x1b[0m]: ${message()}`);
-}
 export function render(children, options) {
   const tree = renderTree(children);
   flushJobs();
@@ -197,7 +197,10 @@ export function renderTree(children) {
   return rootElem;
 }
 function renderWorker(node, children) {
-  traceRender("render", () => dumpChildren(children));
+  if (!getContext()) {
+    throw new Error("Cannot render without a context. Make sure you are using the Output component.");
+  }
+  trace(TracePhase.render.worker, () => dumpChildren(children));
   if (Array.isArray(node)) {
     nodesToContext.set(node, getContext());
   }
@@ -210,19 +213,19 @@ function renderWorker(node, children) {
   }
 }
 function appendChild(node, rawChild) {
-  traceRender("appendChild", () => debugPrintChild(rawChild));
+  trace(TracePhase.render.appendChild, () => debugPrintChild(rawChild));
   const child = normalizeChild(rawChild);
   if (typeof child === "string") {
     node.push(child);
   } else {
     const cache = getElementCache();
     if (cache.has(child)) {
-      traceRender("appendChild:cached", () => debugPrintChild(child));
+      trace(TracePhase.render.appendChild, () => "Cached: " + debugPrintChild(child));
       node.push(cache.get(child));
       return;
     }
     if (isCustomContext(child)) {
-      traceRender("appendChild:custom-context", () => debugPrintChild(child));
+      trace(TracePhase.render.appendChild, () => "CustomContext: " + debugPrintChild(child));
       child.useCustomContext(children => {
         const newNode = [];
         renderWorker(newNode, children);
@@ -230,8 +233,8 @@ function appendChild(node, rawChild) {
         cache.set(child, newNode);
       });
     } else if (isIntrinsicElement(child)) {
+      trace(TracePhase.render.appendChild, () => "IntrinsicElement: " + debugPrintChild(child));
       // don't need a new context here because intrinsics are never reactive
-      traceRender("appendChild:intrinsic-element", () => debugPrintChild(child));
       const newNode = [];
       function formatHookWithChildren(command) {
         node.push(createRenderTreeHook(newNode, {
@@ -322,20 +325,20 @@ function appendChild(node, rawChild) {
       }
     } else if (isComponentCreator(child)) {
       effect(() => {
-        traceRender("appendChild:component", () => debugPrintChild(child));
+        trace(TracePhase.render.appendChild, () => "Component: " + debugPrintChild(child));
         const componentRoot = [];
         pushStack(child.component, child.props);
         renderWorker(componentRoot, untrack(child));
         popStack();
         node.push(componentRoot);
         cache.set(child, componentRoot);
-        traceRender("appendChild:component-done", () => debugPrintChild(child));
+        trace(TracePhase.render.appendChild, () => "Component done: " + debugPrintChild(child));
       });
     } else if (typeof child === "function") {
-      traceRender("appendChild:memo", () => child.toString());
+      trace(TracePhase.render.appendChild, () => "Memo: " + child.toString());
       const index = node.length;
       effect(() => {
-        traceRender("memoEffect:run", () => "");
+        trace(TracePhase.render.renderEffect, () => "");
         let res = child();
         while (typeof res === "function" && !isComponentCreator(res)) {
           res = res();
@@ -346,7 +349,6 @@ function appendChild(node, rawChild) {
         cache.set(child, newNodes);
         return newNodes;
       });
-      traceRender("appendChild:memo-done", () => "");
     } else {
       throw new Error("Unexpected child type");
     }
@@ -392,6 +394,8 @@ function debugPrintChild(child) {
     return "$memo";
   } else if (isRef(child)) {
     return "$ref";
+  } else if (isIntrinsicElement(child)) {
+    return `<${child.name}>`;
   } else {
     return JSON.stringify(child);
   }
@@ -424,4 +428,53 @@ function printTreeWorker(tree) {
     }
   }
   return doc;
+}
+// debugging utilities
+const renderStack = [];
+export function pushStack(component, props) {
+  if (!shouldDebug()) return;
+  renderStack.push({
+    component,
+    props
+  });
+}
+export function popStack() {
+  if (!shouldDebug()) return;
+  renderStack.pop();
+}
+export function printRenderStack() {
+  if (!shouldDebug()) return;
+
+  // eslint-disable-next-line no-console
+  console.error("Error rendering:");
+  for (let i = renderStack.length - 1; i >= 0; i--) {
+    const {
+      component,
+      props
+    } = renderStack[i];
+    // eslint-disable-next-line no-console
+    console.error(`    at ${component.name}(${inspectProps(props)})`);
+  }
+}
+function inspectProps(props) {
+  return JSON.stringify(Object.fromEntries(Object.entries(props).map(([key, value]) => {
+    let safeValue;
+    switch (typeof value) {
+      case "string":
+      case "number":
+      case "boolean":
+        safeValue = value;
+        break;
+      case "undefined":
+        safeValue = "undefined";
+        break;
+      case "object":
+        safeValue = value ? "{...}" : null;
+        break;
+      case "function":
+        safeValue = "function";
+        break;
+    }
+    return [key, safeValue];
+  })));
 }

package/dist/src/runtime/component.d.ts

@@ -0,0 +1,24 @@
+import { Ref } from "@vue/reactivity";
+import { CustomContext } from "../reactivity.js";
+import { Refkey } from "../refkey.js";
+import { IntrinsicElement } from "./intrinsic.js";
+export type Child = string | boolean | number | undefined | null | void | (() => Children) | Ref | Refkey | CustomContext | IntrinsicElement;
+export type Children = Child | Children[];
+export type Props = Record<string, any>;
+export interface ComponentDefinition<TProps = Props> {
+    (props: TProps): Children;
+}
+export interface Component<TProps = Props> {
+    (props: TProps): Children;
+    tag?: symbol;
+}
+export interface ComponentCreator<TProps = Props> {
+    component: Component<TProps>;
+    (): Children;
+    props: TProps;
+    tag?: symbol;
+}
+export declare function isComponentCreator<TProps = any>(item: unknown, component?: Component<TProps>): item is ComponentCreator<TProps>;
+export declare function createComponent<TProps extends Props = Props>(C: Component<TProps>, props: TProps): ComponentCreator<TProps>;
+export declare function taggedComponent<TProps = Props>(tag: symbol, component: Component<TProps>): Component<TProps> & Required<Pick<Component<TProps>, "tag">>;
+//# sourceMappingURL=component.d.ts.map

package/dist/src/runtime/component.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"component.d.ts","sourceRoot":"","sources":["../../../src/runtime/component.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,iBAAiB,CAAC;AACtC,OAAO,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AACjD,OAAO,EAAE,MAAM,EAAE,MAAM,cAAc,CAAC;AACtC,OAAO,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AAElD,MAAM,MAAM,KAAK,GACb,MAAM,GACN,OAAO,GACP,MAAM,GACN,SAAS,GACT,IAAI,GACJ,IAAI,GACJ,CAAC,MAAM,QAAQ,CAAC,GAChB,GAAG,GACH,MAAM,GACN,aAAa,GACb,gBAAgB,CAAC;AAErB,MAAM,MAAM,QAAQ,GAAG,KAAK,GAAG,QAAQ,EAAE,CAAC;AAC1C,MAAM,MAAM,KAAK,GAAG,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;AAExC,MAAM,WAAW,mBAAmB,CAAC,MAAM,GAAG,KAAK;IACjD,CAAC,KAAK,EAAE,MAAM,GAAG,QAAQ,CAAC;CAC3B;AACD,MAAM,WAAW,SAAS,CAAC,MAAM,GAAG,KAAK;IACvC,CAAC,KAAK,EAAE,MAAM,GAAG,QAAQ,CAAC;IAC1B,GAAG,CAAC,EAAE,MAAM,CAAC;CACd;AAED,MAAM,WAAW,gBAAgB,CAAC,MAAM,GAAG,KAAK;IAC9C,SAAS,EAAE,SAAS,CAAC,MAAM,CAAC,CAAC;IAC7B,IAAI,QAAQ,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;IACd,GAAG,CAAC,EAAE,MAAM,CAAC;CACd;AAED,wBAAgB,kBAAkB,CAAC,MAAM,GAAG,GAAG,EAC7C,IAAI,EAAE,OAAO,EACb,SAAS,CAAC,EAAE,SAAS,CAAC,MAAM,CAAC,GAC5B,IAAI,IAAI,gBAAgB,CAAC,MAAM,CAAC,CAKlC;AAED,wBAAgB,eAAe,CAAC,MAAM,SAAS,KAAK,GAAG,KAAK,EAC1D,CAAC,EAAE,SAAS,CAAC,MAAM,CAAC,EACpB,KAAK,EAAE,MAAM,GACZ,gBAAgB,CAAC,MAAM,CAAC,CAS1B;AAED,wBAAgB,eAAe,CAAC,MAAM,GAAG,KAAK,EAC5C,GAAG,EAAE,MAAM,EACX,SAAS,EAAE,SAAS,CAAC,MAAM,CAAC,GAC3B,SAAS,CAAC,MAAM,CAAC,GAAG,QAAQ,CAAC,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,EAAE,KAAK,CAAC,CAAC,CAG9D"}

package/dist/src/runtime/component.js

@@ -0,0 +1,19 @@
+export function isComponentCreator(item, component) {
+  if (!component) {
+    return typeof item === "function" && item.component;
+  }
+  return typeof item === "function" && item.component === component;
+}
+export function createComponent(C, props) {
+  const creator = () => /* */C(props);
+  creator.props = props;
+  creator.component = C;
+  if (C.tag) {
+    creator.tag = C.tag;
+  }
+  return creator;
+}
+export function taggedComponent(tag, component) {
+  component.tag = tag;
+  return component;
+}