@microsoft/fast-element 2.9.1 → 2.9.2

package/dist/fast-element.api.json

@@ -330,7 +330,7 @@
           "excerptTokens": [
             {
               "kind": "Content",
-              "text": "export declare type AddBehavior = "
+              "text": "export type AddBehavior = "
             },
             {
               "kind": "Content",
@@ -374,7 +374,7 @@
           "excerptTokens": [
             {
               "kind": "Content",
-              "text": "export declare type AddViewBehaviorFactory = "
+              "text": "export type AddViewBehaviorFactory = "
             },
             {
               "kind": "Content",
@@ -957,7 +957,7 @@
           "excerptTokens": [
             {
               "kind": "Content",
-              "text": "export declare type AttributeConfiguration = "
+              "text": "export type AttributeConfiguration = "
             },
             {
               "kind": "Content",
@@ -1437,7 +1437,7 @@
           "excerptTokens": [
             {
               "kind": "Content",
-              "text": "export declare type AttributeMode = "
+              "text": "export type AttributeMode = "
             },
             {
               "kind": "Content",
@@ -1959,7 +1959,7 @@
           "excerptTokens": [
             {
               "kind": "Content",
-              "text": "export declare type Callable = "
+              "text": "export type Callable = "
             },
             {
               "kind": "Content",
@@ -2444,7 +2444,7 @@
           "excerptTokens": [
             {
               "kind": "Content",
-              "text": "export declare type ChildrenDirectiveOptions<T = "
+              "text": "export type ChildrenDirectiveOptions<T = "
             },
             {
               "kind": "Content",
@@ -2505,7 +2505,7 @@
           "excerptTokens": [
             {
               "kind": "Content",
-              "text": "export declare type Class<T, C = "
+              "text": "export type Class<T, C = "
             },
             {
               "kind": "Content",
@@ -2572,7 +2572,7 @@
           "excerptTokens": [
             {
               "kind": "Content",
-              "text": "export declare type CompilationStrategy = "
+              "text": "export type CompilationStrategy = "
             },
             {
               "kind": "Content",
@@ -2639,7 +2639,7 @@
           "excerptTokens": [
             {
               "kind": "Content",
-              "text": "export declare type CompiledViewBehaviorFactory = "
+              "text": "export type CompiledViewBehaviorFactory = "
             },
             {
               "kind": "Reference",
@@ -2783,7 +2783,7 @@
           "excerptTokens": [
             {
               "kind": "Content",
-              "text": "export declare type ComposableStyles = "
+              "text": "export type ComposableStyles = "
             },
             {
               "kind": "Content",
@@ -2823,7 +2823,7 @@
           "excerptTokens": [
             {
               "kind": "Content",
-              "text": "export declare type Constructable<T = "
+              "text": "export type Constructable<T = "
             },
             {
               "kind": "Content",
@@ -2870,7 +2870,7 @@
           "excerptTokens": [
             {
               "kind": "Content",
-              "text": "export declare type ConstructibleStyleStrategy = "
+              "text": "export type ConstructibleStyleStrategy = "
             },
             {
               "kind": "Content",
@@ -4016,7 +4016,7 @@
           "excerptTokens": [
             {
               "kind": "Content",
-              "text": "export declare type CSSTemplateTag = "
+              "text": "export type CSSTemplateTag = "
             },
             {
               "kind": "Content",
@@ -4096,7 +4096,7 @@
           "excerptTokens": [
             {
               "kind": "Content",
-              "text": "export declare type CSSValue<TSource, TParent = "
+              "text": "export type CSSValue<TSource, TParent = "
             },
             {
               "kind": "Content",
@@ -4250,7 +4250,7 @@
           "excerptTokens": [
             {
               "kind": "Content",
-              "text": "export declare type DecoratorAttributeConfiguration = "
+              "text": "export type DecoratorAttributeConfiguration = "
             },
             {
               "kind": "Reference",
@@ -4427,7 +4427,7 @@
           "excerptTokens": [
             {
               "kind": "Content",
-              "text": "export declare type DOMAspect = "
+              "text": "export type DOMAspect = "
             },
             {
               "kind": "Content",
@@ -4667,7 +4667,7 @@
           "excerptTokens": [
             {
               "kind": "Content",
-              "text": "export declare type DOMSink = "
+              "text": "export type DOMSink = "
             },
             {
               "kind": "Content",
@@ -6194,7 +6194,7 @@
           "excerptTokens": [
             {
               "kind": "Content",
-              "text": "export declare type ElementsFilter = "
+              "text": "export type ElementsFilter = "
             },
             {
               "kind": "Content",
@@ -7569,7 +7569,7 @@
           "excerptTokens": [
             {
               "kind": "Content",
-              "text": "export declare type Expression<TSource = "
+              "text": "export type Expression<TSource = "
             },
             {
               "kind": "Content",
@@ -11512,7 +11512,7 @@
           "excerptTokens": [
             {
               "kind": "Content",
-              "text": "export declare type HTMLTemplateTag = "
+              "text": "export type HTMLTemplateTag = "
             },
             {
               "kind": "Content",
@@ -18698,7 +18698,7 @@
           "excerptTokens": [
             {
               "kind": "Content",
-              "text": "export declare type SourceLifetime = "
+              "text": "export type SourceLifetime = "
             },
             {
               "kind": "Content",
@@ -19897,7 +19897,7 @@
           "excerptTokens": [
             {
               "kind": "Content",
-              "text": "export declare type SpliceStrategySupport = "
+              "text": "export type SpliceStrategySupport = "
             },
             {
               "kind": "Content",
@@ -21655,7 +21655,7 @@
           "excerptTokens": [
             {
               "kind": "Content",
-              "text": "export declare type TemplateOptions = "
+              "text": "export type TemplateOptions = "
             },
             {
               "kind": "Content",
@@ -21722,7 +21722,7 @@
           "excerptTokens": [
             {
               "kind": "Content",
-              "text": "export declare type TemplateValue<TSource, TParent = "
+              "text": "export type TemplateValue<TSource, TParent = "
             },
             {
               "kind": "Content",
@@ -21812,7 +21812,7 @@
           "excerptTokens": [
             {
               "kind": "Content",
-              "text": "export declare type TrustedTypesPolicy = "
+              "text": "export type TrustedTypesPolicy = "
             },
             {
               "kind": "Content",
@@ -22656,7 +22656,7 @@
           "excerptTokens": [
             {
               "kind": "Content",
-              "text": "export declare type ViewBehaviorTargets = "
+              "text": "export type ViewBehaviorTargets = "
             },
             {
               "kind": "Content",

package/dist/fast-element.d.ts

@@ -431,7 +431,7 @@ export declare const DI: Readonly<{
      *
      * @public
      */
-    transient<T extends Constructable<{}>>(target: T & Partial<RegisterSelf<T>>): T & RegisterSelf<T>;
+    transient<T extends Constructable>(target: T & Partial<RegisterSelf<T>>): T & RegisterSelf<T>;
     /**
      * Registers the `target` class as a singleton dependency; the class will only be created once. Each
      * consecutive time the dependency is resolved, the same instance will be returned.
@@ -455,7 +455,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_1 extends Constructable>(target: T_1 & Partial<RegisterSelf<T_1>>, options?: SingletonOptions): T_1 & RegisterSelf<T_1>;
 }>;
 
 /**
@@ -762,7 +762,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_1 extends Constructable>(key: Key, value: T_1): Registration<InstanceType<T_1>>;
     /**
      * Creates an instance from a class.
      * Every time you request this {@link Key} you will get a new instance.
@@ -775,7 +775,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_2 extends Constructable>(key: Key, value: T_2): Registration<InstanceType<T_2>>;
     /**
      * Delegates to a callback function to provide the dependency.
      * Every time you request this {@link Key} the callback will be invoked to provide

package/dist/fast-element.debug.js

@@ -1761,18 +1761,6 @@ function setNonEnumerable(target, property, value, writable = true) {
     });
 }
 class DefaultArrayObserver extends SubscriberSet {
-    constructor(subject) {
-        super(subject);
-        this.oldCollection = void 0;
-        this.splices = void 0;
-        this.sorts = void 0;
-        this.needsQueue = true;
-        this._strategy = null;
-        this._lengthObserver = void 0;
-        this._sortObserver = void 0;
-        this.call = this.flush;
-        setNonEnumerable(subject, "$fastController", this);
-    }
     get strategy() {
         return this._strategy;
     }
@@ -1813,6 +1801,18 @@ class DefaultArrayObserver extends SubscriberSet {
         }
         return observer;
     }
+    constructor(subject) {
+        super(subject);
+        this.oldCollection = void 0;
+        this.splices = void 0;
+        this.sorts = void 0;
+        this.needsQueue = true;
+        this._strategy = null;
+        this._lengthObserver = void 0;
+        this._sortObserver = void 0;
+        this.call = this.flush;
+        setNonEnumerable(subject, "$fastController", this);
+    }
     subscribe(subscriber) {
         this.flush();
         super.subscribe(subscriber);
@@ -2036,6 +2036,15 @@ function reduceStyles(styles) {
  * @public
  */
 class ElementStyles {
+    /**
+     * Gets the StyleStrategy associated with these element styles.
+     */
+    get strategy() {
+        if (this._strategy === null) {
+            this.withStrategy(DefaultStyleStrategy);
+        }
+        return this._strategy;
+    }
     /**
      * Creates an instance of ElementStyles.
      * @param styles - The styles that will be associated with elements.
@@ -2048,15 +2057,6 @@ class ElementStyles {
             .map((x) => x instanceof ElementStyles ? x.behaviors : null)
             .reduce((prev, curr) => (curr === null ? prev : prev === null ? curr : prev.concat(curr)), null);
     }
-    /**
-     * Gets the StyleStrategy associated with these element styles.
-     */
-    get strategy() {
-        if (this._strategy === null) {
-            this.withStrategy(DefaultStyleStrategy);
-        }
-        return this._strategy;
-    }
     /** @internal */
     addStylesTo(target) {
         this.strategy.addStylesTo(target);
@@ -2865,7 +2865,7 @@ function targetFactory(factory, node, targets) {
     targets[factory.targetNodeId] = node;
 }
 
-var _a;
+var _a$1;
 function removeNodeSequence(firstNode, lastNode) {
     const parent = firstNode.parentNode;
     let current = firstNode;
@@ -3141,13 +3141,22 @@ class HydrationBindingError extends Error {
     }
 }
 class HydrationView extends DefaultExecutionContext {
+    get hydrationStage() {
+        return this._hydrationStage;
+    }
+    get targets() {
+        return this._targets;
+    }
+    get bindingViewBoundaries() {
+        return this._bindingViewBoundaries;
+    }
     constructor(firstChild, lastChild, sourceTemplate, hostBindingTarget) {
         super();
         this.firstChild = firstChild;
         this.lastChild = lastChild;
         this.sourceTemplate = sourceTemplate;
         this.hostBindingTarget = hostBindingTarget;
-        this[_a] = Hydratable;
+        this[_a$1] = Hydratable;
         this.context = this;
         this.source = null;
         this.isBound = false;
@@ -3160,15 +3169,6 @@ class HydrationView extends DefaultExecutionContext {
         this._targets = {};
         this.factories = sourceTemplate.compile().factories;
     }
-    get hydrationStage() {
-        return this._hydrationStage;
-    }
-    get targets() {
-        return this._targets;
-    }
-    get bindingViewBoundaries() {
-        return this._bindingViewBoundaries;
-    }
     /**
      * no-op. Hydrated views are don't need to be moved from a documentFragment
      * to the target node.
@@ -3334,7 +3334,7 @@ class HydrationView extends DefaultExecutionContext {
         unbindables.length = 0;
     }
 }
-_a = Hydratable;
+_a$1 = Hydratable;
 makeSerializationNoop(HydrationView);
 
 function isContentTemplate(value) {
@@ -4386,6 +4386,13 @@ class RepeatBehavior {
  * @public
  */
 class RepeatDirective {
+    /**
+     * Creates a placeholder string based on the directive's index within the template.
+     * @param index - The index of the directive within the template.
+     */
+    createHTML(add) {
+        return Markup.comment(add(this));
+    }
     /**
      * Creates an instance of RepeatDirective.
      * @param dataBinding - The binding that provides the array to render.
@@ -4398,13 +4405,6 @@ class RepeatDirective {
         this.options = options;
         ArrayObserver.enable();
     }
-    /**
-     * Creates a placeholder string based on the directive's index within the template.
-     * @param index - The index of the directive within the template.
-     */
-    createHTML(add) {
-        return Markup.comment(add(this));
-    }
     /**
      * Creates a behavior for the provided target node.
      * @param target - The node instance to create the behavior for.
@@ -4864,6 +4864,7 @@ function attr(configOrTarget, prop) {
     return decorator;
 }
 
+var _a;
 const defaultShadowOptions = { mode: "open" };
 const defaultElementOptions = {};
 const fastElementBaseTypes = new Set();
@@ -4884,6 +4885,12 @@ const TemplateOptions = {
  * @public
  */
 class FASTElementDefinition {
+    /**
+     * Indicates if this element has been defined in at least one registry.
+     */
+    get isDefined() {
+        return this.platformDefined;
+    }
     constructor(type, nameOrConfig = type.definition) {
         var _b;
         this.platformDefined = false;
@@ -4926,14 +4933,8 @@ class FASTElementDefinition {
                 : Object.assign(Object.assign({}, defaultElementOptions), nameOrConfig.elementOptions);
         this.styles = ElementStyles.normalize(nameOrConfig.styles);
         fastElementRegistry.register(this);
-        Observable.defineProperty(FASTElementDefinition.isRegistered, this.name);
-        FASTElementDefinition.isRegistered[this.name] = this.type;
-    }
-    /**
-     * Indicates if this element has been defined in at least one registry.
-     */
-    get isDefined() {
-        return this.platformDefined;
+        Observable.defineProperty(_a.isRegistered, this.name);
+        _a.isRegistered[this.name] = this.type;
     }
     /**
      * Defines a custom element based on this definition.
@@ -4959,10 +4960,10 @@ class FASTElementDefinition {
      */
     static compose(type, nameOrDef) {
         if (fastElementBaseTypes.has(type) || fastElementRegistry.getByType(type)) {
-            return new FASTElementDefinition(class extends type {
+            return new _a(class extends type {
             }, nameOrDef);
         }
-        return new FASTElementDefinition(type, nameOrDef);
+        return new _a(type, nameOrDef);
     }
     /**
      * Registers a FASTElement base type.
@@ -4984,10 +4985,10 @@ class FASTElementDefinition {
     static composeAsync(type, nameOrDef) {
         return new Promise(resolve => {
             if (fastElementBaseTypes.has(type) || fastElementRegistry.getByType(type)) {
-                resolve(new FASTElementDefinition(class extends type {
+                resolve(new _a(class extends type {
                 }, nameOrDef));
             }
-            const definition = new FASTElementDefinition(type, nameOrDef);
+            const definition = new _a(type, nameOrDef);
             Observable.getNotifier(definition).subscribe({
                 handleChange: () => {
                     var _b, _c;
@@ -4998,6 +4999,7 @@ class FASTElementDefinition {
         });
     }
 }
+_a = FASTElementDefinition;
 /**
  * The definition has been registered to the FAST element registry.
  */
@@ -5019,10 +5021,10 @@ FASTElementDefinition.getForInstance = fastElementRegistry.getForInstance;
  */
 FASTElementDefinition.registerAsync = (name) => __awaiter(void 0, void 0, void 0, function* () {
     return new Promise(resolve => {
-        if (FASTElementDefinition.isRegistered[name]) {
-            resolve(FASTElementDefinition.isRegistered[name]);
+        if (_a.isRegistered[name]) {
+            resolve(_a.isRegistered[name]);
         }
-        Observable.getNotifier(FASTElementDefinition.isRegistered).subscribe({ handleChange: () => resolve(FASTElementDefinition.isRegistered[name]) }, name);
+        Observable.getNotifier(_a.isRegistered).subscribe({ handleChange: () => resolve(_a.isRegistered[name]) }, name);
     });
 });
 Observable.defineProperty(FASTElementDefinition.prototype, "template");
@@ -5550,90 +5552,6 @@ let elementControllerStrategy;
  * @public
  */
 class ElementController extends PropertyChangeNotifier {
-    /**
-     * Creates a Controller to control the specified element.
-     * @param element - The element to be controlled by this controller.
-     * @param definition - The element definition metadata that instructs this
-     * controller in how to handle rendering and other platform integrations.
-     * @internal
-     */
-    constructor(element, definition) {
-        super(element);
-        /**
-         * A map of observable properties that were set on the element before upgrade.
-         */
-        this.boundObservables = null;
-        /**
-         * Indicates whether the controller needs to perform initial rendering.
-         */
-        this.needsInitialization = true;
-        /**
-         * Indicates whether the element has an existing shadow root (e.g. from declarative shadow DOM).
-         */
-        this.hasExistingShadowRoot = false;
-        /**
-         * The template used to render the component.
-         */
-        this._template = null;
-        /**
-         * The current lifecycle stage of the controller.
-         */
-        this.stage = 3 /* Stages.disconnected */;
-        /**
-         * A guard against connecting behaviors multiple times
-         * during connect in scenarios where a behavior adds
-         * another behavior during it's connectedCallback
-         */
-        this.guardBehaviorConnection = false;
-        /**
-         * The behaviors associated with the component.
-         */
-        this.behaviors = null;
-        /**
-         * Tracks whether behaviors are connected so that
-         * behaviors cant be connected multiple times
-         */
-        this.behaviorsConnected = false;
-        /**
-         * The main set of styles used for the component, independent of any
-         * dynamically added styles.
-         */
-        this._mainStyles = null;
-        /**
-         * This allows Observable.getNotifier(...) to return the Controller
-         * when the notifier for the Controller itself is being requested. The
-         * result is that the Observable system does not need to create a separate
-         * instance of Notifier for observables on the Controller. The component and
-         * the controller will now share the same notifier, removing one-object construct
-         * per web component instance.
-         */
-        this.$fastController = this;
-        /**
-         * The view associated with the custom element.
-         * @remarks
-         * If `null` then the element is managing its own rendering.
-         */
-        this.view = null;
-        this.source = element;
-        this.definition = definition;
-        this.shadowOptions = definition.shadowOptions;
-        // Capture any observable values that were set by the binding engine before
-        // the browser upgraded the element. Then delete the property since it will
-        // shadow the getter/setter that is required to make the observable operate.
-        // Later, in the connect callback, we'll re-apply the values.
-        const accessors = Observable.getAccessors(element);
-        if (accessors.length > 0) {
-            const boundObservables = (this.boundObservables = Object.create(null));
-            for (let i = 0, ii = accessors.length; i < ii; ++i) {
-                const propertyName = accessors[i].name;
-                const value = element[propertyName];
-                if (value !== void 0) {
-                    delete element[propertyName];
-                    boundObservables[propertyName] = value;
-                }
-            }
-        }
-    }
     /**
      * Indicates whether or not the custom element has been
      * connected to the document.
@@ -5747,6 +5665,90 @@ class ElementController extends PropertyChangeNotifier {
             this.addStyles(value);
         }
     }
+    /**
+     * Creates a Controller to control the specified element.
+     * @param element - The element to be controlled by this controller.
+     * @param definition - The element definition metadata that instructs this
+     * controller in how to handle rendering and other platform integrations.
+     * @internal
+     */
+    constructor(element, definition) {
+        super(element);
+        /**
+         * A map of observable properties that were set on the element before upgrade.
+         */
+        this.boundObservables = null;
+        /**
+         * Indicates whether the controller needs to perform initial rendering.
+         */
+        this.needsInitialization = true;
+        /**
+         * Indicates whether the element has an existing shadow root (e.g. from declarative shadow DOM).
+         */
+        this.hasExistingShadowRoot = false;
+        /**
+         * The template used to render the component.
+         */
+        this._template = null;
+        /**
+         * The current lifecycle stage of the controller.
+         */
+        this.stage = 3 /* Stages.disconnected */;
+        /**
+         * A guard against connecting behaviors multiple times
+         * during connect in scenarios where a behavior adds
+         * another behavior during it's connectedCallback
+         */
+        this.guardBehaviorConnection = false;
+        /**
+         * The behaviors associated with the component.
+         */
+        this.behaviors = null;
+        /**
+         * Tracks whether behaviors are connected so that
+         * behaviors cant be connected multiple times
+         */
+        this.behaviorsConnected = false;
+        /**
+         * The main set of styles used for the component, independent of any
+         * dynamically added styles.
+         */
+        this._mainStyles = null;
+        /**
+         * This allows Observable.getNotifier(...) to return the Controller
+         * when the notifier for the Controller itself is being requested. The
+         * result is that the Observable system does not need to create a separate
+         * instance of Notifier for observables on the Controller. The component and
+         * the controller will now share the same notifier, removing one-object construct
+         * per web component instance.
+         */
+        this.$fastController = this;
+        /**
+         * The view associated with the custom element.
+         * @remarks
+         * If `null` then the element is managing its own rendering.
+         */
+        this.view = null;
+        this.source = element;
+        this.definition = definition;
+        this.shadowOptions = definition.shadowOptions;
+        // Capture any observable values that were set by the binding engine before
+        // the browser upgraded the element. Then delete the property since it will
+        // shadow the getter/setter that is required to make the observable operate.
+        // Later, in the connect callback, we'll re-apply the values.
+        const accessors = Observable.getAccessors(element);
+        if (accessors.length > 0) {
+            const boundObservables = (this.boundObservables = Object.create(null));
+            for (let i = 0, ii = accessors.length; i < ii; ++i) {
+                const propertyName = accessors[i].name;
+                const value = element[propertyName];
+                if (value !== void 0) {
+                    delete element[propertyName];
+                    boundObservables[propertyName] = value;
+                }
+            }
+        }
+    }
     /**
      * Registers an unbind handler with the controller.
      * @param behavior - An object to call when the controller unbinds.