@microsoft/fast-element 2.0.0-beta.21 → 2.0.0-beta.23

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (56) hide show
  1. package/CHANGELOG.json +54 -0
  2. package/CHANGELOG.md +21 -1
  3. package/dist/dts/binding/binding.d.ts +49 -0
  4. package/dist/dts/binding/normalize.d.ts +9 -0
  5. package/dist/dts/binding/one-time.d.ts +11 -0
  6. package/dist/dts/binding/one-way.d.ts +20 -0
  7. package/dist/dts/{templating/binding-signal.d.ts → binding/signal.d.ts} +16 -3
  8. package/dist/dts/{templating/binding-two-way.d.ts → binding/two-way.d.ts} +6 -4
  9. package/dist/dts/components/element-controller.d.ts +20 -5
  10. package/dist/dts/context.d.ts +21 -8
  11. package/dist/dts/index.d.ts +7 -2
  12. package/dist/dts/interfaces.d.ts +9 -4
  13. package/dist/dts/metadata.d.ts +1 -0
  14. package/dist/dts/platform.d.ts +9 -1
  15. package/dist/dts/styles/css-binding-directive.d.ts +60 -0
  16. package/dist/dts/styles/css.d.ts +9 -2
  17. package/dist/dts/styles/host.d.ts +2 -5
  18. package/dist/dts/templating/{binding.d.ts → html-binding-directive.d.ts} +3 -34
  19. package/dist/dts/templating/html-directive.d.ts +3 -35
  20. package/dist/dts/templating/render.d.ts +19 -5
  21. package/dist/dts/templating/repeat.d.ts +3 -2
  22. package/dist/dts/templating/template.d.ts +2 -6
  23. package/dist/dts/templating/view.d.ts +16 -6
  24. package/dist/dts/testing/fakes.d.ts +2 -1
  25. package/dist/esm/binding/binding.js +18 -0
  26. package/dist/esm/binding/normalize.js +17 -0
  27. package/dist/esm/binding/one-time.js +21 -0
  28. package/dist/esm/binding/one-way.js +30 -0
  29. package/dist/esm/{templating/binding-signal.js → binding/signal.js} +20 -10
  30. package/dist/esm/{templating/binding-two-way.js → binding/two-way.js} +14 -15
  31. package/dist/esm/components/element-controller.js +33 -8
  32. package/dist/esm/context.js +22 -1
  33. package/dist/esm/index.js +9 -2
  34. package/dist/esm/interfaces.js +3 -3
  35. package/dist/esm/metadata.js +3 -1
  36. package/dist/esm/observation/observable.js +3 -6
  37. package/dist/esm/platform.js +9 -0
  38. package/dist/esm/styles/css-binding-directive.js +76 -0
  39. package/dist/esm/styles/css.js +14 -2
  40. package/dist/esm/templating/compiler.js +2 -1
  41. package/dist/esm/templating/{binding.js → html-binding-directive.js} +3 -70
  42. package/dist/esm/templating/html-directive.js +2 -25
  43. package/dist/esm/templating/render.js +25 -12
  44. package/dist/esm/templating/repeat.js +3 -3
  45. package/dist/esm/templating/template.js +9 -10
  46. package/dist/esm/templating/view.js +2 -6
  47. package/dist/esm/testing/fakes.js +1 -1
  48. package/dist/fast-element.api.json +1129 -222
  49. package/dist/fast-element.d.ts +125 -33
  50. package/dist/fast-element.debug.js +217 -117
  51. package/dist/fast-element.debug.min.js +1 -1
  52. package/dist/fast-element.js +217 -117
  53. package/dist/fast-element.min.js +1 -1
  54. package/dist/fast-element.untrimmed.d.ts +132 -72
  55. package/docs/api-report.md +52 -48
  56. package/package.json +5 -5
