@tylertech/forge 2.13.2 → 2.14.0-dev.0

package/esm/ripple/ripple.js

@@ -22,7 +22,8 @@ let RippleComponent = class RippleComponent extends BaseComponent {
     static get observedAttributes() {
         return [
             RIPPLE_CONSTANTS.attributes.TARGET,
-            RIPPLE_CONSTANTS.attributes.UNBOUNDED
+            RIPPLE_CONSTANTS.attributes.UNBOUNDED,
+            RIPPLE_CONSTANTS.attributes.SELECTED
         ];
     }
     connectedCallback() {
@@ -39,6 +40,9 @@ let RippleComponent = class RippleComponent extends BaseComponent {
             case RIPPLE_CONSTANTS.attributes.UNBOUNDED:
                 this.unbounded = coerceBoolean(newValue);
                 break;
+            case RIPPLE_CONSTANTS.attributes.SELECTED:
+                this.selected = coerceBoolean(newValue);
+                break;
         }
     }
     layout() {
@@ -57,6 +61,9 @@ __decorate([
 __decorate([
     FoundationProperty()
 ], RippleComponent.prototype, "unbounded", void 0);
+__decorate([
+    FoundationProperty()
+], RippleComponent.prototype, "selected", void 0);
 RippleComponent = __decorate([
     CustomElement({
         name: RIPPLE_CONSTANTS.elementName

package/esm/select/core/base-select-adapter.js

@@ -10,7 +10,6 @@ import { OPTION_CONSTANTS } from '../option';
 import { OPTION_GROUP_CONSTANTS } from '../option-group';
 import { isOptionGroupObject } from './select-utils';
 import { POPUP_CONSTANTS } from '../../popup';
-import { assignMatchingProperties } from '../../core/utils/utils';
 export class BaseSelectAdapter extends BaseAdapter {
     constructor(component) {
         super(component);
@@ -25,7 +24,12 @@ export class BaseSelectAdapter extends BaseAdapter {
             return optionGroupElements.map(optionGroupElement => {
                 const optionElements = Array.from(optionGroupElement.querySelectorAll(OPTION_CONSTANTS.elementName));
                 const options = this._createOptionsFromElements(optionElements);
-                return { text: optionGroupElement.label, options };
+                return {
+                    text: optionGroupElement.label,
+                    builder: optionGroupElement.builder,
+                    value: optionGroupElement.value,
+                    options
+                };
             });
         }
         else {
@@ -172,15 +176,13 @@ export class BaseSelectAdapter extends BaseAdapter {
         existingOptionElements.forEach((o) => removeElement(o));
     }
     _createOptionGroupElement(group) {
-        var _a;
         const optionGroupElement = document.createElement('forge-option-group');
-        assignMatchingProperties(group, optionGroupElement);
-        optionGroupElement.label = (_a = group.text) !== null && _a !== void 0 ? _a : '';
+        Object.assign(optionGroupElement, group);
         return optionGroupElement;
     }
     _createOptionElement(option) {
         const optionElement = document.createElement('forge-option');
-        assignMatchingProperties(option, optionElement);
+        Object.assign(optionElement, option);
         optionElement.textContent = option.label;
         return optionElement;
     }

package/esm/select/core/base-select-constants.d.ts

@@ -21,6 +21,8 @@ export declare const BASE_SELECT_CONSTANTS: {
         POPUP_CLASSES: string;
         OPTION_LIMIT: string;
         SYNC_POPUP_WIDTH: string;
+        CONSTRAIN_POPUP_WIDTH: string;
+        WRAP_OPTION_TEXT: string;
     };
     events: {
         CHANGE: string;

package/esm/select/core/base-select-constants.js

@@ -10,7 +10,9 @@ const observedAttributes = {
     OBSERVE_SCROLL_THRESHOLD: 'observe-scroll-threshold',
     POPUP_CLASSES: 'popup-classes',
     OPTION_LIMIT: 'option-limit',
-    SYNC_POPUP_WIDTH: 'sync-popup-width'
+    SYNC_POPUP_WIDTH: 'sync-popup-width',
+    CONSTRAIN_POPUP_WIDTH: 'constrain-popup-width',
+    WRAP_OPTION_TEXT: 'wrap-option-text'
 };
 const attributes = Object.assign({}, observedAttributes);
 const events = {

package/esm/select/core/base-select-foundation.d.ts

@@ -16,9 +16,6 @@ export interface IBaseSelectFoundation extends IListDropdownAwareFoundation {
     popupElement: HTMLElement | undefined;
     optionBuilder: SelectOptionBuilder;
     selectedTextBuilder: SelectSelectedTextBuilder;
-    observeScroll: boolean;
-    observeScrollThreshold: number;
-    syncPopupWidth: boolean;
     beforeValueChange: SelectBeforeValueChangeCallback<any>;
     appendOptions(options: ISelectOption[] | ISelectOptionGroup[]): void;
     selectAll(): void;
@@ -116,12 +113,6 @@ export declare abstract class BaseSelectFoundation<T extends IBaseSelectAdapter>
     /** Sets the selected text builder callback that will be executed when getting the selected text to display in the field. */
     get selectedTextBuilder(): SelectSelectedTextBuilder;
     set selectedTextBuilder(fn: SelectSelectedTextBuilder);
-    get observeScroll(): boolean;
-    set observeScroll(value: boolean);
-    get observeScrollThreshold(): number;
-    set observeScrollThreshold(value: number);
-    get syncPopupWidth(): boolean;
-    set syncPopupWidth(value: boolean);
     get optionLimit(): number;
     set optionLimit(value: number);
     get popupClasses(): string | string[];

package/esm/select/core/base-select-foundation.js

@@ -121,6 +121,8 @@ export class BaseSelectFoundation extends ListDropdownAwareFoundation {
             id: this._identifier,
             optionBuilder: this._optionBuilder,
             syncWidth: this._syncPopupWidth,
+            constrainViewportWidth: this._constrainPopupWidth,
+            wrapOptionText: this._wrapOptionText,
             observeScroll: this._observeScroll,
             observeScrollThreshold: this._observeScrollThreshold,
             scrollEndListener: this._dropdownScrollEndListener,
@@ -323,6 +325,7 @@ export class BaseSelectFoundation extends ListDropdownAwareFoundation {
         }
         if (isEscapeKey) {
             evt.preventDefault();
+            evt.stopPropagation();
             if (this._open) {
                 this._closeDropdown();
                 return;
@@ -347,7 +350,7 @@ export class BaseSelectFoundation extends ListDropdownAwareFoundation {
         }
         else if (isArrowUp || isArrowDown) {
             evt.preventDefault();
-            if (this._multiple && !this._open) {
+            if (!this._open) {
                 this._openDropdown();
                 this._adapter.activateFirstOption();
                 return;
@@ -371,13 +374,7 @@ export class BaseSelectFoundation extends ListDropdownAwareFoundation {
             else {
                 optionIndex = this._getNextHighlightableOptionIndex(optionIndex, this._nonDividerOptions);
             }
-            // If the dropdown is open then we just move the active index, otherwise we change the selection (to mimic the native <select>)
-            if (this._open) {
-                this._adapter.highlightActiveOption(optionIndex);
-            }
-            else {
-                this._onSelect(this._nonDividerOptions[optionIndex], optionIndex);
-            }
+            this._adapter.highlightActiveOption(optionIndex);
         }
         else if (isHomeKey) {
             if (this._open) {
@@ -564,24 +561,6 @@ export class BaseSelectFoundation extends ListDropdownAwareFoundation {
     set selectedTextBuilder(fn) {
         this._selectedTextBuilder = fn;
     }
-    get observeScroll() {
-        return this._observeScroll;
-    }
-    set observeScroll(value) {
-        this._observeScroll = value;
-    }
-    get observeScrollThreshold() {
-        return this._observeScrollThreshold;
-    }
-    set observeScrollThreshold(value) {
-        this._observeScrollThreshold = value;
-    }
-    get syncPopupWidth() {
-        return this._syncPopupWidth;
-    }
-    set syncPopupWidth(value) {
-        this._syncPopupWidth = value;
-    }
     get optionLimit() {
         return this._optionLimit;
     }

package/esm/select/core/select-utils.js

@@ -20,7 +20,7 @@ export function isSelectOptionType(options, type) {
     return (isOptionGroups && type === SelectOptionType.Group) || (isOptionTypes && type === SelectOptionType.Option);
 }
 export function isOptionGroupObject(o) {
-    return isDefined(o) && isObject(o) && o.hasOwnProperty('options') && o.hasOwnProperty('text');
+    return isDefined(o) && isObject(o) && o.hasOwnProperty('options');
 }
 export function isOptionObject(o) {
     return isDefined(o) && isObject(o) && o.hasOwnProperty('label') && o.hasOwnProperty('value');

package/esm/select/option-group/option-group.d.ts

@@ -3,8 +3,10 @@
  * Copyright 2023 Tyler Technologies, Inc. 
  * License: Apache-2.0
  */
+import { ListDropdownOptionGroupBuilder } from '../../list-dropdown/list-dropdown-constants';
 import { BaseComponent, IBaseComponent } from '../../core/base/base-component';
-export interface IOptionGroupComponent extends IBaseComponent {
+import { ISelectOption, ISelectOptionGroup } from '../core';
+export interface IOptionGroupComponent extends Required<ISelectOptionGroup>, IBaseComponent {
     label: string;
 }
 declare global {
@@ -25,4 +27,13 @@ export declare class OptionGroupComponent extends BaseComponent implements IOpti
     /** Gets/sets the label of this option group. */
     get label(): string;
     set label(value: string);
+    /** The child options of this group. */
+    options: ISelectOption[];
+    /** The builder function for the group content. */
+    builder: ListDropdownOptionGroupBuilder;
+    /** Gets/sets the optional group value. */
+    value: any;
+    /** The text content for the group. */
+    get text(): string;
+    set text(value: string);
 }

package/esm/select/option-group/option-group.js

@@ -38,6 +38,13 @@ let OptionGroupComponent = class OptionGroupComponent extends BaseComponent {
             this.setAttribute(OPTION_GROUP_CONSTANTS.attributes.LABEL, this._label);
         }
     }
+    /** The text content for the group. */
+    get text() {
+        return this._label;
+    }
+    set text(value) {
+        this.label = value;
+    }
 };
 OptionGroupComponent = __decorate([
     CustomElement({

package/esm/select/select/select.js

@@ -20,8 +20,8 @@ import { ScaffoldComponent } from '../../scaffold';
 import { ToolbarComponent } from '../../toolbar';
 import { IconButtonComponent } from '../../icon-button';
 import { FIELD_CONSTANTS } from '../../field/field-constants';
-const template = '<template><div class=\"forge-select__wrapper\" part=\"root\"><div class=\"forge-select forge-field\" part=\"container\"><div class=\"forge-select__leading-container\" part=\"leading-container\"><slot name=\"leading\"></slot></div><div class=\"forge-field__label-input-container\" part=\"label-input-container\"><div id=\"selected-text\" class=\"forge-select__selected-text\" part=\"text\"></div><label id=\"select-label\" aria-hidden=\"true\" part=\"label\"></label></div><forge-icon class=\"forge-select__dropdown-icon\" name=\"arrow_drop_down\" part=\"icon\"></forge-icon><div class=\"forge-field__addon-end-container\" part=\"addon-end-container\"><slot name=\"addon-end\"></slot></div></div><slot name=\"helper-text\"></slot></div></template>';
-const styles = '.forge-select{-webkit-box-sizing:border-box;box-sizing:border-box;display:-webkit-box;display:flex;-webkit-box-align:center;align-items:center;position:relative;z-index:1;z-index:var(--forge-z-index-surface,1);margin-top:0;margin-top:var(--forge-select-margin-top,0)}.forge-select.forge-field--disabled{background-color:#f5f5f5;background-color:var(--forge-theme-form-field-disabled-on-background,#f5f5f5);cursor:not-allowed}.forge-select:not(.forge-field--dense):not(.forge-field--roomy){height:3rem;height:var(--forge-select-height,3rem)}.forge-select.forge-field--roomy:not(.forge-field--dense){height:3.5rem;height:var(--forge-select-height,3.5rem)}.forge-select.forge-field--dense:not(.forge-field--roomy){height:1.5rem;height:var(--forge-select-height,1.5rem)}.forge-field::before{content:\"\";display:-webkit-box;display:flex;position:absolute;top:0;right:0;left:0;z-index:-1;-webkit-box-sizing:border-box;box-sizing:border-box;width:100%;max-width:100%;height:100%;pointer-events:none;border-style:solid;border-width:1px;-webkit-transition:border-color .2s 0s cubic-bezier(0, 0, .2, 1);transition:border-color .2s 0s cubic-bezier(0, 0, .2, 1);background-color:transparent;background-color:var(--forge-select-theme-background,transparent);text-align:left}.forge-field[dir=rtl]::before,[dir=rtl] .forge-field::before{text-align:right}.forge-field:not(.forge-field--disabled):not(.forge-field--invalid):not(.forge-field--focused)::before{border-color:rgba(0,0,0,.38);border-color:var(--mdc-theme-text-icon-on-background,rgba(0,0,0,.38))}.forge-field:not(.forge-field--disabled):not(.forge-field--invalid):not(.forge-field--focused):hover::before{border-color:rgba(0,0,0,.87);border-color:var(--mdc-theme-text-primary-on-background,rgba(0,0,0,.87))}.forge-field--focused:not(.forge-field--invalid):not(.forge-field--disabled)::before{border-color:#3f51b5;border-color:var(--mdc-theme-primary,#3f51b5)}.forge-field--invalid:not(.forge-field--disabled)::before{border-color:#b00020;border-color:var(--mdc-theme-error,#b00020)}.forge-field--invalid:not(.forge-field--disabled):not(.forge-field--focused):hover::before{border-color:#db8a98;border-color:var(--forge-theme-error-hover,#db8a98)}.forge-field--disabled::before{border-color:rgba(0,0,0,.12);border-color:var(--mdc-theme-text-disabled-on-background,rgba(0,0,0,.12))}.forge-field:not(.forge-field--shape-rounded){border-radius:4px}.forge-field:not(.forge-field--shape-rounded)::before{border-radius:4px}.forge-field--shape-rounded{border-radius:28px}.forge-field--shape-rounded::before{border-radius:28px}.forge-field--disabled::before{background-color:#f5f5f5;background-color:var(--forge-theme-form-field-disabled-on-background,#f5f5f5)}.forge-field--focused::before{border-color:#3f51b5;border-color:var(--mdc-theme-primary,#3f51b5);border-width:2px}.forge-field__label-input-container{position:relative;-webkit-box-flex:1;flex:1 1 0.0001px;height:100%;display:-webkit-box;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;flex-direction:row;-webkit-box-align:center;align-items:center;min-width:0}.forge-field~::slotted([slot=helper-text]){-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:Roboto,sans-serif;font-family:var(--mdc-typography-caption-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));line-height:1.25rem;line-height:var(--mdc-typography-caption-line-height, 1.25rem);font-weight:400;font-weight:var(--mdc-typography-caption-font-weight,400);letter-spacing:.0333333333em;letter-spacing:var(--mdc-typography-caption-letter-spacing, .0333333333em);text-decoration:inherit;-webkit-text-decoration:var(--mdc-typography-caption-text-decoration,inherit);text-decoration:var(--mdc-typography-caption-text-decoration,inherit);text-transform:inherit;text-transform:var(--mdc-typography-caption-text-transform,inherit);display:block;min-height:1.5rem;line-height:normal;padding-top:4px;-webkit-box-sizing:border-box;box-sizing:border-box}.forge-field:not(.forge-field--dense):not(.forge-field--roomy)~::slotted([slot=helper-text]){font-size:.75rem}.forge-field--roomy:not(.forge-field--dense)~::slotted([slot=helper-text]){font-size:.875rem}.forge-field--dense:not(.forge-field--roomy)~::slotted([slot=helper-text]){font-size:.75rem}.forge-field~::slotted([slot=helper-text]){color:rgba(0,0,0,.54);color:var(--mdc-theme-text-secondary-on-background,rgba(0,0,0,.54))}.forge-field--invalid:not(.forge-field--disabled)~::slotted([slot=helper-text]){color:#b00020;color:var(--mdc-theme-error,#b00020)}.forge-field:not(.forge-field--shape-rounded)~::slotted([slot=helper-text]){margin-left:12px}.forge-field--shape-rounded~::slotted([slot=helper-text]){margin-left:32px}.forge-field ::slotted([slot=leading]){display:-webkit-box;display:flex;align-self:center}.forge-field:not(.forge-field--disabled):not(.forge-field--invalid) ::slotted([slot=leading]){color:rgba(0,0,0,.54);color:var(--mdc-theme-text-secondary-on-background,rgba(0,0,0,.54))}.forge-field--invalid:not(.forge-field--disabled) ::slotted([slot=leading]){color:#b00020;color:var(--mdc-theme-error,#b00020)}.forge-field--disabled ::slotted([slot=leading]){color:rgba(0,0,0,.38);color:var(--mdc-theme-text-disabled-on-light,rgba(0,0,0,.38));cursor:not-allowed;pointer-events:none}.forge-field ::slotted([slot=leading]){margin:0 4px}.forge-field ::slotted([slot=leading]:not(forge-icon-button)){padding:6px}.forge-field__addon-end-container{display:none}.forge-field--addon-end .forge-field__addon-end-container{height:100%;width:auto;display:-webkit-box;display:flex;-webkit-box-pack:center;justify-content:center;-webkit-box-align:center;align-items:center;padding:0 4px;border-left-width:1px;border-left-style:solid;-webkit-transition:border-left-color .2s 0s cubic-bezier(0, 0, .2, 1);transition:border-left-color .2s 0s cubic-bezier(0, 0, .2, 1)}.forge-field:not(.forge-field--disabled):not(.forge-field--focused):not(.forge-field--invalid) .forge-field__addon-end-container{border-left-color:rgba(0,0,0,.54);border-left-color:var(--mdc-theme-text-secondary-on-background,rgba(0,0,0,.54))}.forge-field:not(.forge-field--disabled):not(.forge-field--focused):not(.forge-field--invalid) .forge-field__addon-end-container:hover{border-left-color:rgba(0,0,0,.87);border-left-color:var(--mdc-theme-text-primary-on-background,rgba(0,0,0,.87))}.forge-field.forge-field--focused:not(.forge-field--invalid):not(.forge-field--disabled) .forge-field__addon-end-container{border-left-color:#3f51b5;border-left-color:var(--mdc-theme-primary,#3f51b5)}.forge-field.forge-field--invalid:not(.forge-field--disabled) .forge-field__addon-end-container{border-left-color:#b00020;border-left-color:var(--mdc-theme-error,#b00020)}.forge-field.forge-field--invalid:not(.forge-field--focused):not(.forge-field--disabled) .forge-field__addon-end-container:hover{border-left-color:#db8a98;border-left-color:var(--forge-theme-error-hover,#db8a98)}.forge-field.forge-field--disabled .forge-field__addon-end-container{border-left-color:rgba(0,0,0,.12);border-left-color:var(--mdc-theme-text-disabled-on-background,rgba(0,0,0,.12))}.forge-field:not(.forge-field--disabled):not(.forge-field--invalid) ::slotted([slot=addon-end]){color:rgba(0,0,0,.54);color:var(--mdc-theme-text-secondary-on-background,rgba(0,0,0,.54))}.forge-field--invalid:not(.forge-field--disabled) ::slotted([slot=addon-end]){color:#b00020;color:var(--mdc-theme-error,#b00020)}.forge-field--disabled ::slotted([slot=addon-end]){color:rgba(0,0,0,.38);color:var(--mdc-theme-text-disabled-on-light,rgba(0,0,0,.38));cursor:not-allowed;pointer-events:none}.forge-select__leading-container{display:-webkit-box;display:flex;align-self:center}.forge-field label{color:rgba(0,0,0,.65);color:var(--forge-theme-form-field-label-on-background,rgba(0,0,0,.65));pointer-events:none;right:0;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:Roboto,sans-serif;font-family:var(--mdc-typography-subtitle1-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-weight:400;font-weight:var(--mdc-typography-subtitle1-font-weight,400);letter-spacing:.009375em;letter-spacing:var(--mdc-typography-subtitle1-letter-spacing, .009375em);text-decoration:inherit;-webkit-text-decoration:var(--mdc-typography-subtitle1-text-decoration,inherit);text-decoration:var(--mdc-typography-subtitle1-text-decoration,inherit);text-transform:inherit;text-transform:var(--mdc-typography-subtitle1-text-transform,inherit);font-size:var(--mdc-typography-subtitle1-font-size, 1rem);position:absolute;left:0;-webkit-transform-origin:left top;transform-origin:left top;line-height:1.1rem;text-align:left;text-overflow:ellipsis;white-space:nowrap;cursor:text;overflow:hidden;will-change:transform;-webkit-transition:color 150ms cubic-bezier(.4, 0, .2, 1),-webkit-transform 150ms cubic-bezier(.4, 0, .2, 1);transition:color 150ms cubic-bezier(.4, 0, .2, 1),-webkit-transform 150ms cubic-bezier(.4, 0, .2, 1);transition:transform 150ms cubic-bezier(.4, 0, .2, 1),color 150ms cubic-bezier(.4, 0, .2, 1);transition:transform 150ms cubic-bezier(.4, 0, .2, 1),color 150ms cubic-bezier(.4, 0, .2, 1),-webkit-transform 150ms cubic-bezier(.4, 0, .2, 1)}.forge-field label[dir=rtl],[dir=rtl] .forge-field label{right:0;left:auto;-webkit-transform-origin:right top;transform-origin:right top;text-align:right}.forge-field--dense:not(.forge-field--roomy) label{display:none}.forge-field--required label::after{content:none}.forge-field--required label::before{color:#b00020;color:var(--mdc-theme-error,#b00020);content:\"*\";margin-right:4px}.forge-field:not(.forge-field--dense):not(.forge-field--roomy) label{font-size:1rem}.forge-field--roomy:not(.forge-field--dense) label{font-size:1rem}.forge-field--disabled label{color:rgba(0,0,0,.38);color:var(--forge-theme-label-disabled-on-background,rgba(0,0,0,.38))}.forge-field--invalid:not(.forge-field--disabled) label{color:#b00020;color:var(--mdc-theme-error,#b00020)}.forge-field--focused:not(.forge-field--invalid):not(.forge-field--disabled) label{color:#3f51b5;color:var(--mdc-theme-primary,#3f51b5)}.forge-field:not(.forge-field--dense):not(.forge-field--roomy) label{top:1rem}.forge-field--roomy:not(.forge-field--dense) label{top:1.285rem}.forge-field:not(.forge-field--shape-rounded):not(.forge-field--leading) label{left:12px!important}.forge-field--shape-rounded:not(.forge-field--leading) label{left:32px!important}.forge-field:not(.forge-field--trailing):not(.forge-field--addon-end):not(.forge-field--shape-rounded) label{padding-right:12px}.forge-field:not(.forge-field--trailing):not(.forge-field--addon-end).forge-field--shape-rounded label{padding-right:32px}.forge-field label.forge-floating-label--float-above{color:rgba(0,0,0,.65);color:var(--forge-theme-form-field-label-on-background,rgba(0,0,0,.65))}.forge-field--disabled label.forge-floating-label--float-above{color:rgba(0,0,0,.6);color:var(--forge-theme-form-field-text-disabled-on-background,rgba(0,0,0,.6))}.forge-field--invalid:not(.forge-field--disabled) label.forge-floating-label--float-above{color:#b00020;color:var(--mdc-theme-error,#b00020)}.forge-field--focused:not(.forge-field--invalid):not(.forge-field--disabled) label.forge-floating-label--float-above{color:#3f51b5;color:var(--mdc-theme-primary,#3f51b5)}.forge-field:not(.forge-field--dense):not(.forge-field--roomy) label.forge-floating-label--float-above{-webkit-transform:translateY(-.54rem) scale(.8125);transform:translateY(-.54rem) scale(.8125);cursor:auto}.forge-field--roomy:not(.forge-field--dense) label.forge-floating-label--float-above{-webkit-transform:translateY(-.72rem) scale(.8125);transform:translateY(-.72rem) scale(.8125);cursor:auto}.forge-field:not(.forge-field--dense):not(.forge-field--roomy) label.forge-floating-label--float-above.forge-floating-label--float-above-end-keyframe{-webkit-transition:none;transition:none;font-size:.8125rem;-webkit-transform:translateY(-.62rem) scale(1);transform:translateY(-.62rem) scale(1);cursor:auto}.forge-field--roomy:not(.forge-field--dense) label.forge-floating-label--float-above.forge-floating-label--float-above-end-keyframe{-webkit-transition:none;transition:none;font-size:.8125rem;-webkit-transform:translateY(-.8rem) scale(1);transform:translateY(-.8rem) scale(1);cursor:auto}.forge-field:not(.forge-field--dense):not(.forge-field--roomy) label.forge-floating-label--unfloat-above-start-keyframe{-webkit-transition:none;transition:none;font-size:1rem;-webkit-transform:translateY(-.62rem) scale(.8125);transform:translateY(-.62rem) scale(.8125);cursor:auto}.forge-field--roomy:not(.forge-field--dense) label.forge-floating-label--unfloat-above-start-keyframe{-webkit-transition:none;transition:none;font-size:1rem;-webkit-transform:translateY(-.8rem) scale(.8125);transform:translateY(-.8rem) scale(.8125);cursor:auto}.forge-field .forge-select__selected-text{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:Roboto,sans-serif;font-family:var(--mdc-typography-body1-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-weight:400;font-weight:var(--mdc-typography-body1-font-weight,400);letter-spacing:.03125em;letter-spacing:var(--mdc-typography-body1-letter-spacing, .03125em);text-decoration:inherit;-webkit-text-decoration:var(--mdc-typography-body1-text-decoration,inherit);text-decoration:var(--mdc-typography-body1-text-decoration,inherit);text-transform:inherit;text-transform:var(--mdc-typography-body1-text-transform,inherit);color:rgba(0,0,0,.87);color:var(--mdc-theme-text-primary-on-background,rgba(0,0,0,.87));display:block;overflow:hidden;text-overflow:ellipsis;align-self:flex-end;-webkit-box-sizing:border-box;box-sizing:border-box;width:100%;height:100%;white-space:nowrap;-webkit-transition:opacity 150ms 0s cubic-bezier(.4, 0, .2, 1);transition:opacity 150ms 0s cubic-bezier(.4, 0, .2, 1);border:none;background:0 0;cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none;outline:0;line-height:normal;min-width:0;font-size:var(--forge-select-font-size, 1rem);padding:0 12px;padding-right:0}.forge-field:not(.forge-field--disabled) .forge-select__selected-text{color:rgba(0,0,0,.87);color:var(--mdc-theme-text-primary-on-background,rgba(0,0,0,.87))}.forge-field--disabled .forge-select__selected-text{color:rgba(0,0,0,.6);color:var(--forge-theme-form-field-text-disabled-on-background,rgba(0,0,0,.6));cursor:not-allowed}.forge-field:not(.forge-field--dense):not(.forge-field--roomy) .forge-select__selected-text{font-size:1rem;font-size:var(--forge-select-font-size, 1rem)}.forge-field--roomy:not(.forge-field--dense) .forge-select__selected-text{font-size:1rem;font-size:var(--forge-select-font-size, 1rem)}.forge-field--dense:not(.forge-field--roomy) .forge-select__selected-text{font-size:.875rem;font-size:var(--forge-select-font-size, .875rem)}.forge-field .forge-select__selected-text{padding:0 12px}.forge-field--label .forge-select__selected-text{padding-top:24px}.forge-field--roomy.forge-field--label .forge-select__selected-text{padding-top:29px}.forge-field--shape-rounded:not(.forge-field--leading) .forge-select__selected-text{padding-left:32px}.forge-field--leading .forge-select__selected-text{padding-left:0}.forge-field--label .forge-select__selected-text{padding-bottom:3px}.forge-field--roomy.forge-field--label .forge-select__selected-text{padding-bottom:8px}.forge-field:not(.forge-field--label):not(.forge-field--dense):not(.forge-field--roomy) .forge-select__selected-text{line-height:var(--forge-select-height, 3rem)}.forge-field:not(.forge-field--label).forge-field--roomy:not(.forge-field--dense) .forge-select__selected-text{line-height:var(--forge-select-height-roomy, 3.5rem)}.forge-field:not(.forge-field--label).forge-field--dense:not(.forge-field--roomy) .forge-select__selected-text{line-height:var(--forge-select-height-dense, 1.5rem)}.forge-field.forge-field--dense:not(.forge-field--roomy) .forge-select__selected-text{padding:0 8px}.forge-field .forge-select__selected-text:empty::before{content:attr(placeholder);color:rgba(0,0,0,.54);color:var(--mdc-theme-text-secondary-on-background,rgba(0,0,0,.54));font-size:.875rem}.forge-field .forge-select--label .forge-select__selected-text{padding-top:25px}.forge-field .forge-select__dropdown-icon{display:-webkit-box;display:flex;-webkit-box-pack:center;justify-content:center;-webkit-box-align:center;align-items:center;width:24px;height:100%;-webkit-box-flex:0;flex:none;-webkit-transition:-webkit-transform 150ms cubic-bezier(.4, 0, .2, 1);transition:-webkit-transform 150ms cubic-bezier(.4, 0, .2, 1);transition:transform 150ms cubic-bezier(.4, 0, .2, 1);transition:transform 150ms cubic-bezier(.4, 0, .2, 1),-webkit-transform 150ms cubic-bezier(.4, 0, .2, 1);pointer-events:none;margin-right:8px}.forge-select--opened .forge-field .forge-select__dropdown-icon{-webkit-transform:rotate(180deg);transform:rotate(180deg);-webkit-transition:-webkit-transform 150ms cubic-bezier(.4, 0, .2, 1);transition:-webkit-transform 150ms cubic-bezier(.4, 0, .2, 1);transition:transform 150ms cubic-bezier(.4, 0, .2, 1);transition:transform 150ms cubic-bezier(.4, 0, .2, 1),-webkit-transform 150ms cubic-bezier(.4, 0, .2, 1)}.forge-select--opened .forge-field .forge-select__dropdown-icon{-webkit-transform:rotate(180deg);transform:rotate(180deg);-webkit-transition:-webkit-transform 150ms cubic-bezier(.4, 0, .2, 1);transition:-webkit-transform 150ms cubic-bezier(.4, 0, .2, 1);transition:transform 150ms cubic-bezier(.4, 0, .2, 1);transition:transform 150ms cubic-bezier(.4, 0, .2, 1),-webkit-transform 150ms cubic-bezier(.4, 0, .2, 1)}.forge-field:not(.forge-field--disabled):not(.forge-field--invalid) .forge-select__dropdown-icon{color:rgba(0,0,0,.54);color:var(--mdc-theme-text-secondary-on-background,rgba(0,0,0,.54))}.forge-field--invalid:not(.forge-field--disabled) .forge-select__dropdown-icon{color:#b00020;color:var(--mdc-theme-error,#b00020)}.forge-field--disabled .forge-select__dropdown-icon{color:rgba(0,0,0,.38);color:var(--mdc-theme-text-disabled-on-light,rgba(0,0,0,.38));cursor:not-allowed;pointer-events:none}.forge-field.forge-field--dense:not(.forge-field--roomy) .forge-select__dropdown-icon{margin-right:4px}:host{display:block;contain:layout}:host(:focus){outline:0}:host([hidden]){display:none}';
+const template = '<template><div class=\"forge-select__wrapper\" part=\"root\"><div class=\"forge-select forge-field\" part=\"container\"><div class=\"forge-select__leading-container\" part=\"leading-container\"><slot name=\"leading\"></slot></div><div class=\"forge-field__label-input-container\" part=\"label-input-container\"><div id=\"selected-text\" class=\"forge-select__selected-text\" part=\"text\" aria-live=\"assertive\" aria-atomic=\"true\"></div><label id=\"select-label\" aria-hidden=\"true\" part=\"label\"></label></div><forge-icon class=\"forge-select__dropdown-icon\" name=\"arrow_drop_down\" part=\"icon\"></forge-icon><div class=\"forge-field__addon-end-container\" part=\"addon-end-container\"><slot name=\"addon-end\"></slot></div></div><slot name=\"helper-text\"></slot></div></template>';
+const styles = '.forge-select{-webkit-box-sizing:border-box;box-sizing:border-box;display:-webkit-box;display:flex;-webkit-box-align:center;align-items:center;position:relative;z-index:1;z-index:var(--forge-z-index-surface,1);margin-top:0;margin-top:var(--forge-select-margin-top,0)}.forge-select.forge-field--disabled{background-color:#f5f5f5;background-color:var(--forge-theme-form-field-disabled-on-background,#f5f5f5);cursor:not-allowed}.forge-select:not(.forge-field--dense):not(.forge-field--roomy){height:3rem;height:var(--forge-select-height,3rem)}.forge-select.forge-field--roomy:not(.forge-field--dense){height:3.5rem;height:var(--forge-select-height,3.5rem)}.forge-select.forge-field--dense:not(.forge-field--roomy){height:1.5rem;height:var(--forge-select-height,1.5rem)}.forge-field::before{content:\"\";display:-webkit-box;display:flex;position:absolute;top:0;right:0;left:0;z-index:-1;-webkit-box-sizing:border-box;box-sizing:border-box;width:100%;max-width:100%;height:100%;pointer-events:none;border-style:solid;border-style:var(--forge-select-border-style,solid);border-width:1px;-webkit-transition:border-color .2s 0s cubic-bezier(0, 0, .2, 1);transition:border-color .2s 0s cubic-bezier(0, 0, .2, 1);background-color:transparent;background-color:var(--forge-select-theme-background,transparent);text-align:left}.forge-field[dir=rtl]::before,[dir=rtl] .forge-field::before{text-align:right}.forge-field:not(.forge-field--disabled):not(.forge-field--invalid):not(.forge-field--focused)::before{border-color:rgba(0,0,0,.38);border-color:var(--mdc-theme-text-icon-on-background,rgba(0,0,0,.38))}.forge-field:not(.forge-field--disabled):not(.forge-field--invalid):not(.forge-field--focused):hover::before{border-color:rgba(0,0,0,.87);border-color:var(--mdc-theme-text-primary-on-background,rgba(0,0,0,.87))}.forge-field--focused:not(.forge-field--invalid):not(.forge-field--disabled)::before{border-color:#3f51b5;border-color:var(--mdc-theme-primary,#3f51b5)}.forge-field--invalid:not(.forge-field--disabled)::before{border-color:#b00020;border-color:var(--mdc-theme-error,#b00020)}.forge-field--invalid:not(.forge-field--disabled):not(.forge-field--focused):hover::before{border-color:#db8a98;border-color:var(--forge-theme-error-hover,#db8a98)}.forge-field--disabled::before{border-color:rgba(0,0,0,.12);border-color:var(--mdc-theme-text-disabled-on-background,rgba(0,0,0,.12))}.forge-field:not(.forge-field--shape-rounded){border-radius:4px}.forge-field:not(.forge-field--shape-rounded)::before{border-radius:4px}.forge-field--shape-rounded{border-radius:28px}.forge-field--shape-rounded::before{border-radius:28px}.forge-field--disabled::before{background-color:#f5f5f5;background-color:var(--forge-theme-form-field-disabled-on-background,#f5f5f5)}.forge-field--focused::before{border-color:#3f51b5;border-color:var(--mdc-theme-primary,#3f51b5);border-width:2px}.forge-field__label-input-container{position:relative;-webkit-box-flex:1;flex:1 1 0.0001px;height:100%;display:-webkit-box;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;flex-direction:row;-webkit-box-align:center;align-items:center;min-width:0}.forge-field~::slotted([slot=helper-text]){-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:Roboto,sans-serif;font-family:var(--mdc-typography-caption-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));line-height:1.25rem;line-height:var(--mdc-typography-caption-line-height, 1.25rem);font-weight:400;font-weight:var(--mdc-typography-caption-font-weight,400);letter-spacing:.0333333333em;letter-spacing:var(--mdc-typography-caption-letter-spacing, .0333333333em);text-decoration:inherit;-webkit-text-decoration:var(--mdc-typography-caption-text-decoration,inherit);text-decoration:var(--mdc-typography-caption-text-decoration,inherit);text-transform:inherit;text-transform:var(--mdc-typography-caption-text-transform,inherit);display:block;min-height:1.5rem;line-height:normal;padding-top:4px;-webkit-box-sizing:border-box;box-sizing:border-box}.forge-field:not(.forge-field--dense):not(.forge-field--roomy)~::slotted([slot=helper-text]){font-size:.75rem}.forge-field--roomy:not(.forge-field--dense)~::slotted([slot=helper-text]){font-size:.875rem}.forge-field--dense:not(.forge-field--roomy)~::slotted([slot=helper-text]){font-size:.75rem}.forge-field~::slotted([slot=helper-text]){color:rgba(0,0,0,.54);color:var(--mdc-theme-text-secondary-on-background,rgba(0,0,0,.54))}.forge-field--invalid:not(.forge-field--disabled)~::slotted([slot=helper-text]){color:#b00020;color:var(--mdc-theme-error,#b00020)}.forge-field:not(.forge-field--shape-rounded)~::slotted([slot=helper-text]){margin-left:12px}.forge-field--shape-rounded~::slotted([slot=helper-text]){margin-left:32px}.forge-field ::slotted([slot=leading]){display:-webkit-box;display:flex;align-self:center}.forge-field:not(.forge-field--disabled):not(.forge-field--invalid) ::slotted([slot=leading]){color:rgba(0,0,0,.54);color:var(--mdc-theme-text-secondary-on-background,rgba(0,0,0,.54))}.forge-field--invalid:not(.forge-field--disabled) ::slotted([slot=leading]){color:#b00020;color:var(--mdc-theme-error,#b00020)}.forge-field--disabled ::slotted([slot=leading]){color:rgba(0,0,0,.38);color:var(--mdc-theme-text-disabled-on-light,rgba(0,0,0,.38));cursor:not-allowed;pointer-events:none}.forge-field ::slotted([slot=leading]){margin:0 4px}.forge-field ::slotted([slot=leading]:not(forge-icon-button)){padding:6px}.forge-field__addon-end-container{display:none}.forge-field--addon-end .forge-field__addon-end-container{height:100%;width:auto;display:-webkit-box;display:flex;-webkit-box-pack:center;justify-content:center;-webkit-box-align:center;align-items:center;padding:0 4px;border-left-width:1px;border-left-style:solid;-webkit-transition:border-left-color .2s 0s cubic-bezier(0, 0, .2, 1);transition:border-left-color .2s 0s cubic-bezier(0, 0, .2, 1)}.forge-field:not(.forge-field--disabled):not(.forge-field--focused):not(.forge-field--invalid) .forge-field__addon-end-container{border-left-color:rgba(0,0,0,.54);border-left-color:var(--mdc-theme-text-secondary-on-background,rgba(0,0,0,.54))}.forge-field:not(.forge-field--disabled):not(.forge-field--focused):not(.forge-field--invalid) .forge-field__addon-end-container:hover{border-left-color:rgba(0,0,0,.87);border-left-color:var(--mdc-theme-text-primary-on-background,rgba(0,0,0,.87))}.forge-field.forge-field--focused:not(.forge-field--invalid):not(.forge-field--disabled) .forge-field__addon-end-container{border-left-color:#3f51b5;border-left-color:var(--mdc-theme-primary,#3f51b5)}.forge-field.forge-field--invalid:not(.forge-field--disabled) .forge-field__addon-end-container{border-left-color:#b00020;border-left-color:var(--mdc-theme-error,#b00020)}.forge-field.forge-field--invalid:not(.forge-field--focused):not(.forge-field--disabled) .forge-field__addon-end-container:hover{border-left-color:#db8a98;border-left-color:var(--forge-theme-error-hover,#db8a98)}.forge-field.forge-field--disabled .forge-field__addon-end-container{border-left-color:rgba(0,0,0,.12);border-left-color:var(--mdc-theme-text-disabled-on-background,rgba(0,0,0,.12))}.forge-field:not(.forge-field--disabled):not(.forge-field--invalid) ::slotted([slot=addon-end]){color:rgba(0,0,0,.54);color:var(--mdc-theme-text-secondary-on-background,rgba(0,0,0,.54))}.forge-field--invalid:not(.forge-field--disabled) ::slotted([slot=addon-end]){color:#b00020;color:var(--mdc-theme-error,#b00020)}.forge-field--disabled ::slotted([slot=addon-end]){color:rgba(0,0,0,.38);color:var(--mdc-theme-text-disabled-on-light,rgba(0,0,0,.38));cursor:not-allowed;pointer-events:none}.forge-select__leading-container{display:-webkit-box;display:flex;align-self:center}.forge-field label{color:rgba(0,0,0,.65);color:var(--forge-theme-form-field-label-on-background,rgba(0,0,0,.65));pointer-events:none;right:0;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:Roboto,sans-serif;font-family:var(--mdc-typography-subtitle1-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-weight:400;font-weight:var(--mdc-typography-subtitle1-font-weight,400);letter-spacing:.009375em;letter-spacing:var(--mdc-typography-subtitle1-letter-spacing, .009375em);text-decoration:inherit;-webkit-text-decoration:var(--mdc-typography-subtitle1-text-decoration,inherit);text-decoration:var(--mdc-typography-subtitle1-text-decoration,inherit);text-transform:inherit;text-transform:var(--mdc-typography-subtitle1-text-transform,inherit);font-size:var(--mdc-typography-subtitle1-font-size, 1rem);position:absolute;left:0;-webkit-transform-origin:left top;transform-origin:left top;line-height:1.1rem;text-align:left;text-overflow:ellipsis;white-space:nowrap;cursor:text;overflow:hidden;will-change:transform;-webkit-transition:color 150ms cubic-bezier(.4, 0, .2, 1),-webkit-transform 150ms cubic-bezier(.4, 0, .2, 1);transition:color 150ms cubic-bezier(.4, 0, .2, 1),-webkit-transform 150ms cubic-bezier(.4, 0, .2, 1);transition:transform 150ms cubic-bezier(.4, 0, .2, 1),color 150ms cubic-bezier(.4, 0, .2, 1);transition:transform 150ms cubic-bezier(.4, 0, .2, 1),color 150ms cubic-bezier(.4, 0, .2, 1),-webkit-transform 150ms cubic-bezier(.4, 0, .2, 1)}.forge-field label[dir=rtl],[dir=rtl] .forge-field label{right:0;left:auto;-webkit-transform-origin:right top;transform-origin:right top;text-align:right}.forge-field--dense:not(.forge-field--roomy) label{display:none}.forge-field--required label::after{content:none}.forge-field--required label::before{color:#b00020;color:var(--mdc-theme-error,#b00020);content:\"*\";margin-right:4px}.forge-field:not(.forge-field--dense):not(.forge-field--roomy) label{font-size:1rem}.forge-field--roomy:not(.forge-field--dense) label{font-size:1rem}.forge-field--disabled label{color:rgba(0,0,0,.38);color:var(--forge-theme-label-disabled-on-background,rgba(0,0,0,.38))}.forge-field--invalid:not(.forge-field--disabled) label{color:#b00020;color:var(--mdc-theme-error,#b00020)}.forge-field--focused:not(.forge-field--invalid):not(.forge-field--disabled) label{color:#3f51b5;color:var(--mdc-theme-primary,#3f51b5)}.forge-field:not(.forge-field--dense):not(.forge-field--roomy) label{top:1rem}.forge-field--roomy:not(.forge-field--dense) label{top:1.285rem}.forge-field:not(.forge-field--shape-rounded):not(.forge-field--leading) label{left:12px!important}.forge-field--shape-rounded:not(.forge-field--leading) label{left:32px!important}.forge-field:not(.forge-field--trailing):not(.forge-field--addon-end):not(.forge-field--shape-rounded) label{padding-right:12px}.forge-field:not(.forge-field--trailing):not(.forge-field--addon-end).forge-field--shape-rounded label{padding-right:32px}.forge-field label.forge-floating-label--float-above{color:rgba(0,0,0,.65);color:var(--forge-theme-form-field-label-on-background,rgba(0,0,0,.65))}.forge-field--disabled label.forge-floating-label--float-above{color:rgba(0,0,0,.6);color:var(--forge-theme-form-field-text-disabled-on-background,rgba(0,0,0,.6))}.forge-field--invalid:not(.forge-field--disabled) label.forge-floating-label--float-above{color:#b00020;color:var(--mdc-theme-error,#b00020)}.forge-field--focused:not(.forge-field--invalid):not(.forge-field--disabled) label.forge-floating-label--float-above{color:#3f51b5;color:var(--mdc-theme-primary,#3f51b5)}.forge-field:not(.forge-field--dense):not(.forge-field--roomy) label.forge-floating-label--float-above{-webkit-transform:translateY(-.54rem) scale(.8125);transform:translateY(-.54rem) scale(.8125);cursor:auto}.forge-field--roomy:not(.forge-field--dense) label.forge-floating-label--float-above{-webkit-transform:translateY(-.72rem) scale(.8125);transform:translateY(-.72rem) scale(.8125);cursor:auto}.forge-field:not(.forge-field--dense):not(.forge-field--roomy) label.forge-floating-label--float-above.forge-floating-label--float-above-end-keyframe{-webkit-transition:none;transition:none;font-size:.8125rem;-webkit-transform:translateY(-.62rem) scale(1);transform:translateY(-.62rem) scale(1);cursor:auto}.forge-field--roomy:not(.forge-field--dense) label.forge-floating-label--float-above.forge-floating-label--float-above-end-keyframe{-webkit-transition:none;transition:none;font-size:.8125rem;-webkit-transform:translateY(-.8rem) scale(1);transform:translateY(-.8rem) scale(1);cursor:auto}.forge-field:not(.forge-field--dense):not(.forge-field--roomy) label.forge-floating-label--unfloat-above-start-keyframe{-webkit-transition:none;transition:none;font-size:1rem;-webkit-transform:translateY(-.62rem) scale(.8125);transform:translateY(-.62rem) scale(.8125);cursor:auto}.forge-field--roomy:not(.forge-field--dense) label.forge-floating-label--unfloat-above-start-keyframe{-webkit-transition:none;transition:none;font-size:1rem;-webkit-transform:translateY(-.8rem) scale(.8125);transform:translateY(-.8rem) scale(.8125);cursor:auto}.forge-field .forge-select__selected-text{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:Roboto,sans-serif;font-family:var(--mdc-typography-body1-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-weight:400;font-weight:var(--mdc-typography-body1-font-weight,400);letter-spacing:.03125em;letter-spacing:var(--mdc-typography-body1-letter-spacing, .03125em);text-decoration:inherit;-webkit-text-decoration:var(--mdc-typography-body1-text-decoration,inherit);text-decoration:var(--mdc-typography-body1-text-decoration,inherit);text-transform:inherit;text-transform:var(--mdc-typography-body1-text-transform,inherit);color:rgba(0,0,0,.87);color:var(--mdc-theme-text-primary-on-background,rgba(0,0,0,.87));display:block;overflow:hidden;text-overflow:ellipsis;align-self:flex-end;-webkit-box-sizing:border-box;box-sizing:border-box;width:100%;height:100%;white-space:nowrap;-webkit-transition:opacity 150ms 0s cubic-bezier(.4, 0, .2, 1);transition:opacity 150ms 0s cubic-bezier(.4, 0, .2, 1);border:none;background:0 0;cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none;outline:0;line-height:normal;min-width:0;font-size:var(--forge-select-font-size, 1rem);padding:0 12px;padding-right:0}.forge-field:not(.forge-field--disabled) .forge-select__selected-text{color:rgba(0,0,0,.87);color:var(--mdc-theme-text-primary-on-background,rgba(0,0,0,.87))}.forge-field--disabled .forge-select__selected-text{color:rgba(0,0,0,.6);color:var(--forge-theme-form-field-text-disabled-on-background,rgba(0,0,0,.6));cursor:not-allowed}.forge-field:not(.forge-field--dense):not(.forge-field--roomy) .forge-select__selected-text{font-size:1rem;font-size:var(--forge-select-font-size, 1rem)}.forge-field--roomy:not(.forge-field--dense) .forge-select__selected-text{font-size:1rem;font-size:var(--forge-select-font-size, 1rem)}.forge-field--dense:not(.forge-field--roomy) .forge-select__selected-text{font-size:.875rem;font-size:var(--forge-select-font-size, .875rem)}.forge-field .forge-select__selected-text{padding:0 12px}.forge-field--label .forge-select__selected-text{padding-top:24px}.forge-field--roomy.forge-field--label .forge-select__selected-text{padding-top:29px}.forge-field--shape-rounded:not(.forge-field--leading) .forge-select__selected-text{padding-left:32px}.forge-field--leading .forge-select__selected-text{padding-left:0}.forge-field--label .forge-select__selected-text{padding-bottom:3px}.forge-field--roomy.forge-field--label .forge-select__selected-text{padding-bottom:8px}.forge-field:not(.forge-field--label):not(.forge-field--dense):not(.forge-field--roomy) .forge-select__selected-text{line-height:var(--forge-select-height, 3rem)}.forge-field:not(.forge-field--label).forge-field--roomy:not(.forge-field--dense) .forge-select__selected-text{line-height:var(--forge-select-height-roomy, 3.5rem)}.forge-field:not(.forge-field--label).forge-field--dense:not(.forge-field--roomy) .forge-select__selected-text{line-height:var(--forge-select-height-dense, 1.5rem)}.forge-field.forge-field--dense:not(.forge-field--roomy) .forge-select__selected-text{padding:0 8px}.forge-field .forge-select__selected-text:empty::before{content:attr(placeholder);color:rgba(0,0,0,.54);color:var(--mdc-theme-text-secondary-on-background,rgba(0,0,0,.54));font-size:.875rem}.forge-field .forge-select--label .forge-select__selected-text{padding-top:25px}.forge-field .forge-select__dropdown-icon{display:-webkit-box;display:flex;-webkit-box-pack:center;justify-content:center;-webkit-box-align:center;align-items:center;width:24px;height:100%;-webkit-box-flex:0;flex:none;-webkit-transition:-webkit-transform 150ms cubic-bezier(.4, 0, .2, 1);transition:-webkit-transform 150ms cubic-bezier(.4, 0, .2, 1);transition:transform 150ms cubic-bezier(.4, 0, .2, 1);transition:transform 150ms cubic-bezier(.4, 0, .2, 1),-webkit-transform 150ms cubic-bezier(.4, 0, .2, 1);pointer-events:none;margin-right:8px}.forge-select--opened .forge-field .forge-select__dropdown-icon{-webkit-transform:rotate(180deg);transform:rotate(180deg);-webkit-transition:-webkit-transform 150ms cubic-bezier(.4, 0, .2, 1);transition:-webkit-transform 150ms cubic-bezier(.4, 0, .2, 1);transition:transform 150ms cubic-bezier(.4, 0, .2, 1);transition:transform 150ms cubic-bezier(.4, 0, .2, 1),-webkit-transform 150ms cubic-bezier(.4, 0, .2, 1)}.forge-select--opened .forge-field .forge-select__dropdown-icon{-webkit-transform:rotate(180deg);transform:rotate(180deg);-webkit-transition:-webkit-transform 150ms cubic-bezier(.4, 0, .2, 1);transition:-webkit-transform 150ms cubic-bezier(.4, 0, .2, 1);transition:transform 150ms cubic-bezier(.4, 0, .2, 1);transition:transform 150ms cubic-bezier(.4, 0, .2, 1),-webkit-transform 150ms cubic-bezier(.4, 0, .2, 1)}.forge-field:not(.forge-field--disabled):not(.forge-field--invalid) .forge-select__dropdown-icon{color:rgba(0,0,0,.54);color:var(--mdc-theme-text-secondary-on-background,rgba(0,0,0,.54))}.forge-field--invalid:not(.forge-field--disabled) .forge-select__dropdown-icon{color:#b00020;color:var(--mdc-theme-error,#b00020)}.forge-field--disabled .forge-select__dropdown-icon{color:rgba(0,0,0,.38);color:var(--mdc-theme-text-disabled-on-light,rgba(0,0,0,.38));cursor:not-allowed;pointer-events:none}.forge-field.forge-field--dense:not(.forge-field--roomy) .forge-select__dropdown-icon{margin-right:4px}:host{display:block;contain:layout}:host(:focus){outline:0}:host([hidden]){display:none}';
 /**
  * The custom element class behind the `<forge-select>` component.
  *
@@ -44,7 +44,9 @@ let SelectComponent = class SelectComponent extends BaseSelectComponent {
             SELECT_CONSTANTS.attributes.OBSERVE_SCROLL_THRESHOLD,
             BASE_SELECT_CONSTANTS.attributes.POPUP_CLASSES,
             BASE_SELECT_CONSTANTS.attributes.OPTION_LIMIT,
-            BASE_SELECT_CONSTANTS.attributes.SYNC_POPUP_WIDTH
+            BASE_SELECT_CONSTANTS.attributes.SYNC_POPUP_WIDTH,
+            BASE_SELECT_CONSTANTS.attributes.CONSTRAIN_POPUP_WIDTH,
+            BASE_SELECT_CONSTANTS.attributes.WRAP_OPTION_TEXT
         ];
     }
     constructor() {

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

@@ -14,7 +14,7 @@ import { SplitViewPanelAdapter } from './split-view-panel-adapter';
 import { IconComponent, IconRegistry } from '../../icon';
 import { RippleComponent } from '../../ripple';
 const template = '<template><div class=\"forge-split-view-panel\" id=\"root\" part=\"root\"><div class=\"forge-split-view-panel__handle\" id=\"handle\" part=\"handle\" role=\"separator\" aria-controls=\"content\" aria-grabbed=\"false\" tabindex=\"0\"><forge-icon class=\"forge-split-view-panel__icon\" id=\"icon\" part=\"icon\"></forge-icon><forge-ripple id=\"ripple\" part=\"ripple\"></forge-ripple></div><div class=\"forge-split-view-panel__content\" id=\"content\" part=\"content\" role=\"group\"><slot></slot></div></div></template>';
-const styles = '@-webkit-keyframes mdc-ripple-fg-radius-in{from{-webkit-animation-timing-function:cubic-bezier(0.4,0,0.2,1);animation-timing-function:cubic-bezier(0.4,0,0.2,1);-webkit-transform:translate(var(--mdc-ripple-fg-translate-start,0)) scale(1);transform:translate(var(--mdc-ripple-fg-translate-start,0)) scale(1)}to{-webkit-transform:translate(var(--mdc-ripple-fg-translate-end,0)) scale(var(--mdc-ripple-fg-scale,1));transform:translate(var(--mdc-ripple-fg-translate-end,0)) scale(var(--mdc-ripple-fg-scale,1))}}@keyframes mdc-ripple-fg-radius-in{from{-webkit-animation-timing-function:cubic-bezier(0.4,0,0.2,1);animation-timing-function:cubic-bezier(0.4,0,0.2,1);-webkit-transform:translate(var(--mdc-ripple-fg-translate-start,0)) scale(1);transform:translate(var(--mdc-ripple-fg-translate-start,0)) scale(1)}to{-webkit-transform:translate(var(--mdc-ripple-fg-translate-end,0)) scale(var(--mdc-ripple-fg-scale,1));transform:translate(var(--mdc-ripple-fg-translate-end,0)) scale(var(--mdc-ripple-fg-scale,1))}}@-webkit-keyframes mdc-ripple-fg-opacity-in{from{-webkit-animation-timing-function:linear;animation-timing-function:linear;opacity:0}to{opacity:var(--mdc-ripple-fg-opacity, 0)}}@keyframes mdc-ripple-fg-opacity-in{from{-webkit-animation-timing-function:linear;animation-timing-function:linear;opacity:0}to{opacity:var(--mdc-ripple-fg-opacity, 0)}}@-webkit-keyframes mdc-ripple-fg-opacity-out{from{-webkit-animation-timing-function:linear;animation-timing-function:linear;opacity:var(--mdc-ripple-fg-opacity, 0)}to{opacity:0}}@keyframes mdc-ripple-fg-opacity-out{from{-webkit-animation-timing-function:linear;animation-timing-function:linear;opacity:var(--mdc-ripple-fg-opacity, 0)}to{opacity:0}}.mdc-ripple-surface{--mdc-ripple-fg-size:0;--mdc-ripple-left:0;--mdc-ripple-top:0;--mdc-ripple-fg-scale:1;--mdc-ripple-fg-translate-end:0;--mdc-ripple-fg-translate-start:0;-webkit-tap-highlight-color:transparent;will-change:transform,opacity;position:relative;outline:0;overflow:hidden}.mdc-ripple-surface::after,.mdc-ripple-surface::before{position:absolute;border-radius:50%;opacity:0;pointer-events:none;content:\"\"}.mdc-ripple-surface::before{-webkit-transition:opacity 15ms linear,background-color 15ms linear;transition:opacity 15ms linear,background-color 15ms linear;z-index:1;z-index:var(--mdc-ripple-z-index,1)}.mdc-ripple-surface::after{z-index:0;z-index:var(--mdc-ripple-z-index,0)}.mdc-ripple-surface.mdc-ripple-upgraded::before{-webkit-transform:scale(var(--mdc-ripple-fg-scale,1));transform:scale(var(--mdc-ripple-fg-scale,1))}.mdc-ripple-surface.mdc-ripple-upgraded::after{top:0;left:0;-webkit-transform:scale(0);transform:scale(0);-webkit-transform-origin:center center;transform-origin:center center}.mdc-ripple-surface.mdc-ripple-upgraded--unbounded::after{top:var(--mdc-ripple-top,0);left:var(--mdc-ripple-left,0)}.mdc-ripple-surface.mdc-ripple-upgraded--foreground-activation::after{-webkit-animation:mdc-ripple-fg-radius-in 225ms forwards,mdc-ripple-fg-opacity-in 75ms forwards;animation:mdc-ripple-fg-radius-in 225ms forwards,mdc-ripple-fg-opacity-in 75ms forwards}.mdc-ripple-surface.mdc-ripple-upgraded--foreground-deactivation::after{-webkit-animation:mdc-ripple-fg-opacity-out 150ms;animation:mdc-ripple-fg-opacity-out 150ms;-webkit-transform:translate(var(--mdc-ripple-fg-translate-end,0)) scale(var(--mdc-ripple-fg-scale,1));transform:translate(var(--mdc-ripple-fg-translate-end,0)) scale(var(--mdc-ripple-fg-scale,1))}.mdc-ripple-surface::after,.mdc-ripple-surface::before{top:calc(50% - 100%);left:calc(50% - 100%);width:200%;height:200%}.mdc-ripple-surface.mdc-ripple-upgraded::after{width:var(--mdc-ripple-fg-size,100%);height:var(--mdc-ripple-fg-size,100%)}.mdc-ripple-surface[data-mdc-ripple-is-unbounded],.mdc-ripple-upgraded--unbounded{overflow:visible}.mdc-ripple-surface[data-mdc-ripple-is-unbounded]::after,.mdc-ripple-surface[data-mdc-ripple-is-unbounded]::before,.mdc-ripple-upgraded--unbounded::after,.mdc-ripple-upgraded--unbounded::before{top:calc(50% - 50%);left:calc(50% - 50%);width:100%;height:100%}.mdc-ripple-surface[data-mdc-ripple-is-unbounded].mdc-ripple-upgraded::after,.mdc-ripple-surface[data-mdc-ripple-is-unbounded].mdc-ripple-upgraded::before,.mdc-ripple-upgraded--unbounded.mdc-ripple-upgraded::after,.mdc-ripple-upgraded--unbounded.mdc-ripple-upgraded::before{top:var(--mdc-ripple-top,calc(50% - 50%));left:var(--mdc-ripple-left,calc(50% - 50%));width:var(--mdc-ripple-fg-size,100%);height:var(--mdc-ripple-fg-size,100%)}.mdc-ripple-surface[data-mdc-ripple-is-unbounded].mdc-ripple-upgraded::after,.mdc-ripple-upgraded--unbounded.mdc-ripple-upgraded::after{width:var(--mdc-ripple-fg-size,100%);height:var(--mdc-ripple-fg-size,100%)}.mdc-ripple-surface::after,.mdc-ripple-surface::before{background-color:#000;background-color:var(--mdc-ripple-color,#000)}.mdc-ripple-surface.mdc-ripple-surface--hover::before,.mdc-ripple-surface:hover::before{opacity:.04;opacity:var(--mdc-ripple-hover-opacity, .04)}.mdc-ripple-surface.mdc-ripple-upgraded--background-focused::before,.mdc-ripple-surface:not(.mdc-ripple-upgraded):focus::before{-webkit-transition-duration:75ms;transition-duration:75ms;opacity:.12;opacity:var(--mdc-ripple-focus-opacity, .12)}.mdc-ripple-surface:not(.mdc-ripple-upgraded)::after{-webkit-transition:opacity 150ms linear;transition:opacity 150ms linear}.mdc-ripple-surface:not(.mdc-ripple-upgraded):active::after{-webkit-transition-duration:75ms;transition-duration:75ms;opacity:.12;opacity:var(--mdc-ripple-press-opacity, .12)}.mdc-ripple-surface.mdc-ripple-upgraded{--mdc-ripple-fg-opacity:var(--mdc-ripple-press-opacity, 0.12)}.mdc-ripple-surface::after,.mdc-ripple-surface::before{--mdc-ripple-color:var(--mdc-theme-on-surface)}.forge-split-view-panel{display:-webkit-box;display:flex;width:100%;height:100%;overflow:hidden;contain:paint size}.forge-split-view-panel__handle{color:rgba(0,0,0,.54);color:var(--mdc-theme-text-secondary-on-light,rgba(0,0,0,.54));background-color:#e0e0e0;background-color:var(--forge-theme-border-color,#e0e0e0);display:-webkit-box;display:flex;flex-shrink:0;-webkit-box-pack:center;justify-content:center;-webkit-box-align:center;align-items:center;outline:0}.forge-split-view-panel__content{-webkit-box-flex:1;flex:1;overflow:hidden}.forge-split-view-panel--closed{display:none}.forge-split-view-panel--disabled #handle{pointer-events:none}.forge-split-view-panel--disabled .forge-split-view-panel__icon{display:none}.forge-split-view-panel[orientation=horizontal]{min-width:8px;min-width:var(--forge-split-view-handle-width,8px);width:calc(var(--forge-split-view-panel-size,unset) + var(--forge-split-view-handle-width,8px));-webkit-box-orient:horizontal;-webkit-box-direction:normal;flex-direction:row}.forge-split-view-panel[orientation=horizontal] .forge-split-view-panel__handle{width:8px;width:var(--forge-split-view-handle-width,8px);cursor:var(--forge-split-view-panel-cursor)}.forge-split-view-panel[orientation=horizontal].forge-split-view-panel--closing[resizable=end]{position:absolute;top:0;left:0;-webkit-animation-name:u5woxsl;animation-name:u5woxsl;-webkit-animation-duration:.3s;animation-duration:.3s;-webkit-animation-timing-function:cubic-bezier(0.4,0,0.2,1);animation-timing-function:cubic-bezier(0.4,0,0.2,1)}@-webkit-keyframes u5woxsl{from{-webkit-transform:none;transform:none}to{-webkit-transform:translateX(-100%);transform:translateX(-100%)}}@keyframes u5woxsl{from{-webkit-transform:none;transform:none}to{-webkit-transform:translateX(-100%);transform:translateX(-100%)}}.forge-split-view-panel[orientation=horizontal].forge-split-view-panel--closing[resizable=start]{position:absolute;top:0;right:0;-webkit-animation-name:u5woxtb;animation-name:u5woxtb;-webkit-animation-duration:.3s;animation-duration:.3s;-webkit-animation-timing-function:cubic-bezier(0.4,0,0.2,1);animation-timing-function:cubic-bezier(0.4,0,0.2,1)}@-webkit-keyframes u5woxtb{from{-webkit-transform:none;transform:none}to{-webkit-transform:translateX(100%);transform:translateX(100%)}}@keyframes u5woxtb{from{-webkit-transform:none;transform:none}to{-webkit-transform:translateX(100%);transform:translateX(100%)}}.forge-split-view-panel[orientation=horizontal].forge-split-view-panel--opening[resizable=end]{position:absolute;top:0;left:0;-webkit-animation-name:u5woxtj;animation-name:u5woxtj;-webkit-animation-duration:.3s;animation-duration:.3s;-webkit-animation-timing-function:cubic-bezier(0.4,0,0.2,1);animation-timing-function:cubic-bezier(0.4,0,0.2,1);animation-direction:reverse}@-webkit-keyframes u5woxtj{from{-webkit-transform:none;transform:none}to{-webkit-transform:translateX(-100%);transform:translateX(-100%)}}@keyframes u5woxtj{from{-webkit-transform:none;transform:none}to{-webkit-transform:translateX(-100%);transform:translateX(-100%)}}.forge-split-view-panel[orientation=horizontal].forge-split-view-panel--opening[resizable=start]{position:absolute;top:0;right:0;-webkit-animation-name:u5woxua;animation-name:u5woxua;-webkit-animation-duration:.3s;animation-duration:.3s;-webkit-animation-timing-function:cubic-bezier(0.4,0,0.2,1);animation-timing-function:cubic-bezier(0.4,0,0.2,1);animation-direction:reverse}@-webkit-keyframes u5woxua{from{-webkit-transform:none;transform:none}to{-webkit-transform:translateX(100%);transform:translateX(100%)}}@keyframes u5woxua{from{-webkit-transform:none;transform:none}to{-webkit-transform:translateX(100%);transform:translateX(100%)}}.forge-split-view-panel[orientation=vertical]{min-height:8px;min-height:var(--forge-split-view-handle-width,8px);height:calc(var(--forge-split-view-panel-size,unset) + var(--forge-split-view-handle-width,8px));-webkit-box-orient:vertical;-webkit-box-direction:normal;flex-direction:column}.forge-split-view-panel[orientation=vertical] .forge-split-view-panel__handle{height:8px;height:var(--forge-split-view-handle-width,8px);cursor:var(--forge-split-view-panel-cursor)}.forge-split-view-panel[orientation=vertical].forge-split-view-panel--closing[resizable=end]{position:absolute;top:0;left:0;-webkit-animation-name:u5woxuf;animation-name:u5woxuf;-webkit-animation-duration:.3s;animation-duration:.3s;-webkit-animation-timing-function:cubic-bezier(0.4,0,0.2,1);animation-timing-function:cubic-bezier(0.4,0,0.2,1)}@-webkit-keyframes u5woxuf{from{-webkit-transform:none;transform:none}to{-webkit-transform:translateY(-100%);transform:translateY(-100%)}}@keyframes u5woxuf{from{-webkit-transform:none;transform:none}to{-webkit-transform:translateY(-100%);transform:translateY(-100%)}}.forge-split-view-panel[orientation=vertical].forge-split-view-panel--closing[resizable=start]{position:absolute;bottom:0;left:0;-webkit-animation-name:u5woxur;animation-name:u5woxur;-webkit-animation-duration:.3s;animation-duration:.3s;-webkit-animation-timing-function:cubic-bezier(0.4,0,0.2,1);animation-timing-function:cubic-bezier(0.4,0,0.2,1)}@-webkit-keyframes u5woxur{from{-webkit-transform:none;transform:none}to{-webkit-transform:translateY(100%);transform:translateY(100%)}}@keyframes u5woxur{from{-webkit-transform:none;transform:none}to{-webkit-transform:translateY(100%);transform:translateY(100%)}}.forge-split-view-panel[orientation=vertical].forge-split-view-panel--opening[resizable=end]{position:absolute;top:0;left:0;-webkit-animation-name:u5woxvb;animation-name:u5woxvb;-webkit-animation-duration:.3s;animation-duration:.3s;-webkit-animation-timing-function:cubic-bezier(0.4,0,0.2,1);animation-timing-function:cubic-bezier(0.4,0,0.2,1);animation-direction:reverse}@-webkit-keyframes u5woxvb{from{-webkit-transform:none;transform:none}to{-webkit-transform:translateY(-100%);transform:translateY(-100%)}}@keyframes u5woxvb{from{-webkit-transform:none;transform:none}to{-webkit-transform:translateY(-100%);transform:translateY(-100%)}}.forge-split-view-panel[orientation=vertical].forge-split-view-panel--opening[resizable=start]{position:absolute;bottom:0;left:0;-webkit-animation-name:u5woxw3;animation-name:u5woxw3;-webkit-animation-duration:.3s;animation-duration:.3s;-webkit-animation-timing-function:cubic-bezier(0.4,0,0.2,1);animation-timing-function:cubic-bezier(0.4,0,0.2,1);animation-direction:reverse}@-webkit-keyframes u5woxw3{from{-webkit-transform:none;transform:none}to{-webkit-transform:translateY(100%);transform:translateY(100%)}}@keyframes u5woxw3{from{-webkit-transform:none;transform:none}to{-webkit-transform:translateY(100%);transform:translateY(100%)}}:host{z-index:var(--forge-split-view-animating-layer)!important;display:block;position:relative;height:100%;width:100%;-webkit-box-flex:0;flex:0}:host([hidden]){display:none}:host(:not([resizable=start],[resizable=end])){-webkit-box-flex:1;flex:1}:host(:not([resizable=start],[resizable=end])) .forge-split-view-panel{width:100%;height:100%;min-width:0;min-height:0}:host(:not([resizable=start],[resizable=end])) .forge-split-view-panel__handle{display:none}';
+const styles = '@-webkit-keyframes mdc-ripple-fg-radius-in{from{-webkit-animation-timing-function:cubic-bezier(0.4,0,0.2,1);animation-timing-function:cubic-bezier(0.4,0,0.2,1);-webkit-transform:translate(var(--mdc-ripple-fg-translate-start,0)) scale(1);transform:translate(var(--mdc-ripple-fg-translate-start,0)) scale(1)}to{-webkit-transform:translate(var(--mdc-ripple-fg-translate-end,0)) scale(var(--mdc-ripple-fg-scale,1));transform:translate(var(--mdc-ripple-fg-translate-end,0)) scale(var(--mdc-ripple-fg-scale,1))}}@keyframes mdc-ripple-fg-radius-in{from{-webkit-animation-timing-function:cubic-bezier(0.4,0,0.2,1);animation-timing-function:cubic-bezier(0.4,0,0.2,1);-webkit-transform:translate(var(--mdc-ripple-fg-translate-start,0)) scale(1);transform:translate(var(--mdc-ripple-fg-translate-start,0)) scale(1)}to{-webkit-transform:translate(var(--mdc-ripple-fg-translate-end,0)) scale(var(--mdc-ripple-fg-scale,1));transform:translate(var(--mdc-ripple-fg-translate-end,0)) scale(var(--mdc-ripple-fg-scale,1))}}@-webkit-keyframes mdc-ripple-fg-opacity-in{from{-webkit-animation-timing-function:linear;animation-timing-function:linear;opacity:0}to{opacity:var(--mdc-ripple-fg-opacity, 0)}}@keyframes mdc-ripple-fg-opacity-in{from{-webkit-animation-timing-function:linear;animation-timing-function:linear;opacity:0}to{opacity:var(--mdc-ripple-fg-opacity, 0)}}@-webkit-keyframes mdc-ripple-fg-opacity-out{from{-webkit-animation-timing-function:linear;animation-timing-function:linear;opacity:var(--mdc-ripple-fg-opacity, 0)}to{opacity:0}}@keyframes mdc-ripple-fg-opacity-out{from{-webkit-animation-timing-function:linear;animation-timing-function:linear;opacity:var(--mdc-ripple-fg-opacity, 0)}to{opacity:0}}.mdc-ripple-surface{--mdc-ripple-fg-size:0;--mdc-ripple-left:0;--mdc-ripple-top:0;--mdc-ripple-fg-scale:1;--mdc-ripple-fg-translate-end:0;--mdc-ripple-fg-translate-start:0;-webkit-tap-highlight-color:transparent;will-change:transform,opacity;position:relative;outline:0;overflow:hidden}.mdc-ripple-surface::after,.mdc-ripple-surface::before{position:absolute;border-radius:50%;opacity:0;pointer-events:none;content:\"\"}.mdc-ripple-surface::before{-webkit-transition:opacity 15ms linear,background-color 15ms linear;transition:opacity 15ms linear,background-color 15ms linear;z-index:1;z-index:var(--mdc-ripple-z-index,1)}.mdc-ripple-surface::after{z-index:0;z-index:var(--mdc-ripple-z-index,0)}.mdc-ripple-surface.mdc-ripple-upgraded::before{-webkit-transform:scale(var(--mdc-ripple-fg-scale,1));transform:scale(var(--mdc-ripple-fg-scale,1))}.mdc-ripple-surface.mdc-ripple-upgraded::after{top:0;left:0;-webkit-transform:scale(0);transform:scale(0);-webkit-transform-origin:center center;transform-origin:center center}.mdc-ripple-surface.mdc-ripple-upgraded--unbounded::after{top:var(--mdc-ripple-top,0);left:var(--mdc-ripple-left,0)}.mdc-ripple-surface.mdc-ripple-upgraded--foreground-activation::after{-webkit-animation:mdc-ripple-fg-radius-in 225ms forwards,mdc-ripple-fg-opacity-in 75ms forwards;animation:mdc-ripple-fg-radius-in 225ms forwards,mdc-ripple-fg-opacity-in 75ms forwards}.mdc-ripple-surface.mdc-ripple-upgraded--foreground-deactivation::after{-webkit-animation:mdc-ripple-fg-opacity-out 150ms;animation:mdc-ripple-fg-opacity-out 150ms;-webkit-transform:translate(var(--mdc-ripple-fg-translate-end,0)) scale(var(--mdc-ripple-fg-scale,1));transform:translate(var(--mdc-ripple-fg-translate-end,0)) scale(var(--mdc-ripple-fg-scale,1))}.mdc-ripple-surface::after,.mdc-ripple-surface::before{top:calc(50% - 100%);left:calc(50% - 100%);width:200%;height:200%}.mdc-ripple-surface.mdc-ripple-upgraded::after{width:var(--mdc-ripple-fg-size,100%);height:var(--mdc-ripple-fg-size,100%)}.mdc-ripple-surface[data-mdc-ripple-is-unbounded],.mdc-ripple-upgraded--unbounded{overflow:visible}.mdc-ripple-surface[data-mdc-ripple-is-unbounded]::after,.mdc-ripple-surface[data-mdc-ripple-is-unbounded]::before,.mdc-ripple-upgraded--unbounded::after,.mdc-ripple-upgraded--unbounded::before{top:calc(50% - 50%);left:calc(50% - 50%);width:100%;height:100%}.mdc-ripple-surface[data-mdc-ripple-is-unbounded].mdc-ripple-upgraded::after,.mdc-ripple-surface[data-mdc-ripple-is-unbounded].mdc-ripple-upgraded::before,.mdc-ripple-upgraded--unbounded.mdc-ripple-upgraded::after,.mdc-ripple-upgraded--unbounded.mdc-ripple-upgraded::before{top:var(--mdc-ripple-top,calc(50% - 50%));left:var(--mdc-ripple-left,calc(50% - 50%));width:var(--mdc-ripple-fg-size,100%);height:var(--mdc-ripple-fg-size,100%)}.mdc-ripple-surface[data-mdc-ripple-is-unbounded].mdc-ripple-upgraded::after,.mdc-ripple-upgraded--unbounded.mdc-ripple-upgraded::after{width:var(--mdc-ripple-fg-size,100%);height:var(--mdc-ripple-fg-size,100%)}.mdc-ripple-surface::after,.mdc-ripple-surface::before{background-color:#000;background-color:var(--mdc-ripple-color,#000)}.mdc-ripple-surface.mdc-ripple-surface--hover::before,.mdc-ripple-surface:hover::before{opacity:.04;opacity:var(--mdc-ripple-hover-opacity, .04)}.mdc-ripple-surface.mdc-ripple-upgraded--background-focused::before,.mdc-ripple-surface:not(.mdc-ripple-upgraded):focus::before{-webkit-transition-duration:75ms;transition-duration:75ms;opacity:.12;opacity:var(--mdc-ripple-focus-opacity, .12)}.mdc-ripple-surface:not(.mdc-ripple-upgraded)::after{-webkit-transition:opacity 150ms linear;transition:opacity 150ms linear}.mdc-ripple-surface:not(.mdc-ripple-upgraded):active::after{-webkit-transition-duration:75ms;transition-duration:75ms;opacity:.12;opacity:var(--mdc-ripple-press-opacity, .12)}.mdc-ripple-surface.mdc-ripple-upgraded{--mdc-ripple-fg-opacity:var(--mdc-ripple-press-opacity, 0.12)}.mdc-ripple-surface::after,.mdc-ripple-surface::before{--mdc-ripple-color:var(--mdc-theme-on-surface)}.forge-split-view-panel{display:-webkit-box;display:flex;width:100%;height:100%;overflow:hidden;contain:paint size}.forge-split-view-panel__handle{color:rgba(0,0,0,.54);color:var(--mdc-theme-text-secondary-on-light,rgba(0,0,0,.54));background-color:#e0e0e0;background-color:var(--forge-theme-border-color,#e0e0e0);display:-webkit-box;display:flex;flex-shrink:0;-webkit-box-pack:center;justify-content:center;-webkit-box-align:center;align-items:center;outline:0}.forge-split-view-panel__content{-webkit-box-flex:1;flex:1;overflow:hidden}.forge-split-view-panel--closed{display:none}.forge-split-view-panel--disabled #handle{pointer-events:none}.forge-split-view-panel--disabled .forge-split-view-panel__icon{display:none}.forge-split-view-panel[orientation=horizontal]{min-width:8px;min-width:var(--forge-split-view-handle-width,8px);width:calc(var(--forge-split-view-panel-size,unset) + var(--forge-split-view-handle-width,8px));-webkit-box-orient:horizontal;-webkit-box-direction:normal;flex-direction:row}.forge-split-view-panel[orientation=horizontal] .forge-split-view-panel__handle{width:8px;width:var(--forge-split-view-handle-width,8px);cursor:var(--forge-split-view-panel-cursor)}.forge-split-view-panel[orientation=horizontal].forge-split-view-panel--closing[resizable=end]{position:absolute;top:0;left:0;-webkit-animation-name:utqga6s;animation-name:utqga6s;-webkit-animation-duration:.3s;animation-duration:.3s;-webkit-animation-timing-function:cubic-bezier(0.4,0,0.2,1);animation-timing-function:cubic-bezier(0.4,0,0.2,1)}@-webkit-keyframes utqga6s{from{-webkit-transform:none;transform:none}to{-webkit-transform:translateX(-100%);transform:translateX(-100%)}}@keyframes utqga6s{from{-webkit-transform:none;transform:none}to{-webkit-transform:translateX(-100%);transform:translateX(-100%)}}.forge-split-view-panel[orientation=horizontal].forge-split-view-panel--closing[resizable=start]{position:absolute;top:0;right:0;-webkit-animation-name:utqga7m;animation-name:utqga7m;-webkit-animation-duration:.3s;animation-duration:.3s;-webkit-animation-timing-function:cubic-bezier(0.4,0,0.2,1);animation-timing-function:cubic-bezier(0.4,0,0.2,1)}@-webkit-keyframes utqga7m{from{-webkit-transform:none;transform:none}to{-webkit-transform:translateX(100%);transform:translateX(100%)}}@keyframes utqga7m{from{-webkit-transform:none;transform:none}to{-webkit-transform:translateX(100%);transform:translateX(100%)}}.forge-split-view-panel[orientation=horizontal].forge-split-view-panel--opening[resizable=end]{position:absolute;top:0;left:0;-webkit-animation-name:utqga8k;animation-name:utqga8k;-webkit-animation-duration:.3s;animation-duration:.3s;-webkit-animation-timing-function:cubic-bezier(0.4,0,0.2,1);animation-timing-function:cubic-bezier(0.4,0,0.2,1);animation-direction:reverse}@-webkit-keyframes utqga8k{from{-webkit-transform:none;transform:none}to{-webkit-transform:translateX(-100%);transform:translateX(-100%)}}@keyframes utqga8k{from{-webkit-transform:none;transform:none}to{-webkit-transform:translateX(-100%);transform:translateX(-100%)}}.forge-split-view-panel[orientation=horizontal].forge-split-view-panel--opening[resizable=start]{position:absolute;top:0;right:0;-webkit-animation-name:utqga9e;animation-name:utqga9e;-webkit-animation-duration:.3s;animation-duration:.3s;-webkit-animation-timing-function:cubic-bezier(0.4,0,0.2,1);animation-timing-function:cubic-bezier(0.4,0,0.2,1);animation-direction:reverse}@-webkit-keyframes utqga9e{from{-webkit-transform:none;transform:none}to{-webkit-transform:translateX(100%);transform:translateX(100%)}}@keyframes utqga9e{from{-webkit-transform:none;transform:none}to{-webkit-transform:translateX(100%);transform:translateX(100%)}}.forge-split-view-panel[orientation=vertical]{min-height:8px;min-height:var(--forge-split-view-handle-width,8px);height:calc(var(--forge-split-view-panel-size,unset) + var(--forge-split-view-handle-width,8px));-webkit-box-orient:vertical;-webkit-box-direction:normal;flex-direction:column}.forge-split-view-panel[orientation=vertical] .forge-split-view-panel__handle{height:8px;height:var(--forge-split-view-handle-width,8px);cursor:var(--forge-split-view-panel-cursor)}.forge-split-view-panel[orientation=vertical].forge-split-view-panel--closing[resizable=end]{position:absolute;top:0;left:0;-webkit-animation-name:utqga9x;animation-name:utqga9x;-webkit-animation-duration:.3s;animation-duration:.3s;-webkit-animation-timing-function:cubic-bezier(0.4,0,0.2,1);animation-timing-function:cubic-bezier(0.4,0,0.2,1)}@-webkit-keyframes utqga9x{from{-webkit-transform:none;transform:none}to{-webkit-transform:translateY(-100%);transform:translateY(-100%)}}@keyframes utqga9x{from{-webkit-transform:none;transform:none}to{-webkit-transform:translateY(-100%);transform:translateY(-100%)}}.forge-split-view-panel[orientation=vertical].forge-split-view-panel--closing[resizable=start]{position:absolute;bottom:0;left:0;-webkit-animation-name:utqgaa5;animation-name:utqgaa5;-webkit-animation-duration:.3s;animation-duration:.3s;-webkit-animation-timing-function:cubic-bezier(0.4,0,0.2,1);animation-timing-function:cubic-bezier(0.4,0,0.2,1)}@-webkit-keyframes utqgaa5{from{-webkit-transform:none;transform:none}to{-webkit-transform:translateY(100%);transform:translateY(100%)}}@keyframes utqgaa5{from{-webkit-transform:none;transform:none}to{-webkit-transform:translateY(100%);transform:translateY(100%)}}.forge-split-view-panel[orientation=vertical].forge-split-view-panel--opening[resizable=end]{position:absolute;top:0;left:0;-webkit-animation-name:utqgab3;animation-name:utqgab3;-webkit-animation-duration:.3s;animation-duration:.3s;-webkit-animation-timing-function:cubic-bezier(0.4,0,0.2,1);animation-timing-function:cubic-bezier(0.4,0,0.2,1);animation-direction:reverse}@-webkit-keyframes utqgab3{from{-webkit-transform:none;transform:none}to{-webkit-transform:translateY(-100%);transform:translateY(-100%)}}@keyframes utqgab3{from{-webkit-transform:none;transform:none}to{-webkit-transform:translateY(-100%);transform:translateY(-100%)}}.forge-split-view-panel[orientation=vertical].forge-split-view-panel--opening[resizable=start]{position:absolute;bottom:0;left:0;-webkit-animation-name:utqgabt;animation-name:utqgabt;-webkit-animation-duration:.3s;animation-duration:.3s;-webkit-animation-timing-function:cubic-bezier(0.4,0,0.2,1);animation-timing-function:cubic-bezier(0.4,0,0.2,1);animation-direction:reverse}@-webkit-keyframes utqgabt{from{-webkit-transform:none;transform:none}to{-webkit-transform:translateY(100%);transform:translateY(100%)}}@keyframes utqgabt{from{-webkit-transform:none;transform:none}to{-webkit-transform:translateY(100%);transform:translateY(100%)}}:host{z-index:var(--forge-split-view-animating-layer)!important;display:block;position:relative;height:100%;width:100%;-webkit-box-flex:0;flex:0}:host([hidden]){display:none}:host(:not([resizable=start],[resizable=end])){-webkit-box-flex:1;flex:1}:host(:not([resizable=start],[resizable=end])) .forge-split-view-panel{width:100%;height:100%;min-width:0;min-height:0}:host(:not([resizable=start],[resizable=end])) .forge-split-view-panel__handle{display:none}';
 /**
  * The custom element class behind the `<forge-split-view-panel>` element.
  *

package/esm/switch/switch.js

@@ -6,10 +6,35 @@
 import { __decorate } from "tslib";
 import { CustomElement, attachShadowTemplate, coerceBoolean, getShadowElement, emitEvent, toggleAttribute, toggleClass } from '@tylertech/forge-core';
 import { MDCSwitch } from '@material/switch';
+import { MDCRipple } from '@material/ripple';
 import { SWITCH_CONSTANTS } from './switch-constants';
 import { BaseComponent } from '../core/base/base-component';
 const template = '<template><div class=\"forge-switch__container\" part=\"root\"><button id=\"switch-btn\" class=\"mdc-switch\" type=\"button\" role=\"switch\" aria-checked=\"false\" aria-labelledby=\"switch-label\" part=\"button\"><div class=\"mdc-switch__track\" part=\"track\"></div><div class=\"mdc-switch__handle-track\" part=\"handle-track\"><div class=\"mdc-switch__handle\" part=\"handle\"><div class=\"mdc-switch__shadow\" part=\"shadow\"><div class=\"mdc-elevation-overlay\" part=\"overlay\"></div></div><div class=\"mdc-switch__ripple\" part=\"ripple\"></div><div class=\"mdc-switch__icons\" part=\"icons\"><svg class=\"mdc-switch__icon mdc-switch__icon--on\" viewBox=\"0 0 24 24\" part=\"icon-on\"><path d=\"M19.69,5.23L8.96,15.96l-4.23-4.23L2.96,13.5l6,6L21.46,7L19.69,5.23z\" part=\"icon-on-path\"/></svg> <svg class=\"mdc-switch__icon mdc-switch__icon--off\" viewBox=\"0 0 24 24\" part=\"icon-off\"><path d=\"M20 13H4v-2h16v2z\" part=\"icon-off-path\"/></svg></div></div></div></button> <label id=\"switch-label\" class=\"forge-switch__label\" for=\"switch-btn\" part=\"label\"><slot></slot></label></div></template>';
 const styles = '.mdc-elevation-overlay{position:absolute;border-radius:inherit;pointer-events:none;opacity:0;opacity:var(--mdc-elevation-overlay-opacity, 0);-webkit-transition:opacity 280ms cubic-bezier(.4, 0, .2, 1);transition:opacity 280ms cubic-bezier(.4, 0, .2, 1);background-color:#fff;background-color:var(--mdc-elevation-overlay-color,#fff)}.mdc-switch{-webkit-box-align:center;align-items:center;background:0 0;border:none;display:-webkit-inline-box;display:inline-flex;flex-shrink:0;margin:0;outline:0;overflow:visible;padding:0;position:relative}.mdc-switch__track{overflow:hidden;position:relative;width:100%}.mdc-switch__track::after,.mdc-switch__track::before{border:1px solid transparent;border-radius:inherit;-webkit-box-sizing:border-box;box-sizing:border-box;content:\"\";height:100%;left:0;position:absolute;width:100%}.mdc-switch__track::before{-webkit-transition:-webkit-transform 75ms 0s cubic-bezier(0, 0, .2, 1);transition:-webkit-transform 75ms 0s cubic-bezier(0, 0, .2, 1);transition:transform 75ms 0s cubic-bezier(0, 0, .2, 1);transition:transform 75ms 0s cubic-bezier(0, 0, .2, 1),-webkit-transform 75ms 0s cubic-bezier(0, 0, .2, 1);-webkit-transform:translateX(0);transform:translateX(0)}.mdc-switch__track::after{-webkit-transition:-webkit-transform 75ms 0s cubic-bezier(.4, 0, .6, 1);transition:-webkit-transform 75ms 0s cubic-bezier(.4, 0, .6, 1);transition:transform 75ms 0s cubic-bezier(.4, 0, .6, 1);transition:transform 75ms 0s cubic-bezier(.4, 0, .6, 1),-webkit-transform 75ms 0s cubic-bezier(.4, 0, .6, 1);-webkit-transform:translateX(-100%);transform:translateX(-100%)}.mdc-switch__track[dir=rtl]::after,[dir=rtl] .mdc-switch__track::after{-webkit-transform:translateX(100%);transform:translateX(100%)}.mdc-switch--selected .mdc-switch__track::before{-webkit-transition:-webkit-transform 75ms 0s cubic-bezier(.4, 0, .6, 1);transition:-webkit-transform 75ms 0s cubic-bezier(.4, 0, .6, 1);transition:transform 75ms 0s cubic-bezier(.4, 0, .6, 1);transition:transform 75ms 0s cubic-bezier(.4, 0, .6, 1),-webkit-transform 75ms 0s cubic-bezier(.4, 0, .6, 1);-webkit-transform:translateX(100%);transform:translateX(100%)}.mdc-switch--selected .mdc-switch__track[dir=rtl]::before,[dir=rtl] .mdc-switch--selected .mdc-switch__track::before{transform:translateX(-100%)}.mdc-switch--selected .mdc-switch__track::after{-webkit-transition:-webkit-transform 75ms 0s cubic-bezier(0, 0, .2, 1);transition:-webkit-transform 75ms 0s cubic-bezier(0, 0, .2, 1);transition:transform 75ms 0s cubic-bezier(0, 0, .2, 1);transition:transform 75ms 0s cubic-bezier(0, 0, .2, 1),-webkit-transform 75ms 0s cubic-bezier(0, 0, .2, 1);-webkit-transform:translateX(0);transform:translateX(0)}.mdc-switch__handle-track{height:100%;pointer-events:none;position:absolute;top:0;-webkit-transition:-webkit-transform 75ms 0s cubic-bezier(.4, 0, .2, 1);transition:-webkit-transform 75ms 0s cubic-bezier(.4, 0, .2, 1);transition:transform 75ms 0s cubic-bezier(.4, 0, .2, 1);transition:transform 75ms 0s cubic-bezier(.4, 0, .2, 1),-webkit-transform 75ms 0s cubic-bezier(.4, 0, .2, 1);left:0;right:auto;-webkit-transform:translateX(0);transform:translateX(0)}.mdc-switch__handle-track[dir=rtl],[dir=rtl] .mdc-switch__handle-track{left:auto;right:0}.mdc-switch--selected .mdc-switch__handle-track{-webkit-transform:translateX(100%);transform:translateX(100%)}.mdc-switch--selected .mdc-switch__handle-track[dir=rtl],[dir=rtl] .mdc-switch--selected .mdc-switch__handle-track{transform:translateX(-100%)}.mdc-switch__handle{display:-webkit-box;display:flex;pointer-events:auto;position:absolute;top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%);left:0;right:auto}.mdc-switch__handle[dir=rtl],[dir=rtl] .mdc-switch__handle{left:auto;right:0}.mdc-switch__handle::after,.mdc-switch__handle::before{border:1px solid transparent;border-radius:inherit;-webkit-box-sizing:border-box;box-sizing:border-box;content:\"\";width:100%;height:100%;left:0;position:absolute;top:0;-webkit-transition:background-color 75ms 0s cubic-bezier(.4, 0, .2, 1),border-color 75ms 0s cubic-bezier(.4, 0, .2, 1);transition:background-color 75ms 0s cubic-bezier(.4, 0, .2, 1),border-color 75ms 0s cubic-bezier(.4, 0, .2, 1);z-index:-1}.mdc-switch__shadow{border-radius:inherit;bottom:0;left:0;position:absolute;right:0;top:0}.mdc-elevation-overlay{bottom:0;left:0;right:0;top:0}.mdc-switch__ripple{left:50%;position:absolute;top:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);z-index:-1}.mdc-switch:disabled .mdc-switch__ripple{display:none}.mdc-switch__icons{height:100%;position:relative;width:100%;z-index:1}.mdc-switch__icon{bottom:0;left:0;margin:auto;position:absolute;right:0;top:0;opacity:0;-webkit-transition:opacity 30ms 0s cubic-bezier(.4, 0, 1, 1);transition:opacity 30ms 0s cubic-bezier(.4, 0, 1, 1)}.mdc-switch--selected .mdc-switch__icon--on,.mdc-switch--unselected .mdc-switch__icon--off{opacity:1;-webkit-transition:opacity 45ms 30ms cubic-bezier(0, 0, .2, 1);transition:opacity 45ms 30ms cubic-bezier(0, 0, .2, 1)}.mdc-switch{--mdc-ripple-fg-size:0;--mdc-ripple-left:0;--mdc-ripple-top:0;--mdc-ripple-fg-scale:1;--mdc-ripple-fg-translate-end:0;--mdc-ripple-fg-translate-start:0;-webkit-tap-highlight-color:transparent;will-change:transform,opacity}@-webkit-keyframes mdc-ripple-fg-radius-in{from{-webkit-animation-timing-function:cubic-bezier(0.4,0,0.2,1);animation-timing-function:cubic-bezier(0.4,0,0.2,1);-webkit-transform:translate(var(--mdc-ripple-fg-translate-start,0)) scale(1);transform:translate(var(--mdc-ripple-fg-translate-start,0)) scale(1)}to{-webkit-transform:translate(var(--mdc-ripple-fg-translate-end,0)) scale(var(--mdc-ripple-fg-scale,1));transform:translate(var(--mdc-ripple-fg-translate-end,0)) scale(var(--mdc-ripple-fg-scale,1))}}@keyframes mdc-ripple-fg-radius-in{from{-webkit-animation-timing-function:cubic-bezier(0.4,0,0.2,1);animation-timing-function:cubic-bezier(0.4,0,0.2,1);-webkit-transform:translate(var(--mdc-ripple-fg-translate-start,0)) scale(1);transform:translate(var(--mdc-ripple-fg-translate-start,0)) scale(1)}to{-webkit-transform:translate(var(--mdc-ripple-fg-translate-end,0)) scale(var(--mdc-ripple-fg-scale,1));transform:translate(var(--mdc-ripple-fg-translate-end,0)) scale(var(--mdc-ripple-fg-scale,1))}}@-webkit-keyframes mdc-ripple-fg-opacity-in{from{-webkit-animation-timing-function:linear;animation-timing-function:linear;opacity:0}to{opacity:var(--mdc-ripple-fg-opacity, 0)}}@keyframes mdc-ripple-fg-opacity-in{from{-webkit-animation-timing-function:linear;animation-timing-function:linear;opacity:0}to{opacity:var(--mdc-ripple-fg-opacity, 0)}}@-webkit-keyframes mdc-ripple-fg-opacity-out{from{-webkit-animation-timing-function:linear;animation-timing-function:linear;opacity:var(--mdc-ripple-fg-opacity, 0)}to{opacity:0}}@keyframes mdc-ripple-fg-opacity-out{from{-webkit-animation-timing-function:linear;animation-timing-function:linear;opacity:var(--mdc-ripple-fg-opacity, 0)}to{opacity:0}}.mdc-switch .mdc-switch__ripple::after,.mdc-switch .mdc-switch__ripple::before{position:absolute;border-radius:50%;opacity:0;pointer-events:none;content:\"\"}.mdc-switch .mdc-switch__ripple::before{-webkit-transition:opacity 15ms linear,background-color 15ms linear;transition:opacity 15ms linear,background-color 15ms linear;z-index:1;z-index:var(--mdc-ripple-z-index,1)}.mdc-switch .mdc-switch__ripple::after{z-index:0;z-index:var(--mdc-ripple-z-index,0)}.mdc-switch.mdc-ripple-upgraded .mdc-switch__ripple::before{-webkit-transform:scale(var(--mdc-ripple-fg-scale,1));transform:scale(var(--mdc-ripple-fg-scale,1))}.mdc-switch.mdc-ripple-upgraded .mdc-switch__ripple::after{top:0;left:0;-webkit-transform:scale(0);transform:scale(0);-webkit-transform-origin:center center;transform-origin:center center}.mdc-switch.mdc-ripple-upgraded--unbounded .mdc-switch__ripple::after{top:var(--mdc-ripple-top,0);left:var(--mdc-ripple-left,0)}.mdc-switch.mdc-ripple-upgraded--foreground-activation .mdc-switch__ripple::after{-webkit-animation:mdc-ripple-fg-radius-in 225ms forwards,mdc-ripple-fg-opacity-in 75ms forwards;animation:mdc-ripple-fg-radius-in 225ms forwards,mdc-ripple-fg-opacity-in 75ms forwards}.mdc-switch.mdc-ripple-upgraded--foreground-deactivation .mdc-switch__ripple::after{-webkit-animation:mdc-ripple-fg-opacity-out 150ms;animation:mdc-ripple-fg-opacity-out 150ms;-webkit-transform:translate(var(--mdc-ripple-fg-translate-end,0)) scale(var(--mdc-ripple-fg-scale,1));transform:translate(var(--mdc-ripple-fg-translate-end,0)) scale(var(--mdc-ripple-fg-scale,1))}.mdc-switch .mdc-switch__ripple::after,.mdc-switch .mdc-switch__ripple::before{top:calc(50% - 50%);left:calc(50% - 50%);width:100%;height:100%}.mdc-switch.mdc-ripple-upgraded .mdc-switch__ripple::after,.mdc-switch.mdc-ripple-upgraded .mdc-switch__ripple::before{top:var(--mdc-ripple-top,calc(50% - 50%));left:var(--mdc-ripple-left,calc(50% - 50%));width:var(--mdc-ripple-fg-size,100%);height:var(--mdc-ripple-fg-size,100%)}.mdc-switch.mdc-ripple-upgraded .mdc-switch__ripple::after{width:var(--mdc-ripple-fg-size,100%);height:var(--mdc-ripple-fg-size,100%)}.mdc-switch{width:36px;width:var(--mdc-switch-track-width,36px)}.mdc-switch.mdc-switch--selected:enabled .mdc-switch__handle::after{background:#3d5afe;background:var(--mdc-switch-selected-handle-color,#3d5afe)}.mdc-switch.mdc-switch--selected:enabled:hover:not(:focus):not(:active) .mdc-switch__handle::after{background:#3d477f;background:var(--mdc-switch-selected-hover-handle-color,#3d477f)}.mdc-switch.mdc-switch--selected:enabled:focus:not(:active) .mdc-switch__handle::after{background:#3d477f;background:var(--mdc-switch-selected-focus-handle-color,#3d477f)}.mdc-switch.mdc-switch--selected:enabled:active .mdc-switch__handle::after{background:#3d477f;background:var(--mdc-switch-selected-pressed-handle-color,#3d477f)}.mdc-switch.mdc-switch--selected:disabled .mdc-switch__handle::after{background:#3d5afe;background:var(--mdc-switch-disabled-selected-handle-color,#3d5afe)}.mdc-switch.mdc-switch--unselected:enabled .mdc-switch__handle::after{background:#9e9e9e;background:var(--mdc-switch-unselected-handle-color,#9e9e9e)}.mdc-switch.mdc-switch--unselected:enabled:hover:not(:focus):not(:active) .mdc-switch__handle::after{background:#212121;background:var(--mdc-switch-unselected-hover-handle-color,#212121)}.mdc-switch.mdc-switch--unselected:enabled:focus:not(:active) .mdc-switch__handle::after{background:#212121;background:var(--mdc-switch-unselected-focus-handle-color,#212121)}.mdc-switch.mdc-switch--unselected:enabled:active .mdc-switch__handle::after{background:#212121;background:var(--mdc-switch-unselected-pressed-handle-color,#212121)}.mdc-switch.mdc-switch--unselected:disabled .mdc-switch__handle::after{background:#424242;background:var(--mdc-switch-disabled-unselected-handle-color,#424242)}.mdc-switch .mdc-switch__handle::before{background:#fff;background:var(--mdc-switch-handle-surface-color,var(--mdc-theme-surface,#fff))}.mdc-switch:enabled .mdc-switch__shadow{--mdc-elevation-box-shadow-for-gss:0px 2px 1px -1px rgba(0, 0, 0, 0.2),0px 1px 1px 0px rgba(0, 0, 0, 0.14),0px 1px 3px 0px rgba(0, 0, 0, 0.12);-webkit-box-shadow:0 2px 1px -1px rgba(0,0,0,.2),0 1px 1px 0 rgba(0,0,0,.14),0 1px 3px 0 rgba(0,0,0,.12);box-shadow:0 2px 1px -1px rgba(0,0,0,.2),0 1px 1px 0 rgba(0,0,0,.14),0 1px 3px 0 rgba(0,0,0,.12);-webkit-box-shadow:var(--mdc-switch-handle-elevation,var(--mdc-elevation-box-shadow-for-gss));box-shadow:var(--mdc-switch-handle-elevation,var(--mdc-elevation-box-shadow-for-gss))}.mdc-switch:disabled .mdc-switch__shadow{--mdc-elevation-box-shadow-for-gss:0px 0px 0px 0px rgba(0, 0, 0, 0.2),0px 0px 0px 0px rgba(0, 0, 0, 0.14),0px 0px 0px 0px rgba(0, 0, 0, 0.12);-webkit-box-shadow:0 0 0 0 rgba(0,0,0,.2),0 0 0 0 rgba(0,0,0,.14),0 0 0 0 rgba(0,0,0,.12);box-shadow:0 0 0 0 rgba(0,0,0,.2),0 0 0 0 rgba(0,0,0,.14),0 0 0 0 rgba(0,0,0,.12);-webkit-box-shadow:var(--mdc-switch-disabled-handle-elevation,var(--mdc-elevation-box-shadow-for-gss));box-shadow:var(--mdc-switch-disabled-handle-elevation,var(--mdc-elevation-box-shadow-for-gss))}.mdc-switch .mdc-switch__handle{height:20px;height:var(--mdc-switch-handle-height,20px)}.mdc-switch:disabled .mdc-switch__handle::after{opacity:.24;opacity:var(--mdc-switch-disabled-handle-opacity, .24)}.mdc-switch .mdc-switch__handle{border-radius:10px;border-radius:var(--mdc-switch-handle-shape,10px)}.mdc-switch .mdc-switch__handle{width:20px;width:var(--mdc-switch-handle-width,20px)}.mdc-switch .mdc-switch__handle-track{width:calc(100% - 20px);width:calc(100% - var(--mdc-switch-handle-width,20px))}.mdc-switch.mdc-switch--selected:enabled .mdc-switch__icon{fill:#ffffff;fill:var(--mdc-switch-selected-icon-color,var(--mdc-theme-on-primary,#ffffff))}.mdc-switch.mdc-switch--selected:disabled .mdc-switch__icon{fill:#ffffff;fill:var(--mdc-switch-disabled-selected-icon-color,var(--mdc-theme-on-primary,#ffffff))}.mdc-switch.mdc-switch--unselected:enabled .mdc-switch__icon{fill:#ffffff;fill:var(--mdc-switch-unselected-icon-color,var(--mdc-theme-on-primary,#ffffff))}.mdc-switch.mdc-switch--unselected:disabled .mdc-switch__icon{fill:#ffffff;fill:var(--mdc-switch-disabled-unselected-icon-color,var(--mdc-theme-on-primary,#ffffff))}.mdc-switch.mdc-switch--selected:disabled .mdc-switch__icons{opacity:.54;opacity:var(--mdc-switch-disabled-selected-icon-opacity, .54)}.mdc-switch.mdc-switch--unselected:disabled .mdc-switch__icons{opacity:.54;opacity:var(--mdc-switch-disabled-unselected-icon-opacity, .54)}.mdc-switch.mdc-switch--selected .mdc-switch__icon{width:18px;width:var(--mdc-switch-selected-icon-size,18px);height:18px;height:var(--mdc-switch-selected-icon-size,18px)}.mdc-switch.mdc-switch--unselected .mdc-switch__icon{width:18px;width:var(--mdc-switch-unselected-icon-size,18px);height:18px;height:var(--mdc-switch-unselected-icon-size,18px)}.mdc-switch.mdc-switch--selected:enabled:hover:not(:focus) .mdc-switch__ripple::after,.mdc-switch.mdc-switch--selected:enabled:hover:not(:focus) .mdc-switch__ripple::before{background-color:#3d5afe;background-color:var(--mdc-switch-selected-hover-state-layer-color,#3d5afe)}.mdc-switch.mdc-switch--selected:enabled:focus .mdc-switch__ripple::after,.mdc-switch.mdc-switch--selected:enabled:focus .mdc-switch__ripple::before{background-color:#3d5afe;background-color:var(--mdc-switch-selected-focus-state-layer-color,#3d5afe)}.mdc-switch.mdc-switch--selected:enabled:active .mdc-switch__ripple::after,.mdc-switch.mdc-switch--selected:enabled:active .mdc-switch__ripple::before{background-color:#3d5afe;background-color:var(--mdc-switch-selected-pressed-state-layer-color,#3d5afe)}.mdc-switch.mdc-switch--unselected:enabled:hover:not(:focus) .mdc-switch__ripple::after,.mdc-switch.mdc-switch--unselected:enabled:hover:not(:focus) .mdc-switch__ripple::before{background-color:#424242;background-color:var(--mdc-switch-unselected-hover-state-layer-color,#424242)}.mdc-switch.mdc-switch--unselected:enabled:focus .mdc-switch__ripple::after,.mdc-switch.mdc-switch--unselected:enabled:focus .mdc-switch__ripple::before{background-color:#424242;background-color:var(--mdc-switch-unselected-focus-state-layer-color,#424242)}.mdc-switch.mdc-switch--unselected:enabled:active .mdc-switch__ripple::after,.mdc-switch.mdc-switch--unselected:enabled:active .mdc-switch__ripple::before{background-color:#424242;background-color:var(--mdc-switch-unselected-pressed-state-layer-color,#424242)}.mdc-switch.mdc-switch--selected:enabled:hover:not(:focus).mdc-ripple-surface--hover .mdc-switch__ripple::before,.mdc-switch.mdc-switch--selected:enabled:hover:not(:focus):hover .mdc-switch__ripple::before{opacity:.04;opacity:var(--mdc-switch-selected-hover-state-layer-opacity, .04)}.mdc-switch.mdc-switch--selected:enabled:focus.mdc-ripple-upgraded--background-focused .mdc-switch__ripple::before,.mdc-switch.mdc-switch--selected:enabled:focus:not(.mdc-ripple-upgraded):focus .mdc-switch__ripple::before{-webkit-transition-duration:75ms;transition-duration:75ms;opacity:.12;opacity:var(--mdc-switch-selected-focus-state-layer-opacity, .12)}.mdc-switch.mdc-switch--selected:enabled:active:not(.mdc-ripple-upgraded) .mdc-switch__ripple::after{-webkit-transition:opacity 150ms linear;transition:opacity 150ms linear}.mdc-switch.mdc-switch--selected:enabled:active:not(.mdc-ripple-upgraded):active .mdc-switch__ripple::after{-webkit-transition-duration:75ms;transition-duration:75ms;opacity:.1;opacity:var(--mdc-switch-selected-pressed-state-layer-opacity, .1)}.mdc-switch.mdc-switch--selected:enabled:active.mdc-ripple-upgraded{--mdc-ripple-fg-opacity:var(--mdc-switch-selected-pressed-state-layer-opacity, 0.1)}.mdc-switch.mdc-switch--unselected:enabled:hover:not(:focus).mdc-ripple-surface--hover .mdc-switch__ripple::before,.mdc-switch.mdc-switch--unselected:enabled:hover:not(:focus):hover .mdc-switch__ripple::before{opacity:.04;opacity:var(--mdc-switch-unselected-hover-state-layer-opacity, .04)}.mdc-switch.mdc-switch--unselected:enabled:focus.mdc-ripple-upgraded--background-focused .mdc-switch__ripple::before,.mdc-switch.mdc-switch--unselected:enabled:focus:not(.mdc-ripple-upgraded):focus .mdc-switch__ripple::before{-webkit-transition-duration:75ms;transition-duration:75ms;opacity:.12;opacity:var(--mdc-switch-unselected-focus-state-layer-opacity, .12)}.mdc-switch.mdc-switch--unselected:enabled:active:not(.mdc-ripple-upgraded) .mdc-switch__ripple::after{-webkit-transition:opacity 150ms linear;transition:opacity 150ms linear}.mdc-switch.mdc-switch--unselected:enabled:active:not(.mdc-ripple-upgraded):active .mdc-switch__ripple::after{-webkit-transition-duration:75ms;transition-duration:75ms;opacity:.1;opacity:var(--mdc-switch-unselected-pressed-state-layer-opacity, .1)}.mdc-switch.mdc-switch--unselected:enabled:active.mdc-ripple-upgraded{--mdc-ripple-fg-opacity:var(--mdc-switch-unselected-pressed-state-layer-opacity, 0.1)}.mdc-switch .mdc-switch__ripple{height:48px;height:var(--mdc-switch-state-layer-size,48px);width:48px;width:var(--mdc-switch-state-layer-size,48px)}.mdc-switch .mdc-switch__track{height:14px;height:var(--mdc-switch-track-height,14px)}.mdc-switch:disabled .mdc-switch__track{opacity:.12;opacity:var(--mdc-switch-disabled-track-opacity, .12)}.mdc-switch:enabled .mdc-switch__track::after{background:#cfd6ff;background:var(--mdc-switch-selected-track-color,#cfd6ff)}.mdc-switch:enabled:hover:not(:focus):not(:active) .mdc-switch__track::after{background:#cfd6ff;background:var(--mdc-switch-selected-hover-track-color,#cfd6ff)}.mdc-switch:enabled:focus:not(:active) .mdc-switch__track::after{background:#cfd6ff;background:var(--mdc-switch-selected-focus-track-color,#cfd6ff)}.mdc-switch:enabled:active .mdc-switch__track::after{background:#cfd6ff;background:var(--mdc-switch-selected-pressed-track-color,#cfd6ff)}.mdc-switch:disabled .mdc-switch__track::after{background:#3d5afe;background:var(--mdc-switch-disabled-selected-track-color,#3d5afe)}.mdc-switch:enabled .mdc-switch__track::before{background:#e0e0e0;background:var(--mdc-switch-unselected-track-color,#e0e0e0)}.mdc-switch:enabled:hover:not(:focus):not(:active) .mdc-switch__track::before{background:#e0e0e0;background:var(--mdc-switch-unselected-hover-track-color,#e0e0e0)}.mdc-switch:enabled:focus:not(:active) .mdc-switch__track::before{background:#e0e0e0;background:var(--mdc-switch-unselected-focus-track-color,#e0e0e0)}.mdc-switch:enabled:active .mdc-switch__track::before{background:#e0e0e0;background:var(--mdc-switch-unselected-pressed-track-color,#e0e0e0)}.mdc-switch:disabled .mdc-switch__track::before{background:#424242;background:var(--mdc-switch-disabled-unselected-track-color,#424242)}.mdc-switch .mdc-switch__track{border-radius:7px;border-radius:var(--mdc-switch-track-shape,7px)}@media screen and (forced-colors:active),(-ms-high-contrast:active){.mdc-switch:disabled .mdc-switch__handle::after{opacity:1;opacity:var(--mdc-switch-disabled-handle-opacity, 1)}.mdc-switch.mdc-switch--selected:disabled .mdc-switch__icon{fill:GrayText;fill:var(--mdc-switch-disabled-selected-icon-color,GrayText)}.mdc-switch.mdc-switch--unselected:disabled .mdc-switch__icon{fill:GrayText;fill:var(--mdc-switch-disabled-unselected-icon-color,GrayText)}.mdc-switch.mdc-switch--selected:disabled .mdc-switch__icons{opacity:1;opacity:var(--mdc-switch-disabled-selected-icon-opacity, 1)}.mdc-switch.mdc-switch--unselected:disabled .mdc-switch__icons{opacity:1;opacity:var(--mdc-switch-disabled-unselected-icon-opacity, 1)}.mdc-switch:disabled .mdc-switch__track{opacity:1;opacity:var(--mdc-switch-disabled-track-opacity, 1)}}.forge-form-field{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:Roboto,sans-serif;font-family:var(--mdc-typography-body2-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-size:.875rem;font-size:var(--mdc-typography-body2-font-size, .875rem);line-height:1.25rem;line-height:var(--mdc-typography-body2-line-height, 1.25rem);font-weight:400;font-weight:var(--mdc-typography-body2-font-weight,400);letter-spacing:.0178571429em;letter-spacing:var(--mdc-typography-body2-letter-spacing, .0178571429em);text-decoration:inherit;-webkit-text-decoration:var(--mdc-typography-body2-text-decoration,inherit);text-decoration:var(--mdc-typography-body2-text-decoration,inherit);text-transform:inherit;text-transform:var(--mdc-typography-body2-text-transform,inherit);color:rgba(0,0,0,.87);color:var(--mdc-theme-text-primary-on-background,rgba(0,0,0,.87));display:-webkit-inline-box;display:inline-flex;-webkit-box-align:center;align-items:center;vertical-align:middle}.forge-form-field>label{-webkit-box-ordinal-group:1;order:0;margin-right:auto;padding-left:4px}.forge-form-field forge-switch~label{padding-left:8px}.forge-form-field--align-end>label{-webkit-box-ordinal-group:0;order:-1;margin-left:auto;padding-right:4px}.forge-switch__container{display:-webkit-box;display:flex;-webkit-box-align:center;align-items:center}.forge-switch__container.forge-switch--label-position-start{-webkit-box-orient:horizontal;-webkit-box-direction:reverse;flex-flow:row-reverse}.forge-switch__container.forge-switch--label-position-start .forge-switch__label{margin-left:auto;padding-right:8px}:host{display:inline-block}:host *{cursor:pointer}:host .forge-switch__label{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:Roboto,sans-serif;font-family:var(--mdc-typography-caption-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-size:.75rem;font-size:var(--mdc-typography-caption-font-size, .75rem);line-height:1.25rem;line-height:var(--mdc-typography-caption-line-height, 1.25rem);font-weight:400;font-weight:var(--mdc-typography-caption-font-weight,400);letter-spacing:.0333333333em;letter-spacing:var(--mdc-typography-caption-letter-spacing, .0333333333em);text-decoration:inherit;-webkit-text-decoration:var(--mdc-typography-caption-text-decoration,inherit);text-decoration:var(--mdc-typography-caption-text-decoration,inherit);text-transform:inherit;text-transform:var(--mdc-typography-caption-text-transform,inherit);padding-left:8px}:host([hidden]){display:none}:host([dense]) .mdc-switch__ripple{height:28px;width:28px}:host([disabled]) *{cursor:not-allowed}:host([disabled]) .forge-switch__label{color:rgba(0,0,0,.38);color:var(--forge-theme-label-disabled-on-background,rgba(0,0,0,.38))}';
+import { userInteractionListener } from '../core/utils';
+class ForgeMDCSwitch extends MDCSwitch {
+    initialize() {
+        // Do not call super.initialize()
+        // We defer instantiation of the ripple until first user interaction
+        this._deferRippleInitialization();
+    }
+    destroy() {
+        var _a;
+        // We are not calling super.destroy() because it expects `ripple` to be set when it might not be yet
+        // We instead just replicate all existing functionality, but allow for `ripple` to be undefined
+        this.foundation.destroy();
+        (_a = this.ripple) === null || _a === void 0 ? void 0 : _a.destroy();
+        this.root.removeEventListener('click', this.foundation.handleClick);
+    }
+    async _deferRippleInitialization() {
+        const type = await userInteractionListener(this.root);
+        this.ripple = new MDCRipple(this.root, this.createRippleFoundation());
+        if (type === 'focusin') {
+            // eslint-disable-next-line @typescript-eslint/dot-notation
+            this.ripple['foundation'].handleFocus();
+        }
+    }
+}
 /**
  * The custom element class behind the `<forge-switch>` element.
  *
@@ -42,14 +67,12 @@ let SwitchComponent = class SwitchComponent extends BaseComponent {
     connectedCallback() {
         // Add our click listener before initializing MDCSwitch to ensure we receive the event **first**
         this._buttonElement.addEventListener('click', this._clickListener);
-        this._mdcSwitch = new MDCSwitch(this._buttonElement);
-        this._mdcSwitch.initialize();
+        this._mdcSwitch = new ForgeMDCSwitch(this._buttonElement);
         this._applyInitialState();
     }
     disconnectedCallback() {
-        if (this._mdcSwitch) {
-            this._mdcSwitch.destroy();
-        }
+        var _a;
+        (_a = this._mdcSwitch) === null || _a === void 0 ? void 0 : _a.destroy();
     }
     attributeChangedCallback(name, oldValue, newValue) {
         switch (name) {
@@ -67,24 +90,27 @@ let SwitchComponent = class SwitchComponent extends BaseComponent {
                 break;
             case SWITCH_CONSTANTS.attributes.BUTTON_ARIA_LABEL:
                 this._applyButtonLabel(newValue);
+                break;
         }
     }
     _applyInitialState() {
         var _a;
-        this._mdcSwitch.disabled = this._disabled;
-        this._mdcSwitch.selected = this._selected;
+        if (this._mdcSwitch) {
+            this._mdcSwitch.disabled = this._disabled;
+            this._mdcSwitch.selected = this._selected;
+        }
         this._applyDense();
         this._applyLabelPosition();
         this._applyButtonLabel((_a = this.getAttribute(SWITCH_CONSTANTS.attributes.BUTTON_ARIA_LABEL)) !== null && _a !== void 0 ? _a : '');
     }
     _onClick(evt) {
-        if (this._mdcSwitch.disabled) {
+        var _a;
+        if ((_a = this._mdcSwitch) === null || _a === void 0 ? void 0 : _a.disabled) {
             return;
         }
         // Prevents MDCSwitch from receiving the click event in the targeting phase.
         // We will handle updating the selected state of MDCSwitch based on the result of our own event.
         evt.stopImmediatePropagation();
-        this._mdcSwitch.ripple.layout();
         const newValue = !this._selected;
         const isCancelled = !emitEvent(this, SWITCH_CONSTANTS.events.SELECT, newValue, true, true);
         if (!isCancelled) {
@@ -98,10 +124,9 @@ let SwitchComponent = class SwitchComponent extends BaseComponent {
         }
     }
     _applyDense() {
+        var _a, _b;
         toggleAttribute(this, this._dense, SWITCH_CONSTANTS.attributes.DENSE);
-        if (this._mdcSwitch) {
-            this._mdcSwitch.ripple.layout();
-        }
+        (_b = (_a = this._mdcSwitch) === null || _a === void 0 ? void 0 : _a.ripple) === null || _b === void 0 ? void 0 : _b.layout();
     }
     _applyLabelPosition() {
         toggleClass(this._containerElement, this._labelPosition === 'start', SWITCH_CONSTANTS.classes.LABEL_START);

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

@@ -26,6 +26,7 @@ export interface ITableFoundation extends ICustomElementFoundation {
     connect(): void;
     hideColumn(columnIndex: number): void;
     showColumn(columnIndex: number): void;
+    isColumnHidden(columnIndex: number): boolean;
     getSelectedRows(): any[];
     selectRows(data: any[], clearCurrentSelections: boolean): void;
     deselectRows(data: any[]): void;
@@ -186,6 +187,12 @@ export declare class TableFoundation implements ITableFoundation {
      * @param {number} columnIndex The index of the column to show.
      */
     showColumn(columnIndex: number): void;
+    /**
+     * Determines if a column at the given index is hidden or not.
+     * @param {number} columnIndex The index of the column.
+     * @returns {boolean} `true` if the column is hidden, `false` otherwise.
+     */
+    isColumnHidden(columnIndex: number): boolean;
     /**
      * Creates and renders the table with the current column configuration and data.
      */

package/esm/table/table-foundation.js

@@ -435,6 +435,15 @@ export class TableFoundation {
             this.render();
         }
     }
+    /**
+     * Determines if a column at the given index is hidden or not.
+     * @param {number} columnIndex The index of the column.
+     * @returns {boolean} `true` if the column is hidden, `false` otherwise.
+     */
+    isColumnHidden(columnIndex) {
+        const columnConfig = this._columnConfigurations[columnIndex];
+        return !!columnConfig && this._hiddenColumnManager.exists(columnConfig);
+    }
     /**
      * Creates and renders the table with the current column configuration and data.
      */