@microsoft/fast-element 2.0.0-beta.9 → 2.0.0

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 (142) hide show
  1. package/.eslintrc.json +1 -1
  2. package/CHANGELOG.json +497 -0
  3. package/CHANGELOG.md +172 -1
  4. package/README.md +1 -9
  5. package/api-extractor.context.json +14 -0
  6. package/api-extractor.di.json +14 -0
  7. package/dist/context/context.api.json +1068 -0
  8. package/dist/di/di.api.json +4929 -0
  9. package/dist/dts/binding/binding.d.ts +49 -0
  10. package/dist/dts/binding/normalize.d.ts +9 -0
  11. package/dist/dts/binding/one-time.d.ts +11 -0
  12. package/dist/dts/binding/one-way.d.ts +20 -0
  13. package/dist/dts/{templating/binding-signal.d.ts → binding/signal.d.ts} +19 -4
  14. package/dist/dts/{templating/binding-two-way.d.ts → binding/two-way.d.ts} +9 -5
  15. package/dist/dts/components/attributes.d.ts +6 -0
  16. package/dist/dts/components/element-controller.d.ts +104 -8
  17. package/dist/dts/components/element-hydration.d.ts +2 -0
  18. package/dist/dts/components/fast-definitions.d.ts +6 -0
  19. package/dist/dts/components/hydration.d.ts +56 -0
  20. package/dist/dts/components/install-hydration.d.ts +1 -0
  21. package/dist/dts/context.d.ts +29 -15
  22. package/dist/dts/di/di.d.ts +0 -5
  23. package/dist/dts/dom-policy.d.ts +83 -0
  24. package/dist/dts/dom.d.ts +100 -0
  25. package/dist/dts/hydration/target-builder.d.ts +63 -0
  26. package/dist/dts/index.d.ts +33 -26
  27. package/dist/dts/index.rollup.d.ts +0 -1
  28. package/dist/dts/index.rollup.debug.d.ts +0 -1
  29. package/dist/dts/interfaces.d.ts +32 -82
  30. package/dist/dts/metadata.d.ts +6 -5
  31. package/dist/dts/observation/arrays.d.ts +1 -1
  32. package/dist/dts/observation/observable.bench.d.ts +18 -0
  33. package/dist/dts/observation/observable.d.ts +5 -5
  34. package/dist/dts/pending-task.d.ts +19 -7
  35. package/dist/dts/platform.d.ts +11 -2
  36. package/dist/dts/polyfills.d.ts +0 -8
  37. package/dist/dts/styles/css-binding-directive.d.ts +60 -0
  38. package/dist/dts/styles/css.d.ts +9 -7
  39. package/dist/dts/styles/element-styles.d.ts +1 -14
  40. package/dist/dts/styles/host.d.ts +2 -5
  41. package/dist/dts/styles/style-strategy.d.ts +42 -0
  42. package/dist/dts/templating/compiler.d.ts +11 -13
  43. package/dist/dts/templating/{binding.d.ts → html-binding-directive.d.ts} +21 -41
  44. package/dist/dts/templating/html-directive.d.ts +44 -140
  45. package/dist/dts/templating/install-hydratable-view-templates.d.ts +1 -0
  46. package/dist/dts/templating/node-observation.d.ts +11 -1
  47. package/dist/dts/templating/ref.d.ts +4 -0
  48. package/dist/dts/templating/render.bench.d.ts +3 -0
  49. package/dist/dts/templating/render.d.ts +49 -9
  50. package/dist/dts/templating/repeat-basic-reverse.bench.d.ts +3 -0
  51. package/dist/dts/templating/repeat-basic-shift.bench.d.ts +3 -0
  52. package/dist/dts/templating/repeat.d.ts +31 -9
  53. package/dist/dts/templating/template.d.ts +97 -12
  54. package/dist/dts/templating/view.d.ts +146 -29
  55. package/dist/dts/templating/when-basic.bench.d.ts +3 -0
  56. package/dist/dts/templating/when-conditional.bench.d.ts +3 -0
  57. package/dist/dts/templating/when-switch.bench.d.ts +3 -0
  58. package/dist/dts/templating/when.d.ts +3 -1
  59. package/dist/dts/testing/fakes.d.ts +12 -1
  60. package/dist/dts/tsdoc-metadata.json +1 -1
  61. package/dist/dts/utilities.d.ts +55 -1
  62. package/dist/esm/binding/binding.js +18 -0
  63. package/dist/esm/binding/normalize.js +17 -0
  64. package/dist/esm/binding/one-time.js +21 -0
  65. package/dist/esm/binding/one-way.js +30 -0
  66. package/dist/esm/{templating/binding-signal.js → binding/signal.js} +22 -6
  67. package/dist/esm/{templating/binding-two-way.js → binding/two-way.js} +18 -12
  68. package/dist/esm/components/attributes.js +16 -1
  69. package/dist/esm/components/element-controller.js +319 -49
  70. package/dist/esm/components/element-hydration.js +2 -0
  71. package/dist/esm/components/fast-definitions.js +12 -4
  72. package/dist/esm/components/fast-element.js +3 -1
  73. package/dist/esm/components/hydration.js +104 -0
  74. package/dist/esm/components/install-hydration.js +3 -0
  75. package/dist/esm/context.js +26 -4
  76. package/dist/esm/debug.js +8 -2
  77. package/dist/esm/di/di.js +9 -12
  78. package/dist/esm/dom-policy.js +345 -0
  79. package/dist/esm/dom.js +101 -0
  80. package/dist/esm/hydration/target-builder.js +175 -0
  81. package/dist/esm/index.js +34 -25
  82. package/dist/esm/index.rollup.debug.js +3 -1
  83. package/dist/esm/index.rollup.js +3 -1
  84. package/dist/esm/interfaces.js +51 -3
  85. package/dist/esm/metadata.js +11 -8
  86. package/dist/esm/observation/arrays.js +1 -1
  87. package/dist/esm/observation/observable.bench.js +79 -0
  88. package/dist/esm/observation/observable.js +20 -15
  89. package/dist/esm/observation/update-queue.js +2 -2
  90. package/dist/esm/pending-task.js +13 -1
  91. package/dist/esm/platform.js +12 -2
  92. package/dist/esm/polyfills.js +3 -61
  93. package/dist/esm/styles/css-binding-directive.js +76 -0
  94. package/dist/esm/styles/css.js +14 -7
  95. package/dist/esm/styles/element-styles.js +0 -33
  96. package/dist/esm/styles/style-strategy.js +1 -0
  97. package/dist/esm/templating/children.js +8 -4
  98. package/dist/esm/templating/compiler.js +37 -44
  99. package/dist/esm/templating/html-binding-directive.js +218 -0
  100. package/dist/esm/templating/html-directive.js +25 -152
  101. package/dist/esm/templating/install-hydratable-view-templates.js +17 -0
  102. package/dist/esm/templating/node-observation.js +14 -8
  103. package/dist/esm/templating/ref.js +1 -1
  104. package/dist/esm/templating/render.bench.js +56 -0
  105. package/dist/esm/templating/render.js +74 -30
  106. package/dist/esm/templating/repeat-basic-reverse.bench.js +43 -0
  107. package/dist/esm/templating/repeat-basic-shift.bench.js +43 -0
  108. package/dist/esm/templating/repeat.js +116 -17
  109. package/dist/esm/templating/template.js +135 -60
  110. package/dist/esm/templating/view.js +254 -34
  111. package/dist/esm/templating/when-basic.bench.js +36 -0
  112. package/dist/esm/templating/when-conditional.bench.js +39 -0
  113. package/dist/esm/templating/when-switch.bench.js +68 -0
  114. package/dist/esm/templating/when.js +12 -5
  115. package/dist/esm/testing/fakes.js +32 -1
  116. package/dist/esm/testing/fixture.js +1 -1
  117. package/dist/esm/utilities.js +97 -1
  118. package/dist/fast-element.api.json +9788 -5666
  119. package/dist/fast-element.d.ts +813 -2392
  120. package/dist/fast-element.debug.js +2785 -969
  121. package/dist/fast-element.debug.min.js +3 -1
  122. package/dist/fast-element.js +2638 -828
  123. package/dist/fast-element.min.js +3 -1
  124. package/dist/fast-element.untrimmed.d.ts +661 -313
  125. package/docs/{api-report.md → api-report.api.md} +238 -151
  126. package/docs/context/api-report.api.md +69 -0
  127. package/docs/di/api-report.api.md +315 -0
  128. package/karma.conf.cjs +2 -1
  129. package/package.json +59 -47
  130. package/scripts/run-api-extractor.js +51 -0
  131. package/scripts/run-benchmarks.js +46 -0
  132. package/tensile.config.js +12 -0
  133. package/dist/dts/templating/dom.d.ts +0 -41
  134. package/dist/esm/templating/binding.js +0 -282
  135. package/dist/esm/templating/dom.js +0 -49
  136. package/docs/guide/declaring-templates.md +0 -230
  137. package/docs/guide/defining-elements.md +0 -214
  138. package/docs/guide/leveraging-css.md +0 -253
  139. package/docs/guide/next-steps.md +0 -13
  140. package/docs/guide/observables-and-state.md +0 -213
  141. package/docs/guide/using-directives.md +0 -576
  142. package/docs/guide/working-with-shadow-dom.md +0 -296
