@craft-ts/component 0.7.0-beta.13

package/src/lib/pending-block.d.ts

@@ -0,0 +1,125 @@
+import { type CraftDirective } from './types';
+import type { CraftNodeChildren } from './render/vnode';
+import type { SsrMode } from '@craft-ts/core';
+export declare const PENDING_BLOCK_DIRECTIVE: unique symbol;
+/**
+ * Where the fallback is inserted relative to the suspended subtree. The subtree
+ * itself is kept mounted but **detached from the document** while it is
+ * pending (its nodes live in a DocumentFragment — they are not `hidden` via
+ * CSS), so its state survives the wait. Assistive tech is told via
+ * `aria-busy` / `aria-live` on the fallback, not via the detached source.
+ */
+export type PendingBlockPosition = 'before' | 'after';
+export type PendingFallback = () => CraftNodeChildren;
+/**
+ * What to render for one source. A bare function covers the suspended case; the
+ * object form adds `reloading`, rendered **next to the still-visible subtree**
+ * when the source already has a value and is refetching.
+ */
+export type PendingBlockHandler = PendingFallback | {
+    readonly pending: PendingFallback;
+    readonly reloading?: PendingFallback;
+};
+/** One handler per async source name, for the `.exhaustive` form. */
+export type PendingBlockHandlers = Readonly<Record<string, PendingBlockHandler>>;
+type HandlerChildrenOf<Handler> = Handler extends () => infer Children ? Children : Handler extends {
+    readonly pending: () => infer Pending;
+    readonly reloading?: () => infer Reloading;
+} ? Pending | Reloading : never;
+export type PendingBlockHandlerChildren<Handler> = HandlerChildrenOf<Handler>;
+/** Resolves the children a handler renders for one of its two states. */
+export declare function resolvePendingBlockHandler(handler: PendingBlockHandler, state: 'pending' | 'reloading'): CraftNodeChildren;
+/**
+ * Thrown when a `CraftNotSettled` escapes every `pendingBlock` boundary — the
+ * runtime counterpart of the compile-time check, for the cases the types cannot
+ * see (a settled read hidden inside a lambda, a dynamically built subtree).
+ */
+export declare class CraftUnhandledPendingError extends Error {
+    readonly source: string;
+    constructor(source: string);
+}
+export type PendingBlockDirective<Handlers extends PendingBlockHandlers | undefined = undefined, FallbackChildren extends CraftNodeChildren = CraftNodeChildren> = CraftDirective & {
+    readonly [PENDING_BLOCK_DIRECTIVE]: {
+        /** `undefined` for the catch-all form: every source below is covered. */
+        readonly handlers: Handlers;
+        readonly fallback: PendingFallback | undefined;
+        readonly reloading: PendingFallback | undefined;
+        readonly position: PendingBlockPosition;
+        readonly ssr: SsrMode | undefined;
+        /** Phantom carrier — the fallback's own nodes, never read at runtime. */
+        readonly fallbackChildren?: FallbackChildren;
+    };
+};
+/**
+ * The sources a `pendingBlock` leaves uncovered. The catch-all form covers
+ * everything below it; the `.exhaustive` form covers only the sources it names.
+ */
+export type PendingBlockResidualSources<Sources extends string, Handlers extends PendingBlockHandlers | undefined> = Handlers extends PendingBlockHandlers ? Exclude<Sources, Extract<keyof Handlers, string>> : never;
+/** Exhaustiveness check for `pendingBlock.exhaustive({...})`. */
+export type PendingBlockExhaustiveCheck<Sources extends string, Handlers extends PendingBlockHandlers> = [Exclude<Sources, Extract<keyof Handlers, string>>] extends [never] ? [Exclude<Extract<keyof Handlers, string>, Sources>] extends [never] ? unknown : {
+    'pendingBlock.exhaustive has fallbacks for sources that never suspend here': Exclude<Extract<keyof Handlers, string>, Sources>;
+} : {
+    'pendingBlock.exhaustive is missing a fallback for async sources': Exclude<Sources, Extract<keyof Handlers, string>>;
+};
+type PendingBlockBaseOptions<Fallback extends PendingFallback = PendingFallback> = Readonly<{
+    /**
+     * Rendered next to the still-visible subtree while a source that already has
+     * a value is refetching. A refetch does not suspend — the stale value stays
+     * on screen — so this is how the boundary reports it.
+     */
+    readonly reloading?: Fallback;
+    /** Where the fallback goes relative to the (hidden) subtree. Defaults to `'before'`. */
+    readonly position?: PendingBlockPosition;
+}>;
+/**
+ * A client-only SSR boundary must name the shell that replaces the skipped
+ * subtree. Other modes may omit it when an exhaustive handler or an outer
+ * boundary owns the pending UI.
+ */
+export type PendingBlockOptions<Fallback extends PendingFallback = PendingFallback> = PendingBlockBaseOptions<Fallback> & (Readonly<{
+    readonly ssr: 'client';
+    readonly fallback: Fallback;
+}> | Readonly<{
+    readonly ssr?: Exclude<SsrMode, 'client'>;
+    /** Rendered while the subtree has an async source with no value yet. */
+    readonly fallback?: Fallback;
+}>);
+interface PendingBlockFactory {
+    /**
+     * A boundary that renders `fallback` while **any** async source read below it
+     * has no value yet — the template equivalent of Solid's `Suspense`.
+     *
+     * ```ts
+     * div([span(users.settledValue)]).pipe(
+     *   pendingBlock({ fallback: () => span('Chargement…') }),
+     * )
+     * ```
+     *
+     * The suspended subtree stays mounted (detached from the document, not
+     * CSS-hidden) so nothing below it is torn down and rebuilt when the data
+     * arrives. The fallback is announced with `aria-live="polite"`.
+     */
+    <Fallback extends PendingFallback>(options?: PendingBlockOptions<Fallback>): PendingBlockDirective<undefined, ReturnType<Fallback> extends CraftNodeChildren ? ReturnType<Fallback> : CraftNodeChildren>;
+    /**
+     * A boundary with one fallback per async source, checked exhaustively against
+     * the sources actually read below it — an unlisted source is a compile error,
+     * and so is a fallback for a source that never suspends here.
+     *
+     * ```ts
+     * div([...]).pipe(
+     *   pendingBlock.exhaustive({
+     *     users: () => SkeletonList(),
+     *     orders: () => SkeletonRows(),
+     *   }),
+     * )
+     * ```
+     *
+     * When several listed sources are pending at once, the fallback of the first
+     * one to suspend is rendered.
+     */
+    exhaustive<const Handlers extends PendingBlockHandlers>(handlers: Handlers, options?: Omit<PendingBlockOptions, 'fallback' | 'reloading'>): PendingBlockDirective<Handlers, PendingBlockHandlerChildren<Handlers[keyof Handlers]> extends CraftNodeChildren ? PendingBlockHandlerChildren<Handlers[keyof Handlers]> : CraftNodeChildren>;
+}
+export declare const pendingBlock: PendingBlockFactory;
+export declare function isPendingBlockDirective(value: unknown): value is PendingBlockDirective<PendingBlockHandlers | undefined>;
+export {};
+//# sourceMappingURL=pending-block.d.ts.map

package/src/lib/pending-block.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"pending-block.d.ts","sourceRoot":"","sources":["../../../../../libs/component/src/lib/pending-block.ts"],"names":[],"mappings":"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"}

package/src/lib/pending-block.js

