@tylertech/forge 3.13.1 → 3.14.0-dev.1

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

@@ -1,8 +1,3 @@
-/**
- * @license
- * Copyright Tyler Technologies, Inc. 
- * License: Apache-2.0
- */
 export declare const TAB_CONSTANTS: {
     elementName: "forge-tab";
     observedAttributes: {

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

@@ -1,9 +1,11 @@
 /**
  * @license
- * Copyright Tyler Technologies, Inc. 
+ * Copyright Tyler Technologies, Inc.
  * License: Apache-2.0
  */
-import { COMPONENT_NAME_PREFIX } from '../../constants';
+
+import { COMPONENT_NAME_PREFIX } from '../../constants.js';
+
 const elementName = `${COMPONENT_NAME_PREFIX}tab`;
 const observedAttributes = {
     DISABLED: 'disabled',
@@ -29,7 +31,7 @@ const strings = {
 const numbers = {
     ANIMATION_DURATION: 250
 };
-export const TAB_CONSTANTS = {
+const TAB_CONSTANTS = {
     elementName,
     observedAttributes,
     attributes,
@@ -39,3 +41,5 @@ export const TAB_CONSTANTS = {
     strings,
     numbers
 };
+
+export { TAB_CONSTANTS };

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

@@ -1,10 +1,5 @@
-/**
- * @license
- * Copyright Tyler Technologies, Inc. 
- * License: Apache-2.0
- */
-import { ExperimentalFocusOptions } from '../../constants';
-import { ITabAdapter } from './tab-adapter';
+import { ExperimentalFocusOptions } from '../../constants.js';
+import { ITabAdapter } from './tab-adapter.js';
 export interface ITabCore {
     disabled: boolean;
     selected: boolean;

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

@@ -1,10 +1,12 @@
 /**
  * @license
- * Copyright Tyler Technologies, Inc. 
+ * Copyright Tyler Technologies, Inc.
  * License: Apache-2.0
  */
-import { TAB_CONSTANTS } from './tab-constants';
-export class TabCore {
+
+import { TAB_CONSTANTS } from './tab-constants.js';
+
+class TabCore {
     constructor(_adapter) {
         this._adapter = _adapter;
         // State
@@ -105,3 +107,5 @@ export class TabCore {
         }
     }
 }
+
+export { TabCore };

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

@@ -1,10 +1,5 @@
-/**
- * @license
- * Copyright Tyler Technologies, Inc. 
- * License: Apache-2.0
- */
-import { BaseComponent, IBaseComponent } from '../../core/base/base-component';
-import { ExperimentalFocusOptions } from '../../constants';
+import { BaseComponent, IBaseComponent } from '../../core/base/base-component.js';
+import { ExperimentalFocusOptions } from '../../constants.js';
 export interface ITabComponent extends IBaseComponent {
     disabled: boolean;
     selected: boolean;

package/esm/tabs/tab/tab.html.js

@@ -0,0 +1,9 @@
+/**
+ * @license
+ * Copyright Tyler Technologies, Inc.
+ * License: Apache-2.0
+ */
+
+var template = "<template>\n  <div class=\"forge-tab\" part=\"container\">\n    <span class=\"content\" part=\"content\">\n      <slot name=\"start\">\n        <slot name=\"leading\"></slot>\n      </slot>\n      <span class=\"label\" part=\"label\">\n        <slot></slot>\n      </span>\n      <slot name=\"end\">\n        <slot name=\"trailing\"></slot>\n      </slot>\n      <span class=\"indicator\" part=\"indicator\"></span>\n    </span>\n    <forge-state-layer exportparts=\"surface:state-layer\" target=\":host\"></forge-state-layer>\n    <forge-focus-indicator part=\"focus-indicator\" target=\":host\" inward></forge-focus-indicator>\n  </div>\n</template>\n";
+
+export { template as default };

package/esm/tabs/tab/tab.js

@@ -1,18 +1,20 @@
 /**
  * @license
- * Copyright Tyler Technologies, Inc. 
+ * Copyright Tyler Technologies, Inc.
  * License: Apache-2.0
  */
-import { __decorate } from "tslib";
-import { customElement, attachShadowTemplate, coerceBoolean, coreProperty } from '@tylertech/forge-core';
-import { TabAdapter } from './tab-adapter';
-import { TabCore } from './tab-core';
-import { TAB_CONSTANTS } from './tab-constants';
-import { BaseComponent } from '../../core/base/base-component';
-import { FocusIndicatorComponent } from '../../focus-indicator/focus-indicator';
-import { StateLayerComponent } from '../../state-layer/state-layer';
-const template = '<template><div class=\"forge-tab\" part=\"container\"><span class=\"content\" part=\"content\"><slot name=\"start\"><slot name=\"leading\"></slot></slot><span class=\"label\" part=\"label\"><slot></slot></span><slot name=\"end\"><slot name=\"trailing\"></slot></slot><span class=\"indicator\" part=\"indicator\"></span></span><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></template>';
-const styles = ':host{display:inline-flex;outline:0;-webkit-tap-highlight-color:transparent;vertical-align:middle}:host([hidden]){display:none}.forge-tab{--_tab-active-color:var(--forge-tab-active-color, var(--forge-theme-primary, #3f51b5));--_tab-inactive-color:var(--forge-tab-inactive-color, var(--forge-theme-text-medium, rgba(0, 0, 0, 0.6)));--_tab-height:var(--forge-tab-height, 48px);--_tab-stacked-height:var(--forge-tab-stacked-height, 64px);--_tab-padding-block:var(--forge-tab-padding-block, 0);--_tab-padding-inline:var(--forge-tab-padding-inline, 0);--_tab-disabled-opacity:var(--forge-tab-disabled-opacity, 0.38);--_tab-indicator-color:var(--forge-tab-indicator-color, var(--_tab-active-color));--_tab-indicator-height:var(--forge-tab-indicator-height, 3px);--_tab-indicator-shape:var(--forge-tab-indicator-shape, 3px 3px 0 0);--_tab-vertical-indicator-shape:var(--forge-tab-vertical-indicator-shape, 3px 0 0 3px);--_tab-secondary-indicator-height:var(--forge-tab-secondary-indicator-height, 2px);--_tab-secondary-indicator-shape:var(--forge-tab-secondary-indicator-shape, 0);--_tab-inverted-indicator-shape:var(--forge-tab-inverted-indicator-shape, 0 0 3px 3px);--_tab-vertical-inverted-indicator-shape:var(--forge-tab-vertical-inverted-indicator-shape, 0 3px 3px 0);--_tab-container-color:var(--forge-tab-container-color, transparent);--_tab-container-height:var(--forge-tab-container-height, var(--_tab-height));--_tab-container-shape:var(--forge-tab-container-shape, 0);--_tab-content-height:var(--forge-tab-content-height, var(--_tab-height));--_tab-content-spacing:var(--forge-tab-content-spacing, var(--forge-spacing-xsmall, 8px));--_tab-content-padding:var(--forge-tab-content-padding, var(--forge-spacing-xxsmall, 4px));--_tab-content-padding-block:var(--forge-tab-content-padding-block, var(--_tab-content-padding));--_tab-content-padding-inline:var(--forge-tab-content-padding-inline, var(--forge-spacing-medium, 16px));--_tab-content-padding-inline-secondary:var(--forge-tab-content-padding-inline-secondary, var(--forge-spacing-medium, 16px));--_tab-active-focus-icon-color:var(--forge-tab-active-focus-icon-color, var(--_tab-active-color));--_tab-active-hover-icon-color:var(--forge-tab-active-hover-icon-color, var(--_tab-active-color));--_tab-active-icon-color:var(--forge-tab-active-icon-color, var(--_tab-active-color));--_tab-active-pressed-icon-color:var(--forge-tab-active-pressed-icon-color, var(--_tab-active-color));--_tab-icon-size:var(--forge-tab-icon-size, 24px);--_tab-focus-icon-color:var(--forge-tab-focus-icon-color, var(--_tab-inactive-color));--_tab-hover-icon-color:var(--forge-tab-hover-icon-color, var(--_tab-inactive-color));--_tab-icon-color:var(--forge-tab-icon-color, var(--_tab-inactive-color));--_tab-pressed-icon-color:var(--forge-tab-pressed-icon-color, var(--_tab-inactive-color));--_tab-active-focus-label-text-color:var(--forge-tab-active-focus-label-text-color, var(--_tab-active-color));--_tab-active-hover-label-text-color:var(--forge-tab-active-hover-label-text-color, var(--_tab-active-color));--_tab-active-label-text-color:var(--forge-tab-active-label-text-color, var(--_tab-active-color));--_tab-active-pressed-label-text-color:var(--forge-tab-active-pressed-label-text-color, var(--_tab-active-color));--_tab-focus-label-text-color:var(--forge-tab-focus-label-text-color, var(--_tab-inactive-color));--_tab-hover-label-text-color:var(--forge-tab-hover-label-text-color, var(--_tab-inactive-color));--_tab-label-text-color:var(--forge-tab-label-text-color, var(--_tab-inactive-color));--_tab-pressed-label-text-color:var(--forge-tab-pressed-label-text-color, var(--_tab-inactive-color))}.forge-tab{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:var(--forge-typography-button-font-family, var(--forge-typography-font-family, \"Roboto\", sans-serif));font-size:var(--forge-typography-button-font-size, calc(var(--forge-typography-font-size, 1rem) * var(--forge-typography-button-font-size-scale, .875)));font-weight:var(--forge-typography-button-font-weight,500);line-height:var(--forge-typography-button-line-height, normal);letter-spacing:var(--forge-typography-button-letter-spacing, .0714285714em);text-transform:var(--forge-typography-button-text-transform,inherit);text-decoration:var(--forge-typography-button-text-decoration,inherit);display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box;border:none;outline:0;user-select:none;-webkit-appearance:none;vertical-align:middle;background:0 0;text-decoration:none;width:100%;position:relative;padding-block:var(--_tab-padding-block);padding-inline:var(--_tab-padding-inline);margin:0;z-index:0;background-color:var(--_tab-container-color);color:var(--_tab-label-text-color);min-height:var(--_tab-container-height)}.forge-tab::-moz-focus-inner{padding:0;border:0}.forge-tab ::slotted([slot=leading]),.forge-tab ::slotted([slot=trailing]){display:inline-flex;position:relative;writing-mode:horizontal-tb;fill:currentColor;color:var(--_tab-icon-color);font-size:var(--_tab-icon-size);width:var(--_tab-icon-size);height:var(--_tab-icon-size)}.forge-tab:hover{color:var(--_tab-hover-label-text-color);cursor:pointer}.forge-tab:hover ::slotted([slot=leading]),.forge-tab:hover ::slotted([slot=trailing]){color:var(--_tab-hover-icon-color)}.forge-tab .content{position:relative;box-sizing:border-box;display:inline-flex;flex-direction:row;align-items:center;justify-content:center;white-space:nowrap;transition:150ms color linear;max-height:calc(var(--_tab-content-height) + 2 * var(--_tab-content-padding-block));min-height:var(--_tab-content-height);width:100%;padding-block:var(--_tab-content-padding-block);padding-inline:var(--_tab-content-padding-inline);gap:var(--_tab-content-spacing)}.forge-tab .content .label{display:inline-block;line-height:1}.forge-tab .indicator{position:absolute;box-sizing:border-box;z-index:-1;transform-origin:bottom left;background:var(--_tab-indicator-color);border-radius:var(--_tab-indicator-shape);height:var(--_tab-indicator-height);min-width:100%;inset:auto 0 0;opacity:0}::slotted(*),:host{white-space:nowrap}forge-focus-indicator{--forge-focus-indicator-color:var(--_tab-active-color);--forge-focus-indicator-shape:8px}forge-state-layer{--forge-state-layer-color:var(--_tab-inactive-color)}:host(:focus) .forge-tab{color:var(--_tab-focus-label-text-color)}:host(:focus) .forge-tab ::slotted([slot=leading]),:host(:focus) .forge-tab ::slotted([slot=trailing]){color:var(--_tab-focus-icon-color)}:host(:active) .forge-tab{color:var(--_tab-pressed-label-text-color);outline:0}:host(:active) .forge-tab ::slotted([slot=leading]),:host(:active) .forge-tab ::slotted([slot=trailing]){color:var(--_tab-pressed-icon-color)}:host([disabled]){cursor:not-allowed}:host([disabled]) .forge-tab{opacity:var(--_tab-disabled-opacity);pointer-events:none}:host([selected]) .forge-tab{color:var(--_tab-active-label-text-color)}:host([selected]) .forge-tab ::slotted([slot=end]),:host([selected]) .forge-tab ::slotted([slot=leading]),:host([selected]) .forge-tab ::slotted([slot=start]),:host([selected]) .forge-tab ::slotted([slot=trailing]){color:var(--_tab-active-icon-color)}:host([selected]) .forge-tab:hover{color:var(--_tab-active-hover-label-text-color)}:host([selected]) .forge-tab:hover ::slotted([slot=end]),:host([selected]) .forge-tab:hover ::slotted([slot=leading]),:host([selected]) .forge-tab:hover ::slotted([slot=start]),:host([selected]) .forge-tab:hover ::slotted([slot=trailing]){color:var(--_tab-active-hover-icon-color)}:host([selected]) .forge-tab .indicator{opacity:1}:host([selected]) forge-state-layer{--forge-state-layer-color:var(--_tab-active-color)}:host([selected]:not([vertical])) forge-focus-indicator{--forge-focus-indicator-offset-block:0 calc(var(--_tab-indicator-height) + 1px)}:host([selected]:focus) .forge-tab{color:var(--_tab-active-focus-label-text-color)}:host([selected]:focus) .forge-tab ::slotted([slot=leading]),:host([selected]:focus) .forge-tab ::slotted([slot=trailing]){color:var(--_tab-active-focus-icon-color)}:host([selected]:active) .forge-tab{color:var(--_tab-active-pressed-label-text-color)}:host([selected]:active) .forge-tab ::slotted([slot=leading]),:host([selected]:active) .forge-tab ::slotted([slot=trailing]){color:var(--_tab-active-pressed-icon-color)}:host([stacked]) .forge-tab{--_tab-height:var(--_tab-stacked-height)}:host([stacked]) .forge-tab .content{max-height:none;flex-direction:column;height:100%}:host([vertical]) .forge-tab{--_tab-padding-inline:var(--forge-tab-padding-inline, 0);width:100%;flex-direction:row;border-bottom:none}:host([vertical]) .forge-tab .content{width:100%;min-height:100%}:host([vertical]) .forge-tab .indicator{height:100%;min-width:var(--_tab-indicator-height);inset:0 0 0 auto}:host([vertical]) forge-focus-indicator{--forge-focus-indicator-offset-inline:0 calc(var(--_tab-indicator-height) + 1px)}:host([vertical]) .forge-tab{--_tab-indicator-shape:var(--_tab-vertical-indicator-shape)}:host([inverted]) .forge-tab{--_tab-indicator-shape:var(--_tab-inverted-indicator-shape)}:host([inverted]) .indicator{inset:0 0 auto;transform-origin:top left}:host([inverted][vertical]) .forge-tab{--_tab-indicator-shape:var(--_tab-vertical-inverted-indicator-shape)}:host([inverted][vertical]) .indicator{inset:0 auto 0 0}';
+
+import { __decorate } from 'tslib';
+import { attachShadowTemplate, coerceBoolean, coreProperty, customElement } from '@tylertech/forge-core';
+import { TabAdapter } from './tab-adapter.js';
+import { TabCore } from './tab-core.js';
+import { TAB_CONSTANTS } from './tab-constants.js';
+import { BaseComponent } from '../../core/base/base-component.js';
+import { FocusIndicatorComponent } from '../../focus-indicator/focus-indicator.js';
+import { StateLayerComponent } from '../../state-layer/state-layer.js';
+import template from './tab.html.js';
+import styles from './tab.scss.js';
+
 /**
  * @tag forge-tab
  *
@@ -148,4 +150,5 @@ TabComponent = __decorate([
         dependencies: [FocusIndicatorComponent, StateLayerComponent]
     })
 ], TabComponent);
+
 export { TabComponent };

package/esm/tabs/tab/tab.scss.js

@@ -0,0 +1,9 @@
+/**
+ * @license
+ * Copyright Tyler Technologies, Inc.
+ * License: Apache-2.0
+ */
+
+var styles = ":host{display:inline-flex;outline:none;-webkit-tap-highlight-color:rgba(0,0,0,0);vertical-align:middle}:host([hidden]){display:none}.forge-tab{--_tab-active-color:var(--forge-tab-active-color, var(--forge-theme-primary, #3f51b5));--_tab-inactive-color:var(--forge-tab-inactive-color, var(--forge-theme-text-medium, rgba(0, 0, 0, 0.6)));--_tab-height:var(--forge-tab-height, 48px);--_tab-stacked-height:var(--forge-tab-stacked-height, 64px);--_tab-padding-block:var(--forge-tab-padding-block, 0);--_tab-padding-inline:var(--forge-tab-padding-inline, 0);--_tab-disabled-opacity:var(--forge-tab-disabled-opacity, 0.38);--_tab-indicator-color:var(--forge-tab-indicator-color, var(--_tab-active-color));--_tab-indicator-height:var(--forge-tab-indicator-height, 3px);--_tab-indicator-shape:var(--forge-tab-indicator-shape, 3px 3px 0 0);--_tab-vertical-indicator-shape:var(--forge-tab-vertical-indicator-shape, 3px 0 0 3px);--_tab-secondary-indicator-height:var(--forge-tab-secondary-indicator-height, 2px);--_tab-secondary-indicator-shape:var(--forge-tab-secondary-indicator-shape, 0);--_tab-inverted-indicator-shape:var(--forge-tab-inverted-indicator-shape, 0 0 3px 3px);--_tab-vertical-inverted-indicator-shape:var(--forge-tab-vertical-inverted-indicator-shape, 0 3px 3px 0);--_tab-container-color:var(--forge-tab-container-color, transparent);--_tab-container-height:var(--forge-tab-container-height, var(--_tab-height));--_tab-container-shape:var(--forge-tab-container-shape, 0);--_tab-content-height:var(--forge-tab-content-height, var(--_tab-height));--_tab-content-spacing:var(--forge-tab-content-spacing, var(--forge-spacing-xsmall, 8px));--_tab-content-padding:var(--forge-tab-content-padding, var(--forge-spacing-xxsmall, 4px));--_tab-content-padding-block:var(--forge-tab-content-padding-block, var(--_tab-content-padding));--_tab-content-padding-inline:var(--forge-tab-content-padding-inline, var(--forge-spacing-medium, 16px));--_tab-content-padding-inline-secondary:var(--forge-tab-content-padding-inline-secondary, var(--forge-spacing-medium, 16px));--_tab-active-focus-icon-color:var(--forge-tab-active-focus-icon-color, var(--_tab-active-color));--_tab-active-hover-icon-color:var(--forge-tab-active-hover-icon-color, var(--_tab-active-color));--_tab-active-icon-color:var(--forge-tab-active-icon-color, var(--_tab-active-color));--_tab-active-pressed-icon-color:var(--forge-tab-active-pressed-icon-color, var(--_tab-active-color));--_tab-icon-size:var(--forge-tab-icon-size, 24px);--_tab-focus-icon-color:var(--forge-tab-focus-icon-color, var(--_tab-inactive-color));--_tab-hover-icon-color:var(--forge-tab-hover-icon-color, var(--_tab-inactive-color));--_tab-icon-color:var(--forge-tab-icon-color, var(--_tab-inactive-color));--_tab-pressed-icon-color:var(--forge-tab-pressed-icon-color, var(--_tab-inactive-color));--_tab-active-focus-label-text-color:var(--forge-tab-active-focus-label-text-color, var(--_tab-active-color));--_tab-active-hover-label-text-color:var(--forge-tab-active-hover-label-text-color, var(--_tab-active-color));--_tab-active-label-text-color:var(--forge-tab-active-label-text-color, var(--_tab-active-color));--_tab-active-pressed-label-text-color:var(--forge-tab-active-pressed-label-text-color, var(--_tab-active-color));--_tab-focus-label-text-color:var(--forge-tab-focus-label-text-color, var(--_tab-inactive-color));--_tab-hover-label-text-color:var(--forge-tab-hover-label-text-color, var(--_tab-inactive-color));--_tab-label-text-color:var(--forge-tab-label-text-color, var(--_tab-inactive-color));--_tab-pressed-label-text-color:var(--forge-tab-pressed-label-text-color, var(--_tab-inactive-color))}.forge-tab{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:var(--forge-typography-button-font-family, var(--forge-typography-font-family, \"Roboto\", sans-serif));font-size:var(--forge-typography-button-font-size, calc(var(--forge-typography-font-size, 1rem) * var(--forge-typography-button-font-size-scale, 0.875)));font-weight:var(--forge-typography-button-font-weight, 500);line-height:var(--forge-typography-button-line-height, normal);letter-spacing:var(--forge-typography-button-letter-spacing, 0.0714285714em);text-transform:var(--forge-typography-button-text-transform, inherit);text-decoration:var(--forge-typography-button-text-decoration, inherit);display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box;border:none;outline:none;user-select:none;-webkit-appearance:none;vertical-align:middle;background:rgba(0,0,0,0);text-decoration:none;width:100%;position:relative;padding-block:var(--_tab-padding-block);padding-inline:var(--_tab-padding-inline);margin:0;z-index:0;background-color:var(--_tab-container-color);color:var(--_tab-label-text-color);min-height:var(--_tab-container-height)}.forge-tab::-moz-focus-inner{padding:0;border:0}.forge-tab ::slotted([slot=leading]),.forge-tab ::slotted([slot=trailing]){display:inline-flex;position:relative;writing-mode:horizontal-tb;fill:currentColor;color:var(--_tab-icon-color);font-size:var(--_tab-icon-size);width:var(--_tab-icon-size);height:var(--_tab-icon-size)}.forge-tab:hover{color:var(--_tab-hover-label-text-color);cursor:pointer}.forge-tab:hover ::slotted([slot=leading]),.forge-tab:hover ::slotted([slot=trailing]){color:var(--_tab-hover-icon-color)}.forge-tab .content{position:relative;box-sizing:border-box;display:inline-flex;flex-direction:row;align-items:center;justify-content:center;white-space:nowrap;transition:150ms color linear;max-height:calc(var(--_tab-content-height) + 2*var(--_tab-content-padding-block));min-height:var(--_tab-content-height);width:100%;padding-block:var(--_tab-content-padding-block);padding-inline:var(--_tab-content-padding-inline);gap:var(--_tab-content-spacing)}.forge-tab .content .label{display:inline-block;line-height:1}.forge-tab .indicator{position:absolute;box-sizing:border-box;z-index:-1;transform-origin:bottom left;background:var(--_tab-indicator-color);border-radius:var(--_tab-indicator-shape);height:var(--_tab-indicator-height);min-width:100%;inset:auto 0 0;opacity:0}:host,::slotted(*){white-space:nowrap}forge-focus-indicator{--forge-focus-indicator-color: var(--_tab-active-color);--forge-focus-indicator-shape: 8px}forge-state-layer{--forge-state-layer-color: var(--_tab-inactive-color)}:host(:focus) .forge-tab{color:var(--_tab-focus-label-text-color)}:host(:focus) .forge-tab ::slotted([slot=leading]),:host(:focus) .forge-tab ::slotted([slot=trailing]){color:var(--_tab-focus-icon-color)}:host(:active) .forge-tab{color:var(--_tab-pressed-label-text-color);outline:none}:host(:active) .forge-tab ::slotted([slot=leading]),:host(:active) .forge-tab ::slotted([slot=trailing]){color:var(--_tab-pressed-icon-color)}:host([disabled]){cursor:not-allowed}:host([disabled]) .forge-tab{opacity:var(--_tab-disabled-opacity);pointer-events:none}:host([selected]) .forge-tab{color:var(--_tab-active-label-text-color)}:host([selected]) .forge-tab ::slotted([slot=start]),:host([selected]) .forge-tab ::slotted([slot=end]),:host([selected]) .forge-tab ::slotted([slot=leading]),:host([selected]) .forge-tab ::slotted([slot=trailing]){color:var(--_tab-active-icon-color)}:host([selected]) .forge-tab:hover{color:var(--_tab-active-hover-label-text-color)}:host([selected]) .forge-tab:hover ::slotted([slot=start]),:host([selected]) .forge-tab:hover ::slotted([slot=end]),:host([selected]) .forge-tab:hover ::slotted([slot=leading]),:host([selected]) .forge-tab:hover ::slotted([slot=trailing]){color:var(--_tab-active-hover-icon-color)}:host([selected]) .forge-tab .indicator{opacity:1}:host([selected]) forge-state-layer{--forge-state-layer-color: var(--_tab-active-color)}:host([selected]:not([vertical])) forge-focus-indicator{--forge-focus-indicator-offset-block: 0 calc(var(--_tab-indicator-height) + 1px)}:host([selected]:focus) .forge-tab{color:var(--_tab-active-focus-label-text-color)}:host([selected]:focus) .forge-tab ::slotted([slot=leading]),:host([selected]:focus) .forge-tab ::slotted([slot=trailing]){color:var(--_tab-active-focus-icon-color)}:host([selected]:active) .forge-tab{color:var(--_tab-active-pressed-label-text-color)}:host([selected]:active) .forge-tab ::slotted([slot=leading]),:host([selected]:active) .forge-tab ::slotted([slot=trailing]){color:var(--_tab-active-pressed-icon-color)}:host([stacked]) .forge-tab{--_tab-height:var(--_tab-stacked-height)}:host([stacked]) .forge-tab .content{max-height:none;flex-direction:column;height:100%}:host([vertical]) .forge-tab{--_tab-padding-inline:var(--forge-tab-padding-inline, 0);width:100%;flex-direction:row;border-bottom:none}:host([vertical]) .forge-tab .content{width:100%;min-height:100%}:host([vertical]) .forge-tab .indicator{height:100%;min-width:var(--_tab-indicator-height);inset:0 0 0 auto}:host([vertical]) forge-focus-indicator{--forge-focus-indicator-offset-inline: 0 calc(var(--_tab-indicator-height) + 1px)}:host([vertical]) .forge-tab{--_tab-indicator-shape:var(--_tab-vertical-indicator-shape)}:host([inverted]) .forge-tab{--_tab-indicator-shape:var(--_tab-inverted-indicator-shape)}:host([inverted]) .indicator{inset:0 0 auto;transform-origin:top left}:host([inverted][vertical]) .forge-tab{--_tab-indicator-shape:var(--_tab-vertical-inverted-indicator-shape)}:host([inverted][vertical]) .indicator{inset:0 auto 0 0}";
+
+export { styles as default };

package/esm/tabs/tab-bar/index.d.ts

@@ -1,10 +1,5 @@
-/**
- * @license
- * Copyright Tyler Technologies, Inc. 
- * License: Apache-2.0
- */
-export * from './tab-bar-adapter';
-export * from './tab-bar-constants';
-export * from './tab-bar-core';
-export * from './tab-bar';
+export * from './tab-bar-adapter.js';
+export * from './tab-bar-constants.js';
+export * from './tab-bar-core.js';
+export * from './tab-bar.js';
 export declare function defineTabBarComponent(): void;

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

@@ -1,14 +1,17 @@
 /**
  * @license
- * Copyright Tyler Technologies, Inc. 
+ * Copyright Tyler Technologies, Inc.
  * License: Apache-2.0
  */
+
 import { defineCustomElement } from '@tylertech/forge-core';
-import { TabBarComponent } from './tab-bar';
-export * from './tab-bar-adapter';
-export * from './tab-bar-constants';
-export * from './tab-bar-core';
-export * from './tab-bar';
-export function defineTabBarComponent() {
+import { TabBarComponent } from './tab-bar.js';
+export { TabBarAdapter } from './tab-bar-adapter.js';
+export { NAVIGATION_KEYS, TAB_BAR_CONSTANTS } from './tab-bar-constants.js';
+export { TabBarCore } from './tab-bar-core.js';
+
+function defineTabBarComponent() {
     defineCustomElement(TabBarComponent);
 }
+
+export { TabBarComponent, defineTabBarComponent };

package/esm/tabs/tab-bar/tab-bar-adapter.d.ts

@@ -1,11 +1,6 @@
-/**
- * @license
- * Copyright Tyler Technologies, Inc. 
- * License: Apache-2.0
- */
-import { BaseAdapter, IBaseAdapter } from '../../core/base/base-adapter';
-import { ITabComponent } from '../tab/tab';
-import { ITabBarComponent } from './tab-bar';
+import { BaseAdapter, IBaseAdapter } from '../../core/base/base-adapter.js';
+import { ITabComponent } from '../tab/tab.js';
+import { ITabBarComponent } from './tab-bar.js';
 export interface ITabBarAdapter extends IBaseAdapter {
     initializeContainerSizeObserver(listener: () => void): void;
     destroyContainerSizeObserver(): void;

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

@@ -1,14 +1,16 @@
 /**
  * @license
- * Copyright Tyler Technologies, Inc. 
+ * Copyright Tyler Technologies, Inc.
  * License: Apache-2.0
  */
+
 import { getShadowElement, toggleAttribute } from '@tylertech/forge-core';
-import { tylIconKeyboardArrowLeft, tylIconKeyboardArrowRight, tylIconKeyboardArrowUp, tylIconKeyboardArrowDown } from '@tylertech/tyler-icons';
-import { BaseAdapter } from '../../core/base/base-adapter';
-import { TAB_CONSTANTS } from '../tab/tab-constants';
-import { TAB_BAR_CONSTANTS } from './tab-bar-constants';
-export class TabBarAdapter extends BaseAdapter {
+import { tylIconKeyboardArrowUp, tylIconKeyboardArrowLeft, tylIconKeyboardArrowDown, tylIconKeyboardArrowRight } from '@tylertech/tyler-icons';
+import { BaseAdapter } from '../../core/base/base-adapter.js';
+import { TAB_CONSTANTS } from '../tab/tab-constants.js';
+import { TAB_BAR_CONSTANTS } from './tab-bar-constants.js';
+
+class TabBarAdapter extends BaseAdapter {
     constructor(component) {
         super(component);
         this._defaultSlotElement = getShadowElement(this._component, TAB_BAR_CONSTANTS.selectors.DEFAULT_SLOT);
@@ -140,3 +142,5 @@ export class TabBarAdapter extends BaseAdapter {
         return iconButton;
     }
 }
+
+export { TabBarAdapter };

package/esm/tabs/tab-bar/tab-bar-constants.d.ts

@@ -1,8 +1,3 @@
-/**
- * @license
- * Copyright Tyler Technologies, Inc. 
- * License: Apache-2.0
- */
 export declare const TAB_BAR_CONSTANTS: {
     elementName: "forge-tab-bar";
     observedAttributes: {

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

@@ -1,9 +1,11 @@
 /**
  * @license
- * Copyright Tyler Technologies, Inc. 
+ * Copyright Tyler Technologies, Inc.
  * License: Apache-2.0
  */
-import { COMPONENT_NAME_PREFIX } from '../../constants';
+
+import { COMPONENT_NAME_PREFIX } from '../../constants.js';
+
 const elementName = `${COMPONENT_NAME_PREFIX}tab-bar`;
 const observedAttributes = {
     DISABLED: 'disabled',
@@ -33,7 +35,7 @@ const events = {
 const numbers = {
     SCROLL_MARGIN: 48
 };
-export const TAB_BAR_CONSTANTS = {
+const TAB_BAR_CONSTANTS = {
     elementName,
     observedAttributes,
     attributes,
@@ -42,8 +44,10 @@ export const TAB_BAR_CONSTANTS = {
     classes,
     numbers
 };
-export const NAVIGATION_KEYS = new Map([
+const NAVIGATION_KEYS = new Map([
     ['default', new Set(['Home', 'End'])],
     ['horizontal', new Set(['ArrowLeft', 'ArrowRight'])],
     ['vertical', new Set(['ArrowUp', 'ArrowDown'])]
 ]);
+
+export { NAVIGATION_KEYS, TAB_BAR_CONSTANTS };

package/esm/tabs/tab-bar/tab-bar-core.d.ts

@@ -1,9 +1,4 @@
-/**
- * @license
- * Copyright Tyler Technologies, Inc. 
- * License: Apache-2.0
- */
-import { ITabBarAdapter } from './tab-bar-adapter';
+import { ITabBarAdapter } from './tab-bar-adapter.js';
 export interface ITabBarCore {
     disabled: boolean;
     activeTab: number | null | undefined;

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

@@ -1,11 +1,13 @@
 /**
  * @license
- * Copyright Tyler Technologies, Inc. 
+ * Copyright Tyler Technologies, Inc.
  * License: Apache-2.0
  */
-import { NAVIGATION_KEYS, TAB_BAR_CONSTANTS } from './tab-bar-constants';
-import { TAB_CONSTANTS } from '../tab/tab-constants';
-export class TabBarCore {
+
+import { NAVIGATION_KEYS, TAB_BAR_CONSTANTS } from './tab-bar-constants.js';
+import { TAB_CONSTANTS } from '../tab/tab-constants.js';
+
+class TabBarCore {
     constructor(_adapter) {
         this._adapter = _adapter;
         // State
@@ -337,3 +339,5 @@ export class TabBarCore {
         }
     }
 }
+
+export { TabBarCore };

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

@@ -1,12 +1,7 @@
-/**
- * @license
- * Copyright Tyler Technologies, Inc. 
- * License: Apache-2.0
- */
-import { BaseComponent, IBaseComponent } from '../../core/base/base-component';
-import { ITabBarChangeEventData } from './tab-bar-constants';
-import { IWithElementInternals } from '../../core/mixins/internals/with-element-internals';
-import { IWithDefaultAria } from '../../core/mixins/internals/with-default-aria';
+import { BaseComponent, IBaseComponent } from '../../core/base/base-component.js';
+import { ITabBarChangeEventData } from './tab-bar-constants.js';
+import { IWithElementInternals } from '../../core/mixins/internals/with-element-internals.js';
+import { IWithDefaultAria } from '../../core/mixins/internals/with-default-aria.js';
 export interface ITabBarComponent extends IBaseComponent, IWithDefaultAria, IWithElementInternals {
     disabled: boolean;
     activeTab: number | null | undefined;
@@ -27,7 +22,7 @@ declare global {
         'forge-tab-bar-change': CustomEvent<ITabBarChangeEventData>;
     }
 }
-declare const TabBarComponent_base: import("../../constants").AbstractConstructor<import("../../core/mixins/internals/with-default-aria").WithDefaultAriaContract> & import("../../constants").AbstractConstructor<import("../../core/mixins/internals/with-element-internals").WithElementInternalsContract> & typeof BaseComponent;
+declare const TabBarComponent_base: import("../../constants.js").AbstractConstructor<import("../../core/mixins/internals/with-default-aria.js").WithDefaultAriaContract> & import("../../constants.js").AbstractConstructor<import("../../core/mixins/internals/with-element-internals.js").WithElementInternalsContract> & typeof BaseComponent;
 /**
  * @tag forge-tab-bar
  *

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

@@ -0,0 +1,9 @@
+/**
+ * @license
+ * Copyright Tyler Technologies, Inc.
+ * License: Apache-2.0
+ */
+
+var template = "<template>\n  <div class=\"forge-tab-bar\" part=\"container\">\n    <div class=\"scroll-container\" part=\"scroll-container\">\n      <slot></slot>\n    </div>\n  </div>\n</template>\n";
+
+export { template as default };

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

@@ -1,23 +1,28 @@
 /**
  * @license
- * Copyright Tyler Technologies, Inc. 
+ * Copyright Tyler Technologies, Inc.
  * License: Apache-2.0
  */
-import { __decorate } from "tslib";
-import { attachShadowTemplate, coerceBoolean, coerceNumber, customElement, coreProperty } from '@tylertech/forge-core';
-import { IconComponent, IconRegistry } from '../../icon';
-import { IconButtonComponent } from '../../icon-button';
-import { BaseComponent } from '../../core/base/base-component';
-import { TabComponent } from '../tab/tab';
-import { TabBarAdapter } from './tab-bar-adapter';
-import { TAB_BAR_CONSTANTS } from './tab-bar-constants';
-import { TabBarCore } from './tab-bar-core';
+
+import { __decorate } from 'tslib';
+import { attachShadowTemplate, coerceBoolean, coerceNumber, coreProperty, customElement } from '@tylertech/forge-core';
+import '../../icon/index.js';
+import '../../icon-button/index.js';
+import { BaseComponent } from '../../core/base/base-component.js';
+import { TabComponent } from '../tab/tab.js';
+import { TabBarAdapter } from './tab-bar-adapter.js';
+import { TAB_BAR_CONSTANTS } from './tab-bar-constants.js';
+import { TabBarCore } from './tab-bar-core.js';
 import { tylIconKeyboardArrowLeft, tylIconKeyboardArrowRight, tylIconKeyboardArrowUp, tylIconKeyboardArrowDown } from '@tylertech/tyler-icons';
-import { WithElementInternals } from '../../core/mixins/internals/with-element-internals';
-import { WithDefaultAria } from '../../core/mixins/internals/with-default-aria';
-import { setDefaultAria } from '../../constants';
-const template = '<template><div class=\"forge-tab-bar\" part=\"container\"><div class=\"scroll-container\" part=\"scroll-container\"><slot></slot></div></div></template>';
-const styles = ':host{position:relative;display:block}:host([hidden]){display:none}.forge-tab-bar{--_tab-bar-justify:var(--forge-tab-bar-justify, space-between);--_tab-bar-stretch:var(--forge-tab-bar-stretch, 1);--_tab-bar-divider-color:var(--forge-tab-bar-divider-color, var(--forge-theme-outline, #e0e0e0));--_tab-bar-divider-thickness:var(--forge-tab-bar-divider-thickness, 1px)}.forge-tab-bar{position:relative;display:grid;grid-template-columns:auto 1fr auto;max-width:100%;max-height:100%;align-items:center;border-bottom:var(--_tab-bar-divider-thickness) solid var(--_tab-bar-divider-color)}.scroll-container{position:relative;display:flex;justify-content:var(--_tab-bar-justify);align-items:flex-end;box-sizing:border-box;overflow:auto;scroll-behavior:smooth;scrollbar-width:none;grid-column:2}.scroll-container::-webkit-scrollbar{display:none}::slotted(*){flex:var(--_tab-bar-stretch);align-self:stretch}::slotted([selected]){z-index:1}forge-icon-button{--forge-icon-button-shape-squared:0px}:host([vertical]) .forge-tab-bar{grid-template-columns:none;grid-template-rows:auto 1fr auto;align-items:initial;border-bottom:none;border-right:var(--_tab-bar-divider-thickness) solid var(--_tab-bar-divider-color);height:100%}:host([vertical]) .scroll-container{display:inline-flex;flex-direction:column;align-items:stretch;gap:0;grid-column:auto;grid-row:2}:host([vertical]) .scroll-button{justify-self:center}:host([inverted]:not([vertical])) .forge-tab-bar{border-bottom:none;border-top:variale(divider-thickness) solid var(--_tab-bar-divider-color)}:host([inverted][vertical]) .forge-tab-bar{border-bottom:none;border-top:var(--_tab-bar-divider-thickness) solid var(--_tab-bar-divider-color)}:host([clustered]) .forge-tab-bar{--_tab-bar-justify:var(--forge-tab-bar-justify, flex-start);--_tab-bar-stretch:var(--forge-tab-bar-stretch, 0)}:host([clustered=start]) .forge-tab-bar{--_tab-bar-justify:var(--forge-tab-bar-justify, flex-start)}:host([clustered=center]) .forge-tab-bar{--_tab-bar-justify:var(--forge-tab-bar-justify, center)}:host([clustered=end]) .forge-tab-bar{--_tab-bar-justify:var(--forge-tab-bar-justify, flex-end)}:host([theme=app-bar]){--forge-tab-active-color:var(--_app-bar-theme-foreground);--forge-tab-inactive-color:var(--_app-bar-theme-foreground-muted)}:host([theme=app-bar]) forge-icon-button{--forge-icon-button-icon-color:var(--_app-bar-theme-foreground)}';
+import { WithElementInternals } from '../../core/mixins/internals/with-element-internals.js';
+import { WithDefaultAria } from '../../core/mixins/internals/with-default-aria.js';
+import { setDefaultAria } from '../../constants.js';
+import template from './tab-bar.html.js';
+import styles from './tab-bar.scss.js';
+import { IconRegistry } from '../../icon/icon-registry.js';
+import { IconButtonComponent } from '../../icon-button/icon-button.js';
+import { IconComponent } from '../../icon/icon.js';
+
 /**
  * @tag forge-tab-bar
  *
@@ -143,4 +148,5 @@ TabBarComponent = __decorate([
         dependencies: [TabComponent, IconButtonComponent, IconComponent]
     })
 ], TabBarComponent);
+
 export { TabBarComponent };

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

@@ -0,0 +1,9 @@
+/**
+ * @license
+ * Copyright Tyler Technologies, Inc.
+ * License: Apache-2.0
+ */
+
+var styles = ":host{position:relative;display:block}:host([hidden]){display:none}.forge-tab-bar{--_tab-bar-justify:var(--forge-tab-bar-justify, space-between);--_tab-bar-stretch:var(--forge-tab-bar-stretch, 1);--_tab-bar-divider-color:var(--forge-tab-bar-divider-color, var(--forge-theme-outline, #e0e0e0));--_tab-bar-divider-thickness:var(--forge-tab-bar-divider-thickness, 1px)}.forge-tab-bar{position:relative;display:grid;grid-template-columns:auto 1fr auto;max-width:100%;max-height:100%;align-items:center;border-bottom:var(--_tab-bar-divider-thickness) solid var(--_tab-bar-divider-color)}.scroll-container{position:relative;display:flex;justify-content:var(--_tab-bar-justify);align-items:flex-end;box-sizing:border-box;overflow:auto;scroll-behavior:smooth;scrollbar-width:none;grid-column:2}.scroll-container::-webkit-scrollbar{display:none}::slotted(*){flex:var(--_tab-bar-stretch);align-self:stretch}::slotted([selected]){z-index:1}forge-icon-button{--forge-icon-button-shape-squared: 0px}:host([vertical]) .forge-tab-bar{grid-template-columns:none;grid-template-rows:auto 1fr auto;align-items:initial;border-bottom:none;border-right:var(--_tab-bar-divider-thickness) solid var(--_tab-bar-divider-color);height:100%}:host([vertical]) .scroll-container{display:inline-flex;flex-direction:column;align-items:stretch;gap:0;grid-column:auto;grid-row:2}:host([vertical]) .scroll-button{justify-self:center}:host([inverted]:not([vertical])) .forge-tab-bar{border-bottom:none;border-top:variale(divider-thickness) solid var(--_tab-bar-divider-color)}:host([inverted][vertical]) .forge-tab-bar{border-bottom:none;border-top:var(--_tab-bar-divider-thickness) solid var(--_tab-bar-divider-color)}:host([clustered]) .forge-tab-bar{--_tab-bar-justify:var(--forge-tab-bar-justify, flex-start);--_tab-bar-stretch:var(--forge-tab-bar-stretch, 0)}:host([clustered=start]) .forge-tab-bar{--_tab-bar-justify:var(--forge-tab-bar-justify, flex-start)}:host([clustered=center]) .forge-tab-bar{--_tab-bar-justify:var(--forge-tab-bar-justify, center)}:host([clustered=end]) .forge-tab-bar{--_tab-bar-justify:var(--forge-tab-bar-justify, flex-end)}:host([theme=app-bar]){--forge-tab-active-color: var(--_app-bar-theme-foreground);--forge-tab-inactive-color: var(--_app-bar-theme-foreground-muted)}:host([theme=app-bar]) forge-icon-button{--forge-icon-button-icon-color: var(--_app-bar-theme-foreground)}";
+
+export { styles as default };

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

@@ -1,11 +1,6 @@
-/**
- * @license
- * Copyright Tyler Technologies, Inc. 
- * License: Apache-2.0
- */
-export * from './text-field';
-export * from './text-field-adapter';
-export * from './text-field-constants';
-export * from './text-field-core';
-export * from './text-field-component-delegate';
+export * from './text-field.js';
+export * from './text-field-adapter.js';
+export * from './text-field-constants.js';
+export * from './text-field-core.js';
+export * from './text-field-component-delegate.js';
 export declare function defineTextFieldComponent(): void;

package/esm/text-field/index.js

@@ -1,15 +1,18 @@
 /**
  * @license
- * Copyright Tyler Technologies, Inc. 
+ * Copyright Tyler Technologies, Inc.
  * License: Apache-2.0
  */
+
 import { defineCustomElement } from '@tylertech/forge-core';
-import { TextFieldComponent } from './text-field';
-export * from './text-field';
-export * from './text-field-adapter';
-export * from './text-field-constants';
-export * from './text-field-core';
-export * from './text-field-component-delegate';
-export function defineTextFieldComponent() {
+import { TextFieldComponent } from './text-field.js';
+export { TextFieldAdapter } from './text-field-adapter.js';
+export { TEXT_FIELD_CONSTANTS } from './text-field-constants.js';
+export { TextFieldCore } from './text-field-core.js';
+export { TextFieldComponentDelegate } from './text-field-component-delegate.js';
+
+function defineTextFieldComponent() {
     defineCustomElement(TextFieldComponent);
 }
+
+export { TextFieldComponent, defineTextFieldComponent };

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

@@ -1,12 +1,7 @@
-/**
- * @license
- * Copyright Tyler Technologies, Inc. 
- * License: Apache-2.0
- */
-import { IFieldComponent } from '../field';
-import { BaseFieldAdapter, IBaseFieldAdapter } from '../field/base/base-field-adapter';
-import { ITextFieldComponent } from './text-field';
-import { TextFieldInputAttributeObserver, TextFieldValueChangeListener } from './text-field-constants';
+import { IFieldComponent } from '../field/index.js';
+import { BaseFieldAdapter, IBaseFieldAdapter } from '../field/base/base-field-adapter.js';
+import { ITextFieldComponent } from './text-field.js';
+import { TextFieldInputAttributeObserver, TextFieldValueChangeListener } from './text-field-constants.js';
 export interface ITextFieldAdapter extends IBaseFieldAdapter {
     readonly popoverTargetElement: HTMLElement;
     addRootListener(name: keyof HTMLElementEventMap, listener: EventListener): void;

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

@@ -1,13 +1,16 @@
 /**
  * @license
- * Copyright Tyler Technologies, Inc. 
+ * Copyright Tyler Technologies, Inc.
  * License: Apache-2.0
  */
-import { getShadowElement, listenOwnProperty, randomChars, toggleAttribute } from '@tylertech/forge-core';
-import { FIELD_CONSTANTS } from '../field';
-import { BaseFieldAdapter } from '../field/base/base-field-adapter';
-import { TEXT_FIELD_CONSTANTS } from './text-field-constants';
-export class TextFieldAdapter extends BaseFieldAdapter {
+
+import { getShadowElement, toggleAttribute, listenOwnProperty, randomChars } from '@tylertech/forge-core';
+import '../field/index.js';
+import { BaseFieldAdapter } from '../field/base/base-field-adapter.js';
+import { TEXT_FIELD_CONSTANTS } from './text-field-constants.js';
+import { FIELD_CONSTANTS } from '../field/field-constants.js';
+
+class TextFieldAdapter extends BaseFieldAdapter {
     get hasValue() {
         return this._inputElements.some(el => !!el.value);
     }
@@ -165,3 +168,5 @@ export class TextFieldAdapter extends BaseFieldAdapter {
         return Array.from(this._component.shadowRoot?.querySelectorAll('slot') ?? []);
     }
 }
+
+export { TextFieldAdapter };

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

@@ -1,11 +1,6 @@
-/**
- * @license
- * Copyright Tyler Technologies, Inc. 
- * License: Apache-2.0
- */
-import { IBaseComponentDelegateConfig } from '../core/delegates/base-component-delegate';
-import { FormFieldComponentDelegate, IFormFieldComponentDelegateOptions } from '../core/delegates/form-field-component-delegate';
-import { ITextFieldComponent } from './text-field';
+import { IBaseComponentDelegateConfig } from '../core/delegates/base-component-delegate.js';
+import { FormFieldComponentDelegate, IFormFieldComponentDelegateOptions } from '../core/delegates/form-field-component-delegate.js';
+import { ITextFieldComponent } from './text-field.js';
 export type TextFieldComponentDelegateProps = Partial<ITextFieldComponent>;
 export interface ITextFieldComponentDelegateOptions extends IFormFieldComponentDelegateOptions {
     id?: string;
@@ -40,9 +35,9 @@ export declare class TextFieldComponentDelegate extends FormFieldComponentDelega
     set invalid(value: boolean);
     get inputElement(): HTMLInputElement;
     get labelElement(): HTMLLabelElement | undefined;
-    onChange(listener: (value: string) => void): void;
-    onFocus(listener: (evt: Event) => void): void;
-    onBlur(listener: (evt: Event) => void): void;
+    onChange(listener: (value: string) => void, options?: AddEventListenerOptions): void;
+    onFocus(listener: (evt: Event) => void, options?: AddEventListenerOptions): void;
+    onBlur(listener: (evt: Event) => void, options?: AddEventListenerOptions): void;
     setLabel(text: string | null): void;
     setSupportText(text: string | null): void;
     setHelperText(text: string | null): void;