@@ -0,0 +1,49 @@
1
+ import type { DOMAspect, DOMPolicy } from "../dom.js";
2
+ import type { Subscriber } from "../observation/notifier.js";
3
+ import type { Expression, ExpressionObserver } from "../observation/observable.js";
4
+ /**
5
+ * The directive from which a binding originates.
6
+ *
7
+ * @public
8
+ */
9
+ export interface BindingDirective {
10
+ /**
11
+ * The binding.
12
+ */
13
+ readonly dataBinding: Binding;
14
+ /**
15
+ * The evaluated target aspect.
16
+ */
17
+ readonly targetAspect?: string;
18
+ /**
19
+ * The type of aspect to target.
20
+ */
21
+ readonly aspectType?: DOMAspect;
22
+ }
23
+ /**
24
+ * Captures a binding expression along with related information and capabilities.
25
+ *
26
+ * @public
27
+ */
28
+ export declare abstract class Binding<TSource = any, TReturn = any, TParent = any> {
29
+ evaluate: Expression<TSource, TReturn, TParent>;
30
+ policy?: DOMPolicy | undefined;
31
+ isVolatile: boolean;
32
+ /**
33
+ * Options associated with the binding.
34
+ */
35
+ options?: any;
36
+ /**
37
+ * Creates a binding.
38
+ * @param evaluate - Evaluates the binding.
39
+ * @param policy - The security policy to associate with this binding.
40
+ * @param isVolatile - Indicates whether the binding is volatile.
41
+ */
42
+ constructor(evaluate: Expression<TSource, TReturn, TParent>, policy?: DOMPolicy | undefined, isVolatile?: boolean);
43
+ /**
44
+ * Creates an observer capable of notifying a subscriber when the output of a binding changes.
45
+ * @param subscriber - The subscriber to changes in the binding.
46
+ * @param directive - The Binding directive to create the observer for.
47
+ */
48
+ abstract createObserver(subscriber: Subscriber, directive: BindingDirective): ExpressionObserver<TSource, TReturn, TParent>;
49
+ }
@@ -0,0 +1,9 @@
1
+ import type { Expression } from "../observation/observable.js";
2
+ import { Binding } from "./binding.js";
3
+ /**
4
+ * Normalizes the input value into a binding.
5
+ * @param value - The value to create the default binding for.
6
+ * @returns A binding configuration for the provided value.
7
+ * @public
8
+ */
9
+ export declare function normalizeBinding<TSource = any, TReturn = any, TParent = any>(value: Expression<TSource, TReturn, TParent> | Binding<TSource, TReturn, TParent> | {}): Binding<TSource, TReturn, TParent>;
@@ -0,0 +1,11 @@
1
+ import type { DOMPolicy } from "../dom.js";
2
+ import type { Expression } from "../observation/observable.js";
3
+ import { Binding } from "./binding.js";
4
+ /**
5
+ * Creates a one time binding
6
+ * @param expression - The binding to refresh when signaled.
7
+ * @param policy - The security policy to associate with th binding.
8
+ * @returns A binding configuration.
9
+ * @public
10
+ */
11
+ export declare function oneTime<T = any>(expression: Expression<T>, policy?: DOMPolicy): Binding<T>;
@@ -0,0 +1,20 @@
1
+ import type { DOMPolicy } from "../dom.js";
2
+ import { Expression } from "../observation/observable.js";
3
+ import { Binding } from "./binding.js";
4
+ /**
5
+ * Creates an standard binding.
6
+ * @param expression - The binding to refresh when changed.
7
+ * @param policy - The security policy to associate with th binding.
8
+ * @param isVolatile - Indicates whether the binding is volatile or not.
9
+ * @returns A binding configuration.
10
+ * @public
11
+ */
12
+ export declare function oneWay<T = any>(expression: Expression<T>, policy?: DOMPolicy, isVolatile?: boolean): Binding<T>;
13
+ /**
14
+ * Creates an event listener binding.
15
+ * @param expression - The binding to invoke when the event is raised.
16
+ * @param options - Event listener options.
17
+ * @returns A binding configuration.
18
+ * @public
19
+ */
20
+ export declare function listener<T = any>(expression: Expression<T>, options?: AddEventListenerOptions): Binding<T>;
@@ -1,13 +1,27 @@
1
1
  import type { Expression } from "../observation/observable.js";