@@ -0,0 +1,48 @@
+import { CRAFT_DIRECTIVE } from './types';
+export const PENDING_BLOCK_DIRECTIVE = Symbol('craft-pending-block-directive');
+/** Resolves the children a handler renders for one of its two states. */
+export function resolvePendingBlockHandler(handler, state) {
+    if (typeof handler === 'function') {
+        return state === 'pending' ? handler() : [];
+    }
+    return state === 'pending'
+        ? handler.pending()
+        : (handler.reloading?.() ?? []);
+}
+/**
+ * Thrown when a `CraftNotSettled` escapes every `pendingBlock` boundary — the
+ * runtime counterpart of the compile-time check, for the cases the types cannot
+ * see (a settled read hidden inside a lambda, a dynamically built subtree).
+ */
+export class CraftUnhandledPendingError extends Error {
+    source;
+    constructor(source) {
+        super(`Craft async source "${source}" suspended outside of any pendingBlock(...) boundary.`);
+        this.name = 'CraftUnhandledPendingError';
+        this.source = source;
+    }
+}
+function createPendingBlockDirective(handlers, fallback, reloading, position, ssr) {
+    const directive = (() => undefined);
+    Object.defineProperty(directive, CRAFT_DIRECTIVE, {
+        value: {
+            name: handlers ? 'pendingBlock.exhaustive' : 'pendingBlock',
+            meta: {},
+            logic: (baseLogic) => baseLogic,
+            template: (baseTemplate) => baseTemplate,
+        },
+        enumerable: false,
+    });
+    Object.defineProperty(directive, PENDING_BLOCK_DIRECTIVE, {
+        value: { handlers, fallback, reloading, position, ssr },
+        enumerable: false,
+    });
+    return directive;
+}
+export const pendingBlock = Object.assign((options = {}) => createPendingBlockDirective(undefined, options.fallback, options.reloading, options.position ?? 'before', options.ssr), {
+    exhaustive: (handlers, options = {}) => createPendingBlockDirective(handlers, undefined, undefined, options.position ?? 'before', options.ssr),
+});
+export function isPendingBlockDirective(value) {
+    return (typeof value === 'function' && PENDING_BLOCK_DIRECTIVE in value);
+}
+//# sourceMappingURL=pending-block.js.map

package/src/lib/pending-block.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"pending-block.js","sourceRoot":"","sources":["../../../../../libs/component/src/lib/pending-block.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAuB,MAAM,SAAS,CAAC;AAI/D,MAAM,CAAC,MAAM,uBAAuB,GAAG,MAAM,CAAC,+BAA+B,CAAC,CAAC;AAyC/E,yEAAyE;AACzE,MAAM,UAAU,0BAA0B,CACxC,OAA4B,EAC5B,KAA8B;IAE9B,IAAI,OAAO,OAAO,KAAK,UAAU,EAAE,CAAC;QAClC,OAAO,KAAK,KAAK,SAAS,CAAC,CAAC,CAAC,OAAO,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC;IAC9C,CAAC;IAED,OAAO,KAAK,KAAK,SAAS;QACxB,CAAC,CAAC,OAAO,CAAC,OAAO,EAAE;QACnB,CAAC,CAAC,CAAC,OAAO,CAAC,SAAS,EAAE,EAAE,IAAI,EAAE,CAAC,CAAC;AACpC,CAAC;AAED;;;;GAIG;AACH,MAAM,OAAO,0BAA2B,SAAQ,KAAK;IAC1C,MAAM,CAAS;IAExB,YAAY,MAAc;QACxB,KAAK,CACH,uBAAuB,MAAM,wDAAwD,CACtF,CAAC;QACF,IAAI,CAAC,IAAI,GAAG,4BAA4B,CAAC;QACzC,IAAI,CAAC,MAAM,GAAG,MAAM,CAAC;IACvB,CAAC;CACF;AAiDD,SAAS,2BAA2B,CAGlC,QAAkB,EAClB,QAAqC,EACrC,SAAsC,EACtC,QAA8B,EAC9B,GAAwB;IAExB,MAAM,SAAS,GAAG,CAAC,GAAG,EAAE,CACtB,SAAS,CAA+C,CAAC;IAE3D,MAAM,CAAC,cAAc,CAAC,SAAS,EAAE,eAAe,EAAE;QAChD,KAAK,EAAE;YACL,IAAI,EAAE,QAAQ,CAAC,CAAC,CAAC,yBAAyB,CAAC,CAAC,CAAC,cAAc;YAC3D,IAAI,EAAE,EAAE;YACR,KAAK,EAAE,CAAC,SAAkC,EAAE,EAAE,CAAC,SAAS;YACxD,QAAQ,EAAE,CAAC,YAAmC,EAAE,EAAE,CAAC,YAAY;SAChE;QACD,UAAU,EAAE,KAAK;KAClB,CAAC,CAAC;IACH,MAAM,CAAC,cAAc,CAAC,SAAS,EAAE,uBAAuB,EAAE;QACxD,KAAK,EAAE,EAAE,QAAQ,EAAE,QAAQ,EAAE,SAAS,EAAE,QAAQ,EAAE,GAAG,EAAE;QACvD,UAAU,EAAE,KAAK;KAClB,CAAC,CAAC;IAEH,OAAO,SAAS,CAAC;AACnB,CAAC;AAyFD,MAAM,CAAC,MAAM,YAAY,GAAwB,MAAM,CAAC,MAAM,CAC5D,CAAC,UAA+B,EAAE,EAAE,EAAE,CACpC,2BAA2B,CACzB,SAAS,EACT,OAAO,CAAC,QAAQ,EAChB,OAAO,CAAC,SAAS,EACjB,OAAO,CAAC,QAAQ,IAAI,QAAQ,EAC5B,OAAO,CAAC,GAAG,CACZ,EACH;IACE,UAAU,EAAE,CACV,QAA8B,EAC9B,UAA+D,EAAE,EACjE,EAAE,CACF,2BAA2B,CACzB,QAAQ,EACR,SAAS,EACT,SAAS,EACT,OAAO,CAAC,QAAQ,IAAI,QAAQ,EAC5B,OAAO,CAAC,GAAG,CACZ;CACJ,CACqB,CAAC;AAEzB,MAAM,UAAU,uBAAuB,CACrC,KAAc;IAEd,OAAO,CACL,OAAO,KAAK,KAAK,UAAU,IAAI,uBAAuB,IAAK,KAAgB,CAC5E,CAAC;AACJ,CAAC","sourcesContent":["import { CRAFT_DIRECTIVE, type CraftDirective } from './types';\nimport type { CraftNodeChildren } from './render/vnode';\nimport type { SsrMode } from '@craft-ts/core';\n\nexport const PENDING_BLOCK_DIRECTIVE = Symbol('craft-pending-block-directive');\n\n/**\n * Where the fallback is inserted relative to the suspended subtree. The subtree\n * itself is kept mounted but **detached from the document** while it is\n * pending (its nodes live in a DocumentFragment — they are not `hidden` via\n * CSS), so its state survives the wait. Assistive tech is told via\n * `aria-busy` / `aria-live` on the fallback, not via the detached source.\n */\nexport type PendingBlockPosition = 'before' | 'after';\n\nexport type PendingFallback = () => CraftNodeChildren;\n\n/**\n * What to render for one source. A bare function covers the suspended case; the\n * object form adds `reloading`, rendered **next to the still-visible subtree**\n * when the source already has a value and is refetching.\n */\nexport type PendingBlockHandler =\n  | PendingFallback\n  | {\n      readonly pending: PendingFallback;\n      readonly reloading?: PendingFallback;\n    };\n\n/** One handler per async source name, for the `.exhaustive` form. */\nexport type PendingBlockHandlers = Readonly<\n  Record<string, PendingBlockHandler>\n>;\n\ntype HandlerChildrenOf<Handler> = Handler extends () => infer Children\n  ? Children\n  : Handler extends {\n        readonly pending: () => infer Pending;\n        readonly reloading?: () => infer Reloading;\n      }\n    ? Pending | Reloading\n    : never;\n\nexport type PendingBlockHandlerChildren<Handler> = HandlerChildrenOf<Handler>;\n\n/** Resolves the children a handler renders for one of its two states. */\nexport function resolvePendingBlockHandler(\n  handler: PendingBlockHandler,\n  state: 'pending' | 'reloading',\n): CraftNodeChildren {\n  if (typeof handler === 'function') {\n    return state === 'pending' ? handler() : [];\n  }\n\n  return state === 'pending'\n    ? handler.pending()\n    : (handler.reloading?.() ?? []);\n}\n\n/**\n * Thrown when a `CraftNotSettled` escapes every `pendingBlock` boundary — the\n * runtime counterpart of the compile-time check, for the cases the types cannot\n * see (a settled read hidden inside a lambda, a dynamically built subtree).\n */\nexport class CraftUnhandledPendingError extends Error {\n  readonly source: string;\n\n  constructor(source: string) {\n    super(\n      `Craft async source \"${source}\" suspended outside of any pendingBlock(...) boundary.`,\n    );\n    this.name = 'CraftUnhandledPendingError';\n    this.source = source;\n  }\n}\n\nexport type PendingBlockDirective<\n  Handlers extends PendingBlockHandlers | undefined = undefined,\n  FallbackChildren extends CraftNodeChildren = CraftNodeChildren,\n> = CraftDirective & {\n  readonly [PENDING_BLOCK_DIRECTIVE]: {\n    /** `undefined` for the catch-all form: every source below is covered. */\n    readonly handlers: Handlers;\n    readonly fallback: PendingFallback | undefined;\n    readonly reloading: PendingFallback | undefined;\n    readonly position: PendingBlockPosition;\n    readonly ssr: SsrMode | undefined;\n    /** Phantom carrier — the fallback's own nodes, never read at runtime. */\n    readonly fallbackChildren?: FallbackChildren;\n  };\n};\n\n/**\n * The sources a `pendingBlock` leaves uncovered. The catch-all form covers\n * everything below it; the `.exhaustive` form covers only the sources it names.\n */\nexport type PendingBlockResidualSources<\n  Sources extends string,\n  Handlers extends PendingBlockHandlers | undefined,\n> = Handlers extends PendingBlockHandlers\n  ? Exclude<Sources, Extract<keyof Handlers, string>>\n  : never;\n\n/** Exhaustiveness check for `pendingBlock.exhaustive({...})`. */\nexport type PendingBlockExhaustiveCheck<\n  Sources extends string,\n  Handlers extends PendingBlockHandlers,\n> = [Exclude<Sources, Extract<keyof Handlers, string>>] extends [never]\n  ? [Exclude<Extract<keyof Handlers, string>, Sources>] extends [never]\n    ? unknown\n    : {\n        'pendingBlock.exhaustive has fallbacks for sources that never suspend here': Exclude<\n          Extract<keyof Handlers, string>,\n          Sources\n        >;\n      }\n  : {\n      'pendingBlock.exhaustive is missing a fallback for async sources': Exclude<\n        Sources,\n        Extract<keyof Handlers, string>\n      >;\n    };\n\nfunction createPendingBlockDirective<\n  Handlers extends PendingBlockHandlers | undefined,\n>(\n  handlers: Handlers,\n  fallback: PendingFallback | undefined,\n  reloading: PendingFallback | undefined,\n  position: PendingBlockPosition,\n  ssr: SsrMode | undefined,\n): PendingBlockDirective<Handlers> {\n  const directive = (() =>\n    undefined) as unknown as PendingBlockDirective<Handlers>;\n\n  Object.defineProperty(directive, CRAFT_DIRECTIVE, {\n    value: {\n      name: handlers ? 'pendingBlock.exhaustive' : 'pendingBlock',\n      meta: {},\n      logic: (baseLogic: (...args: any[]) => any) => baseLogic,\n      template: (baseTemplate: (context: any) => any) => baseTemplate,\n    },\n    enumerable: false,\n  });\n  Object.defineProperty(directive, PENDING_BLOCK_DIRECTIVE, {\n    value: { handlers, fallback, reloading, position, ssr },\n    enumerable: false,\n  });\n\n  return directive;\n}\n\ntype PendingBlockBaseOptions<\n  Fallback extends PendingFallback = PendingFallback,\n> = Readonly<{\n  /**\n   * Rendered next to the still-visible subtree while a source that already has\n   * a value is refetching. A refetch does not suspend — the stale value stays\n   * on screen — so this is how the boundary reports it.\n   */\n  readonly reloading?: Fallback;\n  /** Where the fallback goes relative to the (hidden) subtree. Defaults to `'before'`. */\n  readonly position?: PendingBlockPosition;\n}>;\n\n/**\n * A client-only SSR boundary must name the shell that replaces the skipped\n * subtree. Other modes may omit it when an exhaustive handler or an outer\n * boundary owns the pending UI.\n */\nexport type PendingBlockOptions<\n  Fallback extends PendingFallback = PendingFallback,\n> = PendingBlockBaseOptions<Fallback> &\n  (\n    | Readonly<{\n        readonly ssr: 'client';\n        readonly fallback: Fallback;\n      }>\n    | Readonly<{\n        readonly ssr?: Exclude<SsrMode, 'client'>;\n        /** Rendered while the subtree has an async source with no value yet. */\n        readonly fallback?: Fallback;\n      }>\n  );\n\ninterface PendingBlockFactory {\n  /**\n   * A boundary that renders `fallback` while **any** async source read below it\n   * has no value yet — the template equivalent of Solid's `Suspense`.\n   *\n   * ```ts\n   * div([span(users.settledValue)]).pipe(\n   *   pendingBlock({ fallback: () => span('Chargement…') }),\n   * )\n   * ```\n   *\n   * The suspended subtree stays mounted (detached from the document, not\n   * CSS-hidden) so nothing below it is torn down and rebuilt when the data\n   * arrives. The fallback is announced with `aria-live=\"polite\"`.\n   */\n  <Fallback extends PendingFallback>(\n    options?: PendingBlockOptions<Fallback>,\n  ): PendingBlockDirective<\n    undefined,\n    ReturnType<Fallback> extends CraftNodeChildren\n      ? ReturnType<Fallback>\n      : CraftNodeChildren\n  >;\n\n  /**\n   * A boundary with one fallback per async source, checked exhaustively against\n   * the sources actually read below it — an unlisted source is a compile error,\n   * and so is a fallback for a source that never suspends here.\n   *\n   * ```ts\n   * div([...]).pipe(\n   *   pendingBlock.exhaustive({\n   *     users: () => SkeletonList(),\n   *     orders: () => SkeletonRows(),\n   *   }),\n   * )\n   * ```\n   *\n   * When several listed sources are pending at once, the fallback of the first\n   * one to suspend is rendered.\n   */\n  exhaustive<const Handlers extends PendingBlockHandlers>(\n    handlers: Handlers,\n    options?: Omit<PendingBlockOptions, 'fallback' | 'reloading'>,\n  ): PendingBlockDirective<\n    Handlers,\n    PendingBlockHandlerChildren<\n      Handlers[keyof Handlers]\n    > extends CraftNodeChildren\n      ? PendingBlockHandlerChildren<Handlers[keyof Handlers]>\n      : CraftNodeChildren\n  >;\n}\n\nexport const pendingBlock: PendingBlockFactory = Object.assign(\n  (options: PendingBlockOptions = {}) =>\n    createPendingBlockDirective(\n      undefined,\n      options.fallback,\n      options.reloading,\n      options.position ?? 'before',\n      options.ssr,\n    ),\n  {\n    exhaustive: (\n      handlers: PendingBlockHandlers,\n      options: Omit<PendingBlockOptions, 'fallback' | 'reloading'> = {},\n    ) =>\n      createPendingBlockDirective(\n        handlers,\n        undefined,\n        undefined,\n        options.position ?? 'before',\n        options.ssr,\n      ),\n  },\n) as PendingBlockFactory;\n\nexport function isPendingBlockDirective(\n  value: unknown,\n): value is PendingBlockDirective<PendingBlockHandlers | undefined> {\n  return (\n    typeof value === 'function' && PENDING_BLOCK_DIRECTIVE in (value as object)\n  );\n}\n"]}

