@microsoft/fast-element 2.0.0-beta.1 → 2.0.0-beta.11

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

@@ -1,9 +1,8 @@
-import type { Behavior } from "../observation/behavior.js";
 import type { Subscriber } from "../observation/notifier.js";
-import { Binding, ChildContext, ExecutionContext, ItemContext, RootContext } from "../observation/observable.js";
+import { Expression, ExpressionObserver } from "../observation/observable.js";
 import { Splice } from "../observation/arrays.js";
-import { AddViewBehaviorFactory, HTMLDirective, ViewBehaviorFactory, ViewBehaviorTargets } from "./html-directive.js";
-import type { CaptureType, ChildViewTemplate, ItemViewTemplate, SyntheticViewTemplate, ViewTemplate } from "./template.js";
+import { AddViewBehaviorFactory, Binding, HTMLDirective, ViewBehavior, ViewBehaviorFactory, ViewController } from "./html-directive.js";
+import type { CaptureType, SyntheticViewTemplate, ViewTemplate } from "./template.js";
 /**
  * Options for configuring repeat behavior.
  * @public
@@ -22,40 +21,34 @@ export interface RepeatOptions {
  * A behavior that renders a template for each item in an array.
  * @public
  */
-export declare class RepeatBehavior<TSource = any> implements Behavior, Subscriber {
+export declare class RepeatBehavior<TSource = any> implements ViewBehavior, Subscriber {
+    private directive;
     private location;
-    private itemsBinding;
-    private templateBinding;
-    private options;
-    private source;
+    private controller;
     private views;
     private template;
     private templateBindingObserver;
     private items;
     private itemsObserver;
     private itemsBindingObserver;
-    private context;
-    private childContext;
     private bindView;
     /**
      * Creates an instance of RepeatBehavior.
      * @param location - The location in the DOM to render the repeat.
-     * @param itemsBinding - The array to render.
+     * @param dataBinding - The array to render.
      * @param isItemsBindingVolatile - Indicates whether the items binding has volatile dependencies.
      * @param templateBinding - The template to render for each item.
      * @param isTemplateBindingVolatile - Indicates whether the template binding has volatile dependencies.
      * @param options - Options used to turn on special repeat features.
      */
-    constructor(location: Node, itemsBinding: Binding<TSource, any[]>, isItemsBindingVolatile: boolean, templateBinding: Binding<TSource, SyntheticViewTemplate>, isTemplateBindingVolatile: boolean, options: RepeatOptions);
+    constructor(directive: RepeatDirective);
     /**
-     * Bind this behavior to the source.
-     * @param source - The source to bind to.
-     * @param context - The execution context that the binding is operating within.
+     * Bind this behavior.
+     * @param controller - The view controller that manages the lifecycle of this behavior.
      */
-    bind(source: TSource, context: ExecutionContext): void;
+    bind(controller: ViewController): void;
     /**
-     * Unbinds this behavior from the source.
-     * @param source - The source to unbind from.
+     * Unbinds this behavior.
      */
     unbind(): void;
     /**
@@ -63,7 +56,7 @@ export declare class RepeatBehavior<TSource = any> implements Behavior, Subscrib
      * @param source - The source of the change.
      * @param args - The details about what was changed.
      */
-    handleChange(source: any, args: Splice[]): void;
+    handleChange(source: any, args: Splice[] | ExpressionObserver): void;
     private observeItems;
     private updateViews;
     private refreshAllViews;
@@ -74,11 +67,9 @@ export declare class RepeatBehavior<TSource = any> implements Behavior, Subscrib
  * @public
  */
 export declare class RepeatDirective<TSource = any> implements HTMLDirective, ViewBehaviorFactory {
-    readonly itemsBinding: Binding;
+    readonly dataBinding: Binding<TSource>;
     readonly templateBinding: Binding<TSource, SyntheticViewTemplate>;
     readonly options: RepeatOptions;
-    private isItemsBindingVolatile;
-    private isTemplateBindingVolatile;
     /**
      * The unique id of the factory.
      */
@@ -94,69 +85,23 @@ export declare class RepeatDirective<TSource = any> implements HTMLDirective, Vi
     createHTML(add: AddViewBehaviorFactory): string;
     /**
      * Creates an instance of RepeatDirective.
-     * @param itemsBinding - The binding that provides the array to render.
+     * @param dataBinding - The binding that provides the array to render.
      * @param templateBinding - The template binding used to obtain a template to render for each item in the array.
      * @param options - Options used to turn on special repeat features.
      */
-    constructor(itemsBinding: Binding, templateBinding: Binding<TSource, SyntheticViewTemplate>, options: RepeatOptions);
+    constructor(dataBinding: Binding<TSource>, templateBinding: Binding<TSource, SyntheticViewTemplate>, options: RepeatOptions);
     /**
      * Creates a behavior for the provided target node.
      * @param target - The node instance to create the behavior for.
      */
-    createBehavior(targets: ViewBehaviorTargets): RepeatBehavior<TSource>;
+    createBehavior(): RepeatBehavior<TSource>;
 }
 /**
  * A directive that enables list rendering.
- * @param itemsBinding - The array to render.
- * @param templateOrTemplateBinding - The template or a template binding used obtain a template
+ * @param items - The array to render.
+ * @param template - The template or a template binding used obtain a template
  * to render for each item in the array.
  * @param options - Options used to turn on special repeat features.
  * @public
  */
-export declare function repeat<TSource = any, TArray extends ReadonlyArray<any> = ReadonlyArray<any>>(itemsBinding: Binding<TSource, TArray, ExecutionContext<TSource>>, templateOrTemplateBinding: ViewTemplate | Binding<TSource, ViewTemplate, RootContext>, options?: {
-    positioning: false;
-} | {
-    recycle: true;
-} | {
-    positioning: false;
-    recycle: false;
-} | {
-    positioning: false;
-    recycle: true;
-}): CaptureType<TSource>;
-/**
- * A directive that enables list rendering.
- * @param itemsBinding - The array to render.
- * @param templateOrTemplateBinding - The template or a template binding used obtain a template
- * to render for each item in the array.
- * @param options - Options used to turn on special repeat features.
- * @public
- */
-export declare function repeat<TSource = any, TArray extends ReadonlyArray<any> = ReadonlyArray<any>>(itemsBinding: Binding<TSource, TArray, ExecutionContext<TSource>>, templateOrTemplateBinding: ChildViewTemplate | Binding<TSource, ChildViewTemplate, ChildContext>, options?: {
-    positioning: false;
-} | {
-    recycle: true;
-} | {
-    positioning: false;
-    recycle: false;
-} | {
-    positioning: false;
-    recycle: true;
-}): CaptureType<TSource>;
-/**
- * A directive that enables list rendering.
- * @param itemsBinding - The array to render.
- * @param templateOrTemplateBinding - The template or a template binding used obtain a template
- * to render for each item in the array.
- * @param options - Options used to turn on special repeat features.
- * @public
- */
-export declare function repeat<TSource = any, TArray extends ReadonlyArray<any> = ReadonlyArray<any>>(itemsBinding: Binding<TSource, TArray, ExecutionContext<TSource>>, templateOrTemplateBinding: ItemViewTemplate | Binding<TSource, ItemViewTemplate, ItemContext>, options: {
-    positioning: true;
-} | {
-    positioning: true;
-    recycle: true;
-} | {
-    positioning: true;
-    recycle: false;
-}): CaptureType<TSource>;
+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>;

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

@@ -35,4 +35,4 @@ export declare class SlottedDirective extends NodeObservationDirective<SlottedDi
  * @param propertyOrOptions - The options used to configure slotted node observation.
  * @public
  */
-export declare function slotted<T = any>(propertyOrOptions: (keyof T & string) | SlottedDirectiveOptions<keyof T & string>): CaptureType<T>;
+export declare function slotted<TSource = any, TParent = any>(propertyOrOptions: (keyof TSource & string) | SlottedDirectiveOptions<keyof TSource & string>): CaptureType<TSource, TParent>;

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

@@ -1,12 +1,11 @@
-import { Binding, ChildContext, ExecutionContext, ItemContext } from "../observation/observable.js";
-import { HTMLDirective, ViewBehaviorFactory } from "./html-directive.js";
+import type { Expression } from "../observation/observable.js";
+import { Binding, HTMLDirective, ViewBehaviorFactory } from "./html-directive.js";
 import type { ElementView, HTMLView, SyntheticView } from "./view.js";
 /**
  * A template capable of creating views specifically for rendering custom elements.
  * @public
  */
 export interface ElementViewTemplate<TSource = any, TParent = any> {
-    type: "element";
     /**
      * Creates an ElementView instance based on this template definition.
      * @param hostBindingTarget - The element that host behaviors will be bound to.
@@ -25,57 +24,29 @@ export interface ElementViewTemplate<TSource = any, TParent = any> {
  * A template capable of rendering views not specifically connected to custom elements.
  * @public
  */
-export interface SyntheticViewTemplate<TSource = any, TParent = any, TContext extends ExecutionContext<TParent> = ExecutionContext<TParent>> {
-    type: "synthetic";
+export interface SyntheticViewTemplate<TSource = any, TParent = any> {
     /**
      * Creates a SyntheticView instance based on this template definition.
      */
-    create(): SyntheticView<TSource, TParent, TContext>;
-}
-/**
- * A template capable of rendering child views not specifically connected to custom elements.
- * @public
- */
-export interface ChildViewTemplate<TSource = any, TParent = any> {
-    type: "child";
-    /**
-     * Creates a SyntheticView instance based on this template definition.
-     */
-    create(): SyntheticView<TSource, TParent, ChildContext<TParent>>;
-}
-/**
- * A template capable of rendering item views not specifically connected to custom elements.
- * @public
- */
-export interface ItemViewTemplate<TSource = any, TParent = any> {
-    type: "item";
-    /**
-     * Creates a SyntheticView instance based on this template definition.
-     */
-    create(): SyntheticView<TSource, TParent, ItemContext<TParent>>;
+    create(): SyntheticView<TSource, TParent>;
 }
 /**
  * The result of a template compilation operation.
  * @public
  */
-export interface HTMLTemplateCompilationResult<TSource = any, TParent = any, TContext extends ExecutionContext<TParent> = ExecutionContext<TParent>> {
+export interface HTMLTemplateCompilationResult<TSource = any, TParent = any> {
     /**
      * Creates a view instance.
      * @param hostBindingTarget - The host binding target for the view.
      */
-    createView(hostBindingTarget?: Element): HTMLView<TSource, TParent, TContext>;
+    createView(hostBindingTarget?: Element): HTMLView<TSource, TParent>;
 }
 /**
  * A template capable of creating HTMLView instances or rendering directly to DOM.
  * @public
  */
-export declare class ViewTemplate<TSource = any, TParent = any, TContext extends ExecutionContext<TParent> = ExecutionContext> implements ElementViewTemplate<TSource, TParent>, SyntheticViewTemplate<TSource, TParent, TContext> {
+export declare class ViewTemplate<TSource = any, TParent = any> implements ElementViewTemplate<TSource, TParent>, SyntheticViewTemplate<TSource, TParent> {
     private result;
-    /**
-     * Used for TypeScript purposes only.
-     * Do not use.
-     */
-    type: any;
     /**
      * The html representing what this template will
      * instantiate, including placeholders for directives.
@@ -95,7 +66,7 @@ export declare class ViewTemplate<TSource = any, TParent = any, TContext extends
      * Creates an HTMLView instance based on this template definition.
      * @param hostBindingTarget - The element that host behaviors will be bound to.
      */
-    create(hostBindingTarget?: Element): HTMLView<TSource, TParent, TContext>;
+    create(hostBindingTarget?: Element): HTMLView<TSource, TParent>;
     /**
      * Creates an HTMLView from this template, binds it to the source, and then appends it to the host.
      * @param source - The data source to bind the template to.
@@ -103,20 +74,20 @@ export declare class ViewTemplate<TSource = any, TParent = any, TContext extends
      * @param hostBindingTarget - An HTML element to target the host bindings at if different from the
      * host that the template is being attached to.
      */
-    render(source: TSource, host: Node, hostBindingTarget?: Element, context?: TContext): HTMLView<TSource, TParent, TContext>;
+    render(source: TSource, host: Node, hostBindingTarget?: Element): HTMLView<TSource, TParent>;
 }
 /**
  * A marker interface used to capture types when interpolating Directive helpers
  * into templates.
  * @public
  */
-export interface CaptureType<TSource> {
+export interface CaptureType<TSource, TParent> {
 }
 /**
  * Represents the types of values that can be interpolated into a template.
  * @public
  */
-export declare type TemplateValue<TSource, TParent = any, TContext extends ExecutionContext<TParent> = ExecutionContext<TParent>> = Binding<TSource, any, TContext> | HTMLDirective | CaptureType<TSource>;
+export declare type TemplateValue<TSource, TParent = any> = Expression<TSource, any, TParent> | Binding<TSource, any, TParent> | HTMLDirective | CaptureType<TSource, TParent>;
 /**
  * Transforms a template literal string into a ViewTemplate.
  * @param strings - The string fragments that are interpolated with the values.
@@ -126,24 +97,4 @@ export declare type TemplateValue<TSource, TParent = any, TContext extends Execu
  * other template instances, and Directive instances.
  * @public
  */
-export declare function html<TSource = any, TParent = any, TContext extends ExecutionContext<TParent> = ExecutionContext<TParent>>(strings: TemplateStringsArray, ...values: TemplateValue<TSource, TParent, TContext>[]): ViewTemplate<TSource, TParent>;
-/**
- * Transforms a template literal string into a ChildViewTemplate.
- * @param strings - The string fragments that are interpolated with the values.
- * @param values - The values that are interpolated with the string fragments.
- * @remarks
- * The html helper supports interpolation of strings, numbers, binding expressions,
- * other template instances, and Directive instances.
- * @public
- */
-export declare const child: <TChild = any, TParent = any>(strings: TemplateStringsArray, ...values: TemplateValue<TChild, TParent, ChildContext<TParent>>[]) => ChildViewTemplate<TChild, TParent>;
-/**
- * Transforms a template literal string into an ItemViewTemplate.
- * @param strings - The string fragments that are interpolated with the values.
- * @param values - The values that are interpolated with the string fragments.
- * @remarks
- * The html helper supports interpolation of strings, numbers, binding expressions,
- * other template instances, and Directive instances.
- * @public
- */
-export declare const item: <TItem = any, TParent = any>(strings: TemplateStringsArray, ...values: TemplateValue<TItem, TParent, ItemContext<TParent>>[]) => ItemViewTemplate<TItem, TParent>;
+export declare function html<TSource = any, TParent = any>(strings: TemplateStringsArray, ...values: TemplateValue<TSource, TParent>[]): ViewTemplate<TSource, TParent>;

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

@@ -1,15 +1,15 @@
 import type { Disposable } from "../interfaces.js";
-import type { ExecutionContext, RootContext } from "../observation/observable.js";
-import type { ViewBehaviorFactory, ViewBehaviorTargets } from "./html-directive.js";
+import { ExecutionContext, SourceLifetime } from "../observation/observable.js";
+import type { ViewBehaviorFactory, ViewBehaviorTargets, ViewController } from "./html-directive.js";
 /**
  * Represents a collection of DOM nodes which can be bound to a data source.
  * @public
  */
-export interface View<TSource = any, TParent = any, TContext extends ExecutionContext<TParent> = ExecutionContext<TParent>> extends Disposable {
+export interface View<TSource = any, TParent = any> extends Disposable {
     /**
      * The execution context the view is running within.
      */
-    readonly context: TContext | null;
+    readonly context: ExecutionContext<TParent>;
     /**
      * The data that the view is bound to.
      */
@@ -17,9 +17,8 @@ export interface View<TSource = any, TParent = any, TContext extends ExecutionCo
     /**
      * Binds a view's behaviors to its binding source.
      * @param source - The binding source for the view's binding behaviors.
-     * @param context - The execution context to run the view within.
      */
-    bind(source: TSource, context: TContext): void;
+    bind(source: TSource, context?: ExecutionContext<TParent>): void;
     /**
      * Unbinds a view's behaviors from its binding source and context.
      */
@@ -29,7 +28,7 @@ export interface View<TSource = any, TParent = any, TContext extends ExecutionCo
  * A View representing DOM nodes specifically for rendering the view of a custom element.
  * @public
  */
-export interface ElementView<TSource = any, TParent = any> extends View<TSource, TParent, RootContext> {
+export interface ElementView<TSource = any, TParent = any> extends View<TSource, TParent> {
     /**
      * Appends the view's DOM nodes to the referenced node.
      * @param node - The parent node to append the view's DOM nodes to.
@@ -40,7 +39,7 @@ export interface ElementView<TSource = any, TParent = any> extends View<TSource,
  * A view representing a range of DOM nodes which can be added/removed ad hoc.
  * @public
  */
-export interface SyntheticView<TSource = any, TParent = any, TContext extends ExecutionContext<TParent> = ExecutionContext<TParent>> extends View<TSource, TParent, TContext> {
+export interface SyntheticView<TSource = any, TParent = any> extends View<TSource, TParent> {
     /**
      * The first DOM node in the range of nodes that make up the view.
      */
@@ -64,19 +63,81 @@ export interface SyntheticView<TSource = any, TParent = any, TContext extends Ex
  * The standard View implementation, which also implements ElementView and SyntheticView.
  * @public
  */
-export declare class HTMLView<TSource = any, TParent = any, TContext extends ExecutionContext<TParent> = ExecutionContext<TParent>> implements ElementView<TSource, TParent>, SyntheticView<TSource, TParent, TContext> {
+export declare class HTMLView<TSource = any, TParent = any> implements ElementView<TSource, TParent>, SyntheticView<TSource, TParent>, ExecutionContext<TParent> {
     private fragment;
     private factories;
-    private targets;
+    readonly targets: ViewBehaviorTargets;
     private behaviors;
+    private unbindables;
     /**
      * The data that the view is bound to.
      */
     source: TSource | null;
+    /**
+     * Indicates whether the controller is bound.
+     */
+    isBound: boolean;
+    /**
+     * Indicates how the source's lifetime relates to the controller's lifetime.
+     */
+    readonly sourceLifetime: SourceLifetime;
     /**
      * The execution context the view is running within.
      */
-    context: TContext | null;
+    context: ExecutionContext<TParent>;
+    /**
+     * The index of the current item within a repeat context.
+     */
+    index: number;
+    /**
+     * The length of the current collection within a repeat context.
+     */
+    length: number;
+    /**
+     * The parent data source within a nested context.
+     */
+    readonly parent: TParent;
+    /**
+     * The parent execution context when in nested context scenarios.
+     */
+    readonly parentContext: ExecutionContext<TParent>;
+    /**
+     * The current event within an event handler.
+     */
+    get event(): Event;
+    /**
+     * Indicates whether the current item within a repeat context
+     * has an even index.
+     */
+    get isEven(): boolean;
+    /**
+     * Indicates whether the current item within a repeat context
+     * has an odd index.
+     */
+    get isOdd(): boolean;
+    /**
+     * Indicates whether the current item within a repeat context
+     * is the first item in the collection.
+     */
+    get isFirst(): boolean;
+    /**
+     * Indicates whether the current item within a repeat context
+     * is somewhere in the middle of the collection.
+     */
+    get isInMiddle(): boolean;
+    /**
+     * Indicates whether the current item within a repeat context
+     * is the last item in the collection.
+     */
+    get isLast(): boolean;
+    /**
+     * Returns the typed event detail of a custom event.
+     */
+    eventDetail<TDetail>(): TDetail;
+    /**
+     * Returns the typed event target of the event.
+     */
+    eventTarget<TTarget extends EventTarget>(): TTarget;
     /**
      * The first DOM node in the range of nodes that make up the view.
      */
@@ -111,16 +172,20 @@ export declare class HTMLView<TSource = any, TParent = any, TContext extends Exe
      * Once a view has been disposed, it cannot be inserted or bound again.
      */
     dispose(): void;
+    onUnbind(behavior: {
+        unbind(controller: ViewController<TSource, TParent>): any;
+    }): void;
     /**
      * Binds a view's behaviors to its binding source.
      * @param source - The binding source for the view's binding behaviors.
      * @param context - The execution context to run the behaviors within.
      */
-    bind(source: TSource, context: TContext): void;
+    bind(source: TSource, context?: ExecutionContext<TParent>): void;
     /**
      * Unbinds a view's behaviors from its binding source.
      */
     unbind(): void;
+    private evaluateUnbindables;
     /**
      * Efficiently disposes of a contiguous range of synthetic view instances.
      * @param views - A contiguous range of views to be disposed.

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

@@ -1,10 +1,10 @@
-import type { Binding } from "../observation/observable.js";
+import type { Expression } from "../observation/observable.js";
 import type { CaptureType, SyntheticViewTemplate } from "./template.js";
 /**
  * A directive that enables basic conditional rendering in a template.
- * @param binding - The condition to test for rendering.
+ * @param condition - The condition to test for rendering.
  * @param templateOrTemplateBinding - The template or a binding that gets
  * the template to render when the condition is true.
  * @public
  */
-export declare function when<TSource = any, TReturn = any>(binding: Binding<TSource, TReturn>, templateOrTemplateBinding: SyntheticViewTemplate | Binding<TSource, SyntheticViewTemplate>): CaptureType<TSource>;
+export declare function when<TSource = any, TReturn = any, TParent = any>(condition: Expression<TSource, TReturn, TParent> | boolean, templateOrTemplateBinding: SyntheticViewTemplate<TSource, TParent> | Expression<TSource, SyntheticViewTemplate<TSource, TParent>, TParent>): CaptureType<TSource, TParent>;

package/dist/dts/testing/exports.d.ts

@@ -0,0 +1,3 @@
+export { timeout } from "./timeout.js";
+export * from "./fixture.js";
+export * from "./fakes.js";

package/dist/dts/testing/fakes.d.ts

@@ -0,0 +1,4 @@
+import { ExecutionContext } from "../index.js";
+export declare const Fake: Readonly<{
+    executionContext<TParent = any>(parent?: TParent | undefined, parentContext?: ExecutionContext<TParent> | undefined): ExecutionContext<TParent>;
+}>;

package/dist/dts/testing/fixture.d.ts

@@ -0,0 +1,84 @@
+import type { Constructable } from "../interfaces.js";
+import { ViewTemplate } from "../templating/template.js";
+import type { HTMLView } from "../templating/view.js";
+/**
+ * Options used to customize the creation of the test fixture.
+ * @public
+ */
+export interface FixtureOptions {
+    /**
+     * The document to run the fixture in.
+     * @defaultValue `globalThis.document`
+     */
+    document?: Document;
+    /**
+     * The parent element to append the fixture to.
+     * @defaultValue An instance of `HTMLDivElement`.
+     */
+    parent?: HTMLElement;
+    /**
+     * The data source to bind the HTML to.
+     * @defaultValue An empty object.
+     */
+    source?: any;
+}
+/**
+ * A test fixture.
+ * @public
+ */
+export interface Fixture<TElement = HTMLElement> {
+    /**
+     * The document the fixture is running in.
+     */
+    document: Document;
+    /**
+     * The template the fixture was created from.
+     */
+    template: ViewTemplate;
+    /**
+     * The view that was created from the fixture's template.
+     */
+    view: HTMLView;
+    /**
+     * The parent element that the view was appended to.
+     * @remarks
+     * This element will be appended to the DOM only
+     * after {@link Fixture.connect} has been called.
+     */
+    parent: HTMLElement;
+    /**
+     * The first element in the {@link Fixture.view}.
+     */
+    element: TElement;
+    /**
+     * Adds the {@link Fixture.parent} to the DOM, causing the
+     * connect lifecycle to begin.
+     * @remarks
+     * Yields control to the caller one Microtask later, in order to
+     * ensure that the DOM has settled.
+     */
+    connect: () => Promise<void>;
+    /**
+     * Removes the {@link Fixture.parent} from the DOM, causing the
+     * disconnect lifecycle to begin.
+     * @remarks
+     * Yields control to the caller one Microtask later, in order to
+     * ensure that the DOM has settled.
+     */
+    disconnect: () => Promise<void>;
+}
+/**
+ * Creates a random, unique name suitable for use as a Custom Element name.
+ * @public
+ */
+export declare function uniqueElementName(prefix?: string): string;
+/**
+ * Creates a test fixture suitable for testing custom elements, templates, and bindings.
+ * @param templateNameOrType An HTML template or single element name to create the fixture for.
+ * @param options Enables customizing fixture creation behavior.
+ * @remarks
+ * Yields control to the caller one Microtask later, in order to
+ * ensure that the DOM has settled.
+ * @public
+ */
+export declare function fixture<TElement = HTMLElement>(templateNameOrType: ViewTemplate | string | Constructable<TElement>, options?: FixtureOptions): Promise<Fixture<TElement>>;

package/dist/dts/testing/timeout.d.ts

@@ -0,0 +1,7 @@
+/**
+ * A timeout helper for use in tests.
+ * @param timeout The length of the timeout.
+ * @returns A promise that resolves once the configured time has elapsed.
+ * @public
+ */
+export declare function timeout(timeout?: number): Promise<void>;

package/dist/dts/utilities.d.ts

@@ -1,21 +1,3 @@
-import { Disposable } from "./interfaces.js";
-import type { Subscriber } from "./observation/notifier.js";
-/**
- * Converts a plain object to an observable object.
- * @param object - The object to make observable.
- * @param deep - Indicates whether or not to deeply convert the oject.
- * @returns The converted object.
- * @beta
- */
-export declare function makeObservable<T>(object: T, deep?: boolean): T;
-/**
- * Deeply subscribes to changes in existing observable objects.
- * @param object - The observable object to watch.
- * @param subscriber - The handler to call when changes are made to the object.
- * @returns A disposable that can be used to unsubscribe from change updates.
- * @beta
- */
-export declare function watch(object: any, subscriber: Subscriber | ((subject: any, args: any) => void)): Disposable;
 /**
  * Retrieves the "composed parent" element of a node, ignoring DOM tree boundaries.
  * When the parent of a node is a shadow-root, it will return the host

package/dist/esm/components/attributes.js

@@ -2,8 +2,19 @@ import { Observable } from "../observation/observable.js";
 import { isString } from "../interfaces.js";
 import { Updates } from "../observation/update-queue.js";
 import { DOM } from "../templating/dom.js";
+import { createMetadataLocator } from "../platform.js";
 const booleanMode = "boolean";
 const reflectMode = "reflect";
+/**
+ * Metadata used to configure a custom attribute's behavior.
+ * @public
+ */
+export const AttributeConfiguration = Object.freeze({
+    /**
+     * Locates all attribute configurations associated with a type.
+     */
+    locate: createMetadataLocator(),
+});
 /**
  * A {@link ValueConverter} that converts to and from `boolean` values.
  * @remarks
@@ -141,7 +152,7 @@ export class AttributeDefinition {
      */
     static collect(Owner, ...attributeLists) {
         const attributes = [];
-        attributeLists.push(Owner.attributes);
+        attributeLists.push(AttributeConfiguration.locate(Owner));
         for (let i = 0, ii = attributeLists.length; i < ii; ++i) {
             const list = attributeLists[i];
             if (list === void 0) {
@@ -171,9 +182,7 @@ export function attr(configOrTarget, prop) {
             // - @attr({...opts})
             config.property = $prop;
         }
-        const attributes = $target.constructor.attributes ||
-            ($target.constructor.attributes = []);
-        attributes.push(config);
+        AttributeConfiguration.locate($target.constructor).push(config);
     }
     if (arguments.length > 1) {
         // Non invocation: