@microsoft/fast-element 2.10.4 → 3.0.0-rc.2

package/dist/esm/pending-task.js

@@ -1,28 +0,0 @@
-/**
- * A concrete implementation of {@link PendingTask}
- * @public
- */
-export class PendingTaskEvent extends Event {
-    /**
-     * Creates an instance of PendingTaskEvent.
-     * @param complete - A promise that resolves when the pending task is complete.
-     */
-    constructor(complete) {
-        super(PendingTaskEvent.type, { bubbles: true, composed: true });
-        this.complete = complete;
-    }
-    /**
-     * Determines whether a value is a PendingTaskEvent.
-     * @param value - The value to check.
-     * @returns True if the value is a PendingTaskEvent; false otherwise.
-     */
-    static isPendingTask(value) {
-        var _a;
-        return (value.type === PendingTaskEvent.type &&
-            typeof ((_a = value.complete) === null || _a === void 0 ? void 0 : _a.then) === "function");
-    }
-}
-/**
- * The type of the pending task event.
- */
-PendingTaskEvent.type = "pending-task";

package/dist/esm/polyfills.js

@@ -1,60 +0,0 @@
-/* eslint-disable @typescript-eslint/ban-ts-comment */
-(function ensureGlobalThis() {
-    if (typeof globalThis !== "undefined") {
-        // We're running in a modern environment.
-        return;
-    }
-    // @ts-ignore
-    if (typeof global !== "undefined") {
-        // We're running in NodeJS
-        // @ts-ignore
-        global.globalThis = global;
-    }
-    else if (typeof self !== "undefined") {
-        self.globalThis = self;
-    }
-    else if (typeof window !== "undefined") {
-        // We're running in the browser's main thread.
-        window.globalThis = window;
-    }
-    else {
-        // Hopefully we never get here...
-        // Not all environments allow eval and Function. Use only as a last resort:
-        // eslint-disable-next-line no-new-func
-        const result = new Function("return this")();
-        result.globalThis = result;
-    }
-})();
-(function requestIdleCallbackPolyfill() {
-    if ("requestIdleCallback" in globalThis) {
-        return;
-    }
-    /**
-     * A polyfill for requestIdleCallback that falls back to setTimeout.
-     *
-     * @param callback - The function to call when the browser is idle.
-     * @param options - Options object that may contain a timeout property.
-     * @returns An ID that can be used to cancel the callback.
-     * @public
-     */
-    globalThis.requestIdleCallback = function requestIdleCallback(callback, options) {
-        const start = Date.now();
-        return setTimeout(() => {
-            callback({
-                didTimeout: (options === null || options === void 0 ? void 0 : options.timeout)
-                    ? Date.now() - start >= options.timeout
-                    : false,
-                timeRemaining: () => 0,
-            });
-        }, 1);
-    };
-    /**
-     * A polyfill for cancelIdleCallback that falls back to clearTimeout.
-     *
-     * @param id - The ID of the callback to cancel.
-     * @public
-     */
-    globalThis.cancelIdleCallback = function cancelIdleCallback(id) {
-        clearTimeout(id);
-    };
-})();

package/dist/esm/styles/css-binding-directive.js