package/src/lib/project.d.ts

@@ -0,0 +1,19 @@
+import type { CraftNodeChildren, CraftNodeChildrenDependencies, ProjectionNode } from './render/vnode';
+import { CONTENT_DECLARATION_CONTEXT, CONTENT_OUTPUT, CONTENT_RENDERABLE, CONTENT_STYLE_POLICY, type ContentOptions, type InputValue, type ProjectionUnit, type RenderableContent } from './types';
+type ContentOutput<Value> = Value extends (...args: any[]) => infer Output ? Output : never;
+type RenderableContentOutput<Value> = ContentOutput<Value> extends CraftNodeChildren ? ContentOutput<Value> : CraftNodeChildren;
+/** Brands deferred DOM content and records the caller's style opt-in. */
+export declare function content<Output extends CraftNodeChildren, const Options extends ContentOptions | undefined = undefined>(renderer: () => Output, options?: Options): RenderableContent<Output> & {
+    readonly [CONTENT_RENDERABLE]: true;
+    readonly [CONTENT_DECLARATION_CONTEXT]: unknown;
+    readonly [CONTENT_STYLE_POLICY]: Options extends {
+        readonly allowContainerStyles: true;
+    } ? 'allow-container-styles' : 'isolated';
+    readonly [CONTENT_OUTPUT]: Output;
+};
+/** Renders either deferred DOM content or a component with a projection contract. */
+export declare function renderContent<Value extends RenderableContent>(value: Value | InputValue<Value>): ProjectionNode<CraftNodeChildrenDependencies<RenderableContentOutput<Value>>, RenderableContentOutput<Value>>;
+export declare function renderContent<Value extends ProjectionUnit<any>>(value: Value | InputValue<Value>): ProjectionNode<CraftNodeChildrenDependencies<Value>, Value>;
+export declare function renderContent<SlotName extends string, Value extends RenderableContent>(slotName: SlotName, value: Value | InputValue<Value>): ProjectionNode<CraftNodeChildrenDependencies<RenderableContentOutput<Value>>, RenderableContentOutput<Value>>;
+export {};
+//# sourceMappingURL=project.d.ts.map

