npm - fibrae - Versions diffs - 0.1.0 - Mend

fibrae 0.1.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 (70) hide show

package/dist/components.d.ts +40 -0
package/dist/components.js +63 -0
package/dist/components.js.map +1 -0
package/dist/core.d.ts +25 -0
package/dist/core.js +46 -0
package/dist/core.js.map +1 -0
package/dist/dom.d.ts +16 -0
package/dist/dom.js +67 -0
package/dist/dom.js.map +1 -0
package/dist/fiber-render.d.ts +33 -0
package/dist/fiber-render.js +1069 -0
package/dist/fiber-render.js.map +1 -0
package/dist/h.d.ts +19 -0
package/dist/h.js +26 -0
package/dist/h.js.map +1 -0
package/dist/hydration.d.ts +30 -0
package/dist/hydration.js +375 -0
package/dist/hydration.js.map +1 -0
package/dist/index.d.ts +26 -0
package/dist/index.js +28 -0
package/dist/index.js.map +1 -0
package/dist/jsx-runtime/index.d.ts +29 -0
package/dist/jsx-runtime/index.js +61 -0
package/dist/jsx-runtime/index.js.map +1 -0
package/dist/render.d.ts +19 -0
package/dist/render.js +325 -0
package/dist/render.js.map +1 -0
package/dist/router/History.d.ts +129 -0
package/dist/router/History.js +241 -0
package/dist/router/History.js.map +1 -0
package/dist/router/Link.d.ts +52 -0
package/dist/router/Link.js +131 -0
package/dist/router/Link.js.map +1 -0
package/dist/router/Navigator.d.ts +108 -0
package/dist/router/Navigator.js +225 -0
package/dist/router/Navigator.js.map +1 -0
package/dist/router/Route.d.ts +65 -0
package/dist/router/Route.js +143 -0
package/dist/router/Route.js.map +1 -0
package/dist/router/Router.d.ts +167 -0
package/dist/router/Router.js +328 -0
package/dist/router/Router.js.map +1 -0
package/dist/router/RouterBuilder.d.ts +128 -0
package/dist/router/RouterBuilder.js +112 -0
package/dist/router/RouterBuilder.js.map +1 -0
package/dist/router/RouterOutlet.d.ts +57 -0
package/dist/router/RouterOutlet.js +132 -0
package/dist/router/RouterOutlet.js.map +1 -0
package/dist/router/RouterState.d.ts +102 -0
package/dist/router/RouterState.js +94 -0
package/dist/router/RouterState.js.map +1 -0
package/dist/router/index.d.ts +28 -0
package/dist/router/index.js +31 -0
package/dist/router/index.js.map +1 -0
package/dist/runtime.d.ts +55 -0
package/dist/runtime.js +68 -0
package/dist/runtime.js.map +1 -0
package/dist/scope-utils.d.ts +14 -0
package/dist/scope-utils.js +29 -0
package/dist/scope-utils.js.map +1 -0
package/dist/server.d.ts +112 -0
package/dist/server.js +313 -0
package/dist/server.js.map +1 -0
package/dist/shared.d.ts +136 -0
package/dist/shared.js +53 -0
package/dist/shared.js.map +1 -0
package/dist/tracking.d.ts +23 -0
package/dist/tracking.js +53 -0
package/dist/tracking.js.map +1 -0
package/package.json +62 -0

package/dist/server.d.ts ADDED Viewed

