@tylertech/forge 3.0.0-next.10 → 3.0.0-next.12

package/esm/drawer/drawer/drawer.js

@@ -8,7 +8,7 @@ import { CustomElement, attachShadowTemplate } from '@tylertech/forge-core';
 import { DRAWER_CONSTANTS } from './drawer-constants';
 import { BaseDrawerAdapter, BaseDrawerComponent, BaseDrawerFoundation } from '../base';
 const template = '<template><div class=\"forge-drawer\" part=\"root\"><slot name=\"header\"></slot><div class=\"forge-drawer__content\" part=\"content\"><slot></slot></div><slot name=\"footer\"></slot></div></template>';
-const styles = '.forge-drawer{width:256px;width:var(--forge-drawer-width,256px);border-color:#e0e0e0;border-color:var(--forge-theme-border-color,#e0e0e0);background-color:#fff;background-color:var(--mdc-theme-surface,#fff);height:100%;-webkit-box-sizing:border-box;box-sizing:border-box;display:grid;grid-template-columns:1fr;grid-template-rows:auto 1fr auto;overflow:hidden;-webkit-transition-property:-webkit-transform;transition-property:-webkit-transform;transition-property:transform;transition-property:transform,-webkit-transform;-webkit-transition-duration:250ms;transition-duration:250ms;-webkit-transition-timing-function:cubic-bezier(0.4,0,0.2,1);transition-timing-function:cubic-bezier(0.4,0,0.2,1)}.forge-drawer ::slotted([slot=header]){grid-row:1}.forge-drawer ::slotted([slot=footer]){grid-row:3}.forge-drawer__content{overflow-x:auto;-webkit-overflow-scrolling:\"touch\";display:-webkit-box;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;flex-direction:column;grid-row:2}.forge-drawer__content::-webkit-scrollbar{width:16px;width:var(--forge-scrollbar-width,16px);height:16px;height:var(--forge-scrollbar-height,16px)}.forge-drawer__content::-webkit-scrollbar-corner{background-color:#f0f0f0;background-color:var(--forge-theme-scrollbar-track,#f0f0f0)}.forge-drawer__content::-webkit-scrollbar-track{background-color:#f0f0f0;background-color:var(--forge-theme-scrollbar-track,#f0f0f0)}.forge-drawer__content::-webkit-scrollbar-track:hover{background-color:#ececec;background-color:var(--forge-theme-scrollbar-track-hover,#ececec)}.forge-drawer__content::-webkit-scrollbar-thumb{background-color:#bdbdbd;background-color:var(--forge-theme-scrollbar-thumb,#bdbdbd);height:32px;height:var(--forge-scrollbar-min-height,32px);width:32px;width:var(--forge-scrollbar-min-width,32px);border-radius:10px;border-radius:var(--forge-scrollbar-border-radius,10px);border-width:3px;border-width:var(--forge-scrollbar-border-width,3px);border-style:solid;border-color:transparent;background-clip:content-box}.forge-drawer__content::-webkit-scrollbar-thumb:hover{background-color:#9e9e9e;background-color:var(--forge-theme-scrollbar-thumb-hover,#9e9e9e)}.forge-drawer--left{border-right-width:1px;border-right-style:solid}.forge-drawer--right{border-left-width:1px;border-left-style:solid}.forge-drawer--right.forge-drawer--closing{-webkit-transform:translateX(100%);transform:translateX(100%);right:0;left:auto;z-index:1;z-index:var(--forge-z-index-surface,1);position:absolute;top:0;right:0;-webkit-transition-duration:.2s;transition-duration:.2s}.forge-drawer--right.forge-drawer--closed{-webkit-transform:translateX(100%);transform:translateX(100%);right:0;left:auto;width:0;border:none}.forge-drawer--closing{-webkit-transform:translateX(-100%);transform:translateX(-100%);left:0;z-index:1;z-index:var(--forge-z-index-surface,1);position:absolute;top:0;right:0;-webkit-transition-duration:.2s;transition-duration:.2s}.forge-drawer--closed{-webkit-transform:translateX(-100%);transform:translateX(-100%);left:0;width:0;border:none}.forge-drawer--no-transition{-webkit-transition:none!important;transition:none!important}:host{display:-webkit-box;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;flex-direction:column;-webkit-box-sizing:border-box;box-sizing:border-box;height:100%;overflow:hidden!important}@media not all and (-webkit-min-device-pixel-ratio:0),not all and (min-resolution:0.001dpcm){@supports (-webkit-appearance:none) and (stroke-color:transparent){:host([open]){-webkit-transform:translateZ(0);transform:translateZ(0)}}}';
+const styles = '.forge-drawer{width:256px;width:var(--forge-drawer-width,256px);border-color:#e0e0e0;border-color:var(--forge-theme-border-color,#e0e0e0);background-color:#fff;background-color:var(--mdc-theme-surface,#fff);height:100%;-webkit-box-sizing:border-box;box-sizing:border-box;display:grid;grid-template-columns:1fr;grid-template-rows:auto 1fr auto;overflow:hidden;-webkit-transition-property:-webkit-transform;transition-property:-webkit-transform;transition-property:transform;transition-property:transform,-webkit-transform;-webkit-transition-duration:250ms;transition-duration:250ms;-webkit-transition-timing-function:cubic-bezier(0.4,0,0.2,1);transition-timing-function:cubic-bezier(0.4,0,0.2,1)}.forge-drawer ::slotted([slot=header]){grid-row:1}.forge-drawer ::slotted([slot=footer]){grid-row:3}.forge-drawer__content{overflow-x:auto;-webkit-overflow-scrolling:\"touch\";display:-webkit-box;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;flex-direction:column;grid-row:2}.forge-drawer__content::-webkit-scrollbar{height:var(--forge-scrollbar-height,16px);width:var(--forge-scrollbar-width,16px)}.forge-drawer__content::-webkit-scrollbar-track{background-color:var(--forge-scrollbar-track-container,var(--forge-theme-surface-container-low,#ebebeb))}.forge-drawer__content::-webkit-scrollbar-track:hover{background-color:var(--forge-scrollbar-track-container-hover,var(--forge-theme-surface-container-low,#ebebeb))}.forge-drawer__content::-webkit-scrollbar-corner{background-color:var(--forge-scrollbar-track-container,var(--forge-theme-surface-container-low,#ebebeb))}.forge-drawer__content::-webkit-scrollbar-thumb{height:var(--forge-scrollbar-thumb-min-height,32px);width:var(--forge-scrollbar-thumb-min-width,32px);border-radius:var(--forge-scrollbar-border-radius,var(--forge-shape-full,9999px));border-width:var(--forge-scrollbar-border-width,3px);border-style:solid;border-color:transparent;background-color:var(--forge-scrollbar-thumb-container,var(--forge-theme-surface-container-medium,#c2c2c2));background-clip:content-box}.forge-drawer__content::-webkit-scrollbar-thumb:hover{background-color:var(--forge-scrollbar-thumb-container-hover,var(--forge-theme-surface-container-high,#9e9e9e))}.forge-drawer--left{border-right-width:1px;border-right-style:solid}.forge-drawer--right{border-left-width:1px;border-left-style:solid}.forge-drawer--right.forge-drawer--closing{-webkit-transform:translateX(100%);transform:translateX(100%);right:0;left:auto;z-index:1;z-index:var(--forge-z-index-surface,1);position:absolute;top:0;right:0;-webkit-transition-duration:.2s;transition-duration:.2s}.forge-drawer--right.forge-drawer--closed{-webkit-transform:translateX(100%);transform:translateX(100%);right:0;left:auto;width:0;border:none}.forge-drawer--closing{-webkit-transform:translateX(-100%);transform:translateX(-100%);left:0;z-index:1;z-index:var(--forge-z-index-surface,1);position:absolute;top:0;right:0;-webkit-transition-duration:.2s;transition-duration:.2s}.forge-drawer--closed{-webkit-transform:translateX(-100%);transform:translateX(-100%);left:0;width:0;border:none}.forge-drawer--no-transition{-webkit-transition:none!important;transition:none!important}:host{display:-webkit-box;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;flex-direction:column;-webkit-box-sizing:border-box;box-sizing:border-box;height:100%;overflow:hidden!important}@media not all and (-webkit-min-device-pixel-ratio:0),not all and (min-resolution:0.001dpcm){@supports (-webkit-appearance:none) and (stroke-color:transparent){:host([open]){-webkit-transform:translateZ(0);transform:translateZ(0)}}}';
 /**
  * The web component class behind the `<forge-drawer>` custom element.
  *

package/esm/drawer/mini-drawer/mini-drawer.js

@@ -8,7 +8,7 @@ import { attachShadowTemplate, CustomElement } from '@tylertech/forge-core';
 import { BaseDrawerAdapter, BaseDrawerComponent, BaseDrawerFoundation } from '../base';
 import { MINI_DRAWER_CONSTANTS } from './mini-drawer-constants';
 const template = '<template><div class=\"forge-drawer__root\" part=\"root\"><div class=\"forge-drawer forge-drawer--mini\" part=\"container\"><slot name=\"header\"></slot><div class=\"forge-drawer__content\" part=\"content\"><slot></slot></div><slot name=\"footer\"></slot></div></div></template>';
-const styles = '.forge-drawer{width:256px;width:var(--forge-drawer-width,256px);border-color:#e0e0e0;border-color:var(--forge-theme-border-color,#e0e0e0);background-color:#fff;background-color:var(--mdc-theme-surface,#fff);height:100%;-webkit-box-sizing:border-box;box-sizing:border-box;display:grid;grid-template-columns:1fr;grid-template-rows:auto 1fr auto;overflow:hidden;-webkit-transition-property:-webkit-transform;transition-property:-webkit-transform;transition-property:transform;transition-property:transform,-webkit-transform;-webkit-transition-duration:250ms;transition-duration:250ms;-webkit-transition-timing-function:cubic-bezier(0.4,0,0.2,1);transition-timing-function:cubic-bezier(0.4,0,0.2,1)}.forge-drawer ::slotted([slot=header]){grid-row:1}.forge-drawer ::slotted([slot=footer]){grid-row:3}.forge-drawer__content{overflow-x:auto;-webkit-overflow-scrolling:\"touch\";display:-webkit-box;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;flex-direction:column;grid-row:2}.forge-drawer__content::-webkit-scrollbar{width:16px;width:var(--forge-scrollbar-width,16px);height:16px;height:var(--forge-scrollbar-height,16px)}.forge-drawer__content::-webkit-scrollbar-corner{background-color:#f0f0f0;background-color:var(--forge-theme-scrollbar-track,#f0f0f0)}.forge-drawer__content::-webkit-scrollbar-track{background-color:#f0f0f0;background-color:var(--forge-theme-scrollbar-track,#f0f0f0)}.forge-drawer__content::-webkit-scrollbar-track:hover{background-color:#ececec;background-color:var(--forge-theme-scrollbar-track-hover,#ececec)}.forge-drawer__content::-webkit-scrollbar-thumb{background-color:#bdbdbd;background-color:var(--forge-theme-scrollbar-thumb,#bdbdbd);height:32px;height:var(--forge-scrollbar-min-height,32px);width:32px;width:var(--forge-scrollbar-min-width,32px);border-radius:10px;border-radius:var(--forge-scrollbar-border-radius,10px);border-width:3px;border-width:var(--forge-scrollbar-border-width,3px);border-style:solid;border-color:transparent;background-clip:content-box}.forge-drawer__content::-webkit-scrollbar-thumb:hover{background-color:#9e9e9e;background-color:var(--forge-theme-scrollbar-thumb-hover,#9e9e9e)}.forge-drawer--left{border-right-width:1px;border-right-style:solid}.forge-drawer--right{border-left-width:1px;border-left-style:solid}.forge-drawer--right.forge-drawer--closing{-webkit-transform:translateX(100%);transform:translateX(100%);right:0;left:auto;z-index:1;z-index:var(--forge-z-index-surface,1);position:absolute;top:0;right:0;-webkit-transition-duration:.2s;transition-duration:.2s}.forge-drawer--right.forge-drawer--closed{-webkit-transform:translateX(100%);transform:translateX(100%);right:0;left:auto;width:0;border:none}.forge-drawer--closing{-webkit-transform:translateX(-100%);transform:translateX(-100%);left:0;z-index:1;z-index:var(--forge-z-index-surface,1);position:absolute;top:0;right:0;-webkit-transition-duration:.2s;transition-duration:.2s}.forge-drawer--closed{-webkit-transform:translateX(-100%);transform:translateX(-100%);left:0;width:0;border:none}.forge-drawer--no-transition{-webkit-transition:none!important;transition:none!important}.forge-drawer__root{z-index:1;z-index:var(--forge-z-index-surface,1);height:100%}.forge-drawer--mini{width:56px;width:var(--forge-drawer-mini-width,56px);z-index:1;z-index:var(--forge-z-index-surface,1);-webkit-transform:translateX(0);transform:translateX(0);-webkit-transition-property:width,-webkit-transform;transition-property:width,-webkit-transform;transition-property:transform,width;transition-property:transform,width,-webkit-transform;-webkit-transition:width .2s cubic-bezier(.4, 0, .2, 1);transition:width .2s cubic-bezier(.4, 0, .2, 1)}.forge-drawer--mini .forge-drawer__content{overflow:hidden}.forge-drawer--closed{width:0}:host{display:-webkit-box;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;flex-direction:column;-webkit-box-sizing:border-box;box-sizing:border-box;height:100%;overflow:hidden!important;width:56px;width:var(--forge-drawer-mini-width,56px);overflow:visible!important}:host([direction=right]){min-width:56px;min-width:var(--forge-drawer-mini-width,56px);width:auto}:host([direction=right]) .forge-drawer__root{position:relative}:host(:not([open])){display:none}:host([hover]) .forge-drawer--right{position:absolute;right:0}:host([hover]) .forge-drawer:hover{width:256px!important;width:var(--forge-drawer-width,256px)!important;-webkit-transition:width .3s cubic-bezier(.4, 0, .2, 1) .3s;transition:width .3s cubic-bezier(.4, 0, .2, 1) .3s}:host([hover]) .forge-drawer:hover .forge-drawer__content{overflow:auto;overflow:overlay}';
+const styles = '.forge-drawer{width:256px;width:var(--forge-drawer-width,256px);border-color:#e0e0e0;border-color:var(--forge-theme-border-color,#e0e0e0);background-color:#fff;background-color:var(--mdc-theme-surface,#fff);height:100%;-webkit-box-sizing:border-box;box-sizing:border-box;display:grid;grid-template-columns:1fr;grid-template-rows:auto 1fr auto;overflow:hidden;-webkit-transition-property:-webkit-transform;transition-property:-webkit-transform;transition-property:transform;transition-property:transform,-webkit-transform;-webkit-transition-duration:250ms;transition-duration:250ms;-webkit-transition-timing-function:cubic-bezier(0.4,0,0.2,1);transition-timing-function:cubic-bezier(0.4,0,0.2,1)}.forge-drawer ::slotted([slot=header]){grid-row:1}.forge-drawer ::slotted([slot=footer]){grid-row:3}.forge-drawer__content{overflow-x:auto;-webkit-overflow-scrolling:\"touch\";display:-webkit-box;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;flex-direction:column;grid-row:2}.forge-drawer__content::-webkit-scrollbar{height:var(--forge-scrollbar-height,16px);width:var(--forge-scrollbar-width,16px)}.forge-drawer__content::-webkit-scrollbar-track{background-color:var(--forge-scrollbar-track-container,var(--forge-theme-surface-container-low,#ebebeb))}.forge-drawer__content::-webkit-scrollbar-track:hover{background-color:var(--forge-scrollbar-track-container-hover,var(--forge-theme-surface-container-low,#ebebeb))}.forge-drawer__content::-webkit-scrollbar-corner{background-color:var(--forge-scrollbar-track-container,var(--forge-theme-surface-container-low,#ebebeb))}.forge-drawer__content::-webkit-scrollbar-thumb{height:var(--forge-scrollbar-thumb-min-height,32px);width:var(--forge-scrollbar-thumb-min-width,32px);border-radius:var(--forge-scrollbar-border-radius,var(--forge-shape-full,9999px));border-width:var(--forge-scrollbar-border-width,3px);border-style:solid;border-color:transparent;background-color:var(--forge-scrollbar-thumb-container,var(--forge-theme-surface-container-medium,#c2c2c2));background-clip:content-box}.forge-drawer__content::-webkit-scrollbar-thumb:hover{background-color:var(--forge-scrollbar-thumb-container-hover,var(--forge-theme-surface-container-high,#9e9e9e))}.forge-drawer--left{border-right-width:1px;border-right-style:solid}.forge-drawer--right{border-left-width:1px;border-left-style:solid}.forge-drawer--right.forge-drawer--closing{-webkit-transform:translateX(100%);transform:translateX(100%);right:0;left:auto;z-index:1;z-index:var(--forge-z-index-surface,1);position:absolute;top:0;right:0;-webkit-transition-duration:.2s;transition-duration:.2s}.forge-drawer--right.forge-drawer--closed{-webkit-transform:translateX(100%);transform:translateX(100%);right:0;left:auto;width:0;border:none}.forge-drawer--closing{-webkit-transform:translateX(-100%);transform:translateX(-100%);left:0;z-index:1;z-index:var(--forge-z-index-surface,1);position:absolute;top:0;right:0;-webkit-transition-duration:.2s;transition-duration:.2s}.forge-drawer--closed{-webkit-transform:translateX(-100%);transform:translateX(-100%);left:0;width:0;border:none}.forge-drawer--no-transition{-webkit-transition:none!important;transition:none!important}.forge-drawer__root{z-index:1;z-index:var(--forge-z-index-surface,1);height:100%}.forge-drawer--mini{width:56px;width:var(--forge-drawer-mini-width,56px);z-index:1;z-index:var(--forge-z-index-surface,1);-webkit-transform:translateX(0);transform:translateX(0);-webkit-transition-property:width,-webkit-transform;transition-property:width,-webkit-transform;transition-property:transform,width;transition-property:transform,width,-webkit-transform;-webkit-transition:width .2s cubic-bezier(.4, 0, .2, 1);transition:width .2s cubic-bezier(.4, 0, .2, 1)}.forge-drawer--mini .forge-drawer__content{overflow:hidden}.forge-drawer--closed{width:0}:host{display:-webkit-box;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;flex-direction:column;-webkit-box-sizing:border-box;box-sizing:border-box;height:100%;overflow:hidden!important;width:56px;width:var(--forge-drawer-mini-width,56px);overflow:visible!important}:host([direction=right]){min-width:56px;min-width:var(--forge-drawer-mini-width,56px);width:auto}:host([direction=right]) .forge-drawer__root{position:relative}:host(:not([open])){display:none}:host([hover]) .forge-drawer--right{position:absolute;right:0}:host([hover]) .forge-drawer:hover{width:256px!important;width:var(--forge-drawer-width,256px)!important;-webkit-transition:width .3s cubic-bezier(.4, 0, .2, 1) .3s;transition:width .3s cubic-bezier(.4, 0, .2, 1) .3s}:host([hover]) .forge-drawer:hover .forge-drawer__content{overflow:auto;overflow:overlay}';
 /**
  * The web component class behind the `<forge-mini-drawer>` custom element.
  *

package/esm/drawer/modal-drawer/modal-drawer.js

@@ -11,7 +11,7 @@ import { ModalDrawerAdapter } from './modal-drawer-adapter';
 import { MODAL_DRAWER_CONSTANTS } from './modal-drawer-constants';
 import { ModalDrawerFoundation } from './modal-drawer-foundation';
 const template = '<template><forge-backdrop class=\"forge-drawer__scrim\" hidden part=\"scrim\"></forge-backdrop><div class=\"forge-drawer forge-drawer--modal\" part=\"root\"><slot name=\"header\"></slot><div class=\"forge-drawer__content\" part=\"content\"><slot></slot></div><slot name=\"footer\"></slot></div></template>';
-const styles = '.forge-drawer{width:256px;width:var(--forge-drawer-width,256px);border-color:#e0e0e0;border-color:var(--forge-theme-border-color,#e0e0e0);background-color:#fff;background-color:var(--mdc-theme-surface,#fff);height:100%;-webkit-box-sizing:border-box;box-sizing:border-box;display:grid;grid-template-columns:1fr;grid-template-rows:auto 1fr auto;overflow:hidden;-webkit-transition-property:-webkit-transform;transition-property:-webkit-transform;transition-property:transform;transition-property:transform,-webkit-transform;-webkit-transition-duration:250ms;transition-duration:250ms;-webkit-transition-timing-function:cubic-bezier(0.4,0,0.2,1);transition-timing-function:cubic-bezier(0.4,0,0.2,1)}.forge-drawer ::slotted([slot=header]){grid-row:1}.forge-drawer ::slotted([slot=footer]){grid-row:3}.forge-drawer__content{overflow-x:auto;-webkit-overflow-scrolling:\"touch\";display:-webkit-box;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;flex-direction:column;grid-row:2}.forge-drawer__content::-webkit-scrollbar{width:16px;width:var(--forge-scrollbar-width,16px);height:16px;height:var(--forge-scrollbar-height,16px)}.forge-drawer__content::-webkit-scrollbar-corner{background-color:#f0f0f0;background-color:var(--forge-theme-scrollbar-track,#f0f0f0)}.forge-drawer__content::-webkit-scrollbar-track{background-color:#f0f0f0;background-color:var(--forge-theme-scrollbar-track,#f0f0f0)}.forge-drawer__content::-webkit-scrollbar-track:hover{background-color:#ececec;background-color:var(--forge-theme-scrollbar-track-hover,#ececec)}.forge-drawer__content::-webkit-scrollbar-thumb{background-color:#bdbdbd;background-color:var(--forge-theme-scrollbar-thumb,#bdbdbd);height:32px;height:var(--forge-scrollbar-min-height,32px);width:32px;width:var(--forge-scrollbar-min-width,32px);border-radius:10px;border-radius:var(--forge-scrollbar-border-radius,10px);border-width:3px;border-width:var(--forge-scrollbar-border-width,3px);border-style:solid;border-color:transparent;background-clip:content-box}.forge-drawer__content::-webkit-scrollbar-thumb:hover{background-color:#9e9e9e;background-color:var(--forge-theme-scrollbar-thumb-hover,#9e9e9e)}.forge-drawer--left{border-right-width:1px;border-right-style:solid}.forge-drawer--right{border-left-width:1px;border-left-style:solid}.forge-drawer--right.forge-drawer--closing{-webkit-transform:translateX(100%);transform:translateX(100%);right:0;left:auto;z-index:1;z-index:var(--forge-z-index-surface,1);position:absolute;top:0;right:0;-webkit-transition-duration:.2s;transition-duration:.2s}.forge-drawer--right.forge-drawer--closed{-webkit-transform:translateX(100%);transform:translateX(100%);right:0;left:auto;width:0;border:none}.forge-drawer--closing{-webkit-transform:translateX(-100%);transform:translateX(-100%);left:0;z-index:1;z-index:var(--forge-z-index-surface,1);position:absolute;top:0;right:0;-webkit-transition-duration:.2s;transition-duration:.2s}.forge-drawer--closed{-webkit-transform:translateX(-100%);transform:translateX(-100%);left:0;width:0;border:none}.forge-drawer--no-transition{-webkit-transition:none!important;transition:none!important}.forge-drawer--modal{-webkit-box-shadow:0 11px 15px -7px rgba(0,0,0,.2),0 24px 38px 3px rgba(0,0,0,.14),0 9px 46px 8px rgba(0,0,0,.12);box-shadow:0 11px 15px -7px rgba(0,0,0,.2),0 24px 38px 3px rgba(0,0,0,.14),0 9px 46px 8px rgba(0,0,0,.12);z-index:8;z-index:var(--forge-z-index-dialog,8);position:absolute;top:0;max-width:80%}.forge-drawer--modal+.mdc-drawer-scrim{background-color:rgba(0,0,0,.32)}.forge-drawer--modal.forge-drawer--closed,.forge-drawer--modal.forge-drawer--closing{-webkit-box-shadow:none;box-shadow:none}.forge-drawer--modal.forge-drawer--closing.forge-drawer--right{-webkit-transform:translateX(100%);transform:translateX(100%)}.forge-drawer__scrim{z-index:8;z-index:var(--forge-z-index-dialog,8)}.forge-drawer__scrim--closed{display:none}.forge-drawer.forge-drawer--right{right:0}.forge-drawer--display-none{display:none!important}';
+const styles = '.forge-drawer{width:256px;width:var(--forge-drawer-width,256px);border-color:#e0e0e0;border-color:var(--forge-theme-border-color,#e0e0e0);background-color:#fff;background-color:var(--mdc-theme-surface,#fff);height:100%;-webkit-box-sizing:border-box;box-sizing:border-box;display:grid;grid-template-columns:1fr;grid-template-rows:auto 1fr auto;overflow:hidden;-webkit-transition-property:-webkit-transform;transition-property:-webkit-transform;transition-property:transform;transition-property:transform,-webkit-transform;-webkit-transition-duration:250ms;transition-duration:250ms;-webkit-transition-timing-function:cubic-bezier(0.4,0,0.2,1);transition-timing-function:cubic-bezier(0.4,0,0.2,1)}.forge-drawer ::slotted([slot=header]){grid-row:1}.forge-drawer ::slotted([slot=footer]){grid-row:3}.forge-drawer__content{overflow-x:auto;-webkit-overflow-scrolling:\"touch\";display:-webkit-box;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;flex-direction:column;grid-row:2}.forge-drawer__content::-webkit-scrollbar{height:var(--forge-scrollbar-height,16px);width:var(--forge-scrollbar-width,16px)}.forge-drawer__content::-webkit-scrollbar-track{background-color:var(--forge-scrollbar-track-container,var(--forge-theme-surface-container-low,#ebebeb))}.forge-drawer__content::-webkit-scrollbar-track:hover{background-color:var(--forge-scrollbar-track-container-hover,var(--forge-theme-surface-container-low,#ebebeb))}.forge-drawer__content::-webkit-scrollbar-corner{background-color:var(--forge-scrollbar-track-container,var(--forge-theme-surface-container-low,#ebebeb))}.forge-drawer__content::-webkit-scrollbar-thumb{height:var(--forge-scrollbar-thumb-min-height,32px);width:var(--forge-scrollbar-thumb-min-width,32px);border-radius:var(--forge-scrollbar-border-radius,var(--forge-shape-full,9999px));border-width:var(--forge-scrollbar-border-width,3px);border-style:solid;border-color:transparent;background-color:var(--forge-scrollbar-thumb-container,var(--forge-theme-surface-container-medium,#c2c2c2));background-clip:content-box}.forge-drawer__content::-webkit-scrollbar-thumb:hover{background-color:var(--forge-scrollbar-thumb-container-hover,var(--forge-theme-surface-container-high,#9e9e9e))}.forge-drawer--left{border-right-width:1px;border-right-style:solid}.forge-drawer--right{border-left-width:1px;border-left-style:solid}.forge-drawer--right.forge-drawer--closing{-webkit-transform:translateX(100%);transform:translateX(100%);right:0;left:auto;z-index:1;z-index:var(--forge-z-index-surface,1);position:absolute;top:0;right:0;-webkit-transition-duration:.2s;transition-duration:.2s}.forge-drawer--right.forge-drawer--closed{-webkit-transform:translateX(100%);transform:translateX(100%);right:0;left:auto;width:0;border:none}.forge-drawer--closing{-webkit-transform:translateX(-100%);transform:translateX(-100%);left:0;z-index:1;z-index:var(--forge-z-index-surface,1);position:absolute;top:0;right:0;-webkit-transition-duration:.2s;transition-duration:.2s}.forge-drawer--closed{-webkit-transform:translateX(-100%);transform:translateX(-100%);left:0;width:0;border:none}.forge-drawer--no-transition{-webkit-transition:none!important;transition:none!important}.forge-drawer--modal{-webkit-box-shadow:0 11px 15px -7px rgba(0,0,0,.2),0 24px 38px 3px rgba(0,0,0,.14),0 9px 46px 8px rgba(0,0,0,.12);box-shadow:0 11px 15px -7px rgba(0,0,0,.2),0 24px 38px 3px rgba(0,0,0,.14),0 9px 46px 8px rgba(0,0,0,.12);z-index:8;z-index:var(--forge-z-index-dialog,8);position:absolute;top:0;max-width:80%}.forge-drawer--modal+.mdc-drawer-scrim{background-color:rgba(0,0,0,.32)}.forge-drawer--modal.forge-drawer--closed,.forge-drawer--modal.forge-drawer--closing{-webkit-box-shadow:none;box-shadow:none}.forge-drawer--modal.forge-drawer--closing.forge-drawer--right{-webkit-transform:translateX(100%);transform:translateX(100%)}.forge-drawer__scrim{z-index:8;z-index:var(--forge-z-index-dialog,8)}.forge-drawer__scrim--closed{display:none}.forge-drawer.forge-drawer--right{right:0}.forge-drawer--display-none{display:none!important}';
 /**
  * The web component class behind the `<forge-modal-drawer>` custom element.
  *

package/esm/expansion-panel/expansion-panel-adapter.d.ts

@@ -20,6 +20,7 @@ export declare class ExpansionPanelAdapter extends BaseAdapter<IExpansionPanelCo
     private _headerElement;
     private _contentElement;
     private _headerSlotElement;
+    private _activeAnimationFrame;
     constructor(component: IExpansionPanelComponent);
     initialize(open: boolean, orientation?: string): void;
     setHeaderVisibility(visible: boolean): void;

package/esm/expansion-panel/expansion-panel-adapter.js

@@ -98,8 +98,9 @@ export class ExpansionPanelAdapter extends BaseAdapter {
             else {
                 this._contentElement.style.transition = EXPANSION_PANEL_CONSTANTS.strings.EXPANSION_VERTICAL_TRANSITION;
             }
-            window.requestAnimationFrame(() => {
-                window.requestAnimationFrame(() => {
+            this._activeAnimationFrame = window.requestAnimationFrame(() => {
+                this._activeAnimationFrame = window.requestAnimationFrame(() => {
+                    this._activeAnimationFrame = undefined;
                     if (opening) {
                         if (orientation === EXPANSION_PANEL_CONSTANTS.strings.ORIENTATION_HORIZONTAL) {
                             this._contentElement.style.width = `${this._contentElement.scrollWidth}px`;
@@ -130,6 +131,10 @@ export class ExpansionPanelAdapter extends BaseAdapter {
             });
         }
         else {
+            if (this._activeAnimationFrame) {
+                window.cancelAnimationFrame(this._activeAnimationFrame);
+                this._activeAnimationFrame = undefined;
+            }
             this._contentElement.style.removeProperty('transition');
             if (opening) {
                 if (orientation === EXPANSION_PANEL_CONSTANTS.strings.ORIENTATION_HORIZONTAL) {

package/esm/expansion-panel/expansion-panel.js

@@ -10,7 +10,7 @@ import { ExpansionPanelAdapter } from './expansion-panel-adapter';
 import { EXPANSION_PANEL_CONSTANTS } from './expansion-panel-constants';
 import { ExpansionPanelFoundation } from './expansion-panel-foundation';
 const template = '<template><div class=\"forge-expansion-panel\" part=\"root\"><div class=\"forge-expansion-panel__header\" part=\"header\"><slot name=\"header\"></slot></div><div class=\"forge-expansion-panel__content\" style=\"height: 0; opacity: 0; visibility: hidden;\" part=\"content\"><slot></slot></div></div></template>';
-const styles = '.forge-expansion-panel{display:block;display:var(--forge-expansion-panel-display,block);height:auto;height:var(--forge-expansion-panel-height,auto)}.forge-expansion-panel__header{outline:0}.forge-expansion-panel__header:hover{cursor:pointer}.forge-expansion-panel__header forge-open-icon{margin-left:auto}.forge-expansion-panel__content{overflow:hidden;overflow:var(--forge-expansion-panel-content-overflow,hidden);max-height:none;max-height:var(--forge-expansion-panel-content-max-height,none)}.forge-expansion-panel__content::-webkit-scrollbar{width:16px;width:var(--forge-scrollbar-width,16px);height:16px;height:var(--forge-scrollbar-height,16px)}.forge-expansion-panel__content::-webkit-scrollbar-corner{background-color:#f0f0f0;background-color:var(--forge-theme-scrollbar-track,#f0f0f0)}.forge-expansion-panel__content::-webkit-scrollbar-track{background-color:#f0f0f0;background-color:var(--forge-theme-scrollbar-track,#f0f0f0)}.forge-expansion-panel__content::-webkit-scrollbar-track:hover{background-color:#ececec;background-color:var(--forge-theme-scrollbar-track-hover,#ececec)}.forge-expansion-panel__content::-webkit-scrollbar-thumb{background-color:#bdbdbd;background-color:var(--forge-theme-scrollbar-thumb,#bdbdbd);height:32px;height:var(--forge-scrollbar-min-height,32px);width:32px;width:var(--forge-scrollbar-min-width,32px);border-radius:10px;border-radius:var(--forge-scrollbar-border-radius,10px);border-width:3px;border-width:var(--forge-scrollbar-border-width,3px);border-style:solid;border-color:transparent;background-clip:content-box}.forge-expansion-panel__content::-webkit-scrollbar-thumb:hover{background-color:#9e9e9e;background-color:var(--forge-theme-scrollbar-thumb-hover,#9e9e9e)}:host{display:block}:host([hidden]){display:none}';
+const styles = '.forge-expansion-panel{display:block;display:var(--forge-expansion-panel-display,block);height:auto;height:var(--forge-expansion-panel-height,auto)}.forge-expansion-panel__header{outline:0}.forge-expansion-panel__header:hover{cursor:pointer}.forge-expansion-panel__header forge-open-icon{margin-left:auto}.forge-expansion-panel__content{overflow:hidden;overflow:var(--forge-expansion-panel-content-overflow,hidden);max-height:none;max-height:var(--forge-expansion-panel-content-max-height,none)}.forge-expansion-panel__content::-webkit-scrollbar{height:var(--forge-scrollbar-height,16px);width:var(--forge-scrollbar-width,16px)}.forge-expansion-panel__content::-webkit-scrollbar-track{background-color:var(--forge-scrollbar-track-container,var(--forge-theme-surface-container-low,#ebebeb))}.forge-expansion-panel__content::-webkit-scrollbar-track:hover{background-color:var(--forge-scrollbar-track-container-hover,var(--forge-theme-surface-container-low,#ebebeb))}.forge-expansion-panel__content::-webkit-scrollbar-corner{background-color:var(--forge-scrollbar-track-container,var(--forge-theme-surface-container-low,#ebebeb))}.forge-expansion-panel__content::-webkit-scrollbar-thumb{height:var(--forge-scrollbar-thumb-min-height,32px);width:var(--forge-scrollbar-thumb-min-width,32px);border-radius:var(--forge-scrollbar-border-radius,var(--forge-shape-full,9999px));border-width:var(--forge-scrollbar-border-width,3px);border-style:solid;border-color:transparent;background-color:var(--forge-scrollbar-thumb-container,var(--forge-theme-surface-container-medium,#c2c2c2));background-clip:content-box}.forge-expansion-panel__content::-webkit-scrollbar-thumb:hover{background-color:var(--forge-scrollbar-thumb-container-hover,var(--forge-theme-surface-container-high,#9e9e9e))}:host{display:block}:host([hidden]){display:none}';
 /**
  * A web component that encapsulates the functionality of expanding/collapsing content when clicked.
  *

package/esm/field/field-adapter.js

@@ -105,7 +105,7 @@ export class FieldAdapter extends BaseAdapter {
         return this._inputElement.placeholder ? this._inputElement.placeholder.trim().length > 0 : false;
     }
     inputHasFocus(target) {
-        return this._inputElement === target || this._inputElement === getActiveElement();
+        return this._inputElement === target || this._inputElement === getActiveElement(this._component.ownerDocument);
     }
     setLabelClass(name) {
         if (this._labelElement) {

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

@@ -51,6 +51,7 @@ export declare class FieldFoundation {
     protected _onTrailingSlotChanged(evt: Event): void;
     protected _onAddonEndSlotChanged(evt: Event): void;
     protected _initializeLabel(): void;
+    private _destroyFloatingLabel;
     protected _detectLeadingContent(): void;
     protected _detectTrailingContent(): void;
     protected _detectAddonEndContent(): void;

package/esm/field/field-foundation.js

@@ -66,6 +66,8 @@ export class FieldFoundation {
     disconnect() {
         this._isInitialized = false;
         this._adapter.destroy();
+        this._adapter.removeHostAttribute(FIELD_CONSTANTS.attributes.HOST_LABEL_FLOATING);
+        this._adapter.removeRootClass(FIELD_CONSTANTS.classes.LABEL);
         if (this._floatingLabel) {
             this._floatingLabel.destroy();
             this._floatingLabel = undefined;
@@ -83,10 +85,16 @@ export class FieldFoundation {
     }
     set density(value) {
         if (this._density !== value) {
+            const prevDensity = this._density;
             this._density = value;
             if (this._isInitialized) {
                 this._applyDensity();
-                this._initializeLabel();
+                if (this._density === 'dense') {
+                    this._destroyFloatingLabel({ cancelFloat: true });
+                }
+                else if (prevDensity === 'dense') {
+                    this._initializeLabel();
+                }
             }
             this._adapter.setHostAttribute(FIELD_CONSTANTS.attributes.DENSITY, this._density.toString());
         }
@@ -146,6 +154,9 @@ export class FieldFoundation {
     floatLabel(value) {
         var _a, _b;
         if (((_a = this._floatingLabel) === null || _a === void 0 ? void 0 : _a.isFloating) === value || this._adapter.isLabelFloating() === value) {
+            if (value) {
+                this._adapter.setHostAttribute(FIELD_CONSTANTS.attributes.HOST_LABEL_FLOATING, '');
+            }
             return;
         }
         if (!value && this._floatLabelType === 'always') {
@@ -181,9 +192,8 @@ export class FieldFoundation {
         this._detectAddonEndContent();
     }
     _initializeLabel() {
-        if (this._floatingLabel) {
-            this._floatingLabel.destroy();
-        }
+        var _a;
+        (_a = this._floatingLabel) === null || _a === void 0 ? void 0 : _a.destroy();
         this._adapter.detectLabel();
         if (this._adapter.hasLabel() && this._density !== 'dense') {
             this._floatingLabel = this._adapter.initializeFloatingLabel();
@@ -192,11 +202,16 @@ export class FieldFoundation {
             this._adapter.setRootClass(FIELD_CONSTANTS.classes.LABEL);
         }
         else {
-            this._adapter.removeHostAttribute(FIELD_CONSTANTS.attributes.HOST_LABEL_FLOATING);
-            this._adapter.removeRootClass(FIELD_CONSTANTS.classes.LABEL);
-            this._floatingLabel = undefined;
+            this._destroyFloatingLabel();
         }
     }
+    _destroyFloatingLabel({ cancelFloat = false } = {}) {
+        var _a;
+        this._adapter.removeHostAttribute(FIELD_CONSTANTS.attributes.HOST_LABEL_FLOATING);
+        this._adapter.removeRootClass(FIELD_CONSTANTS.classes.LABEL);
+        (_a = this._floatingLabel) === null || _a === void 0 ? void 0 : _a.destroy({ cancelFloat });
+        this._floatingLabel = undefined;
+    }
     _detectLeadingContent() {
         if (this._adapter.hasLeadingNodes()) {
             this._adapter.setRootClass(FIELD_CONSTANTS.classes.LEADING);

package/esm/floating-label/floating-label-foundation.d.ts

@@ -7,9 +7,12 @@ import { IFloatingLabelAdapter } from './floating-label-adapter';
 export declare class FloatingLabelFoundation {
     protected _adapter: IFloatingLabelAdapter;
     private _floatAnimationEndHandler;
+    private _activeFrame;
     constructor(_adapter: IFloatingLabelAdapter);
     initialize(): void;
-    disconnect(): void;
+    disconnect({ cancelFloat }?: {
+        cancelFloat?: boolean | undefined;
+    }): void;
     float(shouldFloat: boolean, alwaysFloat?: boolean): void;
     getWidth(): number;
     get isFloating(): boolean;

package/esm/floating-label/floating-label-foundation.js

@@ -18,7 +18,10 @@ export class FloatingLabelFoundation {
             this._adapter.addLabelListener('transitionend', this._floatAnimationEndHandler);
         }
     }
-    disconnect() {
+    disconnect({ cancelFloat = false } = {}) {
+        if (cancelFloat && this._activeFrame) {
+            window.cancelAnimationFrame(this._activeFrame);
+        }
         this._adapter.removeLabelClass(FLOATING_LABEL_CONSTANTS.classes.FLOATING_LABEL);
         this._adapter.removeLabelClass(FLOATING_LABEL_CONSTANTS.classes.FLOAT_ABOVE);
         this._adapter.removeLabelClass(FLOATING_LABEL_CONSTANTS.classes.FLOAT_ABOVE_END_KEYFRAME);
@@ -32,9 +35,9 @@ export class FloatingLabelFoundation {
             if (this._adapter.hasLabelClass(FLOATING_LABEL_CONSTANTS.classes.UNFLOAT_ABOVE_START_KEYFRAME)) {
                 this._adapter.removeLabelClass(FLOATING_LABEL_CONSTANTS.classes.UNFLOAT_ABOVE_START_KEYFRAME);
             }
-            requestAnimationFrame(() => {
-                requestAnimationFrame(() => {
-                    if (alwaysFloat || this._adapter.hasLabelClass(FLOATING_LABEL_CONSTANTS.classes.FLOAT_ABOVE)) {
+            this._activeFrame = window.requestAnimationFrame(() => {
+                this._activeFrame = window.requestAnimationFrame(() => {
+                    if (alwaysFloat || this.isFloating) {
                         this._adapter.addLabelClass(FLOATING_LABEL_CONSTANTS.classes.FLOAT_ABOVE_END_KEYFRAME);
                     }
                     this._adapter.addLabelClass(FLOATING_LABEL_CONSTANTS.classes.FLOAT_ABOVE);
@@ -46,8 +49,8 @@ export class FloatingLabelFoundation {
             if (this._adapter.hasLabelClass(FLOATING_LABEL_CONSTANTS.classes.FLOAT_ABOVE_END_KEYFRAME)) {
                 this._adapter.removeLabelClass(FLOATING_LABEL_CONSTANTS.classes.FLOAT_ABOVE_END_KEYFRAME);
                 this._adapter.addLabelClass(FLOATING_LABEL_CONSTANTS.classes.UNFLOAT_ABOVE_START_KEYFRAME);
-                requestAnimationFrame(() => {
-                    requestAnimationFrame(() => {
+                this._activeFrame = window.requestAnimationFrame(() => {
+                    this._activeFrame = window.requestAnimationFrame(() => {
                         this._adapter.removeLabelClass(FLOATING_LABEL_CONSTANTS.classes.UNFLOAT_ABOVE_START_KEYFRAME);
                     });
                 });

package/esm/floating-label/floating-label.d.ts

@@ -7,7 +7,9 @@ export interface IFloatingLabel {
     isFloating: boolean;
     float(float: boolean, alwaysFloat?: boolean): void;
     getWidth(): number;
-    destroy(): void;
+    destroy(opts?: {
+        cancelFloat?: boolean;
+    }): void;
 }
 export declare class FloatingLabel implements IFloatingLabel {
     private _labelElement;
@@ -15,7 +17,9 @@ export declare class FloatingLabel implements IFloatingLabel {
     constructor(_labelElement: HTMLLabelElement);
     /** Returns the current label floating state. */
     get isFloating(): boolean;