package/src/lib/project.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"project.d.ts","sourceRoot":"","sources":["../../../../../libs/component/src/lib/project.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACV,iBAAiB,EACjB,6BAA6B,EAC7B,cAAc,EACf,MAAM,gBAAgB,CAAC;AAGxB,OAAO,EACL,2BAA2B,EAC3B,cAAc,EACd,kBAAkB,EAClB,oBAAoB,EACpB,KAAK,cAAc,EAEnB,KAAK,UAAU,EACf,KAAK,cAAc,EACnB,KAAK,iBAAiB,EACvB,MAAM,SAAS,CAAC;AAEjB,KAAK,aAAa,CAAC,KAAK,IAAI,KAAK,SAAS,CAAC,GAAG,IAAI,EAAE,GAAG,EAAE,KAAK,MAAM,MAAM,GACtE,MAAM,GACN,KAAK,CAAC;AAEV,KAAK,uBAAuB,CAAC,KAAK,IAChC,aAAa,CAAC,KAAK,CAAC,SAAS,iBAAiB,GAC1C,aAAa,CAAC,KAAK,CAAC,GACpB,iBAAiB,CAAC;AAsBxB,yEAAyE;AACzE,wBAAgB,OAAO,CACrB,MAAM,SAAS,iBAAiB,EAChC,KAAK,CAAC,OAAO,SAAS,cAAc,GAAG,SAAS,GAAG,SAAS,EAE5D,QAAQ,EAAE,MAAM,MAAM,EACtB,OAAO,CAAC,EAAE,OAAO,GAChB,iBAAiB,CAAC,MAAM,CAAC,GAAG;IAC7B,QAAQ,CAAC,CAAC,kBAAkB,CAAC,EAAE,IAAI,CAAC;IACpC,QAAQ,CAAC,CAAC,2BAA2B,CAAC,EAAE,OAAO,CAAC;IAChD,QAAQ,CAAC,CAAC,oBAAoB,CAAC,EAAE,OAAO,SAAS;QAC/C,QAAQ,CAAC,oBAAoB,EAAE,IAAI,CAAC;KACrC,GACG,wBAAwB,GACxB,UAAU,CAAC;IACf,QAAQ,CAAC,CAAC,cAAc,CAAC,EAAE,MAAM,CAAC;CACnC,CAuBA;AAUD,qFAAqF;AACrF,wBAAgB,aAAa,CAAC,KAAK,SAAS,iBAAiB,EAC3D,KAAK,EAAE,KAAK,GAAG,UAAU,CAAC,KAAK,CAAC,GAC/B,cAAc,CACf,6BAA6B,CAAC,uBAAuB,CAAC,KAAK,CAAC,CAAC,EAC7D,uBAAuB,CAAC,KAAK,CAAC,CAC/B,CAAC;AACF,wBAAgB,aAAa,CAAC,KAAK,SAAS,cAAc,CAAC,GAAG,CAAC,EAC7D,KAAK,EAAE,KAAK,GAAG,UAAU,CAAC,KAAK,CAAC,GAC/B,cAAc,CAAC,6BAA6B,CAAC,KAAK,CAAC,EAAE,KAAK,CAAC,CAAC;AAC/D,wBAAgB,aAAa,CAC3B,QAAQ,SAAS,MAAM,EACvB,KAAK,SAAS,iBAAiB,EAE/B,QAAQ,EAAE,QAAQ,EAClB,KAAK,EAAE,KAAK,GAAG,UAAU,CAAC,KAAK,CAAC,GAC/B,cAAc,CACf,6BAA6B,CAAC,uBAAuB,CAAC,KAAK,CAAC,CAAC,EAC7D,uBAAuB,CAAC,KAAK,CAAC,CAC/B,CAAC"}

package/src/lib/project.js

@@ -0,0 +1,56 @@
+import { isGeneratorFunction, isYieldableValue } from '@craft-ts/core';
+import { currentCraftRenderContext } from './render/vnode';
+import { CONTENT_DECLARATION_CONTEXT, CONTENT_OUTPUT, CONTENT_RENDERABLE, CONTENT_STYLE_POLICY, } from './types';
+function contentStylePolicy(value) {
+    return value[CONTENT_STYLE_POLICY] === 'allow-container-styles'
+        ? 'allow-container-styles'
+        : 'isolated';
+}
+function defineContentPolicy(renderer, policy) {
+    Object.defineProperty(renderer, CONTENT_STYLE_POLICY, {
+        value: policy,
+        enumerable: false,
+        configurable: false,
+        writable: false,
+    });
+}
+/** Brands deferred DOM content and records the caller's style opt-in. */
+export function content(renderer, options) {
+    defineContentPolicy(renderer, options?.allowContainerStyles === true
+        ? 'allow-container-styles'
+        : 'isolated');
+    Object.defineProperty(renderer, CONTENT_DECLARATION_CONTEXT, {
+        value: currentCraftRenderContext(),
+        enumerable: false,
+        configurable: false,
+        writable: false,
+    });
+    return renderer;
+}
+function isComponentUnit(value) {
+    return (typeof value === 'object' &&
+        value !== null &&
+        value.kind === 'component');
+}
+export function renderContent(slotNameOrValue, maybeValue) {
+    const named = typeof slotNameOrValue === 'string';
+    const slotName = named ? slotNameOrValue : undefined;
+    const value = (named ? maybeValue : slotNameOrValue);
+    const isYieldableReader = isGeneratorFunction(value) || isYieldableValue(value);
+    const declarationContext = isComponentUnit(value)
+        ? (value.declarationContext ?? currentCraftRenderContext())
+        : typeof value === 'function' && !isYieldableReader
+            ? (value[CONTENT_DECLARATION_CONTEXT] ?? currentCraftRenderContext())
+            : currentCraftRenderContext();
+    const policy = typeof value === 'function' && !isYieldableReader
+        ? contentStylePolicy(value)
+        : 'isolated';
+    return {
+        kind: 'projection',
+        render: () => (isComponentUnit(value) || isYieldableReader ? value : value()),
+        ...(slotName ? { slotName } : {}),
+        stylePolicy: policy,
+        declarationContext,
+    };
+}
+//# sourceMappingURL=project.js.map

