@tylertech/forge 3.0.0-next.11 → 3.0.0-next.12

package/esm/icon/icon-adapter.js

@@ -9,11 +9,6 @@ export class IconAdapter extends BaseAdapter {
     constructor(component) {
         super(component);
     }
-    initialize() {
-        if (!this._component.hasAttribute('aria-hidden')) {
-            this._component.setAttribute('aria-hidden', 'true');
-        }
-    }
     canLazyLoad() {
         return !!window.IntersectionObserver;
     }
@@ -33,9 +28,13 @@ export class IconAdapter extends BaseAdapter {
         }
     }
     setContent(content) {
+        var _a;
         const shadowRoot = this._component.shadowRoot;
         const styleTag = shadowRoot.querySelector('style');
         shadowRoot.innerHTML = content;
+        if (content) {
+            (_a = shadowRoot.firstElementChild) === null || _a === void 0 ? void 0 : _a.setAttribute('aria-hidden', 'true');
+        }
         if (styleTag) {
             shadowRoot.appendChild(styleTag);
         }

package/esm/icon/icon-foundation.js

@@ -13,7 +13,6 @@ export class IconFoundation {
         this._lazyListener = () => this._loadIcon();
     }
     initialize() {
-        this._adapter.initialize();
         this._applyIcon();
     }
     disconnect() {

package/esm/index.d.ts

@@ -13,6 +13,7 @@ export * from './banner';
 export * from './bottom-sheet';
 export * from './busy-indicator';
 export * from './button';
+export * from './button-area';
 export * from './button-toggle';
 export * from './calendar';
 export * from './card';

package/esm/index.js

@@ -6,7 +6,7 @@
 /// <reference types="./typings" />
 /**
  * @license
- * Copyright (c) 2022 Tyler Technologies, Inc.
+ * Copyright (c) 2024 Tyler Technologies, Inc.
  * License: Apache-2.0
  */
 import { defineCustomElements } from '@tylertech/forge-core';
@@ -72,6 +72,7 @@ import { ViewComponent, ViewSwitcherComponent } from './view-switcher';
 import { IconComponent } from './icon';
 import { SelectDropdownComponent } from './select/select-dropdown';
 import { StackComponent } from './stack';
+import { ButtonAreaComponent } from './button-area';
 export * from './accordion';
 export * from './app-bar';
 export * from './autocomplete';
@@ -82,6 +83,7 @@ export * from './banner';
 export * from './bottom-sheet';
 export * from './busy-indicator';
 export * from './button';
+export * from './button-area';
 export * from './button-toggle';
 export * from './calendar';
 export * from './card';
@@ -146,6 +148,7 @@ const CUSTOM_ELEMENTS = [
     BottomSheetComponent,
     BusyIndicatorComponent,
     ButtonComponent,
+    ButtonAreaComponent,
     ButtonToggleComponent,
     ButtonToggleGroupComponent,
     CalendarComponent,

package/esm/keyboard-shortcut/keyboard-shortcut-constants.d.ts

@@ -23,6 +23,7 @@ export declare const KEYBOARD_SHORTCUT_CONSTANTS: {
     };
 };
 export declare const textInputTypes: string[];
+export type KeyboardShortcutActivateCallback = (event: KeyboardEvent) => void;
 export interface IKeyCombination {
     key: string;
     modifier?: string;

package/esm/keyboard-shortcut/keyboard-shortcut-foundation.d.ts

@@ -5,6 +5,7 @@
  */
 import { ICustomElementFoundation } from '@tylertech/forge-core';
 import { IKeyboardShortcutAdapter } from './keyboard-shortcut-adapter';
+import { KeyboardShortcutActivateCallback } from './keyboard-shortcut-constants';
 export interface IKeyboardShortcutFoundation extends ICustomElementFoundation {
     key: string | null | undefined;
     target: string;
@@ -14,6 +15,7 @@ export interface IKeyboardShortcutFoundation extends ICustomElementFoundation {
     capture: boolean;
     useCode: boolean;
     disabled: boolean;
+    activateCallback: KeyboardShortcutActivateCallback | null | undefined;
 }
 export declare class KeyboardShortcutFoundation implements IKeyboardShortcutFoundation {
     private _adapter;
@@ -25,6 +27,7 @@ export declare class KeyboardShortcutFoundation implements IKeyboardShortcutFoun
     private _capture;
     private _useCode;
     private _disabled;
+    private _activateCallback;
     private _keyCombinations;
     private _keyDownListener;
     constructor(_adapter: IKeyboardShortcutAdapter);
@@ -60,4 +63,7 @@ export declare class KeyboardShortcutFoundation implements IKeyboardShortcutFoun
     /** Gets/sets whether the event will be emitted. */
     get disabled(): boolean;
     set disabled(value: boolean);
+    /** Gets/sets the activation callback. */
+    get activateCallback(): KeyboardShortcutActivateCallback | null | undefined;
+    set activateCallback(value: KeyboardShortcutActivateCallback | null | undefined);
 }

package/esm/keyboard-shortcut/keyboard-shortcut-foundation.js

@@ -48,6 +48,7 @@ export class KeyboardShortcutFoundation {
     }
     _onKeyDown(evt) {
         // Here we may check if the target element is disabled, but disabled elements typically can't receive focus anyway
+        var _a;
         // Ignore the event if it originates from a text field
         // TODO: bypass this and allow it if a modifier key is used?
         if (!this._allowWhileTyping && elementAcceptsTextInput(evt.target)) {
@@ -58,6 +59,7 @@ export class KeyboardShortcutFoundation {
                 evt.preventDefault();
             }
             this._adapter.emitHostEvent(KEYBOARD_SHORTCUT_CONSTANTS.events.ACTIVATE, evt);
+            (_a = this._activateCallback) === null || _a === void 0 ? void 0 : _a.call(null, evt);
         }
     }
     /** Sets the key combinations. */
@@ -161,4 +163,11 @@ export class KeyboardShortcutFoundation {
             }
         }
     }
+    /** Gets/sets the activation callback. */
+    get activateCallback() {
+        return this._activateCallback;
+    }
+    set activateCallback(value) {
+        this._activateCallback = value;
+    }
 }

package/esm/keyboard-shortcut/keyboard-shortcut.d.ts

@@ -3,6 +3,7 @@
  * Copyright 2023 Tyler Technologies, Inc. 
  * License: Apache-2.0
  */
+import { KeyboardShortcutActivateCallback } from './keyboard-shortcut-constants';
 import { BaseComponent, IBaseComponent } from '../core/base/base-component';
 export interface IKeyboardShortcutComponent extends IBaseComponent {
     key: string | null | undefined;
@@ -14,6 +15,7 @@ export interface IKeyboardShortcutComponent extends IBaseComponent {
     capture: boolean;
     useCode: boolean;
     disabled: boolean;
+    activateCallback: KeyboardShortcutActivateCallback | null | undefined;
 }
 declare global {
     interface HTMLElementTagNameMap {
@@ -54,4 +56,6 @@ export declare class KeyboardShortcutComponent extends BaseComponent implements
     useCode: boolean;
     /** Gets/sets whether the callback will be called. */
     disabled: boolean;
+    /** Gets/sets whether the activation callback. */
+    activateCallback: KeyboardShortcutActivateCallback | null | undefined;
 }

package/esm/keyboard-shortcut/keyboard-shortcut.js

@@ -97,6 +97,9 @@ __decorate([
 __decorate([
     FoundationProperty()
 ], KeyboardShortcutComponent.prototype, "disabled", void 0);
+__decorate([
+    FoundationProperty()
+], KeyboardShortcutComponent.prototype, "activateCallback", void 0);
 KeyboardShortcutComponent = __decorate([
     CustomElement({
         name: KEYBOARD_SHORTCUT_CONSTANTS.elementName

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

@@ -10,7 +10,7 @@ import { LinearProgressAdapter } from './linear-progress-adapter';
 import { LINEAR_PROGRESS_CONSTANTS } from './linear-progress-constants';
 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-track-height,4px);content-visibility:auto;contain:strict}:host([hidden]){display:none}.forge-linear-progress{--_track-height:var(--forge-linear-progress-track-height, 4px);--_track-color:var(--forge-linear-progress-track-color, var(--forge-theme-tertiary-track-color, #d0d7ff));--_active-indicator-color:var(--forge-linear-progress-indicator-color, var(--forge-theme-tertiary, #3d5afe));--_track-shape:var(--forge-linear-progress-track-shape, var(--forge-shape-full, 9999px));--_active-indicator-height:var(--forge-linear-progress-indicator-height, var(--_track-height));--_determinate-duration:var(--forge-linear-progress-determinate-duration, var(--forge-animation-duration-medium1, 250ms));--_indeterminate-duration:var(--forge-linear-progress-indeterminate-duration, 2s);--_determinate-easing:var(--forge-linear-progress-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)}.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.forge-linear-progress--indeterminate{--_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)}}';
+const styles = ':host{display:block;position:relative;min-inline-size:80px;block-size:var(--forge-linear-progress-track-height,4px);content-visibility:auto;contain:strict}:host([hidden]){display:none}.forge-linear-progress{--_track-height:var(--forge-linear-progress-track-height, 4px);--_track-color:var(--forge-linear-progress-track-color, var(--forge-theme-tertiary-container, #d0d7ff));--_active-indicator-color:var(--forge-linear-progress-indicator-color, var(--forge-theme-tertiary, #3d5afe));--_track-shape:var(--forge-linear-progress-track-shape, var(--forge-shape-full, 9999px));--_active-indicator-height:var(--forge-linear-progress-indicator-height, var(--_track-height));--_determinate-duration:var(--forge-linear-progress-determinate-duration, var(--forge-animation-duration-medium1, 250ms));--_indeterminate-duration:var(--forge-linear-progress-indeterminate-duration, 2s);--_determinate-easing:var(--forge-linear-progress-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)}.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.forge-linear-progress--indeterminate{--_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)}}';
 /**
  * @tag forge-linear-progress
  *

package/esm/list/list/list-adapter.d.ts

@@ -3,59 +3,35 @@
  * Copyright 2023 Tyler Technologies, Inc. 
  * License: Apache-2.0
  */
-import { BaseAdapter, IBaseAdapter } from '../../core/base/base-adapter';
-import { IListItemComponent } from '../list-item';
+import { BaseAdapter } from '../../core/base/base-adapter';
 import { IListComponent } from './list';
-export interface IListAdapter extends IBaseAdapter {
-    initializeAccessibility(): void;
-    addListener(type: string, listener: (evt: Event) => void): void;
-    removeListener(type: string, listener: (evt: Event) => void): void;
-    getListItems(): IListItemComponent[];
+import { IListItemComponent } from '../list-item/list-item';
+export interface IListAdapter extends BaseAdapter<IListComponent> {
+    initialize(): void;
     focusNextListItem(): void;
     focusPreviousListItem(): void;
     focusFirstListItem(): void;
     focusLastListItem(): void;
-    setSelectedListItems(values: any[]): void;
+    setSelectedListItems(values: unknown | unknown[]): void;
     updateListItems(cb: (li: IListItemComponent) => void): void;
+    updateListItemRole(): void;
 }
-/**
- * The DOM adapter for the `<forge-list>` component.
- */
 export declare class ListAdapter extends BaseAdapter<IListComponent> implements IListAdapter {
     constructor(component: IListComponent);
-    initializeAccessibility(): void;
-    /**
-     * Adds an event listener to the `<forge-list>` host element.
-     * @param {string} type The event type.
-     * @param {Function} listener The event callback.
-     */
-    addListener(type: string, listener: (evt: Event) => void): void;
-    /**
-     * Removes an event listener to the `<forge-list>` host element.
-     * @param {string} type The event type.
-     * @param {Function} listener The event callback.
-     */
-    removeListener(type: string, listener: (evt: Event) => void): void;
-    /**
-     * Returns all child `<forge-list-item>` elements.
-     */
-    getListItems(): IListItemComponent[];
-    /**
-     * Sets focus to the next item in the list.
-     */
+    initialize(): void;
+    /** Sets focus to the next item in the list. */
     focusNextListItem(): void;
-    /**
-     * Sets focus to the previous item in the list.
-     */
+    /** Sets focus to the previous item in the list. */
     focusPreviousListItem(): void;
-    /**
-     * Sets focus to the first item in the list.
-     */
+    /** Sets focus to the first item in the list. */
     focusFirstListItem(): void;
-    /**
-     * Sets focus to the last item in the list.
-     */
+    /** Sets focus to the last item in the list. */
     focusLastListItem(): void;
-    setSelectedListItems(values: any[]): void;
+    /** Select all list items that match values in the provided array of values. */
+    setSelectedListItems(value: unknown | unknown[]): void;
+    /** Calls the provided callback on all list items to apply an updated property to each list item. */
     updateListItems(cb: (li: IListItemComponent) => void): void;
+    updateListItemRole(): void;
+    private _getListItems;
+    private _getFocusableListItems;
 }

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

@@ -3,97 +3,80 @@
  * Copyright 2023 Tyler Technologies, Inc. 
  * License: Apache-2.0
  */
-import { deepQuerySelectorAll, getActiveElement } from '@tylertech/forge-core';
+import { isDeepEqual } from '@tylertech/forge-core';
 import { BaseAdapter } from '../../core/base/base-adapter';
-import { LIST_ITEM_CONSTANTS } from '../list-item';
-import { LIST_CONSTANTS } from './list-constants';
-/**
- * The DOM adapter for the `<forge-list>` component.
- */
+import { LIST_ITEM_CONSTANTS } from '../list-item/list-item-constants';
+import { ListComponentItemRole, LIST_CONSTANTS } from './list-constants';
 export class ListAdapter extends BaseAdapter {
     constructor(component) {
         super(component);
     }
-    initializeAccessibility() {
+    initialize() {
         if (!this._component.hasAttribute('role')) {
             this._component.setAttribute('role', 'list');
         }
     }
-    /**
-     * Adds an event listener to the `<forge-list>` host element.
-     * @param {string} type The event type.
-     * @param {Function} listener The event callback.
-     */
-    addListener(type, listener) {
-        this._component.addEventListener(type, listener);
-    }
-    /**
-     * Removes an event listener to the `<forge-list>` host element.
-     * @param {string} type The event type.
-     * @param {Function} listener The event callback.
-     */
-    removeListener(type, listener) {
-        this._component.removeEventListener(type, listener);
-    }
-    /**
-     * Returns all child `<forge-list-item>` elements.
-     */
-    getListItems() {
-        return Array.from(this._component.children).filter(child => child.tagName === LIST_ITEM_CONSTANTS.elementName.toUpperCase());
-    }
-    /**
-     * Sets focus to the next item in the list.
-     */
+    /** Sets focus to the next item in the list. */
     focusNextListItem() {
-        const listItems = deepQuerySelectorAll(this._component, LIST_CONSTANTS.selectors.FOCUSABLE_LIST_ITEMS, false);
-        if (listItems && listItems.length > 0) {
-            const focusedListItemIndex = listItems.indexOf(getActiveElement(this._component.ownerDocument));
+        const listItems = this._getFocusableListItems();
+        if (listItems.length) {
+            const focusedListItemIndex = listItems.findIndex(item => item.matches(':focus'));
+            console.log('focusedListItemIndex', focusedListItemIndex);
             const nextIndex = focusedListItemIndex < listItems.length - 1 ? focusedListItemIndex + 1 : 0;
             if (nextIndex <= listItems.length - 1) {
-                listItems[nextIndex].focus();
+                listItems[nextIndex].focus({ preventScroll: true });
             }
         }
     }
-    /**
-     * Sets focus to the previous item in the list.
-     */
+    /** Sets focus to the previous item in the list. */
     focusPreviousListItem() {
-        const listItems = deepQuerySelectorAll(this._component, LIST_CONSTANTS.selectors.FOCUSABLE_LIST_ITEMS, false);
-        if (listItems && listItems.length > 0) {
-            const focusedListItemIndex = listItems.indexOf(getActiveElement(this._component.ownerDocument));
+        const listItems = this._getFocusableListItems();
+        if (listItems.length) {
+            const focusedListItemIndex = listItems.findIndex(item => item.matches(':focus'));
             const nextIndex = focusedListItemIndex > 0 ? focusedListItemIndex - 1 : listItems.length - 1;
             if (nextIndex >= 0) {
-                listItems[nextIndex].focus();
+                listItems[nextIndex].focus({ preventScroll: true });
             }
         }
     }
-    /**
-     * Sets focus to the first item in the list.
-     */
+    /** Sets focus to the first item in the list. */
     focusFirstListItem() {
-        const listItems = deepQuerySelectorAll(this._component, LIST_CONSTANTS.selectors.FOCUSABLE_LIST_ITEMS, false);
-        if (listItems && listItems.length > 0) {
-            listItems[0].focus();
+        const listItems = this._getFocusableListItems();
+        if (listItems.length) {
+            listItems[0].focus({ preventScroll: true });
         }
     }
-    /**
-     * Sets focus to the last item in the list.
-     */
+    /** Sets focus to the last item in the list. */
     focusLastListItem() {
-        const listItems = deepQuerySelectorAll(this._component, LIST_CONSTANTS.selectors.FOCUSABLE_LIST_ITEMS, false);
-        if (listItems && listItems.length > 0) {
-            listItems[listItems.length - 1].focus();
+        const listItems = this._getFocusableListItems();
+        if (listItems.length) {
+            listItems[listItems.length - 1].focus({ preventScroll: true });
         }
     }
-    setSelectedListItems(values) {
-        const listItems = Array.from(this._component.querySelectorAll(LIST_ITEM_CONSTANTS.elementName));
-        if (listItems && listItems.length) {
+    /** Select all list items that match values in the provided array of values. */
+    setSelectedListItems(value) {
+        const listItems = this._getListItems();
+        if (listItems.length) {
+            const values = Array.isArray(value) ? value : [value];
             for (const item of listItems) {
-                item.selected = values.includes(item.value);
+                item.selected = values.some(val => isDeepEqual(val, item.value));
             }
         }
     }
+    /** Calls the provided callback on all list items to apply an updated property to each list item. */
     updateListItems(cb) {
-        this.getListItems().forEach(li => cb(li));
+        this._getListItems().forEach(cb);
+    }
+    updateListItemRole() {
+        var _a;
+        const role = (_a = ListComponentItemRole[this._component.getAttribute('role')]) !== null && _a !== void 0 ? _a : 'listitem';
+        this.updateListItems(li => li.role = role);
+    }
+    _getListItems() {
+        const listItems = Array.from(this._component.querySelectorAll(LIST_ITEM_CONSTANTS.elementName));
+        return listItems.filter(item => item.closest(LIST_CONSTANTS.elementName) === this._component);
+    }
+    _getFocusableListItems() {
+        return this._getListItems().filter(li => !li.disabled && !li.nonInteractive && !li.hidden);
     }
 }

package/esm/list/list/list-constants.d.ts

@@ -4,15 +4,23 @@
  * License: Apache-2.0
  */
 export declare const LIST_CONSTANTS: {
-    elementName: "forge-list";
+    elementName: string;
     attributes: {
+        ROLE: string;
         STATIC: string;
+        NON_INTERACTIVE: string;
+        DISABLED: string;
         DENSE: string;
         PROPAGATE_CLICK: string;
-        INDENTED: string;
         SELECTED_VALUE: string;
+        INDENTED: string;
+        TWO_LINE: string;
+        THREE_LINE: string;
+        WRAP: string;
     };
-    selectors: {
-        FOCUSABLE_LIST_ITEMS: string;
-    };
+};
+export declare const ListComponentItemRole: {
+    list: string;
+    listbox: string;
+    menu: string;
 };

package/esm/list/list/list-constants.js

@@ -5,18 +5,26 @@
  */
 import { COMPONENT_NAME_PREFIX } from '../../constants';
 const elementName = `${COMPONENT_NAME_PREFIX}list`;
-const attributes = {
+const observedAttributes = {
+    ROLE: 'role',
     STATIC: 'static',
+    NON_INTERACTIVE: 'non-interactive',
+    DISABLED: 'disabled',
     DENSE: 'dense',
     PROPAGATE_CLICK: 'propagate-click',
+    SELECTED_VALUE: 'selected-value',
     INDENTED: 'indented',
-    SELECTED_VALUE: 'selected-value'
-};
-const selectors = {
-    FOCUSABLE_LIST_ITEMS: '.forge-list-item:not(.forge-list-item--static):not(.forge-list-item--disabled)'
+    TWO_LINE: 'two-line',
+    THREE_LINE: 'three-line',
+    WRAP: 'wrap'
 };
+const attributes = Object.assign({}, observedAttributes);
 export const LIST_CONSTANTS = {
     elementName,
-    attributes,
-    selectors
+    attributes
+};
+export const ListComponentItemRole = {
+    list: 'listitem',
+    listbox: 'option',
+    menu: 'menuitem'
 };

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

@@ -7,42 +7,50 @@ import { ICustomElementFoundation } from '@tylertech/forge-core';
 import { IListAdapter } from './list-adapter';
 export interface IListFoundation extends ICustomElementFoundation {
     static: boolean;
+    nonInteractive: boolean;
+    disabled: boolean;
     dense: boolean;
     propagateClick: boolean;
     indented: boolean;
-    selectedValue: any;
+    selectedValue: unknown | unknown[];
+    twoLine: boolean;
+    threeLine: boolean;
+    wrap: boolean;
 }
-/**
- * The foundation class behind the `<forge-list>` component.
- */
 export declare class ListFoundation implements IListFoundation {
     private _adapter;
-    private _static;
+    private _nonInteractive;
+    private _disabled;
     private _dense;
     private _propagateClick;
     private _indented;
     private _selectedValue;
+    private _twoLine;
+    private _threeLine;
+    private _wrap;
     private _keydownListener;
     constructor(_adapter: IListAdapter);
     initialize(): void;
     private _onKeydown;
-    /**
-     * Ensures that preventDefault is only called if the containing element doesn't
-     * consume the event, and it will cause an unintended scroll.
-     * @param {Event} evt
-     */
-    private _preventDefaultEvent;
-    private _setSelectedValue;
-    /** Gets/sets whether the list has all static items or not. */
+    updateRole(): void;
     get static(): boolean;
     set static(value: boolean);
-    /** Gets/sets whether the list has all dense items or not. */
+    get nonInteractive(): boolean;
+    set nonInteractive(value: boolean);
+    get disabled(): boolean;
+    set disabled(value: boolean);
     get dense(): boolean;
     set dense(value: boolean);
     get propagateClick(): boolean;
     set propagateClick(value: boolean);
     get indented(): boolean;
     set indented(value: boolean);
-    get selectedValue(): any;
-    set selectedValue(value: any);
+    get selectedValue(): unknown | unknown[];
+    set selectedValue(value: unknown | unknown[]);
+    get twoLine(): boolean;
+    set twoLine(value: boolean);
+    get threeLine(): boolean;
+    set threeLine(value: boolean);
+    get wrap(): boolean;
+    set wrap(value: boolean);
 }