@@ -1,76 +0,0 @@
-import { CSSDirective } from "./css-directive.js";
-function handleChange(directive, controller, observer) {
-    controller.source.style.setProperty(directive.targetAspect, observer.bind(controller));
-}
-/**
- * Enables bindings in CSS.
- *
- * @public
- */
-export class CSSBindingDirective {
-    /**
-     * Creates an instance of CSSBindingDirective.
-     * @param dataBinding - The binding to use in CSS.
-     * @param targetAspect - The CSS property to target.
-     */
-    constructor(dataBinding, targetAspect) {
-        this.dataBinding = dataBinding;
-        this.targetAspect = targetAspect;
-    }
-    /**
-     * Creates a CSS fragment to interpolate into the CSS document.
-     * @returns - the string to interpolate into CSS
-     */
-    createCSS(add) {
-        add(this);
-        return `var(${this.targetAspect})`;
-    }
-    /**
-     * Executed when this behavior is attached to a controller.
-     * @param controller - Controls the behavior lifecycle.
-     */
-    addedCallback(controller) {
-        var _a;
-        const element = controller.source;
-        if (!element.$cssBindings) {
-            element.$cssBindings = new Map();
-            const setAttribute = element.setAttribute;
-            element.setAttribute = (attr, value) => {
-                setAttribute.call(element, attr, value);
-                if (attr === "style") {
-                    element.$cssBindings.forEach((v, k) => handleChange(k, v.controller, v.observer));
-                }
-            };
-        }
-        const observer = (_a = controller[this.targetAspect]) !== null && _a !== void 0 ? _a : (controller[this.targetAspect] = this.dataBinding.createObserver(this, this));
-        observer.controller = controller;
-        controller.source.$cssBindings.set(this, { controller, observer });
-    }
-    /**
-     * Executed when this behavior's host is connected.
-     * @param controller - Controls the behavior lifecycle.
-     */
-    connectedCallback(controller) {
-        handleChange(this, controller, controller[this.targetAspect]);
-    }
-    /**
-     * Executed when this behavior is detached from a controller.
-     * @param controller - Controls the behavior lifecycle.
-     */
-    removedCallback(controller) {
-        if (controller.source.$cssBindings) {
-            controller.source.$cssBindings.delete(this);
-        }
-    }
-    /**
-     * Called when a subject this instance has subscribed to changes.
-     * @param subject - The subject of the change.
-     * @param args - The event args detailing the change that occurred.
-     *
-     * @internal
-     */
-    handleChange(_, observer) {
-        handleChange(this, observer.controller, observer);
-    }
-}
-CSSDirective.define(CSSBindingDirective);

package/dist/esm/templating/install-hydratable-view-templates.js

@@ -1,23 +0,0 @@
-import { Hydratable } from "../components/hydration.js";
-import { ViewTemplate } from "./template.js";
-import { HydrationView } from "./view.js";
-// Configure ViewTemplate to be hydratable by attaching a symbol identifier
-// and a hydrate method. Augmenting the hydration features is done by
-// property assignment instead of class extension to better allow the
-// hydration feature to be tree-shaken.
-//
-// When hydrate() is called, it creates a HydrationView that wraps the
-// pre-rendered DOM range (firstChild → lastChild) instead of cloning a
-// compiled DocumentFragment. The HydrationView will then use
-// buildViewBindingTargets() to scan for hydration markers and attach
-// reactive bindings to the existing DOM nodes.
-Object.defineProperties(ViewTemplate.prototype, {
-    [Hydratable]: { value: Hydratable, enumerable: false, configurable: false },
-    hydrate: {
-        value: function (firstChild, lastChild, hostBindingTarget) {
-            return new HydrationView(firstChild, lastChild, this, hostBindingTarget);
-        },
-        enumerable: true,
-        configurable: false,
-    },
-});

package/docs/ACKNOWLEDGEMENTS.md

@@ -1,12 +0,0 @@
-# Acknowledgements
-
-There are many great open source projects that have inspired us and enabled us to build FAST. Below are a few that stand out.
-
-* [.NET](https://dotnet.microsoft.com/) - Many thanks to the .NET team for sharing their policies and practices upon which our issue management and release planning docs and practices were based.
-* [asap](https://github.com/kriskowal/asap) - An awesome, time-tested async task queue implementation that heavily inspired our DOM update system.
-* [Aurelia 1 and Aurelia 2](https://aurelia.io/) - Various details of Aurelia 2's decorator and metadata model inspired us in the design of `fast-element`. Additionally, Aurelia 1's mechanisms for array observation, binding, and template compilation also guided us in our work.
-* [faastjs](https://github.com/faastjs) - A project with a similar name but a very different purpose. Their API documentation approach leveraging [api-extractor](https://api-extractor.com/) was a huge help to us.
-* [Knockout](https://knockoutjs.com/) - One of the first JavaScript libraries (if not the first) to implement an observer system. The original techniques for observables and computed observables have influenced many libraries over the years. Re-interpreting these ideas in terms of modern JavaScript and DOM has helped us to build a powerful and robust system.
-* [lit-html](https://lit-html.polymer-project.org/) - One of the first libraries to leverage standard JavaScript tagged template literals for HTML templates. We were inspired by this technique and wanted to explore whether it could be combined with our idea of arrow function binding expressions.
-* [Polymer](https://www.polymer-project.org/) - One of the first libraries (if not the first) to embrace Web Components.
-* [Vue](https://vuejs.org/) - We liked the terseness of the `:` and `@` syntax in templates, so we adapted it along with some modifications in our templates.