package/src/lib/project.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"project.js","sourceRoot":"","sources":["../../../../../libs/component/src/lib/project.ts"],"names":[],"mappings":"AAKA,OAAO,EAAE,mBAAmB,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AACvE,OAAO,EAAE,yBAAyB,EAAE,MAAM,gBAAgB,CAAC;AAC3D,OAAO,EACL,2BAA2B,EAC3B,cAAc,EACd,kBAAkB,EAClB,oBAAoB,GAMrB,MAAM,SAAS,CAAC;AAWjB,SAAS,kBAAkB,CAAC,KAAc;IACxC,OAAQ,KAA+D,CACrE,oBAAoB,CACrB,KAAK,wBAAwB;QAC5B,CAAC,CAAC,wBAAwB;QAC1B,CAAC,CAAC,UAAU,CAAC;AACjB,CAAC;AAED,SAAS,mBAAmB,CAC1B,QAAqC,EACrC,MAA0B;IAE1B,MAAM,CAAC,cAAc,CAAC,QAAQ,EAAE,oBAAoB,EAAE;QACpD,KAAK,EAAE,MAAM;QACb,UAAU,EAAE,KAAK;QACjB,YAAY,EAAE,KAAK;QACnB,QAAQ,EAAE,KAAK;KAChB,CAAC,CAAC;AACL,CAAC;AAED,yEAAyE;AACzE,MAAM,UAAU,OAAO,CAIrB,QAAsB,EACtB,OAAiB;IAWjB,mBAAmB,CACjB,QAAQ,EACR,OAAO,EAAE,oBAAoB,KAAK,IAAI;QACpC,CAAC,CAAC,wBAAwB;QAC1B,CAAC,CAAC,UAAU,CACf,CAAC;IACF,MAAM,CAAC,cAAc,CAAC,QAAQ,EAAE,2BAA2B,EAAE;QAC3D,KAAK,EAAE,yBAAyB,EAAE;QAClC,UAAU,EAAE,KAAK;QACjB,YAAY,EAAE,KAAK;QACnB,QAAQ,EAAE,KAAK;KAChB,CAAC,CAAC;IACH,OAAO,QASN,CAAC;AACJ,CAAC;AAED,SAAS,eAAe,CAAC,KAAc;IACrC,OAAO,CACL,OAAO,KAAK,KAAK,QAAQ;QACzB,KAAK,KAAK,IAAI;QACb,KAAqC,CAAC,IAAI,KAAK,WAAW,CAC5D,CAAC;AACJ,CAAC;AAsBD,MAAM,UAAU,aAAa,CAC3B,eAIkD,EAClD,UAGkD;IAElD,MAAM,KAAK,GAAG,OAAO,eAAe,KAAK,QAAQ,CAAC;IAClD,MAAM,QAAQ,GAAG,KAAK,CAAC,CAAC,CAAC,eAAe,CAAC,CAAC,CAAC,SAAS,CAAC;IACrD,MAAM,KAAK,GAAG,CAAC,KAAK,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,eAAe,CAGD,CAAC;IACnD,MAAM,iBAAiB,GACrB,mBAAmB,CAAC,KAAK,CAAC,IAAI,gBAAgB,CAAC,KAAK,CAAC,CAAC;IACxD,MAAM,kBAAkB,GAAG,eAAe,CAAC,KAAK,CAAC;QAC/C,CAAC,CAAC,CAAC,KAAK,CAAC,kBAAkB,IAAI,yBAAyB,EAAE,CAAC;QAC3D,CAAC,CAAC,OAAO,KAAK,KAAK,UAAU,IAAI,CAAC,iBAAiB;YACjD,CAAC,CAAC,CACE,KACD,CAAC,2BAA2B,CAAC,IAAI,yBAAyB,EAAE,CAAC;YAChE,CAAC,CAAC,yBAAyB,EAAE,CAAC;IAClC,MAAM,MAAM,GACV,OAAO,KAAK,KAAK,UAAU,IAAI,CAAC,iBAAiB;QAC/C,CAAC,CAAC,kBAAkB,CAAC,KAAK,CAAC;QAC3B,CAAC,CAAC,UAAU,CAAC;IAEjB,OAAO;QACL,IAAI,EAAE,YAAY;QAClB,MAAM,EAAE,GAAG,EAAE,CACX,CAAC,eAAe,CAAC,KAAK,CAAC,IAAI,iBAAiB,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,KAAK,EAAE,CAEzC;QACvB,GAAG,CAAC,QAAQ,CAAC,CAAC,CAAC,EAAE,QAAQ,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC;QACjC,WAAW,EAAE,MAAM;QACnB,kBAAkB;KACnB,CAAC;AACJ,CAAC","sourcesContent":["import type {\n  CraftNodeChildren,\n  CraftNodeChildrenDependencies,\n  ProjectionNode,\n} from './render/vnode';\nimport { isGeneratorFunction, isYieldableValue } from '@craft-ts/core';\nimport { currentCraftRenderContext } from './render/vnode';\nimport {\n  CONTENT_DECLARATION_CONTEXT,\n  CONTENT_OUTPUT,\n  CONTENT_RENDERABLE,\n  CONTENT_STYLE_POLICY,\n  type ContentOptions,\n  type ContentStylePolicy,\n  type InputValue,\n  type ProjectionUnit,\n  type RenderableContent,\n} from './types';\n\ntype ContentOutput<Value> = Value extends (...args: any[]) => infer Output\n  ? Output\n  : never;\n\ntype RenderableContentOutput<Value> =\n  ContentOutput<Value> extends CraftNodeChildren\n    ? ContentOutput<Value>\n    : CraftNodeChildren;\n\nfunction contentStylePolicy(value: unknown): ContentStylePolicy {\n  return (value as Partial<Record<typeof CONTENT_STYLE_POLICY, unknown>>)[\n    CONTENT_STYLE_POLICY\n  ] === 'allow-container-styles'\n    ? 'allow-container-styles'\n    : 'isolated';\n}\n\nfunction defineContentPolicy(\n  renderer: (...args: any[]) => unknown,\n  policy: ContentStylePolicy,\n): void {\n  Object.defineProperty(renderer, CONTENT_STYLE_POLICY, {\n    value: policy,\n    enumerable: false,\n    configurable: false,\n    writable: false,\n  });\n}\n\n/** Brands deferred DOM content and records the caller's style opt-in. */\nexport function content<\n  Output extends CraftNodeChildren,\n  const Options extends ContentOptions | undefined = undefined,\n>(\n  renderer: () => Output,\n  options?: Options,\n): RenderableContent<Output> & {\n  readonly [CONTENT_RENDERABLE]: true;\n  readonly [CONTENT_DECLARATION_CONTEXT]: unknown;\n  readonly [CONTENT_STYLE_POLICY]: Options extends {\n    readonly allowContainerStyles: true;\n  }\n    ? 'allow-container-styles'\n    : 'isolated';\n  readonly [CONTENT_OUTPUT]: Output;\n} {\n  defineContentPolicy(\n    renderer,\n    options?.allowContainerStyles === true\n      ? 'allow-container-styles'\n      : 'isolated',\n  );\n  Object.defineProperty(renderer, CONTENT_DECLARATION_CONTEXT, {\n    value: currentCraftRenderContext(),\n    enumerable: false,\n    configurable: false,\n    writable: false,\n  });\n  return renderer as RenderableContent<Output> & {\n    readonly [CONTENT_RENDERABLE]: true;\n    readonly [CONTENT_DECLARATION_CONTEXT]: unknown;\n    readonly [CONTENT_STYLE_POLICY]: Options extends {\n      readonly allowContainerStyles: true;\n    }\n      ? 'allow-container-styles'\n      : 'isolated';\n    readonly [CONTENT_OUTPUT]: Output;\n  };\n}\n\nfunction isComponentUnit(value: unknown): value is ProjectionUnit {\n  return (\n    typeof value === 'object' &&\n    value !== null &&\n    (value as { readonly kind?: unknown }).kind === 'component'\n  );\n}\n\n/** Renders either deferred DOM content or a component with a projection contract. */\nexport function renderContent<Value extends RenderableContent>(\n  value: Value | InputValue<Value>,\n): ProjectionNode<\n  CraftNodeChildrenDependencies<RenderableContentOutput<Value>>,\n  RenderableContentOutput<Value>\n>;\nexport function renderContent<Value extends ProjectionUnit<any>>(\n  value: Value | InputValue<Value>,\n): ProjectionNode<CraftNodeChildrenDependencies<Value>, Value>;\nexport function renderContent<\n  SlotName extends string,\n  Value extends RenderableContent,\n>(\n  slotName: SlotName,\n  value: Value | InputValue<Value>,\n): ProjectionNode<\n  CraftNodeChildrenDependencies<RenderableContentOutput<Value>>,\n  RenderableContentOutput<Value>\n>;\nexport function renderContent(\n  slotNameOrValue:\n    | string\n    | RenderableContent\n    | ProjectionUnit\n    | InputValue<RenderableContent | ProjectionUnit>,\n  maybeValue?:\n    | RenderableContent\n    | ProjectionUnit\n    | InputValue<RenderableContent | ProjectionUnit>,\n): ProjectionNode {\n  const named = typeof slotNameOrValue === 'string';\n  const slotName = named ? slotNameOrValue : undefined;\n  const value = (named ? maybeValue : slotNameOrValue) as\n    | RenderableContent\n    | ProjectionUnit\n    | InputValue<RenderableContent | ProjectionUnit>;\n  const isYieldableReader =\n    isGeneratorFunction(value) || isYieldableValue(value);\n  const declarationContext = isComponentUnit(value)\n    ? (value.declarationContext ?? currentCraftRenderContext())\n    : typeof value === 'function' && !isYieldableReader\n      ? ((\n          value as Partial<Record<typeof CONTENT_DECLARATION_CONTEXT, unknown>>\n        )[CONTENT_DECLARATION_CONTEXT] ?? currentCraftRenderContext())\n      : currentCraftRenderContext();\n  const policy =\n    typeof value === 'function' && !isYieldableReader\n      ? contentStylePolicy(value)\n      : 'isolated';\n\n  return {\n    kind: 'projection',\n    render: () =>\n      (isComponentUnit(value) || isYieldableReader ? value : value()) as\n        | ProjectionUnit\n        | CraftNodeChildren,\n    ...(slotName ? { slotName } : {}),\n    stylePolicy: policy,\n    declarationContext,\n  };\n}\n"]}

