@microsoft/fast-element 3.0.0-rc.1 → 3.0.0-rc.2

package/dist/dts/di/di.d.ts

@@ -537,7 +537,7 @@ export declare const DI: Readonly<{
      *
      * @public
      */
-    singleton<T_1 extends Constructable>(target: T_1 & Partial<RegisterSelf<T_1>>, options?: SingletonOptions): T_1 & RegisterSelf<T_1>;
+    singleton<T extends Constructable>(target: T & Partial<RegisterSelf<T>>, options?: SingletonOptions): T & RegisterSelf<T>;
 }>;
 /**
  * The key that resolves the dependency injection Container itself.
@@ -827,7 +827,7 @@ export declare const Registration: Readonly<{
      * @param key - The key to register the singleton under.
      * @param value - The class to instantiate as a singleton when first requested.
      */
-    singleton<T_1 extends Constructable>(key: Key, value: T_1): Registration<InstanceType<T_1>>;
+    singleton<T extends Constructable>(key: Key, value: T): Registration<InstanceType<T>>;
     /**
      * Creates an instance from a class.
      * Every time you request this {@link Key} you will get a new instance.
@@ -840,7 +840,7 @@ export declare const Registration: Readonly<{
      * @param key - The key to register the instance type under.
      * @param value - The class to instantiate each time the key is requested.
      */
-    transient<T_2 extends Constructable>(key: Key, value: T_2): Registration<InstanceType<T_2>>;
+    transient<T extends Constructable>(key: Key, value: T): Registration<InstanceType<T>>;
     /**
      * Delegates to a callback function to provide the dependency.
      * Every time you request this {@link Key} the callback will be invoked to provide
@@ -855,7 +855,7 @@ export declare const Registration: Readonly<{
      * @param key - The key to register the callback for.
      * @param callback - The function that is expected to return the dependency.
      */
-    callback<T_3>(key: Key, callback: ResolveCallback<T_3>): Registration<Resolved<T_3>>;
+    callback<T>(key: Key, callback: ResolveCallback<T>): Registration<Resolved<T>>;
     /**
      * Delegates to a callback function to provide the dependency and then caches the
      * dependency for future requests.
@@ -872,7 +872,7 @@ export declare const Registration: Readonly<{
      * If you pass the same Registration to another container, the same cached value will be used.
      * Should all references to the resolver returned be removed, the cache will expire.
      */
-    cachedCallback<T_4>(key: Key, callback: ResolveCallback<T_4>): Registration<Resolved<T_4>>;
+    cachedCallback<T>(key: Key, callback: ResolveCallback<T>): Registration<Resolved<T>>;
     /**
      * Creates an alternate {@link Key} to retrieve an instance by.
      *
@@ -887,7 +887,7 @@ export declare const Registration: Readonly<{
      * @param originalKey - The original key that has been registered.
      * @param aliasKey - The alias to the original key.
      */
-    aliasTo<T_5>(originalKey: T_5, aliasKey: Key): Registration<Resolved<T_5>>;
+    aliasTo<T>(originalKey: T, aliasKey: Key): Registration<Resolved<T>>;
 }>;
 /** @internal */
 export declare function validateKey(key: any): void;

package/dist/dts/dom-policy.d.ts

@@ -1,5 +1,24 @@
-import { DOMAspect, type DOMSink, type DOMPolicy as IDOMPolicy } from "./dom.js";
+import { DOMAspect, type DOMSink } from "./dom.js";
 import { type TrustedTypesPolicy } from "./interfaces.js";
+/**
+ * A policy that controls whether values can be written to DOM sinks.
+ * @public
+ */
+export interface DOMPolicy {
+    /**
+     * Creates safe HTML from the provided value.
+     * @param value - The source to convert to safe HTML.
+     */
+    createHTML(value: string): string;
+    /**
+     * Protects a DOM sink that intends to write to the DOM.
+     * @param tagName - The tag name for the element to write to.
+     * @param aspect - The aspect of the DOM to write to.
+     * @param aspectName - The name of the aspect to write to.
+     * @param sink - The sink that is used to write to the DOM.
+     */
+    protect(tagName: string | null, aspect: DOMAspect, aspectName: string, sink: DOMSink): DOMSink;
+}
 /**
  * A specific DOM sink guard for a node aspect.
  * @public
@@ -72,12 +91,11 @@ export type DOMPolicyOptions = {
  * A helper for creating DOM policies.
  * @public
  */
