@microsoft/fast-element 2.0.0-beta.2 → 2.0.0-beta.5

package/docs/api-report.md

@@ -53,7 +53,7 @@ export const Aspect: Readonly<{
     readonly content: 4;
     readonly tokenList: 5;
     readonly event: 6;
-    readonly assign: (directive: Aspected, value: string) => void;
+    readonly assign: (directive: Aspected, value?: string) => void;
 }>;
 
 // @public
@@ -62,7 +62,7 @@ export type Aspect = typeof Aspect[Exclude<keyof typeof Aspect, "assign" | "none
 // @public
 export interface Aspected {
     aspectType: Aspect;
-    binding?: Binding;
+    dataBinding?: Binding;
     sourceAspect: string;
     targetAspect: string;
 }
@@ -110,38 +110,29 @@ export interface Behavior<TSource = any, TParent = any> {
 }
 
 // @public
-export function bind<T = any>(binding: Binding<T>, config?: BindingConfig | DefaultBindingOptions): CaptureType<T>;
+export function bind<T = any>(binding: Expression<T>, isVolatile?: boolean): Binding<T>;
 
 // @public
-export type Binding<TSource = any, TReturn = any, TParent = any> = (source: TSource, context: ExecutionContext<TParent>) => TReturn;
-
-// @public
-export interface BindingConfig<T = any> {
-    mode: BindingMode;
-    options: T;
+export abstract class Binding<TSource = any, TReturn = any, TParent = any> {
+    abstract createObserver(directive: HTMLDirective, subscriber: Subscriber): ExpressionObserver<TSource, TReturn, TParent>;
+    evaluate: Expression<TSource, TReturn, TParent>;
+    isVolatile?: boolean;
+    options?: any;
 }
 
 // @public
-export const BindingConfig: Readonly<{
-    define<T>(mode: BindingMode, defaultOptions: T): BindingConfig<T> & BindingConfigResolver<T>;
-}>;
-
-// @public
-export type BindingConfigResolver<T> = (options: T) => BindingConfig<T>;
-
-// @public
-export type BindingMode = Record<Aspect, (directive: HTMLBindingDirective) => Pick<ViewBehaviorFactory, "createBehavior">>;
-
-// @public
-export const BindingMode: Readonly<{
-    define(UpdateType: typeof UpdateBinding, EventType?: typeof EventBinding): BindingMode;
-}>;
-
-// @public
-export interface BindingObserver<TSource = any, TReturn = any, TParent = any> extends Notifier, Disposable {
-    observe(source: TSource, context?: ExecutionContext<TParent>): TReturn;
-    records(): IterableIterator<ObservationRecord>;
-    setMode(isAsync: boolean): void;
+export class BindingBehavior implements ViewBehavior {
+    constructor(directive: HTMLBindingDirective, updateTarget: UpdateTarget);
+    bind(source: any, context: ExecutionContext, targets: ViewBehaviorTargets): void;
+    createBehavior(targets: ViewBehaviorTargets): ViewBehavior;
+    // (undocumented)
+    readonly directive: HTMLBindingDirective;
+    protected getObserver(target: Node): ExpressionObserver;
+    // @internal (undocumented)
+    handleChange(binding: Expression, observer: ExpressionObserver): void;
+    unbind(source: any, context: ExecutionContext, targets: ViewBehaviorTargets): void;
+    // (undocumented)
+    protected updateTarget: UpdateTarget;
 }
 
 // @public
@@ -156,16 +147,6 @@ export type Callable = typeof Function.prototype.call | {
 export interface CaptureType<TSource> {
 }
 
-// @public
-export class ChangeBinding extends UpdateBinding {
-    constructor(directive: HTMLBindingDirective, updateTarget: UpdateTarget);
-    bind(source: any, context: ExecutionContext, targets: ViewBehaviorTargets): void;
-    protected getObserver(target: Node): BindingObserver;
-    // @internal (undocumented)
-    handleChange(binding: Binding, observer: BindingObserver): void;
-    unbind(source: any, context: ExecutionContext, targets: ViewBehaviorTargets): void;
-}
-
 // @public
 export interface ChildListDirectiveOptions<T = any> extends NodeBehaviorOptions<T>, Omit<MutationObserverInit, "subtree" | "childList"> {
 }
@@ -210,6 +191,24 @@ export type ConstructibleStyleStrategy = {
     new (styles: (string | CSSStyleSheet)[]): StyleStrategy;
 };
 
+// @public
+export class ContentBehavior extends BindingBehavior {
+    unbind(source: any, context: ExecutionContext, targets: ViewBehaviorTargets): void;
+}
+
+// @public
+export interface ContentTemplate {
+    create(): ContentView;
+}
+
+// @public
+export interface ContentView {
+    bind(source: any, context: ExecutionContext): void;
+    insertBefore(node: Node): void;
+    remove(): void;
+    unbind(): void;
+}
+
 // @public
 export class Controller<TElement extends HTMLElement = HTMLElement> extends PropertyChangeNotifier {
     // @internal
@@ -275,9 +274,6 @@ export function customElement(nameOrDef: string | PartialFASTElementDefinition):
 // @public
 export type DecoratorAttributeConfiguration = Omit<AttributeConfiguration, "property">;
 
-// @public
-export type DefaultBindingOptions = AddEventListenerOptions;
-
 // @public
 export interface Disposable {
     dispose(): void;
@@ -306,6 +302,7 @@ export class ElementStyles {
     readonly behaviors: ReadonlyArray<Behavior<HTMLElement>> | null;
     // @internal (undocumented)
     isAttachedTo(target: StyleTarget): boolean;
+    static normalize(styles: ComposableStyles | ComposableStyles[] | undefined): ElementStyles | undefined;
     // @internal (undocumented)
     removeStylesFrom(target: StyleTarget): void;
     static setDefaultStrategy(Strategy: ConstructibleStyleStrategy): void;
@@ -332,7 +329,7 @@ export interface ElementViewTemplate<TSource = any, TParent = any> {
 export const emptyArray: readonly never[];
 
 // @public
-export class EventBinding {
+export class EventBehavior {
     constructor(directive: HTMLBindingDirective);
     bind(source: any, context: ExecutionContext, targets: ViewBehaviorTargets): void;
     createBehavior(targets: ViewBehaviorTargets): ViewBehavior;
@@ -366,6 +363,20 @@ export class ExecutionContext<TParentSource = any> {
     updatePosition(index: number, length: number): void;
 }
 
+// @public
+export type Expression<TSource = any, TReturn = any, TParent = any> = (source: TSource, context: ExecutionContext<TParent>) => TReturn;
+
+// @public
+export interface ExpressionNotifier<TSource = any, TReturn = any, TParent = any> extends Notifier, ExpressionObserver<TSource, TReturn, TParent> {
+    records(): IterableIterator<ObservationRecord>;
+    setMode(isAsync: boolean): void;
+}
+
+// @public
+export interface ExpressionObserver<TSource = any, TReturn = any, TParent = any> extends Disposable {
+    observe(source: TSource, context?: ExecutionContext<TParent>): TReturn;
+}
+
 // Warning: (ae-internal-missing-underscore) The name "FAST" should be prefixed with an underscore because the declaration is marked as @internal
 //
 // @internal
@@ -381,20 +392,18 @@ export interface FASTElement extends HTMLElement {
 }
 
 // @public
-export const FASTElement: (new () => HTMLElement & FASTElement) & {
-    from<TBase extends {
-        new (): HTMLElement;
-        prototype: HTMLElement;
-    }>(BaseType: TBase): new () => InstanceType<TBase> & FASTElement;
-    define<TType extends Constructable<HTMLElement>>(type: TType, nameOrDef?: string | PartialFASTElementDefinition): TType;
-    metadata<TType_1 extends Constructable<HTMLElement> = Constructable<HTMLElement>>(type: TType_1, nameOrDef?: string | PartialFASTElementDefinition): FASTElementDefinition<TType_1>;
+export const FASTElement: {
+    new (): FASTElement;
+    define: typeof define;
+    compose: typeof compose;
+    from: typeof from;
 };
 
 // @public
 export class FASTElementDefinition<TType extends Constructable<HTMLElement> = Constructable<HTMLElement>> {
-    constructor(type: TType, nameOrConfig?: PartialFASTElementDefinition | string);
     readonly attributeLookup: Record<string, AttributeDefinition>;
     readonly attributes: ReadonlyArray<AttributeDefinition>;
+    static compose<TType extends Constructable<HTMLElement> = Constructable<HTMLElement>>(type: TType, nameOrDef?: string | PartialFASTElementDefinition): FASTElementDefinition<TType>;
     define(registry?: CustomElementRegistry): this;
     readonly elementOptions?: ElementDefinitionOptions;
     static readonly getByType: (key: Function) => FASTElementDefinition<Constructable<HTMLElement>> | undefined;
@@ -413,12 +422,12 @@ export class FASTElementDefinition<TType extends Constructable<HTMLElement> = Co
 // @internal
 export interface FASTGlobal {
     addMessages(messages: Record<number, string>): void;
-    error(code: number, ...args: any[]): Error;
+    error(code: number, values?: Record<string, any>): Error;
     getById<T>(id: string | number): T | null;
     // (undocumented)
     getById<T>(id: string | number, initialize: () => T): T;
     readonly versions: string[];
-    warn(code: number, ...args: any[]): void;
+    warn(code: number, values?: Record<string, any>): void;
 }
 
 // @public
@@ -426,18 +435,14 @@ export function html<TSource = any, TParent = any>(strings: TemplateStringsArray
 
 // @public
 export class HTMLBindingDirective implements HTMLDirective, ViewBehaviorFactory, Aspected {
-    constructor(binding: Binding, mode: BindingMode, options: any);
+    constructor(dataBinding: Binding);
     aspectType: Aspect;
-    // (undocumented)
-    binding: Binding;
     createBehavior(targets: ViewBehaviorTargets): ViewBehavior;
     createHTML(add: AddViewBehaviorFactory): string;
-    id: string;
     // (undocumented)
-    mode: BindingMode;
+    dataBinding: Binding;
+    id: string;
     nodeId: string;
-    // (undocumented)
-    options: any;
     sourceAspect: string;
     targetAspect: string;
 }
@@ -491,6 +496,9 @@ export interface LengthObserver extends Subscriber {
 // @public
 export function lengthOf<T>(array: readonly T[]): number;
 
+// @public
+export function listener<T = any>(binding: Expression<T>, options?: AddEventListenerOptions): Binding<T>;
+
 // @public
 export const Markup: Readonly<{
     interpolation: (id: string) => string;
@@ -523,6 +531,9 @@ export abstract class NodeObservationDirective<T extends NodeBehaviorOptions> ex
     protected updateTarget(source: any, value: ReadonlyArray<any>): void;
 }
 
+// @public
+export function normalizeBinding<TSource = any, TReturn = any, TParent = any>(value: Expression<TSource, TReturn, TParent> | Binding<TSource, TReturn, TParent> | {}): Binding<TSource, TReturn, TParent>;
+
 // @public
 export interface Notifier {
     notify(args: any): void;
@@ -543,8 +554,8 @@ export const Observable: Readonly<{
     notify(source: unknown, args: any): void;
     defineProperty(target: {}, nameOrAccessor: string | Accessor): void;
     getAccessors: (target: {}) => Accessor[];
-    binding<TSource = any, TReturn = any>(binding: Binding<TSource, TReturn, any>, initialSubscriber?: Subscriber, isVolatileBinding?: boolean): BindingObserver<TSource, TReturn, any>;
-    isVolatileBinding<TSource_1 = any, TReturn_1 = any>(binding: Binding<TSource_1, TReturn_1, any>): boolean;
+    binding<TSource = any, TReturn = any>(binding: Expression<TSource, TReturn, any>, initialSubscriber?: Subscriber, isVolatileBinding?: boolean): ExpressionNotifier<TSource, TReturn, any>;
+    isVolatileBinding<TSource_1 = any, TReturn_1 = any>(binding: Expression<TSource_1, TReturn_1, any>): boolean;
 }>;
 
 // @public
@@ -557,15 +568,7 @@ export interface ObservationRecord {
 }
 
 // @public
-export const onChange: BindingConfig<AddEventListenerOptions> & BindingConfigResolver<AddEventListenerOptions>;
-
-// @public
-export const oneTime: BindingConfig<AddEventListenerOptions> & BindingConfigResolver<AddEventListenerOptions>;
-
-// @public
-export class OneTimeBinding extends UpdateBinding {
-    bind(source: any, context: ExecutionContext, targets: ViewBehaviorTargets): void;
-}
+export function oneTime<T = any>(binding: Expression<T>): Binding<T>;
 
 // @public
 export const Parser: Readonly<{
@@ -606,24 +609,24 @@ export class RefDirective extends StatelessAttachedAttributeDirective<string> {
 }
 
 // @public
-export function repeat<TSource = any, TArray extends ReadonlyArray<any> = ReadonlyArray<any>>(itemsBinding: Binding<TSource, TArray, ExecutionContext<TSource>>, templateOrTemplateBinding: ViewTemplate | Binding<TSource, ViewTemplate>, options?: RepeatOptions): CaptureType<TSource>;
+export function repeat<TSource = any, TArray extends ReadonlyArray<any> = ReadonlyArray<any>>(items: Expression<TSource, TArray, ExecutionContext<TSource>> | Binding<TSource, TArray> | ReadonlyArray<any>, template: Expression<TSource, ViewTemplate> | Binding<TSource, ViewTemplate> | ViewTemplate, options?: RepeatOptions): CaptureType<TSource>;
 
 // @public
 export class RepeatBehavior<TSource = any> implements Behavior, Subscriber {
-    constructor(location: Node, itemsBinding: Binding<TSource, any[]>, isItemsBindingVolatile: boolean, templateBinding: Binding<TSource, SyntheticViewTemplate>, isTemplateBindingVolatile: boolean, options: RepeatOptions);
+    constructor(directive: RepeatDirective, location: Node);
     bind(source: TSource, context: ExecutionContext): void;
-    handleChange(source: any, args: Splice[]): void;
+    handleChange(source: any, args: Splice[] | ExpressionObserver): void;
     unbind(): void;
 }
 
 // @public
 export class RepeatDirective<TSource = any> implements HTMLDirective, ViewBehaviorFactory {
-    constructor(itemsBinding: Binding, templateBinding: Binding<TSource, SyntheticViewTemplate>, options: RepeatOptions);
+    constructor(dataBinding: Binding<TSource>, templateBinding: Binding<TSource, SyntheticViewTemplate>, options: RepeatOptions);
     createBehavior(targets: ViewBehaviorTargets): RepeatBehavior<TSource>;
     createHTML(add: AddViewBehaviorFactory): string;
-    id: string;
     // (undocumented)
-    readonly itemsBinding: Binding;
+    readonly dataBinding: Binding<TSource>;
+    id: string;
     nodeId: string;
     // (undocumented)
     readonly options: RepeatOptions;
@@ -757,7 +760,7 @@ export interface SyntheticViewTemplate<TSource = any, TParent = any> {
 }
 
 // @public
-export type TemplateValue<TSource, TParent = any> = Binding<TSource, any, TParent> | HTMLDirective | CaptureType<TSource>;
+export type TemplateValue<TSource, TParent = any> = Expression<TSource, any, TParent> | Binding<TSource, any, TParent> | HTMLDirective | CaptureType<TSource>;
 
 // @public
 export type TrustedTypes = {
@@ -789,18 +792,6 @@ export interface TypeRegistry<TDefinition extends TypeDefinition> {
     register(definition: TDefinition): boolean;
 }
 
-// @public
-export class UpdateBinding implements ViewBehavior {
-    constructor(directive: HTMLBindingDirective, updateTarget: UpdateTarget);
-    bind(source: any, context: ExecutionContext, targets: ViewBehaviorTargets): void;
-    createBehavior(targets: ViewBehaviorTargets): ViewBehavior;
-    // (undocumented)
-    readonly directive: HTMLBindingDirective;
-    unbind(source: any, context: ExecutionContext, targets: ViewBehaviorTargets): void;
-    // (undocumented)
-    protected updateTarget: UpdateTarget;
-}
-
 // @public
 export interface UpdateQueue {
     enqueue(callable: Callable): void;
@@ -865,7 +856,13 @@ export class ViewTemplate<TSource = any, TParent = any> implements ElementViewTe
 export function volatile(target: {}, name: string | Accessor, descriptor: PropertyDescriptor): PropertyDescriptor;
 
 // @public
-export function when<TSource = any, TReturn = any>(binding: Binding<TSource, TReturn>, templateOrTemplateBinding: SyntheticViewTemplate | Binding<TSource, SyntheticViewTemplate>): CaptureType<TSource>;
+export function when<TSource = any, TReturn = any>(condition: Expression<TSource, TReturn> | boolean, templateOrTemplateBinding: SyntheticViewTemplate | Expression<TSource, SyntheticViewTemplate>): CaptureType<TSource>;
+
+// Warnings were encountered during analysis:
+//
+// dist/dts/components/fast-element.d.ts:60:5 - (ae-forgotten-export) The symbol "define" needs to be exported by the entry point index.d.ts
+// dist/dts/components/fast-element.d.ts:61:5 - (ae-forgotten-export) The symbol "compose" needs to be exported by the entry point index.d.ts
+// dist/dts/components/fast-element.d.ts:62:5 - (ae-forgotten-export) The symbol "from" needs to be exported by the entry point index.d.ts
 
 // (No @packageDocumentation comment for this package)
 

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@microsoft/fast-element",
   "description": "A library for constructing Web Components",
-  "version": "2.0.0-beta.2",
+  "version": "2.0.0-beta.5",
   "author": {
     "name": "Microsoft",
     "url": "https://discord.gg/FcSNfg4"
@@ -34,10 +34,6 @@
       "types": "./dist/dts/debug.d.ts",
       "default": "./dist/esm/debug.js"
     },
-    "./observation/splice-strategies": {
-      "types": "./dist/dts/observation/splice-strategies.d.ts",
-      "default": "./dist/esm/observation/splice-strategies.js"
-    },
     "./binding/two-way": {
       "types": "./dist/dts/templating/binding-two-way.d.ts",
       "default": "./dist/esm/templating/binding-two-way.js"
@@ -46,6 +42,10 @@
       "types": "./dist/dts/templating/binding-signal.d.ts",
       "default": "./dist/esm/templating/binding-signal.js"
     },
+    "./render": {
+      "types": "./dist/dts/templating/render.d.ts",
+      "default": "./dist/esm/templating/render.js"
+    },
     "./utilities": {
       "types": "./dist/dts/utilities.d.ts",
       "default": "./dist/esm/utilities.js"
@@ -61,7 +61,16 @@
     "./metadata": {
       "types": "./dist/dts/metadata.d.ts",
       "default": "./dist/esm/metadata.js"
-    }
+    },
+    "./testing": {
+      "types": "./dist/dts/testing/exports.d.ts",
+      "default": "./dist/esm/testing/exports.js"
+    },
+    "./di": {
+      "types": "./dist/dts/di/di.d.ts",
+      "default": "./dist/esm/di/di.js"
+    },
+    "./package.json": "./package.json"
   },
   "unpkg": "dist/fast-element.min.js",
   "sideEffects": [

package/dist/dts/observation/splice-strategies.d.ts

@@ -1,13 +0,0 @@
-import { SpliceStrategy } from "./arrays.js";
-/**
- * A SpliceStrategy that attempts to merge all splices into the minimal set of
- * splices needed to represent the change from the old array to the new array.
- * @public
- */
-export declare const mergeSpliceStrategy: SpliceStrategy;
-/**
- * A splice strategy that doesn't create splices, but instead
- * tracks every change as a full array reset.
- * @public
- */
-export declare const resetSpliceStrategy: SpliceStrategy;