@tylertech/forge 3.6.4 → 3.8.0-dev.0

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

@@ -13,7 +13,7 @@ import { SplitViewPanelCore } from './split-view-panel-core';
 import { SplitViewPanelAdapter } from './split-view-panel-adapter';
 import { IconComponent, IconRegistry } from '../../icon';
 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-state-layer target=\"handle\" id=\"state-layer\" exportparts=\"surface:state-layer\"></forge-state-layer><forge-focus-indicator inward target=\"handle\" part=\"focus-indicator\"></forge-focus-indicator></div><div class=\"forge-split-view-panel__content\" id=\"content\" part=\"content\" role=\"group\"><slot></slot></div></div></template>';
-const styles = '.forge-split-view-panel{display:flex;width:100%;height:100%;overflow:hidden}.forge-split-view-panel__handle{color:var(--forge-theme-text-medium,rgba(0,0,0,.6));background-color:var(--forge-theme-outline,#e0e0e0);position:relative;display:flex;flex-shrink:0;justify-content:center;align-items:center;outline:0}.forge-split-view-panel__content{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:var(--forge-split-view-handle-width,8px);width:calc(var(--forge-split-view-panel-size,unset) + var(--forge-split-view-handle-width,8px));flex-direction:row}.forge-split-view-panel[orientation=horizontal] .forge-split-view-panel__handle{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;animation-name:udvzwcb;animation-duration:var(--forge-animation-duration-medium2, 300ms);animation-timing-function:var(--forge-animation-easing-standard,cubic-bezier(0.2,0,0,1))}@keyframes udvzwcb{from{transform:none}to{transform:translateX(-100%)}}.forge-split-view-panel[orientation=horizontal].forge-split-view-panel--closing[resizable=start]{position:absolute;top:0;right:0;animation-name:udvzwcy;animation-duration:var(--forge-animation-duration-medium2, 300ms);animation-timing-function:var(--forge-animation-easing-standard,cubic-bezier(0.2,0,0,1))}@keyframes udvzwcy{from{transform:none}to{transform:translateX(100%)}}.forge-split-view-panel[orientation=horizontal].forge-split-view-panel--opening[resizable=end]{position:absolute;top:0;left:0;animation-name:udvzwdl;animation-duration:var(--forge-animation-duration-medium2, 300ms);animation-timing-function:var(--forge-animation-easing-standard,cubic-bezier(0.2,0,0,1));animation-direction:reverse}@keyframes udvzwdl{from{transform:none}to{transform:translateX(-100%)}}.forge-split-view-panel[orientation=horizontal].forge-split-view-panel--opening[resizable=start]{position:absolute;top:0;right:0;animation-name:udvzwdu;animation-duration:var(--forge-animation-duration-medium2, 300ms);animation-timing-function:var(--forge-animation-easing-standard,cubic-bezier(0.2,0,0,1));animation-direction:reverse}@keyframes udvzwdu{from{transform:none}to{transform:translateX(100%)}}.forge-split-view-panel[orientation=vertical]{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));flex-direction:column}.forge-split-view-panel[orientation=vertical] .forge-split-view-panel__handle{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;animation-name:udvzwej;animation-duration:var(--forge-animation-duration-medium2, 300ms);animation-timing-function:var(--forge-animation-easing-standard,cubic-bezier(0.2,0,0,1))}@keyframes udvzwej{from{transform:none}to{transform:translateY(-100%)}}.forge-split-view-panel[orientation=vertical].forge-split-view-panel--closing[resizable=start]{position:absolute;bottom:0;left:0;animation-name:udvzwfg;animation-duration:var(--forge-animation-duration-medium2, 300ms);animation-timing-function:var(--forge-animation-easing-standard,cubic-bezier(0.2,0,0,1))}@keyframes udvzwfg{from{transform:none}to{transform:translateY(100%)}}.forge-split-view-panel[orientation=vertical].forge-split-view-panel--opening[resizable=end]{position:absolute;top:0;left:0;animation-name:udvzwfh;animation-duration:var(--forge-animation-duration-medium2, 300ms);animation-timing-function:var(--forge-animation-easing-standard,cubic-bezier(0.2,0,0,1));animation-direction:reverse}@keyframes udvzwfh{from{transform:none}to{transform:translateY(-100%)}}.forge-split-view-panel[orientation=vertical].forge-split-view-panel--opening[resizable=start]{position:absolute;bottom:0;left:0;animation-name:udvzwfx;animation-duration:var(--forge-animation-duration-medium2, 300ms);animation-timing-function:var(--forge-animation-easing-standard,cubic-bezier(0.2,0,0,1));animation-direction:reverse}@keyframes udvzwfx{from{transform:none}to{transform:translateY(100%)}}:host{z-index:var(--forge-split-view-animating-layer)!important;display:block;position:relative;height:100%;width:100%;flex:0}:host([hidden]){display:none}:host(:not([resizable=start],[resizable=end])){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}forge-focus-indicator{--forge-focus-indicator-active-width:2px}';
+const styles = '.forge-split-view-panel{display:flex;width:100%;height:100%;overflow:hidden}.forge-split-view-panel__handle{color:var(--forge-theme-text-medium,rgba(0,0,0,.6));background-color:var(--forge-theme-outline,#e0e0e0);position:relative;display:flex;flex-shrink:0;justify-content:center;align-items:center;outline:0}.forge-split-view-panel__content{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:var(--forge-split-view-handle-width,8px);width:calc(var(--forge-split-view-panel-size,unset) + var(--forge-split-view-handle-width,8px));flex-direction:row}.forge-split-view-panel[orientation=horizontal] .forge-split-view-panel__handle{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;animation-name:ugnd22r;animation-duration:var(--forge-animation-duration-medium2, 300ms);animation-timing-function:var(--forge-animation-easing-standard,cubic-bezier(0.2,0,0,1))}@keyframes ugnd22r{from{transform:none}to{transform:translateX(-100%)}}.forge-split-view-panel[orientation=horizontal].forge-split-view-panel--closing[resizable=start]{position:absolute;top:0;right:0;animation-name:ugnd23p;animation-duration:var(--forge-animation-duration-medium2, 300ms);animation-timing-function:var(--forge-animation-easing-standard,cubic-bezier(0.2,0,0,1))}@keyframes ugnd23p{from{transform:none}to{transform:translateX(100%)}}.forge-split-view-panel[orientation=horizontal].forge-split-view-panel--opening[resizable=end]{position:absolute;top:0;left:0;animation-name:ugnd24k;animation-duration:var(--forge-animation-duration-medium2, 300ms);animation-timing-function:var(--forge-animation-easing-standard,cubic-bezier(0.2,0,0,1));animation-direction:reverse}@keyframes ugnd24k{from{transform:none}to{transform:translateX(-100%)}}.forge-split-view-panel[orientation=horizontal].forge-split-view-panel--opening[resizable=start]{position:absolute;top:0;right:0;animation-name:ugnd24o;animation-duration:var(--forge-animation-duration-medium2, 300ms);animation-timing-function:var(--forge-animation-easing-standard,cubic-bezier(0.2,0,0,1));animation-direction:reverse}@keyframes ugnd24o{from{transform:none}to{transform:translateX(100%)}}.forge-split-view-panel[orientation=vertical]{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));flex-direction:column}.forge-split-view-panel[orientation=vertical] .forge-split-view-panel__handle{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;animation-name:ugnd250;animation-duration:var(--forge-animation-duration-medium2, 300ms);animation-timing-function:var(--forge-animation-easing-standard,cubic-bezier(0.2,0,0,1))}@keyframes ugnd250{from{transform:none}to{transform:translateY(-100%)}}.forge-split-view-panel[orientation=vertical].forge-split-view-panel--closing[resizable=start]{position:absolute;bottom:0;left:0;animation-name:ugnd25a;animation-duration:var(--forge-animation-duration-medium2, 300ms);animation-timing-function:var(--forge-animation-easing-standard,cubic-bezier(0.2,0,0,1))}@keyframes ugnd25a{from{transform:none}to{transform:translateY(100%)}}.forge-split-view-panel[orientation=vertical].forge-split-view-panel--opening[resizable=end]{position:absolute;top:0;left:0;animation-name:ugnd25j;animation-duration:var(--forge-animation-duration-medium2, 300ms);animation-timing-function:var(--forge-animation-easing-standard,cubic-bezier(0.2,0,0,1));animation-direction:reverse}@keyframes ugnd25j{from{transform:none}to{transform:translateY(-100%)}}.forge-split-view-panel[orientation=vertical].forge-split-view-panel--opening[resizable=start]{position:absolute;bottom:0;left:0;animation-name:ugnd25q;animation-duration:var(--forge-animation-duration-medium2, 300ms);animation-timing-function:var(--forge-animation-easing-standard,cubic-bezier(0.2,0,0,1));animation-direction:reverse}@keyframes ugnd25q{from{transform:none}to{transform:translateY(100%)}}:host{z-index:var(--forge-split-view-animating-layer)!important;display:block;position:relative;height:100%;width:100%;flex:0}:host([hidden]){display:none}:host(:not([resizable=start],[resizable=end])){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}forge-focus-indicator{--forge-focus-indicator-active-width:2px}';
 import { StateLayerComponent } from '../../state-layer';
 import { FocusIndicatorComponent } from '../../focus-indicator';
 /**

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

@@ -3,6 +3,14 @@
  * Copyright Tyler Technologies, Inc. 
  * License: Apache-2.0
  */