-declare const DOMPolicy: Readonly<{
+export declare const DOMPolicy: Readonly<{
     /**
      * Creates a new DOM Policy object.
      * @param options - The options to use in creating the policy.
      * @returns The newly created DOMPolicy.
      */
-    create(options?: DOMPolicyOptions): Readonly<IDOMPolicy>;
+    create(options?: DOMPolicyOptions): Readonly<DOMPolicy>;
 }>;
-export { DOMPolicy };

package/dist/dts/dom.d.ts

@@ -1,3 +1,4 @@
+import type { DOMPolicy as DOMPolicyDefinition } from "./dom-policy.js";
 /**
  * The type of HTML aspect to target.
  * @public
@@ -46,20 +47,7 @@ export type DOMSink = (target: Node, aspectName: string, value: any, ...args: an
  * A security policy that FAST can use to interact with the DOM.
  * @public
  */
-export interface DOMPolicy {
-    /**
-     * Creates safe HTML from the provided value.
-     * @param value - The source to convert to safe HTML.
-     */
-    createHTML(value: string): string;
-    /**
-     * Protects a DOM sink that intends to write to the DOM.
-     * @param tagName - The tag name for the element to write to.
-     * @param aspect - The aspect of the DOM to write to.
-     * @param aspectName - The name of the aspect to write to.
-     * @param sink - The sink that is used to write to the DOM.
-     */
-    protect(tagName: string | null, aspect: DOMAspect, aspectName: string, sink: DOMSink): DOMSink;
+export interface DOMPolicy extends DOMPolicyDefinition {
 }
 /**
  * Common DOM APIs.
@@ -69,7 +57,7 @@ export declare const DOM: Readonly<{
     /**
      * Gets the dom policy used by the templating system.
      */
-    readonly policy: DOMPolicy;
+    readonly policy: DOMPolicyDefinition;
     /**
      * Sets the dom policy used by the templating system.
      * @param policy - The policy to set.
@@ -77,7 +65,7 @@ export declare const DOM: Readonly<{
      * This API can only be called once, for security reasons. It should be
      * called by the application developer at the start of their program.
      */
-    setPolicy(value: DOMPolicy): void;
+    setPolicy(value: DOMPolicyDefinition): void;
     /**
      * Sets an attribute value on an element.
      * @param element - The element to set the attribute value on.

package/dist/dts/hydration/diagnostics.d.ts

@@ -0,0 +1,93 @@
+import type { ViewBehaviorFactory } from "../templating/html-directive.js";
+/**
+ * Structured description of the binding hydration was expecting to apply when
+ * a mismatch is detected.
+ * @public
+ */
+export interface HydrationMismatchExpectation {
+    /**
+     * The tag name of the element the binding was expecting (e.g. `"SPAN"`),
+     * or `null` when the binding does not target a specific element (host or
+     * template-level bindings).
+     */
+    tagName: string | null;
+    /**
+     * Human-readable description of the binding aspect, for example
+     * `"content"`, `"property className"`, or `"attribute aria-label"`.
+     */
+    aspect: string;
+}
+/**
+ * Structured description of the DOM hydration actually encountered at the
+ * mismatch point.
+ * @public
+ */
+export interface HydrationMismatchActual {
+    /**
+     * Serialized HTML snippet of the server-rendered DOM where the mismatch
+     * was detected. Truncated with an ellipsis when long.
+     */
+    html: string;
+}
+/**
+ * Result of a hydration-mismatch diagnostic format call.
+ * @public
+ */
+export interface HydrationDiagnosticResult {
+    /**
+     * The error message to attach to the thrown hydration error.
+     */
+    message: string;
+    /**
+     * Structured description of the binding the hydration walk was
+     * attempting to apply. The default diagnostic leaves this `undefined`;
+     * install `hydrationDebugger()` to populate it.
+     */
+    expected?: HydrationMismatchExpectation | string;
+    /**
+     * Structured description of the server-rendered DOM that was
+     * encountered at the mismatch point. The default diagnostic leaves
+     * this `undefined`; install `hydrationDebugger()` to populate it.
+     */
+    received?: HydrationMismatchActual;
+}
+/**
+ * Pluggable formatter for hydration mismatch errors. The default
+ * implementation is a minimal one-line message; install
+ * {@link hydrationDebugger} to swap in the rich "Expected … / Received …"
+ * formatter with an HTML snippet of the SSR DOM.
+ * @public
+ */
+export interface HydrationDiagnostic {
+    /**
+     * Format a binding-resolution mismatch (a factory whose `targetNodeId`
+     * has no entry in the resolved targets after the SSR DOM walk).
+     */
+    formatBindingMismatch(factory: ViewBehaviorFactory, firstChild: Node, lastChild: Node, hostName: string | undefined): HydrationDiagnosticResult;
+    /**
+     * Format a structural error encountered during the SSR DOM walk
+     * (e.g. attribute binding count overflow, missing close marker).
+     */
+    formatStructuralError(node: Node, hostName: string | undefined, expectedDescription: string): HydrationDiagnosticResult;
+}
+/**
+ * Installs a {@link HydrationDiagnostic} as the active formatter for
+ * hydration mismatch errors. Called by `enableHydration()` when an opt-in
+ * debugger configuration is supplied; not exposed as `@public` because
+ * library consumers should always go through `enableHydration` to install
+ * a debugger.
+ * @internal
+ */
+export declare function installHydrationDiagnostic(diagnostic: HydrationDiagnostic): void;
+/**
+ * Returns the currently active {@link HydrationDiagnostic} — either the
+ * minimal default or one installed by an opt-in debugger.
+ * @internal
+ */
+export declare function getHydrationDiagnostic(): HydrationDiagnostic;
+/**
+ * Reads the host element's tag name from any node inside a hydration view.
+ * Returns `undefined` when the node is not inside a shadow root.
+ * @internal
+ */
+export declare function getHostName(node: Node | null | undefined): string | undefined;

package/dist/dts/hydration/hydration-debugger.d.ts

@@ -0,0 +1,35 @@
+import type { HydrationDiagnostic } from "./diagnostics.js";
+/**
+ * Opt-in hydration debugger configuration. Pass to `enableHydration` to
+ * install the rich "Expected / Received" hydration mismatch formatter:
+ *
+ * ```ts
+ * import { enableHydration, hydrationDebugger } from "@microsoft/fast-element/hydration.js";
+ *
+ * enableHydration({ debugger: hydrationDebugger() });
+ * ```
+ *
+ * @public
+ */
+export interface HydrationDebugger {
+    /**
+     * The {@link HydrationDiagnostic} the debugger installs when consumed
+     * by `enableHydration`.
+     */
+    readonly diagnostic: HydrationDiagnostic;
+}
+/**
+ * Returns a {@link HydrationDebugger} that, when supplied to
+ * `enableHydration({ debugger })`, installs the rich hydration mismatch
+ * formatter: a single-line "Expected … / Received …" message plus an HTML
+ * snippet of the SSR DOM and structured `expected`/`received` fields on
+ * the thrown error (both `HydrationBindingError` and
+ * `HydrationTargetElementError`).
+ *
+ * Without the debugger, hydration errors emit only a minimal one-line
+ * message pointing at this function — keeping the runtime hydration cost
+ * small for production bundles that do not need rich diagnostics.
+ *
+ * @public
+ */
+export declare function hydrationDebugger(): HydrationDebugger;

package/dist/dts/hydration/messages.d.ts

@@ -0,0 +1,62 @@
+/**
+ * Centralized hydration mismatch message strings used by both the default
+ * minimal `HydrationDiagnostic` and the opt-in `hydrationDebugger` rich
+ * formatter, and by the structural-error throw sites in
+ * `target-builder.ts`.
+ *
+ * Static text is exported as a plain `const`; interpolated text is exported
+ * as a small builder function. Plain `export const` declarations tree-shake
+ * better than frozen-object property bags, so unused strings drop out of
+ * bundles cleanly.
+ */
+/**
+ * Fallback host tag name used when a hydration mismatch is detected on a
+ * node that is not inside a shadow root.
+ */
+export declare const unknownHostName = "unknown";
+export declare const aspectLabelAttribute = "attribute";
+export declare const aspectLabelBooleanAttribute = "boolean attribute";
+export declare const aspectLabelProperty = "property";
+export declare const aspectLabelContent = "content";
+export declare const aspectLabelTokenList = "token list";
+export declare const aspectLabelEvent = "event";
+/** Fallback used when the aspectType is missing or unknown. */
+export declare const aspectLabelUnknown = "binding";
+/**
+ * Combines an aspect label with the original source aspect identifier from
+ * markup (e.g. `"property className"`). Returns the bare label when no
+ * source aspect was captured.
+ */
+export declare function formatAspect(label: string, sourceAspect: string | undefined): string;
+/**
+ * Formats the "Expected" half of the rich hydration mismatch message, e.g.
+ * `"<span> with content binding"` or `"content binding"` when no tag is
+ * associated with the binding factory.
+ */
+export declare function formatExpectedTarget(tagName: string | null, aspect: string): string;
+/**
+ * Default minimal hydration mismatch message used when the
+ * `hydrationDebugger` opt-in is not installed. The optional `detail` string
+ * carries the structural expectation surfaced by `target-builder.ts`.
+ */
+export declare function formatDefaultMismatchMessage(hostName: string, detail: string | undefined): string;
+/**
+ * Rich `Expected … / Received …` hydration mismatch message format produced
+ * by the `hydrationDebugger` formatter.
+ */
+export declare function formatRichMismatchMessage(hostName: string, expectedText: string, receivedHtml: string): string;
+export declare const expectedContentAfterStartMarker = "content following `<!--fe:b-->` content binding marker";
+export declare const expectedContentEndMarker = "matching `<!--fe:/b-->` content binding close marker";
+export declare const expectedElementBoundaryEndMarker = "matching `<!--fe:/e-->` element boundary close marker";
+/**
+ * Builds the "no more attribute bindings" structural expectation message
+ * thrown when an element's `data-fe` count claims more attribute bindings
+ * than the compiled template defines.
+ */
+export declare function formatNoMoreAttributeBindings(factoryCount: number): string;
+/**
+ * Builds the "no more content bindings" structural expectation message
+ * thrown when the SSR DOM contains more content binding markers than the
+ * compiled template defines.
+ */
+export declare function formatNoMoreContentBindings(factoryCount: number): string;

package/dist/dts/hydration/target-builder.d.ts

@@ -1,4 +1,5 @@
 import type { CompiledViewBehaviorFactory, ViewBehaviorFactory, ViewBehaviorTargets } from "../templating/html-directive.js";
+import { type HydrationMismatchActual, type HydrationMismatchExpectation } from "./diagnostics.js";
 export declare class HydrationTargetElementError extends Error {
     /**
      * The Compiled View Behavior Factories that belong to the view.
@@ -8,6 +9,18 @@ export declare class HydrationTargetElementError extends Error {
      * The node to target factory.
      */
     readonly node: Node;
+    /**
+     * Structured description of the binding the hydration walk was
+     * attempting to apply when the mismatch was detected. Free-form
+     * string for structural errors that do not correspond to a single
+     * binding factory.
+     */
+    readonly expected?: (HydrationMismatchExpectation | string) | undefined;
+    /**
+     * Structured description of the server-rendered DOM that was
+     * encountered at the mismatch point.
+     */
+    readonly received?: HydrationMismatchActual | undefined;
     /**
      * String representation of the HTML in the template that
      * threw the target element error.
@@ -25,7 +38,19 @@ export declare class HydrationTargetElementError extends Error {
     /**
      * The node to target factory.
      */
-    node: Node);
+    node: Node, 
+    /**
+     * Structured description of the binding the hydration walk was
+     * attempting to apply when the mismatch was detected. Free-form
+     * string for structural errors that do not correspond to a single
+     * binding factory.
+     */
+    expected?: (HydrationMismatchExpectation | string) | undefined, 
+    /**
+     * Structured description of the server-rendered DOM that was
+     * encountered at the mismatch point.
+     */
+    received?: HydrationMismatchActual | undefined);
 }
 /**
  * Represents the DOM boundaries controlled by a view

package/dist/dts/hydration.d.ts

@@ -1,10 +1,14 @@
 export type { HydrationOptions } from "./components/enable-hydration.js";
-export { deferHydrationAttribute, enableHydration, } from "./components/enable-hydration.js";
+export { deferHydrationAttribute, enableHydration, StopHydration, } from "./components/enable-hydration.js";
 export { isHydratable } from "./components/hydration.js";
 export { HydrationTracker } from "./components/hydration-tracker.js";
-export type { DOMAspect, DOMPolicy, DOMSink, } from "./dom.js";
+export type { DOMAspect, DOMSink, } from "./dom.js";
+export { type DOMAspectGuards, type DOMElementGuards, type DOMGuards, DOMPolicy, type DOMPolicyOptions, type DOMSinkGuards, } from "./dom-policy.js";
+export type { HydrationDiagnostic, HydrationDiagnosticResult, HydrationMismatchActual, HydrationMismatchExpectation, } from "./hydration/diagnostics.js";
+export type { HydrationDebugger } from "./hydration/hydration-debugger.js";
+export { hydrationDebugger } from "./hydration/hydration-debugger.js";
 export type { ViewBehaviorBoundaries, ViewBoundaries, } from "./hydration/target-builder.js";
-export type { Disposable } from "./interfaces.js";
+export type { Disposable, TrustedTypesPolicy } from "./interfaces.js";
 export type { ExecutionContext, ExpressionController, SourceLifetime, } from "./observation/observable.js";
 export type { ContentTemplate, ContentView, HydratableContentTemplate, } from "./templating/html-binding-directive.js";
 export type { ViewBehavior, ViewBehaviorFactory, ViewBehaviorTargets, ViewController, } from "./templating/html-directive.js";

package/dist/dts/index.d.ts

@@ -1,3 +1,7 @@
+/**
+ * Core APIs for building standards-based Web Components with FAST Element.
+ * @packageDocumentation
+ */
 export { AttributeConfiguration, AttributeDefinition, type AttributeMode, attr, booleanConverter, type DecoratorAttributeConfiguration, nullableBooleanConverter, nullableNumberConverter, type ValueConverter, } from "./attr.js";
 export { Binding, type BindingDirective } from "./binding/binding.js";
 export { normalizeBinding } from "./binding/normalize.js";