-    destroy(): void;
+    destroy({ cancelFloat }?: {
+        cancelFloat?: boolean | undefined;
+    }): void;
     /**
      * Sets the floating state of the label element.
      * @param shouldFloat If true, sets the label to float, otherwise un-float.

package/esm/floating-label/floating-label.js

@@ -15,8 +15,8 @@ export class FloatingLabel {
     get isFloating() {
         return this._foundation.isFloating;
     }
-    destroy() {
-        this._foundation.disconnect();
+    destroy({ cancelFloat = false } = {}) {
+        this._foundation.disconnect({ cancelFloat });
         this._labelElement = undefined;
     }
     /**

package/esm/focus-indicator/focus-indicator-foundation.js

@@ -21,8 +21,8 @@ export class FocusIndicatorFoundation {
         this._addListeners();
     }
     destroy() {
+        this._removeListeners(); // Must be called before destroying adapter
         this._adapter.destroy();
-        this._removeListeners();
     }
     _addListeners() {
         this._adapter.addTargetListener('focusin', this._interactionListener);

package/esm/focus-indicator/focus-indicator.js

@@ -10,7 +10,7 @@ import { FocusIndicatorAdapter } from './focus-indicator-adapter';
 import { FOCUS_INDICATOR_CONSTANTS } from './focus-indicator-constants';
 import { FocusIndicatorFoundation } from './focus-indicator-foundation';
 const template = '<template><div class=\"forge-focus-indicator\" part=\"indicator\"></div></template>';
-const styles = ':host{display:contents}:host([hidden]){display:none}:host([active]) .forge-focus-indicator{display:-webkit-box;display:flex}:host(:not([inward])) .forge-focus-indicator{-webkit-animation-name:outward-grow,outward-shrink;animation-name:outward-grow,outward-shrink;border-end-end-radius:calc(var(--_shape-end-end) + var(--_outward-offset));border-end-start-radius:calc(var(--_shape-end-start) + var(--_outward-offset));border-start-end-radius:calc(var(--_shape-start-end) + var(--_outward-offset));border-start-start-radius:calc(var(--_shape-start-start) + var(--_outward-offset));inset:calc(-1 * var(--_outward-offset));outline:var(--_width) solid currentColor}:host([inward]) .forge-focus-indicator{-webkit-animation-name:inward-grow,inward-shrink;animation-name:inward-grow,inward-shrink;border-end-end-radius:calc(var(--_shape-end-end) - var(--_inward-offset));border-end-start-radius:calc(var(--_shape-end-start) - var(--_inward-offset));border-start-end-radius:calc(var(--_shape-start-end) - var(--_inward-offset));border-start-start-radius:calc(var(--_shape-start-start) - var(--_inward-offset));border:var(--_width) solid currentColor;inset:var(--_inward-offset)}:host([circular]) .forge-focus-indicator{--_shape:50%}.forge-focus-indicator{--_active-width:var(--forge-focus-indicator-active-width, 6px);--_color:var(--forge-focus-indicator-color, var(--forge-theme-primary, #3f51b5));--_duration:var(--forge-focus-indicator-duration, 600ms);--_outward-offset:var(--forge-focus-indicator-outward-offset, 4px);--_inward-offset:var(--forge-focus-indicator-inward-offset, 0px);--_shape:var(--forge-focus-indicator-shape, 1px);--_width:var(--forge-focus-indicator-width, 2px);--_easing:var(--forge-focus-indicator-easing, cubic-bezier(0.2, 0, 0, 1));--_shape-start-start:var(--forge-focus-indicator-shape-start-start, var(--_shape));--_shape-start-end:var(--forge-focus-indicator-shape-start-end, var(--_shape));--_shape-end-start:var(--forge-focus-indicator-shape-end-start, var(--_shape));--_shape-end-end:var(--forge-focus-indicator-shape-end-end, var(--_shape));--_margin-block:var(--forge-focus-indicator-offset-block, 0);--_margin-inline:var(--forge-focus-indicator-offset-inline, 0);-webkit-animation-delay:0s,calc(var(--_duration) * .25);animation-delay:0s,calc(var(--_duration) * .25);-webkit-animation-duration:calc(var(--_duration) * .25),calc(var(--_duration) * .75);animation-duration:calc(var(--_duration) * .25),calc(var(--_duration) * .75);-webkit-animation-timing-function:var(--_easing);animation-timing-function:var(--_easing);-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--_color);display:none;pointer-events:none;position:absolute;margin-block:var(--_margin-block);margin-inline:var(--_margin-inline)}@-webkit-keyframes outward-grow{from{outline-width:0}to{outline-width:var(--_active-width)}}@keyframes outward-grow{from{outline-width:0}to{outline-width:var(--_active-width)}}@-webkit-keyframes outward-shrink{from{outline-width:var(--_active-width)}}@keyframes outward-shrink{from{outline-width:var(--_active-width)}}@-webkit-keyframes inward-grow{from{border-width:0}to{border-width:var(--_active-width)}}@keyframes inward-grow{from{border-width:0}to{border-width:var(--_active-width)}}@-webkit-keyframes inward-shrink{from{border-width:var(--_active-width)}}@keyframes inward-shrink{from{border-width:var(--_active-width)}}@media (prefers-reduced-motion){.forge-focus-indicator{-webkit-animation:none;animation:none}}';
+const styles = ':host{display:contents}:host([hidden]){display:none}:host([active]) .forge-focus-indicator{display:-webkit-box;display:flex}:host(:not([inward])) .forge-focus-indicator{-webkit-animation-name:outward-grow,outward-shrink;animation-name:outward-grow,outward-shrink;border-end-end-radius:calc(var(--_shape-end-end) + var(--_outward-offset));border-end-start-radius:calc(var(--_shape-end-start) + var(--_outward-offset));border-start-end-radius:calc(var(--_shape-start-end) + var(--_outward-offset));border-start-start-radius:calc(var(--_shape-start-start) + var(--_outward-offset));inset:calc(-1 * var(--_outward-offset));outline:var(--_width) solid currentColor}:host([inward]) .forge-focus-indicator{-webkit-animation-name:inward-grow,inward-shrink;animation-name:inward-grow,inward-shrink;border-end-end-radius:calc(var(--_shape-end-end) - var(--_inward-offset));border-end-start-radius:calc(var(--_shape-end-start) - var(--_inward-offset));border-start-end-radius:calc(var(--_shape-start-end) - var(--_inward-offset));border-start-start-radius:calc(var(--_shape-start-start) - var(--_inward-offset));border:var(--_width) solid currentColor;inset:var(--_inward-offset)}:host([circular]) .forge-focus-indicator{--_shape:50%}.forge-focus-indicator{--_active-width:var(--forge-focus-indicator-active-width, 6px);--_color:var(--forge-focus-indicator-color, var(--forge-theme-primary, #3f51b5));--_duration:var(--forge-focus-indicator-duration, var(--forge-animation-duration-long4, 600ms));--_outward-offset:var(--forge-focus-indicator-outward-offset, var(--forge-spacing-025, 4px));--_inward-offset:var(--forge-focus-indicator-inward-offset, 0px);--_shape:var(--forge-focus-indicator-shape, var(--forge-shape-extra-small, 1px));--_width:var(--forge-focus-indicator-width, var(--forge-border-medium, 2px));--_easing:var(--forge-focus-indicator-easing, var(--forge-animation-easing-emphasized, cubic-bezier(0.2, 0, 0, 1)));--_shape-start-start:var(--forge-focus-indicator-shape-start-start, var(--_shape));--_shape-start-end:var(--forge-focus-indicator-shape-start-end, var(--_shape));--_shape-end-start:var(--forge-focus-indicator-shape-end-start, var(--_shape));--_shape-end-end:var(--forge-focus-indicator-shape-end-end, var(--_shape));--_margin-block:var(--forge-focus-indicator-offset-block, 0);--_margin-inline:var(--forge-focus-indicator-offset-inline, 0);-webkit-animation-delay:0s,calc(var(--_duration) * .25);animation-delay:0s,calc(var(--_duration) * .25);-webkit-animation-duration:calc(var(--_duration) * .25),calc(var(--_duration) * .75);animation-duration:calc(var(--_duration) * .25),calc(var(--_duration) * .75);-webkit-animation-timing-function:var(--_easing);animation-timing-function:var(--_easing);-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--_color);display:none;pointer-events:none;position:absolute;margin-block:var(--_margin-block);margin-inline:var(--_margin-inline)}@-webkit-keyframes outward-grow{from{outline-width:0}to{outline-width:var(--_active-width)}}@keyframes outward-grow{from{outline-width:0}to{outline-width:var(--_active-width)}}@-webkit-keyframes outward-shrink{from{outline-width:var(--_active-width)}}@keyframes outward-shrink{from{outline-width:var(--_active-width)}}@-webkit-keyframes inward-grow{from{border-width:0}to{border-width:var(--_active-width)}}@keyframes inward-grow{from{border-width:0}to{border-width:var(--_active-width)}}@-webkit-keyframes inward-shrink{from{border-width:var(--_active-width)}}@keyframes inward-shrink{from{border-width:var(--_active-width)}}@media (prefers-reduced-motion){.forge-focus-indicator{-webkit-animation:none;animation:none}}';
 /**
  * @tag forge-focus-indicator
  *

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

@@ -6,7 +6,6 @@
 import { IIconComponent } from './icon';
 import { BaseAdapter, IBaseAdapter } from '../core';
 export interface IIconAdapter extends IBaseAdapter {
-    initialize(): void;
     canLazyLoad(): boolean;
     observeVisibility(listener: () => void): void;
     destroyVisibilityObserver(): void;
@@ -15,7 +14,6 @@ export interface IIconAdapter extends IBaseAdapter {
 export declare class IconAdapter extends BaseAdapter<IIconComponent> implements IIconAdapter {
     private _observer;
     constructor(component: IIconComponent);
-    initialize(): void;
     canLazyLoad(): boolean;
     observeVisibility(listener: () => void): void;
     destroyVisibilityObserver(): void;

package/esm/icon/icon-adapter.js

@@ -9,11 +9,6 @@ export class IconAdapter extends BaseAdapter {
     constructor(component) {
         super(component);
     }
-    initialize() {
-        if (!this._component.hasAttribute('aria-hidden')) {
-            this._component.setAttribute('aria-hidden', 'true');
-        }
-    }
     canLazyLoad() {
         return !!window.IntersectionObserver;
     }
@@ -33,9 +28,13 @@ export class IconAdapter extends BaseAdapter {
         }
     }
     setContent(content) {
+        var _a;
         const shadowRoot = this._component.shadowRoot;
         const styleTag = shadowRoot.querySelector('style');
         shadowRoot.innerHTML = content;
+        if (content) {
+            (_a = shadowRoot.firstElementChild) === null || _a === void 0 ? void 0 : _a.setAttribute('aria-hidden', 'true');
+        }
         if (styleTag) {
             shadowRoot.appendChild(styleTag);
         }

package/esm/icon/icon-foundation.js

@@ -13,7 +13,6 @@ export class IconFoundation {
         this._lazyListener = () => this._loadIcon();
     }
     initialize() {
-        this._adapter.initialize();
         this._applyIcon();
     }
     disconnect() {

package/esm/index.d.ts

@@ -13,6 +13,7 @@ export * from './banner';
 export * from './bottom-sheet';
 export * from './busy-indicator';
 export * from './button';
+export * from './button-area';
 export * from './button-toggle';
 export * from './calendar';
 export * from './card';

package/esm/index.js

@@ -6,7 +6,7 @@
 /// <reference types="./typings" />
 /**
  * @license
- * Copyright (c) 2022 Tyler Technologies, Inc.
+ * Copyright (c) 2024 Tyler Technologies, Inc.
  * License: Apache-2.0
  */
 import { defineCustomElements } from '@tylertech/forge-core';
