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

package/dist/di/di.api.json

@@ -1,7 +1,7 @@
 {
   "metadata": {
     "toolPackage": "@microsoft/api-extractor",
-    "toolVersion": "7.57.7",
+    "toolVersion": "7.58.1",
     "schemaVersion": 1011,
     "oldestForwardsCompatibleVersion": 1001,
     "tsdocConfig": {
@@ -2223,7 +2223,7 @@
             {
               "kind": "PropertySignature",
               "canonicalReference": "@microsoft/fast-element!InterfaceConfiguration#respectConnection:member",
-              "docComment": "/**\n * When true, the dependency will be re-resolved when FASTElement connection changes. If the resolved value changes due to connection change, a {@link @microsoft/fast-element#Observable | notification} will be emitted for the property, with the previous and next values provided to any subscriber.\n */\n",
+              "docComment": "/**\n * When true, the dependency will be re-resolved when FASTElement connection changes. If the resolved value changes due to connection change, an observable notification will be emitted for the property, with the previous and next values provided to any subscriber.\n */\n",
               "excerptTokens": [
                 {
                   "kind": "Content",

package/dist/dts/array-observer.d.ts

@@ -0,0 +1,2 @@
+export { ArrayObserver, type LengthObserver, Sort, type SortObserver, Splice, SpliceStrategy, SpliceStrategySupport, } from "./observation/arrays.js";
+export type { Notifier, Subscriber, SubscriberSet } from "./observation/notifier.js";

package/dist/dts/arrays.d.ts

@@ -0,0 +1,2 @@
+export { type ArrayObserver, type LengthObserver, lengthOf, Sort, type SortObserver, Splice, SpliceStrategy, SpliceStrategySupport, sortedCount, } from "./observation/arrays.js";
+export type { Notifier, Subscriber, SubscriberSet } from "./observation/notifier.js";

package/dist/dts/attr.d.ts

@@ -0,0 +1 @@
+export { AttributeConfiguration, AttributeDefinition, type AttributeMode, attr, booleanConverter, type DecoratorAttributeConfiguration, nullableBooleanConverter, nullableNumberConverter, type ValueConverter, } from "./components/attributes.js";

package/dist/dts/binding/signal.d.ts

@@ -1,6 +1,6 @@
-import type { Expression } from "../observation/observable.js";
-import type { Subscriber } from "../observation/notifier.js";
 import type { DOMPolicy } from "../dom.js";
+import type { Subscriber } from "../observation/notifier.js";
+import type { Expression } from "../observation/observable.js";
 import { Binding } from "./binding.js";
 /**
  * The gateway to signal APIs.
@@ -9,14 +9,14 @@ import { Binding } from "./binding.js";
 export declare const Signal: Readonly<{
     /**
      * Subscribes to a signal.
-     * @param signal The signal to subscribe to.
-     * @param subscriber The subscriber.
+     * @param signal - The signal to subscribe to.
+     * @param subscriber - The subscriber.
      */
     subscribe(signal: string, subscriber: Subscriber): void;
     /**
      * Unsubscribes from the signal.
-     * @param signal The signal to unsubscribe from.
-     * @param subscriber The subscriber.
+     * @param signal - The signal to unsubscribe from.
+     * @param subscriber - The subscriber.
      */
     unsubscribe(signal: string, subscriber: Subscriber): void;
     /**

package/dist/dts/binding/two-way.d.ts

@@ -23,6 +23,7 @@ export interface TwoWaySettings {
 }
 /**
  * Enables configuring two-way binding settings.
+ * @public
  */
 export declare const TwoWaySettings: Readonly<{
     /**

package/dist/dts/binding.d.ts

@@ -0,0 +1,7 @@
+export { Binding, type BindingDirective } from "./binding/binding.js";
+export { normalizeBinding } from "./binding/normalize.js";
+export { oneTime } from "./binding/one-time.js";
+export { listener, oneWay } from "./binding/one-way.js";
+export type { DOMAspect, DOMPolicy } from "./dom.js";
+export type { Subscriber } from "./observation/notifier.js";
+export type { Expression, ExpressionObserver } from "./observation/observable.js";

package/dist/dts/components/attributes.d.ts

@@ -16,8 +16,6 @@ export interface ValueConverter {
      */
     fromView(value: any): any;
 }
-declare const booleanMode = "boolean";
-declare const reflectMode = "reflect";
 /**
  * The mode that specifies the runtime behavior of the attribute.
  * @remarks
@@ -29,7 +27,7 @@ declare const reflectMode = "reflect";
  * changes in the DOM, but does not reflect property changes back.
  * @public
  */
-export type AttributeMode = typeof reflectMode | typeof booleanMode | "fromView";
+export type AttributeMode = "reflect" | "boolean" | "fromView";
 /**
  * Metadata used to configure a custom attribute's behavior.
  * @public
@@ -77,7 +75,7 @@ export declare const nullableBooleanConverter: ValueConverter;
  */
 export declare const nullableNumberConverter: ValueConverter;
 /**
- * An implementation of {@link Accessor} that supports reactivity,
+ * An implementation of `Accessor` that supports reactivity,
  * change callbacks, attribute reflection, and type conversion for
  * custom elements.
  * @public
@@ -153,4 +151,3 @@ export declare function attr(config?: DecoratorAttributeConfiguration): (target:
  * @public
  */
 export declare function attr(target: {}, prop: string): void;
-export {};

package/dist/dts/components/definition-schema-transforms.d.ts

@@ -0,0 +1,9 @@
+import type { FASTElementDefinition } from "../components/fast-definitions.js";
+import type { Schema } from "./schema.js";
+export interface DeclarativeSchemaTransformContext {
+    definition: FASTElementDefinition;
+    schema: Schema;
+}
+export type DeclarativeSchemaTransform = (context: DeclarativeSchemaTransformContext) => void;
+export declare function setDefinitionSchemaTransform(definition: FASTElementDefinition, key: string, transform: DeclarativeSchemaTransform, priority: number): void;
+export declare function getDefinitionSchemaTransforms(definition?: FASTElementDefinition): readonly DeclarativeSchemaTransform[];

package/dist/dts/components/element-controller.d.ts

@@ -1,4 +1,4 @@
-import { PropertyChangeNotifier } from "../observation/notifier.js";
+import type { Notifier, Subscriber } from "../observation/notifier.js";
 import { ExecutionContext, type ExpressionController, SourceLifetime } from "../observation/observable.js";
 import { ElementStyles } from "../styles/element-styles.js";
 import type { HostBehavior, HostController } from "../styles/host.js";
@@ -6,10 +6,6 @@ import type { StyleStrategy, StyleTarget } from "../styles/style-strategy.js";
 import type { ElementViewTemplate } from "../templating/template.js";
 import type { ElementView } from "../templating/view.js";
 import { FASTElementDefinition, type ShadowRootOptions } from "./fast-definitions.js";
-/**
- * @deprecated Use the export from ./hydration.js instead.
- */
-export { deferHydrationAttribute } from "./hydration.js";
 /**
  * A type that instantiates an ElementController
  * @public
@@ -35,7 +31,11 @@ export declare const enum Stages {
  * Controls the lifecycle and rendering of a `FASTElement`.
  * @public
  */
-export declare class ElementController<TElement extends HTMLElement = HTMLElement> extends PropertyChangeNotifier implements HostController<TElement> {
+export declare class ElementController<TElement extends HTMLElement = HTMLElement> implements Notifier, HostController<TElement> {
+    /**
+     * Internal notifier used to delegate subscriber management.
+     */
+    private _notifier;
     /**
      * A map of observable properties that were set on the element before upgrade.
      */
@@ -48,6 +48,26 @@ export declare class ElementController<TElement extends HTMLElement = HTMLElemen
      * Indicates whether the element has an existing shadow root (e.g. from declarative shadow DOM).
      */
     protected hasExistingShadowRoot: boolean;
+    /**
+     * Resolves the isPrerendered promise.
+     */
+    private _resolvePrerendered;
+    /**
+     * Resolves the isHydrated promise.
+     */
+    private _resolveHydrated;
+    /**
+     * Resolves `true` when the element had an existing shadow root
+     * (from SSR or declarative shadow DOM) at connect time, `false`
+     * otherwise.
+     */
+    readonly isPrerendered: Promise<boolean>;
+    /**
+     * Resolves `true` after prerendered content has been successfully
+     * hydrated, or `false` when the component is client-side rendered
+     * or hydration is not enabled.
+     */
+    readonly isHydrated: Promise<boolean>;
     /**
      * The template used to render the component.
      */
@@ -147,6 +167,27 @@ export declare class ElementController<TElement extends HTMLElement = HTMLElemen
      * @internal
      */
     constructor(element: TElement, definition: FASTElementDefinition);
+    /**
+     * The subject that subscribers will receive notifications for.
+     */
+    get subject(): TElement;
+    /**
+     * Notifies all subscribers of a property change.
+     * @param args - The property name that changed.
+     */
+    notify(args: any): void;
+    /**
+     * Subscribes to notification of changes in the element's state.
+     * @param subscriber - The object that is subscribing for change notification.
+     * @param propertyToWatch - The name of the property to watch for changes.
+     */
+    subscribe(subscriber: Subscriber, propertyToWatch?: any): void;
+    /**
+     * Unsubscribes from notification of changes in the element's state.
+     * @param subscriber - The object that is unsubscribing from change notification.
+     * @param propertyToUnwatch - The name of the property to unsubscribe from.
+     */
+    unsubscribe(subscriber: Subscriber, propertyToUnwatch?: any): void;
     /**
      * Registers an unbind handler with the controller.
      * @param behavior - An object to call when the controller unbinds.
@@ -183,6 +224,22 @@ export declare class ElementController<TElement extends HTMLElement = HTMLElemen
      * Binds any observables that were set before upgrade.
      */
     protected bindObservables(): void;
+    /**
+     * Captures own-properties that shadow observable accessors on the prototype so
+     * they can be rebound through the accessor before rendering.
+     */
+    protected captureBoundObservables(): void;
+    /**
+     * Synchronizes late-defined attribute-map attributes from the live DOM to the
+     * associated property values before the initial render occurs.
+     */
+    protected syncLateAttributes(): void;
+    /**
+     * Observes late-defined attribute-map attributes that the platform does not
+     * surface through attributeChangedCallback because they were added after
+     * customElements.define() completed.
+     */
+    protected observeLateAttributes(): void;
     /**
      * Connects any existing behaviors on the associated element.
      */
@@ -219,6 +276,11 @@ export declare class ElementController<TElement extends HTMLElement = HTMLElemen
      * If `null` is provided, any existing view will be removed.
      */
     protected renderTemplate(template: ElementViewTemplate | null | undefined): void;
+    /**
+     * Standard client-side render: clears any stale content, clones the
+     * compiled fragment, binds, and appends to the host.
+     */
+    private renderClientSide;
     /**
      * Locates or creates a controller for the specified element.
      * @param element - The element to return the controller for.
@@ -235,6 +297,18 @@ export declare class ElementController<TElement extends HTMLElement = HTMLElemen
      * @param strategy - The strategy to use.
      */
     static setStrategy(strategy: ElementControllerStrategy): void;
+    /**
+     * A hook that, when set, handles prerendered content hydration.
+     * Called by renderTemplate when an existing shadow root is detected.
+     * Returns true if hydration was performed, false to fall back to client-side.
+     * @internal
+     */
+    private static hydrationHook;
+    /**
+     * Installs the hydration hook. Called by enableHydration().
+     * @internal
+     */
+    static installHydrationHook(hook: (controller: ElementController, template: ElementViewTemplate, element: HTMLElement, host: Node) => boolean): void;
 }
 /**
  * https://wicg.github.io/construct-stylesheets/
@@ -260,111 +334,3 @@ export declare class StyleElementStrategy implements StyleStrategy {
     addStylesTo(target: StyleTarget): void;
     removeStylesFrom(target: StyleTarget): void;
 }
-/**
- * The attribute used to indicate that an element needs hydration.
- * @public
- */
-export declare const needsHydrationAttribute = "needs-hydration";
-/**
- * Lifecycle callbacks for element hydration events
- * @public
- */
-export interface HydrationControllerCallbacks<TElement extends HTMLElement = HTMLElement> {
-    /**
-     * Called once when the first element enters the hydration pipeline.
-     * This is the earliest point at which we know a component has been
-     * async-defined with `defer-and-hydrate`, a template is pending via
-     * `<f-template>`, and the element has `needs-hydration`.
-     */
-    hydrationStarted?(): void;
-    /**
-     * Called before an individual element's hydration begins
-     */
-    elementWillHydrate?(source: TElement): void;
-    /**
-     * Called after an individual element's hydration has finished
-     */
-    elementDidHydrate?(source: TElement): void;
-    /**
-     * Called after all elements have completed hydration
-     */
-    hydrationComplete?(): void;
-}
-/**
- * An ElementController capable of hydrating FAST elements from
- * Declarative Shadow DOM.
- *
- * @beta
- */
-export declare class HydratableElementController<TElement extends HTMLElement = HTMLElement> extends ElementController<TElement> {
-    /**
-     * Controls whether the controller will hydrate during the connect() method.
-     * Initialized during the first connect() call to true when the `needs-hydration`
-     * attribute is present on the element.
-     */
-    protected needsHydration?: boolean;
-    private static hydrationObserver;
-    /**
-     * {@inheritdoc ElementController.shadowOptions}
-     */
-    get shadowOptions(): ShadowRootOptions | undefined;
-    set shadowOptions(value: ShadowRootOptions | undefined);
-    /**
-     * Lifecycle callbacks for hydration events
-     */
-    static lifecycleCallbacks: HydrationControllerCallbacks;
-    /**
-     * Whether the hydrationStarted callback has already been invoked.
-     */
-    private static hydrationStarted;
-    /**
-     * An idle callback ID used to track hydration completion
-     */
-    private static idleCallbackId;
-    /**
-     * Adds the current element instance to the hydrating instances map
-     */
-    private addHydratingInstance;
-    /**
-     * Configure lifecycle callbacks for hydration events
-     */
-    static config(callbacks: HydrationControllerCallbacks): typeof HydratableElementController;
-    private static hydrationObserverHandler;
-    /**
-     * Checks to see if hydration is complete and if so, invokes the hydrationComplete callback.
-     * Then resets the ElementController strategy to the default so that future elements
-     * don't use the HydratableElementController.
-     *
-     * @param deadline - the idle deadline object
-     */
-    private static checkHydrationComplete;
-    /**
-     * Runs connected lifecycle behavior on the associated element.
-     */
-    connect(): void;
-    /**
-     * A map of element instances by the name of the custom element they are
-     * associated with. The key is the custom element name, and the value is the
-     * instances of hydratable elements which currently need to be hydrated.
-     *
-     * When all of the instances in the set have been hydrated, the set is
-     * cleared and removed from the map. If the map is empty, the
-     * hydrationComplete callback is invoked.
-     */
-    private static hydratingInstances?;
-    /**
-     * Removes the current element instance from the hydrating instances map
-     */
-    private removeHydratingInstance;
-    /**
-     * Unregisters the hydration observer when the element is disconnected.
-     */
-    disconnect(): void;
-    /**
-     * Sets the ElementController strategy to HydratableElementController.
-     * @remarks
-     * This method is typically called during application startup to enable
-     * hydration support for FAST elements.
-     */
-    static install(): void;
-}

package/dist/dts/components/element-hydration.d.ts

@@ -1,2 +1,2 @@
-export { HydratableElementController } from "./element-controller.js";
+export { ElementController } from "./element-controller.js";
 export * from "./hydration.js";

package/dist/dts/components/enable-hydration.d.ts

@@ -0,0 +1,34 @@
+import { type HydrationOptions } from "./hydration-tracker.js";
+export type { HydrationOptions };
+/**
+ * Enables hydration support for prerendered FAST elements.
+ *
+ * @remarks
+ * Call this before any FAST elements connect to the DOM. Hydration
+ * logic is not active unless this function is called, keeping
+ * `FASTElement` lightweight for client-side-only applications.
+ *
+ * Safe to call multiple times — the hydration hook is installed once
+ * and subsequent calls merge their options into the shared tracker.
+ *
+ * @example
+ * ```ts
+ * import { enableHydration } from "@microsoft/fast-element/hydration.js";
+ *
+ * enableHydration({
+ *     hydrationComplete() {
+ *         console.log("hydration complete");
+ *     },
+ * });
+ * ```
+ *
+ * @param options - Optional callbacks for global hydration events.
+ * @public
+ */
+export declare function enableHydration(options?: HydrationOptions): void;
+/**
+ * The attribute used to defer hydration of an element.
+ * Retained for intersection observer viewport hydration rendering.
+ * @beta
+ */
+export declare const deferHydrationAttribute = "defer-hydration";

package/dist/dts/components/fast-definitions.d.ts

@@ -2,7 +2,8 @@ import { type Constructable } from "../interfaces.js";
 import { type TypeRegistry } from "../platform.js";
 import { type ComposableStyles, ElementStyles } from "../styles/element-styles.js";
 import type { ElementViewTemplate } from "../templating/template.js";
-import { AttributeConfiguration, AttributeDefinition } from "./attributes.js";
+import { type AttributeConfiguration, AttributeDefinition } from "./attributes.js";
+import type { Schema } from "./schema.js";
 /**
  * The FAST custom element registry
  * @internal
@@ -21,50 +22,99 @@ export interface ShadowRootOptions extends ShadowRootInit {
      */
     registry?: CustomElementRegistry;
 }
-/**
- * Values for the `templateOptions` property.
- * @alpha
- */
-export declare const TemplateOptions: {
-    readonly deferAndHydrate: "defer-and-hydrate";
-};
-/**
- * Type for the `TemplateOptions` const enum.
- * @alpha
- */
-export type TemplateOptions = (typeof TemplateOptions)[keyof typeof TemplateOptions];
 /**
  * Lifecycle callbacks for template events.
  * @public
  */
 export interface TemplateLifecycleCallbacks {
     /**
-     * Called after the template has been assigned to the definition
+     * Called after the JS class definition has been registered.
+     */
+    elementDidRegister?(name: string): void;
+    /**
+     * Called before the template has been evaluated and assigned.
+     */
+    templateWillUpdate?(name: string): void;
+    /**
+     * Called after the template has been assigned to the definition.
      */
     templateDidUpdate?(name: string): void;
     /**
-     * Called after the custom element has been defined
+     * Called after the custom element has been defined.
      */
     elementDidDefine?(name: string): void;
+    /**
+     * Called before an individual element's hydration begins.
+     */
+    elementWillHydrate?(source: HTMLElement): void;
+    /**
+     * Called after an individual element's hydration has finished.
+     */
+    elementDidHydrate?(source: HTMLElement): void;
 }
+/**
+ * A callback that receives a FASTElementDefinition during element registration.
+ * Extensions are invoked before the element is registered with the platform,
+ * allowing plugins to inspect or act on the resolved definition.
+ * @public
+ */
+export type FASTElementExtension = (definition: FASTElementDefinition) => void;
+/**
+ * Resolves an element template from a composed definition.
+ * @public
+ */
+export type FASTElementTemplateResolver<TType extends Constructable<HTMLElement> = Constructable<HTMLElement>> = (definition: FASTElementDefinition<TType>) => ElementViewTemplate<InstanceType<TType>> | Promise<ElementViewTemplate<InstanceType<TType>>>;
+/**
+ * Applies extension callbacks to a FAST element definition.
+ * @internal
+ */
+export declare function applyFASTElementExtensions(definition: FASTElementDefinition, registry?: CustomElementRegistry, extensions?: FASTElementExtension[]): void;
+/**
+ * Tracks attribute definitions that were added after the element was already
+ * registered with the platform and therefore are not covered by the browser's
+ * static observedAttributes snapshot.
+ * @internal
+ */
+export declare function trackLateAttributeDefinition(definition: FASTElementDefinition, attribute: AttributeDefinition): void;
+/**
+ * Gets the attribute definitions that were added after platform registration.
+ * @internal
+ */
+export declare function getLateAttributeLookup(definition: FASTElementDefinition): Readonly<Record<string, AttributeDefinition>> | null;
+/**
+ * Resolves the concrete template for a FAST element definition when the
+ * definition was composed with a template resolver.
+ * @internal
+ */
+export declare function resolveFASTElementTemplate<TType extends Constructable<HTMLElement> = Constructable<HTMLElement>>(definition: FASTElementDefinition<TType>): ElementViewTemplate<InstanceType<TType>> | Promise<ElementViewTemplate<InstanceType<TType>> | undefined> | undefined;
+/**
+ * Indicates whether a definition still has a pending template resolver.
+ * @internal
+ */
+export declare function hasFASTElementTemplateResolver<TType extends Constructable<HTMLElement> = Constructable<HTMLElement>>(definition: FASTElementDefinition<TType>): boolean;
+/**
+ * Gets any pending template resolution error for a FAST element definition.
+ * @internal
+ */
+export declare function getFASTElementTemplateError<TType extends Constructable<HTMLElement> = Constructable<HTMLElement>>(definition: FASTElementDefinition<TType>): unknown;
+/**
+ * Sets or clears the template resolution error for a FAST element definition.
+ * @internal
+ */
+export declare function setFASTElementTemplateError<TType extends Constructable<HTMLElement> = Constructable<HTMLElement>>(definition: FASTElementDefinition<TType>, error?: unknown): void;
 /**
  * Represents metadata configuration for a custom element.
  * @public
  */
-export interface PartialFASTElementDefinition {
+export interface PartialFASTElementDefinition<TType extends Constructable<HTMLElement> = Constructable<HTMLElement>> {
     /**
      * The name of the custom element.
      */
     readonly name: string;
     /**
-     * The template to render for the custom element.
-     */
-    readonly template?: ElementViewTemplate;
-    /**
-     * Options controlling how the template will be created.
-     * @alpha
+     * The template, or template resolver, for the custom element.
      */
-    readonly templateOptions?: TemplateOptions;
+    readonly template?: ElementViewTemplate<InstanceType<TType>> | FASTElementTemplateResolver<TType>;
     /**
      * The styles to associate with the custom element.
      */
@@ -94,6 +144,12 @@ export interface PartialFASTElementDefinition {
      * Lifecycle callbacks for template events.
      */
     readonly lifecycleCallbacks?: TemplateLifecycleCallbacks;
+    /**
+     * The optional schema associated with the custom element definition.
+     * Declarative templates assign this automatically during template resolution.
+     * Non-declarative callers can provide one for schema-driven extensions.
+     */
+    readonly schema?: Schema;
 }
 /**
  * Defines metadata for a FASTElement.
@@ -128,12 +184,7 @@ export declare class FASTElementDefinition<TType extends Constructable<HTMLEleme
     /**
      * The template to render for the custom element.
      */
-    template?: ElementViewTemplate;
-    /**
-     * The template options.
-     * @alpha
-     */
-    templateOptions?: TemplateOptions;
+    template?: ElementViewTemplate<InstanceType<TType>>;
     /**
      * The styles to associate with the custom element.
      */
@@ -154,6 +205,12 @@ export declare class FASTElementDefinition<TType extends Constructable<HTMLEleme
      * Lifecycle callbacks for template events.
      */
     readonly lifecycleCallbacks?: TemplateLifecycleCallbacks;
+    /**
+     * The optional schema associated with the custom element definition.
+     * Declarative templates assign this automatically during template resolution.
+     * Non-declarative callers can provide one for schema-driven extensions.
+     */
+    schema?: Schema;
     /**
      * The definition has been registered to the FAST element registry.
      */
@@ -162,17 +219,19 @@ export declare class FASTElementDefinition<TType extends Constructable<HTMLEleme
     /**
      * Defines a custom element based on this definition.
      * @param registry - The element registry to define the element in.
+     * @param extensions - An optional array of extension callbacks to invoke
+     * with this definition before platform registration.
      * @remarks
      * This operation is idempotent per registry.
      */
-    define(registry?: CustomElementRegistry): this;
+    define(registry?: CustomElementRegistry, extensions?: FASTElementExtension[]): this;
     /**
      * Creates an instance of FASTElementDefinition.
      * @param type - The type this definition is being created for.
      * @param nameOrDef - The name of the element to define or a config object
      * that describes the element to define.
      */
-    static compose<TType extends Constructable<HTMLElement> = Constructable<HTMLElement>>(type: TType, nameOrDef?: string | PartialFASTElementDefinition): FASTElementDefinition<TType>;
+    static compose<TType extends Constructable<HTMLElement> = Constructable<HTMLElement>>(type: TType, nameOrDef?: string | PartialFASTElementDefinition<TType>): Promise<FASTElementDefinition<TType>>;
     /**
      * Registers a FASTElement base type.
      * @param type - The type to register as a base type.
@@ -194,15 +253,5 @@ export declare class FASTElementDefinition<TType extends Constructable<HTMLEleme
      * @param name - The name of the defined custom element.
      * @alpha
      */
-    static registerAsync: (name: string) => Promise<Function>;
-    /**
-     * Creates an instance of FASTElementDefinition asynchronously. This option assumes
-     * that a template and shadowOptions will be provided and completes when those requirements
-     * are met.
-     * @param type - The type this definition is being created for.
-     * @param nameOrDef - The name of the element to define or a config object
-     * that describes the element to define.
-     * @alpha
-     */
-    static composeAsync<TType extends Constructable<HTMLElement> = Constructable<HTMLElement>>(type: TType, nameOrDef?: string | PartialFASTElementDefinition): Promise<FASTElementDefinition<TType>>;
+    static register: (name: string, registry?: CustomElementRegistry) => Promise<Function>;
 }

package/dist/dts/components/fast-element.d.ts

@@ -1,6 +1,6 @@
 import { type Constructable } from "../interfaces.js";
 import { ElementController } from "./element-controller.js";
-import { FASTElementDefinition, type PartialFASTElementDefinition } from "./fast-definitions.js";
+import { FASTElementDefinition, type FASTElementExtension, type PartialFASTElementDefinition } from "./fast-definitions.js";
 /**
  * Represents a custom element based on the FASTElement infrastructure.
  * @public
@@ -45,12 +45,10 @@ export interface FASTElement extends HTMLElement {
      */
     attributeChangedCallback(name: string, oldValue: string | null, newValue: string | null): void;
 }
-declare function compose<TType extends Constructable<HTMLElement> = Constructable<HTMLElement>>(this: TType, nameOrDef: string | PartialFASTElementDefinition): FASTElementDefinition<TType>;
-declare function compose<TType extends Constructable<HTMLElement> = Constructable<HTMLElement>>(type: TType, nameOrDef?: string | PartialFASTElementDefinition): FASTElementDefinition<TType>;
-declare function defineAsync<TType extends Constructable<HTMLElement> = Constructable<HTMLElement>>(this: TType, nameOrDef: string | PartialFASTElementDefinition): Promise<FASTElementDefinition<TType>>;
-declare function defineAsync<TType extends Constructable<HTMLElement> = Constructable<HTMLElement>>(type: TType, nameOrDef?: string | PartialFASTElementDefinition): Promise<FASTElementDefinition<TType>>;
-declare function define<TType extends Constructable<HTMLElement> = Constructable<HTMLElement>>(this: TType, nameOrDef: string | PartialFASTElementDefinition): TType;
-declare function define<TType extends Constructable<HTMLElement> = Constructable<HTMLElement>>(type: TType, nameOrDef?: string | PartialFASTElementDefinition): TType;
+declare function compose<TType extends Constructable<HTMLElement> = Constructable<HTMLElement>>(this: TType, nameOrDef: string | PartialFASTElementDefinition<TType>): Promise<FASTElementDefinition<TType>>;
+declare function compose<TType extends Constructable<HTMLElement> = Constructable<HTMLElement>>(type: TType, nameOrDef?: string | PartialFASTElementDefinition<TType>): Promise<FASTElementDefinition<TType>>;
+declare function define<TType extends Constructable<HTMLElement> = Constructable<HTMLElement>>(this: TType, nameOrDef: string | PartialFASTElementDefinition<TType>, extensions?: FASTElementExtension[]): Promise<TType>;
+declare function define<TType extends Constructable<HTMLElement> = Constructable<HTMLElement>>(type: TType, nameOrDef?: string | PartialFASTElementDefinition<TType>, extensions?: FASTElementExtension[]): Promise<TType>;
 declare function from<TBase extends typeof HTMLElement>(BaseType: TBase): new () => InstanceType<TBase> & FASTElement;
 /**
  * A minimal base class for FASTElements that also provides
@@ -61,7 +59,6 @@ export declare const FASTElement: {
     new (): FASTElement;
     define: typeof define;
     compose: typeof compose;
-    defineAsync: typeof defineAsync;
     from: typeof from;
 };
 /**