@tylertech/forge 3.10.5 → 3.11.0

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

@@ -15,6 +15,8 @@ export declare const SELECT_CONSTANTS: {
         PLACEHOLDER: string;
         OBSERVE_SCROLL: string;
         OBSERVE_SCROLL_THRESHOLD: string;
+        SHOW_SELECT_ALL: string;
+        SELECT_ALL_LABEL: string;
     };
     attributes: {
         OPEN: string;
@@ -26,6 +28,8 @@ export declare const SELECT_CONSTANTS: {
         PLACEHOLDER: string;
         OBSERVE_SCROLL: string;
         OBSERVE_SCROLL_THRESHOLD: string;
+        SHOW_SELECT_ALL: string;
+        SELECT_ALL_LABEL: string;
     };
     selectors: {
         FIELD: string;
@@ -34,6 +38,7 @@ export declare const SELECT_CONSTANTS: {
     };
     events: {
         SCROLLED_BOTTOM: string;
+        SELECT_ALL: string;
     };
 };
 export { type FieldDensity as SelectDensityType, type FieldShape as SelectShapeType } from '../../field/base/base-field-constants';

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

@@ -19,13 +19,16 @@ const observedAttributes = {
     DISABLED: 'disabled',
     PLACEHOLDER: 'placeholder',
     OBSERVE_SCROLL: 'observe-scroll',
-    OBSERVE_SCROLL_THRESHOLD: 'observe-scroll-threshold'
+    OBSERVE_SCROLL_THRESHOLD: 'observe-scroll-threshold',
+    SHOW_SELECT_ALL: 'show-select-all',
+    SELECT_ALL_LABEL: 'select-all-label'
 };
 const attributes = {
     ...observedAttributes
 };
 const events = {
-    SCROLLED_BOTTOM: `${elementName}-scrolled-bottom`
+    SCROLLED_BOTTOM: `${elementName}-scrolled-bottom`,
+    SELECT_ALL: `${elementName}-select-all`
 };
 export const SELECT_CONSTANTS = {
     elementName,

package/esm/select/select/select.d.ts

@@ -12,12 +12,14 @@ import { IWithElementInternals } from '../../core/mixins/internals/with-element-
 import { IWithLabelAwareness } from '../../core/mixins/label/with-label-aware';
 import { FieldDensity, FieldLabelPosition } from '../../field';
 import { IWithBaseField } from '../../field/base/with-base-field';
-import { BaseSelectComponent, IBaseSelectComponent } from '../core';
+import { BaseSelectComponent, IBaseSelectComponent, SelectSelectAllEventData } from '../core';
 import { SelectCore } from './select-core';
 import { IListDropdownAware } from '../../list-dropdown/list-dropdown-aware';
 export interface ISelectComponent extends IWithFormAssociation, IWithFocusable, IWithLabelAwareness, IWithElementInternals, IWithDefaultAria, IWithBaseField, IBaseSelectComponent, IListDropdownAware {
     label: string;
     placeholder: string;
+    showSelectAll: boolean;
+    selectAllLabel: string;
     setFormValue(value: FormValue | null, state?: FormValue | null | undefined): void;
     [setValidity](): void;
 }
@@ -27,15 +29,18 @@ declare global {
     }
     interface HTMLElementEventMap {
         'forge-select-scrolled-bottom': CustomEvent<void>;
+        'forge-select-all': CustomEvent<SelectSelectAllEventData>;
         change: CustomEvent<any>;
     }
 }
 declare const SelectComponent_base: import("../../constants").AbstractConstructor<import("../../core/mixins/form/with-form-associated").WithFormAssociationContract> & import("../../constants").AbstractConstructor<import("../../core/mixins/label/with-label-aware").WithLabelAwarenessContract> & import("../../constants").AbstractConstructor<import("../../core/mixins/focus/with-focusable").WithFocusableContract> & import("../../constants").AbstractConstructor<import("../../core/mixins/internals/with-default-aria").WithDefaultAriaContract> & import("../../constants").AbstractConstructor<import("../../core/mixins/internals/with-element-internals").WithElementInternalsContract> & import("../../constants").AbstractConstructor<import("../../field/base/with-base-field").WithBaseFieldContract> & ((abstract new () => BaseSelectComponent<SelectCore>) & {
-    readonly observedAttributes: string[];
+    get observedAttributes(): string[];
 });
 /**
  * @tag forge-select
  *
+ * @summary Selects present a list of options to users for single or multi-selection.
+ *
  * @dependency forge-field
  * @dependency forge-option
  * @dependency forge-option-group
@@ -53,9 +58,12 @@ declare const SelectComponent_base: import("../../constants").AbstractConstructo
  *
  * @event {CustomEvent<void>} forge-select-scrolled-bottom - Dispatched when the dropdown list has scrolled to the bottom.
  * @event {CustomEvent<any>} change - Dispatched when the user selects a value.
+ * @event {CustomEvent<SelectSelectAllEventData>} forge-select-all - Dispatched when the select all option is toggled.
  *
  * @property {string} label - Controls the label text.
  * @property {string} placeholder - Controls the placeholder text.
+ * @property {boolean} showSelectAll - Gets/sets whether to show the select all option when in multiple mode.
+ * @property {string} selectAllLabel - Gets/sets the label for the select all option.
  * @property {any} value - Gets/sets the value.
  * @property {number | number[]} selectedIndex - Gets/sets the selected index.
  * @property {ISelectOption[] | ISelectOptionGroup[]} options - Gets/sets the available options.
@@ -81,6 +89,8 @@ declare const SelectComponent_base: import("../../constants").AbstractConstructo
  *
  * @attribute {string} label - Controls the label text.
  * @attribute {string} placeholder - Controls the placeholder text.
+ * @attribute {boolean} show-select-all - Gets/sets whether to show the select all option when in multiple mode.
+ * @attribute {string} select-all-label - Gets/sets the label for the select all option.
  * @attribute {any} value - Gets/sets the value.
  * @attribute {number | number[]} selected-index - Gets/sets the selected index.
  * @attribute {boolean} multiple - Gets/sets the multiple select state.
@@ -174,6 +184,8 @@ export declare class SelectComponent extends SelectComponent_base implements ISe
     label: string;
     placeholder: string;
     readonly: boolean;
+    showSelectAll: boolean;
+    selectAllLabel: string;
     get floatLabel(): boolean;
     set floatLabel(value: boolean);
     get density(): FieldDensity;

package/esm/select/select/select.js

@@ -28,11 +28,14 @@ import { SelectAdapter } from './select-adapter';
 import { SELECT_CONSTANTS } from './select-constants';
 import { SelectCore } from './select-core';
 import { ListDropdownAware } from '../../list-dropdown/list-dropdown-aware';
+import { DividerComponent } from '../../divider/divider';
 const template = '<template><forge-field id=\"field\" popover-icon focus-indicator-allow-focus focus-indicator-focus-mode=\"focus\"><span id=\"select-label\" slot=\"label\"></span><slot slot=\"start\" name=\"start\"></slot><div data-forge-field-input class=\"selected-text-container\" part=\"text-container\" aria-live=\"assertive\" aria-atomic=\"true\"><slot name=\"value\"><span id=\"selected-text\" class=\"selected-text\" part=\"text\"></span></slot></div><slot slot=\"end\" name=\"end\"></slot><slot slot=\"accessory\" name=\"accessory\"></slot><slot slot=\"support-text\" name=\"support-text\"></slot><slot slot=\"support-text-end\" name=\"support-text-end\"></slot><slot slot=\"start\" name=\"leading\"></slot><slot slot=\"end\" name=\"trailing\"></slot><slot slot=\"accessory\" name=\"addon-end\"></slot><slot slot=\"support-text\" name=\"helper-text\"></slot></forge-field></template>';
 const styles = ':host{display:block;outline:0}:host([hidden]){display:none}forge-field{--_select-placeholder-color:var(--forge-select-placeholder-color, var(--forge-field-placeholder-color, var(--forge-theme-text-medium, rgba(0, 0, 0, 0.6))))}.selected-text-container{display:grid;align-items:center;cursor:pointer}.selected-text,::slotted([slot=value]){white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.selected-text:empty::before{content:attr(placeholder);color:var(--_select-placeholder-color);font-size:inherit}:host([disabled]) .selected-text-container{cursor:not-allowed}forge-field{display:contents}';
 /**
  * @tag forge-select
  *
+ * @summary Selects present a list of options to users for single or multi-selection.
+ *
  * @dependency forge-field
  * @dependency forge-option
  * @dependency forge-option-group
@@ -50,9 +53,12 @@ const styles = ':host{display:block;outline:0}:host([hidden]){display:none}forge
  *
  * @event {CustomEvent<void>} forge-select-scrolled-bottom - Dispatched when the dropdown list has scrolled to the bottom.
  * @event {CustomEvent<any>} change - Dispatched when the user selects a value.
+ * @event {CustomEvent<SelectSelectAllEventData>} forge-select-all - Dispatched when the select all option is toggled.
  *
  * @property {string} label - Controls the label text.
  * @property {string} placeholder - Controls the placeholder text.
+ * @property {boolean} showSelectAll - Gets/sets whether to show the select all option when in multiple mode.
+ * @property {string} selectAllLabel - Gets/sets the label for the select all option.
  * @property {any} value - Gets/sets the value.
  * @property {number | number[]} selectedIndex - Gets/sets the selected index.
  * @property {ISelectOption[] | ISelectOptionGroup[]} options - Gets/sets the available options.
@@ -78,6 +84,8 @@ const styles = ':host{display:block;outline:0}:host([hidden]){display:none}forge
  *
  * @attribute {string} label - Controls the label text.
  * @attribute {string} placeholder - Controls the placeholder text.
+ * @attribute {boolean} show-select-all - Gets/sets whether to show the select all option when in multiple mode.
+ * @attribute {string} select-all-label - Gets/sets the label for the select all option.
  * @attribute {any} value - Gets/sets the value.
  * @attribute {number | number[]} selected-index - Gets/sets the selected index.
  * @attribute {boolean} multiple - Gets/sets the multiple select state.
@@ -194,6 +202,12 @@ let SelectComponent = class SelectComponent extends WithFormAssociation(WithLabe
             case SELECT_CONSTANTS.observedAttributes.PLACEHOLDER:
                 this.placeholder = newValue;
                 return;
+            case SELECT_CONSTANTS.observedAttributes.SHOW_SELECT_ALL:
+                this.showSelectAll = coerceBoolean(newValue);
+                return;
+            case SELECT_CONSTANTS.observedAttributes.SELECT_ALL_LABEL:
+                this.selectAllLabel = newValue;
+                return;
         }
         super.attributeChangedCallback(name, oldValue, newValue);
     }
@@ -274,6 +288,12 @@ __decorate([
 __decorate([
     coreProperty()
 ], SelectComponent.prototype, "readonly", void 0);
+__decorate([
+    coreProperty()
+], SelectComponent.prototype, "showSelectAll", void 0);
+__decorate([
+    coreProperty()
+], SelectComponent.prototype, "selectAllLabel", void 0);
 SelectComponent = __decorate([
     customElement({
         name: SELECT_CONSTANTS.elementName,
@@ -288,7 +308,8 @@ SelectComponent = __decorate([
             IconComponent,
             ScaffoldComponent,
             ToolbarComponent,
-            IconButtonComponent
+            IconButtonComponent,
+            DividerComponent
         ]
     })
 ], SelectComponent);

package/esm/select/select-dropdown/select-dropdown.d.ts

@@ -20,6 +20,8 @@ declare global {
 }
 /**
  * @tag forge-select-dropdown
+ *
+ * @summary A dropdown variant of the select component that renders options in a popover.
  */
 export declare class SelectDropdownComponent extends BaseSelectComponent<SelectDropdownCore> implements ISelectDropdownComponent {
     static get observedAttributes(): string[];

package/esm/select/select-dropdown/select-dropdown.js

@@ -22,6 +22,8 @@ const template = '<template></template>';
 const styles = ':host{display:none}';
 /**
  * @tag forge-select-dropdown
+ *
+ * @summary A dropdown variant of the select component that renders options in a popover.
  */
 let SelectDropdownComponent = class SelectDropdownComponent extends BaseSelectComponent {
     static get observedAttributes() {

package/esm/split-button/split-button.js

@@ -11,7 +11,7 @@ import { SplitButtonAdapter } from './split-button-adapter';
 import { SPLIT_BUTTON_CONSTANTS } from './split-button-constants';
 import { SplitButtonCore } from './split-button-core';
 const template = '<template><slot></slot></template>';
-const styles = ':host{--_split-button-min-width:var(--forge-split-button-min-width, 0);--_split-button-gap:var(--forge-split-button-gap, var(--forge-border-thin, 1px));--_split-button-focus-indicator-offset:var(--forge-split-button-focus-indicator-offset, var(--forge-button-focus-indicator-offset, 4px));--_split-button-focus-indicator-divider-offset:var(--forge-split-button-focus-indicator-divider-offset, var(--_split-button-gap));--_split-button-focus-indicator-offset-adjusted:calc(var(--_split-button-focus-indicator-offset) + var(--_split-button-focus-indicator-divider-offset) * 2)}:host{display:inline-flex;justify-content:center;align-items:center}:host([hidden]){display:none}::slotted(*){--forge-button-min-width:var(--_split-button-min-width);--forge-button-focus-indicator-offset:var(--_split-button-focus-indicator-offset)}::slotted(:first-child){--forge-button-shape-start-end-radius:0;--forge-button-shape-end-end-radius:0;--forge-focus-indicator-shape-start-end:0;--forge-focus-indicator-shape-end-end:0;--forge-focus-indicator-offset-inline:0 var(--_split-button-focus-indicator-offset-adjusted)}::slotted(:not(:first-child):not(:last-child)){--forge-button-shape:0;--forge-focus-indicator-shape:0;--forge-focus-indicator-offset-inline:var(--_split-button-focus-indicator-offset-adjusted)}::slotted(:last-child){--forge-button-shape-start-start-radius:0;--forge-button-shape-end-start-radius:0;--forge-focus-indicator-shape-start-start:0;--forge-focus-indicator-shape-end-start:0;--forge-focus-indicator-offset-inline:var(--_split-button-focus-indicator-offset-adjusted) 0}:host([variant=outlined]){--_split-button-focus-indicator-divider-offset:var(--forge-split-button-focus-indicator-divider-offset, 0px)}:host([variant=outlined]) ::slotted(:not(:first-child)){margin-inline-start:calc(-1 * var(--_split-button-gap))}:host(:is([variant=tonal],[variant=filled],[variant=raised],:not([variant]))) ::slotted(:not(:last-child)){margin-inline-end:var(--_split-button-gap)}';
+const styles = ':host{--_split-button-min-width:var(--forge-split-button-min-width, 0);--_split-button-gap:var(--forge-split-button-gap, var(--forge-border-thin, 1px));--_split-button-focus-indicator-offset:var(--forge-split-button-focus-indicator-offset, var(--forge-button-focus-indicator-offset, 4px));--_split-button-focus-indicator-divider-offset:var(--forge-split-button-focus-indicator-divider-offset, var(--_split-button-gap));--_split-button-focus-indicator-offset-adjusted:calc(var(--_split-button-focus-indicator-offset) + var(--_split-button-focus-indicator-divider-offset) * 2)}:host{display:inline-flex;justify-content:center;align-items:center}:host([hidden]){display:none}::slotted(*){--forge-button-min-width:var(--_split-button-min-width);--forge-button-focus-indicator-offset:var(--_split-button-focus-indicator-offset)}::slotted(:first-child){--forge-button-shape-start-end-radius:0;--forge-button-shape-end-end-radius:0;--forge-focus-indicator-shape-start-end:0;--forge-focus-indicator-shape-end-end:0;--forge-focus-indicator-offset-inline:0 var(--_split-button-focus-indicator-offset-adjusted)}::slotted(:not(:first-child):not(:last-child)){--forge-button-shape:0;--forge-focus-indicator-shape:0;--forge-focus-indicator-offset-inline:var(--_split-button-focus-indicator-offset-adjusted)}::slotted(:last-child){--forge-button-shape-start-start-radius:0;--forge-button-shape-end-start-radius:0;--forge-focus-indicator-shape-start-start:0;--forge-focus-indicator-shape-end-start:0;--forge-focus-indicator-offset-inline:var(--_split-button-focus-indicator-offset-adjusted) 0}:host([variant=outlined]) ::slotted(:not(:first-child)){margin-inline-start:calc(-1 * var(--_split-button-gap))}:host([variant=outlined]){--_split-button-focus-indicator-divider-offset:var(--forge-split-button-focus-indicator-divider-offset, 0px)}:host(:is([variant=tonal],[variant=filled],[variant=raised],:not([variant]))) ::slotted(:not(:last-child)){margin-inline-end:var(--_split-button-gap)}';
 /**
  * @tag forge-split-button
  *

package/esm/split-view/split-view/split-view.d.ts

@@ -21,6 +21,8 @@ declare global {
 }
 /**
  * @tag forge-split-view
+ *
+ * @summary Split views create resizable panels that allow users to adjust the space between content areas.
  */
 export declare class SplitViewComponent extends BaseComponent implements ISplitViewComponent {
     static get observedAttributes(): string[];

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

@@ -14,6 +14,8 @@ const template = '<template><div class=\"forge-split-view\" id=\"root\" part=\"r
 const styles = '.forge-split-view{display:flex;width:100%;height:100%}:host{--forge-split-view-handle-width:8px;display:block;height:100%;width:100%;overflow:hidden}:host([hidden]){display:none}:host([orientation=horizontal]) .forge-split-view{flex-direction:row}:host([orientation=vertical]) .forge-split-view{flex-direction:column}';
 /**
  * @tag forge-split-view
+ *
+ * @summary Split views create resizable panels that allow users to adjust the space between content areas.
  */
 let SplitViewComponent = class SplitViewComponent extends BaseComponent {
     static get observedAttributes() {

package/esm/split-view/split-view-panel/split-view-panel.d.ts

@@ -37,6 +37,8 @@ declare global {
 /**
  * @tag forge-split-view-panel
  *
+ * @summary Individual panels within split views that can be resized and collapsed.
+ *
  * @dependency forge-icon
  * @dependency forge-state-layer
  * @dependency forge-focus-indicator

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

@@ -14,10 +14,12 @@ import { IconComponent, IconRegistry } from '../../icon';
 import { StateLayerComponent } from '../../state-layer';
 import { FocusIndicatorComponent } from '../../focus-indicator';
 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:uhqbsid;animation-duration:var(--forge-animation-duration-medium2, 300ms);animation-timing-function:var(--forge-animation-easing-standard,cubic-bezier(0.2,0,0,1))}@keyframes uhqbsid{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:uhqbsj9;animation-duration:var(--forge-animation-duration-medium2, 300ms);animation-timing-function:var(--forge-animation-easing-standard,cubic-bezier(0.2,0,0,1))}@keyframes uhqbsj9{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:uhqbsjp;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 uhqbsjp{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:uhqbskm;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 uhqbskm{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:uhqbslj;animation-duration:var(--forge-animation-duration-medium2, 300ms);animation-timing-function:var(--forge-animation-easing-standard,cubic-bezier(0.2,0,0,1))}@keyframes uhqbslj{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:uhqbslt;animation-duration:var(--forge-animation-duration-medium2, 300ms);animation-timing-function:var(--forge-animation-easing-standard,cubic-bezier(0.2,0,0,1))}@keyframes uhqbslt{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:uhqbsm4;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 uhqbsm4{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:uhqbsmg;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 uhqbsmg{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:unrnngv;animation-duration:var(--forge-animation-duration-medium2, 300ms);animation-timing-function:var(--forge-animation-easing-standard,cubic-bezier(0.2,0,0,1))}@keyframes unrnngv{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:unrnnhr;animation-duration:var(--forge-animation-duration-medium2, 300ms);animation-timing-function:var(--forge-animation-easing-standard,cubic-bezier(0.2,0,0,1))}@keyframes unrnnhr{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:unrnni8;animation-duration:var(--forge-animation-duration-medium2, 300ms);animation-timing-function:var(--forge-animation-easing-standard,cubic-bezier(0.2,0,0,1))}@keyframes unrnni8{from{transform:none}to{transform:translateX(-100%)}}.forge-split-view-panel[orientation=horizontal].forge-split-view-panel--opening[resizable=end]{animation-direction:reverse}.forge-split-view-panel[orientation=horizontal].forge-split-view-panel--opening[resizable=start]{position:absolute;top:0;right:0;animation-name:unrnnj6;animation-duration:var(--forge-animation-duration-medium2, 300ms);animation-timing-function:var(--forge-animation-easing-standard,cubic-bezier(0.2,0,0,1))}@keyframes unrnnj6{from{transform:none}to{transform:translateX(100%)}}.forge-split-view-panel[orientation=horizontal].forge-split-view-panel--opening[resizable=start]{animation-direction:reverse}.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:unrnnjr;animation-duration:var(--forge-animation-duration-medium2, 300ms);animation-timing-function:var(--forge-animation-easing-standard,cubic-bezier(0.2,0,0,1))}@keyframes unrnnjr{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:unrnnk3;animation-duration:var(--forge-animation-duration-medium2, 300ms);animation-timing-function:var(--forge-animation-easing-standard,cubic-bezier(0.2,0,0,1))}@keyframes unrnnk3{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:unrnnke;animation-duration:var(--forge-animation-duration-medium2, 300ms);animation-timing-function:var(--forge-animation-easing-standard,cubic-bezier(0.2,0,0,1))}@keyframes unrnnke{from{transform:none}to{transform:translateY(-100%)}}.forge-split-view-panel[orientation=vertical].forge-split-view-panel--opening[resizable=end]{animation-direction:reverse}.forge-split-view-panel[orientation=vertical].forge-split-view-panel--opening[resizable=start]{position:absolute;bottom:0;left:0;animation-name:unrnnla;animation-duration:var(--forge-animation-duration-medium2, 300ms);animation-timing-function:var(--forge-animation-easing-standard,cubic-bezier(0.2,0,0,1))}@keyframes unrnnla{from{transform:none}to{transform:translateY(100%)}}.forge-split-view-panel[orientation=vertical].forge-split-view-panel--opening[resizable=start]{animation-direction:reverse}: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}';
 /**
  * @tag forge-split-view-panel
  *
+ * @summary Individual panels within split views that can be resized and collapsed.
+ *
  * @dependency forge-icon
  * @dependency forge-state-layer
  * @dependency forge-focus-indicator

package/esm/stepper/step/step.d.ts

@@ -29,6 +29,8 @@ declare global {
 /**
  * @tag forge-step
  *
+ * @summary Individual steps within a stepper component that represent progress in a multi-step process.
+ *
  * @property {boolean} [alternative=false] - Whether the step is in the alternative style.
  * @property {boolean} [completed=false] - Whether the step is completed.
  * @property {boolean} [editable=false] - Whether the step is editable.

package/esm/stepper/step/step.js

@@ -15,10 +15,12 @@ import { ExpansionPanelComponent } from '../../expansion-panel';
 import { StateLayerComponent } from '../../state-layer';
 import { FocusIndicatorComponent } from '../../focus-indicator';
 const template = '<template><div class=\"container\" part=\"root\"><div class=\"forge-step\" part=\"step\"><div class=\"before\" part=\"before\"></div><div class=\"icon-container\" part=\"icon-container\"><div class=\"icon-content\" part=\"icon-content\"><span class=\"index\" part=\"index\"></span><forge-icon class=\"icon\" part=\"icon\"></forge-icon></div></div><div class=\"text-container\" part=\"text-container\"><div class=\"title\" part=\"title-container\"><slot></slot></div><div class=\"subtitle\" part=\"subtitle-container\"><slot name=\"optional\"></slot></div></div><div class=\"after\" part=\"after\"></div><forge-state-layer exportparts=\"surface:state-layer\" target=\":host\"></forge-state-layer><forge-focus-indicator part=\"focus-indicator\" target=\":host\" inward></forge-focus-indicator></div></div></template>';
-const styles = ':host{--_step-primary-color:var(--forge-step-primary-color, var(--forge-theme-primary, #3f51b5));--_step-text-color:var(--forge-step-text-color, var(--forge-theme-on-primary, #ffffff));--_step-border-radius:var(--forge-step-border-radius, calc(var(--forge-shape-extra-large, 16px) * var(--forge-shape-factor, 1)));--_step-border-radius-vertical:var(--forge-step-border-radius-vertical, calc(var(--forge-shape-medium, 4px) * var(--forge-shape-factor, 1)));--_step-disabled-text-color:var(--forge-step-disabled-text-color, var(--forge-theme-text-low, rgba(0, 0, 0, 0.38)));--_step-disabled-color:var(--forge-step-disabled-color, var(--forge-theme-surface-container-minimum, #f5f5f5));--_step-icon-fill:var(--forge-step-icon-fill, unset);--_step-icon-fill-active:var(--forge-step-icon-fill-active, var(--_step-primary-color));--_step-icon-text-color:var(--forge-step-icon-text-color, var(--forge-theme-primary, #3f51b5));--_step-icon-text-color-active:var(--forge-step-icon-text-color-active, var(--forge-theme-on-primary, #ffffff));--_step-icon-content-size:var(--forge-step-icon-content-size, 24px);--_step-icon-size:var(--forge-step-icon-size, calc(var(--forge-typography-font-size, 1rem) * 0.875));--_step-icon-transition-duration:var(--forge-step-icon-transition-duration, var(--forge-animation-duration-medium4, 400ms));--_step-icon-transition-easing:var(--forge-step-icon-transition-easing, var(--forge-animation-easing-standard, cubic-bezier(0.2, 0, 0, 1)));--_step-line-color:var(--forge-step-line-color, var(--forge-theme-outline, #e0e0e0));--_step-line-min-width:var(--forge-step-line-min-width, 10px);--_step-line-min-width-clustered:var(--forge-step-line-min-width-clustered, 25px);--_step-label-color:var(--forge-step-label-color, var(--forge-theme-text-high, rgba(0, 0, 0, 0.87)));--_step-sub-label-color:var(--forge-step-sub-label-color, var(--forge-theme-text-medium, rgba(0, 0, 0, 0.6)));--_step-error-color:var(--forge-step-error-color, var(--forge-theme-error, #b00020));--_step-error-text-color:var(--forge-step-error-text-color, var(--forge-theme-on-error, #ffffff));--_step-expansion-panel-border-left-width:var(--forge-step-expansion-panel-border-left-width, 1px);--_step-expansion-panel-margin-bottom:var(--forge-step-expansion-panel-margin-bottom, 4px);--_step-expansion-panel-margin-left:var(--forge-step-expansion-panel-margin-left, 60px);--_step-expansion-panel-margin-top:var(--forge-step-expansion-panel-margin-top, 4px);--_step-expansion-panel-icon-color:var(--forge-step-expansion-panel-icon-color, var(--forge-theme-text-medium, rgba(0, 0, 0, 0.6)))}:host(:focus){outline:0}:host([error]){--forge-state-layer-color:var(--_step-error-color)}:host(:first-child[alternative])::after{align-self:flex-start;top:22px;margin:0}:host(:last-child[alternative])::before{align-self:flex-start;top:22px;margin:0}:host(:not(:first-child):not(:last-child)[alternative])::after,:host(:not(:first-child):not(:last-child)[alternative])::before{align-self:flex-start;top:22px;min-width:7px;margin:0}:host(:not(:last-child)[alternative]) .after{align-self:flex-start;top:22px;position:absolute;width:calc(50% - 18px);left:calc(50% + 18px);height:0;right:0}:host(:not(:first-child)[alternative]) .before{align-self:flex-start;top:22px;position:absolute;left:0;width:calc(50% - 18px);height:0}:host(:not(:first-child):not(:last-child)):host(:not([vertical]))::after,:host(:not(:first-child):not(:last-child)):host(:not([vertical]))::before{border-color:var(--_step-line-color);min-width:var(--_step-line-min-width);content:\"\";position:relative;height:0;flex:1;flex-basis:0.000000001px;border-top-style:solid;border-top-width:1px;border-radius:1px 0 0 1px;margin:0 -10px}:host(:last-child):host(:not([vertical]))::before{border-color:var(--_step-line-color);min-width:var(--_step-line-min-width);content:\"\";position:relative;height:0;flex:1;flex-basis:0.000000001px;border-top-style:solid;border-top-width:1px;border-radius:1px 0 0 1px;margin:0 -10px 0 0}:host(:is(:first-child)):host(:not([vertical]))::after{border-color:var(--_step-line-color);min-width:var(--_step-line-min-width);content:\"\";position:relative;height:0;flex:1;flex-basis:0.000000001px;border-top-style:solid;border-top-width:1px;border-radius:1px 0 0 1px;margin:0 -10px}:host([vertical]){flex-direction:column}:host([vertical])::after{content:none}:host([vertical])::before{content:none}:host([vertical]) .forge-step{--_step-border-radius:var(--_step-border-radius-vertical);width:100%;min-height:52px}:host([vertical]) .forge-step .text-container{white-space:normal}:host([vertical]) .icon-container .icon-content{margin:0 16px 0 0}:host([vertical]) .expansion-panel{display:none}:host([vertical]) .expanded-icon{color:var(--_step-expansion-panel-icon-color);display:none;margin-left:auto}:host([vertical][expandable]) .expansion-panel{display:block}:host([ignore-user-expansion]) .forge-step .expanded-icon{display:none}forge-expansion-panel::part(root){border-color:var(--_step-line-color);margin-left:var(--_step-expansion-panel-margin-left);margin-top:var(--_step-expansion-panel-margin-top);margin-bottom:var(--_step-expansion-panel-margin-bottom);border-left-width:var(--_step-expansion-panel-border-left-width);border-left-style:solid}forge-focus-indicator{--forge-focus-indicator-color:var(--_step-primary-color);--forge-focus-indicator-shape:16px}.container{display:contents}.forge-step{-webkit-tap-highlight-color:transparent;padding:12px 16px;outline:0;background:0 0;border:none;border-radius:var(--_step-border-radius);position:relative;display:flex;overflow:hidden;align-items:center;box-sizing:border-box;cursor:pointer}.forge-step:focus{outline:0}.forge-step::-moz-focus-inner,.forge-step::-moz-focus-outer{padding:0;border:0}.forge-step.error forge-focus-indicator{--forge-focus-indicator-color:var(--_step-error-color)}.forge-step.vertical forge-focus-indicator{--forge-focus-indicator-shape:4px}.forge-step.selected:not(.disabled){--forge-state-layer-color:var(--_step-primary-color)}.forge-step.selected:not(.disabled)::before{background-color:var(--_step-primary-color);content:\"\";position:absolute;inset:0;opacity:.08;height:100%;width:100%}.forge-step.selected:not(.disabled).error{--_step-primary-color:var(--_step-error-color)}.forge-step .title{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:var(--forge-typography-body1-font-family, var(--forge-typography-font-family, \"Roboto\", sans-serif));font-size:var(--forge-typography-body1-font-size, calc(var(--forge-typography-font-size, 1rem) * var(--forge-typography-body-font-size-scale, .875)));font-weight:var(--forge-typography-body1-font-weight,400);line-height:var(--forge-typography-body1-line-height, calc(var(--forge-typography-font-size, 1rem) * var(--forge-typography-body-line-height-scale, 1.125)));letter-spacing:var(--forge-typography-body1-letter-spacing, .0357142857em);text-transform:var(--forge-typography-body1-text-transform,inherit);text-decoration:var(--forge-typography-body1-text-decoration,inherit);color:var(--_step-label-color);text-align:left;overflow:hidden;text-overflow:ellipsis}.forge-step .subtitle{text-align:left;overflow:hidden;text-overflow:ellipsis}.forge-step .subtitle ::slotted(*){color:var(--_step-sub-label-color);-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:var(--forge-typography-label1-font-family, var(--forge-typography-font-family, \"Roboto\", sans-serif));font-size:var(--forge-typography-label1-font-size, calc(var(--forge-typography-font-size, 1rem) * var(--forge-typography-label-font-size-scale, .75)));font-weight:var(--forge-typography-label1-font-weight,400);line-height:var(--forge-typography-label1-line-height, calc(var(--forge-typography-font-size, 1rem) * var(--forge-typography-label-line-height-scale, 1.25)));letter-spacing:var(--forge-typography-label1-letter-spacing, .0357142857em);text-transform:var(--forge-typography-label1-text-transform,inherit);text-decoration:var(--forge-typography-label1-text-decoration,inherit)}.forge-step .icon-container .icon-content{color:var(--_step-icon-text-color);background-color:var(--_step-icon-fill);height:var(--_step-icon-content-size);width:var(--_step-icon-content-size);border-style:solid;border-width:2px;border-color:transparent;border-radius:50%;display:flex;align-items:center;justify-content:center;transition:background-color var(--_step-icon-transition-duration) var(--_step-icon-transition-easing);margin:0 8px 0 0;flex:none}.forge-step .icon-container .icon-content forge-icon{font-size:var(--_step-icon-size)}.forge-step.disabled{color:var(--_step-disabled-text-color);cursor:not-allowed}.forge-step.disabled.forge-step .icon-container .icon-content{--_step-icon-fill:var(--_step-disabled-color);--_step-icon-text-color:var(--_step-disabled-text-color)}.forge-step.disabled .text-container .title{color:var(--_step-disabled-text-color)}.forge-step.disabled .text-container .subtitle ::slotted(*){color:var(--_step-disabled-text-color)}.forge-step.alternative{flex-direction:column}.forge-step.alternative .icon-container .icon-content{margin:0}.forge-step.alternative .text-container{margin-top:8px;place-items:center}.forge-step:not(.selected):not(.disabled).editable:not(.completed):not(.error) .icon-content,.forge-step:not(.selected):not(.disabled):not(.editable):not(.completed):not(.error) .icon-content{border-color:var(--_step-primary-color)}.forge-step:not(.selected):not(.disabled).editable:not(.completed):not(.error) .icon-content .index,.forge-step:not(.selected):not(.disabled):not(.editable):not(.completed):not(.error) .icon-content .index{color:var(--_step-primary-color)}.forge-step.selected.disabled .icon-content{--_step-icon-fill:var(--_step-disabled-color);--_step-icon-text-color:var(--_step-disabled-text-color)}.forge-step.selected:not(.disabled) .icon-container .icon-content{--_step-icon-fill:var(--_step-icon-fill-active);--_step-icon-text-color:var(--_step-icon-text-color-active)}.forge-step.selected:not(.disabled) .title{color:var(--_step-primary-color);font-weight:500}.forge-step.selected:not(.disabled) .subtitle ::slotted(*){color:var(--_step-primary-color);font-weight:500}.forge-step.error:not(.disabled) .title{color:var(--_step-error-color)}.forge-step.error:not(.disabled) .subtitle ::slotted(*){color:var(--_step-error-color)}.forge-step.error:not(.disabled) .icon-container .icon-content{--_step-icon-fill:var(--_step-error-color);--_step-icon-text-color:var(--_step-error-text-color)}.forge-step.completed:not(.disabled):not(.error):not(.editable) .icon-content{--_step-icon-fill:var(--_step-icon-fill-active);--_step-icon-text-color:var(--_step-icon-text-color-active)}.forge-step.completed:not(.disabled):not(.error).editable .icon-content{--_step-icon-fill:var(--_step-icon-fill-active);--_step-icon-text-color:var(--_step-icon-text-color-active)}.forge-step.expandable .expanded-icon{display:inline-block;transition:transform .3s ease-in-out}.forge-step.expandable.expanded .expanded-icon{transform:rotate(180deg)}.forge-step.expandable .icon-container .icon-content{margin:0 16px 0 0}.forge-step .text-container{display:flex;flex-direction:column;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host(:not(:last-child)[clustered])::after{--_step-line-min-width:var(--_step-line-min-width-clustered)}:host(:last-child[clustered])::before{--_step-line-min-width:var(--_step-line-min-width-clustered)}:host(:not(:first-child):not(:last-child)[clustered])::after,:host(:not(:first-child):not(:last-child)[clustered])::before{--_step-line-min-width:var(--_step-line-min-width-clustered)}';
+const styles = ':host{--_step-primary-color:var(--forge-step-primary-color, var(--forge-theme-primary, #3f51b5));--_step-text-color:var(--forge-step-text-color, var(--forge-theme-on-primary, #ffffff));--_step-border-radius:var(--forge-step-border-radius, calc(var(--forge-shape-extra-large, 16px) * var(--forge-shape-factor, 1)));--_step-border-radius-vertical:var(--forge-step-border-radius-vertical, calc(var(--forge-shape-medium, 4px) * var(--forge-shape-factor, 1)));--_step-disabled-text-color:var(--forge-step-disabled-text-color, var(--forge-theme-text-low, rgba(0, 0, 0, 0.38)));--_step-disabled-color:var(--forge-step-disabled-color, var(--forge-theme-surface-container-minimum, #f5f5f5));--_step-icon-fill:var(--forge-step-icon-fill, unset);--_step-icon-fill-active:var(--forge-step-icon-fill-active, var(--_step-primary-color));--_step-icon-text-color:var(--forge-step-icon-text-color, var(--forge-theme-primary, #3f51b5));--_step-icon-text-color-active:var(--forge-step-icon-text-color-active, var(--forge-theme-on-primary, #ffffff));--_step-icon-content-size:var(--forge-step-icon-content-size, 24px);--_step-icon-size:var(--forge-step-icon-size, calc(var(--forge-typography-font-size, 1rem) * 0.875));--_step-icon-transition-duration:var(--forge-step-icon-transition-duration, var(--forge-animation-duration-medium4, 400ms));--_step-icon-transition-easing:var(--forge-step-icon-transition-easing, var(--forge-animation-easing-standard, cubic-bezier(0.2, 0, 0, 1)));--_step-line-color:var(--forge-step-line-color, var(--forge-theme-outline, #e0e0e0));--_step-line-min-width:var(--forge-step-line-min-width, 10px);--_step-line-min-width-clustered:var(--forge-step-line-min-width-clustered, 25px);--_step-label-color:var(--forge-step-label-color, var(--forge-theme-text-high, rgba(0, 0, 0, 0.87)));--_step-sub-label-color:var(--forge-step-sub-label-color, var(--forge-theme-text-medium, rgba(0, 0, 0, 0.6)));--_step-error-color:var(--forge-step-error-color, var(--forge-theme-error, #b00020));--_step-error-text-color:var(--forge-step-error-text-color, var(--forge-theme-on-error, #ffffff));--_step-expansion-panel-border-left-width:var(--forge-step-expansion-panel-border-left-width, 1px);--_step-expansion-panel-margin-bottom:var(--forge-step-expansion-panel-margin-bottom, 4px);--_step-expansion-panel-margin-left:var(--forge-step-expansion-panel-margin-left, 60px);--_step-expansion-panel-margin-top:var(--forge-step-expansion-panel-margin-top, 4px);--_step-expansion-panel-icon-color:var(--forge-step-expansion-panel-icon-color, var(--forge-theme-text-medium, rgba(0, 0, 0, 0.6)))}:host(:focus){outline:0}:host([error]){--forge-state-layer-color:var(--_step-error-color)}:host(:first-child[alternative])::after{align-self:flex-start;top:22px;margin:0}:host(:last-child[alternative])::before{align-self:flex-start;top:22px;margin:0}:host(:not(:first-child):not(:last-child)[alternative])::after,:host(:not(:first-child):not(:last-child)[alternative])::before{align-self:flex-start;top:22px;min-width:7px;margin:0}:host(:not(:last-child)[alternative]) .after{align-self:flex-start;top:22px;position:absolute;width:calc(50% - 18px);left:calc(50% + 18px);height:0;right:0}:host(:not(:first-child)[alternative]) .before{align-self:flex-start;top:22px;position:absolute;left:0;width:calc(50% - 18px);height:0}:host(:not(:first-child):not(:last-child)):host(:not([vertical]))::after,:host(:not(:first-child):not(:last-child)):host(:not([vertical]))::before{border-color:var(--_step-line-color);min-width:var(--_step-line-min-width);content:\"\";position:relative;height:0;flex:1;flex-basis:0.000000001px;border-top-style:solid;border-top-width:1px;border-radius:1px 0 0 1px;margin:0 -10px}:host(:last-child):host(:not([vertical]))::before{border-color:var(--_step-line-color);min-width:var(--_step-line-min-width);content:\"\";position:relative;height:0;flex:1;flex-basis:0.000000001px;border-top-style:solid;border-top-width:1px;border-radius:1px 0 0 1px;margin:0 -10px 0 0}:host(:is(:first-child)):host(:not([vertical]))::after{border-color:var(--_step-line-color);min-width:var(--_step-line-min-width);content:\"\";position:relative;height:0;flex:1;flex-basis:0.000000001px;border-top-style:solid;border-top-width:1px;border-radius:1px 0 0 1px;margin:0 -10px}:host([vertical]){flex-direction:column}:host([vertical])::after{content:none}:host([vertical])::before{content:none}:host([vertical]) .forge-step{--_step-border-radius:var(--_step-border-radius-vertical);width:100%;min-height:52px}:host([vertical]) .forge-step .text-container{white-space:normal}:host([vertical]) .icon-container .icon-content{margin:0 16px 0 0}:host([vertical]) .expansion-panel{display:none}:host([vertical]) .expanded-icon{color:var(--_step-expansion-panel-icon-color);display:none;margin-left:auto}:host([vertical][expandable]) .expansion-panel{display:block}:host([ignore-user-expansion]) .forge-step .expanded-icon{display:none}forge-expansion-panel::part(root){border-color:var(--_step-line-color);margin-left:var(--_step-expansion-panel-margin-left);margin-top:var(--_step-expansion-panel-margin-top);margin-bottom:var(--_step-expansion-panel-margin-bottom);border-left-width:var(--_step-expansion-panel-border-left-width);border-left-style:solid}forge-focus-indicator{--forge-focus-indicator-color:var(--_step-primary-color);--forge-focus-indicator-shape:16px}.container{display:contents}.forge-step{-webkit-tap-highlight-color:transparent;padding:12px 16px;outline:0;background:0 0;border:none;border-radius:var(--_step-border-radius);position:relative;display:flex;overflow:hidden;align-items:center;box-sizing:border-box}.forge-step:focus{outline:0}.forge-step::-moz-focus-inner,.forge-step::-moz-focus-outer{padding:0;border:0}.forge-step{cursor:pointer}.forge-step.error forge-focus-indicator{--forge-focus-indicator-color:var(--_step-error-color)}.forge-step.vertical forge-focus-indicator{--forge-focus-indicator-shape:4px}.forge-step.selected:not(.disabled){--forge-state-layer-color:var(--_step-primary-color)}.forge-step.selected:not(.disabled)::before{background-color:var(--_step-primary-color);content:\"\";position:absolute;inset:0;opacity:.08;height:100%;width:100%}.forge-step.selected:not(.disabled).error{--_step-primary-color:var(--_step-error-color)}.forge-step .title{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:var(--forge-typography-body1-font-family, var(--forge-typography-font-family, \"Roboto\", sans-serif));font-size:var(--forge-typography-body1-font-size, calc(var(--forge-typography-font-size, 1rem) * var(--forge-typography-body-font-size-scale, .875)));font-weight:var(--forge-typography-body1-font-weight,400);line-height:var(--forge-typography-body1-line-height, calc(var(--forge-typography-font-size, 1rem) * var(--forge-typography-body-line-height-scale, 1.125)));letter-spacing:var(--forge-typography-body1-letter-spacing, .0357142857em);text-transform:var(--forge-typography-body1-text-transform,inherit);text-decoration:var(--forge-typography-body1-text-decoration,inherit);color:var(--_step-label-color);text-align:left;overflow:hidden;text-overflow:ellipsis}.forge-step .subtitle{text-align:left;overflow:hidden;text-overflow:ellipsis}.forge-step .subtitle ::slotted(*){color:var(--_step-sub-label-color);-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:var(--forge-typography-label1-font-family, var(--forge-typography-font-family, \"Roboto\", sans-serif));font-size:var(--forge-typography-label1-font-size, calc(var(--forge-typography-font-size, 1rem) * var(--forge-typography-label-font-size-scale, .75)));font-weight:var(--forge-typography-label1-font-weight,400);line-height:var(--forge-typography-label1-line-height, calc(var(--forge-typography-font-size, 1rem) * var(--forge-typography-label-line-height-scale, 1.25)));letter-spacing:var(--forge-typography-label1-letter-spacing, .0357142857em);text-transform:var(--forge-typography-label1-text-transform,inherit);text-decoration:var(--forge-typography-label1-text-decoration,inherit)}.forge-step .icon-container .icon-content{color:var(--_step-icon-text-color);background-color:var(--_step-icon-fill);height:var(--_step-icon-content-size);width:var(--_step-icon-content-size);border-style:solid;border-width:2px;border-color:transparent;border-radius:50%;display:flex;align-items:center;justify-content:center;transition:background-color var(--_step-icon-transition-duration) var(--_step-icon-transition-easing);margin:0 8px 0 0;flex:none}.forge-step .icon-container .icon-content forge-icon{font-size:var(--_step-icon-size)}.forge-step.disabled{color:var(--_step-disabled-text-color);cursor:not-allowed}.forge-step.disabled.forge-step .icon-container .icon-content{--_step-icon-fill:var(--_step-disabled-color);--_step-icon-text-color:var(--_step-disabled-text-color)}.forge-step.disabled .text-container .title{color:var(--_step-disabled-text-color)}.forge-step.disabled .text-container .subtitle ::slotted(*){color:var(--_step-disabled-text-color)}.forge-step.alternative{flex-direction:column}.forge-step.alternative .icon-container .icon-content{margin:0}.forge-step.alternative .text-container{margin-top:8px;place-items:center}.forge-step:not(.selected):not(.disabled).editable:not(.completed):not(.error) .icon-content,.forge-step:not(.selected):not(.disabled):not(.editable):not(.completed):not(.error) .icon-content{border-color:var(--_step-primary-color)}.forge-step:not(.selected):not(.disabled).editable:not(.completed):not(.error) .icon-content .index,.forge-step:not(.selected):not(.disabled):not(.editable):not(.completed):not(.error) .icon-content .index{color:var(--_step-primary-color)}.forge-step.selected.disabled .icon-content{--_step-icon-fill:var(--_step-disabled-color);--_step-icon-text-color:var(--_step-disabled-text-color)}.forge-step.selected:not(.disabled) .icon-container .icon-content{--_step-icon-fill:var(--_step-icon-fill-active);--_step-icon-text-color:var(--_step-icon-text-color-active)}.forge-step.selected:not(.disabled) .title{color:var(--_step-primary-color);font-weight:500}.forge-step.selected:not(.disabled) .subtitle ::slotted(*){color:var(--_step-primary-color);font-weight:500}.forge-step.error:not(.disabled) .title{color:var(--_step-error-color)}.forge-step.error:not(.disabled) .subtitle ::slotted(*){color:var(--_step-error-color)}.forge-step.error:not(.disabled) .icon-container .icon-content{--_step-icon-fill:var(--_step-error-color);--_step-icon-text-color:var(--_step-error-text-color)}.forge-step.completed:not(.disabled):not(.error):not(.editable) .icon-content{--_step-icon-fill:var(--_step-icon-fill-active);--_step-icon-text-color:var(--_step-icon-text-color-active)}.forge-step.completed:not(.disabled):not(.error).editable .icon-content{--_step-icon-fill:var(--_step-icon-fill-active);--_step-icon-text-color:var(--_step-icon-text-color-active)}.forge-step.expandable .expanded-icon{display:inline-block;transition:transform .3s ease-in-out}.forge-step.expandable.expanded .expanded-icon{transform:rotate(180deg)}.forge-step.expandable .icon-container .icon-content{margin:0 16px 0 0}.forge-step .text-container{display:flex;flex-direction:column;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host(:not(:last-child)[clustered])::after{--_step-line-min-width:var(--_step-line-min-width-clustered)}:host(:last-child[clustered])::before{--_step-line-min-width:var(--_step-line-min-width-clustered)}:host(:not(:first-child):not(:last-child)[clustered])::after,:host(:not(:first-child):not(:last-child)[clustered])::before{--_step-line-min-width:var(--_step-line-min-width-clustered)}';
 /**
  * @tag forge-step
  *
+ * @summary Individual steps within a stepper component that represent progress in a multi-step process.
+ *
  * @property {boolean} [alternative=false] - Whether the step is in the alternative style.
  * @property {boolean} [completed=false] - Whether the step is completed.
  * @property {boolean} [editable=false] - Whether the step is editable.

package/esm/stepper/stepper/stepper.d.ts

@@ -23,6 +23,8 @@ declare global {
 /**
  * @tag forge-stepper
  *
+ * @summary Steppers guide users through multi-step processes by breaking them into logical steps.
+ *
  * @dependency forge-step
  *
  * @event {CustomEvent<number>} forge-step-select - Emits the index when a step is selected.

package/esm/stepper/stepper/stepper.js

@@ -15,6 +15,8 @@ const styles = ':host{display:block}:host([hidden]){display:none}:host([vertical
 /**
  * @tag forge-stepper
  *
+ * @summary Steppers guide users through multi-step processes by breaking them into logical steps.
+ *
  * @dependency forge-step
  *
  * @event {CustomEvent<number>} forge-step-select - Emits the index when a step is selected.

package/esm/table/table-utils.js

@@ -144,6 +144,9 @@ export class TableUtils {
             if (columnConfig.sortable) {
                 cellContainer = document.createElement('button');
                 cellContainer.type = 'button';
+                const focusIndicator = document.createElement('forge-focus-indicator');
+                focusIndicator.inward = true;
+                cellContainer.appendChild(focusIndicator);
                 cellContainer.addEventListener('keydown', tableConfiguration.sortableHeadCellKeydownListener);
             }
             else {

package/esm/table/table.d.ts

@@ -64,6 +64,8 @@ declare global {
     }
 }
 /**
+ * @summary A comprehensive data table component with features for selection, sorting, filtering, resizing, and row expansion functionality.
+ *
  * @tag forge-table
  *
  * @dependency forge-expansion-panel

package/esm/table/table.js

@@ -15,7 +15,10 @@ import { IconRegistry, IconComponent } from '../icon';
 import { BaseComponent } from '../core/base/base-component';
 import { CellAlign } from './types';
 import { TooltipComponent } from '../tooltip';
+import { FocusIndicatorComponent } from '../focus-indicator';
 /**
+ * @summary A comprehensive data table component with features for selection, sorting, filtering, resizing, and row expansion functionality.
+ *
  * @tag forge-table
  *
  * @dependency forge-expansion-panel
@@ -309,7 +312,7 @@ __decorate([
 TableComponent = __decorate([
     customElement({
         name: TABLE_CONSTANTS.elementName,
-        dependencies: [ExpansionPanelComponent, IconComponent, CheckboxComponent, TooltipComponent]
+        dependencies: [ExpansionPanelComponent, IconComponent, CheckboxComponent, TooltipComponent, FocusIndicatorComponent]
     })
 ], TableComponent);
 export { TableComponent };

package/esm/tabs/tab/tab-adapter.js

@@ -8,12 +8,12 @@ import { STATE_LAYER_CONSTANTS } from '../../state-layer';
 import { BaseAdapter } from '../../core/base/base-adapter';
 import { TAB_BAR_CONSTANTS } from '../tab-bar/tab-bar-constants';
 import { TAB_CONSTANTS } from './tab-constants';
-import { FOCUS_INDICATOR_CONSTANTS } from '../../focus-indicator';
+import { FOCUS_INDICATOR_TAG_NAME } from '../../focus-indicator';
 export class TabAdapter extends BaseAdapter {
     constructor(component) {
         super(component);
         this._tabIndicatorElement = getShadowElement(this._component, TAB_CONSTANTS.selectors.INDICATOR);
-        this._focusIndicatorElement = getShadowElement(this._component, FOCUS_INDICATOR_CONSTANTS.elementName);
+        this._focusIndicatorElement = getShadowElement(this._component, FOCUS_INDICATOR_TAG_NAME);
         this._stateLayerElement = getShadowElement(this._component, STATE_LAYER_CONSTANTS.elementName);
     }
     initialize() {

package/esm/tabs/tab/tab.d.ts

@@ -26,6 +26,8 @@ declare global {
 /**
  * @tag forge-tab
  *
+ * @summary Individual tab elements that provide navigation between different content panels.
+ *
  * @dependency forge-focus-indicator
  * @dependency forge-state-layer
  *

package/esm/tabs/tab/tab.js

@@ -16,6 +16,8 @@ const styles = ':host{display:inline-flex;outline:0;-webkit-tap-highlight-color:
 /**
  * @tag forge-tab
  *
+ * @summary Individual tab elements that provide navigation between different content panels.
+ *
  * @dependency forge-focus-indicator
  * @dependency forge-state-layer
  *

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

@@ -44,6 +44,8 @@ declare global {
     }
 }
 /**
+ * @summary A time input component with integrated dropdown for selecting time values with support for various formats, masking, and validation options.
+ *
  * @tag forge-time-picker
  */
 export declare class TimePickerComponent extends BaseComponent implements ITimePickerComponent {

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

@@ -18,6 +18,8 @@ import { PopoverComponent } from '../popover/popover';
 const template = '<template><slot></slot></template>';
 const styles = ':host{display:block}:host([hidden]){display:none}';
 /**
+ * @summary A time input component with integrated dropdown for selecting time values with support for various formats, masking, and validation options.
+ *
  * @tag forge-time-picker
  */
 let TimePickerComponent = class TimePickerComponent extends BaseComponent {

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

@@ -17,6 +17,9 @@ export interface ITooltipAdapter extends IBaseAdapter<ITooltipComponent> {
     removeAnchorListener(type: string, listener: EventListener): void;
     addLightDismissListener(listener: EventListener): void;
     removeLightDismissListener(listener: EventListener): void;
+    addTooltipListener(type: string, listener: EventListener, opts?: AddEventListenerOptions): void;
+    removeTooltipListener(type: string, listener: EventListener): void;
+    isKeyboardFocused(): boolean;
     show(): void;
     hide(): void;
 }
@@ -41,6 +44,9 @@ export declare class TooltipAdapter extends BaseAdapter<ITooltipComponent> imple
     removeAnchorListener(type: string, listener: EventListener): void;
     addLightDismissListener(listener: EventListener): void;
     removeLightDismissListener(listener: EventListener): void;
+    addTooltipListener(type: string, listener: EventListener, opts?: AddEventListenerOptions): void;
+    removeTooltipListener(type: string, listener: EventListener): void;
+    isKeyboardFocused(): boolean;
     show(): void;
     hide(): void;
     /**

package/esm/tooltip/tooltip-adapter.js

@@ -80,6 +80,15 @@ export class TooltipAdapter extends BaseAdapter {
     removeLightDismissListener(listener) {
         this._overlayElement?.removeEventListener(OVERLAY_CONSTANTS.events.LIGHT_DISMISS, listener);
     }
+    addTooltipListener(type, listener, opts) {
+        this.hostElement?.addEventListener(type, listener, opts);
+    }
+    removeTooltipListener(type, listener) {
+        this.hostElement?.removeEventListener(type, listener);
+    }
+    isKeyboardFocused() {
+        return !!this._anchorElement?.matches(':focus-visible');
+    }
     show() {
         // Tooltips are shown above all content via <forge-overlay>
         // We do this by dynamically creating an overlay element and appending it to the shadow root

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

@@ -39,6 +39,7 @@ export declare const TOOLTIP_CONSTANTS: {
     };
     numbers: {
         LONGPRESS_VISIBILITY_DURATION: number;
+        HOVER_OUTSIDE_THRESHOLD: number;
     };
     defaults: {
         DELAY: number;

package/esm/tooltip/tooltip-constants.js

@@ -24,7 +24,8 @@ const attributes = {
     ...observedAttributes
 };
 const numbers = {
-    LONGPRESS_VISIBILITY_DURATION: 3000
+    LONGPRESS_VISIBILITY_DURATION: 3000,
+    HOVER_OUTSIDE_THRESHOLD: 100
 };
 const defaults = {
     DELAY: 500,

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

@@ -39,8 +39,17 @@ export declare class TooltipCore extends TooltipCore_base implements ITooltipCor
     private _hoverStartListener;
     private _hoverEndListener;
     private _hoverTimeout;
+    private _hoverOutsideTimeout;
+    private _isHoveringTooltip;
+    private _isHoveringAnchor;
+    private _tooltipHoverStartListener;
+    private _tooltipHoverEndListener;
+    private _anchorOpenHoverStartListener;
+    private _anchorOpenHoverEndListener;
     private _focusListener;
     private _blurListener;
+    private _keyboardFocusListener;
+    private _keyboardBlurListener;
     private _longpressVisibilityTimeout;
     private _scrollListener;
     private _mouseDownListener;
@@ -56,10 +65,21 @@ export declare class TooltipCore extends TooltipCore_base implements ITooltipCor
     private _hide;
     private _attachDismissListeners;
     private _detachDismissListeners;
+    private _attachTooltipHoverListeners;
+    private _detachTooltipHoverListeners;
+    private _attachAnchorOpenHoverListeners;
+    private _detachAnchorOpenHoverListeners;
     private _onHoverStart;
     private _onHoverEnd;
     private _onFocus;
     private _onBlur;
+    private _onKeyboardFocus;
+    private _onKeyboardBlur;
+    private _onTooltipHoverStart;
+    private _onTooltipHoverEnd;
+    private _onAnchorOpenHoverStart;
+    private _onAnchorOpenHoverEnd;
+    private _scheduleHideIfOutsideHoverRegion;
     protected _onLongpress(): void;
     protected _onLongpressEnd(evt: PointerEvent | TouchEvent): void;
     private _onTryShow;