@@ -72,6 +72,7 @@ import { ViewComponent, ViewSwitcherComponent } from './view-switcher';
 import { IconComponent } from './icon';
 import { SelectDropdownComponent } from './select/select-dropdown';
 import { StackComponent } from './stack';
+import { ButtonAreaComponent } from './button-area';
 export * from './accordion';
 export * from './app-bar';
 export * from './autocomplete';
@@ -82,6 +83,7 @@ export * from './banner';
 export * from './bottom-sheet';
 export * from './busy-indicator';
 export * from './button';
+export * from './button-area';
 export * from './button-toggle';
 export * from './calendar';
 export * from './card';
@@ -146,6 +148,7 @@ const CUSTOM_ELEMENTS = [
     BottomSheetComponent,
     BusyIndicatorComponent,
     ButtonComponent,
+    ButtonAreaComponent,
     ButtonToggleComponent,
     ButtonToggleGroupComponent,
     CalendarComponent,

package/esm/keyboard-shortcut/keyboard-shortcut-constants.d.ts

@@ -23,6 +23,7 @@ export declare const KEYBOARD_SHORTCUT_CONSTANTS: {
     };
 };
 export declare const textInputTypes: string[];
+export type KeyboardShortcutActivateCallback = (event: KeyboardEvent) => void;
 export interface IKeyCombination {
     key: string;
     modifier?: string;

package/esm/keyboard-shortcut/keyboard-shortcut-foundation.d.ts

@@ -5,6 +5,7 @@
  */
 import { ICustomElementFoundation } from '@tylertech/forge-core';
 import { IKeyboardShortcutAdapter } from './keyboard-shortcut-adapter';
+import { KeyboardShortcutActivateCallback } from './keyboard-shortcut-constants';
 export interface IKeyboardShortcutFoundation extends ICustomElementFoundation {
     key: string | null | undefined;
     target: string;
@@ -14,6 +15,7 @@ export interface IKeyboardShortcutFoundation extends ICustomElementFoundation {
     capture: boolean;
     useCode: boolean;
     disabled: boolean;
+    activateCallback: KeyboardShortcutActivateCallback | null | undefined;
 }
 export declare class KeyboardShortcutFoundation implements IKeyboardShortcutFoundation {
     private _adapter;
@@ -25,6 +27,7 @@ export declare class KeyboardShortcutFoundation implements IKeyboardShortcutFoun
     private _capture;
     private _useCode;
     private _disabled;
+    private _activateCallback;
     private _keyCombinations;
     private _keyDownListener;
     constructor(_adapter: IKeyboardShortcutAdapter);
@@ -60,4 +63,7 @@ export declare class KeyboardShortcutFoundation implements IKeyboardShortcutFoun
     /** Gets/sets whether the event will be emitted. */
     get disabled(): boolean;
     set disabled(value: boolean);
+    /** Gets/sets the activation callback. */
+    get activateCallback(): KeyboardShortcutActivateCallback | null | undefined;
+    set activateCallback(value: KeyboardShortcutActivateCallback | null | undefined);
 }

package/esm/keyboard-shortcut/keyboard-shortcut-foundation.js

@@ -48,6 +48,7 @@ export class KeyboardShortcutFoundation {
     }
     _onKeyDown(evt) {
         // Here we may check if the target element is disabled, but disabled elements typically can't receive focus anyway
+        var _a;
         // Ignore the event if it originates from a text field
         // TODO: bypass this and allow it if a modifier key is used?
         if (!this._allowWhileTyping && elementAcceptsTextInput(evt.target)) {
@@ -58,6 +59,7 @@ export class KeyboardShortcutFoundation {
                 evt.preventDefault();
             }
             this._adapter.emitHostEvent(KEYBOARD_SHORTCUT_CONSTANTS.events.ACTIVATE, evt);
+            (_a = this._activateCallback) === null || _a === void 0 ? void 0 : _a.call(null, evt);
         }
     }
     /** Sets the key combinations. */
@@ -161,4 +163,11 @@ export class KeyboardShortcutFoundation {
             }
         }
     }