package/src/lib/render/hydration-metadata.d.ts

@@ -0,0 +1,3 @@
+export declare function setNodeHydrationKey(node: object, key: string): void;
+export declare function hydrationKeyOf(node: object): string | undefined;
+//# sourceMappingURL=hydration-metadata.d.ts.map

package/src/lib/render/hydration-metadata.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"hydration-metadata.d.ts","sourceRoot":"","sources":["../../../../../../libs/component/src/lib/render/hydration-metadata.ts"],"names":[],"mappings":"AAEA,wBAAgB,mBAAmB,CAAC,IAAI,EAAE,MAAM,EAAE,GAAG,EAAE,MAAM,GAAG,IAAI,CAEnE;AAED,wBAAgB,cAAc,CAAC,IAAI,EAAE,MAAM,GAAG,MAAM,GAAG,SAAS,CAE/D"}

package/src/lib/render/hydration-metadata.js

@@ -0,0 +1,8 @@
+const hydrationKeys = new WeakMap();
+export function setNodeHydrationKey(node, key) {
+    hydrationKeys.set(node, key);
+}
+export function hydrationKeyOf(node) {
+    return hydrationKeys.get(node);
+}
+//# sourceMappingURL=hydration-metadata.js.map

package/src/lib/render/hydration-metadata.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"hydration-metadata.js","sourceRoot":"","sources":["../../../../../../libs/component/src/lib/render/hydration-metadata.ts"],"names":[],"mappings":"AAAA,MAAM,aAAa,GAAG,IAAI,OAAO,EAAkB,CAAC;AAEpD,MAAM,UAAU,mBAAmB,CAAC,IAAY,EAAE,GAAW;IAC3D,aAAa,CAAC,GAAG,CAAC,IAAI,EAAE,GAAG,CAAC,CAAC;AAC/B,CAAC;AAED,MAAM,UAAU,cAAc,CAAC,IAAY;IACzC,OAAO,aAAa,CAAC,GAAG,CAAC,IAAI,CAAC,CAAC;AACjC,CAAC","sourcesContent":["const hydrationKeys = new WeakMap<object, string>();\n\nexport function setNodeHydrationKey(node: object, key: string): void {\n  hydrationKeys.set(node, key);\n}\n\nexport function hydrationKeyOf(node: object): string | undefined {\n  return hydrationKeys.get(node);\n}\n"]}

package/src/lib/render/hydration.d.ts

@@ -0,0 +1,24 @@
+export type HydrationMismatchReason = 'element-absent' | 'tag-mismatch' | 'text-absent' | 'text-mismatch' | 'boundary-absent';
+export declare class HydrationMismatchError extends Error {
+    readonly key: string;
+    readonly expected: string;
+    readonly actual: string | null;
+    readonly reason: HydrationMismatchReason;
+    readonly actualNode: Node | null;
+    constructor(options: Readonly<{
+        key: string;
+        expected: string;
+        actual: string | null;
+        reason: HydrationMismatchReason;
+        actualNode?: Node | null;
+    }>);
+}
+export type HydrationCursor = Readonly<{
+    claimElement(key: string, tag: string): Element;
+    claimText(key: string, expected?: string): Text;
+    claimBoundary(key: string, label: string): Comment;
+    recordMismatch(error: HydrationMismatchError): void;
+    finish(): void;
+}>;
+export declare function createHydrationCursor(host: Element, onMismatch?: (error: HydrationMismatchError) => void): HydrationCursor;
+//# sourceMappingURL=hydration.d.ts.map

package/src/lib/render/hydration.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"hydration.d.ts","sourceRoot":"","sources":["../../../../../../libs/component/src/lib/render/hydration.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,uBAAuB,GAC/B,gBAAgB,GAChB,cAAc,GACd,aAAa,GACb,eAAe,GACf,iBAAiB,CAAC;AAEtB,qBAAa,sBAAuB,SAAQ,KAAK;IAC/C,QAAQ,CAAC,GAAG,EAAE,MAAM,CAAC;IACrB,QAAQ,CAAC,QAAQ,EAAE,MAAM,CAAC;IAC1B,QAAQ,CAAC,MAAM,EAAE,MAAM,GAAG,IAAI,CAAC;IAC/B,QAAQ,CAAC,MAAM,EAAE,uBAAuB,CAAC;IACzC,QAAQ,CAAC,UAAU,EAAE,IAAI,GAAG,IAAI,CAAC;gBAG/B,OAAO,EAAE,QAAQ,CAAC;QAChB,GAAG,EAAE,MAAM,CAAC;QACZ,QAAQ,EAAE,MAAM,CAAC;QACjB,MAAM,EAAE,MAAM,GAAG,IAAI,CAAC;QACtB,MAAM,EAAE,uBAAuB,CAAC;QAChC,UAAU,CAAC,EAAE,IAAI,GAAG,IAAI,CAAC;KAC1B,CAAC;CAYL;AAED,MAAM,MAAM,eAAe,GAAG,QAAQ,CAAC;IACrC,YAAY,CAAC,GAAG,EAAE,MAAM,EAAE,GAAG,EAAE,MAAM,GAAG,OAAO,CAAC;IAChD,SAAS,CAAC,GAAG,EAAE,MAAM,EAAE,QAAQ,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAChD,aAAa,CAAC,GAAG,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,GAAG,OAAO,CAAC;IACnD,cAAc,CAAC,KAAK,EAAE,sBAAsB,GAAG,IAAI,CAAC;IACpD,MAAM,IAAI,IAAI,CAAC;CAChB,CAAC,CAAC;AAQH,wBAAgB,qBAAqB,CACnC,IAAI,EAAE,OAAO,EACb,UAAU,CAAC,EAAE,CAAC,KAAK,EAAE,sBAAsB,KAAK,IAAI,GACnD,eAAe,CAoIjB"}

package/src/lib/render/hydration.js

