@genesislcap/web-core 14.157.0

package/README.md

@@ -0,0 +1,67 @@
+# Genesis Foundation Web Core
+
+[![lerna](https://img.shields.io/badge/maintained%20with-lerna-cc00ff.svg)](https://lerna.js.org/)
+[![TypeScript](https://img.shields.io/badge/%3C%2F%3E-TypeScript-%230074c1.svg)](https://www.typescriptlang.org/)
+
+`foundation-web-core` re-exports FAST classes.
+
+## [API Docs](./docs/api/index.md)
+
+## Installation
+
+```sh
+npm i @genesislcap/foundation-web-core
+```
+
+## Features
+
+### Re-exported FAST Packages
+
+This package re-exports the following Microsoft FAST packages:
+
+- **fast-colors**: Provides color utilities and color system support.
+- **fast-components**: Collection of web components designed according to the FAST Design System.
+- **fast-element**: Lightweight base class for creating custom elements.
+- **fast-foundation**: Provides foundational behaviors and utilities for web components.
+- **fast-router**: Router implementation for single-page applications.
+- **fast-web-utilities**: Collection of utility functions for web component development.
+
+### Directives
+
+Additionally, this package exports a `directives` folder containing the following files:
+
+- **sync.ts**: Implementation of a directive for synchronous data binding.
+- **when-else.ts**: Implementation of a directive for conditional rendering using `whenElse` clause.
+
+## Usage
+
+To utilize the features provided by this package, you can import `@genesislcap/foundation-web-core`.
+
+```typescript
+import { css, customElement, FASTElement, html, sync } from '@genesislcap/foundation-web-core';
+
+@customElement({
+  name: 'my-custom-element',
+  template: html`
+    <other-custom-element
+      value="${sync((x) => x.syncedValue)}"
+    ></other-custom-element>
+  `,
+  styles: css`
+    :host {
+      ...
+    }
+  `,
+})
+export class MyCustomElement extends FASTElement { 
+  ...
+}
+```
+
+## License
+
+Note: this project provides front-end dependencies and uses licensed components listed in the next section; thus, licenses for those components are required during development. Contact [Genesis Global](https://genesis.global/contact-us/) for more details.
+
+### Licensed components
+
+Genesis low-code platform

package/dist/cjs/FAST/fast-colors.js

@@ -0,0 +1,7 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.parseColorHexRGB = exports.ComponentStateColorPalette = exports.ColorRGBA64 = void 0;
+var fast_colors_1 = require("@microsoft/fast-colors");
+Object.defineProperty(exports, "ColorRGBA64", { enumerable: true, get: function () { return fast_colors_1.ColorRGBA64; } });
+Object.defineProperty(exports, "ComponentStateColorPalette", { enumerable: true, get: function () { return fast_colors_1.ComponentStateColorPalette; } });
+Object.defineProperty(exports, "parseColorHexRGB", { enumerable: true, get: function () { return fast_colors_1.parseColorHexRGB; } });

package/dist/cjs/FAST/fast-components.js

@@ -0,0 +1,4 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const tslib_1 = require("tslib");
+tslib_1.__exportStar(require("@microsoft/fast-components"), exports);

package/dist/cjs/FAST/fast-element.js

@@ -0,0 +1,30 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.when = exports.volatile = exports.ViewTemplate = exports.slotted = exports.repeat = exports.ref = exports.observable = exports.Observable = exports.nullableNumberConverter = exports.HTMLView = exports.HTMLBindingDirective = exports.html = exports.FASTElementDefinition = exports.FASTElement = exports.ExecutionContext = exports.ElementStyles = exports.elements = exports.DOM = exports.defaultExecutionContext = exports.customElement = exports.cssPartial = exports.CSSDirective = exports.css = exports.children = exports.BindingBehavior = exports.attr = void 0;
+var fast_element_1 = require("@microsoft/fast-element");
+Object.defineProperty(exports, "attr", { enumerable: true, get: function () { return fast_element_1.attr; } });
+Object.defineProperty(exports, "BindingBehavior", { enumerable: true, get: function () { return fast_element_1.BindingBehavior; } });
+Object.defineProperty(exports, "children", { enumerable: true, get: function () { return fast_element_1.children; } });
+Object.defineProperty(exports, "css", { enumerable: true, get: function () { return fast_element_1.css; } });
+Object.defineProperty(exports, "CSSDirective", { enumerable: true, get: function () { return fast_element_1.CSSDirective; } });
+Object.defineProperty(exports, "cssPartial", { enumerable: true, get: function () { return fast_element_1.cssPartial; } });
+Object.defineProperty(exports, "customElement", { enumerable: true, get: function () { return fast_element_1.customElement; } });
+Object.defineProperty(exports, "defaultExecutionContext", { enumerable: true, get: function () { return fast_element_1.defaultExecutionContext; } });
+Object.defineProperty(exports, "DOM", { enumerable: true, get: function () { return fast_element_1.DOM; } });
+Object.defineProperty(exports, "elements", { enumerable: true, get: function () { return fast_element_1.elements; } });
+Object.defineProperty(exports, "ElementStyles", { enumerable: true, get: function () { return fast_element_1.ElementStyles; } });
+Object.defineProperty(exports, "ExecutionContext", { enumerable: true, get: function () { return fast_element_1.ExecutionContext; } });
+Object.defineProperty(exports, "FASTElement", { enumerable: true, get: function () { return fast_element_1.FASTElement; } });
+Object.defineProperty(exports, "FASTElementDefinition", { enumerable: true, get: function () { return fast_element_1.FASTElementDefinition; } });
+Object.defineProperty(exports, "html", { enumerable: true, get: function () { return fast_element_1.html; } });
+Object.defineProperty(exports, "HTMLBindingDirective", { enumerable: true, get: function () { return fast_element_1.HTMLBindingDirective; } });
+Object.defineProperty(exports, "HTMLView", { enumerable: true, get: function () { return fast_element_1.HTMLView; } });
+Object.defineProperty(exports, "nullableNumberConverter", { enumerable: true, get: function () { return fast_element_1.nullableNumberConverter; } });
+Object.defineProperty(exports, "Observable", { enumerable: true, get: function () { return fast_element_1.Observable; } });
+Object.defineProperty(exports, "observable", { enumerable: true, get: function () { return fast_element_1.observable; } });
+Object.defineProperty(exports, "ref", { enumerable: true, get: function () { return fast_element_1.ref; } });
+Object.defineProperty(exports, "repeat", { enumerable: true, get: function () { return fast_element_1.repeat; } });
+Object.defineProperty(exports, "slotted", { enumerable: true, get: function () { return fast_element_1.slotted; } });
+Object.defineProperty(exports, "ViewTemplate", { enumerable: true, get: function () { return fast_element_1.ViewTemplate; } });
+Object.defineProperty(exports, "volatile", { enumerable: true, get: function () { return fast_element_1.volatile; } });
+Object.defineProperty(exports, "when", { enumerable: true, get: function () { return fast_element_1.when; } });

package/dist/cjs/FAST/fast-foundation.js

@@ -0,0 +1,64 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.tabPanelTemplate = exports.tabTemplate = exports.switchTemplate = exports.startSlotTemplate = exports.sliderLabelTemplate = exports.skeletonTemplate = exports.selectTemplate = exports.radioGroupTemplate = exports.radioTemplate = exports.Registration = exports.PropertyStyleSheetBehavior = exports.progressRingTemplate = exports.progressTemplate = exports.optional = exports.menuItemTemplate = exports.menuTemplate = exports.listboxOptionTemplate = exports.listboxTemplate = exports.inject = exports.horizontalScrollTemplate = exports.FormAssociated = exports.forcedColorsStylesheetBehavior = exports.FoundationElementRegistry = exports.FoundationElement = exports.flipperTemplate = exports.endSlotTemplate = exports.dividerTemplate = exports.display = exports.disclosureTemplate = exports.DI = exports.DesignToken = exports.DesignSystem = exports.dataGridRowTemplate = exports.dataGridCellTemplate = exports.dataGridTemplate = exports.Container = exports.ComboboxAutocomplete = exports.composedParent = exports.checkboxTemplate = exports.cardTemplate = exports.calendarTemplate = exports.buttonTemplate = exports.breadcrumbTemplate = exports.breadcrumbItemTemplate = exports.badgeTemplate = exports.avatarTemplate = exports.anchoredRegionTemplate = exports.anchorTemplate = exports.accordionTemplate = exports.accordionItemTemplate = void 0;
+exports.whitespaceFilter = exports.treeViewTemplate = exports.treeItemTemplate = exports.tooltipTemplate = exports.TooltipPosition = exports.toolbarTemplate = exports.textAreaTemplate = exports.TabsOrientation = exports.tabsTemplate = void 0;
+var fast_foundation_1 = require("@microsoft/fast-foundation");
+Object.defineProperty(exports, "accordionItemTemplate", { enumerable: true, get: function () { return fast_foundation_1.accordionItemTemplate; } });
+Object.defineProperty(exports, "accordionTemplate", { enumerable: true, get: function () { return fast_foundation_1.accordionTemplate; } });
+Object.defineProperty(exports, "anchorTemplate", { enumerable: true, get: function () { return fast_foundation_1.anchorTemplate; } });
+Object.defineProperty(exports, "anchoredRegionTemplate", { enumerable: true, get: function () { return fast_foundation_1.anchoredRegionTemplate; } });
+Object.defineProperty(exports, "avatarTemplate", { enumerable: true, get: function () { return fast_foundation_1.avatarTemplate; } });
+Object.defineProperty(exports, "badgeTemplate", { enumerable: true, get: function () { return fast_foundation_1.badgeTemplate; } });
+Object.defineProperty(exports, "breadcrumbItemTemplate", { enumerable: true, get: function () { return fast_foundation_1.breadcrumbItemTemplate; } });
+Object.defineProperty(exports, "breadcrumbTemplate", { enumerable: true, get: function () { return fast_foundation_1.breadcrumbTemplate; } });
+Object.defineProperty(exports, "buttonTemplate", { enumerable: true, get: function () { return fast_foundation_1.buttonTemplate; } });
+Object.defineProperty(exports, "calendarTemplate", { enumerable: true, get: function () { return fast_foundation_1.calendarTemplate; } });
+Object.defineProperty(exports, "cardTemplate", { enumerable: true, get: function () { return fast_foundation_1.cardTemplate; } });
+Object.defineProperty(exports, "checkboxTemplate", { enumerable: true, get: function () { return fast_foundation_1.checkboxTemplate; } });
+Object.defineProperty(exports, "composedParent", { enumerable: true, get: function () { return fast_foundation_1.composedParent; } });
+Object.defineProperty(exports, "ComboboxAutocomplete", { enumerable: true, get: function () { return fast_foundation_1.ComboboxAutocomplete; } });
+Object.defineProperty(exports, "Container", { enumerable: true, get: function () { return fast_foundation_1.Container; } });
+Object.defineProperty(exports, "dataGridTemplate", { enumerable: true, get: function () { return fast_foundation_1.dataGridTemplate; } });
+Object.defineProperty(exports, "dataGridCellTemplate", { enumerable: true, get: function () { return fast_foundation_1.dataGridCellTemplate; } });
+Object.defineProperty(exports, "dataGridRowTemplate", { enumerable: true, get: function () { return fast_foundation_1.dataGridRowTemplate; } });
+Object.defineProperty(exports, "DesignSystem", { enumerable: true, get: function () { return fast_foundation_1.DesignSystem; } });
+Object.defineProperty(exports, "DesignToken", { enumerable: true, get: function () { return fast_foundation_1.DesignToken; } });
+Object.defineProperty(exports, "DI", { enumerable: true, get: function () { return fast_foundation_1.DI; } });
+Object.defineProperty(exports, "disclosureTemplate", { enumerable: true, get: function () { return fast_foundation_1.disclosureTemplate; } });
+Object.defineProperty(exports, "display", { enumerable: true, get: function () { return fast_foundation_1.display; } });
+Object.defineProperty(exports, "dividerTemplate", { enumerable: true, get: function () { return fast_foundation_1.dividerTemplate; } });
+Object.defineProperty(exports, "endSlotTemplate", { enumerable: true, get: function () { return fast_foundation_1.endSlotTemplate; } });
+Object.defineProperty(exports, "flipperTemplate", { enumerable: true, get: function () { return fast_foundation_1.flipperTemplate; } });
+Object.defineProperty(exports, "FoundationElement", { enumerable: true, get: function () { return fast_foundation_1.FoundationElement; } });
+Object.defineProperty(exports, "FoundationElementRegistry", { enumerable: true, get: function () { return fast_foundation_1.FoundationElementRegistry; } });
+Object.defineProperty(exports, "forcedColorsStylesheetBehavior", { enumerable: true, get: function () { return fast_foundation_1.forcedColorsStylesheetBehavior; } });
+Object.defineProperty(exports, "FormAssociated", { enumerable: true, get: function () { return fast_foundation_1.FormAssociated; } });
+Object.defineProperty(exports, "horizontalScrollTemplate", { enumerable: true, get: function () { return fast_foundation_1.horizontalScrollTemplate; } });
+Object.defineProperty(exports, "inject", { enumerable: true, get: function () { return fast_foundation_1.inject; } });
+Object.defineProperty(exports, "listboxTemplate", { enumerable: true, get: function () { return fast_foundation_1.listboxTemplate; } });
+Object.defineProperty(exports, "listboxOptionTemplate", { enumerable: true, get: function () { return fast_foundation_1.listboxOptionTemplate; } });
+Object.defineProperty(exports, "menuTemplate", { enumerable: true, get: function () { return fast_foundation_1.menuTemplate; } });
+Object.defineProperty(exports, "menuItemTemplate", { enumerable: true, get: function () { return fast_foundation_1.menuItemTemplate; } });
+Object.defineProperty(exports, "optional", { enumerable: true, get: function () { return fast_foundation_1.optional; } });
+Object.defineProperty(exports, "progressTemplate", { enumerable: true, get: function () { return fast_foundation_1.progressTemplate; } });
+Object.defineProperty(exports, "progressRingTemplate", { enumerable: true, get: function () { return fast_foundation_1.progressRingTemplate; } });
+Object.defineProperty(exports, "PropertyStyleSheetBehavior", { enumerable: true, get: function () { return fast_foundation_1.PropertyStyleSheetBehavior; } });
+Object.defineProperty(exports, "Registration", { enumerable: true, get: function () { return fast_foundation_1.Registration; } });
+Object.defineProperty(exports, "radioTemplate", { enumerable: true, get: function () { return fast_foundation_1.radioTemplate; } });
+Object.defineProperty(exports, "radioGroupTemplate", { enumerable: true, get: function () { return fast_foundation_1.radioGroupTemplate; } });
+Object.defineProperty(exports, "selectTemplate", { enumerable: true, get: function () { return fast_foundation_1.selectTemplate; } });
+Object.defineProperty(exports, "skeletonTemplate", { enumerable: true, get: function () { return fast_foundation_1.skeletonTemplate; } });
+Object.defineProperty(exports, "sliderLabelTemplate", { enumerable: true, get: function () { return fast_foundation_1.sliderLabelTemplate; } });
+Object.defineProperty(exports, "startSlotTemplate", { enumerable: true, get: function () { return fast_foundation_1.startSlotTemplate; } });
+Object.defineProperty(exports, "switchTemplate", { enumerable: true, get: function () { return fast_foundation_1.switchTemplate; } });
+Object.defineProperty(exports, "tabTemplate", { enumerable: true, get: function () { return fast_foundation_1.tabTemplate; } });
+Object.defineProperty(exports, "tabPanelTemplate", { enumerable: true, get: function () { return fast_foundation_1.tabPanelTemplate; } });
+Object.defineProperty(exports, "tabsTemplate", { enumerable: true, get: function () { return fast_foundation_1.tabsTemplate; } });
+Object.defineProperty(exports, "TabsOrientation", { enumerable: true, get: function () { return fast_foundation_1.TabsOrientation; } });
+Object.defineProperty(exports, "textAreaTemplate", { enumerable: true, get: function () { return fast_foundation_1.textAreaTemplate; } });
+Object.defineProperty(exports, "toolbarTemplate", { enumerable: true, get: function () { return fast_foundation_1.toolbarTemplate; } });
+Object.defineProperty(exports, "TooltipPosition", { enumerable: true, get: function () { return fast_foundation_1.TooltipPosition; } });
+Object.defineProperty(exports, "tooltipTemplate", { enumerable: true, get: function () { return fast_foundation_1.tooltipTemplate; } });
+Object.defineProperty(exports, "treeItemTemplate", { enumerable: true, get: function () { return fast_foundation_1.treeItemTemplate; } });
+Object.defineProperty(exports, "treeViewTemplate", { enumerable: true, get: function () { return fast_foundation_1.treeViewTemplate; } });
+Object.defineProperty(exports, "whitespaceFilter", { enumerable: true, get: function () { return fast_foundation_1.whitespaceFilter; } });

package/dist/cjs/FAST/fast-router.js

@@ -0,0 +1,11 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.RouterConfiguration = exports.Router = exports.RouteCollection = exports.Route = exports.FASTRouter = exports.FASTElementLayout = exports.DefaultRouteRecognizer = void 0;
+var fast_router_1 = require("@microsoft/fast-router");
+Object.defineProperty(exports, "DefaultRouteRecognizer", { enumerable: true, get: function () { return fast_router_1.DefaultRouteRecognizer; } });
+Object.defineProperty(exports, "FASTElementLayout", { enumerable: true, get: function () { return fast_router_1.FASTElementLayout; } });
+Object.defineProperty(exports, "FASTRouter", { enumerable: true, get: function () { return fast_router_1.FASTRouter; } });
+Object.defineProperty(exports, "Route", { enumerable: true, get: function () { return fast_router_1.Route; } });
+Object.defineProperty(exports, "RouteCollection", { enumerable: true, get: function () { return fast_router_1.RouteCollection; } });
+Object.defineProperty(exports, "Router", { enumerable: true, get: function () { return fast_router_1.Router; } });
+Object.defineProperty(exports, "RouterConfiguration", { enumerable: true, get: function () { return fast_router_1.RouterConfiguration; } });

package/dist/cjs/FAST/fast-web-utilities.js

@@ -0,0 +1,11 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.uniqueId = exports.SystemColors = exports.pascalCase = exports.Orientation = exports.limit = exports.Direction = exports.classNames = void 0;
+var fast_web_utilities_1 = require("@microsoft/fast-web-utilities");
+Object.defineProperty(exports, "classNames", { enumerable: true, get: function () { return fast_web_utilities_1.classNames; } });
+Object.defineProperty(exports, "Direction", { enumerable: true, get: function () { return fast_web_utilities_1.Direction; } });
+Object.defineProperty(exports, "limit", { enumerable: true, get: function () { return fast_web_utilities_1.limit; } });
+Object.defineProperty(exports, "Orientation", { enumerable: true, get: function () { return fast_web_utilities_1.Orientation; } });
+Object.defineProperty(exports, "pascalCase", { enumerable: true, get: function () { return fast_web_utilities_1.pascalCase; } });
+Object.defineProperty(exports, "SystemColors", { enumerable: true, get: function () { return fast_web_utilities_1.SystemColors; } });
+Object.defineProperty(exports, "uniqueId", { enumerable: true, get: function () { return fast_web_utilities_1.uniqueId; } });

package/dist/cjs/FAST/index.js

@@ -0,0 +1,9 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const tslib_1 = require("tslib");
+tslib_1.__exportStar(require("./fast-colors"), exports);
+tslib_1.__exportStar(require("./fast-components"), exports);
+tslib_1.__exportStar(require("./fast-element"), exports);
+tslib_1.__exportStar(require("./fast-foundation"), exports);
+tslib_1.__exportStar(require("./fast-router"), exports);
+tslib_1.__exportStar(require("./fast-web-utilities"), exports);

package/dist/cjs/directives/index.js

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const tslib_1 = require("tslib");
+tslib_1.__exportStar(require("./sync"), exports);
+tslib_1.__exportStar(require("./when-else"), exports);

package/dist/cjs/directives/sync.js

@@ -0,0 +1,101 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.sync = exports.defaultEventMap = void 0;
+const fast_element_1 = require("@microsoft/fast-element");
+/**
+ * A map that associates specific HTML element tags with their corresponding default event names.
+ * @public
+ */
+exports.defaultEventMap = new Map([
+    ['FAST-TEXT-AREA', 'input'],
+    ['FAST-TEXT-FIELD', 'input'],
+    ['FOUNDATION-TEXT-AREA', 'input'],
+    ['FOUNDATION-TEXT-FIELD', 'input'],
+    ['INPUT', 'input'],
+    ['ZERO-TEXT-FIELD', 'input'],
+]);
+function customUpdateTarget(value) {
+    if (this['keyAttr']) {
+        // FUI-389: set initial state based on keyAttr
+    }
+    else {
+        this.target[this.targetName] = value;
+    }
+}
+function bind(source, context) {
+    if (this['keyAttr']) {
+        // overwrite internal update method called by originalBind
+        this.updateTarget = customUpdateTarget;
+    }
+    this.originalBind.call(this, source, context);
+    this.target.addEventListener(this.changeEvent, this.changeHandler);
+}
+function unbind() {
+    this.originalUnbind.call(this);
+    this.target.removeEventListener(this.changeEvent, this.changeHandler);
+}
+function determineChangeEvent(target, eventName) {
+    var _a;
+    const tag = target.tagName;
+    if (eventName === 'default') {
+        return (_a = exports.defaultEventMap.get(tag)) !== null && _a !== void 0 ? _a : 'change';
+    }
+    return eventName;
+}
+class SyncDirective extends fast_element_1.HTMLBindingDirective {
+    constructor(binding, convert, eventName, keyAttr) {
+        super(binding);
+        this.keyAttr = keyAttr;
+        this.conversionType = convert;
+        this.eventName = eventName;
+    }
+    createBehavior(target) {
+        const behavior = super.createBehavior(target);
+        behavior.originalBind = behavior.bind;
+        behavior.originalUnbind = behavior.unbind;
+        behavior.keyAttr = this.keyAttr;
+        behavior.bind = bind;
+        behavior.unbind = unbind;
+        behavior.changeEvent = determineChangeEvent(target, this.eventName);
+        behavior.changeHandler = () => {
+            // for checkbox, which is currently the only component converting to boolean, will have to change if boolean conversion is used anywhere else
+            const value = this.conversionType === 'boolean' ? behavior.target.checked : behavior.target.value;
+            if (this.keyAttr) {
+                const last = behavior.bindingObserver.last;
+                const key = behavior.target[this.keyAttr];
+                last.propertySource[last.propertyName][key] = this.convert(value);
+            }
+            else {
+                // Wait for an official setValue API
+                const last = behavior.bindingObserver.last;
+                last.propertySource[last.propertyName] = this.convert(value);
+            }
+        };
+        return behavior;
+    }
+    convert(value) {
+        if (value === undefined || value === null)
+            return value;
+        switch (this.conversionType) {
+            case 'time':
+                const msSinceEpoch = new Date(value).getTime();
+                return isNaN(msSinceEpoch) ? undefined : msSinceEpoch;
+            case 'number':
+                return value.length ? Number(value) : undefined; // Number('') returns 0
+            case 'string':
+                return String(value);
+            case 'boolean':
+                return Boolean(value);
+            default:
+                return value;
+        }
+    }
+}
+/**
+ * Creates a synchronization directive that binds a data source to an HTML element,
+ * @public
+ */
+function sync(binding, conversionType = 'string', eventName = 'default', keyAttr) {
+    return new SyncDirective(binding, conversionType, eventName, keyAttr);
+}
+exports.sync = sync;

package/dist/cjs/directives/when-else.js

@@ -0,0 +1,18 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.whenElse = void 0;
+/**
+ * Directive that allows supplying an "else" template to the traditional {@link https://www.fast.design/docs/api/fast-element.when/#when-function} directive
+ *
+ * @param binding - The condition to test for rendering.
+ * @param trueTemplateOrTemplateBinding - The template or a binding that gets the template to render when the condition is true.
+ * @param falseTemplateOrTemplateBinding - The template or a binding that gets the template to render when the condition is false.
+ * @public
+ */
+function whenElse(binding, trueTemplateOrTemplateBinding, falseTemplateOrTemplateBinding) {
+    const getTemplate = (template) => typeof template === 'function' ? template : () => template;
+    const trueTemplate = getTemplate(trueTemplateOrTemplateBinding);
+    const falseTemplate = getTemplate(falseTemplateOrTemplateBinding);
+    return (source, context) => binding(source, context) ? trueTemplate(source, context) : falseTemplate(source, context);
+}
+exports.whenElse = whenElse;

package/dist/cjs/index.js

@@ -0,0 +1,6 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const tslib_1 = require("tslib");
+tslib_1.__exportStar(require("./directives"), exports);
+tslib_1.__exportStar(require("./FAST"), exports);
+tslib_1.__exportStar(require("./patterns"), exports);

package/dist/cjs/patterns/define.js

@@ -0,0 +1,41 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.defineFactory = void 0;
+const fast_element_1 = require("@microsoft/fast-element");
+const defaultDefinitionOverrider = (base) => (override) => (Object.assign(Object.assign({}, base), override));
+/**
+ * Defines a platform custom element based on the provided type and definition.
+ *
+ * @example
+ * An example using custom definition merge logic, useful if you need to impose hard restrictions.
+ * ```ts
+ * const definitionOverrider = (definition) => ({
+ *    ...baseDefinition,
+ *    ...definition,
+ *    styles: baseDefinition.styles,
+ *    shadowOptions: {
+ *      mode: 'closed,
+ *    },
+ * });
+ * export const define = defineFactory(LoginForm, definitionOverrider);
+ * ```
+ *
+ * @example
+ * You can provide the base definition if you're happy with the default spread operator merge logic.
+ * ```ts
+ * export const define = defineFactory(LoginForm, baseDefinition);
+ * ```
+ *
+ * @param Type - The custom element Type / Class to define.
+ * @param overriderOrBase - A function that merges definitions, or the base definition if custom merging is not needed.
+ * @returns The type class.
+ * @beta
+ */
+const defineFactory = (Type, overriderOrBase) => (definition) => {
+    const overrider = typeof overriderOrBase === 'function'
+        ? overriderOrBase
+        : defaultDefinitionOverrider(overriderOrBase);
+    return fast_element_1.FASTElement.define(class extends Type {
+    }, overrider(definition));
+};
+exports.defineFactory = defineFactory;

package/dist/cjs/patterns/index.js

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const tslib_1 = require("tslib");
+tslib_1.__exportStar(require("./define"), exports);
+tslib_1.__exportStar(require("./tag-for"), exports);

package/dist/cjs/patterns/tag-for.js

@@ -0,0 +1,24 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.tagFor = void 0;
+const fast_element_1 = require("@microsoft/fast-element");
+/**
+ * Determines what HTML tag name to use for the dependency.
+ * @param dependency - The dependency the template is dependent on.
+ * @returns The tag name to use in markup.
+ * @beta
+ */
+function tagFor(dependency) {
+    if (typeof dependency === 'string') {
+        return dependency;
+    }
+    if (typeof dependency === 'function') {
+        // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+        dependency = fast_element_1.FASTElementDefinition.forType(dependency); // < using forType instead of getByType for now...
+        if (!dependency) {
+            throw new Error('Missing FASTElement definition.');
+        }
+    }
+    return dependency.name;
+}
+exports.tagFor = tagFor;

package/dist/dts/FAST/fast-colors.d.ts

@@ -0,0 +1,2 @@
+export { ColorRGBA64, ComponentStateColorPalette, parseColorHexRGB } from '@microsoft/fast-colors';
+//# sourceMappingURL=fast-colors.d.ts.map

package/dist/dts/FAST/fast-colors.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"fast-colors.d.ts","sourceRoot":"","sources":["../../../src/FAST/fast-colors.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,0BAA0B,EAAE,gBAAgB,EAAE,MAAM,wBAAwB,CAAC"}

package/dist/dts/FAST/fast-components.d.ts

@@ -0,0 +1,2 @@
+export * from '@microsoft/fast-components';
+//# sourceMappingURL=fast-components.d.ts.map

package/dist/dts/FAST/fast-components.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"fast-components.d.ts","sourceRoot":"","sources":["../../../src/FAST/fast-components.ts"],"names":[],"mappings":"AAAA,cAAc,4BAA4B,CAAC"}

package/dist/dts/FAST/fast-element.d.ts

@@ -0,0 +1,2 @@
+export { attr, Behavior, Binding, BindingBehavior, BindingObserver, CaptureType, children, ComposableStyles, Constructable, css, CSSDirective, cssPartial, customElement, defaultExecutionContext, DOM, elements, ElementStyles, ExecutionContext, FASTElement, FASTElementDefinition, html, HTMLBindingDirective, HTMLView, nullableNumberConverter, Observable, observable, PartialFASTElementDefinition, ref, repeat, RepeatOptions, slotted, SyntheticViewTemplate, ValueConverter, ViewTemplate, volatile, when, } from '@microsoft/fast-element';
+//# sourceMappingURL=fast-element.d.ts.map

package/dist/dts/FAST/fast-element.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"fast-element.d.ts","sourceRoot":"","sources":["../../../src/FAST/fast-element.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,IAAI,EACJ,QAAQ,EACR,OAAO,EACP,eAAe,EACf,eAAe,EACf,WAAW,EACX,QAAQ,EACR,gBAAgB,EAChB,aAAa,EACb,GAAG,EACH,YAAY,EACZ,UAAU,EACV,aAAa,EACb,uBAAuB,EACvB,GAAG,EACH,QAAQ,EACR,aAAa,EACb,gBAAgB,EAChB,WAAW,EACX,qBAAqB,EACrB,IAAI,EACJ,oBAAoB,EACpB,QAAQ,EACR,uBAAuB,EACvB,UAAU,EACV,UAAU,EACV,4BAA4B,EAC5B,GAAG,EACH,MAAM,EACN,aAAa,EACb,OAAO,EACP,qBAAqB,EACrB,cAAc,EACd,YAAY,EACZ,QAAQ,EACR,IAAI,GACL,MAAM,yBAAyB,CAAC"}

package/dist/dts/FAST/fast-foundation.d.ts

@@ -0,0 +1,2 @@
+export { AccordionItemOptions, accordionItemTemplate, accordionTemplate, anchorTemplate, anchoredRegionTemplate, avatarTemplate, badgeTemplate, breadcrumbItemTemplate, BreadcrumbItemOptions, breadcrumbTemplate, buttonTemplate, CalendarOptions, calendarTemplate, cardTemplate, CheckboxOptions, checkboxTemplate, ColumnDefinition, ComboboxOptions, composedParent, ComboboxAutocomplete, Container, CSSDesignToken, dataGridTemplate, dataGridCellTemplate, dataGridRowTemplate, DesignSystem, DesignSystemRegistrationContext, DesignToken, DesignTokenValue, DI, disclosureTemplate, display, dividerTemplate, ElementDefinitionContext, endSlotTemplate, FlipperOptions, flipperTemplate, FoundationElement, FoundationElementDefinition, FoundationElementTemplate, FoundationElementRegistry, forcedColorsStylesheetBehavior, FormAssociated, HorizontalScrollOptions, horizontalScrollTemplate, inject, Key, listboxTemplate, listboxOptionTemplate, menuTemplate, MenuItemOptions, menuItemTemplate, NumberFieldOptions, optional, ProgressOptions, progressTemplate, ProgressRingOptions, progressRingTemplate, PropertyStyleSheetBehavior, Registration, RadioOptions, radioTemplate, radioGroupTemplate, SelectOptions, selectTemplate, skeletonTemplate, sliderLabelTemplate, SliderOptions, startSlotTemplate, SwitchOptions, switchTemplate, tabTemplate, tabPanelTemplate, tabsTemplate, TabsOrientation, textAreaTemplate, TextFieldOptions, toolbarTemplate, TooltipPosition, tooltipTemplate, TreeItemOptions, treeItemTemplate, treeViewTemplate, whitespaceFilter, } from '@microsoft/fast-foundation';
+//# sourceMappingURL=fast-foundation.d.ts.map

package/dist/dts/FAST/fast-foundation.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"fast-foundation.d.ts","sourceRoot":"","sources":["../../../src/FAST/fast-foundation.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,oBAAoB,EACpB,qBAAqB,EACrB,iBAAiB,EACjB,cAAc,EACd,sBAAsB,EACtB,cAAc,EACd,aAAa,EACb,sBAAsB,EACtB,qBAAqB,EACrB,kBAAkB,EAClB,cAAc,EACd,eAAe,EACf,gBAAgB,EAChB,YAAY,EACZ,eAAe,EACf,gBAAgB,EAChB,gBAAgB,EAChB,eAAe,EACf,cAAc,EACd,oBAAoB,EACpB,SAAS,EACT,cAAc,EACd,gBAAgB,EAChB,oBAAoB,EACpB,mBAAmB,EACnB,YAAY,EACZ,+BAA+B,EAC/B,WAAW,EACX,gBAAgB,EAChB,EAAE,EACF,kBAAkB,EAClB,OAAO,EACP,eAAe,EACf,wBAAwB,EACxB,eAAe,EACf,cAAc,EACd,eAAe,EACf,iBAAiB,EACjB,2BAA2B,EAC3B,yBAAyB,EACzB,yBAAyB,EACzB,8BAA8B,EAC9B,cAAc,EACd,uBAAuB,EACvB,wBAAwB,EACxB,MAAM,EACN,GAAG,EACH,eAAe,EACf,qBAAqB,EACrB,YAAY,EACZ,eAAe,EACf,gBAAgB,EAChB,kBAAkB,EAClB,QAAQ,EACR,eAAe,EACf,gBAAgB,EAChB,mBAAmB,EACnB,oBAAoB,EACpB,0BAA0B,EAC1B,YAAY,EACZ,YAAY,EACZ,aAAa,EACb,kBAAkB,EAClB,aAAa,EACb,cAAc,EACd,gBAAgB,EAChB,mBAAmB,EACnB,aAAa,EACb,iBAAiB,EACjB,aAAa,EACb,cAAc,EACd,WAAW,EACX,gBAAgB,EAChB,YAAY,EACZ,eAAe,EACf,gBAAgB,EAChB,gBAAgB,EAChB,eAAe,EACf,eAAe,EACf,eAAe,EACf,eAAe,EACf,gBAAgB,EAChB,gBAAgB,EAChB,gBAAgB,GACjB,MAAM,4BAA4B,CAAC"}

package/dist/dts/FAST/fast-router.d.ts

@@ -0,0 +1,2 @@
+export { DefaultRouteRecognizer, FASTElementLayout, FASTRouter, HasElement, MappableRouteDefinition, NavigationPhase, Route, RouteCollection, Router, RouterConfiguration, RouterElement, } from '@microsoft/fast-router';
+//# sourceMappingURL=fast-router.d.ts.map

package/dist/dts/FAST/fast-router.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"fast-router.d.ts","sourceRoot":"","sources":["../../../src/FAST/fast-router.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,sBAAsB,EACtB,iBAAiB,EACjB,UAAU,EACV,UAAU,EACV,uBAAuB,EACvB,eAAe,EACf,KAAK,EACL,eAAe,EACf,MAAM,EACN,mBAAmB,EACnB,aAAa,GACd,MAAM,wBAAwB,CAAC"}

package/dist/dts/FAST/fast-web-utilities.d.ts

@@ -0,0 +1,2 @@
+export { classNames, Direction, limit, Orientation, pascalCase, SystemColors, uniqueId, } from '@microsoft/fast-web-utilities';
+//# sourceMappingURL=fast-web-utilities.d.ts.map

package/dist/dts/FAST/fast-web-utilities.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"fast-web-utilities.d.ts","sourceRoot":"","sources":["../../../src/FAST/fast-web-utilities.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,UAAU,EACV,SAAS,EACT,KAAK,EACL,WAAW,EACX,UAAU,EACV,YAAY,EACZ,QAAQ,GACT,MAAM,+BAA+B,CAAC"}

package/dist/dts/FAST/index.d.ts

@@ -0,0 +1,7 @@
+export * from './fast-colors';
+export * from './fast-components';
+export * from './fast-element';
+export * from './fast-foundation';
+export * from './fast-router';
+export * from './fast-web-utilities';
+//# sourceMappingURL=index.d.ts.map

package/dist/dts/FAST/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/FAST/index.ts"],"names":[],"mappings":"AAAA,cAAc,eAAe,CAAC;AAC9B,cAAc,mBAAmB,CAAC;AAClC,cAAc,gBAAgB,CAAC;AAC/B,cAAc,mBAAmB,CAAC;AAClC,cAAc,eAAe,CAAC;AAC9B,cAAc,sBAAsB,CAAC"}

package/dist/dts/directives/index.d.ts

@@ -0,0 +1,3 @@
+export * from './sync';
+export * from './when-else';
+//# sourceMappingURL=index.d.ts.map

package/dist/dts/directives/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/directives/index.ts"],"names":[],"mappings":"AAAA,cAAc,QAAQ,CAAC;AACvB,cAAc,aAAa,CAAC"}

package/dist/dts/directives/sync.d.ts

@@ -0,0 +1,22 @@
+import { Binding, CaptureType } from '@microsoft/fast-element';
+/**
+ * Represents the possible types of value conversion for data synchronization.
+ * @public
+ */
+export type ConversionType = 'string' | 'number' | 'time' | 'boolean';
+/**
+ * Represents the possible event names for data synchronization.
+ * @public
+ */
+export type EventName = 'input' | 'change' | 'default';
+/**
+ * A map that associates specific HTML element tags with their corresponding default event names.
+ * @public
+ */
+export declare const defaultEventMap: Map<string, EventName>;
+/**
+ * Creates a synchronization directive that binds a data source to an HTML element,
+ * @public
+ */
+export declare function sync<TSource = any, TReturn = any>(binding: Binding<TSource, TReturn>, conversionType?: ConversionType, eventName?: EventName, keyAttr?: string): CaptureType<TSource>;
+//# sourceMappingURL=sync.d.ts.map

package/dist/dts/directives/sync.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"sync.d.ts","sourceRoot":"","sources":["../../../src/directives/sync.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,OAAO,EAEP,WAAW,EAGZ,MAAM,yBAAyB,CAAC;AAEjC;;;GAGG;AACH,MAAM,MAAM,cAAc,GAAG,QAAQ,GAAG,QAAQ,GAAG,MAAM,GAAG,SAAS,CAAC;AAEtE;;;GAGG;AACH,MAAM,MAAM,SAAS,GAAG,OAAO,GAAG,QAAQ,GAAG,SAAS,CAAC;AAEvD;;;GAGG;AACH,eAAO,MAAM,eAAe,EAAE,GAAG,CAAC,MAAM,EAAE,SAAS,CAOjD,CAAC;AAiGH;;;GAGG;AACH,wBAAgB,IAAI,CAAC,OAAO,GAAG,GAAG,EAAE,OAAO,GAAG,GAAG,EAC/C,OAAO,EAAE,OAAO,CAAC,OAAO,EAAE,OAAO,CAAC,EAClC,cAAc,GAAE,cAAyB,EACzC,SAAS,GAAE,SAAqB,EAChC,OAAO,CAAC,EAAE,MAAM,GACf,WAAW,CAAC,OAAO,CAAC,CAEtB"}

package/dist/dts/directives/when-else.d.ts

@@ -0,0 +1,13 @@
+import { Binding, CaptureType, SyntheticViewTemplate } from '@microsoft/fast-element';
+type WhenTemplate<TSource> = SyntheticViewTemplate | Binding<TSource, SyntheticViewTemplate>;
+/**
+ * Directive that allows supplying an "else" template to the traditional {@link https://www.fast.design/docs/api/fast-element.when/#when-function} directive
+ *
+ * @param binding - The condition to test for rendering.
+ * @param trueTemplateOrTemplateBinding - The template or a binding that gets the template to render when the condition is true.
+ * @param falseTemplateOrTemplateBinding - The template or a binding that gets the template to render when the condition is false.
+ * @public
+ */
+export declare function whenElse<TSource = any, TReturn = any>(binding: Binding<TSource, TReturn>, trueTemplateOrTemplateBinding: WhenTemplate<TSource>, falseTemplateOrTemplateBinding: WhenTemplate<TSource>): CaptureType<TSource>;
+export {};
+//# sourceMappingURL=when-else.d.ts.map

package/dist/dts/directives/when-else.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"when-else.d.ts","sourceRoot":"","sources":["../../../src/directives/when-else.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,OAAO,EACP,WAAW,EAEX,qBAAqB,EACtB,MAAM,yBAAyB,CAAC;AAEjC,KAAK,YAAY,CAAC,OAAO,IAAI,qBAAqB,GAAG,OAAO,CAAC,OAAO,EAAE,qBAAqB,CAAC,CAAC;AAE7F;;;;;;;GAOG;AACH,wBAAgB,QAAQ,CAAC,OAAO,GAAG,GAAG,EAAE,OAAO,GAAG,GAAG,EACnD,OAAO,EAAE,OAAO,CAAC,OAAO,EAAE,OAAO,CAAC,EAClC,6BAA6B,EAAE,YAAY,CAAC,OAAO,CAAC,EACpD,8BAA8B,EAAE,YAAY,CAAC,OAAO,CAAC,GACpD,WAAW,CAAC,OAAO,CAAC,CAStB"}

package/dist/dts/index.d.ts

@@ -0,0 +1,4 @@
+export * from './directives';
+export * from './FAST';
+export * from './patterns';
+//# sourceMappingURL=index.d.ts.map

package/dist/dts/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAC;AAC7B,cAAc,QAAQ,CAAC;AACvB,cAAc,YAAY,CAAC"}

package/dist/dts/patterns/define.d.ts

@@ -0,0 +1,39 @@
+import { Constructable, FASTElement, PartialFASTElementDefinition } from '@microsoft/fast-element';
+/**
+ * @beta
+ */
+export type DefineFunction<TType> = (definition: PartialFASTElementDefinition) => TType;
+/**
+ * @beta
+ */
+export type DefinitionOverrider = (override: PartialFASTElementDefinition) => PartialFASTElementDefinition;
+/**
+ * Defines a platform custom element based on the provided type and definition.
+ *
+ * @example
+ * An example using custom definition merge logic, useful if you need to impose hard restrictions.
+ * ```ts
+ * const definitionOverrider = (definition) => ({
+ *    ...baseDefinition,
+ *    ...definition,
+ *    styles: baseDefinition.styles,
+ *    shadowOptions: {
+ *      mode: 'closed,
+ *    },
+ * });
+ * export const define = defineFactory(LoginForm, definitionOverrider);
+ * ```
+ *
+ * @example
+ * You can provide the base definition if you're happy with the default spread operator merge logic.
+ * ```ts
+ * export const define = defineFactory(LoginForm, baseDefinition);
+ * ```
+ *
+ * @param Type - The custom element Type / Class to define.
+ * @param overriderOrBase - A function that merges definitions, or the base definition if custom merging is not needed.
+ * @returns The type class.
+ * @beta
+ */
+export declare const defineFactory: <TType extends Constructable<FASTElement>>(Type: TType, overriderOrBase: DefinitionOverrider | PartialFASTElementDefinition) => DefineFunction<TType>;
+//# sourceMappingURL=define.d.ts.map

package/dist/dts/patterns/define.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"define.d.ts","sourceRoot":"","sources":["../../../src/patterns/define.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,WAAW,EAAE,4BAA4B,EAAE,MAAM,yBAAyB,CAAC;AAEnG;;GAEG;AACH,MAAM,MAAM,cAAc,CAAC,KAAK,IAAI,CAAC,UAAU,EAAE,4BAA4B,KAAK,KAAK,CAAC;AAExF;;GAEG;AACH,MAAM,MAAM,mBAAmB,GAAG,CAChC,QAAQ,EAAE,4BAA4B,KACnC,4BAA4B,CAAC;AASlC;;;;;;;;;;;;;;;;;;;;;;;;;;;GA2BG;AACH,eAAO,MAAM,aAAa,2EAGL,mBAAmB,GAAG,4BAA4B,0BAQpE,CAAC"}

package/dist/dts/patterns/index.d.ts

@@ -0,0 +1,3 @@
+export * from './define';
+export * from './tag-for';
+//# sourceMappingURL=index.d.ts.map

package/dist/dts/patterns/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/patterns/index.ts"],"names":[],"mappings":"AAAA,cAAc,UAAU,CAAC;AACzB,cAAc,WAAW,CAAC"}