+    /** Gets/sets the activation callback. */
+    get activateCallback() {
+        return this._activateCallback;
+    }
+    set activateCallback(value) {
+        this._activateCallback = value;
+    }
 }

package/esm/keyboard-shortcut/keyboard-shortcut.d.ts

@@ -3,6 +3,7 @@
  * Copyright 2023 Tyler Technologies, Inc. 
  * License: Apache-2.0
  */
+import { KeyboardShortcutActivateCallback } from './keyboard-shortcut-constants';
 import { BaseComponent, IBaseComponent } from '../core/base/base-component';
 export interface IKeyboardShortcutComponent extends IBaseComponent {
     key: string | null | undefined;
@@ -14,6 +15,7 @@ export interface IKeyboardShortcutComponent extends IBaseComponent {
     capture: boolean;
     useCode: boolean;
     disabled: boolean;
+    activateCallback: KeyboardShortcutActivateCallback | null | undefined;
 }
 declare global {
     interface HTMLElementTagNameMap {
@@ -54,4 +56,6 @@ export declare class KeyboardShortcutComponent extends BaseComponent implements
     useCode: boolean;
     /** Gets/sets whether the callback will be called. */
     disabled: boolean;
+    /** Gets/sets whether the activation callback. */
+    activateCallback: KeyboardShortcutActivateCallback | null | undefined;
 }

package/esm/keyboard-shortcut/keyboard-shortcut.js

@@ -97,6 +97,9 @@ __decorate([
 __decorate([
     FoundationProperty()
 ], KeyboardShortcutComponent.prototype, "disabled", void 0);
+__decorate([
+    FoundationProperty()
+], KeyboardShortcutComponent.prototype, "activateCallback", void 0);
 KeyboardShortcutComponent = __decorate([
     CustomElement({
         name: KEYBOARD_SHORTCUT_CONSTANTS.elementName