@@ -80,13 +80,10 @@ export class AttributeDefinition implements Accessor {
80
80
  // @public
81
81
  export type AttributeMode = typeof reflectMode | typeof booleanMode | "fromView";
82
82
 
83
- // @public
84
- export function bind<T = any>(expression: Expression<T>, policy?: DOMPolicy, isVolatile?: boolean): Binding<T>;
85
-
86
83
  // @public
87
84
  export abstract class Binding<TSource = any, TReturn = any, TParent = any> {
88
85
  constructor(evaluate: Expression<TSource, TReturn, TParent>, policy?: DOMPolicy | undefined, isVolatile?: boolean);
89
- abstract createObserver(directive: HTMLDirective, subscriber: Subscriber): ExpressionObserver<TSource, TReturn, TParent>;
86
+ abstract createObserver(subscriber: Subscriber, directive: BindingDirective): ExpressionObserver<TSource, TReturn, TParent>;
90
87
  // (undocumented)
91
88
  evaluate: Expression<TSource, TReturn, TParent>;
92
89
  // (undocumented)
@@ -96,6 +93,13 @@ export abstract class Binding<TSource = any, TReturn = any, TParent = any> {
96
93
  policy?: DOMPolicy | undefined;
97
94
  }
98
95
 
96
+ // @public
97
+ export interface BindingDirective {
98
+ readonly aspectType?: DOMAspect;
99
+ readonly dataBinding: Binding;
100
+ readonly targetAspect?: string;
101
+ }
102
+
99
103
  // @public
100
104
  export const booleanConverter: ValueConverter;
101
105
 
@@ -175,19 +179,30 @@ export interface ContentView {
175
179
  unbind(): void;
176
180
  }
177
181
 
178
- // Warning: (ae-internal-missing-underscore) The name "createMetadataLocator" should be prefixed with an underscore because the declaration is marked as @internal
179
- //
180
- // @internal
181
- export function createMetadataLocator<TMetadata>(): (target: {}) => TMetadata[];
182
-
183
- // Warning: (ae-internal-missing-underscore) The name "createTypeRegistry" should be prefixed with an underscore because the declaration is marked as @internal
184
- //
185
- // @internal
186
- export function createTypeRegistry<TDefinition extends TypeDefinition>(): TypeRegistry<TDefinition>;
187
-
188
182
  // @public
189
183
  export const css: CSSTemplateTag;
190
184
 
185
+ // @public
186
+ export class CSSBindingDirective implements HostBehavior, Subscriber, CSSDirective, BindingDirective {
187
+ constructor(dataBinding: Binding, targetAspect: string);
188
+ addedCallback(controller: HostController<HTMLElement & {
189
+ $cssBindings: Map<CSSBindingDirective, CSSBindingEntry>;
190
+ }>): void;
191
+ connectedCallback(controller: HostController<HTMLElement & {
192
+ $cssBindings: Map<CSSBindingDirective, CSSBindingEntry>;
193
+ }>): void;
194
+ createCSS(add: AddBehavior): ComposableStyles;
195
+ // (undocumented)
196
+ readonly dataBinding: Binding;
197
+ // @internal
198
+ handleChange(_: any, observer: ExpressionObserver): void;
199
+ removedCallback(controller: HostController<HTMLElement & {
200
+ $cssBindings: Map<CSSBindingDirective, CSSBindingEntry>;
201
+ }>): void;
202
+ // (undocumented)
203
+ readonly targetAspect: string;
204
+ }
205
+
191
206
  // @public
192
207
  export interface CSSDirective {
193
208
  createCSS(add: AddBehavior): ComposableStyles;
@@ -209,10 +224,13 @@ export interface CSSDirectiveDefinition<TType extends Constructable<CSSDirective
209
224
  }
210
225
 
211
226
  // @public
212
- export type CSSTemplateTag = ((strings: TemplateStringsArray, ...values: (ComposableStyles | CSSDirective)[]) => ElementStyles) & {
213
- partial(strings: TemplateStringsArray, ...values: (ComposableStyles | CSSDirective)[]): CSSDirective;
227
+ export type CSSTemplateTag = (<TSource = any, TParent = any>(strings: TemplateStringsArray, ...values: CSSValue<TSource, TParent>[]) => ElementStyles) & {
228
+ partial<TSource = any, TParent = any>(strings: TemplateStringsArray, ...values: CSSValue<TSource, TParent>[]): CSSDirective;
214
229
  };
215
230
 
231
+ // @public
232
+ export type CSSValue<TSource, TParent = any> = Expression<TSource, any, TParent> | Binding<TSource, any, TParent> | ComposableStyles | CSSDirective;
233
+
216
234
  // @public
217
235
  export function customElement(nameOrDef: string | PartialFASTElementDefinition): (type: Constructable<HTMLElement>) => void;
218
236
 
@@ -262,22 +280,26 @@ export class ElementController<TElement extends HTMLElement = HTMLElement> exten
262
280
  addBehavior(behavior: HostBehavior<TElement>): void;
263
281
  addStyles(styles: ElementStyles | HTMLStyleElement | null | undefined): void;
264
282
  connect(): void;
283
+ get context(): ExecutionContext;
265
284
  readonly definition: FASTElementDefinition;
266
285
  disconnect(): void;
267
286
  emit(type: string, detail?: any, options?: Omit<CustomEventInit, "detail">): void | boolean;
268
287
  static forCustomElement(element: HTMLElement): ElementController;
288
+ get isBound(): boolean;
269
289
  get isConnected(): boolean;
270
290
  get mainStyles(): ElementStyles | null;
271
291
  set mainStyles(value: ElementStyles | null);
272
292
  onAttributeChangedCallback(name: string, oldValue: string | null, newValue: string | null): void;
293
+ onUnbind(behavior: {
294
+ unbind(controller: ExpressionController<TElement>): any;
295
+ }): void;
273
296
  removeBehavior(behavior: HostBehavior<TElement>, force?: boolean): void;
274
297
  removeStyles(styles: ElementStyles | HTMLStyleElement | null | undefined): void;
275
298
  static setStrategy(strategy: ElementControllerStrategy): void;
276
299
  readonly source: TElement;
300
+ get sourceLifetime(): SourceLifetime | undefined;
277
301
  get template(): ElementViewTemplate<TElement> | null;
278
302
  set template(value: ElementViewTemplate<TElement> | null);
279
- // @internal
280
- toJSON: () => undefined;
281
303
  readonly view: ElementView<TElement> | null;
282
304
  }
283
305
 
@@ -316,6 +338,10 @@ export class ElementStyles {
316
338
  // @public
317
339
  export interface ElementView<TSource = any, TParent = any> extends View<TSource, TParent> {
318
340
  appendTo(node: Node): void;
341
+ onUnbind(behavior: {
342
+ unbind(controller: ViewController<TSource, TParent>): any;
343
+ }): void;
344
+ readonly sourceLifetime?: SourceLifetime;
319
345
  }
320
346
 
321
347
  // @public
@@ -437,21 +463,20 @@ export interface HostBehavior<TSource = any> {
437
463
  }
438
464
 
439
465
  // @public
440
- export interface HostController<TSource = any> {
466
+ export interface HostController<TSource = any> extends ExpressionController<TSource> {
441
467
  addBehavior(behavior: HostBehavior<TSource>): void;
442
468
  addStyles(styles: ElementStyles | HTMLStyleElement | null | undefined): void;
443
469
  readonly isConnected: boolean;
444
470
  mainStyles: ElementStyles | null;
445
471
  removeBehavior(behavior: HostBehavior<TSource>, force?: boolean): void;
446
472
  removeStyles(styles: ElementStyles | HTMLStyleElement | null | undefined): void;
447
- readonly source: TSource;
448
473
  }
449
474
 
450
475
  // @public
451
476
  export const html: HTMLTemplateTag;
452
477
 
453
478
  // @public
454
- export class HTMLBindingDirective implements HTMLDirective, ViewBehaviorFactory, ViewBehavior, Aspected {
479
+ export class HTMLBindingDirective implements HTMLDirective, ViewBehaviorFactory, ViewBehavior, Aspected, BindingDirective {
455
480
  constructor(dataBinding: Binding);
456
481
  aspectType: DOMAspect;
457
482
  // @internal (undocumented)
@@ -538,8 +563,6 @@ export class HTMLView<TSource = any, TParent = any> implements ElementView<TSour
538
563
  readonly sourceLifetime: SourceLifetime;
539
564
  // (undocumented)
540
565
  readonly targets: ViewBehaviorTargets;
541
- // @internal
542
- toJSON: () => undefined;
543
566
  unbind(): void;
544
567
  }
545
568
 
@@ -631,6 +654,9 @@ export interface ObservationRecord {
631
654
  // @public
632
655
  export function oneTime<T = any>(expression: Expression<T>, policy?: DOMPolicy): Binding<T>;
633
656
 
657
+ // @public
658
+ export function oneWay<T = any>(expression: Expression<T>, policy?: DOMPolicy, isVolatile?: boolean): Binding<T>;
659
+
634
660
  // @public
635
661
  export const Parser: Readonly<{
636
662
  parse(value: string, factories: Record<string, ViewBehaviorFactory>): (string | ViewBehaviorFactory)[] | null;
@@ -684,7 +710,7 @@ export class RepeatBehavior<TSource = any> implements ViewBehavior, Subscriber {
684
710
  }
685
711
 
686
712
  // @public
687
- export class RepeatDirective<TSource = any> implements HTMLDirective, ViewBehaviorFactory {
713
+ export class RepeatDirective<TSource = any> implements HTMLDirective, ViewBehaviorFactory, BindingDirective {
688
714
  constructor(dataBinding: Binding<TSource>, templateBinding: Binding<TSource, SyntheticViewTemplate>, options: RepeatOptions);
689
715
  createBehavior(): RepeatBehavior<TSource>;
690
716
  createHTML(add: AddViewBehaviorFactory): string;
@@ -784,8 +810,6 @@ export abstract class StatelessAttachedAttributeDirective<TOptions> implements H
784
810
  createHTML(add: AddViewBehaviorFactory): string;
785
811
  // (undocumented)
786
812
  protected options: TOptions;
787
- // @internal
788
- toJSON: () => undefined;
789
813
  }
790
814
 
791
815
  // @public
@@ -845,26 +869,6 @@ export type TrustedTypesPolicy = {
845
869
  createHTML(html: string): string;
846
870
  };
847
871
 
848
- // Warning: (ae-internal-missing-underscore) The name "TypeDefinition" should be prefixed with an underscore because the declaration is marked as @internal
849
- //
850
- // @internal
851
- export interface TypeDefinition {
852
- // (undocumented)
853
- type: Function;
854
- }
855
-
856
- // Warning: (ae-internal-missing-underscore) The name "TypeRegistry" should be prefixed with an underscore because the declaration is marked as @internal
857
- //
858
- // @internal
859
- export interface TypeRegistry<TDefinition extends TypeDefinition> {
860
- // (undocumented)
861
- getByType(key: Function): TDefinition | undefined;
862
- // (undocumented)
863
- getForInstance(object: any): TDefinition | undefined;
864
- // (undocumented)
865
- register(definition: TDefinition): boolean;
866
- }
867
-
868
872
  // @public
869
873
  export interface UpdateQueue {
870
874
  enqueue(callable: Callable): void;
@@ -886,6 +890,7 @@ export interface ValueConverter {
886
890
  export interface View<TSource = any, TParent = any> extends Disposable {
887
891
  bind(source: TSource, context?: ExecutionContext<TParent>): void;
888
892
  readonly context: ExecutionContext<TParent>;
893
+ readonly isBound: boolean;
889
894
  readonly source: TSource | null;
890
895
  unbind(): void;
891
896
  }
@@ -923,8 +928,6 @@ export class ViewTemplate<TSource = any, TParent = any> implements ElementViewTe
923
928
  readonly html: string | HTMLTemplateElement;
924
929
  inline(): CaptureType<TSource, TParent>;
925
930
  render(source: TSource, host: Node, hostBindingTarget?: Element): HTMLView<TSource, TParent>;
926
- // @internal
927
- toJSON: () => undefined;
928
931
  withPolicy(policy: DOMPolicy): this;
929
932
  }
930
933
 
@@ -939,6 +942,7 @@ export function when<TSource = any, TReturn = any, TParent = any>(condition: Exp
939
942
  // 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
940
943
  // 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
941
944
  // 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
945
+ // dist/dts/styles/css-binding-directive.d.ts:35:9 - (ae-forgotten-export) The symbol "CSSBindingEntry" needs to be exported by the entry point index.d.ts
942
946
 
943
947
  // (No @packageDocumentation comment for this package)
944
948
 
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@microsoft/fast-element",
3
3
  "description": "A library for constructing Web Components",
4
- "version": "2.0.0-beta.21",
4
+ "version": "2.0.0-beta.23",
5
5
  "author": {
6
6
  "name": "Microsoft",
7
7
  "url": "https://discord.gg/FcSNfg4"
@@ -31,12 +31,12 @@
31
31
  "default": "./dist/esm/debug.js"
32
32
  },
33
33
  "./binding/two-way": {
34
- "types": "./dist/dts/templating/binding-two-way.d.ts",
35
- "default": "./dist/esm/templating/binding-two-way.js"
34
+ "types": "./dist/dts/binding/two-way.d.ts",
35
+ "default": "./dist/esm/binding/two-way.js"
36
36
  },
37
37
  "./binding/signal": {
38
- "types": "./dist/dts/templating/binding-signal.d.ts",
39
- "default": "./dist/esm/templating/binding-signal.js"
38
+ "types": "./dist/dts/binding/signal.d.ts",
39
+ "default": "./dist/esm/binding/signal.js"
40
40
  },
41
41
  "./render": {
42
42
  "types": "./dist/dts/templating/render.d.ts",