@tylertech/forge 2.1.0 → 2.2.0

package/esm/icon-button/icon-button-component-delegate.js

@@ -13,10 +13,19 @@ export class IconButtonComponentDelegate extends BaseComponentDelegate {
         super(config);
     }
     _build() {
+        var _a;
         const component = document.createElement(ICON_BUTTON_CONSTANTS.elementName);
         this._buttonElement = document.createElement('button');
         this._buttonElement.type = 'button';
         component.appendChild(this._buttonElement);
+        if ((_a = this._config.options) === null || _a === void 0 ? void 0 : _a.tooltip) {
+            const tooltip = document.createElement('forge-tooltip');
+            tooltip.textContent = this._config.options.tooltip;
+            if (this._config.options.tooltipPosition) {
+                tooltip.position = this._config.options.tooltipPosition;
+            }
+            component.appendChild(tooltip);
+        }
         return component;
     }
     get iconElement() {
@@ -28,9 +37,13 @@ export class IconButtonComponentDelegate extends BaseComponentDelegate {
     set disabled(value) {
         this._buttonElement.disabled = value;
     }
+    /** @deprecated Use buttonElement instead. */
     get butttonElement() {
         return this._buttonElement;
     }
+    get buttonElement() {
+        return this._buttonElement;
+    }
     _configure() {
         this._configureIcon();
     }
@@ -49,6 +62,12 @@ export class IconButtonComponentDelegate extends BaseComponentDelegate {
             case 'component':
                 this._iconElement = document.createElement(ICON_CONSTANTS.elementName);
                 this._iconElement.name = this._config.options.iconName;
+                if (this._config.options.iconExternal !== undefined) {
+                    this._iconElement.external = !!this._config.options.iconExternal;
+                }
+                if (this._config.options.iconExternalType) {
+                    this._iconElement.externalType = this._config.options.iconExternalType;
+                }
                 if (this._config.options.iconClass) {
                     addClass(this._config.options.iconClass, this._iconElement);
                 }

package/esm/icon-button/icon-button.d.ts

@@ -48,6 +48,8 @@ export declare class IconButtonComponent extends BaseComponent implements IIconB
     get densityLevel(): number;
     set densityLevel(value: number);
     private _initialize;
+    private _deferRippleInitialization;
+    private _initRipple;
     private _toggleValue;
     private _applyToggle;
     private _applyDensity;

package/esm/icon-button/icon-button.js

@@ -7,6 +7,7 @@ import { __decorate } from "tslib";
 import { coerceBoolean, coerceNumber, CustomElement, emitEvent, ensureChild, toggleClass } from '@tylertech/forge-core';
 import { BaseComponent } from '../core/base/base-component';
 import { ForgeRipple } from '../ripple';
+import { userInteractionListener } from '../core/utils';
 import { ICON_BUTTON_CONSTANTS } from './icon-button-constants';
 /**
  * The custom element class behind the `<forge-icon-button>` element.
@@ -123,6 +124,20 @@ let IconButtonComponent = class IconButtonComponent extends BaseComponent {
         if (this._toggle) {
             this._initializeToggle();
         }
+        // We wait to initialize the ripple instance until the user interacts with the component to avoid unnecessary performance overhead
+        this._deferRippleInitialization();
+    }
+    async _deferRippleInitialization() {
+        const type = await userInteractionListener(this._buttonElement);
+        if (!this._rippleInstance) {
+            this._initRipple();
+            if (type === 'focusin') {
+                // eslint-disable-next-line @typescript-eslint/dot-notation
+                this._rippleInstance['foundation'].handleFocus();
+            }
+        }
+    }
+    _initRipple() {
         if (this._rippleInstance) {
             this._rippleInstance.destroy();
         }
@@ -175,7 +190,8 @@ let IconButtonComponent = class IconButtonComponent extends BaseComponent {
         const icons = Array.from(this._buttonElement.querySelectorAll(ICON_BUTTON_CONSTANTS.selectors.ICON));
         // We require two icon/image elements to be specified for the "on" and "off" states
         if (icons.length !== 2) {
-            throw new Error('You must specify two icons, one for "on" and one for "off".');
+            console.error('You must specify two icons, one for "on" and one for "off".');
+            return;
         }
         // Add the icon class to each icon
         icons.forEach(icon => icon.classList.add(ICON_BUTTON_CONSTANTS.classes.ICON));

package/esm/label-value/label-value.js

@@ -10,7 +10,7 @@ import { LabelValueFoundation } from './label-value-foundation';
 import { LABEL_VALUE_CONSTANTS } from './label-value-constants';
 import { BaseComponent } from '../core/base/base-component';
 const template = '<template><div class=\"forge-label-value\" part=\"root\"><div class=\"forge-label-value__icon-container\" part=\"icon-container\"><slot name=\"icon\"></slot></div><div class=\"forge-label-value__container\" part=\"container\"><div class=\"forge-label-value__label\" part=\"label-container\"><slot name=\"label\"></slot></div><div class=\"forge-label-value__value\" part=\"value-container\"><slot name=\"value\"></slot></div></div></div></template>';
-const styles = '.forge-label-value{display:-webkit-box;display:flex;-webkit-box-sizing:border-box;box-sizing:border-box}:host(:not([single-line])) .forge-label-value:not(.forge-label-value--dense):not(.forge-label-value--roomy){min-height:3rem}:host(:not([single-line])) .forge-label-value--roomy:not(.forge-label-value--dense){min-height:3.5rem}:host(:not([single-line])) .forge-label-value--dense:not(.forge-label-value--roomy){min-height:3rem}:host([single-line]) .forge-label-value{min-height:1.5rem}:host(:not([single-line])) .forge-label-value:not(.forge-label-value--roomy){padding-top:5px}:host(:not([single-line])) .forge-label-value--roomy{padding-top:7px}.forge-label-value__icon-container{display:-webkit-box;display:flex;-webkit-box-align:start;align-items:flex-start}:host(:not([single-line])) .forge-label-value__container{display:-webkit-box;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;flex-direction:column;-webkit-box-align:start;align-items:flex-start}:host([single-line]) .forge-label-value__container{display:-webkit-box;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;flex-direction:row;-webkit-box-align:center;align-items:center}:host(:not([single-line])) .forge-label-value--align-center .forge-label-value__container{-webkit-box-align:center;align-items:center}:host(:not([single-line])) .forge-label-value--align-right .forge-label-value__container{-webkit-box-align:end;align-items:flex-end}.forge-label-value--ellipsis .forge-label-value__container{overflow:hidden}::slotted([slot=icon]){color:rgba(0,0,0,.87);color:var(--mdc-theme-text-primary-on-background,rgba(0,0,0,.87));font-size:1.25rem!important;margin-right:8px}.forge-label-value__label{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:Roboto,sans-serif;font-family:var(--mdc-typography-subtitle1-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-weight:400;font-weight:var(--mdc-typography-subtitle1-font-weight,400);letter-spacing:.009375em;letter-spacing:var(--mdc-typography-subtitle1-letter-spacing, .009375em);text-decoration:inherit;-webkit-text-decoration:var(--mdc-typography-subtitle1-text-decoration,inherit);text-decoration:var(--mdc-typography-subtitle1-text-decoration,inherit);text-transform:inherit;text-transform:var(--mdc-typography-subtitle1-text-transform,inherit);line-height:1rem;color:rgba(0,0,0,.54);color:var(--mdc-theme-text-secondary-on-background,rgba(0,0,0,.54))}:host(:not([single-line])) .forge-label-value:not(.forge-label-value--roomy):not(.forge-label-value--dense) .forge-label-value__label{font-size:1rem}:host(:not([single-line])) .forge-label-value--roomy:not(.forge-label-value--dense) .forge-label-value__label{font-size:1rem}:host(:not([single-line])) .forge-label-value--dense:not(.forge-label-value--roomy) .forge-label-value__label{font-size:1rem}:host([single-line]) .forge-label-value__label{font-size:1rem}:host(:not([single-line])) .forge-label-value:not(.forge-label-value--roomy) .forge-label-value__label{-webkit-transform:translateX(-6.8%) translateY(-2%) scale(.8125);transform:translateX(-6.8%) translateY(-2%) scale(.8125)}:host(:not([single-line])) .forge-label-value--roomy .forge-label-value__label{-webkit-transform:translateX(-7.2%) translateY(1%) scale(.8125);transform:translateX(-7.2%) translateY(1%) scale(.8125)}:host([single-line]) .forge-label-value__label{margin-right:8px}:host(:not([single-line])) .forge-label-value:not(.forge-label-value--roomy) .forge-label-value__label{margin-bottom:-1px}:host(:not([single-line])) .forge-label-value--roomy .forge-label-value__label{margin-bottom:5px}:host(:not([single-line])) .forge-label-value__label{max-width:100%}:host([single-line]) .forge-label-value__label{-webkit-box-flex:0;flex:none}.forge-label-value--ellipsis .forge-label-value__label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.forge-label-value__value{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:Roboto,sans-serif;font-family:var(--mdc-typography-body1-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-weight:400;font-weight:var(--mdc-typography-body1-font-weight,400);letter-spacing:.03125em;letter-spacing:var(--mdc-typography-body1-letter-spacing, .03125em);text-decoration:inherit;-webkit-text-decoration:var(--mdc-typography-body1-text-decoration,inherit);text-decoration:var(--mdc-typography-body1-text-decoration,inherit);text-transform:inherit;text-transform:var(--mdc-typography-body1-text-transform,inherit);line-height:1.25rem}:host(:not([single-line])) .forge-label-value:not(.forge-label-value--dense):not(.forge-label-value--roomy) .forge-label-value__value{font-size:1rem}:host(:not([single-line])) .forge-label-value--roomy:not(.forge-label-value--dense) .forge-label-value__value{font-size:1rem}:host(:not([single-line])) .forge-label-value--dense:not(.forge-label-value--roomy) .forge-label-value__value{font-size:.875rem}:host(:not([single-line])) .forge-label-value__value{max-width:100%}:host([single-line]) .forge-label-value__value{-webkit-box-flex:0;flex:none}.forge-label-value--empty .forge-label-value__value{color:rgba(0,0,0,.54);color:var(--mdc-theme-text-secondary-on-background,rgba(0,0,0,.54));font-style:italic}.forge-label-value--ellipsis .forge-label-value__value{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host{display:block;min-width:0}:host([hidden]){display:none}';
+const styles = ':host{display:block;min-width:0}:host([hidden]){display:none}.forge-label-value{display:-webkit-box;display:flex;min-height:3rem}.forge-label-value__container{display:-webkit-box;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;flex-direction:column;-webkit-box-flex:1;flex:1}.forge-label-value__icon-container{display:-webkit-box;display:flex;-webkit-box-align:start;align-items:flex-start}.forge-label-value__icon-container ::slotted([slot=icon]){color:rgba(0,0,0,.87);color:var(--mdc-theme-text-primary-on-background,rgba(0,0,0,.87));font-size:1.25rem!important;margin-right:8px;margin-top:4px}.forge-label-value--align-center .forge-label-value__container{-webkit-box-align:center;align-items:center}.forge-label-value--align-right .forge-label-value__container{-webkit-box-align:end;align-items:flex-end}.forge-label-value__label{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:Roboto,sans-serif;font-family:var(--mdc-typography-caption-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-size:.75rem;font-size:var(--mdc-typography-caption-font-size, .75rem);line-height:1.25rem;line-height:var(--mdc-typography-caption-line-height, 1.25rem);font-weight:400;font-weight:var(--mdc-typography-caption-font-weight,400);letter-spacing:.0333333333em;letter-spacing:var(--mdc-typography-caption-letter-spacing, .0333333333em);text-decoration:inherit;-webkit-text-decoration:var(--mdc-typography-caption-text-decoration,inherit);text-decoration:var(--mdc-typography-caption-text-decoration,inherit);text-transform:inherit;text-transform:var(--mdc-typography-caption-text-transform,inherit);color:rgba(0,0,0,.54);color:var(--mdc-theme-text-secondary-on-background,rgba(0,0,0,.54));font-size:13px;line-height:1.9rem}.forge-label-value__value{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:Roboto,sans-serif;font-family:var(--mdc-typography-body1-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-size:1rem;font-size:var(--mdc-typography-body1-font-size, 1rem);line-height:1.5rem;line-height:var(--mdc-typography-body1-line-height, 1.5rem);font-weight:400;font-weight:var(--mdc-typography-body1-font-weight,400);letter-spacing:.03125em;letter-spacing:var(--mdc-typography-body1-letter-spacing, .03125em);text-decoration:inherit;-webkit-text-decoration:var(--mdc-typography-body1-text-decoration,inherit);text-decoration:var(--mdc-typography-body1-text-decoration,inherit);text-transform:inherit;text-transform:var(--mdc-typography-body1-text-transform,inherit);line-height:.6rem}.forge-label-value--roomy{min-height:3.5rem}.forge-label-value--roomy .forge-label-value__label{line-height:2.1rem}.forge-label-value--roomy .forge-label-value__value{line-height:.6rem}.forge-label-value--roomy ::slotted([slot=icon]){margin-top:6px}.forge-label-value--dense{min-height:1.5rem}.forge-label-value--dense .forge-label-value__container{-webkit-box-orient:horizontal;-webkit-box-direction:normal;flex-direction:row;-webkit-box-align:center;align-items:center}.forge-label-value--dense .forge-label-value__container .forge-label-value__label{line-height:1.25rem;margin-right:8px}.forge-label-value--dense .forge-label-value__container .forge-label-value__value{line-height:1.25rem;font-size:.875rem}.forge-label-value--dense ::slotted([slot=icon]){margin-top:2px}.forge-label-value--empty .forge-label-value__value{color:rgba(0,0,0,.54);color:var(--mdc-theme-text-secondary-on-background,rgba(0,0,0,.54));font-style:italic}.forge-label-value--ellipsis .forge-label-value__container{overflow:hidden}.forge-label-value--ellipsis .forge-label-value__container .forge-label-value__label,.forge-label-value--ellipsis .forge-label-value__container .forge-label-value__value{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}';
 let LabelValueComponent = class LabelValueComponent extends BaseComponent {
     constructor() {
         super();

package/esm/paginator/paginator.js

@@ -13,7 +13,8 @@ import { IconButtonComponent } from '../icon-button';
 import { SelectComponent } from '../select';
 import { IconComponent, IconRegistry } from '../icon';
 import { BaseComponent } from '../core/base/base-component';
-const template = '<template><div class=\"forge-paginator\" part=\"root\"><div class=\"forge-paginator__container\" part=\"container\"><div class=\"forge-paginator__label\" part=\"label\"></div><forge-select class=\"forge-paginator__page-size-options\" aria-label=\"Choose page size\" density=\"dense\" part=\"page-size-options\"></forge-select><div class=\"forge-paginator__range-label\" part=\"range-label\"></div><forge-icon-button class=\"forge-paginator__first-page\" part=\"first-page-button\"><button aria-label=\"First Page\" part=\"first-page-button-element\"><forge-icon name=\"first_page\" part=\"first-page-icon\"></forge-icon></button></forge-icon-button><forge-icon-button class=\"forge-paginator__previous-page\" part=\"previous-page-button\"><button aria-label=\"Previous Page\" part=\"previous-page-button-element\"><forge-icon name=\"keyboard_arrow_left\" part=\"previous-page-button-icon\"></forge-icon></button></forge-icon-button><div class=\"forge-paginator__range-label--alternative\" part=\"range-label-alternative\"></div><forge-icon-button class=\"forge-paginator__next-page\" part=\"next-page-button\"><button aria-label=\"Next Page\" part=\"next-page-button-element\"><forge-icon name=\"keyboard_arrow_right\" part=\"next-page-icon\"></forge-icon></button></forge-icon-button><forge-icon-button class=\"forge-paginator__last-page\" part=\"last-page-button\"><button aria-label=\"Last Page\" part=\"last-page-button-element\"><forge-icon name=\"last_page\" part=\"last-page-icon\"></forge-icon></button></forge-icon-button></div></div></template>';
+import { TooltipComponent } from '../tooltip';
+const template = '<template><div class=\"forge-paginator\" part=\"root\"><div class=\"forge-paginator__container\" part=\"container\"><div class=\"forge-paginator__label\" part=\"label\"></div><forge-select class=\"forge-paginator__page-size-options\" aria-label=\"Choose page size\" density=\"dense\" part=\"page-size-options\"></forge-select><div class=\"forge-paginator__range-label\" part=\"range-label\"></div><forge-icon-button class=\"forge-paginator__first-page\" part=\"first-page-button\"><button aria-label=\"First Page\" part=\"first-page-button-element\"><forge-icon name=\"first_page\" part=\"first-page-icon\"></forge-icon></button><forge-tooltip position=\"top\">Go to the first page</forge-tooltip></forge-icon-button><forge-icon-button class=\"forge-paginator__previous-page\" part=\"previous-page-button\"><button aria-label=\"Previous Page\" part=\"previous-page-button-element\"><forge-icon name=\"keyboard_arrow_left\" part=\"previous-page-button-icon\"></forge-icon></button><forge-tooltip position=\"top\">Go to the previous page</forge-tooltip></forge-icon-button><div class=\"forge-paginator__range-label--alternative\" part=\"range-label-alternative\"></div><forge-icon-button class=\"forge-paginator__next-page\" part=\"next-page-button\"><button aria-label=\"Next Page\" part=\"next-page-button-element\"><forge-icon name=\"keyboard_arrow_right\" part=\"next-page-icon\"></forge-icon></button><forge-tooltip position=\"top\">Go to the next page</forge-tooltip></forge-icon-button><forge-icon-button class=\"forge-paginator__last-page\" part=\"last-page-button\"><button aria-label=\"Last Page\" part=\"last-page-button-element\"><forge-icon name=\"last_page\" part=\"last-page-icon\"></forge-icon></button><forge-tooltip position=\"top\">Go to the last page</forge-tooltip></forge-icon-button></div></div></template>';
 const styles = '.forge-icon-button{display:-webkit-inline-box;display:inline-flex;-webkit-box-pack:center;justify-content:center;-webkit-box-align:center;align-items:center;position:relative;-webkit-box-sizing:border-box;box-sizing:border-box;border:none;outline:0;background-color:transparent;fill:currentColor;color:inherit;font-size:24px;text-decoration:none;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;width:48px;height:48px;padding:12px}.forge-icon-button forge-icon,.forge-icon-button img,.forge-icon-button svg{width:24px;height:24px}.forge-icon-button:disabled{color:rgba(0,0,0,.38);color:var(--mdc-theme-text-disabled-on-light,rgba(0,0,0,.38))}.forge-icon-button:disabled{cursor:default;pointer-events:none}.forge-icon-button__icon{display:inline-block}.forge-icon-button__icon.forge-icon-button__icon--on{display:none}.forge-icon-button--on .forge-icon-button__icon{display:none}.forge-icon-button--on .forge-icon-button__icon.forge-icon-button__icon--on{display:inline-block}@-webkit-keyframes mdc-ripple-fg-radius-in{from{-webkit-animation-timing-function:cubic-bezier(0.4,0,0.2,1);animation-timing-function:cubic-bezier(0.4,0,0.2,1);-webkit-transform:translate(var(--mdc-ripple-fg-translate-start,0)) scale(1);transform:translate(var(--mdc-ripple-fg-translate-start,0)) scale(1)}to{-webkit-transform:translate(var(--mdc-ripple-fg-translate-end,0)) scale(var(--mdc-ripple-fg-scale,1));transform:translate(var(--mdc-ripple-fg-translate-end,0)) scale(var(--mdc-ripple-fg-scale,1))}}@keyframes mdc-ripple-fg-radius-in{from{-webkit-animation-timing-function:cubic-bezier(0.4,0,0.2,1);animation-timing-function:cubic-bezier(0.4,0,0.2,1);-webkit-transform:translate(var(--mdc-ripple-fg-translate-start,0)) scale(1);transform:translate(var(--mdc-ripple-fg-translate-start,0)) scale(1)}to{-webkit-transform:translate(var(--mdc-ripple-fg-translate-end,0)) scale(var(--mdc-ripple-fg-scale,1));transform:translate(var(--mdc-ripple-fg-translate-end,0)) scale(var(--mdc-ripple-fg-scale,1))}}@-webkit-keyframes mdc-ripple-fg-opacity-in{from{-webkit-animation-timing-function:linear;animation-timing-function:linear;opacity:0}to{opacity:var(--mdc-ripple-fg-opacity, 0)}}@keyframes mdc-ripple-fg-opacity-in{from{-webkit-animation-timing-function:linear;animation-timing-function:linear;opacity:0}to{opacity:var(--mdc-ripple-fg-opacity, 0)}}@-webkit-keyframes mdc-ripple-fg-opacity-out{from{-webkit-animation-timing-function:linear;animation-timing-function:linear;opacity:var(--mdc-ripple-fg-opacity, 0)}to{opacity:0}}@keyframes mdc-ripple-fg-opacity-out{from{-webkit-animation-timing-function:linear;animation-timing-function:linear;opacity:var(--mdc-ripple-fg-opacity, 0)}to{opacity:0}}.forge-icon-button{--mdc-ripple-fg-size:0;--mdc-ripple-left:0;--mdc-ripple-top:0;--mdc-ripple-fg-scale:1;--mdc-ripple-fg-translate-end:0;--mdc-ripple-fg-translate-start:0;-webkit-tap-highlight-color:transparent;will-change:transform,opacity}.forge-icon-button::after,.forge-icon-button::before{position:absolute;border-radius:50%;opacity:0;pointer-events:none;content:\"\"}.forge-icon-button::before{-webkit-transition:opacity 15ms linear,background-color 15ms linear;transition:opacity 15ms linear,background-color 15ms linear;z-index:1;z-index:var(--mdc-ripple-z-index,1)}.forge-icon-button::after{z-index:0;z-index:var(--mdc-ripple-z-index,0)}.forge-icon-button.mdc-ripple-upgraded::before{-webkit-transform:scale(var(--mdc-ripple-fg-scale,1));transform:scale(var(--mdc-ripple-fg-scale,1))}.forge-icon-button.mdc-ripple-upgraded::after{top:0;left:0;-webkit-transform:scale(0);transform:scale(0);-webkit-transform-origin:center center;transform-origin:center center}.forge-icon-button.mdc-ripple-upgraded--unbounded::after{top:var(--mdc-ripple-top,0);left:var(--mdc-ripple-left,0)}.forge-icon-button.mdc-ripple-upgraded--foreground-activation::after{-webkit-animation:mdc-ripple-fg-radius-in 225ms forwards,mdc-ripple-fg-opacity-in 75ms forwards;animation:mdc-ripple-fg-radius-in 225ms forwards,mdc-ripple-fg-opacity-in 75ms forwards}.forge-icon-button.mdc-ripple-upgraded--foreground-deactivation::after{-webkit-animation:mdc-ripple-fg-opacity-out 150ms;animation:mdc-ripple-fg-opacity-out 150ms;-webkit-transform:translate(var(--mdc-ripple-fg-translate-end,0)) scale(var(--mdc-ripple-fg-scale,1));transform:translate(var(--mdc-ripple-fg-translate-end,0)) scale(var(--mdc-ripple-fg-scale,1))}.forge-icon-button::after,.forge-icon-button::before{top:calc(50% - 50%);left:calc(50% - 50%);width:100%;height:100%}.forge-icon-button.mdc-ripple-upgraded::after,.forge-icon-button.mdc-ripple-upgraded::before{top:var(--mdc-ripple-top,calc(50% - 50%));left:var(--mdc-ripple-left,calc(50% - 50%));width:var(--mdc-ripple-fg-size,100%);height:var(--mdc-ripple-fg-size,100%)}.forge-icon-button.mdc-ripple-upgraded::after{width:var(--mdc-ripple-fg-size,100%);height:var(--mdc-ripple-fg-size,100%)}.forge-icon-button::after,.forge-icon-button::before{background-color:#000;background-color:var(--mdc-ripple-color,var(--mdc-theme-on-surface,#000))}.forge-icon-button.mdc-ripple-surface--hover::before,.forge-icon-button:hover::before{opacity:.04;opacity:var(--mdc-ripple-hover-opacity, .04)}.forge-icon-button.mdc-ripple-upgraded--background-focused::before,.forge-icon-button:not(.mdc-ripple-upgraded):focus::before{-webkit-transition-duration:75ms;transition-duration:75ms;opacity:.12;opacity:var(--mdc-ripple-focus-opacity, .12)}.forge-icon-button:not(.mdc-ripple-upgraded)::after{-webkit-transition:opacity 150ms linear;transition:opacity 150ms linear}.forge-icon-button:not(.mdc-ripple-upgraded):active::after{-webkit-transition-duration:75ms;transition-duration:75ms;opacity:.12;opacity:var(--mdc-ripple-press-opacity, .12)}.forge-icon-button.mdc-ripple-upgraded{--mdc-ripple-fg-opacity:var(--mdc-ripple-press-opacity, 0.12)}forge-icon-button{position:relative;display:inline-block;overflow:visible}.forge-icon-button--on{color:#3f51b5;color:var(--mdc-theme-primary,#3f51b5)}.forge-icon-button--on::after,.forge-icon-button--on::before{background-color:#3f51b5;background-color:var(--mdc-ripple-color,var(--mdc-theme-primary,#3f51b5))}.forge-icon-button--on.mdc-ripple-surface--hover::before,.forge-icon-button--on:hover::before{opacity:.04;opacity:var(--mdc-ripple-hover-opacity, .04)}.forge-icon-button--on.mdc-ripple-upgraded--background-focused::before,.forge-icon-button--on:not(.mdc-ripple-upgraded):focus::before{-webkit-transition-duration:75ms;transition-duration:75ms;opacity:.12;opacity:var(--mdc-ripple-focus-opacity, .12)}.forge-icon-button--on:not(.mdc-ripple-upgraded)::after{-webkit-transition:opacity 150ms linear;transition:opacity 150ms linear}.forge-icon-button--on:not(.mdc-ripple-upgraded):active::after{-webkit-transition-duration:75ms;transition-duration:75ms;opacity:.12;opacity:var(--mdc-ripple-press-opacity, .12)}.forge-icon-button--on.mdc-ripple-upgraded{--mdc-ripple-fg-opacity:var(--mdc-ripple-press-opacity, 0.12)}.forge-icon-button--on::before{background-color:#3f51b5;background-color:var(--mdc-theme-primary,#3f51b5);opacity:.08}.forge-icon-button--dense{width:28px;height:28px;padding:2px;padding:0}.forge-icon-button--dense-1{width:44px;height:44px;padding:10px}.forge-icon-button--dense-2{width:40px;height:40px;padding:8px}.forge-icon-button--dense-3{width:36px;height:36px;padding:6px}.forge-icon-button--dense-4{width:32px;height:32px;padding:4px}.forge-icon-button--dense-5{width:28px;height:28px;padding:2px}.forge-icon-button--dense-6{width:24px;height:24px;padding:0}.forge-icon-button--with-badge forge-badge{z-index:1;z-index:var(--forge-z-index-surface,1);pointer-events:none;--forge-badge-max-width:32px;--forge-badge-border:1px solid transparent}.forge-icon-button--with-badge forge-badge[app-bar-context]{--forge-badge-border:2px solid var(--forge-app-bar-theme-background)}.forge-paginator{display:inline-block}.forge-paginator--alternative{display:-webkit-box;display:flex}.forge-paginator--alternative .forge-paginator__label,.forge-paginator--alternative .forge-paginator__page-size-options,.forge-paginator--alternative .forge-paginator__range-label{display:none}.forge-paginator--alternative .forge-paginator__range-label--alternative{display:inline-block;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:Roboto,sans-serif;font-family:var(--mdc-typography-body2-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-size:.875rem;font-size:var(--mdc-typography-body2-font-size, .875rem);line-height:1.25rem;line-height:var(--mdc-typography-body2-line-height, 1.25rem);font-weight:400;font-weight:var(--mdc-typography-body2-font-weight,400);letter-spacing:.0178571429em;letter-spacing:var(--mdc-typography-body2-letter-spacing, .0178571429em);text-decoration:inherit;-webkit-text-decoration:var(--mdc-typography-body2-text-decoration,inherit);text-decoration:var(--mdc-typography-body2-text-decoration,inherit);text-transform:inherit;text-transform:var(--mdc-typography-body2-text-transform,inherit);margin:0 12px}.forge-paginator__range-label--alternative{display:none}.forge-paginator__container{display:-webkit-box;display:flex;-webkit-box-align:center;align-items:center}.forge-paginator__label{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:Roboto,sans-serif;font-family:var(--mdc-typography-caption-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-size:.75rem;font-size:var(--mdc-typography-caption-font-size, .75rem);line-height:1.25rem;line-height:var(--mdc-typography-caption-line-height, 1.25rem);font-weight:400;font-weight:var(--mdc-typography-caption-font-weight,400);letter-spacing:.0333333333em;letter-spacing:var(--mdc-typography-caption-letter-spacing, .0333333333em);text-decoration:inherit;-webkit-text-decoration:var(--mdc-typography-caption-text-decoration,inherit);text-decoration:var(--mdc-typography-caption-text-decoration,inherit);text-transform:inherit;text-transform:var(--mdc-typography-caption-text-transform,inherit);margin-right:16px}.forge-paginator__page-size-options{margin-right:16px}.forge-paginator__range-label{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:Roboto,sans-serif;font-family:var(--mdc-typography-caption-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-size:.75rem;font-size:var(--mdc-typography-caption-font-size, .75rem);line-height:1.25rem;line-height:var(--mdc-typography-caption-line-height, 1.25rem);font-weight:400;font-weight:var(--mdc-typography-caption-font-weight,400);letter-spacing:.0333333333em;letter-spacing:var(--mdc-typography-caption-letter-spacing, .0333333333em);text-decoration:inherit;-webkit-text-decoration:var(--mdc-typography-caption-text-decoration,inherit);text-decoration:var(--mdc-typography-caption-text-decoration,inherit);text-transform:inherit;text-transform:var(--mdc-typography-caption-text-transform,inherit);margin-right:8px}.forge-paginator__first-page,.forge-paginator__last-page,.forge-paginator__next-page,.forge-paginator__previous-page{color:rgba(0,0,0,.87);color:var(--mdc-theme-text-primary-on-background,rgba(0,0,0,.87))}:host{display:inline-block}:host([hidden]){display:none}:host([alternative]) .forge-paginator--alignment-center .forge-paginator__container{-webkit-box-pack:center;justify-content:center}:host([alternative]) .forge-paginator--alignment-center .forge-paginator__range-label--alternative{margin:0 auto}:host([alternative]) .forge-paginator--alignment-start .forge-paginator__container{-webkit-box-pack:start;justify-content:flex-start}:host([alternative]) .forge-paginator--alignment-end .forge-paginator__container{-webkit-box-pack:end;justify-content:flex-end}:host([alternative]) .forge-paginator .forge-paginator__container{-webkit-box-flex:1;flex:1}';
 /**
  * The custom element class behind the `<forge-paginator>` component.
@@ -128,7 +129,8 @@ PaginatorComponent = __decorate([
         dependencies: [
             IconButtonComponent,
             SelectComponent,
-            IconComponent
+            IconComponent,
+            TooltipComponent
         ]
     })
 ], PaginatorComponent);

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@tylertech/forge",
   "description": "Forge Web Components library",
-  "version": "2.1.0",
+  "version": "2.2.0",
   "author": "Tyler Technologies, Inc.",
   "license": "Apache-2.0",
   "repository": {

package/styles/circular-progress/_mixins.scss

@@ -78,9 +78,10 @@
       transition: mdc-animation-functions.exit-temporary(opacity, 250ms);
     }
 
-    // FORGE (new): added custom property for setting stroke-width
+    // FORGE (new): added custom properties for setting stroke-width and radius
     circle {
       @include theme.css-custom-property(stroke-width, --forge-circular-progress-stroke-width, variables.$stroke-width);
+      @include theme.css-custom-property(r, --forge-circular-progress-radius, variables.$radius);
     }
 
     ::slotted(*) {

package/styles/circular-progress/_variables.scss

@@ -29,6 +29,7 @@ $color: tertiary !default; // FORGE (modify): use tertiary theme by default
 $track-color: transparent !default;
 $size: 72px !default; // FORGE (new): added default size
 $stroke-width: 4; // FORGE (new): added default stroke-width
+$radius: 22; // FORGE (new): added default radius
 
 /// The rotation position of the arcs that corresponds to their fully contracted state
 $base-angle: 135deg !default;

package/styles/label-value/_mixins.scss

@@ -3,13 +3,200 @@
  * Copyright 2022 Tyler Technologies, Inc. 
  * License: Apache-2.0
  */
-@use './core';
+@use '@material/theme/theme' as mdc-theme;
+@use '@material/typography/typography' as mdc-typography;
+@use './variables';
 
 @mixin host() {
   display: block;
   min-width: 0;
 }
 
+@mixin base() {
+  display: flex;
+  min-height: variables.$height;
+}
+
+@mixin container() {
+  display: flex;
+  flex-direction: column;
+  flex: 1;
+}
+
+@mixin icon-container() {
+  display: flex;
+  align-items: flex-start;
+}
+
+@mixin ellipsis {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+@mixin align-center() {
+  align-items: center;
+}
+
+@mixin align-right() {
+  align-items: flex-end;
+}
+
+@mixin label() {
+  @include mdc-typography.typography(caption);
+  @include mdc-theme.property(color, text-secondary-on-background);
+
+  font-size: 13px;
+  line-height: 1.9rem;
+}
+
+@mixin value() {
+  @include mdc-typography.typography(body1);
+
+  line-height: 0.6rem;
+}
+
+@mixin roomy() {
+  min-height: variables.$roomy-height;
+}
+
+@mixin dense() {
+  min-height: variables.$dense-height;
+}
+
+@mixin container-dense() {
+  flex-direction: row;
+  align-items: center;
+}
+
+@mixin dense-label() {
+  line-height: 1.25rem;
+  margin-right: 8px;
+}
+
+@mixin dense-value() {
+  line-height: 1.25rem;
+  font-size: 0.875rem;
+}
+
+@mixin roomy-label() {
+  line-height: 2.1rem;
+}
+
+@mixin roomy-value() {
+  line-height: 0.6rem;
+}
+
+@mixin empty-value() {
+  @include mdc-theme.property(color, text-secondary-on-background);
+
+  font-style: italic;
+}
+
+@mixin icon() {
+  @include mdc-theme.property(color, text-primary-on-background);
+
+  font-size: 1.25rem !important;
+  margin-right: 8px;
+  margin-top: 4px;
+}
+
+@mixin dense-icon() {
+  margin-top: 2px;
+}
+
+@mixin roomy-icon() {
+  margin-top: 6px;
+}
+
 @mixin core-styles() {
-  @include core.core-styles;
+  .forge-label-value {
+    @include base;
+
+    &__container {
+      @include container;
+    }
+
+    &__icon-container {
+      @include icon-container;
+
+      ::slotted([slot='icon']) {
+        @include icon;
+      }
+    }
+
+    &--align-center {
+      .forge-label-value__container {
+        @include align-center;
+      }
+    }
+
+    &--align-right {
+      .forge-label-value__container {
+        @include align-right;
+      }
+    }
+
+    &__label {
+      @include label;
+    }
+
+    &__value {
+      @include value;
+    }
+
+    &--roomy {
+      @include roomy;
+
+      .forge-label-value__label {
+        @include roomy-label;
+      }
+
+      .forge-label-value__value {
+        @include roomy-value;
+      }
+
+      ::slotted([slot='icon']) {
+        @include roomy-icon;
+      }
+    }
+
+    &--dense {
+      @include dense;
+
+      .forge-label-value__container {
+        @include container-dense;
+
+        .forge-label-value__label {
+          @include dense-label;
+        }
+
+        .forge-label-value__value {
+          @include dense-value;
+        }
+
+      }
+      
+      ::slotted([slot='icon']) {
+        @include dense-icon;
+      }
+    }
+
+    &--empty {
+      .forge-label-value__value {
+        @include empty-value;
+      }
+    }
+
+    &--ellipsis {
+      .forge-label-value__container {
+        overflow: hidden;
+
+        .forge-label-value__label,
+        .forge-label-value__value {
+          @include ellipsis;
+        }
+      }
+    }
+  }
 }

package/styles/label-value/_variables.scss

@@ -3,35 +3,9 @@
  * Copyright 2022 Tyler Technologies, Inc. 
  * License: Apache-2.0
  */
-$root: (
-  padding: (
-    top: ( // adjusts label position from top of field, in raster space
-      default: 5px,
-      roomy: 7px
-    )
-  )
-) !default;
+@use '../theme/theme-values';
 
-$label: (
-  transform: (
-    translate: (
-      x: ( // moves label back to keyline after scaling, in vector space
-        default: -6.8%,
-        roomy: -7.2%
-      ),
-      y: ( // moves label back to baseline after scaling, in vector space
-        default: -2%,
-        roomy: 1%
-      )
-    )
-  ),
-  margin: (
-    right: (
-      single-line: 8px
-    ),
-    bottom: ( // adjust value position from bottom of label, in raster space
-      default: -1px,
-      roomy: 5px
-    )
-  )
-) !default;
+$color: rgba(theme-values.$on-surface, 0.6);
+$height: 3rem;
+$dense-height: 1.5rem;
+$roomy-height: 3.5rem;

package/styles/label-value/label-value.scss

@@ -5,8 +5,6 @@
  */
 @use './mixins';
 
-@include mixins.core-styles;
-
 :host {
   @include mixins.host;
 }
@@ -15,3 +13,4 @@
   display: none;
 }
 
+@include mixins.core-styles;

package/dist/esm/chunks/chunk.5NXVVSTU.js.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../src/button/button-constants.ts", "../../src/button/button.ts", "../../src/button/button-component-delegate.ts", "../../src/button/index.ts"],
-  "sourcesContent": ["import { COMPONENT_NAME_PREFIX } from '../constants';\n\nconst elementName: keyof HTMLElementTagNameMap = `${COMPONENT_NAME_PREFIX}button`;\n\nconst classes = {\n  BUTTON: 'forge-button',\n  LABEL: 'forge-button__label',\n  ICON: 'forge-button__icon',\n  BUTTON_RAISED: 'forge-button--raised',\n  BUTTON_UNELEVATED: 'forge-button--unelevated',\n  BUTTON_OUTLINED: 'forge-button--outlined',\n  BUTTON_DENSE: 'forge-button--dense',\n  RIPPLE: 'forge-button__ripple'\n};\n\nconst selectors = {\n  BUTTON: 'button',\n  LABEL: `span:not(.${classes.RIPPLE})`,\n  ICON: 'i,forge-icon,[data-forge-button-icon]',\n  RIPPLE: `.${classes.RIPPLE}`\n};\n\nconst attributes = {\n  TYPE: 'type',\n  DISABLED: 'disabled'\n};\n\nexport const BUTTON_CONSTANTS = {\n  elementName,\n  classes,\n  selectors,\n  attributes\n};\n", "import { CustomElement, ensureChildren, toggleAttribute } from '@tylertech/forge-core';\nimport { BaseComponent, IBaseComponent } from '../core/base/base-component';\nimport { BUTTON_CONSTANTS } from './button-constants';\nimport { ForgeRipple } from '../ripple';\n\nexport interface IButtonComponent extends IBaseComponent {\n  type: string;\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'forge-button': IButtonComponent;\n  }\n}\n\n/**\n * The custom element class behind the `<forge-button>` element.\n */\n@CustomElement({\n  name: BUTTON_CONSTANTS.elementName\n})\nexport class ButtonComponent extends BaseComponent implements IButtonComponent {\n  public static get observedAttributes(): string[] {\n    return [BUTTON_CONSTANTS.attributes.TYPE];\n  }\n\n  private _rippleInstance: ForgeRipple;\n  private _buttonElement: HTMLButtonElement;\n  private _type: string;\n  private _mutationObserver: MutationObserver;\n  private _buttonAttrMutationObserver: MutationObserver;\n\n  constructor() {\n    super();\n  }\n\n  public connectedCallback(): void {\n    if (this.children.length) {\n      this._initialize();\n    } else {\n      ensureChildren(this).then(() => this._initialize());\n    }\n  }\n\n  public attributeChangedCallback(name: string, oldValue: string, newValue: string): void {\n    switch (name) {\n      case BUTTON_CONSTANTS.attributes.TYPE:\n        this.type = newValue;\n        break;\n    }\n  }\n\n  public disconnectedCallback(): void {\n    if (this._rippleInstance) {\n      this._rippleInstance.destroy();\n    }\n    if (this._mutationObserver) {\n      this._mutationObserver.disconnect();\n    }\n    if (this._buttonAttrMutationObserver) {\n      this._buttonAttrMutationObserver.disconnect();\n    }\n  }\n\n  /**\n   * Sets the type of button decoration.\n   * Possible values are: raised, elevated, outlined, and dense.\n   * Can be combined as: outlined-dense.\n   */\n  public get type(): string {\n    return this._type;\n  }\n  public set type(value: string) {\n    if (this._type !== value) {\n      this._type = value;\n      this._applyType(value);\n      this.setAttribute(BUTTON_CONSTANTS.attributes.TYPE, this._type);\n    }\n  }\n\n  private _applyType(type: string): void {\n    if (this._buttonElement) {\n      this._buttonElement.classList.remove(BUTTON_CONSTANTS.classes.BUTTON_RAISED);\n      this._buttonElement.classList.remove(BUTTON_CONSTANTS.classes.BUTTON_UNELEVATED);\n      this._buttonElement.classList.remove(BUTTON_CONSTANTS.classes.BUTTON_OUTLINED);\n      this._buttonElement.classList.remove(BUTTON_CONSTANTS.classes.BUTTON_DENSE);\n\n      if (type.includes('raised')) {\n        this._buttonElement.classList.add(BUTTON_CONSTANTS.classes.BUTTON_RAISED);\n      }\n      if (type.includes('unelevated')) {\n        this._buttonElement.classList.add(BUTTON_CONSTANTS.classes.BUTTON_UNELEVATED);\n      }\n      if (type.includes('outlined')) {\n        this._buttonElement.classList.add(BUTTON_CONSTANTS.classes.BUTTON_OUTLINED);\n      }\n      if (type.includes('dense')) {\n        this._buttonElement.classList.add(BUTTON_CONSTANTS.classes.BUTTON_DENSE);\n      }\n    }\n  }\n\n  private _initialize(): void {\n    this._initializeButton();\n    this._initializeMutationObserver();\n  }\n\n  private _initializeButton(): void {\n    this._buttonElement = this.querySelector(BUTTON_CONSTANTS.selectors.BUTTON) as HTMLButtonElement;\n    if (!this._buttonElement) {\n      return;\n    }\n\n    if (this.hasAttribute(BUTTON_CONSTANTS.attributes.TYPE)) {\n      this._type = this.getAttribute(BUTTON_CONSTANTS.attributes.TYPE) as string;\n      this._applyType(this._type);\n    }\n    this._buttonElement.classList.add(BUTTON_CONSTANTS.classes.BUTTON);\n\n    this._syncDisabledState();\n    this._initializeButtonChildren();\n\n    if (this._rippleInstance) {\n      this._rippleInstance.destroy();\n    }\n    this._rippleInstance = new ForgeRipple(this._buttonElement);\n  }\n\n  private _initializeButtonChildren(): void {\n    if (!this._buttonElement.querySelector(BUTTON_CONSTANTS.selectors.RIPPLE)) {\n      const rippleElement = document.createElement('span');\n      rippleElement.classList.add(BUTTON_CONSTANTS.classes.RIPPLE);\n      this._buttonElement.appendChild(rippleElement);\n    }\n\n    const labelElement = this.querySelector(BUTTON_CONSTANTS.selectors.LABEL);\n    if (labelElement) {\n      labelElement.classList.add(BUTTON_CONSTANTS.classes.LABEL);\n    }\n\n    const iconElements = Array.from(this.querySelectorAll(BUTTON_CONSTANTS.selectors.ICON));\n    iconElements.forEach(iconElement => {\n      iconElement.classList.add(BUTTON_CONSTANTS.classes.ICON);\n      if (!iconElement.hasAttribute('aria-hidden')) {\n        iconElement.setAttribute('aria-hidden', 'true');\n      }\n    });\n  }\n\n  private _initializeMutationObserver(): void {\n    if (!this._mutationObserver) {\n      const config: MutationObserverInit = { childList: true, subtree: true };\n      const callback: MutationCallback = mutationList => {\n        if (this._buttonWasAdded(mutationList)) {\n          this._initializeButton();\n        } else if (mutationList.some(mutation => mutation.addedNodes.length)) {\n          this._initializeButtonChildren();\n        }\n      };\n      this._mutationObserver = new MutationObserver(callback);\n      this._mutationObserver.observe(this, config);\n      \n      if (this._buttonElement) {\n        // Watch attributes on the `<button>` element\n        this._buttonAttrMutationObserver = new MutationObserver(mutationList => {\n          if (mutationList.some(mutation => mutation.attributeName === 'disabled')) {\n            this._syncDisabledState();\n          }\n        });\n        this._buttonAttrMutationObserver.observe(this._buttonElement, { attributes: true, attributeFilter: ['disabled'] });\n      }\n    }\n  }\n\n  private _buttonWasAdded(mutationList: MutationRecord[]): boolean {\n    return mutationList.some(mutation => {\n      return Array.from(mutation.addedNodes)\n        .some(node => node.nodeName.toLowerCase() === BUTTON_CONSTANTS.selectors.BUTTON);\n    });\n  }\n\n  private _syncDisabledState(): void {\n    toggleAttribute(this, this._buttonElement.disabled, BUTTON_CONSTANTS.attributes.DISABLED);\n  }\n}\n\n", "import { BaseComponentDelegate, IBaseComponentDelegateConfig, IBaseComponentDelegateOptions } from '../core/delegates/base-component-delegate';\nimport { IButtonComponent } from './button';\nimport { BUTTON_CONSTANTS } from './button-constants';\n\nexport type ButtonComponentDelegateProps = Partial<IButtonComponent>;\nexport interface IButtonComponentDelegateOptions extends IBaseComponentDelegateOptions {\n  type?: 'button' | 'submit';\n  text?: string;\n}\nexport interface IButtonComponentDelegateConfig extends IBaseComponentDelegateConfig<IButtonComponent, IButtonComponentDelegateOptions> {}\n\nexport class ButtonComponentDelegate extends BaseComponentDelegate<IButtonComponent, IButtonComponentDelegateOptions> {\n  private _buttonElement?: HTMLButtonElement;\n\n  constructor(config?: IButtonComponentDelegateConfig) {\n    super(config);\n  }\n\n  public override destroy(): void {\n    this._buttonElement = undefined;\n  }\n\n  public get buttonElement(): HTMLButtonElement | undefined {\n    return this._buttonElement;\n  }\n\n  protected _build(): IButtonComponent {\n    const component = document.createElement(BUTTON_CONSTANTS.elementName);\n\n    this._buttonElement = document.createElement('button');\n    this._buttonElement.type = this._config.options?.type || 'button';\n    this._buttonElement.textContent = this._config.options?.text || '';\n    component.appendChild(this._buttonElement);\n\n    return component;\n  }\n\n  public onClick(listener: (evt: MouseEvent) => void): void {\n    this._buttonElement?.addEventListener('click', listener);\n  }\n\n  public onFocus(listener: (evt: Event) => void): void {\n    this._buttonElement?.addEventListener('focus', evt => listener(evt));\n  }\n\n  public onBlur(listener: (evt: Event) => void): void {\n    this._buttonElement?.addEventListener('blur', evt => listener(evt));\n  }\n}\n", "import { defineCustomElement } from '@tylertech/forge-core';\nimport { ButtonComponent } from './button';\n\nexport * from './button';\nexport * from './button-constants';\nexport * from './button-component-delegate';\n\nexport function defineButtonComponent(): void {\n  defineCustomElement(ButtonComponent);\n}\n"],
-  "mappings": "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",
-  "names": []
-}

package/dist/esm/chunks/chunk.7Y4NHCJH.js.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../src/icon-button/icon-button-constants.ts", "../../src/icon-button/icon-button.ts", "../../src/icon-button/icon-button-component-delegate.ts", "../../src/icon-button/index.ts"],
-  "sourcesContent": ["import { COMPONENT_NAME_PREFIX } from '../constants';\n\nconst elementName: keyof HTMLElementTagNameMap = `${COMPONENT_NAME_PREFIX}icon-button`;\n\nconst attributes = {\n  TOGGLE: 'toggle',\n  IS_ON: 'is-on',\n  ICON_ON: 'forge-icon-button-on',\n  DENSE: 'dense',\n  DENSITY_LEVEL: 'density-level'\n};\n\nconst selectors = {\n  BUTTON: 'button',\n  ICON: 'i, span, svg, img, forge-icon'\n};\n\nconst classes = {\n  BUTTON: 'forge-icon-button',\n  BUTTON_ON: 'forge-icon-button--on',\n  BUTTON_DENSE: 'forge-icon-button--dense',\n  ICON: 'forge-icon-button__icon',\n  ICON_ON: 'forge-icon-button__icon--on',\n  DENSITY: [\n    'forge-icon-button--dense-1',\n    'forge-icon-button--dense-2',\n    'forge-icon-button--dense-3',\n    'forge-icon-button--dense-4',\n    'forge-icon-button--dense-5',\n    'forge-icon-button--dense-6'\n  ]\n};\n\nconst events = {\n  CHANGE: `${elementName}-change`\n};\n\nexport const ICON_BUTTON_CONSTANTS = {\n  elementName,\n  attributes,\n  selectors,\n  classes,\n  events\n};\n", "import { coerceBoolean, coerceNumber, CustomElement, emitEvent, ensureChild, toggleClass } from '@tylertech/forge-core';\nimport { BaseComponent, IBaseComponent } from '../core/base/base-component';\nimport { ForgeRipple } from '../ripple';\nimport { ICON_BUTTON_CONSTANTS } from './icon-button-constants';\n\nexport interface IIconButtonComponent extends IBaseComponent {\n  toggle: boolean;\n  isOn: boolean;\n  dense: boolean;\n  densityLevel: number;\n  layout(): void;\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'forge-icon-button': IIconButtonComponent;\n  }\n\n  interface HTMLElementEventMap {\n    'forge-icon-button-change': CustomEvent<boolean>;\n  }\n}\n\n/**\n * The custom element class behind the `<forge-icon-button>` element.\n */\n@CustomElement({\n  name: ICON_BUTTON_CONSTANTS.elementName\n})\nexport class IconButtonComponent extends BaseComponent implements IIconButtonComponent {\n  public static get observedAttributes(): string[] {\n    return [\n      ICON_BUTTON_CONSTANTS.attributes.IS_ON,\n      ICON_BUTTON_CONSTANTS.attributes.DENSE,\n      ICON_BUTTON_CONSTANTS.attributes.DENSITY_LEVEL,\n      ICON_BUTTON_CONSTANTS.attributes.TOGGLE\n    ];\n  }\n\n  private _rippleInstance: ForgeRipple;\n  private _buttonElement: HTMLButtonElement;\n  private _toggle = false;\n  private _isOn = false;\n  private _dense = false;\n  private _densityLevel = 5;\n  private _toggleHandler: (event: Event) => void;\n\n  constructor() {\n    super();\n  }\n\n  public connectedCallback(): void {\n    if (this.querySelector(ICON_BUTTON_CONSTANTS.selectors.BUTTON)) {\n      this._initialize();\n    } else {\n      ensureChild(this, ICON_BUTTON_CONSTANTS.selectors.BUTTON).then(() => this._initialize());\n    }\n  }\n\n  public disconnectedCallback(): void {\n    if (this._rippleInstance) {\n      this._rippleInstance.destroy();\n    }\n  }\n\n  public attributeChangedCallback(name: string, oldValue: string, newValue: string): void {\n    switch (name) {\n      case ICON_BUTTON_CONSTANTS.attributes.IS_ON:\n        this.isOn = coerceBoolean(newValue);\n        break;\n      case ICON_BUTTON_CONSTANTS.attributes.DENSE:\n        this.dense = coerceBoolean(newValue);\n        break;\n      case ICON_BUTTON_CONSTANTS.attributes.DENSITY_LEVEL:\n        this.densityLevel = coerceNumber(newValue);\n        break;\n      case ICON_BUTTON_CONSTANTS.attributes.TOGGLE:\n        this.toggle = coerceBoolean(newValue);\n        break;\n    }\n  }\n\n  /** Gets/sets whether the button is togglable. */\n  public get toggle(): boolean {\n    return this._toggle;\n  }\n  public set toggle(value: boolean) {\n    this._toggle = value;\n\n    if (this._toggle) {\n      this._initializeToggle();\n    } else {\n      this._destroyToggle();\n    }\n  }\n\n  /** Gets/sets the toggled state of the icon button. Only applies when `toggle = true`. */\n  public get isOn(): boolean {\n    return this._isOn;\n  }\n  public set isOn(value: boolean) {\n    if (this._isOn !== value) {\n      this._isOn = value;\n      this._applyToggle();\n    }\n  }\n\n  /** Gets/sets whether the icon button is dense. */\n  public get dense(): boolean {\n    return this._dense;\n  }\n  public set dense(value: boolean) {\n    if (this._dense !== value) {\n      this._dense = value;\n      this._applyDensity();\n    }\n  }\n\n  /** Controls the density level. 1 (least dense) to 6 (most dense). */\n  public get densityLevel(): number {\n    return this._densityLevel;\n  }\n  public set densityLevel(value: number) {\n    if (this._densityLevel !== value) {\n      this._densityLevel = value;\n\n      if (this._densityLevel <= 0) {\n        this._densityLevel = 1;\n      } else if (this._densityLevel > 6) {\n        this._densityLevel = 6;\n      } else if (typeof this._densityLevel !== 'number') {\n        this._densityLevel = 5;\n      }\n\n      this._applyDensity();\n    }\n  }\n\n  private _initialize(): void {\n    this._buttonElement = this.querySelector(ICON_BUTTON_CONSTANTS.selectors.BUTTON) as HTMLButtonElement;\n    if (!this._buttonElement) {\n      return;\n    }\n\n    this._buttonElement.classList.add(ICON_BUTTON_CONSTANTS.classes.BUTTON);\n    this._applyToggle();\n    this._applyDensity();\n    this._toggleHandler = () => {\n      this._toggleValue();\n      emitEvent(this, ICON_BUTTON_CONSTANTS.events.CHANGE, this._isOn, true);\n    };\n\n    if (this._toggle) {\n      this._initializeToggle();\n    }\n\n    if (this._rippleInstance) {\n      this._rippleInstance.destroy();\n    }\n\n    this._rippleInstance = new ForgeRipple(this._buttonElement);\n    this._rippleInstance.unbounded = true;\n  }\n\n  private _toggleValue(): void {\n    this._isOn = !this._isOn;\n    this._applyToggle();\n  }\n\n  private _applyToggle(): void {\n    if (!this._buttonElement) {\n      return;\n    }\n    toggleClass(this._buttonElement, this._isOn, ICON_BUTTON_CONSTANTS.classes.BUTTON_ON);\n    if (this._toggle) {\n      this._buttonElement.setAttribute('aria-pressed', `${this._isOn}`);\n    }\n  }\n\n  private _applyDensity(): void {\n    if (!this._buttonElement) {\n      return;\n    }\n\n    // Remove all other density classes first\n    ICON_BUTTON_CONSTANTS.classes.DENSITY.forEach(c => this._buttonElement.classList.remove(c));\n\n    if (this._dense) {\n      this.setAttribute(ICON_BUTTON_CONSTANTS.attributes.DENSE, '');\n      this._buttonElement.classList.add(ICON_BUTTON_CONSTANTS.classes.BUTTON_DENSE);\n\n      // 5 is the default density level (we apply 5 implicitly in the regular dense class)\n      // Exclude 5 since its already covered by dense class\n      if (this._densityLevel < 7 && this._densityLevel > 0 && this.densityLevel !== 5) {\n        const densityLevelClass = ICON_BUTTON_CONSTANTS.classes.DENSITY[this._densityLevel - 1];\n        this._buttonElement.classList.add(densityLevelClass);\n        this.setAttribute(ICON_BUTTON_CONSTANTS.attributes.DENSITY_LEVEL, this._densityLevel.toString());\n      }\n    } else {\n      this.removeAttribute(ICON_BUTTON_CONSTANTS.attributes.DENSE);\n      this._buttonElement.classList.remove(ICON_BUTTON_CONSTANTS.classes.BUTTON_DENSE);\n    }\n\n    // re-layout the ripple for cases where dense was changed after initial layout\n    if (this._rippleInstance) {\n      this._rippleInstance.layout();\n    }\n  }\n\n  private _initializeToggle(): void {\n    if (!this._buttonElement) {\n      return;\n    }\n    const icons = Array.from(this._buttonElement.querySelectorAll(ICON_BUTTON_CONSTANTS.selectors.ICON));\n\n    // We require two icon/image elements to be specified for the \"on\" and \"off\" states\n    if (icons.length !== 2) {\n      throw new Error('You must specify two icons, one for \"on\" and one for \"off\".');\n    }\n\n    // Add the icon class to each icon\n    icons.forEach(icon => icon.classList.add(ICON_BUTTON_CONSTANTS.classes.ICON));\n\n    // If there are no icons that specify the \"on\" class, then automatically choose the first icon as the \"on\" icon and add the class,\n    // alternatively we check for the existence of a `forge-icon-button-on` attribute on any of the icons and use that.\n    if (!icons.some(icon => icon.classList.contains(ICON_BUTTON_CONSTANTS.classes.ICON_ON))) {\n      const requestedOnIcon = icons.find(icon => icon.hasAttribute(ICON_BUTTON_CONSTANTS.attributes.ICON_ON));\n      if (requestedOnIcon) {\n        requestedOnIcon.classList.add(ICON_BUTTON_CONSTANTS.classes.ICON_ON);\n      } else {\n        icons[0].classList.add(ICON_BUTTON_CONSTANTS.classes.ICON_ON);\n      }\n    }\n\n    this._buttonElement.addEventListener('click', this._toggleHandler);\n\n    // Wait a frame to ensure the value of the `on` property has been set\n    window.requestAnimationFrame(() => {\n      if (this._isOn) {\n        this._buttonElement.classList.add(ICON_BUTTON_CONSTANTS.classes.BUTTON_ON);\n        this._buttonElement.setAttribute('aria-pressed', `${this._isOn}`);\n      }\n    });\n  }\n\n  private _destroyToggle(): void {\n    if (!this._buttonElement) {\n      return;\n    }\n    this._buttonElement.removeEventListener('click', this._toggleHandler);\n  }\n\n  public layout(): void {\n    if (this._rippleInstance) {\n      this._rippleInstance.layout();\n    }\n  }\n}\n", "import { addClass } from '@tylertech/forge-core';\nimport { ICON_CONSTANTS, IIconComponent } from '../icon';\nimport { ICON_CLASS_NAME } from '../constants';\nimport { BaseComponentDelegate, IBaseComponentDelegateConfig, IBaseComponentDelegateOptions } from '../core/delegates/base-component-delegate';\nimport { IIconButtonComponent } from './icon-button';\nimport { ICON_BUTTON_CONSTANTS } from './icon-button-constants';\n\nexport type IconButtonComponentDelegateProps = Partial<IIconButtonComponent>;\nexport interface IIconButtonComponentDelegateOptions extends IBaseComponentDelegateOptions {\n  iconName?: string;\n  iconType?: 'font' | 'component';\n  iconClass?: string | string[];\n}\nexport interface IIconButtonComponentDelegateConfig extends IBaseComponentDelegateConfig<IIconButtonComponent, IIconButtonComponentDelegateOptions> {}\n\nexport class IconButtonComponentDelegate extends BaseComponentDelegate<IIconButtonComponent, IIconButtonComponentDelegateOptions> {\n  private _buttonElement: HTMLButtonElement;\n  private _iconElement?: IIconComponent;\n\n  constructor(config?: IIconButtonComponentDelegateConfig) {\n    super(config);\n  }\n\n  protected _build(): IIconButtonComponent {\n    const component = document.createElement(ICON_BUTTON_CONSTANTS.elementName);\n    this._buttonElement = document.createElement('button');\n    this._buttonElement.type = 'button';\n    component.appendChild(this._buttonElement);\n\n    return component;\n  }\n\n  public get iconElement(): IIconComponent | undefined {\n    return this._iconElement;\n  }\n\n  public get disabled(): boolean {\n    return !!this._buttonElement.disabled;\n  }\n  public set disabled(value: boolean) {\n    this._buttonElement.disabled = value;\n  }\n\n  public get butttonElement(): HTMLButtonElement | undefined {\n    return this._buttonElement;\n  }\n\n  protected _configure(): void {\n    this._configureIcon();\n  }\n\n  private _configureIcon(): void {\n    if (!this._config.options?.iconName) {\n      return;\n    }\n\n    const type = this._config.options?.iconType || 'component';\n\n    switch (type) {\n      case 'font':\n        const classes = Array.isArray(this._config.options.iconClass) ? this._config.options.iconClass : [ICON_CLASS_NAME];\n        addClass(classes, this._buttonElement);\n        this._buttonElement.textContent = this._config.options.iconName;\n        break;\n      case 'component':\n        this._iconElement = document.createElement(ICON_CONSTANTS.elementName);\n        this._iconElement.name = this._config.options.iconName;\n        if (this._config.options.iconClass) {\n          addClass(this._config.options.iconClass, this._iconElement);\n        }\n        this._buttonElement.appendChild(this._iconElement);\n        break;\n    }\n  }\n\n  public onClick(listener: (evt: MouseEvent) => void): void {\n    this._buttonElement.addEventListener('click', listener);\n  }\n\n  public onFocus(listener: (evt: Event) => void): void {\n    this._buttonElement.addEventListener('focus', evt => listener(evt));\n  }\n\n  public onBlur(listener: (evt: Event) => void): void {\n    this._buttonElement.addEventListener('blur', evt => listener(evt));\n  }\n}\n", "import { defineCustomElement } from '@tylertech/forge-core';\n\nimport { IconButtonComponent } from './icon-button';\n\nexport * from './icon-button-constants';\nexport * from './icon-button';\nexport * from './icon-button-component-delegate';\n\nexport function defineIconButtonComponent(): void {\n  defineCustomElement(IconButtonComponent);\n}\n"],
-  "mappings": "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",
-  "names": []
-}