@@ -7,9 +11,9 @@ export { Signal, signal } from "./binding/signal.js";
 export { type TwoWayBindingOptions, TwoWaySettings, twoWay, } from "./binding/two-way.js";
 export type { ElementControllerStrategy } from "./components/element-controller.js";
 export { ElementController, Stages, } from "./components/element-controller.js";
-export type { FASTElementExtension, FASTElementTemplateResolver, PartialFASTElementDefinition, ShadowRootOptions, TypeRegistry, } from "./components/fast-definitions.js";
+export type { FASTElementExtension, FASTElementTemplateResolver, PartialFASTElementDefinition, ShadowRootOptions, TypeDefinition, TypeRegistry, } from "./components/fast-definitions.js";
 export { FASTElementDefinition, fastElementRegistry, type TemplateLifecycleCallbacks, } from "./components/fast-definitions.js";
-export { customElement, FASTElement } from "./components/fast-element.js";
+export { customElement, FASTElement, type FASTElementConstructor, } from "./components/fast-element.js";
 export { enableDebug } from "./debug.js";
 export { type ChildListDirectiveOptions, ChildrenDirective, type ChildrenDirectiveOptions, children, type SubtreeDirectiveOptions, } from "./directives/children.js";
 export { type ElementsFilter, elements, type NodeBehaviorOptions, NodeObservationDirective, } from "./directives/node-observation.js";