@@ -0,0 +1,112 @@
+/**
+ * Server-side rendering for Fibrae
+ *
+ * Renders VElement trees to HTML strings for SSR.
+ * Integrates with @effect-atom/atom's Hydration module for state serialization.
+ *
+ * Key design decisions (see docs/ssr-hydration-design.md):
+ * - Streams restart on client (no server continuation)
+ * - Atoms must use Atom.serializable() for state transfer
+ * - Same components work on server and client
+ */
+import * as Effect from "effect/Effect";
+import { Atom, Registry as AtomRegistry, Hydration } from "@effect-atom/atom";
+import { type VElement } from "./shared.js";
+/**
+ * Result of renderToString - HTML plus serialized state
+ *
+ * The dehydratedState can be serialized and embedded in your HTML however
+ * you prefer (script tag, data attribute, separate endpoint, etc.).
+ * On the client, pass this state to render() via the initialState option.
+ */
+export interface RenderResult {
+    readonly html: string;
+    readonly dehydratedState: ReadonlyArray<Hydration.DehydratedAtom>;
+}
+/**
+ * Options for SSR rendering
+ */
+export interface RenderOptions {
+    /**
+     * Initial atom values to use during rendering.
+     * These will be set on the registry before rendering begins.
+     */
+    readonly initialValues?: Iterable<readonly [Atom.Atom<unknown>, unknown]>;
+}
+/**
+ * Create a synchronous AtomRegistry layer for SSR.
+ * Uses synchronous task scheduling since we're not in a browser.
+ */
+declare const SSRAtomRegistryLayer: import("effect/Layer").Layer<AtomRegistry.AtomRegistry, never, never>;
+/**
+ * Exported for SSR scenarios that need to compose with other layers.
+ * Use this when you need to provide additional services (e.g., Navigator, RouterHandlers)
+ * alongside the AtomRegistry.
+ */
+export { SSRAtomRegistryLayer };
+/**
+ * Render a VElement tree to an HTML string with serialized state.
+ *
+ * Returns the HTML and the dehydrated atom state array. You can serialize
+ * and embed the state in your HTML however you prefer (script tag, data
+ * attribute, separate endpoint, etc.).
+ *
+ * On the client, pass this state to render() via the initialState option
+ * to hydrate atom values before DOM hydration.
+ *
+ * Note: Atoms must use `Atom.serializable({ key, schema })` to be included
+ * in the dehydrated state.
+ *
+ * @example
+ * ```typescript
+ * import { renderToString } from "fibrae/server";
+ *
+ * const program = Effect.gen(function* () {
+ *   const { html, dehydratedState } = yield* renderToString(<App />);
+ *
+ *   // Embed state however you prefer
+ *   const page = `
+ *     <!DOCTYPE html>
+ *     <html>
+ *       <body>
+ *         <div id="root">${html}</div>
+ *         <script>window.__STATE__ = ${JSON.stringify(dehydratedState)}</script>
+ *         <script src="/client.js"></script>
+ *       </body>
+ *     </html>
+ *   `;
+ *   return page;
+ * });
+ * ```
+ */
+export declare const renderToString: (element: VElement, _options?: RenderOptions) => Effect.Effect<RenderResult, unknown, never>;
+/**
+ * Render a VElement tree to HTML, requiring AtomRegistry and any other
+ * services the component tree needs.
+ *
+ * Use this when your components require additional services (Navigator, RouterHandlers, etc.)
+ * that you want to provide yourself.
+ *
+ * @example
+ * ```typescript
+ * import { renderToStringWith, SSRAtomRegistryLayer } from "fibrae/server";
+ *
+ * const program = Effect.gen(function* () {
+ *   const { html, dehydratedState } = yield* renderToStringWith(<App />);
+ *   return { html, dehydratedState };
+ * });
+ *
+ * // Run with composed layers
+ * const result = Effect.runPromise(
+ *   program.pipe(
+ *     Effect.provide(Layer.mergeAll(
+ *       SSRAtomRegistryLayer,
+ *       navigatorLayer,
+ *       routerHandlersLayer
+ *     ))
+ *   )
+ * );
+ * ```
+ */
+export declare const renderToStringWith: <R>(element: VElement, _options?: RenderOptions) => Effect.Effect<RenderResult, unknown, AtomRegistry.AtomRegistry | R>;
+export { Hydration };

package/dist/server.js ADDED Viewed

