@tylertech/forge 3.0.0-next.3 → 3.0.0-next.5

package/esm/field/field-foundation.d.ts

@@ -55,8 +55,8 @@ export declare class FieldFoundation {
     protected _detectTrailingContent(): void;
     protected _detectAddonEndContent(): void;
     protected _detectSlottedContent(): void;
-    protected _onFocus(event: Event): void;
-    protected _onBlur(event: Event): void;
+    protected _onFocus(evt: FocusEvent): void;
+    protected _onBlur(evt: FocusEvent): void;
     protected _onValueChanged(value: any): void;
     protected _onInputAttributeChanged(name: string, value: string | null): void;
     protected _setShapeType(): void;

package/esm/field/field-foundation.js

@@ -144,14 +144,12 @@ export class FieldFoundation {
         }
     }
     floatLabel(value) {
-        var _a;
-        if (((_a = this._floatingLabel) === null || _a === void 0 ? void 0 : _a.isFloating) === value) {
+        var _a, _b;
+        if (((_a = this._floatingLabel) === null || _a === void 0 ? void 0 : _a.isFloating) === value || this._adapter.isLabelFloating() === value) {
             return;
         }
         if (!value && this._floatLabelType === 'always') {
-            if (this._floatingLabel) {
-                this._floatingLabel.float(true, true);
-            }
+            (_b = this._floatingLabel) === null || _b === void 0 ? void 0 : _b.float(true, true);
             this._adapter.setHostAttribute(FIELD_CONSTANTS.attributes.HOST_LABEL_FLOATING, '');
             return;
         }
@@ -228,20 +226,20 @@ export class FieldFoundation {
         this._detectTrailingContent();
         this._detectAddonEndContent();
     }
-    _onFocus(event) {
+    _onFocus(evt) {
         this._adapter.setRootClass(FIELD_CONSTANTS.classes.FOCUSED);
         this._adapter.setLabelClass(FIELD_CONSTANTS.classes.LABEL_FOCUSED);
         this.floatLabel(true);
     }
-    _onBlur(event) {
-        if (this._adapter.inputHasFocus()) {
+    _onBlur(evt) {
+        if (this._adapter.inputHasFocus(evt.relatedTarget)) {
             return;
         }
         this._adapter.removeRootClass(FIELD_CONSTANTS.classes.FOCUSED);
         this._adapter.removeLabelClass(FIELD_CONSTANTS.classes.LABEL_FOCUSED);
         if (!this._adapter.fieldHasValue() && !this._adapter.hasPlaceholder()) {
-            this._adapter.removeHostAttribute(FIELD_CONSTANTS.attributes.HOST_LABEL_FLOATING);
             this.floatLabel(false);
+            this._adapter.removeHostAttribute(FIELD_CONSTANTS.attributes.HOST_LABEL_FLOATING);
         }
     }
     _onValueChanged(value) {

package/esm/linear-progress/linear-progress-adapter.d.ts

@@ -0,0 +1,23 @@
+/**
+ * @license
+ * Copyright 2023 Tyler Technologies, Inc. 
+ * License: Apache-2.0
+ */
+import { BaseAdapter, IBaseAdapter } from '../core/base/base-adapter';
+import { ILinearProgressComponent } from './linear-progress';
+export interface ILinearProgressAdapter extends IBaseAdapter {
+    setDeterminate(value: boolean): void;
+    setProgress(value: number): void;
+    setBuffer(value: number): void;
+    setAriaLabel(value: string): void;
+}
+export declare class LinearProgressAdapter extends BaseAdapter<ILinearProgressComponent> implements ILinearProgressAdapter {
+    private readonly _rootElement;
+    private readonly _progressElement;
+    private readonly _bufferElement;
+    constructor(component: ILinearProgressComponent);
+    setDeterminate(value: boolean): void;
+    setProgress(value: number): void;
+    setBuffer(value: number): void;
+    setAriaLabel(value: string): void;
+}

package/esm/linear-progress/linear-progress-adapter.js

@@ -0,0 +1,34 @@
+/**
+ * @license
+ * Copyright 2023 Tyler Technologies, Inc. 
+ * License: Apache-2.0
+ */
+import { getShadowElement, toggleAttribute } from '@tylertech/forge-core';
+import { BaseAdapter } from '../core/base/base-adapter';
+import { LINEAR_PROGRESS_CONSTANTS } from './linear-progress-constants';
+export class LinearProgressAdapter extends BaseAdapter {
+    constructor(component) {
+        super(component);
+        this._rootElement = getShadowElement(component, LINEAR_PROGRESS_CONSTANTS.selectors.ROOT);
+        this._progressElement = getShadowElement(component, LINEAR_PROGRESS_CONSTANTS.selectors.PROGRESS);
+        this._bufferElement = getShadowElement(component, LINEAR_PROGRESS_CONSTANTS.selectors.BUFFER);
+    }
+    setDeterminate(value) {
+        if (!value) {
+            this._rootElement.removeAttribute('aria-valuenow');
+            this._progressElement.style.transform = '';
+            this._bufferElement.style.transform = '';
+        }
+        this._rootElement.classList.toggle(LINEAR_PROGRESS_CONSTANTS.classes.INDETERMINATE, !value);
+    }
+    setProgress(value) {
+        this._rootElement.setAttribute('aria-valuenow', `${value}`);
+        this._progressElement.style.transform = `scaleX(${value * 100}%)`;
+    }
+    setBuffer(value) {
+        this._bufferElement.style.transform = `scaleX(${value * 100}%)`;
+    }
+    setAriaLabel(value) {
+        toggleAttribute(this._rootElement, !!value, 'aria-label', value);
+    }
+}

package/esm/linear-progress/linear-progress-constants.d.ts

@@ -5,14 +5,18 @@
  */
 export declare const LINEAR_PROGRESS_CONSTANTS: {
     elementName: "forge-linear-progress";
+    classes: {
+        INDETERMINATE: string;
+    };
     selectors: {
         ROOT: string;
+        PROGRESS: string;
+        BUFFER: string;
     };
     attributes: {
         DETERMINATE: string;
         PROGRESS: string;
         BUFFER: string;
-        VISIBLE: string;
-        PROGRESSBAR_ARIA_LABEL: string;
+        ARIA_LABEL: string;
     };
 };

package/esm/linear-progress/linear-progress-constants.js

@@ -5,18 +5,23 @@
  */
 import { COMPONENT_NAME_PREFIX } from '../constants';
 const elementName = `${COMPONENT_NAME_PREFIX}linear-progress`;
+const classes = {
+    INDETERMINATE: 'forge-linear-progress--indeterminate'
+};
 const selectors = {
-    ROOT: '.mdc-linear-progress'
+    ROOT: '.forge-linear-progress',
+    PROGRESS: '.primary-bar',
+    BUFFER: '.buffer-bar'
 };
 const attributes = {
     DETERMINATE: 'determinate',
     PROGRESS: 'progress',
     BUFFER: 'buffer',
-    VISIBLE: 'visible',
-    PROGRESSBAR_ARIA_LABEL: 'progressbar-aria-label'
+    ARIA_LABEL: 'data-aria-label'
 };
 export const LINEAR_PROGRESS_CONSTANTS = {
     elementName,
+    classes,
     selectors,
     attributes
 };

package/esm/linear-progress/linear-progress-foundation.d.ts

@@ -0,0 +1,26 @@
+/**
+ * @license
+ * Copyright 2023 Tyler Technologies, Inc. 
+ * License: Apache-2.0
+ */
+import { ICustomElementFoundation } from '@tylertech/forge-core';
+import { ILinearProgressAdapter } from './linear-progress-adapter';
+export interface ICircularProgressFoundation extends ICustomElementFoundation {
+    determinate: boolean;
+    progress: number;
+    buffer: number;
+}
+export declare class LinearProgressFoundation {
+    private _adapter;
+    private _determinate;
+    private _progress;
+    private _buffer;
+    constructor(_adapter: ILinearProgressAdapter);
+    set ariaLabel(value: string);
+    get determinate(): boolean;
+    set determinate(value: boolean);
+    get progress(): number;
+    set progress(value: number);
+    get buffer(): number;
+    set buffer(value: number);
+}

package/esm/linear-progress/linear-progress-foundation.js

@@ -0,0 +1,53 @@
+/**
+ * @license
+ * Copyright 2023 Tyler Technologies, Inc. 
+ * License: Apache-2.0
+ */
+import { LINEAR_PROGRESS_CONSTANTS } from './linear-progress-constants';
+export class LinearProgressFoundation {
+    constructor(_adapter) {
+        this._adapter = _adapter;
+        this._determinate = false;
+        this._progress = 0;
+        this._buffer = 1;
+    }
+    set ariaLabel(value) {
+        this._adapter.setAriaLabel(value);
+    }
+    get determinate() {
+        return this._determinate;
+    }
+    set determinate(value) {
+        if (this._determinate !== value) {
+            this._determinate = value;
+            this._adapter.setBuffer(this._determinate ? this._buffer : 1);
+            this._adapter.setProgress(this._determinate ? this._progress : 0);
+            this._adapter.setDeterminate(this._determinate);
+            this._adapter.toggleHostAttribute(LINEAR_PROGRESS_CONSTANTS.attributes.DETERMINATE, value);
+        }
+    }
+    get progress() {
+        return this._progress;
+    }
+    set progress(value) {
+        if (this._progress !== value) {
+            this._progress = value;
+            if (this._determinate) {
+                this._adapter.setProgress(this._progress);
+            }
+            this._adapter.setHostAttribute(LINEAR_PROGRESS_CONSTANTS.attributes.PROGRESS, value.toString());
+        }
+    }
+    get buffer() {
+        return this._buffer;
+    }
+    set buffer(value) {
+        if (this._buffer !== value) {
+            this._buffer = value;
+            if (this._determinate) {
+                this._adapter.setBuffer(this._buffer);
+            }
+            this._adapter.setHostAttribute(LINEAR_PROGRESS_CONSTANTS.attributes.BUFFER, value.toString());
+        }
+    }
+}

package/esm/linear-progress/linear-progress.d.ts

@@ -8,9 +8,6 @@ export interface ILinearProgressComponent extends IBaseComponent {
     determinate: boolean;
     progress: number;
     buffer: number;
-    visible: boolean;
-    open(): void;
-    close(): void;
 }
 declare global {
     interface HTMLElementTagNameMap {
@@ -18,32 +15,37 @@ declare global {
     }
 }
 /**
- * The web component class behind the `<forge-linear-progress>` custom element.
- *
  * @tag forge-linear-progress
+ *
+ * @summary
+ * Linear progress indicators display progress by animating along a linear track in a horizontal direction.
+ *
+ * @description
+ * Progress indicators inform users about the status of ongoing processes.
+ * - Determinate indicators display how long a process will take.
+ * - Indeterminate indicators express an unspecified amount of wait time.
+ *
+ * @property {boolean} determinate - Controls the determinate state.
+ * @property {boolean} progress - Controls the progress while in a determinate state. Accepts values from `0` to `1`.
+ * @property {boolean} buffer - Controls the buffer progress while in a determinate state. Accepts values from `0` to `1`.
+ *
+ * @attribute {boolean} determinate - Controls the determinate state.
+ * @attribute {number} progress - Controls the progress while in a determinate state. Accepts values from `0` to `1`.
+ * @attribute {number} buffer - Controls the buffer progress while in a determinate state. Accepts values from `0` to `1`.
+ * @attribute {string} data-aria-label - Propagates an `aria-label` to the underlying progress bar element.
+ *
+ * @cssproperty --forge-linear-progress-height - The height of the indicator container.
+ * @cssproperty --forge-linear-progress-indicator-background-color - The background color of the indicator.
+ * @cssproperty --forge-linear-progress-indicator-color - The color of the indicator.
+ *
+ * @csspart progressbar - Styles the progress bar container element
  */
 export declare class LinearProgressComponent extends BaseComponent implements ILinearProgressComponent {
     static get observedAttributes(): string[];
-    private _mdcLinearProgress;
-    private _determinate;
-    private _progress;
-    private _buffer;
-    private _visible;
-    private _progressbarElement;
+    private _foundation;
     constructor();
-    connectedCallback(): void;
-    disconnectedCallback(): void;
     attributeChangedCallback(name: string, oldValue: string, newValue: string): void;
-    set determinate(value: boolean);
-    get determinate(): boolean;
-    set progress(value: number);
-    get progress(): number;
-    set buffer(value: number);
-    get buffer(): number;
-    get visible(): boolean;
-    set visible(value: boolean);
-    open(): void;
-    close(): void;
-    private _initialize;
-    private _applyVisibility;
+    determinate: boolean;
+    progress: number;
+    buffer: number;
 }

package/esm/linear-progress/linear-progress.js

@@ -4,44 +4,53 @@
  * License: Apache-2.0
  */
 import { __decorate } from "tslib";
-import { MDCLinearProgress } from '@material/linear-progress';
-import { CustomElement, coerceBoolean, coerceNumber, attachShadowTemplate, getShadowElement, toggleAttribute } from '@tylertech/forge-core';
+import { attachShadowTemplate, coerceBoolean, coerceNumber, CustomElement, FoundationProperty } from '@tylertech/forge-core';
 import { BaseComponent } from '../core/base/base-component';
+import { LinearProgressAdapter } from './linear-progress-adapter';
 import { LINEAR_PROGRESS_CONSTANTS } from './linear-progress-constants';
-const template = '<template><div role=\"progressbar\" class=\"mdc-linear-progress\" part=\"root\" aria-valuemin=\"0\" aria-valuemax=\"1\" aria-valuenow=\"0\"><div class=\"mdc-linear-progress__buffer\" part=\"buffer\"><div class=\"mdc-linear-progress__buffer-bar\" part=\"buffer-bar\"></div><div class=\"mdc-linear-progress__buffer-dots\" part=\"buffer-dots\"></div></div><div class=\"mdc-linear-progress__bar mdc-linear-progress__primary-bar\" part=\"progress-bar\"><span class=\"mdc-linear-progress__bar-inner\" part=\"progress-bar-inner\"></span></div><div class=\"mdc-linear-progress__bar mdc-linear-progress__secondary-bar\" part=\"secondary-bar\"><span class=\"mdc-linear-progress__bar-inner\" part=\"secondary-bar-inner\"></span></div></div></template>';
-const styles = '@-webkit-keyframes mdc-linear-progress-primary-indeterminate-translate{0%{-webkit-transform:translateX(0);transform:translateX(0)}20%{-webkit-animation-timing-function:cubic-bezier(0.5,0,0.701732,0.495819);animation-timing-function:cubic-bezier(0.5,0,0.701732,0.495819);-webkit-transform:translateX(0);transform:translateX(0)}59.15%{-webkit-animation-timing-function:cubic-bezier(0.302435,0.381352,0.55,0.956352);animation-timing-function:cubic-bezier(0.302435,0.381352,0.55,0.956352);-webkit-transform:translateX(83.67142%);transform:translateX(83.67142%);-webkit-transform:translateX(var(--mdc-linear-progress-primary-half,83.67142%));transform:translateX(var(--mdc-linear-progress-primary-half,83.67142%))}100%{-webkit-transform:translateX(200.611057%);transform:translateX(200.611057%);-webkit-transform:translateX(var(--mdc-linear-progress-primary-full,200.611057%));transform:translateX(var(--mdc-linear-progress-primary-full,200.611057%))}}@keyframes mdc-linear-progress-primary-indeterminate-translate{0%{-webkit-transform:translateX(0);transform:translateX(0)}20%{-webkit-animation-timing-function:cubic-bezier(0.5,0,0.701732,0.495819);animation-timing-function:cubic-bezier(0.5,0,0.701732,0.495819);-webkit-transform:translateX(0);transform:translateX(0)}59.15%{-webkit-animation-timing-function:cubic-bezier(0.302435,0.381352,0.55,0.956352);animation-timing-function:cubic-bezier(0.302435,0.381352,0.55,0.956352);-webkit-transform:translateX(83.67142%);transform:translateX(83.67142%);-webkit-transform:translateX(var(--mdc-linear-progress-primary-half,83.67142%));transform:translateX(var(--mdc-linear-progress-primary-half,83.67142%))}100%{-webkit-transform:translateX(200.611057%);transform:translateX(200.611057%);-webkit-transform:translateX(var(--mdc-linear-progress-primary-full,200.611057%));transform:translateX(var(--mdc-linear-progress-primary-full,200.611057%))}}@-webkit-keyframes mdc-linear-progress-primary-indeterminate-scale{0%{-webkit-transform:scaleX(.08);transform:scaleX(.08)}36.65%{-webkit-animation-timing-function:cubic-bezier(0.334731,0.12482,0.785844,1);animation-timing-function:cubic-bezier(0.334731,0.12482,0.785844,1);-webkit-transform:scaleX(.08);transform:scaleX(.08)}69.15%{-webkit-animation-timing-function:cubic-bezier(0.06,0.11,0.6,1);animation-timing-function:cubic-bezier(0.06,0.11,0.6,1);-webkit-transform:scaleX(.661479);transform:scaleX(.661479)}100%{-webkit-transform:scaleX(.08);transform:scaleX(.08)}}@keyframes mdc-linear-progress-primary-indeterminate-scale{0%{-webkit-transform:scaleX(.08);transform:scaleX(.08)}36.65%{-webkit-animation-timing-function:cubic-bezier(0.334731,0.12482,0.785844,1);animation-timing-function:cubic-bezier(0.334731,0.12482,0.785844,1);-webkit-transform:scaleX(.08);transform:scaleX(.08)}69.15%{-webkit-animation-timing-function:cubic-bezier(0.06,0.11,0.6,1);animation-timing-function:cubic-bezier(0.06,0.11,0.6,1);-webkit-transform:scaleX(.661479);transform:scaleX(.661479)}100%{-webkit-transform:scaleX(.08);transform:scaleX(.08)}}@-webkit-keyframes mdc-linear-progress-secondary-indeterminate-translate{0%{-webkit-animation-timing-function:cubic-bezier(0.15,0,0.515058,0.409685);animation-timing-function:cubic-bezier(0.15,0,0.515058,0.409685);-webkit-transform:translateX(0);transform:translateX(0)}25%{-webkit-animation-timing-function:cubic-bezier(0.31033,0.284058,0.8,0.733712);animation-timing-function:cubic-bezier(0.31033,0.284058,0.8,0.733712);-webkit-transform:translateX(37.651913%);transform:translateX(37.651913%);-webkit-transform:translateX(var(--mdc-linear-progress-secondary-quarter,37.651913%));transform:translateX(var(--mdc-linear-progress-secondary-quarter,37.651913%))}48.35%{-webkit-animation-timing-function:cubic-bezier(0.4,0.627035,0.6,0.902026);animation-timing-function:cubic-bezier(0.4,0.627035,0.6,0.902026);-webkit-transform:translateX(84.386165%);transform:translateX(84.386165%);-webkit-transform:translateX(var(--mdc-linear-progress-secondary-half,84.386165%));transform:translateX(var(--mdc-linear-progress-secondary-half,84.386165%))}100%{-webkit-transform:translateX(160.277782%);transform:translateX(160.277782%);-webkit-transform:translateX(var(--mdc-linear-progress-secondary-full,160.277782%));transform:translateX(var(--mdc-linear-progress-secondary-full,160.277782%))}}@keyframes mdc-linear-progress-secondary-indeterminate-translate{0%{-webkit-animation-timing-function:cubic-bezier(0.15,0,0.515058,0.409685);animation-timing-function:cubic-bezier(0.15,0,0.515058,0.409685);-webkit-transform:translateX(0);transform:translateX(0)}25%{-webkit-animation-timing-function:cubic-bezier(0.31033,0.284058,0.8,0.733712);animation-timing-function:cubic-bezier(0.31033,0.284058,0.8,0.733712);-webkit-transform:translateX(37.651913%);transform:translateX(37.651913%);-webkit-transform:translateX(var(--mdc-linear-progress-secondary-quarter,37.651913%));transform:translateX(var(--mdc-linear-progress-secondary-quarter,37.651913%))}48.35%{-webkit-animation-timing-function:cubic-bezier(0.4,0.627035,0.6,0.902026);animation-timing-function:cubic-bezier(0.4,0.627035,0.6,0.902026);-webkit-transform:translateX(84.386165%);transform:translateX(84.386165%);-webkit-transform:translateX(var(--mdc-linear-progress-secondary-half,84.386165%));transform:translateX(var(--mdc-linear-progress-secondary-half,84.386165%))}100%{-webkit-transform:translateX(160.277782%);transform:translateX(160.277782%);-webkit-transform:translateX(var(--mdc-linear-progress-secondary-full,160.277782%));transform:translateX(var(--mdc-linear-progress-secondary-full,160.277782%))}}@-webkit-keyframes mdc-linear-progress-secondary-indeterminate-scale{0%{-webkit-animation-timing-function:cubic-bezier(0.205028,0.057051,0.57661,0.453971);animation-timing-function:cubic-bezier(0.205028,0.057051,0.57661,0.453971);-webkit-transform:scaleX(.08);transform:scaleX(.08)}19.15%{-webkit-animation-timing-function:cubic-bezier(0.152313,0.196432,0.648374,1.004315);animation-timing-function:cubic-bezier(0.152313,0.196432,0.648374,1.004315);-webkit-transform:scaleX(.457104);transform:scaleX(.457104)}44.15%{-webkit-animation-timing-function:cubic-bezier(0.257759,-0.003163,0.211762,1.38179);animation-timing-function:cubic-bezier(0.257759,-0.003163,0.211762,1.38179);-webkit-transform:scaleX(.72796);transform:scaleX(.72796)}100%{-webkit-transform:scaleX(.08);transform:scaleX(.08)}}@keyframes mdc-linear-progress-secondary-indeterminate-scale{0%{-webkit-animation-timing-function:cubic-bezier(0.205028,0.057051,0.57661,0.453971);animation-timing-function:cubic-bezier(0.205028,0.057051,0.57661,0.453971);-webkit-transform:scaleX(.08);transform:scaleX(.08)}19.15%{-webkit-animation-timing-function:cubic-bezier(0.152313,0.196432,0.648374,1.004315);animation-timing-function:cubic-bezier(0.152313,0.196432,0.648374,1.004315);-webkit-transform:scaleX(.457104);transform:scaleX(.457104)}44.15%{-webkit-animation-timing-function:cubic-bezier(0.257759,-0.003163,0.211762,1.38179);animation-timing-function:cubic-bezier(0.257759,-0.003163,0.211762,1.38179);-webkit-transform:scaleX(.72796);transform:scaleX(.72796)}100%{-webkit-transform:scaleX(.08);transform:scaleX(.08)}}@-webkit-keyframes mdc-linear-progress-buffering{from{-webkit-transform:rotate(180deg) translateX(-10px);transform:rotate(180deg) translateX(-10px)}}@keyframes mdc-linear-progress-buffering{from{-webkit-transform:rotate(180deg) translateX(-10px);transform:rotate(180deg) translateX(-10px)}}@-webkit-keyframes mdc-linear-progress-primary-indeterminate-translate-reverse{0%{-webkit-transform:translateX(0);transform:translateX(0)}20%{-webkit-animation-timing-function:cubic-bezier(0.5,0,0.701732,0.495819);animation-timing-function:cubic-bezier(0.5,0,0.701732,0.495819);-webkit-transform:translateX(0);transform:translateX(0)}59.15%{-webkit-animation-timing-function:cubic-bezier(0.302435,0.381352,0.55,0.956352);animation-timing-function:cubic-bezier(0.302435,0.381352,0.55,0.956352);-webkit-transform:translateX(-83.67142%);transform:translateX(-83.67142%);-webkit-transform:translateX(var(--mdc-linear-progress-primary-half-neg,-83.67142%));transform:translateX(var(--mdc-linear-progress-primary-half-neg,-83.67142%))}100%{-webkit-transform:translateX(-200.611057%);transform:translateX(-200.611057%);-webkit-transform:translateX(var(--mdc-linear-progress-primary-full-neg,-200.611057%));transform:translateX(var(--mdc-linear-progress-primary-full-neg,-200.611057%))}}@keyframes mdc-linear-progress-primary-indeterminate-translate-reverse{0%{-webkit-transform:translateX(0);transform:translateX(0)}20%{-webkit-animation-timing-function:cubic-bezier(0.5,0,0.701732,0.495819);animation-timing-function:cubic-bezier(0.5,0,0.701732,0.495819);-webkit-transform:translateX(0);transform:translateX(0)}59.15%{-webkit-animation-timing-function:cubic-bezier(0.302435,0.381352,0.55,0.956352);animation-timing-function:cubic-bezier(0.302435,0.381352,0.55,0.956352);-webkit-transform:translateX(-83.67142%);transform:translateX(-83.67142%);-webkit-transform:translateX(var(--mdc-linear-progress-primary-half-neg,-83.67142%));transform:translateX(var(--mdc-linear-progress-primary-half-neg,-83.67142%))}100%{-webkit-transform:translateX(-200.611057%);transform:translateX(-200.611057%);-webkit-transform:translateX(var(--mdc-linear-progress-primary-full-neg,-200.611057%));transform:translateX(var(--mdc-linear-progress-primary-full-neg,-200.611057%))}}@-webkit-keyframes mdc-linear-progress-secondary-indeterminate-translate-reverse{0%{-webkit-animation-timing-function:cubic-bezier(0.15,0,0.515058,0.409685);animation-timing-function:cubic-bezier(0.15,0,0.515058,0.409685);-webkit-transform:translateX(0);transform:translateX(0)}25%{-webkit-animation-timing-function:cubic-bezier(0.31033,0.284058,0.8,0.733712);animation-timing-function:cubic-bezier(0.31033,0.284058,0.8,0.733712);-webkit-transform:translateX(-37.651913%);transform:translateX(-37.651913%);-webkit-transform:translateX(var(--mdc-linear-progress-secondary-quarter-neg,-37.651913%));transform:translateX(var(--mdc-linear-progress-secondary-quarter-neg,-37.651913%))}48.35%{-webkit-animation-timing-function:cubic-bezier(0.4,0.627035,0.6,0.902026);animation-timing-function:cubic-bezier(0.4,0.627035,0.6,0.902026);-webkit-transform:translateX(-84.386165%);transform:translateX(-84.386165%);-webkit-transform:translateX(var(--mdc-linear-progress-secondary-half-neg,-84.386165%));transform:translateX(var(--mdc-linear-progress-secondary-half-neg,-84.386165%))}100%{-webkit-transform:translateX(-160.277782%);transform:translateX(-160.277782%);-webkit-transform:translateX(var(--mdc-linear-progress-secondary-full-neg,-160.277782%));transform:translateX(var(--mdc-linear-progress-secondary-full-neg,-160.277782%))}}@keyframes mdc-linear-progress-secondary-indeterminate-translate-reverse{0%{-webkit-animation-timing-function:cubic-bezier(0.15,0,0.515058,0.409685);animation-timing-function:cubic-bezier(0.15,0,0.515058,0.409685);-webkit-transform:translateX(0);transform:translateX(0)}25%{-webkit-animation-timing-function:cubic-bezier(0.31033,0.284058,0.8,0.733712);animation-timing-function:cubic-bezier(0.31033,0.284058,0.8,0.733712);-webkit-transform:translateX(-37.651913%);transform:translateX(-37.651913%);-webkit-transform:translateX(var(--mdc-linear-progress-secondary-quarter-neg,-37.651913%));transform:translateX(var(--mdc-linear-progress-secondary-quarter-neg,-37.651913%))}48.35%{-webkit-animation-timing-function:cubic-bezier(0.4,0.627035,0.6,0.902026);animation-timing-function:cubic-bezier(0.4,0.627035,0.6,0.902026);-webkit-transform:translateX(-84.386165%);transform:translateX(-84.386165%);-webkit-transform:translateX(var(--mdc-linear-progress-secondary-half-neg,-84.386165%));transform:translateX(var(--mdc-linear-progress-secondary-half-neg,-84.386165%))}100%{-webkit-transform:translateX(-160.277782%);transform:translateX(-160.277782%);-webkit-transform:translateX(var(--mdc-linear-progress-secondary-full-neg,-160.277782%));transform:translateX(var(--mdc-linear-progress-secondary-full-neg,-160.277782%))}}@-webkit-keyframes mdc-linear-progress-buffering-reverse{from{-webkit-transform:translateX(-10px);transform:translateX(-10px)}}@keyframes mdc-linear-progress-buffering-reverse{from{-webkit-transform:translateX(-10px);transform:translateX(-10px)}}.mdc-linear-progress{position:relative;width:100%;-webkit-transform:translateZ(0);transform:translateZ(0);outline:1px solid transparent;overflow:hidden;-webkit-transition:opacity 250ms 0s cubic-bezier(.4, 0, .6, 1);transition:opacity 250ms 0s cubic-bezier(.4, 0, .6, 1)}@media screen and (forced-colors:active){.mdc-linear-progress{outline-color:CanvasText}}.mdc-linear-progress__bar{position:absolute;width:100%;height:100%;-webkit-animation:none;animation:none;-webkit-transform-origin:top left;transform-origin:top left;-webkit-transition:-webkit-transform 250ms 0s cubic-bezier(.4, 0, .6, 1);transition:-webkit-transform 250ms 0s cubic-bezier(.4, 0, .6, 1);transition:transform 250ms 0s cubic-bezier(.4, 0, .6, 1);transition:transform 250ms 0s cubic-bezier(.4, 0, .6, 1),-webkit-transform 250ms 0s cubic-bezier(.4, 0, .6, 1)}.mdc-linear-progress__bar-inner{display:inline-block;position:absolute;width:100%;-webkit-animation:none;animation:none;border-top-style:solid}.mdc-linear-progress__buffer{display:-webkit-box;display:flex;position:absolute;width:100%;height:100%}.mdc-linear-progress__buffer-dots{background-repeat:repeat-x;-webkit-box-flex:1;flex:auto;-webkit-transform:rotate(180deg);transform:rotate(180deg);-webkit-animation:mdc-linear-progress-buffering 250ms infinite linear;animation:mdc-linear-progress-buffering 250ms infinite linear}.mdc-linear-progress__buffer-bar{-webkit-box-flex:0;flex:0 1 100%;-webkit-transition:-webkit-flex-basis 250ms 0s cubic-bezier(.4, 0, .6, 1);transition:-webkit-flex-basis 250ms 0s cubic-bezier(.4, 0, .6, 1);transition:flex-basis 250ms 0s cubic-bezier(.4, 0, .6, 1);transition:flex-basis 250ms 0s cubic-bezier(.4, 0, .6, 1),-webkit-flex-basis 250ms 0s cubic-bezier(.4, 0, .6, 1)}.mdc-linear-progress__primary-bar{-webkit-transform:scaleX(0);transform:scaleX(0)}.mdc-linear-progress__secondary-bar{display:none}.mdc-linear-progress--indeterminate .mdc-linear-progress__bar{-webkit-transition:none;transition:none}.mdc-linear-progress--indeterminate .mdc-linear-progress__primary-bar{left:-145.166611%}.mdc-linear-progress--indeterminate .mdc-linear-progress__secondary-bar{left:-54.888891%;display:block}.mdc-linear-progress--indeterminate.mdc-linear-progress--animation-ready .mdc-linear-progress__primary-bar{-webkit-animation:mdc-linear-progress-primary-indeterminate-translate 2s infinite linear;animation:mdc-linear-progress-primary-indeterminate-translate 2s infinite linear}.mdc-linear-progress--indeterminate.mdc-linear-progress--animation-ready .mdc-linear-progress__primary-bar>.mdc-linear-progress__bar-inner{-webkit-animation:mdc-linear-progress-primary-indeterminate-scale 2s infinite linear;animation:mdc-linear-progress-primary-indeterminate-scale 2s infinite linear}.mdc-linear-progress--indeterminate.mdc-linear-progress--animation-ready .mdc-linear-progress__secondary-bar{-webkit-animation:mdc-linear-progress-secondary-indeterminate-translate 2s infinite linear;animation:mdc-linear-progress-secondary-indeterminate-translate 2s infinite linear}.mdc-linear-progress--indeterminate.mdc-linear-progress--animation-ready .mdc-linear-progress__secondary-bar>.mdc-linear-progress__bar-inner{-webkit-animation:mdc-linear-progress-secondary-indeterminate-scale 2s infinite linear;animation:mdc-linear-progress-secondary-indeterminate-scale 2s infinite linear}.mdc-linear-progress[dir=rtl]:not([dir=ltr]) .mdc-linear-progress__bar,[dir=rtl] .mdc-linear-progress:not([dir=ltr]) .mdc-linear-progress__bar{right:0;-webkit-transform-origin:center right;transform-origin:center right}.mdc-linear-progress[dir=rtl]:not([dir=ltr]).mdc-linear-progress--animation-ready .mdc-linear-progress__primary-bar,[dir=rtl] .mdc-linear-progress:not([dir=ltr]).mdc-linear-progress--animation-ready .mdc-linear-progress__primary-bar{-webkit-animation-name:mdc-linear-progress-primary-indeterminate-translate-reverse;animation-name:mdc-linear-progress-primary-indeterminate-translate-reverse}.mdc-linear-progress[dir=rtl]:not([dir=ltr]).mdc-linear-progress--animation-ready .mdc-linear-progress__secondary-bar,[dir=rtl] .mdc-linear-progress:not([dir=ltr]).mdc-linear-progress--animation-ready .mdc-linear-progress__secondary-bar{-webkit-animation-name:mdc-linear-progress-secondary-indeterminate-translate-reverse;animation-name:mdc-linear-progress-secondary-indeterminate-translate-reverse}.mdc-linear-progress[dir=rtl]:not([dir=ltr]) .mdc-linear-progress__buffer-dots,[dir=rtl] .mdc-linear-progress:not([dir=ltr]) .mdc-linear-progress__buffer-dots{-webkit-animation:mdc-linear-progress-buffering-reverse 250ms infinite linear;animation:mdc-linear-progress-buffering-reverse 250ms infinite linear;-webkit-transform:rotate(0);transform:rotate(0)}.mdc-linear-progress[dir=rtl]:not([dir=ltr]).mdc-linear-progress--indeterminate .mdc-linear-progress__primary-bar,[dir=rtl] .mdc-linear-progress:not([dir=ltr]).mdc-linear-progress--indeterminate .mdc-linear-progress__primary-bar{right:-145.166611%;left:auto}.mdc-linear-progress[dir=rtl]:not([dir=ltr]).mdc-linear-progress--indeterminate .mdc-linear-progress__secondary-bar,[dir=rtl] .mdc-linear-progress:not([dir=ltr]).mdc-linear-progress--indeterminate .mdc-linear-progress__secondary-bar{right:-54.888891%;left:auto}.mdc-linear-progress--closed{opacity:0}.mdc-linear-progress--closed-animation-off .mdc-linear-progress__buffer-dots{-webkit-animation:none;animation:none}.mdc-linear-progress--closed-animation-off.mdc-linear-progress--indeterminate .mdc-linear-progress__bar,.mdc-linear-progress--closed-animation-off.mdc-linear-progress--indeterminate .mdc-linear-progress__bar .mdc-linear-progress__bar-inner{-webkit-animation:none;animation:none}.mdc-linear-progress__bar-inner{border-color:#6200ee;border-color:var(--mdc-theme-primary,#6200ee)}.mdc-linear-progress__buffer-dots{background-image:url(\"data:image/svg+xml,%3Csvg version=\'1.1\' xmlns=\'http://www.w3.org/2000/svg\' xmlns:xlink=\'http://www.w3.org/1999/xlink\' x=\'0px\' y=\'0px\' enable-background=\'new 0 0 5 2\' xml:space=\'preserve\' viewBox=\'0 0 5 2\' preserveAspectRatio=\'none slice\'%3E%3Ccircle cx=\'1\' cy=\'1\' r=\'1\' fill=\'%23e6e6e6\'/%3E%3C/svg%3E\")}.mdc-linear-progress__buffer-bar{background-color:#e6e6e6}.mdc-linear-progress{height:4px}.mdc-linear-progress__bar-inner{border-top-width:4px}.mdc-linear-progress__buffer-dots{background-size:10px 4px}:host{display:block}:host([hidden]){display:none}.mdc-linear-progress__buffer-dots{background-image:url(\"data:image/svg+xml,%3Csvg version=\'1.1\' xmlns=\'http://www.w3.org/2000/svg\' xmlns:xlink=\'http://www.w3.org/1999/xlink\' x=\'0px\' y=\'0px\' enable-background=\'new 0 0 5 2\' xml:space=\'preserve\' viewBox=\'0 0 5 2\' preserveAspectRatio=\'none slice\'%3E%3Ccircle cx=\'1\' cy=\'1\' r=\'1\' fill=\'%23ced5f7\'/%3E%3C/svg%3E\")}.mdc-linear-progress__buffer-bar{background-color:#ced5f7}.mdc-linear-progress{border-radius:inherit;border-radius:var(--forge-linear-progress-border-radius,inherit)}.mdc-linear-progress__bar-inner{border-color:#3d5afe;border-color:var(--forge-theme-tertiary,#3d5afe)}.mdc-linear-progress__buffer-bar{background-color:#ced5f7;background-color:var(--forge-linear-progress-theme-buffer,#ced5f7)}.mdc-linear-progress__buffer-dots{-webkit-filter:none;filter:none;-webkit-filter:var(--forge-linear-progress-theme-buffer-dots,none);filter:var(--forge-linear-progress-theme-buffer-dots, none)}';
+import { LinearProgressFoundation } from './linear-progress-foundation';
+const template = '<template><div class=\"forge-linear-progress forge-linear-progress--indeterminate\" part=\"progressbar\" role=\"progressbar\" aria-valuemin=\"0\" aria-valuemax=\"1\"><div class=\"track\"></div><div class=\"buffer-bar\"></div><div class=\"bar primary-bar\"><div class=\"bar-inner\"></div></div><div class=\"bar secondary-bar\"><div class=\"bar-inner\"></div></div></div></template>';
+const styles = ':host{display:block;position:relative;min-inline-size:80px;block-size:var(--forge-linear-progress-height,4px);content-visibility:auto;contain:strict}:host([hidden]){display:none}@layer base{.forge-linear-progress{--_track-height:var(--forge-linear-progress-height, 4px);--_track-color:var(--forge-linear-progress-indicator-background-color, #ced5f7);--_active-indicator-color:var(--forge-linear-progress-indicator-color, var(--forge-theme-tertiary, #3d5afe));--_track-shape:0;--_active-indicator-height:var(--_track-height);--_determinate-duration:250ms;--_indeterminate-duration:2s;--_determinate-easing:cubic-bezier(0.4, 0, 0.6, 1);--_track-dot-size:calc(var(--_track-height) / 2);--_track-background-width:calc(var(--_track-dot-size) * 5);--_track-background:0/var(--_track-background-width) 100% radial-gradient(\n        circle at calc(var(--_track-dot-size) * 2),\n        var(--_track-color) 0,\n        var(--_track-color) var(--_track-dot-size),\n        transparent var(--_track-dot-size)\n      );inset:0;outline:transparent solid 1px;border-radius:var(--_track-shape);overflow:hidden;display:-webkit-box;display:flex;-webkit-box-align:center;align-items:center}.bar,.bar-inner,.buffer-bar,.forge-linear-progress,.track{position:absolute}.bar{-webkit-animation:none;animation:none;inline-size:100%;block-size:var(--_active-indicator-height);-webkit-transform-origin:left center;transform-origin:left center;will-change:transform;-webkit-transition:-webkit-transform var(--_determinate-duration) var(--_determinate-easing);transition:-webkit-transform var(--_determinate-duration) var(--_determinate-easing);transition:transform var(--_determinate-duration) var(--_determinate-easing);transition:transform var(--_determinate-duration) var(--_determinate-easing),-webkit-transform var(--_determinate-duration) var(--_determinate-easing)}.secondary-bar{display:none}.bar-inner{inset:0;-webkit-animation:none;animation:none;background:var(--_active-indicator-color)}.buffer-bar{background:var(--_track-color);inset:0;will-change:transform;-webkit-transition:-webkit-transform var(--_determinate-duration) var(--_determinate-easing);transition:-webkit-transform var(--_determinate-duration) var(--_determinate-easing);transition:transform var(--_determinate-duration) var(--_determinate-easing);transition:transform var(--_determinate-duration) var(--_determinate-easing),-webkit-transform var(--_determinate-duration) var(--_determinate-easing);-webkit-transform-origin:left center;transform-origin:left center}.track{inset:0;will-change:transform;-webkit-animation:linear infinite var(--_determinate-duration);animation:linear infinite var(--_determinate-duration);-webkit-animation-name:buffering;animation-name:buffering;background:var(--_track-background)}}@layer indeterminate{.forge-linear-progress--indeterminate .bar{-webkit-transition:none;transition:none}.forge-linear-progress--indeterminate .primary-bar{inset-inline-start:-145.167%;will-change:transform;-webkit-animation:linear infinite var(--_indeterminate-duration);animation:linear infinite var(--_indeterminate-duration);-webkit-animation-name:primary-indeterminate-translate;animation-name:primary-indeterminate-translate}.forge-linear-progress--indeterminate .secondary-bar{inset-inline-start:-54.8889%;display:block;will-change:transform;-webkit-animation:linear infinite var(--_indeterminate-duration);animation:linear infinite var(--_indeterminate-duration);-webkit-animation-name:secondary-indeterminate-translate;animation-name:secondary-indeterminate-translate}.forge-linear-progress--indeterminate .track{display:none}.forge-linear-progress--indeterminate .primary-bar>.bar-inner{will-change:transform;-webkit-animation:linear infinite var(--_indeterminate-duration) primary-indeterminate-scale;animation:linear infinite var(--_indeterminate-duration) primary-indeterminate-scale}.forge-linear-progress--indeterminate .secondary-bar>.bar-inner{will-change:transform;-webkit-animation:linear infinite var(--_indeterminate-duration) secondary-indeterminate-scale;animation:linear infinite var(--_indeterminate-duration) secondary-indeterminate-scale}}:host-context([dir=rtl]) .forge-linear-progress .bar{-webkit-transform-origin:right center;transform-origin:right center}:host-context([dir=rtl]) .forge-linear-progress .buffer-bar{-webkit-transform-origin:right center;transform-origin:right center}:host-context([dir=rtl]) .forge-linear-progress .track{-webkit-animation-name:buffering-rtl;animation-name:buffering-rtl}:host-context([dir=rtl]) .forge-linear-progress.forge-linear-progress--indeterminate .primary-bar{-webkit-animation-name:primary-indeterminate-translate-rtl;animation-name:primary-indeterminate-translate-rtl}:host-context([dir=rtl]) .forge-linear-progress.forge-linear-progress--indeterminate .secondary-bar{-webkit-animation-name:secondary-indeterminate-translate-rtl;animation-name:secondary-indeterminate-translate-rtl}:host([dir=rtl]) .forge-linear-progress .bar{-webkit-transform-origin:right center;transform-origin:right center}:host([dir=rtl]) .forge-linear-progress .buffer-bar{-webkit-transform-origin:right center;transform-origin:right center}:host([dir=rtl]) .forge-linear-progress .track{-webkit-animation-name:buffering-rtl;animation-name:buffering-rtl}:host([dir=rtl]) .forge-linear-progress.forge-linear-progress--indeterminate .primary-bar{-webkit-animation-name:primary-indeterminate-translate-rtl;animation-name:primary-indeterminate-translate-rtl}:host([dir=rtl]) .forge-linear-progress.forge-linear-progress--indeterminate .secondary-bar{-webkit-animation-name:secondary-indeterminate-translate-rtl;animation-name:secondary-indeterminate-translate-rtl}.forge-linear-progress:dir(rtl) .bar{-webkit-transform-origin:right center;transform-origin:right center}.forge-linear-progress:dir(rtl) .buffer-bar{-webkit-transform-origin:right center;transform-origin:right center}.forge-linear-progress:dir(rtl) .track{-webkit-animation-name:buffering-rtl;animation-name:buffering-rtl}.forge-linear-progress:dir(rtl).forge-linear-progress--indeterminate .primary-bar{-webkit-animation-name:primary-indeterminate-translate-rtl;animation-name:primary-indeterminate-translate-rtl}.forge-linear-progress:dir(rtl).forge-linear-progress--indeterminate .secondary-bar{-webkit-animation-name:secondary-indeterminate-translate-rtl;animation-name:secondary-indeterminate-translate-rtl}@media screen and (forced-colors:active){.forge-linear-progress{--_active-indicator-color:canvastext;--_track-color:graytext;border:1px solid canvastext}.forge-linear-progress--indeterminate.forge-linear-progress{--_track-color:canvas}}@-webkit-keyframes buffering{0%{-webkit-transform:translateX(calc(1 * var(--_track-background-width)));transform:translateX(calc(1 * var(--_track-background-width)))}}@keyframes buffering{0%{-webkit-transform:translateX(calc(1 * var(--_track-background-width)));transform:translateX(calc(1 * var(--_track-background-width)))}}@-webkit-keyframes primary-indeterminate-translate{0%{-webkit-transform:translateX(0);transform:translateX(0)}20%{-webkit-animation-timing-function:cubic-bezier(0.5,0,0.701732,0.495819);animation-timing-function:cubic-bezier(0.5,0,0.701732,0.495819);-webkit-transform:translateX(0);transform:translateX(0)}59.15%{-webkit-animation-timing-function:cubic-bezier(0.302435,0.381352,0.55,0.956352);animation-timing-function:cubic-bezier(0.302435,0.381352,0.55,0.956352);-webkit-transform:translateX(calc(1 * 83.6714%));transform:translateX(calc(1 * 83.6714%))}100%{-webkit-transform:translateX(calc(1 * 200.611%));transform:translateX(calc(1 * 200.611%))}}@keyframes primary-indeterminate-translate{0%{-webkit-transform:translateX(0);transform:translateX(0)}20%{-webkit-animation-timing-function:cubic-bezier(0.5,0,0.701732,0.495819);animation-timing-function:cubic-bezier(0.5,0,0.701732,0.495819);-webkit-transform:translateX(0);transform:translateX(0)}59.15%{-webkit-animation-timing-function:cubic-bezier(0.302435,0.381352,0.55,0.956352);animation-timing-function:cubic-bezier(0.302435,0.381352,0.55,0.956352);-webkit-transform:translateX(calc(1 * 83.6714%));transform:translateX(calc(1 * 83.6714%))}100%{-webkit-transform:translateX(calc(1 * 200.611%));transform:translateX(calc(1 * 200.611%))}}@-webkit-keyframes secondary-indeterminate-translate{0%{-webkit-animation-timing-function:cubic-bezier(0.15,0,0.515058,0.409685);animation-timing-function:cubic-bezier(0.15,0,0.515058,0.409685);-webkit-transform:translateX(0);transform:translateX(0)}25%{-webkit-animation-timing-function:cubic-bezier(0.31033,0.284058,0.8,0.733712);animation-timing-function:cubic-bezier(0.31033,0.284058,0.8,0.733712);-webkit-transform:translateX(calc(1 * 37.6519%));transform:translateX(calc(1 * 37.6519%))}48.35%{-webkit-animation-timing-function:cubic-bezier(0.4,0.627035,0.6,0.902026);animation-timing-function:cubic-bezier(0.4,0.627035,0.6,0.902026);-webkit-transform:translateX(calc(1 * 84.3862%));transform:translateX(calc(1 * 84.3862%))}100%{-webkit-transform:translateX(calc(1 * 160.278%));transform:translateX(calc(1 * 160.278%))}}@keyframes secondary-indeterminate-translate{0%{-webkit-animation-timing-function:cubic-bezier(0.15,0,0.515058,0.409685);animation-timing-function:cubic-bezier(0.15,0,0.515058,0.409685);-webkit-transform:translateX(0);transform:translateX(0)}25%{-webkit-animation-timing-function:cubic-bezier(0.31033,0.284058,0.8,0.733712);animation-timing-function:cubic-bezier(0.31033,0.284058,0.8,0.733712);-webkit-transform:translateX(calc(1 * 37.6519%));transform:translateX(calc(1 * 37.6519%))}48.35%{-webkit-animation-timing-function:cubic-bezier(0.4,0.627035,0.6,0.902026);animation-timing-function:cubic-bezier(0.4,0.627035,0.6,0.902026);-webkit-transform:translateX(calc(1 * 84.3862%));transform:translateX(calc(1 * 84.3862%))}100%{-webkit-transform:translateX(calc(1 * 160.278%));transform:translateX(calc(1 * 160.278%))}}@-webkit-keyframes buffering-rtl{0%{-webkit-transform:translateX(calc(-1 * var(--_track-background-width)));transform:translateX(calc(-1 * var(--_track-background-width)))}}@keyframes buffering-rtl{0%{-webkit-transform:translateX(calc(-1 * var(--_track-background-width)));transform:translateX(calc(-1 * var(--_track-background-width)))}}@-webkit-keyframes primary-indeterminate-translate-rtl{0%{-webkit-transform:translateX(0);transform:translateX(0)}20%{-webkit-animation-timing-function:cubic-bezier(0.5,0,0.701732,0.495819);animation-timing-function:cubic-bezier(0.5,0,0.701732,0.495819);-webkit-transform:translateX(0);transform:translateX(0)}59.15%{-webkit-animation-timing-function:cubic-bezier(0.302435,0.381352,0.55,0.956352);animation-timing-function:cubic-bezier(0.302435,0.381352,0.55,0.956352);-webkit-transform:translateX(calc(-1 * 83.6714%));transform:translateX(calc(-1 * 83.6714%))}100%{-webkit-transform:translateX(calc(-1 * 200.611%));transform:translateX(calc(-1 * 200.611%))}}@keyframes primary-indeterminate-translate-rtl{0%{-webkit-transform:translateX(0);transform:translateX(0)}20%{-webkit-animation-timing-function:cubic-bezier(0.5,0,0.701732,0.495819);animation-timing-function:cubic-bezier(0.5,0,0.701732,0.495819);-webkit-transform:translateX(0);transform:translateX(0)}59.15%{-webkit-animation-timing-function:cubic-bezier(0.302435,0.381352,0.55,0.956352);animation-timing-function:cubic-bezier(0.302435,0.381352,0.55,0.956352);-webkit-transform:translateX(calc(-1 * 83.6714%));transform:translateX(calc(-1 * 83.6714%))}100%{-webkit-transform:translateX(calc(-1 * 200.611%));transform:translateX(calc(-1 * 200.611%))}}@-webkit-keyframes secondary-indeterminate-translate-rtl{0%{-webkit-animation-timing-function:cubic-bezier(0.15,0,0.515058,0.409685);animation-timing-function:cubic-bezier(0.15,0,0.515058,0.409685);-webkit-transform:translateX(0);transform:translateX(0)}25%{-webkit-animation-timing-function:cubic-bezier(0.31033,0.284058,0.8,0.733712);animation-timing-function:cubic-bezier(0.31033,0.284058,0.8,0.733712);-webkit-transform:translateX(calc(-1 * 37.6519%));transform:translateX(calc(-1 * 37.6519%))}48.35%{-webkit-animation-timing-function:cubic-bezier(0.4,0.627035,0.6,0.902026);animation-timing-function:cubic-bezier(0.4,0.627035,0.6,0.902026);-webkit-transform:translateX(calc(-1 * 84.3862%));transform:translateX(calc(-1 * 84.3862%))}100%{-webkit-transform:translateX(calc(-1 * 160.278%));transform:translateX(calc(-1 * 160.278%))}}@keyframes secondary-indeterminate-translate-rtl{0%{-webkit-animation-timing-function:cubic-bezier(0.15,0,0.515058,0.409685);animation-timing-function:cubic-bezier(0.15,0,0.515058,0.409685);-webkit-transform:translateX(0);transform:translateX(0)}25%{-webkit-animation-timing-function:cubic-bezier(0.31033,0.284058,0.8,0.733712);animation-timing-function:cubic-bezier(0.31033,0.284058,0.8,0.733712);-webkit-transform:translateX(calc(-1 * 37.6519%));transform:translateX(calc(-1 * 37.6519%))}48.35%{-webkit-animation-timing-function:cubic-bezier(0.4,0.627035,0.6,0.902026);animation-timing-function:cubic-bezier(0.4,0.627035,0.6,0.902026);-webkit-transform:translateX(calc(-1 * 84.3862%));transform:translateX(calc(-1 * 84.3862%))}100%{-webkit-transform:translateX(calc(-1 * 160.278%));transform:translateX(calc(-1 * 160.278%))}}@-webkit-keyframes primary-indeterminate-scale{0%{-webkit-transform:scaleX(.08);transform:scaleX(.08)}36.65%{-webkit-animation-timing-function:cubic-bezier(0.334731,0.12482,0.785844,1);animation-timing-function:cubic-bezier(0.334731,0.12482,0.785844,1);-webkit-transform:scaleX(.08);transform:scaleX(.08)}69.15%{-webkit-animation-timing-function:cubic-bezier(0.06,0.11,0.6,1);animation-timing-function:cubic-bezier(0.06,0.11,0.6,1);-webkit-transform:scaleX(.661479);transform:scaleX(.661479)}100%{-webkit-transform:scaleX(.08);transform:scaleX(.08)}}@keyframes primary-indeterminate-scale{0%{-webkit-transform:scaleX(.08);transform:scaleX(.08)}36.65%{-webkit-animation-timing-function:cubic-bezier(0.334731,0.12482,0.785844,1);animation-timing-function:cubic-bezier(0.334731,0.12482,0.785844,1);-webkit-transform:scaleX(.08);transform:scaleX(.08)}69.15%{-webkit-animation-timing-function:cubic-bezier(0.06,0.11,0.6,1);animation-timing-function:cubic-bezier(0.06,0.11,0.6,1);-webkit-transform:scaleX(.661479);transform:scaleX(.661479)}100%{-webkit-transform:scaleX(.08);transform:scaleX(.08)}}@-webkit-keyframes secondary-indeterminate-scale{0%{-webkit-animation-timing-function:cubic-bezier(0.205028,0.057051,0.57661,0.453971);animation-timing-function:cubic-bezier(0.205028,0.057051,0.57661,0.453971);-webkit-transform:scaleX(.08);transform:scaleX(.08)}19.15%{-webkit-animation-timing-function:cubic-bezier(0.152313,0.196432,0.648374,1.00432);animation-timing-function:cubic-bezier(0.152313,0.196432,0.648374,1.00432);-webkit-transform:scaleX(.457104);transform:scaleX(.457104)}44.15%{-webkit-animation-timing-function:cubic-bezier(0.257759,-0.003163,0.211762,1.38179);animation-timing-function:cubic-bezier(0.257759,-0.003163,0.211762,1.38179);-webkit-transform:scaleX(.72796);transform:scaleX(.72796)}100%{-webkit-transform:scaleX(.08);transform:scaleX(.08)}}@keyframes secondary-indeterminate-scale{0%{-webkit-animation-timing-function:cubic-bezier(0.205028,0.057051,0.57661,0.453971);animation-timing-function:cubic-bezier(0.205028,0.057051,0.57661,0.453971);-webkit-transform:scaleX(.08);transform:scaleX(.08)}19.15%{-webkit-animation-timing-function:cubic-bezier(0.152313,0.196432,0.648374,1.00432);animation-timing-function:cubic-bezier(0.152313,0.196432,0.648374,1.00432);-webkit-transform:scaleX(.457104);transform:scaleX(.457104)}44.15%{-webkit-animation-timing-function:cubic-bezier(0.257759,-0.003163,0.211762,1.38179);animation-timing-function:cubic-bezier(0.257759,-0.003163,0.211762,1.38179);-webkit-transform:scaleX(.72796);transform:scaleX(.72796)}100%{-webkit-transform:scaleX(.08);transform:scaleX(.08)}}';
 /**
- * The web component class behind the `<forge-linear-progress>` custom element.
- *
  * @tag forge-linear-progress
+ *
+ * @summary
+ * Linear progress indicators display progress by animating along a linear track in a horizontal direction.
+ *
+ * @description
+ * Progress indicators inform users about the status of ongoing processes.
+ * - Determinate indicators display how long a process will take.
+ * - Indeterminate indicators express an unspecified amount of wait time.
+ *
+ * @property {boolean} determinate - Controls the determinate state.
+ * @property {boolean} progress - Controls the progress while in a determinate state. Accepts values from `0` to `1`.
+ * @property {boolean} buffer - Controls the buffer progress while in a determinate state. Accepts values from `0` to `1`.
+ *
+ * @attribute {boolean} determinate - Controls the determinate state.
+ * @attribute {number} progress - Controls the progress while in a determinate state. Accepts values from `0` to `1`.
+ * @attribute {number} buffer - Controls the buffer progress while in a determinate state. Accepts values from `0` to `1`.
+ * @attribute {string} data-aria-label - Propagates an `aria-label` to the underlying progress bar element.
+ *
+ * @cssproperty --forge-linear-progress-height - The height of the indicator container.
+ * @cssproperty --forge-linear-progress-indicator-background-color - The background color of the indicator.
+ * @cssproperty --forge-linear-progress-indicator-color - The color of the indicator.
+ *
+ * @csspart progressbar - Styles the progress bar container element
  */
 let LinearProgressComponent = class LinearProgressComponent extends BaseComponent {
     constructor() {
         super();
-        this._determinate = false;
-        this._progress = 0;
-        this._buffer = 1;
-        this._visible = true;
         attachShadowTemplate(this, template, styles);
-        this._progressbarElement = getShadowElement(this, LINEAR_PROGRESS_CONSTANTS.selectors.ROOT);
+        this._foundation = new LinearProgressFoundation(new LinearProgressAdapter(this));
     }
     static get observedAttributes() {
         return [
             LINEAR_PROGRESS_CONSTANTS.attributes.DETERMINATE,
             LINEAR_PROGRESS_CONSTANTS.attributes.PROGRESS,
             LINEAR_PROGRESS_CONSTANTS.attributes.BUFFER,
-            LINEAR_PROGRESS_CONSTANTS.attributes.VISIBLE,
-            LINEAR_PROGRESS_CONSTANTS.attributes.PROGRESSBAR_ARIA_LABEL
+            LINEAR_PROGRESS_CONSTANTS.attributes.ARIA_LABEL
         ];
     }
-    connectedCallback() {
-        this._initialize();
-    }
-    disconnectedCallback() {
-        if (this._mdcLinearProgress) {
-            this._mdcLinearProgress.destroy();
-        }
-    }
     attributeChangedCallback(name, oldValue, newValue) {
         switch (name) {
             case LINEAR_PROGRESS_CONSTANTS.attributes.DETERMINATE:
@@ -53,93 +62,21 @@ let LinearProgressComponent = class LinearProgressComponent extends BaseComponen
             case LINEAR_PROGRESS_CONSTANTS.attributes.BUFFER:
                 this.buffer = coerceNumber(newValue);
                 break;
-            case LINEAR_PROGRESS_CONSTANTS.attributes.VISIBLE:
-                this.visible = coerceBoolean(newValue);
+            case LINEAR_PROGRESS_CONSTANTS.attributes.ARIA_LABEL:
+                this._foundation.ariaLabel = newValue;
                 break;
-            case LINEAR_PROGRESS_CONSTANTS.attributes.PROGRESSBAR_ARIA_LABEL:
-                toggleAttribute(this._progressbarElement, !!newValue, 'aria-label', newValue);
-                break;
-        }
-    }
-    set determinate(value) {
-        if (this._determinate !== value) {
-            this._determinate = value;
-            if (this._mdcLinearProgress) {
-                this._mdcLinearProgress.determinate = value;
-            }
-            this.setAttribute(LINEAR_PROGRESS_CONSTANTS.attributes.DETERMINATE, value.toString());
-        }
-    }
-    get determinate() {
-        return this._determinate;
-    }
-    set progress(value) {
-        if (this._progress !== value) {
-            this._progress = value;
-            if (this._mdcLinearProgress) {
-                this._mdcLinearProgress.progress = value;
-            }
-            this.setAttribute(LINEAR_PROGRESS_CONSTANTS.attributes.PROGRESS, value.toString());
-        }
-    }
-    get progress() {
-        return this._progress;
-    }
-    set buffer(value) {
-        if (this._buffer !== value) {
-            this._buffer = value;
-            if (this._mdcLinearProgress) {
-                this._mdcLinearProgress.buffer = value;
-            }
-            this.setAttribute(LINEAR_PROGRESS_CONSTANTS.attributes.BUFFER, value.toString());
-        }
-    }
-    get buffer() {
-        return this._buffer;
-    }
-    get visible() {
-        return this._visible;
-    }
-    set visible(value) {
-        if (this._visible !== value) {
-            this._visible = value;
-            this._applyVisibility(value);
-        }
-    }
-    open() {
-        this._visible = true;
-        if (this._mdcLinearProgress) {
-            this._mdcLinearProgress.open();
-        }
-    }
-    close() {
-        this._visible = false;
-        if (this._mdcLinearProgress) {
-            this._mdcLinearProgress.close();
-        }
-    }
-    _initialize() {
-        var _a;
-        const root = (_a = this.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector(LINEAR_PROGRESS_CONSTANTS.selectors.ROOT);
-        this._mdcLinearProgress = new MDCLinearProgress(root);
-        this._mdcLinearProgress.initialize();
-        this._mdcLinearProgress.determinate = this._determinate;
-        this._mdcLinearProgress.progress = this._progress;
-        this._mdcLinearProgress.buffer = this._buffer;
-        // We are visible by default so we only apply initial visibility if otherwise
-        if (!this._visible) {
-            this._applyVisibility(this._visible);
-        }
-    }
-    _applyVisibility(value) {
-        if (value) {
-            this.open();
-        }
-        else {
-            this.close();
         }
     }
 };
+__decorate([
+    FoundationProperty()
+], LinearProgressComponent.prototype, "determinate", void 0);
+__decorate([
+    FoundationProperty()
+], LinearProgressComponent.prototype, "progress", void 0);
+__decorate([
+    FoundationProperty()
+], LinearProgressComponent.prototype, "buffer", void 0);
 LinearProgressComponent = __decorate([
     CustomElement({
         name: LINEAR_PROGRESS_CONSTANTS.elementName

package/esm/list-dropdown/list-dropdown-adapter.js

@@ -43,7 +43,7 @@ export class ListDropdownAdapter {
         // Create the list from our config
         this._listElement = createList(config);
         // Add the listener for when list items are selected from the dropdown
-        this._listElement.addEventListener(LIST_ITEM_CONSTANTS.events.SELECT, (evt) => {
+        this._listElement.addEventListener('forge-list-item-select', evt => {
             evt.detail.listItem.setAttribute('aria-selected', 'true');
             selectCallback(evt.detail.value, evt.detail.listItem.id);
         });
@@ -192,7 +192,7 @@ export class ListDropdownAdapter {
             removeElement(this._asyncElement);
         }
         if (this._busyElement) {
-            this._busyElement.close();
+            this._busyElement.style.display = 'none';
         }
         if (!this._listElement.isConnected) {
             this._dropdownElement.appendChild(this._listElement);
@@ -221,10 +221,9 @@ export class ListDropdownAdapter {
         }
         if (isVisible) {
             this._busyElement.style.removeProperty('display');
-            this._busyElement.open();
         }
         else {
-            this._busyElement.close();
+            this._busyElement.style.display = 'none';
         }
     }
     getScreenWidth() {

package/esm/split-view/split-view/split-view-adapter.js

@@ -33,7 +33,9 @@ export class SplitViewAdapter extends BaseAdapter {
      */
     getSlottedPanels() {
         const nodeList = this._component.querySelectorAll(SPLIT_VIEW_CONSTANTS.selectors.PANEL);
-        return Array.from(nodeList);
+        const panelArray = Array.from(nodeList);
+        const immediateChildPanels = panelArray.filter(panel => panel.parentElement === this._component);
+        return immediateChildPanels;
     }
     refitSlottedPanels(orientation) {
         // Check if the combined panel size is greater than the split view size along the relevant axis