+declare const numbers: {
+    ARROW_LEFT_KEYCODE: number;
+    ARROW_RIGHT_KEYCODE: number;
+    END_KEYCODE: number;
+    HOME_KEYCODE: number;
+    ENTER_KEYCODE: number;
+    SPACE_KEYCODE: number;
+};
 export declare const STEPPER_CONSTANTS: {
     elementName: "forge-stepper";
     classes: {
@@ -50,7 +58,12 @@ export declare const STEPPER_CONSTANTS: {
     };
     ACCEPTABLE_KEYS: string[];
     KEYCODE_MAP: {
-        [x: number]: string;
+        [numbers.ARROW_LEFT_KEYCODE]: string;
+        [numbers.ARROW_RIGHT_KEYCODE]: string;
+        [numbers.END_KEYCODE]: string;
+        [numbers.HOME_KEYCODE]: string;
+        [numbers.ENTER_KEYCODE]: string;
+        [numbers.SPACE_KEYCODE]: string;
     };
 };
 export interface IStepConfiguration {
@@ -75,3 +88,4 @@ export interface IStepperConfiguration {
 }
 export type StepperLayoutMode = 'fixed' | 'clustered';
 export type StepperLayoutAlign = 'left' | 'center' | 'right';
+export {};

package/esm/switch/switch.d.ts

@@ -16,7 +16,7 @@ export interface ISwitchComponent extends IWithFormAssociation, IWithFocusable,
     checked: boolean;
     /** @deprecated use `checked` instead */
     on: boolean;
-    /** @deprecated use `on` instead */
+    /** @deprecated use `checked` instead */
     selected: boolean;
     defaultChecked: boolean;
     /** @deprecated use `defaultChecked` instead */
@@ -150,7 +150,11 @@ export declare class SwitchComponent extends SwitchComponent_base implements ISw
     labelClickedCallback(): void;
     labelChangedCallback(value: string | null): void;
     /** @ignore */
-    setFormValue(value: FormValue | null, state?: FormValue | null | undefined): void;
+    setFormValue(value: (FormValue & {
+        [key: string]: any;
+    }) | null, state?: (FormValue & {
+        [key: string]: any;
+    }) | null | undefined): void;
     /**
      * Gets/sets whether the switch is checked or not.
      * @default false

package/esm/switch/switch.js

@@ -18,7 +18,7 @@ import { SwitchAdapter } from './switch-adapter';
 import { SWITCH_CONSTANTS } from './switch-constants';
 import { SwitchCore } from './switch-core';
 const template = '<template><div class=\"forge-switch\" part=\"switch\"><div id=\"container\" class=\"container\"><div class=\"track\" part=\"track\"></div><div class=\"handle\" part=\"handle\"><div id=\"icon-off\" class=\"icon icon__off\" part=\"icon-off\"><slot name=\"icon-off\"><svg aria-hidden=\"true\" viewBox=\"0 0 24 24\"><path d=\"M20 13H4v-2h16v2z\"/></svg></slot></div><div id=\"icon-on\" class=\"icon icon__on\" part=\"icon-on\"><slot name=\"icon-on\"><svg aria-hidden=\"true\" viewBox=\"0 0 24 24\"><path d=\"M19.69,5.23L8.96,15.96l-4.23-4.23L2.96,13.5l6,6L21.46,7L19.69,5.23z\"/></svg></slot></div><forge-state-layer target=\":host\" exportparts=\"surface:state-layer\"></forge-state-layer></div><forge-focus-indicator target=\":host\" part=\"focus-indicator\"></forge-focus-indicator></div><label id=\"label\" class=\"label\" part=\"label\"><slot></slot></label></div></template>';
-const styles = ':host{display:inline-block;outline:0;-webkit-tap-highlight-color:transparent}:host([hidden]){display:none}.forge-switch{--_switch-handle-size:var(--forge-switch-handle-size, 20px);--_switch-handle-scale:var(--forge-switch-handle-scale, 1);--_switch-handle-elevation:var(--forge-switch-handle-elevation, 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));--_switch-track-border-width:var(--forge-switch-track-border-width, 0);--_switch-track-border-color:var(--forge-switch-track-border-color, transparent);--_switch-icon-color:var(--forge-switch-icon-color, var(--forge-theme-on-tertiary, #ffffff));--_switch-icon-size:var(--forge-switch-icon-size, 16px);--_switch-icon-scale:var(--forge-switch-icon-scale, 1);--_switch-state-layer-size:var(--forge-switch-state-layer-size, 40px);--_switch-state-layer-dense-size:var(--forge-switch-state-layer-dense-size, 28px);--_switch-handle-on-color:var(--forge-switch-handle-on-color, var(--forge-theme-tertiary, #3d5afe));--_switch-handle-off-color:var(--forge-switch-handle-off-color, var(--forge-theme-surface-container-high, #9e9e9e));--_switch-handle-width:var(--forge-switch-handle-width, var(--_switch-handle-size));--_switch-handle-height:var(--forge-switch-handle-height, var(--_switch-handle-size));--_switch-handle-on-scale:var(--forge-switch-handle-on-scale, var(--_switch-handle-scale));--_switch-handle-off-scale:var(--forge-switch-handle-off-scale, var(--_switch-handle-scale));--_switch-handle-shape:var(--forge-switch-handle-shape, calc(var(--forge-shape-round, 50%) * var(--forge-shape-factor, 1)));--_switch-handle-on-elevation:var(--forge-switch-handle-on-elevation, var(--_switch-handle-elevation));--_switch-handle-off-elevation:var(--forge-switch-handle-off-elevation, var(--_switch-handle-elevation));--_switch-track-on-color:var(--forge-switch-track-on-color, var(--forge-theme-tertiary-container, #d0d7ff));--_switch-track-off-color:var(--forge-switch-track-off-color, var(--forge-theme-surface-container, #e0e0e0));--_switch-track-width:var(--forge-switch-track-width, 36px);--_switch-track-height:var(--forge-switch-track-height, 14px);--_switch-track-shape:var(--forge-switch-track-shape, calc(var(--forge-shape-full, 9999px) * var(--forge-shape-factor, 1)));--_switch-track-on-border-width:var(--forge-switch-track-on-border-width, var(--_switch-track-border-width));--_switch-track-off-border-width:var(--forge-switch-track-off-border-width, var(--_switch-track-border-width));--_switch-track-on-border-color:var(--forge-switch-track-on-border-color, var(--_switch-track-border-color));--_switch-track-off-border-color:var(--forge-switch-track-off-border-color, var(--_switch-track-border-color));--_switch-icon-on-color:var(--forge-switch-icon-on-color, var(--_switch-icon-color));--_switch-icon-off-color:var(--forge-switch-icon-off-color, var(--_switch-icon-color));--_switch-icon-on-size:var(--forge-switch-icon-on-size, var(--_switch-icon-size));--_switch-icon-off-size:var(--forge-switch-icon-off-size, var(--_switch-icon-size));--_switch-icon-on-scale:var(--forge-switch-icon-on-scale, var(--_switch-icon-scale));--_switch-icon-off-scale:var(--forge-switch-icon-off-scale, var(--_switch-icon-scale));--_switch-gap:var(--forge-switch-gap, 0);--_switch-justify:var(--forge-switch-justify, start);--_switch-align:var(--forge-switch-align, center);--_switch-direction:var(--forge-switch-direction, initial);--_switch-state-layer-width:var(--forge-switch-state-layer-width, var(--_switch-state-layer-size));--_switch-state-layer-height:var(--forge-switch-state-layer-height, var(--_switch-state-layer-size));--_switch-state-layer-on-color:var(--forge-switch-state-layer-on-color, var(--_switch-handle-on-color));--_switch-state-layer-off-color:var(--forge-switch-state-layer-off-color, var(--_switch-color));--_switch-state-layer-dense-width:var(--forge-switch-state-layer-dense-width, var(--_switch-state-layer-dense-size));--_switch-state-layer-dense-height:var(--forge-switch-state-layer-dense-height, var(--_switch-state-layer-dense-size));--_switch-disabled-opacity:var(--forge-switch-disabled-opacity, 0.38);--_switch-handle-active-on-color:var(--forge-switch-handle-active-on-color, var(--_switch-handle-on-color));--_switch-handle-active-off-color:var(--forge-switch-handle-active-off-color, var(--_switch-handle-off-color));--_switch-handle-active-scale:var(--forge-switch-handle-active-scale, 1.2);--_switch-handle-active-on-scale:var(--forge-switch-handle-active-on-scale, var(--_switch-handle-active-scale));--_switch-handle-active-off-scale:var(--forge-switch-handle-active-off-scale, var(--_switch-handle-active-scale));--_switch-handle-active-elevation:var(--forge-switch-handle-active-elevation, var(--_switch-handle-elevation));--_switch-handle-active-on-elevation:var(--forge-switch-handle-active-on-elevation, var(--_switch-handle-active-elevation));--_switch-handle-active-off-elevation:var(--forge-switch-handle-active-off-elevation, var(--_switch-handle-active-elevation));--_switch-track-active-on-color:var(--forge-switch-track-active-on-color, var(--_switch-track-on-color));--_switch-track-active-off-color:var(--forge-switch-track-active-off-color, var(--_switch-track-off-color));--_switch-track-active-on-border-width:var(--forge-switch-track-active-on-border-width, var(--_switch-track-on-border-width));--_switch-track-active-off-border-width:var(--forge-switch-track-active-off-border-width, var(--_switch-track-off-border-width));--_switch-track-active-on-border-color:var(--forge-switch-track-active-on-border-color, var(--_switch-track-on-border-color));--_switch-track-active-off-border-color:var(--forge-switch-track-active-off-border-color, var(--_switch-track-off-border-color));--_switch-icon-active-on-color:var(--forge-switch-icon-active-on-color, var(--_switch-icon-on-color));--_switch-icon-active-off-color:var(--forge-switch-icon-active-off-color, var(--_switch-icon-off-color));--_switch-icon-active-on-scale:var(--forge-switch-icon-active-on-scale, var(--_switch-icon-on-scale));--_switch-icon-active-off-scale:var(--forge-switch-icon-active-off-scale, var(--_switch-icon-off-scale));--_switch-animation-duration:var(--forge-switch-animation-duration, var(--forge-animation-duration-short2, 100ms));--_switch-animation-timing:var(--forge-switch-animation-timing, var(--forge-animation-easing-standard, cubic-bezier(0.2, 0, 0, 1)));--_switch-active-animation-timing:var(--forge-switch-active-animation-timing, var(--forge-animation-easing-linear, cubic-bezier(0, 0, 1, 1)))}.forge-switch{display:flex;position:relative;flex-direction:var(--_switch-direction);align-items:var(--_switch-align);justify-content:var(--_switch-justify);gap:var(--_switch-gap);--_switch-current-state-layer-width:var(--_switch-state-layer-width);--_switch-current-state-layer-height:var(--_switch-state-layer-height)}.forge-switch .container{position:relative;align-items:center;display:flex;flex-shrink:0;block-size:max(var(--_switch-handle-height),var(--_switch-track-height),var(--_switch-current-state-layer-height));cursor:pointer}.forge-switch .input{position:absolute;z-index:1;appearance:none;outline:0;margin:0;inline-size:100%;block-size:100%;cursor:unset}.forge-switch .track{transition-property:background-color,border-color,border-width;transition-duration:var(--_switch-animation-duration);transition-timing-function:var(--_switch-animation-timing);box-sizing:border-box;margin-inline:calc(max(var(--_switch-handle-width),var(--_switch-current-state-layer-width))/ 2 - calc(var(--_switch-track-height)/ 2));border-width:var(--_switch-track-off-border-width);border-color:var(--_switch-track-off-border-color);border-style:solid;border-radius:var(--_switch-track-shape);inline-size:var(--_switch-track-width);block-size:var(--_switch-track-height);background-color:var(--_switch-track-off-color)}.forge-switch .handle{position:absolute;justify-content:center;align-items:center;display:flex;transition-property:translate;transition-duration:var(--_switch-animation-duration);transition-timing-function:var(--_switch-animation-timing);border-radius:var(--_switch-handle-shape);inline-size:var(--_switch-current-state-layer-width);block-size:var(--_switch-current-state-layer-height)}.forge-switch .handle::before{content:\"\";position:relative;display:block;scale:var(--_switch-handle-off-scale);transition:background-color var(--_switch-animation-duration) var(--_switch-animation-timing),box-shadow var(--_switch-animation-duration) var(--_switch-animation-timing),scale var(--_switch-animation-duration) var(--_switch-active-animation-timing);box-shadow:var(--_switch-handle-off-elevation);border-radius:var(--_switch-handle-shape);inline-size:var(--_switch-handle-width);block-size:var(--_switch-handle-height);background-color:var(--_switch-handle-off-color)}.forge-switch .icon{position:absolute;align-items:center;justify-content:center;display:flex;transition-property:opacity,scale;transition-duration:var(--_switch-animation-duration);transition-timing-function:var(--_switch-animation-timing);inline-size:var(--_switch-icon-off-size);block-size:var(--_switch-icon-off-size);color:var(--_switch-icon-off-color);fill:var(--_switch-icon-off-color);font-size:var(--_switch-icon-off-size);--forge-icon-font-size:var(--_switch-icon-off-size)}.forge-switch .icon__on{--forge-icon-font-size:var(--_switch-icon-on-size);inline-size:var(--_switch-icon-on-size);block-size:var(--_switch-icon-on-size);color:var(--_switch-icon-on-color);fill:var(--_switch-icon-on-color);font-size:var(--_switch-icon-on-size);opacity:0;scale:0.4}.forge-switch .icon__off{opacity:1;scale:var(--_switch-icon-off-scale)}.forge-switch .label{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:var(--forge-typography-label2-font-family, var(--forge-typography-font-family, \"Roboto\", sans-serif));font-size:var(--forge-typography-label2-font-size, calc(var(--forge-typography-font-size, 1rem) * var(--forge-typography-label-font-size-scale, .8125)));font-weight:var(--forge-typography-label2-font-weight,400);line-height:var(--forge-typography-label2-line-height, calc(var(--forge-typography-font-size, 1rem) * var(--forge-typography-label-line-height-scale, 1.25)));letter-spacing:var(--forge-typography-label2-letter-spacing, .0096153846em);text-transform:var(--forge-typography-label2-text-transform,inherit);text-decoration:var(--forge-typography-label2-text-decoration,inherit)}.forge-switch .label:empty{display:none}.forge-switch .hidden{display:none}.forge-switch ::slotted([slot=input]){position:absolute;z-index:1;appearance:none;outline:0;margin:0;inline-size:100%;block-size:100%;cursor:unset}:host([checked]) .track{border-width:var(--_switch-track-on-border-width);border-color:var(--_switch-track-on-border-color);background-color:var(--_switch-track-on-color)}:host([checked]) .handle{translate:calc(var(--_switch-track-width) - calc(var(--_switch-track-height)/ 2) * 2)}:host([checked]) .handle::before{scale:var(--_switch-handle-on-scale);box-shadow:var(--_switch-handle-on-elevation);background-color:var(--_switch-handle-on-color)}:host([checked]) .handle .icon__on{opacity:1;scale:var(--_switch-icon-on-scale)}:host([checked]) .handle .icon__off{opacity:0;scale:0.4}:host([checked]) forge-state-layer{--forge-state-layer-color:var(--_switch-state-layer-on-color)}:host(:not([disabled]):not([readonly])) .forge-switch .container:active .track{border-width:var(--_switch-track-active-off-border-width);border-color:var(--_switch-track-active-off-border-color);background-color:var(--_switch-track-active-off-color)}:host(:not([disabled]):not([readonly])) .forge-switch .container:active .handle::before{scale:var(--_switch-handle-active-off-scale);box-shadow:var(--_switch-handle-active-off-elevation);background-color:var(--_switch-handle-active-off-color)}:host(:not([disabled]):not([readonly])) .forge-switch .container:active .handle .icon{scale:var(--_switch-icon-active-off-scale);color:var(--_switch-icon-active-off-color);fill:var(--_switch-icon-active-off-color)}:host(:not([disabled]):not([readonly])[checked]) .forge-switch .container:active .track{border-width:var(--_switch-track-active-on-border-width);border-color:var(--_switch-track-active-on-border-color);background-color:var(--_switch-track-active-on-color)}:host(:not([disabled]):not([readonly])[checked]) .forge-switch .container:active .handle::before{scale:var(--_switch-handle-active-on-scale);box-shadow:var(--_switch-handle-active-on-elevation);background-color:var(--_switch-handle-active-on-color)}:host(:not([disabled]):not([readonly])[checked]) .forge-switch .container:active .handle .icon{scale:var(--_switch-icon-active-on-scale);color:var(--_switch-icon-active-on-color);fill:var(--_switch-icon-active-on-color)}:host([dense]) .forge-switch{--_switch-current-state-layer-width:var(--_switch-state-layer-dense-width);--_switch-current-state-layer-height:var(--_switch-state-layer-dense-height)}:host([disabled]) .forge-switch .container{opacity:var(--_switch-disabled-opacity);cursor:not-allowed}:host([disabled]) .forge-switch .handle::before{box-shadow:none}:host([readonly]) .forge-switch .container{cursor:not-allowed}@media (prefers-reduced-motion){.switch{--_switch-animation-duration:var(--forge-switch-animation-duration, 0s)}}forge-state-layer{--forge-state-layer-color:var(--_switch-state-layer-off-color)}forge-focus-indicator{--forge-focus-indicator-shape:var(--_switch-track-shape);--forge-focus-indicator-outward-offset:0px}';
+const styles = ':host{display:inline-block;outline:0;-webkit-tap-highlight-color:transparent}:host([hidden]){display:none}.forge-switch{--_switch-handle-size:var(--forge-switch-handle-size, 20px);--_switch-handle-scale:var(--forge-switch-handle-scale, 1);--_switch-handle-elevation:var(--forge-switch-handle-elevation, 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));--_switch-track-border-width:var(--forge-switch-track-border-width, 0);--_switch-track-border-color:var(--forge-switch-track-border-color, transparent);--_switch-icon-color:var(--forge-switch-icon-color, var(--forge-theme-on-tertiary, #ffffff));--_switch-icon-size:var(--forge-switch-icon-size, 16px);--_switch-icon-scale:var(--forge-switch-icon-scale, 1);--_switch-state-layer-size:var(--forge-switch-state-layer-size, 40px);--_switch-state-layer-dense-size:var(--forge-switch-state-layer-dense-size, 28px);--_switch-handle-on-color:var(--forge-switch-handle-on-color, var(--forge-theme-tertiary, #3d5afe));--_switch-handle-off-color:var(--forge-switch-handle-off-color, var(--forge-theme-surface-container-high, #9e9e9e));--_switch-handle-width:var(--forge-switch-handle-width, var(--_switch-handle-size));--_switch-handle-height:var(--forge-switch-handle-height, var(--_switch-handle-size));--_switch-handle-on-scale:var(--forge-switch-handle-on-scale, var(--_switch-handle-scale));--_switch-handle-off-scale:var(--forge-switch-handle-off-scale, var(--_switch-handle-scale));--_switch-handle-shape:var(--forge-switch-handle-shape, calc(var(--forge-shape-round, 50%) * var(--forge-shape-factor, 1)));--_switch-handle-on-elevation:var(--forge-switch-handle-on-elevation, var(--_switch-handle-elevation));--_switch-handle-off-elevation:var(--forge-switch-handle-off-elevation, var(--_switch-handle-elevation));--_switch-track-on-color:var(--forge-switch-track-on-color, var(--forge-theme-tertiary-container, #d0d7ff));--_switch-track-off-color:var(--forge-switch-track-off-color, var(--forge-theme-surface-container, #e0e0e0));--_switch-track-width:var(--forge-switch-track-width, 36px);--_switch-track-height:var(--forge-switch-track-height, 14px);--_switch-track-shape:var(--forge-switch-track-shape, calc(var(--forge-shape-full, 9999px) * var(--forge-shape-factor, 1)));--_switch-track-on-border-width:var(--forge-switch-track-on-border-width, var(--_switch-track-border-width));--_switch-track-off-border-width:var(--forge-switch-track-off-border-width, var(--_switch-track-border-width));--_switch-track-on-border-color:var(--forge-switch-track-on-border-color, var(--_switch-track-border-color));--_switch-track-off-border-color:var(--forge-switch-track-off-border-color, var(--_switch-track-border-color));--_switch-icon-on-color:var(--forge-switch-icon-on-color, var(--_switch-icon-color));--_switch-icon-off-color:var(--forge-switch-icon-off-color, var(--_switch-icon-color));--_switch-icon-on-size:var(--forge-switch-icon-on-size, var(--_switch-icon-size));--_switch-icon-off-size:var(--forge-switch-icon-off-size, var(--_switch-icon-size));--_switch-icon-on-scale:var(--forge-switch-icon-on-scale, var(--_switch-icon-scale));--_switch-icon-off-scale:var(--forge-switch-icon-off-scale, var(--_switch-icon-scale));--_switch-gap:var(--forge-switch-gap, 0);--_switch-justify:var(--forge-switch-justify, start);--_switch-align:var(--forge-switch-align, center);--_switch-direction:var(--forge-switch-direction, initial);--_switch-state-layer-width:var(--forge-switch-state-layer-width, var(--_switch-state-layer-size));--_switch-state-layer-height:var(--forge-switch-state-layer-height, var(--_switch-state-layer-size));--_switch-state-layer-on-color:var(--forge-switch-state-layer-on-color, var(--_switch-handle-on-color));--_switch-state-layer-off-color:var(--forge-switch-state-layer-off-color, var(--_switch-color));--_switch-state-layer-dense-width:var(--forge-switch-state-layer-dense-width, var(--_switch-state-layer-dense-size));--_switch-state-layer-dense-height:var(--forge-switch-state-layer-dense-height, var(--_switch-state-layer-dense-size));--_switch-disabled-opacity:var(--forge-switch-disabled-opacity, 0.54);--_switch-handle-active-on-color:var(--forge-switch-handle-active-on-color, var(--_switch-handle-on-color));--_switch-handle-active-off-color:var(--forge-switch-handle-active-off-color, var(--_switch-handle-off-color));--_switch-handle-active-scale:var(--forge-switch-handle-active-scale, 1.2);--_switch-handle-active-on-scale:var(--forge-switch-handle-active-on-scale, var(--_switch-handle-active-scale));--_switch-handle-active-off-scale:var(--forge-switch-handle-active-off-scale, var(--_switch-handle-active-scale));--_switch-handle-active-elevation:var(--forge-switch-handle-active-elevation, var(--_switch-handle-elevation));--_switch-handle-active-on-elevation:var(--forge-switch-handle-active-on-elevation, var(--_switch-handle-active-elevation));--_switch-handle-active-off-elevation:var(--forge-switch-handle-active-off-elevation, var(--_switch-handle-active-elevation));--_switch-track-active-on-color:var(--forge-switch-track-active-on-color, var(--_switch-track-on-color));--_switch-track-active-off-color:var(--forge-switch-track-active-off-color, var(--_switch-track-off-color));--_switch-track-active-on-border-width:var(--forge-switch-track-active-on-border-width, var(--_switch-track-on-border-width));--_switch-track-active-off-border-width:var(--forge-switch-track-active-off-border-width, var(--_switch-track-off-border-width));--_switch-track-active-on-border-color:var(--forge-switch-track-active-on-border-color, var(--_switch-track-on-border-color));--_switch-track-active-off-border-color:var(--forge-switch-track-active-off-border-color, var(--_switch-track-off-border-color));--_switch-icon-active-on-color:var(--forge-switch-icon-active-on-color, var(--_switch-icon-on-color));--_switch-icon-active-off-color:var(--forge-switch-icon-active-off-color, var(--_switch-icon-off-color));--_switch-icon-active-on-scale:var(--forge-switch-icon-active-on-scale, var(--_switch-icon-on-scale));--_switch-icon-active-off-scale:var(--forge-switch-icon-active-off-scale, var(--_switch-icon-off-scale));--_switch-animation-duration:var(--forge-switch-animation-duration, var(--forge-animation-duration-short2, 100ms));--_switch-animation-timing:var(--forge-switch-animation-timing, var(--forge-animation-easing-standard, cubic-bezier(0.2, 0, 0, 1)));--_switch-active-animation-timing:var(--forge-switch-active-animation-timing, var(--forge-animation-easing-linear, cubic-bezier(0, 0, 1, 1)))}.forge-switch{display:flex;position:relative;flex-direction:var(--_switch-direction);align-items:var(--_switch-align);justify-content:var(--_switch-justify);gap:var(--_switch-gap);--_switch-current-state-layer-width:var(--_switch-state-layer-width);--_switch-current-state-layer-height:var(--_switch-state-layer-height)}.forge-switch .container{position:relative;align-items:center;display:flex;flex-shrink:0;block-size:max(var(--_switch-handle-height),var(--_switch-track-height),var(--_switch-current-state-layer-height));cursor:pointer}.forge-switch .input{position:absolute;z-index:1;appearance:none;outline:0;margin:0;inline-size:100%;block-size:100%;cursor:unset}.forge-switch .track{transition-property:background-color,border-color,border-width;transition-duration:var(--_switch-animation-duration);transition-timing-function:var(--_switch-animation-timing);box-sizing:border-box;margin-inline:calc(max(var(--_switch-handle-width),var(--_switch-current-state-layer-width))/ 2 - calc(var(--_switch-track-height)/ 2));border-width:var(--_switch-track-off-border-width);border-color:var(--_switch-track-off-border-color);border-style:solid;border-radius:var(--_switch-track-shape);inline-size:var(--_switch-track-width);block-size:var(--_switch-track-height);background-color:var(--_switch-track-off-color)}.forge-switch .handle{position:absolute;justify-content:center;align-items:center;display:flex;transition-property:translate;transition-duration:var(--_switch-animation-duration);transition-timing-function:var(--_switch-animation-timing);border-radius:var(--_switch-handle-shape);inline-size:var(--_switch-current-state-layer-width);block-size:var(--_switch-current-state-layer-height)}.forge-switch .handle::before{content:\"\";position:relative;display:block;scale:var(--_switch-handle-off-scale);transition:background-color var(--_switch-animation-duration) var(--_switch-animation-timing),box-shadow var(--_switch-animation-duration) var(--_switch-animation-timing),scale var(--_switch-animation-duration) var(--_switch-active-animation-timing);box-shadow:var(--_switch-handle-off-elevation);border-radius:var(--_switch-handle-shape);inline-size:var(--_switch-handle-width);block-size:var(--_switch-handle-height);background-color:var(--_switch-handle-off-color)}.forge-switch .icon{position:absolute;align-items:center;justify-content:center;display:flex;transition-property:opacity,scale;transition-duration:var(--_switch-animation-duration);transition-timing-function:var(--_switch-animation-timing);inline-size:var(--_switch-icon-off-size);block-size:var(--_switch-icon-off-size);color:var(--_switch-icon-off-color);fill:var(--_switch-icon-off-color);font-size:var(--_switch-icon-off-size);--forge-icon-font-size:var(--_switch-icon-off-size)}.forge-switch .icon__on{--forge-icon-font-size:var(--_switch-icon-on-size);inline-size:var(--_switch-icon-on-size);block-size:var(--_switch-icon-on-size);color:var(--_switch-icon-on-color);fill:var(--_switch-icon-on-color);font-size:var(--_switch-icon-on-size);opacity:0;scale:0.4}.forge-switch .icon__off{opacity:1;scale:var(--_switch-icon-off-scale)}.forge-switch .label{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:var(--forge-typography-label2-font-family, var(--forge-typography-font-family, \"Roboto\", sans-serif));font-size:var(--forge-typography-label2-font-size, calc(var(--forge-typography-font-size, 1rem) * var(--forge-typography-label-font-size-scale, .8125)));font-weight:var(--forge-typography-label2-font-weight,400);line-height:var(--forge-typography-label2-line-height, calc(var(--forge-typography-font-size, 1rem) * var(--forge-typography-label-line-height-scale, 1.25)));letter-spacing:var(--forge-typography-label2-letter-spacing, .0096153846em);text-transform:var(--forge-typography-label2-text-transform,inherit);text-decoration:var(--forge-typography-label2-text-decoration,inherit)}.forge-switch .label:empty{display:none}.forge-switch .hidden{display:none}.forge-switch ::slotted([slot=input]){position:absolute;z-index:1;appearance:none;outline:0;margin:0;inline-size:100%;block-size:100%;cursor:unset}:host([checked]) .track{border-width:var(--_switch-track-on-border-width);border-color:var(--_switch-track-on-border-color);background-color:var(--_switch-track-on-color)}:host([checked]) .handle{translate:calc(var(--_switch-track-width) - calc(var(--_switch-track-height)/ 2) * 2)}:host([checked]) .handle::before{scale:var(--_switch-handle-on-scale);box-shadow:var(--_switch-handle-on-elevation);background-color:var(--_switch-handle-on-color)}:host([checked]) .handle .icon__on{opacity:1;scale:var(--_switch-icon-on-scale)}:host([checked]) .handle .icon__off{opacity:0;scale:0.4}:host([checked]) forge-state-layer{--forge-state-layer-color:var(--_switch-state-layer-on-color)}:host(:not([disabled]):not([readonly])) .forge-switch .container:active .track{border-width:var(--_switch-track-active-off-border-width);border-color:var(--_switch-track-active-off-border-color);background-color:var(--_switch-track-active-off-color)}:host(:not([disabled]):not([readonly])) .forge-switch .container:active .handle::before{scale:var(--_switch-handle-active-off-scale);box-shadow:var(--_switch-handle-active-off-elevation);background-color:var(--_switch-handle-active-off-color)}:host(:not([disabled]):not([readonly])) .forge-switch .container:active .handle .icon{scale:var(--_switch-icon-active-off-scale);color:var(--_switch-icon-active-off-color);fill:var(--_switch-icon-active-off-color)}:host(:not([disabled]):not([readonly])[checked]) .forge-switch .container:active .track{border-width:var(--_switch-track-active-on-border-width);border-color:var(--_switch-track-active-on-border-color);background-color:var(--_switch-track-active-on-color)}:host(:not([disabled]):not([readonly])[checked]) .forge-switch .container:active .handle::before{scale:var(--_switch-handle-active-on-scale);box-shadow:var(--_switch-handle-active-on-elevation);background-color:var(--_switch-handle-active-on-color)}:host(:not([disabled]):not([readonly])[checked]) .forge-switch .container:active .handle .icon{scale:var(--_switch-icon-active-on-scale);color:var(--_switch-icon-active-on-color);fill:var(--_switch-icon-active-on-color)}:host([dense]) .forge-switch{--_switch-current-state-layer-width:var(--_switch-state-layer-dense-width);--_switch-current-state-layer-height:var(--_switch-state-layer-dense-height)}:host([disabled]) .forge-switch .container{opacity:var(--_switch-disabled-opacity);cursor:not-allowed}:host([disabled]) .forge-switch .handle::before{box-shadow:none}:host([readonly]) .forge-switch .container{cursor:not-allowed}@media (prefers-reduced-motion){.switch{--_switch-animation-duration:var(--forge-switch-animation-duration, 0s)}}forge-state-layer{--forge-state-layer-color:var(--_switch-state-layer-off-color)}forge-focus-indicator{--forge-focus-indicator-shape:var(--_switch-track-shape);--forge-focus-indicator-outward-offset:0px}';
 /**
  * @tag forge-switch
  *

package/esm/table/table-core.js

@@ -532,8 +532,6 @@ export class TableCore {
         this._adapter.setSelectedRows(this._adapter.getTableElement(), this._selectKey, this._data, this._selectionManager.getItems(), preserveExisting);
         if (isAllSelected !== this._isAllSelected || this._isIndeterminate(isAllSelected)) {
             this._isAllSelected = isAllSelected;
-            // (derek.moss): while writting test it seemed like this could never be false.
-            // maybe an unneeded check
             if (this._multiselect) {
                 this._adapter.updateSelectAllState(this._adapter.getTableElement(), this._isAllSelected, this._isIndeterminate(this._isAllSelected));
             }
@@ -575,6 +573,15 @@ export class TableCore {
      * Handles a row being selected/deselected.
      */
     _onRowSelected(evt) {
+        // We handle row selection manually with either a pointerdown or keydown event (space key), so we listen
+        // for the change event as well to prevent checking the checkbox being checked by the time the event reaches us
+        if (evt.type === 'change') {
+            evt.preventDefault();
+            return;
+        }
+        if (evt.type === 'keydown' && evt.key !== ' ') {
+            return;
+        }
         const rowSelectedInfo = this._getSelectedRowFromEvent(evt);
         // Deselect the previously selected row(s) when not in multiselect mode (only if it's different than the newly selected row)
         if (!this._multiselect) {
@@ -605,6 +612,7 @@ export class TableCore {
         if (this._multiselect) {
             const shift = evt.shiftKey;
             if (shift && this._previouslyClickedRow) {
+                document.getSelection()?.removeAllRanges();
                 selectionIndexes = this._shiftSelectRows(rowSelectedInfo);
                 if (selectionIndexes.includes(this._previouslyClickedRow.index)) {
                     const idx = selectionIndexes.indexOf(this._previouslyClickedRow.index);

package/esm/table/table-utils.js

@@ -500,19 +500,23 @@ export class TableUtils {
         const nonExpandedRows = TableUtils._getNonExpandedRows(tbodyElement.rows);
         nonExpandedRows.forEach(row => TableUtils._attachRowSelectListener(row, clickListener));
     }
-    static _attachRowSelectListener(row, clickListener) {
+    static _attachRowSelectListener(row, listener) {
         const checkboxElement = TableUtils._getCheckboxElement(row);
-        checkboxElement?.addEventListener('click', clickListener);
+        checkboxElement?.addEventListener('change', listener);
+        checkboxElement?.addEventListener('keydown', listener);
+        checkboxElement?.addEventListener('pointerdown', listener);
     }
     /**
      * Removes the select listeners from every table row.
      * @param tbodyElement The table body element.
      * @param listener The click listener.
      */
-    static _detachRowSelectListeners(tbodyElement, clickListener) {
+    static _detachRowSelectListeners(tbodyElement, listener) {
         Array.from(tbodyElement.rows).forEach(row => {
             const checkboxElement = TableUtils._getCheckboxElement(row);
-            checkboxElement?.removeEventListener('click', clickListener);
+            checkboxElement?.removeEventListener('change', listener);
+            checkboxElement?.removeEventListener('keydown', listener);
+            checkboxElement?.removeEventListener('pointerdown', listener);
         });
     }
     /**

package/esm/tabs/tab-bar/tab-bar-core.js

@@ -49,6 +49,9 @@ export class TabBarCore {
     async _onTabsChanged() {
         this._tabs = this._adapter.getTabs();
         this._syncTabState();
+        if (this._scrollButtons) {
+            this._detectScrollableStatus();
+        }
         this._tryScrollActiveTabIntoView();
     }
     _onTabSelected(evt) {

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

@@ -47,6 +47,7 @@ declare global {
  * @csspart support-text - The support text element.
  * @csspart support-text - The element containing the support text slot.
  * @csspart support-text-end - The element containing the support text end slot.
+ * @csspart outline - The element containing the forge-focus-indicator element.
  * @csspart focus-indicator - The focus indicator element.
  *
  * @slot - The default/unnamed slot for the field's input.

package/esm/text-field/text-field.js

@@ -46,6 +46,7 @@ const styles = ':host{display:block}:host([hidden]){display:none}forge-field{dis
  * @csspart support-text - The support text element.
  * @csspart support-text - The element containing the support text slot.
  * @csspart support-text-end - The element containing the support text end slot.
+ * @csspart outline - The element containing the forge-focus-indicator element.
  * @csspart focus-indicator - The focus indicator element.
  *
  * @slot - The default/unnamed slot for the field's input.

package/esm/time-picker/time-picker-adapter.js

@@ -85,7 +85,6 @@ export class TimePickerAdapter extends BaseAdapter {
             iconButtonElement.density = 'medium';
             iconButtonElement.type = 'button';
             iconButtonElement.tabIndex = -1;
-            iconButtonElement.style.marginRight = '4px'; // Override default trailing slot margin in text-field
             iconButtonElement.setAttribute('aria-label', 'Toggle time dropdown');
             const iconElement = document.createElement(ICON_CONSTANTS.elementName);
             iconElement.name = 'clock_outline';

package/esm/time-picker/time-picker-constants.d.ts

@@ -4,7 +4,7 @@
  * License: Apache-2.0
  */
 import { IListDropdownOption } from '../list-dropdown/list-dropdown-constants';
-import IMask, { Masked, InputMask } from 'imask';
+import { Masked, InputMask, type FactoryArg, type AppendFlags } from 'imask';
 export declare const TIME_PICKER_CONSTANTS: {
     elementName: "forge-time-picker";
     attributes: {
@@ -48,7 +48,7 @@ export type TimePickerParseCallback = (time: string) => number | null;
 export type TimePickerFormatCallback = (value: number | null) => string;
 export type TimePickerCustomOptionCallback<T> = (value: T, use24HourTime: boolean, allowSeconds: boolean) => number;
 export type TimePickerCoercionCallback = (rawValue: string, coercedValue: string, allowSeconds: boolean) => string;
-export type TimePickerPrepareMaskCallback = (value: string, masked: Masked<string>, flags: IMask.AppendFlags, maskInstance: InputMask<IMask.AnyMaskedOptions>) => string;
+export type TimePickerPrepareMaskCallback = (value: string, masked: Masked<string>, flags: AppendFlags, maskInstance: InputMask<FactoryArg>) => string;
 export interface ITimePickerOption<T = any> extends IListDropdownOption<T> {
     toMilliseconds: TimePickerCustomOptionCallback<T>;
 }

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

@@ -34,7 +34,7 @@ export declare const TOAST_CONSTANTS: {
         CLOSE_BUTTON: string;
     };
     defaults: {
-        PLACEMENT: import("@floating-ui/utils").Placement;
+        PLACEMENT: ToastPlacement;
         DURATION: number;
         THEME: ToastTheme;
     };

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

@@ -45,7 +45,7 @@ export declare const TOOLTIP_CONSTANTS: {
         OFFSET: number;
         FLIP: OverlayFlipState;
         TYPE: TooltipType;
-        PLACEMENT: import("@floating-ui/utils").Placement;
+        PLACEMENT: TooltipPlacement;
         TRIGGER_TYPES: TooltipTriggerType[];
     };
     selectors: {

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@tylertech/forge",
   "description": "Tyler Forge™ Web Components library",
-  "version": "3.6.4",
+  "version": "3.8.0-dev.0",
   "author": "Tyler Technologies, Inc.",
   "license": "Apache-2.0",
   "repository": {
@@ -13,12 +13,12 @@
   "typings": "esm/index.d.ts",
   "sideEffects": false,
   "dependencies": {
-    "@floating-ui/dom": "^1.6.12",
+    "@floating-ui/dom": "^1.6.13",
     "@tylertech/forge-core": "^3.1.0",
     "@tylertech/tyler-icons": "^1.12.0",
-    "imask": "^6.6.1",
+    "imask": "^7.6.1",
     "lit": "^3.2.1",
     "tslib": "^2.8.1"
   },
   "customElements": "custom-elements.json"
-}
+}

package/sass/badge/badge.scss

@@ -46,7 +46,7 @@
 // Hide
 //
 
-:host([hide]) {
+:host(:where([hide], :state(hidden))) {
   .forge-badge {
     @include hide;
   }
@@ -56,12 +56,12 @@
 // Dot
 //
 
-:host([dot]) {
+:host(:where([dot], :state(dot))) {
   .forge-badge {
     @include dot;
   }
 
-  .forge-badge > slot {
+  .content > slot {
     display: none;
   }
 }
@@ -79,7 +79,7 @@
     }
   }
 
-  :host([strong][theme='#{$theme}']) {
+  :host(:where([strong], :state(strong))[theme='#{$theme}']) {
     .forge-badge {
       @include override(background, theme.variable($theme), value);
       @include override(color, theme.variable(on-#{$theme}), value);
@@ -88,13 +88,13 @@
 }
 
 // Map both "error" and "danger" for backwards compatibility with legacy "danger" theme
-:host(:not([strong]):is([theme='error'], [theme='danger'])) {
+:host(:not(:where([strong], :state(strong))):is([theme='error'], [theme='danger'])) {
   .forge-badge {
     @include override(background, theme.variable(error-container-low), value);
     @include override(color, theme.variable(error), value);
   }
 }
-:host([strong]:is([theme='error'], [theme='danger'])) {
+:host(:where([strong], :state(strong)):is([theme='error'], [theme='danger'])) {
   .forge-badge {
     @include override(background, theme.variable(error), value);
     @include override(color, theme.variable(on-error), value);
@@ -102,13 +102,13 @@
 }
 
 // Map both "info" and "info-primary" for backwards compatibility with "info" theme
-:host(:not([strong]):is([theme='info'], [theme='info-primary'])) {
+:host(:not(:where([strong], :state(strong))):is([theme='info'], [theme='info-primary'])) {
   .forge-badge {
     @include override(background, theme.variable(info-container), value);
     @include override(color, theme.variable(on-info-container), value);
   }
 }
-:host([strong]:is([theme='info'], [theme='info-primary'])) {
+:host(:where([strong], :state(strong)):is([theme='info'], [theme='info-primary'])) {
   .forge-badge {
     @include override(background, theme.variable(info), value);
     @include override(color, theme.variable(on-info), value);
@@ -116,13 +116,13 @@
 }
 
 // Support "info-secondary" separately since it is not a core theme
-:host(:not([strong])[theme='info-secondary']) {
+:host(:not(:where([strong], :state(strong)))[theme='info-secondary']) {
   .forge-badge {
     @include override(background, theme.variable(surface-container-low), value);
     @include override(color, theme.variable(on-surface-container-low), value);
   }
 }
-:host([strong][theme='info-secondary']) {
+:host(:where([strong], :state(strong))[theme='info-secondary']) {
   .forge-badge {
     @include override(background, theme.variable(surface-inverse), value);
     @include override(color, theme.variable(on-surface-inverse), value);

package/sass/button/_core.scss

@@ -21,6 +21,7 @@
 
   position: relative;
   display: #{token(display)};
+  grid-auto-flow: column;
   align-items: center;
   justify-content: #{token(justify)};
   gap: #{token(spacing)};

package/sass/calendar/_variables.scss

@@ -10,8 +10,9 @@ $row-gap: 2px;
 $date-gap: 2px;
 $today-border-width: 1px;
 $event-dot-size: 12px;
-$theme-base-strings: primary, secondary, blue, light-green, cyan, teal, orange, blue-grey, grey, red, pink, purple, light-blue, deep-purple, green, lime, yellow,
-  brown, deep-orange;
+$theme-base-strings:
+  primary, secondary, blue, light-green, cyan, teal, orange, blue-grey, grey, red, pink, purple, light-blue, deep-purple, green, lime, yellow, brown,
+  deep-orange;
 $theme-values: (
   // primary theme
   event-primary-background: material-color-palette.$indigo-100,

package/sass/card/card.scss

@@ -33,7 +33,7 @@
 // Raised
 //
 
-:host([raised]) {
+:host(:where([raised], :state(raised))) {
   .forge-card {
     @include raised;
   }

package/sass/core/styles/tokens/button/_tokens.scss

@@ -19,7 +19,7 @@ $tokens: (
   text-color: utils.module-ref(button, text-color, primary-color),
   disabled-color: utils.module-val(button, disabled-color, theme.variable(surface-container)),
   padding: utils.module-val(button, padding, spacing.variable(medium)),
-  display: utils.module-val(button, display, inline-flex),
+  display: utils.module-val(button, display, inline-grid),
   justify: utils.module-val(button, justify, center),
   shape: utils.module-val(button, shape, shape.variable(medium)),
   // Base
@@ -33,7 +33,7 @@ $tokens: (
   shape-start-end-radius: utils.module-ref(button, shape-start-end-radius, shape),
   shape-end-start-radius: utils.module-ref(button, shape-end-start-radius, shape),
   shape-end-end-radius: utils.module-ref(button, shape-end-end-radius, shape),
-  padding-block: utils.module-ref(button, padding-block, padding),
+  padding-block: utils.module-ref(button, padding-block, 0),
   padding-inline: utils.module-ref(button, padding-inline, padding),
   background: utils.module-val(button, background, transparent),
   hover-background: utils.module-ref(button, hover-background, background),

package/sass/core/styles/tokens/slider/_tokens.scss

@@ -37,10 +37,16 @@ $tokens: (
   with-overlap-handle-outline-width: utils.module-val(slider, with-overlap-handle-outline-width, 1px),
   with-tick-marks-active-container-color: utils.module-val(slider, with-tick-marks-active-container-color, theme.variable(on-primary)),
   with-tick-marks-container-size: utils.module-val(slider, with-tick-marks-container-size, 2px),
-  with-tick-marks-disabled-active-container-color:
-    utils.module-val(slider, with-tick-marks-disabled-active-container-color, theme.variable(on-surface-container-high)),
-  with-tick-marks-disabled-inactive-container-color:
-    utils.module-val(slider, with-tick-marks-disabled-inactive-container-color, theme.variable(on-surface-container-high)),
+  with-tick-marks-disabled-active-container-color: utils.module-val(
+      slider,
+      with-tick-marks-disabled-active-container-color,
+      theme.variable(on-surface-container-high)
+    ),
+  with-tick-marks-disabled-inactive-container-color: utils.module-val(
+      slider,
+      with-tick-marks-disabled-inactive-container-color,
+      theme.variable(on-surface-container-high)
+    ),
   with-tick-marks-inactive-container-color: utils.module-val(slider, with-tick-marks-inactive-container-color, theme.variable(primary))
 ) !default;
 

package/sass/core/styles/tokens/switch/_tokens.scss

@@ -63,7 +63,7 @@ $tokens: (
   state-layer-dense-width: utils.module-ref(switch, state-layer-dense-width, state-layer-dense-size),
   state-layer-dense-height: utils.module-ref(switch, state-layer-dense-height, state-layer-dense-size),
   // Disabled
-  disabled-opacity: utils.module-val(switch, disabled-opacity, theme.emphasis(medium-low)),
+  disabled-opacity: utils.module-val(switch, disabled-opacity, theme.emphasis(medium)),
   // Active
   handle-active-on-color: utils.module-ref(switch, handle-active-on-color, handle-on-color),
   handle-active-off-color: utils.module-ref(switch, handle-active-off-color, handle-off-color),

package/sass/dialog/dialog.scss

@@ -36,6 +36,14 @@ $can-animate: '[visible]:not([animation-type=none])';
     display: none;
   }
 
+  //
+  // Slotted
+  //
+
+  ::slotted(forge-scaffold) {
+    height: auto;
+  }
+
   //
   // Base
   //

package/sass/dialog/forge-dialog.scss

@@ -73,6 +73,10 @@
   transition-property: display, opacity, overlay, scale;
   transition-behavior: allow-discrete;
 
+  > forge-scaffold {
+    height: auto;
+  }
+
   &--fullscreen {
     @include core.fullscreen-dialog-base;
     @include core.fullscreen-surface;

package/sass/field/_core.scss

@@ -24,7 +24,7 @@
 
 @mixin base {
   /* Internal custom properties */
-  @include override(disableable-cursor, unset, value);
+  @include override(disableable-cursor, auto, value);
   @include override(disableable-opacity, 1, value);
   @include override(inner-border-block-size, 100%, value);
   @include override(inner-border-color, #{token(outline-color, custom)}, value);

package/sass/field/field.scss

@@ -241,7 +241,7 @@ $variants: (
 //
 
 :host([required]) {
-  .label::before {
+  .has-label .label::before {
     @include core.label-before;
   }
 }

package/sass/linear-progress/linear-progress.scss

@@ -35,9 +35,13 @@ $_host-tokens: [track-height];
   // State vars
   #{declare(track-dot-size)}: calc(#{token(track-height)} / 2);
   #{declare(track-background-width)}: calc(#{token(track-dot-size, custom)} * 5);
-  #{declare(track-background)}: 0 / #{token(track-background-width, custom)} 100% radial-gradient(circle at calc(#{token(track-dot-size, custom)} * 2), #{token(
-          track-color
-        )} 0, #{token(track-color)} #{token(track-dot-size, custom)}, transparent #{token(track-dot-size, custom)});
+  #{declare(track-background)}: 0 / #{token(track-background-width, custom)} 100%
+    radial-gradient(
+      circle at calc(#{token(track-dot-size, custom)} * 2),
+      #{token(track-color)} 0,
+      #{token(track-color)} #{token(track-dot-size, custom)},
+      transparent #{token(track-dot-size, custom)}
+    );
 }
 
 .forge-linear-progress {

package/sass/list/list-item/_core.scss

@@ -43,6 +43,7 @@
   padding-inline: 0;
   margin: 0;
   box-sizing: border-box;
+  width: 100%;
 
   background: transparent;
   color: inherit;
@@ -53,8 +54,15 @@
   text-align: inherit;
   letter-spacing: inherit;
   word-spacing: inherit;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+  overflow: hidden;
 
-  display: inline;
+  display: block;
+}
+
+@mixin button-wrap {
+  white-space: normal;
 }
 
 @mixin anchor {

package/sass/list/list-item/list-item.scss

@@ -157,7 +157,7 @@ slot[name='tertiary-text'] {
 }
 
 // Button slotted elements
-::slotted(:is(button, [role='button'][tabindex], [forge-list-item-button])) {
+::slotted(:is(button:not([slot]), [forge-list-item-button])) {
   @include button;
 }
 
@@ -216,6 +216,10 @@ slot[name='tertiary-text'] {
     @include text-container-wrap;
   }
 
+  ::slotted(:is(button, [role='button'][tabindex], [forge-list-item-button])) {
+    @include button-wrap;
+  }
+
   slot[name='secondary-text'],
   slot[name='tertiary-text'] {
     &::slotted(*) {

package/sass/popover/popover.scss

@@ -318,7 +318,6 @@ forge-overlay[clipped-y] {
   .forge-popover {
     height: auto;
     min-height: 0;
-    max-height: 100vh;
     overflow-y: auto;
   }
 }

package/sass/slider/_core.scss

@@ -45,9 +45,8 @@ $_active-track-end-clip: calc(#{$_active-track-end-offset} + #{$_active-track-ma
   // Clip the inputs to the space left/right of the center point between the
   // values so the right input gets pointer events.
   $_clip-to-start: calc(
-    #{token(state-layer-size)} / 2 + (100% - #{token(state-layer-size)}) * (#{token(start-fraction, custom)} + ((
-                #{token(end-fraction, custom)} - #{token(start-fraction, custom)}
-              ) / 2))
+    #{token(state-layer-size)} / 2 + (100% - #{token(state-layer-size)}) *
+      (#{token(start-fraction, custom)} + ((#{token(end-fraction, custom)} - #{token(start-fraction, custom)}) / 2))
   );
 
   $_clip-to-end: calc(100% - $_clip-to-start);