@@ -0,0 +1,181 @@
+export class HydrationMismatchError extends Error {
+    key;
+    expected;
+    actual;
+    reason;
+    actualNode;
+    constructor(options) {
+        super(`Craft hydration mismatch at "${options.key}": expected ${options.expected}, received ${options.actual ?? 'nothing'} (${options.reason}).`);
+        this.name = 'HydrationMismatchError';
+        this.key = options.key;
+        this.expected = options.expected;
+        this.actual = options.actual;
+        this.reason = options.reason;
+        this.actualNode = options.actualNode ?? null;
+    }
+}
+export function createHydrationCursor(host, onMismatch) {
+    const elements = new Map();
+    const boundaries = new Map();
+    const text = new Map();
+    const claimed = new Set();
+    const mismatches = [];
+    for (const element of host.querySelectorAll('[data-craft-hk]')) {
+        const key = element.getAttribute('data-craft-hk');
+        if (key)
+            elements.set(key, element);
+    }
+    walkComments(host, (comment) => {
+        const marker = parseMarker(comment.data);
+        if (!marker)
+            return;
+        if (marker.label === 'craft-text:start') {
+            const end = nextComment(comment.nextSibling, 'craft-text:end', marker.key);
+            if (!end)
+                return;
+            let value = comment.nextSibling;
+            if (value === end) {
+                value = host.ownerDocument.createTextNode('');
+                end.parentNode?.insertBefore(value, end);
+            }
+            if (value?.nodeType === Node.TEXT_NODE) {
+                text.set(marker.key, {
+                    text: value,
+                    start: comment,
+                    end,
+                });
+            }
+            return;
+        }
+        if (marker.label !== 'craft-text:end') {
+            boundaries.set(boundaryAddress(marker.key, marker.label), comment);
+        }
+    });
+    const cursor = {
+        claimElement(key, tag) {
+            const element = elements.get(key);
+            if (!element) {
+                throw new HydrationMismatchError({
+                    key,
+                    expected: `<${tag}>`,
+                    actual: null,
+                    reason: 'element-absent',
+                });
+            }
+            if (element.tagName.toLowerCase() !== tag.toLowerCase()) {
+                throw new HydrationMismatchError({
+                    key,
+                    expected: `<${tag}>`,
+                    actual: `<${element.tagName.toLowerCase()}>`,
+                    reason: 'tag-mismatch',
+                    actualNode: element,
+                });
+            }
+            claimed.add(element);
+            return element;
+        },
+        claimText(key, expected) {
+            const entry = text.get(key);
+            if (!entry) {
+                throw new HydrationMismatchError({
+                    key,
+                    expected: expected === undefined ? 'text' : JSON.stringify(expected),
+                    actual: null,
+                    reason: 'text-absent',
+                });
+            }
+            if (expected !== undefined && entry.text.nodeValue !== expected) {
+                throw new HydrationMismatchError({
+                    key,
+                    expected: JSON.stringify(expected),
+                    actual: JSON.stringify(entry.text.nodeValue),
+                    reason: 'text-mismatch',
+                    actualNode: entry.text,
+                });
+            }
+            claimed.add(entry.text);
+            claimed.add(entry.start);
+            claimed.add(entry.end);
+            return entry.text;
+        },
+        claimBoundary(key, label) {
+            const comment = boundaries.get(boundaryAddress(key, label));
+            if (!comment) {
+                throw new HydrationMismatchError({
+                    key,
+                    expected: `<!--${label}-->`,
+                    actual: null,
+                    reason: 'boundary-absent',
+                });
+            }
+            claimed.add(comment);
+            return comment;
+        },
+        recordMismatch(error) {
+            mismatches.push(error);
+            onMismatch?.(error);
+        },
+        finish() {
+            for (const entry of text.values()) {
+                if (claimed.has(entry.text)) {
+                    entry.start.remove();
+                    entry.end.remove();
+                }
+                else {
+                    entry.start.remove();
+                    entry.text.remove();
+                    entry.end.remove();
+                }
+            }
+            for (const element of elements.values()) {
+                if (!claimed.has(element) && element.parentNode)
+                    element.remove();
+            }
+            for (const comment of boundaries.values()) {
+                if (!claimed.has(comment) && comment.parentNode)
+                    comment.remove();
+            }
+            if (mismatches.length > 0 && isDevelopment()) {
+                console.warn(`Craft hydrated with ${mismatches.length} local remount${mismatches.length === 1 ? '' : 's'}.`, mismatches);
+            }
+        },
+    };
+    return cursor;
+}
+function walkComments(parent, visit) {
+    for (const child of [...parent.childNodes]) {
+        if (child.nodeType === Node.COMMENT_NODE)
+            visit(child);
+        walkComments(child, visit);
+    }
+}
+function nextComment(node, label, key) {
+    let current = node;
+    while (current) {
+        if (current.nodeType === Node.COMMENT_NODE) {
+            const marker = parseMarker(current.data);
+            if (marker?.label === label && marker.key === key) {
+                return current;
+            }
+        }
+        current = current.nextSibling;
+    }
+    return null;
+}
+function parseMarker(value) {
+    const separator = value.lastIndexOf('|hk:');
+    if (separator === -1)
+        return null;
+    return {
+        label: value.slice(0, separator),
+        key: value.slice(separator + 4),
+    };
+}
+function boundaryAddress(key, label) {
+    return `${key}\u0000${label}`;
+}
+function isDevelopment() {
+    const processRef = globalThis.process;
+    return (processRef === undefined || processRef.env?.['NODE_ENV'] !== 'production');
+}
+//# sourceMappingURL=hydration.js.map

package/src/lib/render/hydration.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"hydration.js","sourceRoot":"","sources":["../../../../../../libs/component/src/lib/render/hydration.ts"],"names":[],"mappings":"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","sourcesContent":["export type HydrationMismatchReason =\n  | 'element-absent'\n  | 'tag-mismatch'\n  | 'text-absent'\n  | 'text-mismatch'\n  | 'boundary-absent';\n\nexport class HydrationMismatchError extends Error {\n  readonly key: string;\n  readonly expected: string;\n  readonly actual: string | null;\n  readonly reason: HydrationMismatchReason;\n  readonly actualNode: Node | null;\n\n  constructor(\n    options: Readonly<{\n      key: string;\n      expected: string;\n      actual: string | null;\n      reason: HydrationMismatchReason;\n      actualNode?: Node | null;\n    }>,\n  ) {\n    super(\n      `Craft hydration mismatch at \"${options.key}\": expected ${options.expected}, received ${options.actual ?? 'nothing'} (${options.reason}).`,\n    );\n    this.name = 'HydrationMismatchError';\n    this.key = options.key;\n    this.expected = options.expected;\n    this.actual = options.actual;\n    this.reason = options.reason;\n    this.actualNode = options.actualNode ?? null;\n  }\n}\n\nexport type HydrationCursor = Readonly<{\n  claimElement(key: string, tag: string): Element;\n  claimText(key: string, expected?: string): Text;\n  claimBoundary(key: string, label: string): Comment;\n  recordMismatch(error: HydrationMismatchError): void;\n  finish(): void;\n}>;\n\ntype TextClaim = Readonly<{\n  text: Text;\n  start: Comment;\n  end: Comment;\n}>;\n\nexport function createHydrationCursor(\n  host: Element,\n  onMismatch?: (error: HydrationMismatchError) => void,\n): HydrationCursor {\n  const elements = new Map<string, Element>();\n  const boundaries = new Map<string, Comment>();\n  const text = new Map<string, TextClaim>();\n  const claimed = new Set<Node>();\n  const mismatches: HydrationMismatchError[] = [];\n\n  for (const element of host.querySelectorAll<Element>('[data-craft-hk]')) {\n    const key = element.getAttribute('data-craft-hk');\n    if (key) elements.set(key, element);\n  }\n\n  walkComments(host, (comment) => {\n    const marker = parseMarker(comment.data);\n    if (!marker) return;\n    if (marker.label === 'craft-text:start') {\n      const end = nextComment(\n        comment.nextSibling,\n        'craft-text:end',\n        marker.key,\n      );\n      if (!end) return;\n      let value = comment.nextSibling;\n      if (value === end) {\n        value = host.ownerDocument.createTextNode('');\n        end.parentNode?.insertBefore(value, end);\n      }\n      if (value?.nodeType === Node.TEXT_NODE) {\n        text.set(marker.key, {\n          text: value as Text,\n          start: comment,\n          end,\n        });\n      }\n      return;\n    }\n    if (marker.label !== 'craft-text:end') {\n      boundaries.set(boundaryAddress(marker.key, marker.label), comment);\n    }\n  });\n\n  const cursor: HydrationCursor = {\n    claimElement(key, tag) {\n      const element = elements.get(key);\n      if (!element) {\n        throw new HydrationMismatchError({\n          key,\n          expected: `<${tag}>`,\n          actual: null,\n          reason: 'element-absent',\n        });\n      }\n      if (element.tagName.toLowerCase() !== tag.toLowerCase()) {\n        throw new HydrationMismatchError({\n          key,\n          expected: `<${tag}>`,\n          actual: `<${element.tagName.toLowerCase()}>`,\n          reason: 'tag-mismatch',\n          actualNode: element,\n        });\n      }\n      claimed.add(element);\n      return element;\n    },\n    claimText(key, expected) {\n      const entry = text.get(key);\n      if (!entry) {\n        throw new HydrationMismatchError({\n          key,\n          expected: expected === undefined ? 'text' : JSON.stringify(expected),\n          actual: null,\n          reason: 'text-absent',\n        });\n      }\n      if (expected !== undefined && entry.text.nodeValue !== expected) {\n        throw new HydrationMismatchError({\n          key,\n          expected: JSON.stringify(expected),\n          actual: JSON.stringify(entry.text.nodeValue),\n          reason: 'text-mismatch',\n          actualNode: entry.text,\n        });\n      }\n      claimed.add(entry.text);\n      claimed.add(entry.start);\n      claimed.add(entry.end);\n      return entry.text;\n    },\n    claimBoundary(key, label) {\n      const comment = boundaries.get(boundaryAddress(key, label));\n      if (!comment) {\n        throw new HydrationMismatchError({\n          key,\n          expected: `<!--${label}-->`,\n          actual: null,\n          reason: 'boundary-absent',\n        });\n      }\n      claimed.add(comment);\n      return comment;\n    },\n    recordMismatch(error) {\n      mismatches.push(error);\n      onMismatch?.(error);\n    },\n    finish() {\n      for (const entry of text.values()) {\n        if (claimed.has(entry.text)) {\n          entry.start.remove();\n          entry.end.remove();\n        } else {\n          entry.start.remove();\n          entry.text.remove();\n          entry.end.remove();\n        }\n      }\n      for (const element of elements.values()) {\n        if (!claimed.has(element) && element.parentNode) element.remove();\n      }\n      for (const comment of boundaries.values()) {\n        if (!claimed.has(comment) && comment.parentNode) comment.remove();\n      }\n      if (mismatches.length > 0 && isDevelopment()) {\n        console.warn(\n          `Craft hydrated with ${mismatches.length} local remount${mismatches.length === 1 ? '' : 's'}.`,\n          mismatches,\n        );\n      }\n    },\n  };\n\n  return cursor;\n}\n\nfunction walkComments(parent: Node, visit: (comment: Comment) => void): void {\n  for (const child of [...parent.childNodes]) {\n    if (child.nodeType === Node.COMMENT_NODE) visit(child as Comment);\n    walkComments(child, visit);\n  }\n}\n\nfunction nextComment(\n  node: Node | null,\n  label: string,\n  key: string,\n): Comment | null {\n  let current = node;\n  while (current) {\n    if (current.nodeType === Node.COMMENT_NODE) {\n      const marker = parseMarker((current as Comment).data);\n      if (marker?.label === label && marker.key === key) {\n        return current as Comment;\n      }\n    }\n    current = current.nextSibling;\n  }\n  return null;\n}\n\nfunction parseMarker(value: string): { label: string; key: string } | null {\n  const separator = value.lastIndexOf('|hk:');\n  if (separator === -1) return null;\n  return {\n    label: value.slice(0, separator),\n    key: value.slice(separator + 4),\n  };\n}\n\nfunction boundaryAddress(key: string, label: string): string {\n  return `${key}\\u0000${label}`;\n}\n\nfunction isDevelopment(): boolean {\n  const processRef = (\n    globalThis as { process?: { env?: Record<string, string | undefined> } }\n  ).process;\n  return (\n    processRef === undefined || processRef.env?.['NODE_ENV'] !== 'production'\n  );\n}\n"]}