2
2
  import type { Subscriber } from "../observation/notifier.js";
3
- import { Binding } from "./html-directive.js";
3
+ import type { DOMPolicy } from "../dom.js";
4
+ import { Binding } from "./binding.js";
5
+ /**
6
+ * The gateway to signal APIs.
7
+ * @public
8
+ */
4
9
  export declare const Signal: Readonly<{
10
+ /**
11
+ * Subscribes to a signal.
12
+ * @param signal The signal to subscribe to.
13
+ * @param subscriber The subscriber.
14
+ */
5
15
  subscribe(signal: string, subscriber: Subscriber): void;
16
+ /**
17
+ * Unsubscribes from the signal.
18
+ * @param signal The signal to unsubscribe from.
19
+ * @param subscriber The subscriber.
20
+ */
6
21
  unsubscribe(signal: string, subscriber: Subscriber): void;
7
22
  /**
8
- * Sends the specified signal to signaled bindings.
23
+ * Sends the specified signal to subscribers.
9
24
  * @param signal - The signal to send.
10
- * @public
11
25
  */
12
26
  send(signal: string): void;
13
27
  }>;
@@ -15,7 +29,8 @@ export declare const Signal: Readonly<{
15
29
  * Creates a signal binding configuration with the supplied options.
16
30
  * @param expression - The binding to refresh when signaled.
17
31
  * @param options - The signal name or a binding to use to retrieve the signal name.
32
+ * @param policy - The security policy to associate with th binding.
18
33
  * @returns A binding configuration.
19
34
  * @public
20
35
  */
21
- export declare function signal<T = any>(expression: Expression<T>, options: string | Expression<T>): Binding<T>;
36
+ export declare function signal<T = any>(expression: Expression<T>, options: string | Expression<T>, policy?: DOMPolicy): Binding<T>;
@@ -1,6 +1,6 @@
1
+ import type { DOMPolicy } from "../dom.js";
1
2
  import { Expression } from "../observation/observable.js";
2
- import type { HTMLBindingDirective } from "./binding.js";
3
- import { Binding } from "./html-directive.js";
3
+ import { Binding, BindingDirective } from "./binding.js";
4
4
  /**
5
5
  * The twoWay binding options.
6
6
  * @public
@@ -16,11 +16,14 @@ export declare type TwoWayBindingOptions = {
16
16
  export interface TwoWaySettings {
17
17
  /**
18
18
  * Determines which event to listen to, to detect changes in the view.
19
- * @param directive - The directive to determine the change event for.
19
+ * @param bindingSource - The directive to determine the change event for.
20
20
  * @param target - The target element to determine the change event for.
21
21
  */
22
- determineChangeEvent(directive: HTMLBindingDirective, target: HTMLElement): string;
22
+ determineChangeEvent(bindingSource: BindingDirective, target: HTMLElement): string;
23
23
  }