@@ -0,0 +1,313 @@
+/**
+ * Server-side rendering for Fibrae
+ *
+ * Renders VElement trees to HTML strings for SSR.
+ * Integrates with @effect-atom/atom's Hydration module for state serialization.
+ *
+ * Key design decisions (see docs/ssr-hydration-design.md):
+ * - Streams restart on client (no server continuation)
+ * - Atoms must use Atom.serializable() for state transfer
+ * - Same components work on server and client
+ */
+import * as Effect from "effect/Effect";
+import * as Stream from "effect/Stream";
+import * as Option from "effect/Option";
+import * as Deferred from "effect/Deferred";
+import { Atom, Registry as AtomRegistry, Hydration, } from "@effect-atom/atom";
+import { isStream, isProperty, } from "./shared.js";
+// =============================================================================
+// SSR Registry Layer
+// =============================================================================
+/**
+ * Create a synchronous AtomRegistry layer for SSR.
+ * Uses synchronous task scheduling since we're not in a browser.
+ */
+const SSRAtomRegistryLayer = AtomRegistry.layerOptions({
+    scheduleTask: (f) => f(),
+});
+/**
+ * Exported for SSR scenarios that need to compose with other layers.
+ * Use this when you need to provide additional services (e.g., Navigator, RouterHandlers)
+ * alongside the AtomRegistry.
+ */
+export { SSRAtomRegistryLayer };
+// =============================================================================
+// HTML Escaping
+// =============================================================================
+const escapeHtml = (str) => {
+    return str
+        .replace(/&/g, "&amp;")
+        .replace(/</g, "&lt;")
+        .replace(/>/g, "&gt;")
+        .replace(/"/g, "&quot;")
+        .replace(/'/g, "&#039;");
+};
+// =============================================================================
+// Attribute Rendering
+// =============================================================================
+/**
+ * Convert a prop name to its HTML attribute name
+ */
+const propToAttr = (prop) => {
+    // Handle className -> class
+    if (prop === "className")
+        return "class";
+    // Handle htmlFor -> for
+    if (prop === "htmlFor")
+        return "for";
+    // Convert camelCase to kebab-case for data-* and aria-*
+    if (prop.startsWith("data") || prop.startsWith("aria")) {
+        return prop.replace(/([A-Z])/g, "-$1").toLowerCase();
+    }
+    return prop;
+};
+/**
+ * Render a single attribute to string
+ */
+const renderAttribute = (name, value) => {
+    if (value === true) {
+        return ` ${name}`;
+    }
+    if (value === false || value === null || value === undefined) {
+        return "";
+    }
+    return ` ${name}="${escapeHtml(String(value))}"`;
+};
+/**
+ * Render all props as HTML attributes
+ */
+const renderAttributes = (props) => {
+    let attrs = "";
+    for (const [key, value] of Object.entries(props)) {
+        if (isProperty(key)) {
+            attrs += renderAttribute(propToAttr(key), value);
+        }
+    }
+    return attrs;
+};
+// =============================================================================
+// Void Elements (self-closing)
+// =============================================================================
+const VOID_ELEMENTS = new Set([
+    "area", "base", "br", "col", "embed", "hr", "img", "input",
+    "link", "meta", "param", "source", "track", "wbr",
+]);
+// =============================================================================
+// Core Rendering
+// =============================================================================
+/**
+ * Check if a type is a function component
+ */
+const isFunctionComponent = (type) => typeof type === "function";
+/**
+ * Check if a type is a host element (string tag)
+ */
+const isHostElement = (type) => typeof type === "string";
+/**
+ * Render a VElement to HTML string.
+ * This is an Effect that requires AtomRegistry.
+ */
+const renderVElementToString = (vElement) => Effect.gen(function* () {
+    const type = vElement.type;
+    if (isFunctionComponent(type)) {
+        // Invoke the component, catching synchronous throws
+        const outputEffect = Effect.try({
+            try: () => type(vElement.props),
+            catch: (e) => e,
+        });
+        const output = yield* outputEffect;
+        // Normalize to get the VElement
+        let childVElement;
+        if (isStream(output)) {
+            // For streams, take first emission
+            const first = yield* Stream.runHead(output);
+            if (Option.isNone(first)) {
+                return ""; // Empty stream
+            }
+            childVElement = first.value;
+        }
+        else if (Effect.isEffect(output)) {
+            // Await the effect
+            childVElement = yield* output;
+        }
+        else {
+            // Plain VElement
+            childVElement = output;
+        }
+        // Recursively render the result
+        return yield* renderVElementToString(childVElement);
+    }
+    else if (type === "TEXT_ELEMENT") {
+        // Text node - escape and return
+        return escapeHtml(String(vElement.props.nodeValue ?? ""));
+    }
+    else if (type === "FRAGMENT") {
+        // Fragment - render children directly
+        const children = vElement.props.children ?? [];
+        let html = "";
+        for (const child of children) {
+            html += yield* renderVElementToString(child);
+        }
+        return html;
+    }
+    else if (type === "ERROR_BOUNDARY") {
+        // Error boundary - try to render children, catch errors and render fallback
+        const fallback = vElement.props.fallback;
+        const children = vElement.props.children;
+        const result = yield* Effect.either(Effect.gen(function* () {
+            let html = "";
+            for (const child of children) {
+                html += yield* renderVElementToString(child);
+            }
+            return html;
+        }));
+        if (result._tag === "Left") {
+            // Error occurred - render fallback
+            const onError = vElement.props.onError;
+            onError?.(result.left);
+            return yield* renderVElementToString(fallback);
+        }
+        return result.right;
+    }
+    else if (type === "SUSPENSE") {
+        // Suspense boundary - race child rendering against timeout
+        // Phase 5: If children complete first → resolved marker
+        //          If timeout fires first → fallback marker
+        const fallback = vElement.props.fallback;
+        const threshold = vElement.props.threshold ?? 100;
+        const children = vElement.props.children;
+        // Create a Deferred to signal when children complete
+        const childrenComplete = yield* Deferred.make();
+        // Fork: render children to string
+        yield* Effect.fork(Effect.gen(function* () {
+            let childrenHtml = "";
+            for (const child of children) {
+                childrenHtml += yield* renderVElementToString(child);
+            }
+            yield* Deferred.succeed(childrenComplete, childrenHtml);
+        }).pipe(Effect.catchAll((e) => Deferred.fail(childrenComplete, e))));
+        // Race: children completing vs timeout
+        const result = yield* Effect.race(Deferred.await(childrenComplete).pipe(Effect.map((html) => ({ type: "resolved", html }))), Effect.sleep(`${threshold} millis`).pipe(Effect.as({ type: "timeout" })));
+        if (result.type === "resolved") {
+            // Children completed before timeout - render with resolved marker
+            return `<!--fibrae:sus:resolved-->${result.html}<!--/fibrae:sus-->`;
+        }
+        else {
+            // Timeout fired first - render fallback with fallback marker
+            const fallbackHtml = yield* renderVElementToString(fallback);
+            return `<!--fibrae:sus:fallback-->${fallbackHtml}<!--/fibrae:sus-->`;
+        }
+    }
+    else if (isHostElement(type)) {
+        // Regular HTML element
+        const attrs = renderAttributes(vElement.props);
+        // Add data-key for keyed elements (needed for hydration)
+        const key = vElement.props.key;
+        const keyAttr = key != null ? ` data-key="${escapeHtml(String(key))}"` : "";
+        if (VOID_ELEMENTS.has(type)) {
+            return `<${type}${attrs}${keyAttr} />`;
+        }
+        // Render children with text node markers between adjacent text nodes
+        // This preserves text node boundaries for hydration (React's approach)
+        const children = vElement.props.children ?? [];
+        let childrenHtml = "";
+        let prevWasText = false;
+        for (const child of children) {
+            const isText = child.type === "TEXT_ELEMENT";
+            // Insert marker between adjacent text nodes to preserve boundaries
+            if (prevWasText && isText) {
+                childrenHtml += "<!--fibrae:$-->";
+            }
+            childrenHtml += yield* renderVElementToString(child);
+            prevWasText = isText;
+        }
+        return `<${type}${attrs}${keyAttr}>${childrenHtml}</${type}>`;
+    }
+    // Unknown type
+    return "";
+});
+// =============================================================================
+// Public API
+// =============================================================================
+/**
+ * Render a VElement tree to an HTML string with serialized state.
+ *
+ * Returns the HTML and the dehydrated atom state array. You can serialize
+ * and embed the state in your HTML however you prefer (script tag, data
+ * attribute, separate endpoint, etc.).
+ *
+ * On the client, pass this state to render() via the initialState option
+ * to hydrate atom values before DOM hydration.
+ *
+ * Note: Atoms must use `Atom.serializable({ key, schema })` to be included
+ * in the dehydrated state.
+ *
+ * @example
+ * ```typescript
+ * import { renderToString } from "fibrae/server";
+ *
+ * const program = Effect.gen(function* () {
+ *   const { html, dehydratedState } = yield* renderToString(<App />);
+ *
+ *   // Embed state however you prefer
+ *   const page = `
+ *     <!DOCTYPE html>
+ *     <html>
+ *       <body>
+ *         <div id="root">${html}</div>
+ *         <script>window.__STATE__ = ${JSON.stringify(dehydratedState)}</script>
+ *         <script src="/client.js"></script>
+ *       </body>
+ *     </html>
+ *   `;
+ *   return page;
+ * });
+ * ```
+ */
+export const renderToString = (element, _options) => Effect.gen(function* () {
+    const registry = yield* AtomRegistry.AtomRegistry;
+    // Render the element
+    const html = yield* renderVElementToString(element);
+    // Dehydrate the registry state
+    const dehydratedState = Hydration.dehydrate(registry);
+    return { html, dehydratedState };
+}).pipe(Effect.provide(SSRAtomRegistryLayer));
+/**
+ * Render a VElement tree to HTML, requiring AtomRegistry and any other
+ * services the component tree needs.
+ *
+ * Use this when your components require additional services (Navigator, RouterHandlers, etc.)
+ * that you want to provide yourself.
+ *
+ * @example
+ * ```typescript
+ * import { renderToStringWith, SSRAtomRegistryLayer } from "fibrae/server";
+ *
+ * const program = Effect.gen(function* () {
+ *   const { html, dehydratedState } = yield* renderToStringWith(<App />);
+ *   return { html, dehydratedState };
+ * });
+ *
+ * // Run with composed layers
+ * const result = Effect.runPromise(
+ *   program.pipe(
+ *     Effect.provide(Layer.mergeAll(
+ *       SSRAtomRegistryLayer,
+ *       navigatorLayer,
+ *       routerHandlersLayer
+ *     ))
+ *   )
+ * );
+ * ```
+ */
+export const renderToStringWith = (element, _options) => Effect.gen(function* () {
+    const registry = yield* AtomRegistry.AtomRegistry;
+    // Render the element
+    const html = yield* renderVElementToString(element);
+    // Dehydrate the registry state
+    const dehydratedState = Hydration.dehydrate(registry);
+    return { html, dehydratedState };
+});
+// Re-export Hydration for convenience
+export { Hydration };
+//# sourceMappingURL=server.js.map

package/dist/server.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"server.js","sourceRoot":"","sources":["../src/server.ts"],"names":[],"mappings":"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"}

package/dist/shared.d.ts ADDED Viewed

@@ -0,0 +1,136 @@
+import * as Option from "effect/Option";
+import * as Stream from "effect/Stream";
+import * as Effect from "effect/Effect";
+import * as Scope from "effect/Scope";
+import * as Deferred from "effect/Deferred";
+import * as Context from "effect/Context";
+import { Atom as BaseAtom } from "@effect-atom/atom";
+/**
+ * Primitive element types: HTML tags, text nodes, fragments, error boundary, or suspense
+ */
+export type Primitive = keyof HTMLElementTagNameMap | "TEXT_ELEMENT" | "FRAGMENT" | "ERROR_BOUNDARY" | "SUSPENSE";
+/**
+ * Element type can be a primitive or a component function
+ * Components can return VElement, Effect, or Stream
+ */
+export type ElementType<Props = {}> = Primitive | ((props: Props) => VElement | Stream.Stream<VElement, any, any> | Effect.Effect<VElement, any, any>);
+/**
+ * Virtual element representation - the core unit of the virtual DOM
+ */
+export interface VElement {
+    type: ElementType;
+    props: {
+        [key: string]: unknown;
+        children?: VElement[];
+    };
+}
+/**
+ * Mutable reference to a fiber for component instances
+ */
+export type FiberRef = {
+    current: Fiber;
+};
+/**
+ * Suspense boundary configuration
+ *
+ * Supports optimistic rendering: try children first, show fallback if they take
+ * too long. Suspended fibers are "parked" to continue processing in background.
+ */
+export type SuspenseConfig = {
+    fallback: VElement;
+    threshold: number;
+    showingFallback: boolean;
+    /** Reference to the original child fiber that's still processing in background */
+    parkedFiber: Option.Option<Fiber>;
+    /** Deferred that signals when parked fiber completes first render */
+    parkedComplete: Option.Option<Deferred.Deferred<void>>;
+};
+/**
+ * Error boundary configuration
+ */
+export type ErrorBoundaryConfig = {
+    fallback: VElement;
+    onError?: (cause: unknown) => void;
+    hasError: boolean;
+};
+/**
+ * Fiber node - represents a unit of work in the reconciliation tree
+ * Contains all state needed for rendering, effects, and diffing
+ */
+export interface Fiber {
+    type: Option.Option<ElementType>;
+    props: {
+        [key: string]: unknown;
+        children?: VElement[];
+    };
+    dom: Option.Option<Node>;
+    parent: Option.Option<Fiber>;
+    child: Option.Option<Fiber>;
+    sibling: Option.Option<Fiber>;
+    alternate: Option.Option<Fiber>;
+    effectTag: Option.Option<"UPDATE" | "PLACEMENT" | "DELETION">;
+    componentScope: Option.Option<Scope.Scope>;
+    accessedAtoms: Option.Option<Set<BaseAtom.Atom<any>>>;
+    latestStreamValue: Option.Option<VElement>;
+    childFirstCommitDeferred: Option.Option<Deferred.Deferred<void>>;
+    fiberRef: Option.Option<FiberRef>;
+    isMultiEmissionStream: boolean;
+    errorBoundary: Option.Option<ErrorBoundaryConfig>;
+    suspense: Option.Option<SuspenseConfig>;
+    /** Context captured during render phase, used for event handlers in commit phase */
+    renderContext: Option.Option<Context.Context<unknown>>;
+    /** True if this fiber is parked (suspended) - scope should not be closed on deletion */
+    isParked: boolean;
+    /** True when fiber is being restored from parked state - skip component re-execution */
+    isUnparking: boolean;
+}
+/**
+ * Helper to check if a key is an event handler
+ */
+export declare const isEvent: (key: string) => boolean;
+/**
+ * Helper to check if a key is a regular property (not children, ref, key, or event)
+ */
+export declare const isProperty: (key: string) => boolean;
+/**
+ * Check if an element type is a primitive (string) or component (function)
+ */
+export declare const isPrimitive: (type: ElementType) => type is Primitive;
+/**
+ * Check if element type is a component function
+ */
+export declare const isComponent: (type: ElementType) => type is (props: {}) => VElement | Stream.Stream<VElement, any, any> | Effect.Effect<VElement, any, any>;
+export declare const isStream: (value: unknown) => value is Stream.Stream<any, any, any>;
+declare const HydrationMismatch_base: new <A extends Record<string, any> = {}>(args: import("effect/Types").Equals<A, {}> extends true ? void : { readonly [P in keyof A as P extends "_tag" ? never : P]: A[P]; }) => import("effect/Cause").YieldableError & {
+    readonly _tag: "HydrationMismatch";
+} & Readonly<A>;
+/**
+ * Error thrown when DOM structure doesn't match VElement tree during hydration.
+ *
+ * This is a tagged error that can be caught via Effect.catchTag("HydrationMismatch", ...).
+ *
+ * Structural mismatches (tag name, child count) indicate a bug where server and client
+ * rendered different component trees.
+ *
+ * @example
+ * ```typescript
+ * yield* render(<App />, container, { initialState }).pipe(
+ *   Effect.catchTag("HydrationMismatch", (err) => {
+ *     console.error(`Hydration failed at ${err.path}: expected ${err.expected}, got ${err.actual}`);
+ *     // Fallback: clear container and do fresh render
+ *     container.innerHTML = "";
+ *     return render(<App />, container);
+ *   })
+ * );
+ * ```
+ */
+export declare class HydrationMismatch extends HydrationMismatch_base<{
+    /** What the VElement tree expected (e.g., "div", "3 children") */
+    readonly expected: string;
+    /** What the DOM actually had (e.g., "span", "2 children") */
+    readonly actual: string;
+    /** Human-readable path to the mismatch location (e.g., "div > ul > li:2") */
+    readonly path: string;
+}> {
+}
+export {};

package/dist/shared.js ADDED Viewed

@@ -0,0 +1,53 @@
+import * as Option from "effect/Option";
+import * as Stream from "effect/Stream";
+import * as Effect from "effect/Effect";
+import * as Scope from "effect/Scope";
+import * as Deferred from "effect/Deferred";
+import * as Data from "effect/Data";
+import * as Context from "effect/Context";
+import { Atom as BaseAtom } from "@effect-atom/atom";
+/**
+ * Helper to check if a key is an event handler
+ */
+export const isEvent = (key) => key.startsWith("on");
+/**
+ * Helper to check if a key is a regular property (not children, ref, key, or event)
+ */
+export const isProperty = (key) => key !== "children" && key !== "ref" && key !== "key" && !isEvent(key);
+/**
+ * Check if an element type is a primitive (string) or component (function)
+ */
+export const isPrimitive = (type) => typeof type === "string";
+/**
+ * Check if element type is a component function
+ */
+export const isComponent = (type) => typeof type === "function";
+export const isStream = (value) => (typeof value === "object" &&
+    value !== null &&
+    Stream.StreamTypeId in value);
+// =============================================================================
+// Hydration Errors
+// =============================================================================
+/**
+ * Error thrown when DOM structure doesn't match VElement tree during hydration.
+ *
+ * This is a tagged error that can be caught via Effect.catchTag("HydrationMismatch", ...).
+ *
+ * Structural mismatches (tag name, child count) indicate a bug where server and client
+ * rendered different component trees.
+ *
+ * @example
+ * ```typescript
+ * yield* render(<App />, container, { initialState }).pipe(
+ *   Effect.catchTag("HydrationMismatch", (err) => {
+ *     console.error(`Hydration failed at ${err.path}: expected ${err.expected}, got ${err.actual}`);
+ *     // Fallback: clear container and do fresh render
+ *     container.innerHTML = "";
+ *     return render(<App />, container);
+ *   })
+ * );
+ * ```
+ */
+export class HydrationMismatch extends Data.TaggedError("HydrationMismatch") {
+}
+//# sourceMappingURL=shared.js.map

package/dist/shared.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"shared.js","sourceRoot":"","sources":["../src/shared.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,MAAM,eAAe,CAAC;AACxC,OAAO,KAAK,MAAM,MAAM,eAAe,CAAC;AACxC,OAAO,KAAK,MAAM,MAAM,eAAe,CAAC;AACxC,OAAO,KAAK,KAAK,MAAM,cAAc,CAAC;AACtC,OAAO,KAAK,QAAQ,MAAM,iBAAiB,CAAC;AAC5C,OAAO,KAAK,IAAI,MAAM,aAAa,CAAC;AACpC,OAAO,KAAK,OAAO,MAAM,gBAAgB,CAAC;AAC1C,OAAO,EAAE,IAAI,IAAI,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAwFrD;;GAEG;AACH,MAAM,CAAC,MAAM,OAAO,GAAG,CAAC,GAAW,EAAE,EAAE,CAAC,GAAG,CAAC,UAAU,CAAC,IAAI,CAAC,CAAC;AAE7D;;GAEG;AACH,MAAM,CAAC,MAAM,UAAU,GAAG,CAAC,GAAW,EAAE,EAAE,CACxC,GAAG,KAAK,UAAU,IAAI,GAAG,KAAK,KAAK,IAAI,GAAG,KAAK,KAAK,IAAI,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC;AAExE;;GAEG;AACH,MAAM,CAAC,MAAM,WAAW,GAAG,CAAC,IAAiB,EAAqB,EAAE,CAClE,OAAO,IAAI,KAAK,QAAQ,CAAC;AAE3B;;GAEG;AACH,MAAM,CAAC,MAAM,WAAW,GAAG,CAAC,IAAiB,EAAE,EAAE,CAC/C,OAAO,IAAI,KAAK,UAAU,CAAC;AAE7B,MAAM,CAAC,MAAM,QAAQ,GAAG,CAAC,KAAc,EAAyC,EAAE,CAAC,CACjF,OAAO,KAAK,KAAK,QAAQ;IACzB,KAAK,KAAK,IAAI;IACd,MAAM,CAAC,YAAY,IAAI,KAAK,CAC7B,CAAC;AAEF,gFAAgF;AAChF,mBAAmB;AACnB,gFAAgF;AAEhF;;;;;;;;;;;;;;;;;;;GAmBG;AACH,MAAM,OAAO,iBAAkB,SAAQ,IAAI,CAAC,WAAW,CAAC,mBAAmB,CAOzE;CAAG"}

package/dist/tracking.d.ts ADDED Viewed

@@ -0,0 +1,23 @@
+import * as Effect from "effect/Effect";
+import * as Stream from "effect/Stream";
+import * as Scope from "effect/Scope";
+import { Atom, Registry as AtomRegistry } from "@effect-atom/atom";
+import { type VElement } from "./shared.js";
+import { FibraeRuntime } from "./runtime.js";
+/**
+ * Normalize component output to a Stream.
+ * Components can return VElement, Effect<VElement, E>, or Stream<VElement, E>.
+ * Error type is preserved through the conversion.
+ */
+export declare const normalizeToStream: <E>(value: VElement | Effect.Effect<VElement, E, never> | Stream.Stream<VElement, E, never>) => Stream.Stream<VElement, E, never>;
+/**
+ * Create a tracking registry that records which atoms are accessed
+ */
+export declare const makeTrackingRegistry: (realRegistry: AtomRegistry.Registry, accessedAtoms: Set<Atom.Atom<unknown>>) => AtomRegistry.Registry;
+/**
+ * Subscribe to atom changes for reactivity.
+ * Uses registry.subscribe directly (like atom-react) instead of streams.
+ * This is simpler and more efficient - subscriptions are synchronous
+ * and cleanup is handled via scope finalizers.
+ */
+export declare const subscribeToAtoms: (atoms: Set<Atom.Atom<unknown>>, onUpdate: () => void, runtime: FibraeRuntime, scope: Scope.Scope.Closeable) => Effect.Effect<void, never, never>;