package/src/lib/render/interpreter.d.ts

@@ -0,0 +1,32 @@
+import { type CraftServiceProvider, type CraftDomAdapter, type CraftRenderIdentity } from '@craft-ts/core';
+import { Injector } from '../host-runtime';
+import { type CraftComponent } from '../types';
+import { CraftStyleRegistry } from './style-registry';
+import { type RuntimeLocatorCriteria } from '../locator';
+import { type HydrationCursor } from './hydration';
+import type { CraftSsrCoordinator } from './ssr-coordinator';
+import type { CraftServerStyleCollector } from './server-style-collector';
+export interface MountedCraftComponent<Props extends object> {
+    updateProps(props: Props): void;
+    destroy(): void;
+}
+export interface MountedCraftTemplate<Context> {
+    updateContext(context: Context): void;
+    locator(tag: string, criteria: RuntimeLocatorCriteria): Element | undefined;
+    destroy(): void;
+}
+export type InterpretedRenderOptions = Readonly<{
+    renderer: CraftDomAdapter;
+    mode?: 'create' | 'hydrate';
+    identity?: CraftRenderIdentity;
+    hydration?: HydrationCursor;
+    emitHydrationKeys?: boolean;
+    styleRoot?: Document | ShadowRoot;
+    styles?: CraftStyleRegistry;
+    ssr?: CraftSsrCoordinator;
+    serverStyles?: CraftServerStyleCollector;
+}>;
+export declare function mountInterpretedComponent<Props extends object>(component: CraftComponent<Props>, host: Element, injector: Injector | object, props: Props): MountedCraftComponent<Props>;
+export declare function mountInterpretedComponentWithOptions<Props extends object>(component: CraftComponent<Props>, host: Element, injector: Injector | object, props: Props, options: InterpretedRenderOptions): MountedCraftComponent<Props>;
+export declare function mountInterpretedComponentTemplate<Context>(component: CraftComponent<any>, host: Element, injector: Injector | object, context: Context, additionalProviders?: readonly CraftServiceProvider[]): MountedCraftTemplate<Context>;
+//# sourceMappingURL=interpreter.d.ts.map

package/src/lib/render/interpreter.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"interpreter.d.ts","sourceRoot":"","sources":["../../../../../../libs/component/src/lib/render/interpreter.ts"],"names":[],"mappings":"AAAA,OAAO,EAwCL,KAAK,oBAAoB,EACzB,KAAK,eAAe,EAepB,KAAK,mBAAmB,EAIzB,MAAM,gBAAgB,CAAC;AAExB,OAAO,EAKL,QAAQ,EAQT,MAAM,iBAAiB,CAAC;AAEzB,OAAO,EAIL,KAAK,cAAc,EACpB,MAAM,UAAU,CAAC;AAgDlB,OAAO,EAEL,kBAAkB,EAEnB,MAAM,kBAAkB,CAAC;AAE1B,OAAO,EAIL,KAAK,sBAAsB,EAC5B,MAAM,YAAY,CAAC;AACpB,OAAO,EAA0B,KAAK,eAAe,EAAE,MAAM,aAAa,CAAC;AAE3E,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,mBAAmB,CAAC;AAC7D,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,0BAA0B,CAAC;AA8lK1E,MAAM,WAAW,qBAAqB,CAAC,KAAK,SAAS,MAAM;IACzD,WAAW,CAAC,KAAK,EAAE,KAAK,GAAG,IAAI,CAAC;IAChC,OAAO,IAAI,IAAI,CAAC;CACjB;AAED,MAAM,WAAW,oBAAoB,CAAC,OAAO;IAC3C,aAAa,CAAC,OAAO,EAAE,OAAO,GAAG,IAAI,CAAC;IACtC,OAAO,CAAC,GAAG,EAAE,MAAM,EAAE,QAAQ,EAAE,sBAAsB,GAAG,OAAO,GAAG,SAAS,CAAC;IAC5E,OAAO,IAAI,IAAI,CAAC;CACjB;AAED,MAAM,MAAM,wBAAwB,GAAG,QAAQ,CAAC;IAC9C,QAAQ,EAAE,eAAe,CAAC;IAC1B,IAAI,CAAC,EAAE,QAAQ,GAAG,SAAS,CAAC;IAC5B,QAAQ,CAAC,EAAE,mBAAmB,CAAC;IAC/B,SAAS,CAAC,EAAE,eAAe,CAAC;IAC5B,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,SAAS,CAAC,EAAE,QAAQ,GAAG,UAAU,CAAC;IAClC,MAAM,CAAC,EAAE,kBAAkB,CAAC;IAC5B,GAAG,CAAC,EAAE,mBAAmB,CAAC;IAC1B,YAAY,CAAC,EAAE,yBAAyB,CAAC;CAC1C,CAAC,CAAC;AAEH,wBAAgB,yBAAyB,CAAC,KAAK,SAAS,MAAM,EAC5D,SAAS,EAAE,cAAc,CAAC,KAAK,CAAC,EAChC,IAAI,EAAE,OAAO,EACb,QAAQ,EAAE,QAAQ,GAAG,MAAM,EAC3B,KAAK,EAAE,KAAK,GACX,qBAAqB,CAAC,KAAK,CAAC,CAoB9B;AAED,wBAAgB,oCAAoC,CAAC,KAAK,SAAS,MAAM,EACvE,SAAS,EAAE,cAAc,CAAC,KAAK,CAAC,EAChC,IAAI,EAAE,OAAO,EACb,QAAQ,EAAE,QAAQ,GAAG,MAAM,EAC3B,KAAK,EAAE,KAAK,EACZ,OAAO,EAAE,wBAAwB,GAChC,qBAAqB,CAAC,KAAK,CAAC,CAyC9B;AAED,wBAAgB,iCAAiC,CAAC,OAAO,EACvD,SAAS,EAAE,cAAc,CAAC,GAAG,CAAC,EAC9B,IAAI,EAAE,OAAO,EACb,QAAQ,EAAE,QAAQ,GAAG,MAAM,EAC3B,OAAO,EAAE,OAAO,EAChB,mBAAmB,GAAE,SAAS,oBAAoB,EAAO,GACxD,oBAAoB,CAAC,OAAO,CAAC,CAqD/B"}