24
+ /**
25
+ * Enables configuring two-way binding settings.
26
+ */
24
27
  export declare const TwoWaySettings: Readonly<{
25
28
  /**
26
29
  * Configures two-way binding.
@@ -32,8 +35,9 @@ export declare const TwoWaySettings: Readonly<{
32
35
  * Creates a default binding.
33
36
  * @param expression - The binding to refresh when changed.
34
37
  * @param optionsOrChangeEvent - The binding options or the name of the change event to use.
38
+ * @param policy - The security policy to associate with the binding.
35
39
  * @param isBindingVolatile - Indicates whether the binding is volatile or not.
36
40
  * @returns A binding.
37
41
  * @public
38
42
  */
39
- export declare function twoWay<T = any>(expression: Expression<T>, optionsOrChangeEvent?: TwoWayBindingOptions | string, isBindingVolatile?: boolean): Binding<T>;
43
+ export declare function twoWay<T = any>(expression: Expression<T>, optionsOrChangeEvent?: TwoWayBindingOptions | string, policy?: DOMPolicy, isBindingVolatile?: boolean): Binding<T>;
@@ -62,6 +62,12 @@ export declare type DecoratorAttributeConfiguration = Omit<AttributeConfiguratio
62
62
  * @public
63
63
  */
64
64
  export declare const booleanConverter: ValueConverter;
65
+ /**
66
+ * A {@link ValueConverter} that converts to and from `boolean` values. `null`, `undefined`, `""`,
67
+ * and `void` values are converted to `null`.
68
+ * @public
69
+ */
70
+ export declare const nullableBooleanConverter: ValueConverter;
65
71
  /**
66
72
  * A {@link ValueConverter} that converts to and from `number` values.
67
73
  * @remarks
@@ -1,20 +1,46 @@
1
- import type { HostBehavior, HostController } from "../styles/host.js";
2
1
  import { PropertyChangeNotifier } from "../observation/notifier.js";
2
+ import { ExecutionContext, ExpressionController, SourceLifetime } from "../observation/observable.js";
3
+ import { ElementStyles } from "../styles/element-styles.js";
4
+ import type { HostBehavior, HostController } from "../styles/host.js";
5
+ import type { StyleStrategy, StyleTarget } from "../styles/style-strategy.js";
3
6
  import type { ElementViewTemplate } from "../templating/template.js";
4
7
  import type { ElementView } from "../templating/view.js";
5
- import type { ElementStyles } from "../styles/element-styles.js";
6
8
  import { FASTElementDefinition } from "./fast-definitions.js";
9
+ /**
10
+ * A type that instantiates an ElementController
11
+ * @public
12
+ */
13
+ export interface ElementControllerStrategy {
14
+ new (element: HTMLElement, definition: FASTElementDefinition): ElementController;
15
+ }
16
+ declare const enum Stages {
17
+ connecting = 0,
18
+ connected = 1,
19
+ disconnecting = 2,
20
+ disconnected = 3
21
+ }
7
22
  /**
8
23
  * Controls the lifecycle and rendering of a `FASTElement`.
9
24
  * @public
10
25
  */
11
26
  export declare class ElementController<TElement extends HTMLElement = HTMLElement> extends PropertyChangeNotifier implements HostController<TElement> {
12
27
  private boundObservables;
13
- private needsInitialization;
28
+ protected needsInitialization: boolean;
14
29
  private hasExistingShadowRoot;
15
30
  private _template;
16
- private _isConnected;
17
- private behaviors;
31
+ protected stage: Stages;
32
+ /**
33
+ * A guard against connecting behaviors multiple times
34
+ * during connect in scenarios where a behavior adds
35
+ * another behavior during it's connectedCallback
36
+ */
37
+ private guardBehaviorConnection;
38
+ protected behaviors: Map<HostBehavior<TElement>, number> | null;
39
+ /**
40
+ * Tracks whether behaviors are connected so that
41
+ * behaviors cant be connected multiple times
42
+ */
43
+ private behaviorsConnected;
18
44
  private _mainStyles;
19
45
  /**
20
46
  * This allows Observable.getNotifier(...) to return the Controller
@@ -45,7 +71,18 @@ export declare class ElementController<TElement extends HTMLElement = HTMLElemen
45
71
  * connected to the document.
46
72
  */
47
73
  get isConnected(): boolean;
48
- private setIsConnected;
74
+ /**
75
+ * The context the expression is evaluated against.
76
+ */
77
+ get context(): ExecutionContext;
78
+ /**
79
+ * Indicates whether the controller is bound.
80
+ */
81
+ get isBound(): boolean;
82
+ /**
83
+ * Indicates how the source's lifetime relates to the controller's lifetime.
84
+ */
85
+ get sourceLifetime(): SourceLifetime | undefined;
49
86
  /**
50
87
  * Gets/sets the template used to render the component.
51
88
  * @remarks
@@ -67,6 +104,13 @@ export declare class ElementController<TElement extends HTMLElement = HTMLElemen
67
104
  * @internal
68
105
  */
69
106
  constructor(element: TElement, definition: FASTElementDefinition);
107
+ /**
108
+ * Registers an unbind handler with the controller.
109
+ * @param behavior - An object to call when the controller unbinds.
110
+ */
111
+ onUnbind(behavior: {
112
+ unbind(controller: ExpressionController<TElement>): any;
113
+ }): void;
70
114
  /**
71
115
  * Adds the behavior to the component.
72
116
  * @param behavior - The behavior to add.
@@ -92,6 +136,9 @@ export declare class ElementController<TElement extends HTMLElement = HTMLElemen
92
136
  * Runs connected lifecycle behavior on the associated element.
93
137
  */
94
138
  connect(): void;
139
+ protected bindObservables(): void;
140
+ protected connectBehaviors(): void;
141
+ protected disconnectBehaviors(): void;
95
142
  /**
96
143
  * Runs disconnected lifecycle behavior on the associated element.
97
144
  */
@@ -112,8 +159,7 @@ export declare class ElementController<TElement extends HTMLElement = HTMLElemen
112
159
  * Only emits events if connected.
113
160
  */
114
161
  emit(type: string, detail?: any, options?: Omit<CustomEventInit, "detail">): void | boolean;
115
- private finishInitialization;
116
- private renderTemplate;
162
+ protected renderTemplate(template: ElementViewTemplate | null | undefined): void;
117
163
  /**
118
164
  * Locates or creates a controller for the specified element.
119
165
  * @param element - The element to return the controller for.
@@ -123,4 +169,54 @@ export declare class ElementController<TElement extends HTMLElement = HTMLElemen
123
169
  * decorator or a call to `FASTElement.define`.
124
170
  */
125
171
  static forCustomElement(element: HTMLElement): ElementController;
172
+ /**
173
+ * Sets the strategy that ElementController.forCustomElement uses to construct
174
+ * ElementController instances for an element.
175
+ * @param strategy - The strategy to use.
176
+ */
177
+ static setStrategy(strategy: ElementControllerStrategy): void;
178
+ }
179
+ /**
180
+ * https://wicg.github.io/construct-stylesheets/
181
+ * https://developers.google.com/web/updates/2019/02/constructable-stylesheets
182
+ *
183
+ * @internal
184
+ */
185
+ export declare class AdoptedStyleSheetsStrategy implements StyleStrategy {
186
+ private static styleSheetCache;
187
+ /** @internal */
188
+ readonly sheets: CSSStyleSheet[];
189
+ constructor(styles: (string | CSSStyleSheet)[]);
190
+ addStylesTo(target: StyleTarget): void;
191
+ removeStylesFrom(target: StyleTarget): void;
192
+ }
193
+ /**
194
+ * @internal
195
+ */
196
+ export declare class StyleElementStrategy implements StyleStrategy {
197
+ private readonly styles;
198
+ private readonly styleClass;
199
+ constructor(styles: string[]);
200
+ addStylesTo(target: StyleTarget): void;
201
+ removeStylesFrom(target: StyleTarget): void;
202
+ }
203
+ /**
204
+ * An ElementController capable of hydrating FAST elements from
205
+ * Declarative Shadow DOM.
206
+ *
207
+ * @beta
208
+ */
209
+ export declare class HydratableElementController<TElement extends HTMLElement = HTMLElement> extends ElementController<TElement> {
210
+ /**
211
+ * Controls whether the controller will hydrate during the connect() method.
212
+ * Initialized during the first connect() call to true when the `needs-hydration`
213
+ * attribute is present on the element.
214
+ */
215
+ protected needsHydration?: boolean;
216
+ private static hydrationObserver;
217
+ private static hydrationObserverHandler;
218
+ connect(): void;
219
+ disconnect(): void;
220
+ static install(): void;
126
221
  }
222
+ export {};
@@ -0,0 +1,2 @@
1
+ export { HydratableElementController } from "./element-controller.js";
2
+ export * from "./hydration.js";
@@ -118,6 +118,12 @@ export declare class FASTElementDefinition<TType extends Constructable<HTMLEleme
118
118
  * that describes the element to define.
119
119
  */
120
120
  static compose<TType extends Constructable<HTMLElement> = Constructable<HTMLElement>>(type: TType, nameOrDef?: string | PartialFASTElementDefinition): FASTElementDefinition<TType>;
121
+ /**
122
+ * Registers a FASTElement base type.
123
+ * @param type - The type to register as a base type.
124
+ * @internal
125
+ */
126
+ static registerBaseType(type: Function): void;
121
127
  /**
122
128
  * Gets the element definition associated with the specified type.
123
129
  * @param type - The custom element type to retrieve the definition for.
@@ -0,0 +1,56 @@
1
+ import type { ContentTemplate, HydratableContentTemplate } from "../templating/html-binding-directive.js";
2
+ import type { ViewController } from "../templating/html-directive.js";
3
+ import type { ElementViewTemplate, HydratableElementViewTemplate, HydratableSyntheticViewTemplate, SyntheticViewTemplate } from "../templating/template.js";
4
+ import type { HydrationView } from "../templating/view.js";
5
+ /**
6
+ * Markup utilities to aid in template hydration.
7
+ * @internal
8
+ */
9
+ export declare const HydrationMarkup: Readonly<{
10
+ attributeMarkerName: "data-fe-b";
11
+ attributeBindingSeparator: " ";
12
+ contentBindingStartMarker(index: number, uniqueId: string): string;
13
+ contentBindingEndMarker(index: number, uniqueId: string): string;
14
+ repeatStartMarker(index: number): string;
15
+ repeatEndMarker(index: number): string;
16
+ isContentBindingStartMarker(content: string): boolean;
17
+ isContentBindingEndMarker(content: string): boolean;
18
+ isRepeatViewStartMarker(content: string): boolean;
19
+ isRepeatViewEndMarker(content: string): boolean;
20
+ isElementBoundaryStartMarker(node: Node): boolean;
21
+ isElementBoundaryEndMarker(node: Node): boolean;
22
+ /**
23
+ * Returns the indexes of the ViewBehaviorFactories affecting
24
+ * attributes for the element, or null if no factories were found.
25
+ */
26
+ parseAttributeBinding(node: Element): null | number[];
27
+ /**
28
+ * Parses the ViewBehaviorFactory index from string data. Returns
29
+ * the binding index or null if the index cannot be retrieved.
30
+ */
31
+ parseContentBindingStartMarker(content: string): null | [index: number, id: string];
32
+ parseContentBindingEndMarker(content: string): null | [index: number, id: string];
33
+ /**
34
+ * Parses the index of a repeat directive from a content string.
35
+ */
36
+ parseRepeatStartMarker(content: string): null | number;
37
+ parseRepeatEndMarker(content: string): null | number;
38
+ /**
39
+ * Parses element Id from element boundary markers
40
+ */
41
+ parseElementBoundaryStartMarker(content: string): null | string;
42
+ parseElementBoundaryEndMarker(content: string): null | string;
43
+ }>;
44
+ /**
45
+ * @internal
46
+ */
47
+ export declare const Hydratable: unique symbol;
48
+ /**
49
+ * Tests if a template or ViewController is hydratable.
50
+ *
51
+ * @beta
52
+ */
53
+ export declare function isHydratable(view: ViewController): view is HydrationView;
54
+ export declare function isHydratable<TSource = any, TParent = any>(template: SyntheticViewTemplate<TSource, TParent>): template is HydratableSyntheticViewTemplate<TSource, TParent>;
55
+ export declare function isHydratable<TSource = any, TParent = any>(template: ElementViewTemplate<TSource, TParent>): template is HydratableElementViewTemplate<TSource, TParent>;
56
+ export declare function isHydratable(template: ContentTemplate): template is HydratableContentTemplate;
@@ -0,0 +1 @@
1
+ import "../templating/install-hydratable-view-templates.js";
@@ -1,4 +1,4 @@
1
- import { Constructable } from "./interfaces.js";
1
+ import { Constructable, ParameterDecorator } from "./interfaces.js";
2
2
  /**
3
3
  * A Context object defines an optional initial value for a Context, as well as a name identifier for debugging purposes.
4
4
  * @public
@@ -11,44 +11,52 @@ export declare type Context<T> = {
11
11
  * A constant key that can be used to represent a Context dependency.
12
12
  * The key can be used for context or DI but also doubles as a decorator for
13
13
  * resolving the associated dependency.
14
- * @beta
14
+ * @public
15
15
  */
16
16
  export declare type ContextDecorator<T = any> = Readonly<Context<T>> & PropertyDecorator & ParameterDecorator;
17
17
  /**
18
18
  * A Context object defines an optional initial value for a Context, as well as a name identifier for debugging purposes.
19
19
  * The FASTContext can also be used as a decorator to declare context dependencies or as a key for DI.
20
- * @beta
20
+ * @public
21
21
  */
22
22
  export declare type FASTContext<T> = ContextDecorator<T> & {
23
23
  get(target: EventTarget): T;
24
24
  provide(target: EventTarget, value: T): void;
25
25
  request(target: EventTarget, callback: ContextCallback<T>, multiple?: boolean): void;
26
- handle(target: EventTarget, callback: (event: ContextEvent<FASTContext<T>>) => void): any;
26
+ handle(target: EventTarget, callback: (event: ContextEvent<FASTContext<T>>) => void): void;
27
27
  };
28
28
  /**
29
29
  * A strategy that controls how all Context.request API calls are handled.
30
30
  * @remarks
31
- * By default this is handled via Context.dispatch, which dispatched a ContextEvent.
32
- * @beta
31
+ * By default this is handled via Context.dispatch, which dispatches a ContextEvent.
32
+ * @public
33
33
  */
34
34
  export declare type FASTContextRequestStrategy = <T extends UnknownContext>(target: EventTarget, context: T, callback: ContextCallback<ContextType<T>>, multiple: any) => void;
35
35
  declare const contextEventType = "context-request";
36
36
  /**
37
- * Enables using the {@link https://github.com/webcomponents-cg/community-protocols/blob/main/proposals/context.md | W3C Community Context protocol.}
38
- * @beta
37
+ * Enables using:
38
+ * {@link https://github.com/webcomponents-cg/community-protocols/blob/main/proposals/context.md | W3C Community Context protocol.}
39
+ * @public
39
40
  */
40
41
  export declare const Context: Readonly<{
41
42
  /**
42
43
  * The event type used for W3C Context Protocol requests.
43
44
  */
44
45
  eventType: "context-request";
46
+ /**
47
+ * Returns a FASTContext object from the global context registry matching the given name if found.
48
+ * Otherwise, returns a new FASTContext with this name.
49
+ * @param name - The name of the FASTContext to get or create.
50
+ * @returns A FASTContext object.
51
+ */
52
+ for<T = unknown>(name: string): FASTContext<T>;
45
53
  /**
46
54
  * Creates a W3C Community Protocol-based Context object to use in requesting/providing
47
55
  * context through the DOM.
48
56
  * @param name - The name to use for the connext. Useful in debugging.
49
57
  * @param initialValue - An optional initial value to use if a context handler isn't found.
50
58
  */
51
- create<T = unknown>(name: string, initialValue?: T | undefined): FASTContext<T>;
59
+ create<T_1 = unknown>(name: string, initialValue?: T_1 | undefined): FASTContext<T_1>;
52
60
  /**
53
61
  * Sets the strategy used by all FAST-specific context requests made through the
54
62
  * Context.request, Context.get, Context.defineProperty, and ContextDecorator APIs.
@@ -65,7 +73,7 @@ export declare const Context: Readonly<{
65
73
  * Uses the default request strategy to locate the context. If no context is found
66
74
  * then the initial value of the context is returned.
67
75
  */
68
- get<T_1 extends UnknownContext>(target: EventTarget, context: T_1): ContextType<T_1>;
76
+ get<T_2 extends UnknownContext>(target: EventTarget, context: T_2): ContextType<T_2>;
69
77
  /**
70
78
  * Requests the context value for the target node.
71
79
  * @param target - The target to request the context for.
@@ -76,7 +84,7 @@ export declare const Context: Readonly<{
76
84
  * @remarks
77
85
  * Uses the default request strategy to locate the context.
78
86
  */
79
- request<T_2 extends UnknownContext>(target: EventTarget, context: T_2, callback: ContextCallback<ContextType<T_2>>, multiple?: boolean): void;
87
+ request<T_3 extends UnknownContext>(target: EventTarget, context: T_3, callback: ContextCallback<ContextType<T_3>>, multiple?: boolean): void;
80
88
  /**
81
89
  *
82
90
  * @param target - The target to dispatch the context event on.
@@ -88,8 +96,14 @@ export declare const Context: Readonly<{
88
96
  * This API does NOT use the default request strategy. It always dispatches
89
97
  * an event through the DOM.
90
98
  */
91
- dispatch<T_3 extends UnknownContext>(target: EventTarget, context: T_3, callback: ContextCallback<ContextType<T_3>>, multiple?: boolean): void;
92
- provide<T_4 extends UnknownContext>(target: EventTarget, context: T_4, value: ContextType<T_4>): void;
99
+ dispatch<T_4 extends UnknownContext>(target: EventTarget, context: T_4, callback: ContextCallback<ContextType<T_4>>, multiple?: boolean): void;
100
+ /**
101
+ * Enables an event target to provide a context value.
102
+ * @param target The target to provide the context value for.
103
+ * @param context The context to provide the value for.
104
+ * @param value The value to provide for the context.
105
+ */
106
+ provide<T_5 extends UnknownContext>(target: EventTarget, context: T_5, value: ContextType<T_5>): void;
93
107
  /**
94
108
  *
95
109
  * @param target - The target on which to handle context requests.
@@ -99,7 +113,7 @@ export declare const Context: Readonly<{
99
113
  * If a context is not provided then the callback will be invoked for all context
100
114
  * requests that are received on the target.
101
115
  */
102
- handle<T_5 extends UnknownContext>(target: EventTarget, callback: (event: ContextEvent<T_5>) => void, context?: T_5 | undefined): void;
116
+ handle<T_6 extends UnknownContext>(target: EventTarget, callback: (event: ContextEvent<T_6>) => void, context?: T_6 | undefined): void;
103
117
  /**
104
118
  * Defines a getter-only property on the target that will return the context
105
119
  * value for the target.
@@ -110,7 +124,7 @@ export declare const Context: Readonly<{
110
124
  * Uses the default request strategy to locate the context and will return the
111
125
  * initialValue if the context isn't handled.
112
126
  */
113
- defineProperty<T_6 extends UnknownContext>(target: Constructable<EventTarget> | EventTarget, propertyName: string, context: T_6): void;
127
+ defineProperty<T_7 extends UnknownContext>(target: Constructable<EventTarget> | EventTarget, propertyName: string, context: T_7): void;
114
128
  }>;
115
129
  /**
116
130
  * An unknown context type.
@@ -477,11 +477,6 @@ export declare const DI: Readonly<{
477
477
  * in addition to its standard use in an inject array or through direct container APIs.
478
478
  */
479
479
  createContext: typeof createContext;
480
- /**
481
- * @deprecated
482
- * Use DI.createContext instead.
483
- */
484
- createInterface: typeof createContext;
485
480
  /**
486
481
  * A decorator that specifies what to inject into its target.
487
482
  * @param dependencies - The dependencies to inject.
@@ -0,0 +1,83 @@
1
+ import { DOMAspect, DOMPolicy, DOMSink } from "./dom.js";
2
+ import { TrustedTypesPolicy } from "./interfaces.js";
3
+ /**
4
+ * A specific DOM sink guard for a node aspect.
5
+ * @public
6
+ */
7
+ export declare type DOMSinkGuards = Record<string, (tagName: string | null, aspect: DOMAspect, aspectName: string, sink: DOMSink) => DOMSink>;
8
+ /**
9
+ * Aspect-specific guards for a DOM Policy.
10
+ * @public
11
+ */
12
+ export declare type DOMAspectGuards = {
13
+ /**
14
+ * Guards for attributes.
15
+ */
16
+ [DOMAspect.attribute]?: DOMSinkGuards;
17
+ /**
18
+ * Guards for boolean attributes.
19
+ */
20
+ [DOMAspect.booleanAttribute]?: DOMSinkGuards;
21
+ /**
22
+ * Guards for properties.
23
+ */
24
+ [DOMAspect.property]?: DOMSinkGuards;
25
+ /**
26
+ * Guards for content.
27
+ */
28
+ [DOMAspect.content]?: DOMSinkGuards;
29
+ /**
30
+ * Guards for token list manipulation.
31
+ */
32
+ [DOMAspect.tokenList]?: DOMSinkGuards;
33
+ /**
34
+ * Guards for events.
35
+ */
36
+ [DOMAspect.event]?: DOMSinkGuards;
37
+ };
38
+ /**
39
+ * Element-specific guards for a DOM Policy.
40
+ * @public
41
+ */
42
+ export declare type DOMElementGuards = Record<string, DOMAspectGuards>;
43
+ /**
44
+ * Guard configuration for a DOM Policy.
45
+ * @public
46
+ */
47
+ export declare type DOMGuards = {
48
+ /**
49
+ * Guards for specific elements.
50
+ */
51
+ elements: DOMElementGuards;
52
+ /**
53
+ * General aspect guards independent of the element type.
54
+ */
55
+ aspects: DOMAspectGuards;
56
+ };
57
+ /**
58
+ * Options for creating a DOM Policy.
59
+ * @public
60
+ */
61
+ export declare type DOMPolicyOptions = {
62
+ /**
63
+ * The trusted type to use for HTML creation.
64
+ */
65
+ trustedType?: TrustedTypesPolicy;
66
+ /**
67
+ * The DOM guards used to override or extend the defaults.
68
+ */
69
+ guards?: Partial<DOMGuards>;
70
+ };
71
+ /**
72
+ * A helper for creating DOM policies.
73
+ * @public
74
+ */
75
+ declare const DOMPolicy: Readonly<{
76
+ /**
77
+ * Creates a new DOM Policy object.
78
+ * @param options The options to use in creating the policy.
79
+ * @returns The newly created DOMPolicy.
80
+ */
81
+ create(options?: DOMPolicyOptions): Readonly<DOMPolicy>;
82
+ }>;
83
+ export { DOMPolicy };