@@ -17,7 +21,7 @@ export { RefDirective, ref } from "./directives/ref.js";
 export { RepeatBehavior, RepeatDirective, type RepeatOptions, repeat, } from "./directives/repeat.js";
 export { SlottedDirective, type SlottedDirectiveOptions, slotted, } from "./directives/slotted.js";
 export { when } from "./directives/when.js";
-export * from "./dom.js";
+export { DOM, DOMAspect, type DOMSink } from "./dom.js";
 export { type DOMAspectGuards, type DOMElementGuards, type DOMGuards, DOMPolicy, type DOMPolicyOptions, type DOMSinkGuards, } from "./dom-policy.js";
 export type { Callable, Class, Constructable, Disposable, TrustedTypesPolicy, } from "./interfaces.js";
 export { ArrayObserver, type LengthObserver, lengthOf, Sort, type SortObserver, Splice, SpliceStrategy, SpliceStrategySupport, sortedCount, } from "./observation/arrays.js";

package/dist/dts/interfaces.d.ts

@@ -72,6 +72,7 @@ export declare const enum Message {
     cannotSetTemplatePolicyAfterCompilation = 1208,
     blockedByDOMPolicy = 1209,
     invalidHydrationAttributeMarker = 1210,
+    duplicateRenderInstruction = 1211,
     missingElementDefinition = 1401,
     noRegistrationForContext = 1501,
     noFactoryForResolver = 1502,

package/dist/dts/observation/observable.d.ts

@@ -180,13 +180,13 @@ export declare const Observable: Readonly<{
      * @param initialSubscriber - An initial subscriber to changes in the binding value.
      * @param isVolatileBinding - Indicates whether the binding's dependency list must be re-evaluated on every value evaluation.
      */
-    binding<TSource = any, TReturn = any>(expression: Expression<TSource, TReturn, any>, initialSubscriber?: Subscriber, isVolatileBinding?: boolean): ExpressionNotifier<TSource, TReturn, any>;
+    binding<TSource = any, TReturn = any>(expression: Expression<TSource, TReturn>, initialSubscriber?: Subscriber, isVolatileBinding?: boolean): ExpressionNotifier<TSource, TReturn>;
     /**
      * Determines whether a binding expression is volatile and needs to have its dependency list re-evaluated
      * on every evaluation of the value.
      * @param expression - The binding to inspect.
      */
-    isVolatileBinding<TSource_1 = any, TReturn_1 = any>(expression: Expression<TSource_1, TReturn_1, any>): boolean;
+    isVolatileBinding<TSource = any, TReturn = any>(expression: Expression<TSource, TReturn>): boolean;
 }>;
 /**
  * Decorator: Defines an observable property on the target.
@@ -270,7 +270,7 @@ export declare const ExecutionContext: Readonly<{
     /**
      * A default execution context.
      */
-    default: ExecutionContext<any>;
+    default: ExecutionContext;
     /**
      * Gets the current event.
      * @returns An event object.

package/dist/dts/platform.d.ts

@@ -35,19 +35,35 @@ export declare function getDebugMessageLookup(): Record<number, string>;
  */
 export declare const emptyArray: readonly never[];
 /**
- * Do not change. Part of shared kernel contract.
- * @internal
+ * A type that can be registered with a `TypeRegistry`.
+ * @public
  */
 export interface TypeDefinition {
+    /**
+     * The registered type constructor.
+     */
     type: Function;
 }
 /**
- * Do not change. Part of shared kernel contract.
- * @internal
+ * A registry that stores definitions by type.
+ * @public
  */
 export interface TypeRegistry<TDefinition extends TypeDefinition> {
+    /**
+     * Registers a type definition.
+     * @param definition - The type definition to register.
+     * @returns `true` when the definition was registered, otherwise `false`.
+     */
     register(definition: TDefinition): boolean;
+    /**
+     * Gets a definition by type.
+     * @param key - The type to retrieve the definition for.
+     */
     getByType(key: Function): TDefinition | undefined;
+    /**
+     * Gets a definition by instance.
+     * @param object - The instance to retrieve the definition for.
+     */
     getForInstance(object: any): TDefinition | undefined;
 }
 /**

package/dist/dts/registry.d.ts

@@ -0,0 +1 @@
+export { FASTElementDefinition, fastElementRegistry, type TypeDefinition, type TypeRegistry, } from "./components/fast-definitions.js";

package/dist/dts/templating/children.d.ts

@@ -59,4 +59,4 @@ export declare class ChildrenDirective extends NodeObservationDirective<Children
  * @param propertyOrOptions - The options used to configure child node observation.
  * @public
  */
-export declare function children<TSource = any>(propertyOrOptions: (keyof TSource & string) | ChildrenDirectiveOptions<keyof TSource & string>): CaptureType;
+export declare function children<TSource = any, TParent = any>(propertyOrOptions: (keyof TSource & string) | ChildrenDirectiveOptions<keyof TSource & string>): CaptureType<TSource, TParent>;

package/dist/dts/templating/compiler.d.ts

@@ -1,4 +1,4 @@
-import { type DOMPolicy } from "../dom.js";
+import type { DOMPolicy } from "../dom-policy.js";
 import { type ViewBehaviorFactory } from "./html-directive.js";
 import type { HTMLTemplateCompilationResult as TemplateCompilationResult } from "./template.js";
 /**

package/dist/dts/templating/html-binding-directive.d.ts

@@ -1,5 +1,6 @@
 import type { Binding, BindingDirective } from "../binding/binding.js";
-import { DOMAspect, type DOMPolicy } from "../dom.js";
+import { DOMAspect } from "../dom.js";
+import type { DOMPolicy } from "../dom-policy.js";
 import { ExecutionContext, type Expression, type ExpressionObserver } from "../observation/observable.js";
 import { type AddViewBehaviorFactory, type Aspected, HTMLDirective, type ViewBehavior, type ViewBehaviorFactory, type ViewController } from "./html-directive.js";
 /**
@@ -65,7 +66,6 @@ export interface HydratableContentTemplate extends ContentTemplate {
  * @public
  */
 export declare class HTMLBindingDirective implements HTMLDirective, ViewBehaviorFactory, ViewBehavior, Aspected, BindingDirective {
-    dataBinding: Binding;
     private data;
     private updateTarget;
     /**
@@ -96,6 +96,10 @@ export declare class HTMLBindingDirective implements HTMLDirective, ViewBehavior
      * The type of aspect to target.
      */
     aspectType: DOMAspect;
+    /**
+     * The binding configuration to apply.
+     */
+    dataBinding: Binding;
     /**
      * Creates an instance of HTMLBindingDirective.
      * @param dataBinding - The binding configuration to apply.

package/dist/dts/templating/html-directive.d.ts

@@ -1,5 +1,6 @@
 import type { Binding } from "../binding/binding.js";
-import { DOMAspect, type DOMPolicy } from "../dom.js";
+import { DOMAspect } from "../dom.js";
+import type { DOMPolicy } from "../dom-policy.js";
 import type { Constructable } from "../interfaces.js";
 import type { ExpressionController } from "../observation/observable.js";
 /**

package/dist/dts/templating/hydration-view.d.ts

@@ -1,11 +1,12 @@
 import { Hydratable } from "../components/hydration.js";
+import { type HydrationMismatchActual, type HydrationMismatchExpectation } from "../hydration/diagnostics.js";
 import { type ViewBehaviorBoundaries } from "../hydration/target-builder.js";
 import { type ExecutionContext, SourceLifetime } from "../observation/observable.js";
 import type { ViewTemplate } from "../templating/template.js";
 import type { ViewBehaviorFactory, ViewBehaviorTargets, ViewController } from "./html-directive.js";
 import { DefaultExecutionContext, type ElementView, type SyntheticView } from "./view.js";
 /** @public */
-export interface HydratableView<TSource = any, TParent = any> extends ElementView, SyntheticView, DefaultExecutionContext<TParent> {
+export interface HydratableView<TSource = any, TParent = any> extends ElementView<TSource, TParent>, SyntheticView<TSource, TParent>, DefaultExecutionContext<TParent> {
     [Hydratable]: symbol;
     readonly bindingViewBoundaries: Record<string, ViewNodes>;
     readonly hydrationStage: keyof typeof HydrationStage;
@@ -42,6 +43,16 @@ export declare class HydrationBindingError extends Error {
      * threw the binding error.
      */
     readonly templateString: string;
+    /**
+     * Structured description of the binding the hydration walk was
+     * attempting to apply when the mismatch was detected.
+     */
+    readonly expected?: HydrationMismatchExpectation | undefined;
+    /**
+     * Structured description of the server-rendered DOM that was
+     * encountered at the mismatch point.
+     */
+    readonly received?: HydrationMismatchActual | undefined;
     constructor(
     /**
      * The error message
@@ -60,7 +71,17 @@ export declare class HydrationBindingError extends Error {
      * String representation of the HTML in the template that
      * threw the binding error.
      */
-    templateString: string);
+    templateString: string, 
+    /**
+     * Structured description of the binding the hydration walk was
+     * attempting to apply when the mismatch was detected.
+     */
+    expected?: HydrationMismatchExpectation | undefined, 
+    /**
+     * Structured description of the server-rendered DOM that was
+     * encountered at the mismatch point.
+     */
+    received?: HydrationMismatchActual | undefined);
 }
 export declare class HydrationView<TSource = any, TParent = any> extends DefaultExecutionContext<TParent> implements HydratableView {
     readonly firstChild: Node;
@@ -71,7 +92,7 @@ export declare class HydrationView<TSource = any, TParent = any> extends Default
     context: ExecutionContext<any>;
     source: TSource | null;
     isBound: boolean;
-    get hydrationStage(): "unhydrated" | "hydrating" | "hydrated";
+    get hydrationStage(): "hydrated" | "hydrating" | "unhydrated";
     get targets(): ViewBehaviorTargets;
     get bindingViewBoundaries(): ViewBehaviorBoundaries;
     readonly sourceLifetime: SourceLifetime;

package/dist/dts/templating/ref.d.ts

@@ -20,4 +20,4 @@ export declare class RefDirective extends StatelessAttachedAttributeDirective<st
  * @param propertyName - The name of the property to assign the reference to.
  * @public
  */
-export declare const ref: <TSource = any>(propertyName: keyof TSource & string) => CaptureType;
+export declare const ref: <TSource = any, TParent = any>(propertyName: keyof TSource & string) => CaptureType<TSource, TParent>;

package/dist/dts/templating/render.d.ts

@@ -1,6 +1,6 @@
 import { Binding, type BindingDirective } from "../binding/binding.js";
 import type { FASTElement } from "../components/fast-element.js";
-import type { DOMPolicy } from "../dom.js";
+import type { DOMPolicy } from "../dom-policy.js";
 import { type Constructable } from "../interfaces.js";
 import type { Subscriber } from "../observation/notifier.js";
 import type { ExecutionContext, Expression, ExpressionObserver } from "../observation/observable.js";
@@ -314,5 +314,5 @@ export declare class NodeTemplate implements ContentTemplate, ContentView {
  * RenderInstruction to determine the view.
  * @public
  */
-export declare function render<TSource = any, TItem = any, TParent = any>(value?: Expression<TSource, TItem> | Binding<TSource, TItem> | {}, template?: ContentTemplate | string | Expression<TSource, ContentTemplate | string | Node, TParent> | Binding<TSource, ContentTemplate | string | Node, TParent>): CaptureType;
+export declare function render<TSource = any, TItem = any, TParent = any>(value?: Expression<TSource, TItem> | Binding<TSource, TItem> | {}, template?: ContentTemplate | string | Expression<TSource, ContentTemplate | string | Node, TParent> | Binding<TSource, ContentTemplate | string | Node, TParent>): CaptureType<TSource, TParent>;
 export {};

package/dist/dts/templating/repeat.d.ts

@@ -127,4 +127,4 @@ export declare class RepeatDirective<TSource = any> implements HTMLDirective, Vi
  * @param options - Options used to turn on special repeat features.
  * @public
  */
-export declare function repeat<TSource = any, TArray extends ReadonlyArray<any> = ReadonlyArray<any>, TParent = any>(items: Expression<TSource, TArray, TParent> | Binding<TSource, TArray, TParent> | ReadonlyArray<any>, template: Expression<TSource, ViewTemplate<any, TSource>> | Binding<TSource, ViewTemplate<any, TSource>> | ViewTemplate<any, TSource>, options?: RepeatOptions): CaptureType;
+export declare function repeat<TSource = any, TArray extends ReadonlyArray<any> = ReadonlyArray<any>, TParent = any>(items: Expression<TSource, TArray, TParent> | Binding<TSource, TArray, TParent> | ReadonlyArray<any>, template: Expression<TSource, ViewTemplate<any, TSource>> | Binding<TSource, ViewTemplate<any, TSource>> | ViewTemplate<any, TSource>, options?: RepeatOptions): CaptureType<TSource, TParent>;