@tylertech/forge 3.0.0-next.7 → 3.0.0-next.8

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

@@ -14,7 +14,7 @@ import { SplitViewPanelAdapter } from './split-view-panel-adapter';
 import { IconComponent, IconRegistry } from '../../icon';
 import { RippleComponent } from '../../ripple';
 const template = '<template><div class=\"forge-split-view-panel\" id=\"root\" part=\"root\"><div class=\"forge-split-view-panel__handle\" id=\"handle\" part=\"handle\" role=\"separator\" aria-controls=\"content\" aria-grabbed=\"false\" tabindex=\"0\"><forge-icon class=\"forge-split-view-panel__icon\" id=\"icon\" part=\"icon\"></forge-icon><forge-ripple id=\"ripple\" part=\"ripple\"></forge-ripple></div><div class=\"forge-split-view-panel__content\" id=\"content\" part=\"content\" role=\"group\"><slot></slot></div></div></template>';
-const styles = '@-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}}.mdc-ripple-surface{--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;position:relative;outline:0;overflow:hidden}.mdc-ripple-surface::after,.mdc-ripple-surface::before{position:absolute;border-radius:50%;opacity:0;pointer-events:none;content:\"\"}.mdc-ripple-surface::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)}.mdc-ripple-surface::after{z-index:0;z-index:var(--mdc-ripple-z-index,0)}.mdc-ripple-surface.mdc-ripple-upgraded::before{-webkit-transform:scale(var(--mdc-ripple-fg-scale,1));transform:scale(var(--mdc-ripple-fg-scale,1))}.mdc-ripple-surface.mdc-ripple-upgraded::after{top:0;left:0;-webkit-transform:scale(0);transform:scale(0);-webkit-transform-origin:center center;transform-origin:center center}.mdc-ripple-surface.mdc-ripple-upgraded--unbounded::after{top:var(--mdc-ripple-top,0);left:var(--mdc-ripple-left,0)}.mdc-ripple-surface.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}.mdc-ripple-surface.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))}.mdc-ripple-surface::after,.mdc-ripple-surface::before{top:calc(50% - 100%);left:calc(50% - 100%);width:200%;height:200%}.mdc-ripple-surface.mdc-ripple-upgraded::after{width:var(--mdc-ripple-fg-size,100%);height:var(--mdc-ripple-fg-size,100%)}.mdc-ripple-surface[data-mdc-ripple-is-unbounded],.mdc-ripple-upgraded--unbounded{overflow:visible}.mdc-ripple-surface[data-mdc-ripple-is-unbounded]::after,.mdc-ripple-surface[data-mdc-ripple-is-unbounded]::before,.mdc-ripple-upgraded--unbounded::after,.mdc-ripple-upgraded--unbounded::before{top:calc(50% - 50%);left:calc(50% - 50%);width:100%;height:100%}.mdc-ripple-surface[data-mdc-ripple-is-unbounded].mdc-ripple-upgraded::after,.mdc-ripple-surface[data-mdc-ripple-is-unbounded].mdc-ripple-upgraded::before,.mdc-ripple-upgraded--unbounded.mdc-ripple-upgraded::after,.mdc-ripple-upgraded--unbounded.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%)}.mdc-ripple-surface[data-mdc-ripple-is-unbounded].mdc-ripple-upgraded::after,.mdc-ripple-upgraded--unbounded.mdc-ripple-upgraded::after{width:var(--mdc-ripple-fg-size,100%);height:var(--mdc-ripple-fg-size,100%)}.mdc-ripple-surface::after,.mdc-ripple-surface::before{background-color:#000;background-color:var(--mdc-ripple-color,#000)}.mdc-ripple-surface.mdc-ripple-surface--hover::before,.mdc-ripple-surface:hover::before{opacity:.04;opacity:var(--mdc-ripple-hover-opacity, .04)}.mdc-ripple-surface.mdc-ripple-upgraded--background-focused::before,.mdc-ripple-surface:not(.mdc-ripple-upgraded):focus::before{-webkit-transition-duration:75ms;transition-duration:75ms;opacity:.12;opacity:var(--mdc-ripple-focus-opacity, .12)}.mdc-ripple-surface:not(.mdc-ripple-upgraded)::after{-webkit-transition:opacity 150ms linear;transition:opacity 150ms linear}.mdc-ripple-surface:not(.mdc-ripple-upgraded):active::after{-webkit-transition-duration:75ms;transition-duration:75ms;opacity:.12;opacity:var(--mdc-ripple-press-opacity, .12)}.mdc-ripple-surface.mdc-ripple-upgraded{--mdc-ripple-fg-opacity:var(--mdc-ripple-press-opacity, 0.12)}.mdc-ripple-surface::after,.mdc-ripple-surface::before{--mdc-ripple-color:var(--mdc-theme-on-surface)}.forge-split-view-panel{display:-webkit-box;display:flex;width:100%;height:100%;overflow:hidden;contain:paint size}.forge-split-view-panel__handle{color:rgba(0,0,0,.54);color:var(--mdc-theme-text-secondary-on-light,rgba(0,0,0,.54));background-color:#e0e0e0;background-color:var(--forge-theme-border-color,#e0e0e0);display:-webkit-box;display:flex;flex-shrink:0;-webkit-box-pack:center;justify-content:center;-webkit-box-align:center;align-items:center;outline:0}.forge-split-view-panel__content{-webkit-box-flex:1;flex:1;overflow:hidden}.forge-split-view-panel--closed{display:none}.forge-split-view-panel--disabled #handle{pointer-events:none}.forge-split-view-panel--disabled .forge-split-view-panel__icon{display:none}.forge-split-view-panel[orientation=horizontal]{min-width:8px;min-width:var(--forge-split-view-handle-width,8px);width:calc(var(--forge-split-view-panel-size,unset) + var(--forge-split-view-handle-width,8px));-webkit-box-orient:horizontal;-webkit-box-direction:normal;flex-direction:row}.forge-split-view-panel[orientation=horizontal] .forge-split-view-panel__handle{width:8px;width:var(--forge-split-view-handle-width,8px);cursor:var(--forge-split-view-panel-cursor)}.forge-split-view-panel[orientation=horizontal].forge-split-view-panel--closing[resizable=end]{position:absolute;top:0;left:0;-webkit-animation-name:uvyx5ut;animation-name:uvyx5ut;-webkit-animation-duration:.3s;animation-duration:.3s;-webkit-animation-timing-function:cubic-bezier(0.4,0,0.2,1);animation-timing-function:cubic-bezier(0.4,0,0.2,1)}@-webkit-keyframes uvyx5ut{from{-webkit-transform:none;transform:none}to{-webkit-transform:translateX(-100%);transform:translateX(-100%)}}@keyframes uvyx5ut{from{-webkit-transform:none;transform:none}to{-webkit-transform:translateX(-100%);transform:translateX(-100%)}}.forge-split-view-panel[orientation=horizontal].forge-split-view-panel--closing[resizable=start]{position:absolute;top:0;right:0;-webkit-animation-name:uvyx5vd;animation-name:uvyx5vd;-webkit-animation-duration:.3s;animation-duration:.3s;-webkit-animation-timing-function:cubic-bezier(0.4,0,0.2,1);animation-timing-function:cubic-bezier(0.4,0,0.2,1)}@-webkit-keyframes uvyx5vd{from{-webkit-transform:none;transform:none}to{-webkit-transform:translateX(100%);transform:translateX(100%)}}@keyframes uvyx5vd{from{-webkit-transform:none;transform:none}to{-webkit-transform:translateX(100%);transform:translateX(100%)}}.forge-split-view-panel[orientation=horizontal].forge-split-view-panel--opening[resizable=end]{position:absolute;top:0;left:0;-webkit-animation-name:uvyx5w5;animation-name:uvyx5w5;-webkit-animation-duration:.3s;animation-duration:.3s;-webkit-animation-timing-function:cubic-bezier(0.4,0,0.2,1);animation-timing-function:cubic-bezier(0.4,0,0.2,1);animation-direction:reverse}@-webkit-keyframes uvyx5w5{from{-webkit-transform:none;transform:none}to{-webkit-transform:translateX(-100%);transform:translateX(-100%)}}@keyframes uvyx5w5{from{-webkit-transform:none;transform:none}to{-webkit-transform:translateX(-100%);transform:translateX(-100%)}}.forge-split-view-panel[orientation=horizontal].forge-split-view-panel--opening[resizable=start]{position:absolute;top:0;right:0;-webkit-animation-name:uvyx5wt;animation-name:uvyx5wt;-webkit-animation-duration:.3s;animation-duration:.3s;-webkit-animation-timing-function:cubic-bezier(0.4,0,0.2,1);animation-timing-function:cubic-bezier(0.4,0,0.2,1);animation-direction:reverse}@-webkit-keyframes uvyx5wt{from{-webkit-transform:none;transform:none}to{-webkit-transform:translateX(100%);transform:translateX(100%)}}@keyframes uvyx5wt{from{-webkit-transform:none;transform:none}to{-webkit-transform:translateX(100%);transform:translateX(100%)}}.forge-split-view-panel[orientation=vertical]{min-height:8px;min-height:var(--forge-split-view-handle-width,8px);height:calc(var(--forge-split-view-panel-size,unset) + var(--forge-split-view-handle-width,8px));-webkit-box-orient:vertical;-webkit-box-direction:normal;flex-direction:column}.forge-split-view-panel[orientation=vertical] .forge-split-view-panel__handle{height:8px;height:var(--forge-split-view-handle-width,8px);cursor:var(--forge-split-view-panel-cursor)}.forge-split-view-panel[orientation=vertical].forge-split-view-panel--closing[resizable=end]{position:absolute;top:0;left:0;-webkit-animation-name:uvyx5xl;animation-name:uvyx5xl;-webkit-animation-duration:.3s;animation-duration:.3s;-webkit-animation-timing-function:cubic-bezier(0.4,0,0.2,1);animation-timing-function:cubic-bezier(0.4,0,0.2,1)}@-webkit-keyframes uvyx5xl{from{-webkit-transform:none;transform:none}to{-webkit-transform:translateY(-100%);transform:translateY(-100%)}}@keyframes uvyx5xl{from{-webkit-transform:none;transform:none}to{-webkit-transform:translateY(-100%);transform:translateY(-100%)}}.forge-split-view-panel[orientation=vertical].forge-split-view-panel--closing[resizable=start]{position:absolute;bottom:0;left:0;-webkit-animation-name:uvyx5yd;animation-name:uvyx5yd;-webkit-animation-duration:.3s;animation-duration:.3s;-webkit-animation-timing-function:cubic-bezier(0.4,0,0.2,1);animation-timing-function:cubic-bezier(0.4,0,0.2,1)}@-webkit-keyframes uvyx5yd{from{-webkit-transform:none;transform:none}to{-webkit-transform:translateY(100%);transform:translateY(100%)}}@keyframes uvyx5yd{from{-webkit-transform:none;transform:none}to{-webkit-transform:translateY(100%);transform:translateY(100%)}}.forge-split-view-panel[orientation=vertical].forge-split-view-panel--opening[resizable=end]{position:absolute;top:0;left:0;-webkit-animation-name:uvyx5z5;animation-name:uvyx5z5;-webkit-animation-duration:.3s;animation-duration:.3s;-webkit-animation-timing-function:cubic-bezier(0.4,0,0.2,1);animation-timing-function:cubic-bezier(0.4,0,0.2,1);animation-direction:reverse}@-webkit-keyframes uvyx5z5{from{-webkit-transform:none;transform:none}to{-webkit-transform:translateY(-100%);transform:translateY(-100%)}}@keyframes uvyx5z5{from{-webkit-transform:none;transform:none}to{-webkit-transform:translateY(-100%);transform:translateY(-100%)}}.forge-split-view-panel[orientation=vertical].forge-split-view-panel--opening[resizable=start]{position:absolute;bottom:0;left:0;-webkit-animation-name:uvyx5zb;animation-name:uvyx5zb;-webkit-animation-duration:.3s;animation-duration:.3s;-webkit-animation-timing-function:cubic-bezier(0.4,0,0.2,1);animation-timing-function:cubic-bezier(0.4,0,0.2,1);animation-direction:reverse}@-webkit-keyframes uvyx5zb{from{-webkit-transform:none;transform:none}to{-webkit-transform:translateY(100%);transform:translateY(100%)}}@keyframes uvyx5zb{from{-webkit-transform:none;transform:none}to{-webkit-transform:translateY(100%);transform:translateY(100%)}}:host{z-index:var(--forge-split-view-animating-layer)!important;display:block;position:relative;height:100%;width:100%;-webkit-box-flex:0;flex:0}:host([hidden]){display:none}:host(:not([resizable=start],[resizable=end])){-webkit-box-flex:1;flex:1}:host(:not([resizable=start],[resizable=end])) .forge-split-view-panel{width:100%;height:100%;min-width:0;min-height:0}:host(:not([resizable=start],[resizable=end])) .forge-split-view-panel__handle{display:none}';
+const styles = '@-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}}.mdc-ripple-surface{--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;position:relative;outline:0;overflow:hidden}.mdc-ripple-surface::after,.mdc-ripple-surface::before{position:absolute;border-radius:50%;opacity:0;pointer-events:none;content:\"\"}.mdc-ripple-surface::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)}.mdc-ripple-surface::after{z-index:0;z-index:var(--mdc-ripple-z-index,0)}.mdc-ripple-surface.mdc-ripple-upgraded::before{-webkit-transform:scale(var(--mdc-ripple-fg-scale,1));transform:scale(var(--mdc-ripple-fg-scale,1))}.mdc-ripple-surface.mdc-ripple-upgraded::after{top:0;left:0;-webkit-transform:scale(0);transform:scale(0);-webkit-transform-origin:center center;transform-origin:center center}.mdc-ripple-surface.mdc-ripple-upgraded--unbounded::after{top:var(--mdc-ripple-top,0);left:var(--mdc-ripple-left,0)}.mdc-ripple-surface.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}.mdc-ripple-surface.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))}.mdc-ripple-surface::after,.mdc-ripple-surface::before{top:calc(50% - 100%);left:calc(50% - 100%);width:200%;height:200%}.mdc-ripple-surface.mdc-ripple-upgraded::after{width:var(--mdc-ripple-fg-size,100%);height:var(--mdc-ripple-fg-size,100%)}.mdc-ripple-surface[data-mdc-ripple-is-unbounded],.mdc-ripple-upgraded--unbounded{overflow:visible}.mdc-ripple-surface[data-mdc-ripple-is-unbounded]::after,.mdc-ripple-surface[data-mdc-ripple-is-unbounded]::before,.mdc-ripple-upgraded--unbounded::after,.mdc-ripple-upgraded--unbounded::before{top:calc(50% - 50%);left:calc(50% - 50%);width:100%;height:100%}.mdc-ripple-surface[data-mdc-ripple-is-unbounded].mdc-ripple-upgraded::after,.mdc-ripple-surface[data-mdc-ripple-is-unbounded].mdc-ripple-upgraded::before,.mdc-ripple-upgraded--unbounded.mdc-ripple-upgraded::after,.mdc-ripple-upgraded--unbounded.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%)}.mdc-ripple-surface[data-mdc-ripple-is-unbounded].mdc-ripple-upgraded::after,.mdc-ripple-upgraded--unbounded.mdc-ripple-upgraded::after{width:var(--mdc-ripple-fg-size,100%);height:var(--mdc-ripple-fg-size,100%)}.mdc-ripple-surface::after,.mdc-ripple-surface::before{background-color:#000;background-color:var(--mdc-ripple-color,#000)}.mdc-ripple-surface.mdc-ripple-surface--hover::before,.mdc-ripple-surface:hover::before{opacity:.04;opacity:var(--mdc-ripple-hover-opacity, .04)}.mdc-ripple-surface.mdc-ripple-upgraded--background-focused::before,.mdc-ripple-surface:not(.mdc-ripple-upgraded):focus::before{-webkit-transition-duration:75ms;transition-duration:75ms;opacity:.12;opacity:var(--mdc-ripple-focus-opacity, .12)}.mdc-ripple-surface:not(.mdc-ripple-upgraded)::after{-webkit-transition:opacity 150ms linear;transition:opacity 150ms linear}.mdc-ripple-surface:not(.mdc-ripple-upgraded):active::after{-webkit-transition-duration:75ms;transition-duration:75ms;opacity:.12;opacity:var(--mdc-ripple-press-opacity, .12)}.mdc-ripple-surface.mdc-ripple-upgraded{--mdc-ripple-fg-opacity:var(--mdc-ripple-press-opacity, 0.12)}.mdc-ripple-surface::after,.mdc-ripple-surface::before{--mdc-ripple-color:var(--mdc-theme-on-surface)}.forge-split-view-panel{display:-webkit-box;display:flex;width:100%;height:100%;overflow:hidden;contain:paint size}.forge-split-view-panel__handle{color:rgba(0,0,0,.54);color:var(--mdc-theme-text-secondary-on-light,rgba(0,0,0,.54));background-color:#e0e0e0;background-color:var(--forge-theme-border-color,#e0e0e0);display:-webkit-box;display:flex;flex-shrink:0;-webkit-box-pack:center;justify-content:center;-webkit-box-align:center;align-items:center;outline:0}.forge-split-view-panel__content{-webkit-box-flex:1;flex:1;overflow:hidden}.forge-split-view-panel--closed{display:none}.forge-split-view-panel--disabled #handle{pointer-events:none}.forge-split-view-panel--disabled .forge-split-view-panel__icon{display:none}.forge-split-view-panel[orientation=horizontal]{min-width:8px;min-width:var(--forge-split-view-handle-width,8px);width:calc(var(--forge-split-view-panel-size,unset) + var(--forge-split-view-handle-width,8px));-webkit-box-orient:horizontal;-webkit-box-direction:normal;flex-direction:row}.forge-split-view-panel[orientation=horizontal] .forge-split-view-panel__handle{width:8px;width:var(--forge-split-view-handle-width,8px);cursor:var(--forge-split-view-panel-cursor)}.forge-split-view-panel[orientation=horizontal].forge-split-view-panel--closing[resizable=end]{position:absolute;top:0;left:0;-webkit-animation-name:uzenw2w;animation-name:uzenw2w;-webkit-animation-duration:.3s;animation-duration:.3s;-webkit-animation-timing-function:cubic-bezier(0.4,0,0.2,1);animation-timing-function:cubic-bezier(0.4,0,0.2,1)}@-webkit-keyframes uzenw2w{from{-webkit-transform:none;transform:none}to{-webkit-transform:translateX(-100%);transform:translateX(-100%)}}@keyframes uzenw2w{from{-webkit-transform:none;transform:none}to{-webkit-transform:translateX(-100%);transform:translateX(-100%)}}.forge-split-view-panel[orientation=horizontal].forge-split-view-panel--closing[resizable=start]{position:absolute;top:0;right:0;-webkit-animation-name:uzenw3k;animation-name:uzenw3k;-webkit-animation-duration:.3s;animation-duration:.3s;-webkit-animation-timing-function:cubic-bezier(0.4,0,0.2,1);animation-timing-function:cubic-bezier(0.4,0,0.2,1)}@-webkit-keyframes uzenw3k{from{-webkit-transform:none;transform:none}to{-webkit-transform:translateX(100%);transform:translateX(100%)}}@keyframes uzenw3k{from{-webkit-transform:none;transform:none}to{-webkit-transform:translateX(100%);transform:translateX(100%)}}.forge-split-view-panel[orientation=horizontal].forge-split-view-panel--opening[resizable=end]{position:absolute;top:0;left:0;-webkit-animation-name:uzenw45;animation-name:uzenw45;-webkit-animation-duration:.3s;animation-duration:.3s;-webkit-animation-timing-function:cubic-bezier(0.4,0,0.2,1);animation-timing-function:cubic-bezier(0.4,0,0.2,1);animation-direction:reverse}@-webkit-keyframes uzenw45{from{-webkit-transform:none;transform:none}to{-webkit-transform:translateX(-100%);transform:translateX(-100%)}}@keyframes uzenw45{from{-webkit-transform:none;transform:none}to{-webkit-transform:translateX(-100%);transform:translateX(-100%)}}.forge-split-view-panel[orientation=horizontal].forge-split-view-panel--opening[resizable=start]{position:absolute;top:0;right:0;-webkit-animation-name:uzenw48;animation-name:uzenw48;-webkit-animation-duration:.3s;animation-duration:.3s;-webkit-animation-timing-function:cubic-bezier(0.4,0,0.2,1);animation-timing-function:cubic-bezier(0.4,0,0.2,1);animation-direction:reverse}@-webkit-keyframes uzenw48{from{-webkit-transform:none;transform:none}to{-webkit-transform:translateX(100%);transform:translateX(100%)}}@keyframes uzenw48{from{-webkit-transform:none;transform:none}to{-webkit-transform:translateX(100%);transform:translateX(100%)}}.forge-split-view-panel[orientation=vertical]{min-height:8px;min-height:var(--forge-split-view-handle-width,8px);height:calc(var(--forge-split-view-panel-size,unset) + var(--forge-split-view-handle-width,8px));-webkit-box-orient:vertical;-webkit-box-direction:normal;flex-direction:column}.forge-split-view-panel[orientation=vertical] .forge-split-view-panel__handle{height:8px;height:var(--forge-split-view-handle-width,8px);cursor:var(--forge-split-view-panel-cursor)}.forge-split-view-panel[orientation=vertical].forge-split-view-panel--closing[resizable=end]{position:absolute;top:0;left:0;-webkit-animation-name:uzenw57;animation-name:uzenw57;-webkit-animation-duration:.3s;animation-duration:.3s;-webkit-animation-timing-function:cubic-bezier(0.4,0,0.2,1);animation-timing-function:cubic-bezier(0.4,0,0.2,1)}@-webkit-keyframes uzenw57{from{-webkit-transform:none;transform:none}to{-webkit-transform:translateY(-100%);transform:translateY(-100%)}}@keyframes uzenw57{from{-webkit-transform:none;transform:none}to{-webkit-transform:translateY(-100%);transform:translateY(-100%)}}.forge-split-view-panel[orientation=vertical].forge-split-view-panel--closing[resizable=start]{position:absolute;bottom:0;left:0;-webkit-animation-name:uzenw5e;animation-name:uzenw5e;-webkit-animation-duration:.3s;animation-duration:.3s;-webkit-animation-timing-function:cubic-bezier(0.4,0,0.2,1);animation-timing-function:cubic-bezier(0.4,0,0.2,1)}@-webkit-keyframes uzenw5e{from{-webkit-transform:none;transform:none}to{-webkit-transform:translateY(100%);transform:translateY(100%)}}@keyframes uzenw5e{from{-webkit-transform:none;transform:none}to{-webkit-transform:translateY(100%);transform:translateY(100%)}}.forge-split-view-panel[orientation=vertical].forge-split-view-panel--opening[resizable=end]{position:absolute;top:0;left:0;-webkit-animation-name:uzenw5m;animation-name:uzenw5m;-webkit-animation-duration:.3s;animation-duration:.3s;-webkit-animation-timing-function:cubic-bezier(0.4,0,0.2,1);animation-timing-function:cubic-bezier(0.4,0,0.2,1);animation-direction:reverse}@-webkit-keyframes uzenw5m{from{-webkit-transform:none;transform:none}to{-webkit-transform:translateY(-100%);transform:translateY(-100%)}}@keyframes uzenw5m{from{-webkit-transform:none;transform:none}to{-webkit-transform:translateY(-100%);transform:translateY(-100%)}}.forge-split-view-panel[orientation=vertical].forge-split-view-panel--opening[resizable=start]{position:absolute;bottom:0;left:0;-webkit-animation-name:uzenw67;animation-name:uzenw67;-webkit-animation-duration:.3s;animation-duration:.3s;-webkit-animation-timing-function:cubic-bezier(0.4,0,0.2,1);animation-timing-function:cubic-bezier(0.4,0,0.2,1);animation-direction:reverse}@-webkit-keyframes uzenw67{from{-webkit-transform:none;transform:none}to{-webkit-transform:translateY(100%);transform:translateY(100%)}}@keyframes uzenw67{from{-webkit-transform:none;transform:none}to{-webkit-transform:translateY(100%);transform:translateY(100%)}}:host{z-index:var(--forge-split-view-animating-layer)!important;display:block;position:relative;height:100%;width:100%;-webkit-box-flex:0;flex:0}:host([hidden]){display:none}:host(:not([resizable=start],[resizable=end])){-webkit-box-flex:1;flex:1}:host(:not([resizable=start],[resizable=end])) .forge-split-view-panel{width:100%;height:100%;min-width:0;min-height:0}:host(:not([resizable=start],[resizable=end])) .forge-split-view-panel__handle{display:none}';
 /**
  * The custom element class behind the `<forge-split-view-panel>` element.
  *

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

@@ -4,7 +4,7 @@
  * License: Apache-2.0
  */
 import { BaseAdapter, IBaseAdapter } from '../../core/base/base-adapter';
-import { ITabComponent } from './tab';
+import type { ITabComponent } from './tab';
 export interface ITabAdapter extends IBaseAdapter {
     initialize(): void;
     destroy(): void;

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

@@ -5,10 +5,10 @@
  */
 import { getShadowElement, requireParent, toggleAttribute } from '@tylertech/forge-core';
 import { BaseAdapter } from '../../core/base/base-adapter';
-import { TAB_CONSTANTS } from './tab-constants';
-import { TabRipple } from './tab-ripple';
 import { userInteractionListener } from '../../core/utils';
 import { TAB_BAR_CONSTANTS } from '../tab-bar/tab-bar-constants';
+import { TAB_CONSTANTS } from './tab-constants';
+import { TabRipple } from './tab-ripple';
 export class TabAdapter extends BaseAdapter {
     constructor(component) {
         super(component);
@@ -17,9 +17,9 @@ export class TabAdapter extends BaseAdapter {
     }
     initialize() {
         this._deferRippleInitialization();
-        this._component.tabIndex = -1;
+        this._component.tabIndex = this._component.selected ? 0 : -1;
         this._component.setAttribute('role', 'tab');
-        this._component.setAttribute('aria-selected', 'false');
+        this._component.setAttribute('aria-selected', this._component.selected ? 'true' : 'false');
     }
     destroy() {
         var _a;

package/esm/tabs/tab/tab.js

@@ -9,8 +9,9 @@ import { TabAdapter } from './tab-adapter';
 import { TabFoundation } from './tab-foundation';
 import { TAB_CONSTANTS } from './tab-constants';
 import { BaseComponent } from '../../core/base/base-component';
-const template = '<template><div class=\"forge-tab\" part=\"container\"><span class=\"content\" part=\"content\"><slot name=\"leading\"></slot><span class=\"label\" part=\"label\"><slot></slot></span><slot name=\"trailing\"></slot><span class=\"indicator\" part=\"indicator\"></span> </span><span class=\"ripple-surface\"></span></div></template>';
-const styles = '@-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-tab{--_active-indicator-color:var(--forge-tab-indicator-color, var(--mdc-theme-primary, #3f51b5));--_active-indicator-height:var(--forge-tab-indicator-height, 3px);--_active-indicator-shape:var(--forge-tab-indicator-shape, 3px 3px 0 0);--_container-color:var(--forge-tab-container-color, var(--mdc-theme-surface, #ffffff));--_container-height:var(--forge-tab-container-height, 48px);--_container-shape:var(--forge-tab-shape, 0);--_content-height:var(--forge-tab-height, 48px);--_active-focus-icon-color:var(--forge-tab-active-focus-icon-color, var(--mdc-theme-primary, #3f51b5));--_active-hover-icon-color:var(--forge-tab-active-hover-icon-color, var(--mdc-theme-primary, #3f51b5));--_active-icon-color:var(--forge-tab-active-icon-color, var(--mdc-theme-primary, #3f51b5));--_active-pressed-icon-color:var(--forge-tab-active-pressed-icon-color, var(--mdc-theme-primary, #3f51b5));--_icon-size:var(--forge-tab-icon-size, 24px);--_focus-icon-color:var(--forge-tab-focus-icon-color, var(--mdc-theme-text-secondary-on-background, rgba(0, 0, 0, 0.54)));--_hover-icon-color:var(--forge-tab-hover-icon-color, var(--mdc-theme-text-secondary-on-background, rgba(0, 0, 0, 0.54)));--_icon-color:var(--forge-tab-icon-color, var(--mdc-theme-text-secondary-on-background, rgba(0, 0, 0, 0.54)));--_pressed-icon-color:var(--forge-tab-pressed-icon-color, var(--mdc-theme-text-secondary-on-background, rgba(0, 0, 0, 0.54)));--_active-focus-label-text-color:var(--forge-tab-active-focus-label-text-color, var(--mdc-theme-primary, #3f51b5));--_active-hover-label-text-color:var(--forge-tab-active-hover-label-text-color, var(--mdc-theme-primary, #3f51b5));--_active-label-text-color:var(--forge-tab-active-label-text-color, var(--mdc-theme-primary, #3f51b5));--_active-pressed-label-text-color:var(--forge-tab-active-pressed-label-text-color, var(--mdc-theme-primary, #3f51b5));--_focus-label-text-color:var(--forge-tab-focus-label-text-color, var(--mdc-theme-text-secondary-on-background, rgba(0, 0, 0, 0.54)));--_hover-label-text-color:var(--forge-tab-hover-label-text-color, var(--mdc-theme-text-secondary-on-background, rgba(0, 0, 0, 0.54)));--_label-text-color:var(--forge-tab-label-text-color, var(--mdc-theme-text-secondary-on-background, rgba(0, 0, 0, 0.54)));--_pressed-label-text-color:var(--forge-tab-pressed-label-text-color, var(--mdc-theme-text-secondary-on-background, rgba(0, 0, 0, 0.54)));-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:Roboto,sans-serif;font-family:var(--mdc-typography-button-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-size:.875rem;font-size:var(--mdc-typography-button-font-size, .875rem);line-height:2.25rem;line-height:var(--mdc-typography-button-line-height, 2.25rem);font-weight:500;font-weight:var(--mdc-typography-button-font-weight,500);letter-spacing:.0892857143em;letter-spacing:var(--mdc-typography-button-letter-spacing, .0892857143em);text-decoration:none;-webkit-text-decoration:var(--mdc-typography-button-text-decoration,none);text-decoration:var(--mdc-typography-button-text-decoration,none);text-transform:uppercase;text-transform:var(--mdc-typography-button-text-transform,uppercase);display:-webkit-inline-box;display:inline-flex;-webkit-box-align:center;align-items:center;-webkit-box-pack:center;justify-content:center;-webkit-box-sizing:border-box;box-sizing:border-box;border:none;outline:0;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-appearance:none;vertical-align:middle;background:0 0;text-decoration:none;width:100%;position:relative;padding:0;margin:0;z-index:0;background-color:var(--_container-color);color:var(--_label-text-color);min-height:var(--_container-height)}.forge-tab::-moz-focus-inner{padding:0;border:0}.forge-tab ::slotted([slot=leading]),.forge-tab ::slotted([slot=trailing]){display:-webkit-inline-box;display:inline-flex;position:relative;-webkit-writing-mode:horizontal-tb;-ms-writing-mode:lr-tb;writing-mode:horizontal-tb;fill:currentColor;color:var(--_icon-color);font-size:var(--_icon-size);width:var(--_icon-size);height:var(--_icon-size)}.forge-tab:hover{color:var(--_hover-label-text-color);cursor:pointer}.forge-tab:hover ::slotted([slot=leading]),.forge-tab:hover ::slotted([slot=trailing]){color:var(--_hover-icon-color)}.forge-tab .content{position:relative;-webkit-box-sizing:border-box;box-sizing:border-box;display:-webkit-inline-box;display:inline-flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;flex-direction:row;-webkit-box-align:center;align-items:center;-webkit-box-pack:center;justify-content:center;white-space:nowrap;-webkit-transition:150ms color linear;transition:150ms color linear;max-height:calc(var(--_content-height) + 16px);min-height:var(--_content-height);padding:8px 16px;gap:4px}.forge-tab .content .label{display:inline-block;line-height:1}.forge-tab .indicator{position:absolute;-webkit-box-sizing:border-box;box-sizing:border-box;z-index:-1;-webkit-transform-origin:bottom left;transform-origin:bottom left;background:var(--_active-indicator-color);border-radius:var(--_active-indicator-shape);height:var(--_active-indicator-height);inset:auto 0 0;opacity:0}.forge-tab .ripple-surface{--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;position:absolute;top:0;left:0;width:100%;height:100%;overflow:hidden;border-radius:var(--_container-shape)}.forge-tab .ripple-surface::after,.forge-tab .ripple-surface::before{position:absolute;border-radius:50%;opacity:0;pointer-events:none;content:\"\"}.forge-tab .ripple-surface::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-tab .ripple-surface::after{z-index:0;z-index:var(--mdc-ripple-z-index,0)}.forge-tab .ripple-surface.mdc-ripple-upgraded::before{-webkit-transform:scale(var(--mdc-ripple-fg-scale,1));transform:scale(var(--mdc-ripple-fg-scale,1))}.forge-tab .ripple-surface.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-tab .ripple-surface.mdc-ripple-upgraded--unbounded::after{top:var(--mdc-ripple-top,0);left:var(--mdc-ripple-left,0)}.forge-tab .ripple-surface.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-tab .ripple-surface.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-tab .ripple-surface::after,.forge-tab .ripple-surface::before{top:calc(50% - 100%);left:calc(50% - 100%);width:200%;height:200%}.forge-tab .ripple-surface.mdc-ripple-upgraded::after{width:var(--mdc-ripple-fg-size,100%);height:var(--mdc-ripple-fg-size,100%)}.forge-tab .ripple-surface::after,.forge-tab .ripple-surface::before{background-color:#3f51b5;background-color:var(--mdc-ripple-color,var(--mdc-theme-primary,#3f51b5))}.forge-tab .ripple-surface.mdc-ripple-surface--hover::before,.forge-tab .ripple-surface:hover::before{opacity:.04;opacity:var(--mdc-ripple-hover-opacity, .04)}.forge-tab .ripple-surface.mdc-ripple-upgraded--background-focused::before,.forge-tab .ripple-surface:not(.mdc-ripple-upgraded):focus::before{-webkit-transition-duration:75ms;transition-duration:75ms;opacity:.12;opacity:var(--mdc-ripple-focus-opacity, .12)}.forge-tab .ripple-surface:not(.mdc-ripple-upgraded)::after{-webkit-transition:opacity 150ms linear;transition:opacity 150ms linear}.forge-tab .ripple-surface:not(.mdc-ripple-upgraded):active::after{-webkit-transition-duration:75ms;transition-duration:75ms;opacity:.12;opacity:var(--mdc-ripple-press-opacity, .12)}.forge-tab .ripple-surface.mdc-ripple-upgraded{--mdc-ripple-fg-opacity:var(--mdc-ripple-press-opacity, 0.12)}::slotted(*),host{white-space:nowrap}:host{display:-webkit-inline-box;display:inline-flex;outline:0;-webkit-tap-highlight-color:transparent;vertical-align:middle}:host([hidden]){display:none}:host(:focus) .forge-tab{color:var(--_focus-label-text-color)}:host(:focus) .forge-tab ::slotted([slot=leading]),:host(:focus) .forge-tab ::slotted([slot=trailing]){color:var(--_focus-icon-color)}:host(:active) .forge-tab{color:var(--_pressed-label-text-color);outline:0}:host(:active) .forge-tab ::slotted([slot=leading]),:host(:active) .forge-tab ::slotted([slot=trailing]){color:var(--_pressed-icon-color)}:host([disabled]){cursor:not-allowed;opacity:var(--forge-tab-disabled-opacity, .38)}:host([disabled]) .forge-tab{pointer-events:none}:host([selected]) .forge-tab{color:var(--_active-label-text-color)}:host([selected]) .forge-tab ::slotted([slot=leading]),:host([selected]) .forge-tab ::slotted([slot=trailing]){color:var(--_active-icon-color)}:host([selected]) .forge-tab:hover{color:var(--_active-hover-label-text-color)}:host([selected]) .forge-tab:hover ::slotted([slot=leading]),:host([selected]) .forge-tab:hover ::slotted([slot=trailing]){color:var(--_active-hover-icon-color)}:host([selected]) .indicator{opacity:1}@media (forced-colors:active){:host([selected]) .forge-tab{--_active-indicator-color:CanvasText}}:host([selected]:focus) .forge-tab{color:var(--_active-focus-label-text-color)}:host([selected]:focus) .forge-tab ::slotted([slot=leading]),:host([selected]:focus) .forge-tab ::slotted([slot=trailing]){color:var(--_active-focus-icon-color)}:host([selected]:active) .forge-tab{color:var(--_active-pressed-label-text-color)}:host([selected]:active) .forge-tab ::slotted([slot=leading]),:host([selected]:active) .forge-tab ::slotted([slot=trailing]){color:var(--_active-pressed-icon-color)}:host([stacked]) .forge-tab{--_container-height:64px;--_content-height:64px}:host([stacked]) .forge-tab .content{-webkit-box-orient:vertical;-webkit-box-direction:normal;flex-direction:column}:host([secondary]) .forge-tab{--_active-indicator-height:var(--forge-tab-active-indicator-height, 2px);--_active-indicator-shape:var(--forge-tab-indicator-shape, 0)}:host([secondary]) .content{width:100%}:host([secondary]) .indicator{min-width:100%}:host([vertical]) .forge-tab{width:100%;-webkit-box-orient:horizontal;-webkit-box-direction:normal;flex-direction:row;border-bottom:none}:host([vertical]) .content{width:100%}:host([vertical]) .indicator{height:100%;min-width:var(--_active-indicator-height);inset:0 0 0 auto}:host([vertical][secondary]) .content{min-height:100%}:host([vertical]:not([secondary])) .forge-tab{--_active-indicator-shape:3px 0 0 3px}:host([inverted]) .forge-tab{--_active-indicator-shape:var(--forge-tab-indicator-shape, 0 0 3px 3px)}:host([inverted]) .indicator{inset:0 0 auto;-webkit-transform-origin:top left;transform-origin:top left}:host([inverted][vertical]) .forge-tab{--_active-indicator-shape:var(--forge-tab-indicator-shape, 0 3px 3px 0)}:host([inverted][vertical]) .indicator{inset:0 auto 0 0}';
+import { FocusIndicatorComponent } from '../../focus-indicator/focus-indicator';
+const template = '<template><div class=\"forge-tab\" part=\"container\"><span class=\"content\" part=\"content\"><slot name=\"leading\"></slot><span class=\"label\" part=\"label\"><slot></slot></span><slot name=\"trailing\"></slot><span class=\"indicator\" part=\"indicator\"></span> </span><span class=\"ripple-surface\"></span><forge-focus-indicator target=\":host\" inward></forge-focus-indicator></div></template>';
+const styles = '@-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-tab{--_active-indicator-color:var(--forge-tab-indicator-color, var(--mdc-theme-primary, #3f51b5));--_active-indicator-height:var(--forge-tab-indicator-height, 3px);--_active-indicator-shape:var(--forge-tab-indicator-shape, 3px 3px 0 0);--_container-color:var(--forge-tab-container-color, var(--mdc-theme-surface, #ffffff));--_container-height:var(--forge-tab-container-height, 48px);--_container-shape:var(--forge-tab-shape, 0);--_content-height:var(--forge-tab-height, 48px);--_active-focus-icon-color:var(--forge-tab-active-focus-icon-color, var(--mdc-theme-primary, #3f51b5));--_active-hover-icon-color:var(--forge-tab-active-hover-icon-color, var(--mdc-theme-primary, #3f51b5));--_active-icon-color:var(--forge-tab-active-icon-color, var(--mdc-theme-primary, #3f51b5));--_active-pressed-icon-color:var(--forge-tab-active-pressed-icon-color, var(--mdc-theme-primary, #3f51b5));--_icon-size:var(--forge-tab-icon-size, 24px);--_focus-icon-color:var(--forge-tab-focus-icon-color, var(--mdc-theme-text-secondary-on-background, rgba(0, 0, 0, 0.54)));--_hover-icon-color:var(--forge-tab-hover-icon-color, var(--mdc-theme-text-secondary-on-background, rgba(0, 0, 0, 0.54)));--_icon-color:var(--forge-tab-icon-color, var(--mdc-theme-text-secondary-on-background, rgba(0, 0, 0, 0.54)));--_pressed-icon-color:var(--forge-tab-pressed-icon-color, var(--mdc-theme-text-secondary-on-background, rgba(0, 0, 0, 0.54)));--_active-focus-label-text-color:var(--forge-tab-active-focus-label-text-color, var(--mdc-theme-primary, #3f51b5));--_active-hover-label-text-color:var(--forge-tab-active-hover-label-text-color, var(--mdc-theme-primary, #3f51b5));--_active-label-text-color:var(--forge-tab-active-label-text-color, var(--mdc-theme-primary, #3f51b5));--_active-pressed-label-text-color:var(--forge-tab-active-pressed-label-text-color, var(--mdc-theme-primary, #3f51b5));--_focus-label-text-color:var(--forge-tab-focus-label-text-color, var(--mdc-theme-text-secondary-on-background, rgba(0, 0, 0, 0.54)));--_hover-label-text-color:var(--forge-tab-hover-label-text-color, var(--mdc-theme-text-secondary-on-background, rgba(0, 0, 0, 0.54)));--_label-text-color:var(--forge-tab-label-text-color, var(--mdc-theme-text-secondary-on-background, rgba(0, 0, 0, 0.54)));--_pressed-label-text-color:var(--forge-tab-pressed-label-text-color, var(--mdc-theme-text-secondary-on-background, rgba(0, 0, 0, 0.54)));-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:Roboto,sans-serif;font-family:var(--mdc-typography-button-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-size:.875rem;font-size:var(--mdc-typography-button-font-size, .875rem);line-height:2.25rem;line-height:var(--mdc-typography-button-line-height, 2.25rem);font-weight:500;font-weight:var(--mdc-typography-button-font-weight,500);letter-spacing:.0892857143em;letter-spacing:var(--mdc-typography-button-letter-spacing, .0892857143em);text-decoration:none;-webkit-text-decoration:var(--mdc-typography-button-text-decoration,none);text-decoration:var(--mdc-typography-button-text-decoration,none);text-transform:uppercase;text-transform:var(--mdc-typography-button-text-transform,uppercase);display:-webkit-inline-box;display:inline-flex;-webkit-box-align:center;align-items:center;-webkit-box-pack:center;justify-content:center;-webkit-box-sizing:border-box;box-sizing:border-box;border:none;outline:0;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-appearance:none;vertical-align:middle;background:0 0;text-decoration:none;width:100%;position:relative;padding:0;margin:0;z-index:0;background-color:var(--_container-color);color:var(--_label-text-color);min-height:var(--_container-height)}.forge-tab::-moz-focus-inner{padding:0;border:0}.forge-tab ::slotted([slot=leading]),.forge-tab ::slotted([slot=trailing]){display:-webkit-inline-box;display:inline-flex;position:relative;-webkit-writing-mode:horizontal-tb;-ms-writing-mode:lr-tb;writing-mode:horizontal-tb;fill:currentColor;color:var(--_icon-color);font-size:var(--_icon-size);width:var(--_icon-size);height:var(--_icon-size)}.forge-tab:hover{color:var(--_hover-label-text-color);cursor:pointer}.forge-tab:hover ::slotted([slot=leading]),.forge-tab:hover ::slotted([slot=trailing]){color:var(--_hover-icon-color)}.forge-tab .content{position:relative;-webkit-box-sizing:border-box;box-sizing:border-box;display:-webkit-inline-box;display:inline-flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;flex-direction:row;-webkit-box-align:center;align-items:center;-webkit-box-pack:center;justify-content:center;white-space:nowrap;-webkit-transition:150ms color linear;transition:150ms color linear;max-height:calc(var(--_content-height) + 16px);min-height:var(--_content-height);padding:8px 16px;gap:4px}.forge-tab .content .label{display:inline-block;line-height:1}.forge-tab .indicator{position:absolute;-webkit-box-sizing:border-box;box-sizing:border-box;z-index:-1;-webkit-transform-origin:bottom left;transform-origin:bottom left;background:var(--_active-indicator-color);border-radius:var(--_active-indicator-shape);height:var(--_active-indicator-height);inset:auto 0 0;opacity:0}.forge-tab .ripple-surface{--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;position:absolute;top:0;left:0;width:100%;height:100%;overflow:hidden;border-radius:var(--_container-shape)}.forge-tab .ripple-surface::after,.forge-tab .ripple-surface::before{position:absolute;border-radius:50%;opacity:0;pointer-events:none;content:\"\"}.forge-tab .ripple-surface::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-tab .ripple-surface::after{z-index:0;z-index:var(--mdc-ripple-z-index,0)}.forge-tab .ripple-surface.mdc-ripple-upgraded::before{-webkit-transform:scale(var(--mdc-ripple-fg-scale,1));transform:scale(var(--mdc-ripple-fg-scale,1))}.forge-tab .ripple-surface.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-tab .ripple-surface.mdc-ripple-upgraded--unbounded::after{top:var(--mdc-ripple-top,0);left:var(--mdc-ripple-left,0)}.forge-tab .ripple-surface.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-tab .ripple-surface.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-tab .ripple-surface::after,.forge-tab .ripple-surface::before{top:calc(50% - 100%);left:calc(50% - 100%);width:200%;height:200%}.forge-tab .ripple-surface.mdc-ripple-upgraded::after{width:var(--mdc-ripple-fg-size,100%);height:var(--mdc-ripple-fg-size,100%)}.forge-tab .ripple-surface::after,.forge-tab .ripple-surface::before{background-color:#3f51b5;background-color:var(--mdc-ripple-color,var(--mdc-theme-primary,#3f51b5))}.forge-tab .ripple-surface.mdc-ripple-surface--hover::before,.forge-tab .ripple-surface:hover::before{opacity:.04;opacity:var(--mdc-ripple-hover-opacity, .04)}.forge-tab .ripple-surface.mdc-ripple-upgraded--background-focused::before,.forge-tab .ripple-surface:not(.mdc-ripple-upgraded):focus::before{-webkit-transition-duration:75ms;transition-duration:75ms;opacity:.12;opacity:var(--mdc-ripple-focus-opacity, .12)}.forge-tab .ripple-surface:not(.mdc-ripple-upgraded)::after{-webkit-transition:opacity 150ms linear;transition:opacity 150ms linear}.forge-tab .ripple-surface:not(.mdc-ripple-upgraded):active::after{-webkit-transition-duration:75ms;transition-duration:75ms;opacity:.12;opacity:var(--mdc-ripple-press-opacity, .12)}.forge-tab .ripple-surface.mdc-ripple-upgraded{--mdc-ripple-fg-opacity:var(--mdc-ripple-press-opacity, 0.12)}::slotted(*),host{white-space:nowrap}forge-focus-indicator{--forge-focus-indicator-shape:8px}:host{display:-webkit-inline-box;display:inline-flex;outline:0;-webkit-tap-highlight-color:transparent;vertical-align:middle}:host([hidden]){display:none}:host(:focus) .forge-tab{color:var(--_focus-label-text-color)}:host(:focus) .forge-tab ::slotted([slot=leading]),:host(:focus) .forge-tab ::slotted([slot=trailing]){color:var(--_focus-icon-color)}:host(:active) .forge-tab{color:var(--_pressed-label-text-color);outline:0}:host(:active) .forge-tab ::slotted([slot=leading]),:host(:active) .forge-tab ::slotted([slot=trailing]){color:var(--_pressed-icon-color)}:host([disabled]){cursor:not-allowed;opacity:var(--forge-tab-disabled-opacity, .38)}:host([disabled]) .forge-tab{pointer-events:none}:host([selected]) .forge-tab{color:var(--_active-label-text-color)}:host([selected]) .forge-tab ::slotted([slot=leading]),:host([selected]) .forge-tab ::slotted([slot=trailing]){color:var(--_active-icon-color)}:host([selected]) .forge-tab:hover{color:var(--_active-hover-label-text-color)}:host([selected]) .forge-tab:hover ::slotted([slot=leading]),:host([selected]) .forge-tab:hover ::slotted([slot=trailing]){color:var(--_active-hover-icon-color)}:host([selected]) .indicator{opacity:1}@media (forced-colors:active){:host([selected]) .forge-tab{--_active-indicator-color:CanvasText}}:host([selected]) forge-focus-indicator{--forge-focus-indicator-offset-block:0 calc(var(--_active-indicator-height) + 1px)}:host([selected]:focus) .forge-tab{color:var(--_active-focus-label-text-color)}:host([selected]:focus) .forge-tab ::slotted([slot=leading]),:host([selected]:focus) .forge-tab ::slotted([slot=trailing]){color:var(--_active-focus-icon-color)}:host([selected]:active) .forge-tab{color:var(--_active-pressed-label-text-color)}:host([selected]:active) .forge-tab ::slotted([slot=leading]),:host([selected]:active) .forge-tab ::slotted([slot=trailing]){color:var(--_active-pressed-icon-color)}:host([stacked]) .forge-tab{--_container-height:64px;--_content-height:64px}:host([stacked]) .forge-tab .content{-webkit-box-orient:vertical;-webkit-box-direction:normal;flex-direction:column}:host([secondary]) .forge-tab{--_active-indicator-height:var(--forge-tab-active-indicator-height, 2px);--_active-indicator-shape:var(--forge-tab-indicator-shape, 0)}:host([secondary]) .content{width:100%}:host([secondary]) .indicator{min-width:100%}:host([vertical]) .forge-tab{width:100%;-webkit-box-orient:horizontal;-webkit-box-direction:normal;flex-direction:row;border-bottom:none}:host([vertical]) .content{width:100%}:host([vertical]) .indicator{height:100%;min-width:var(--_active-indicator-height);inset:0 0 0 auto}:host([vertical][secondary]) .content{min-height:100%}:host([vertical]:not([secondary])) .forge-tab{--_active-indicator-shape:3px 0 0 3px}:host([inverted]) .forge-tab{--_active-indicator-shape:var(--forge-tab-indicator-shape, 0 0 3px 3px)}:host([inverted]) .indicator{inset:0 0 auto;-webkit-transform-origin:top left;transform-origin:top left}:host([inverted][vertical]) .forge-tab{--_active-indicator-shape:var(--forge-tab-indicator-shape, 0 3px 3px 0)}:host([inverted][vertical]) .indicator{inset:0 auto 0 0}';
 /**
  * @tag forge-tab
  *
@@ -124,7 +125,10 @@ __decorate([
 ], TabComponent.prototype, "inverted", void 0);
 TabComponent = __decorate([
     CustomElement({
-        name: TAB_CONSTANTS.elementName
+        name: TAB_CONSTANTS.elementName,
+        dependencies: [
+            FocusIndicatorComponent
+        ]
     })
 ], TabComponent);
 export { TabComponent };

package/package.json

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

package/styles/card/_mixins.scss

@@ -16,8 +16,8 @@
   .forge-card {
     @include base;
   
-    &--outlined {
-      @include outlined;
+    &--raised {
+      @include raised;
     }
   }
 }
@@ -29,17 +29,18 @@
 @mixin base() {
   @include mdc-card-mixins.fill-color(surface);
   @include mdc-card-mixins.shape-radius(medium);
-  @include mdc-elevation-theme.elevation(1);
+  @include mdc-card-mixins.outline(mdc-card-variables.$outline-color);
   @include theme.css-custom-property(height, --forge-card-height, 100%);
   @include theme.css-custom-property(width, --forge-card-width, 100%);
   @include theme.css-custom-property(padding, --forge-card-padding, variables.$padding);
   @include theme.css-custom-property(overflow, --forge-card-overflow, hidden);
+  @include theme.property(border-color, border-color);
 
   box-sizing: border-box;
 }
 
-@mixin outlined() {
-  @include mdc-elevation-theme.elevation(0);
-  @include mdc-card-mixins.outline(mdc-card-variables.$outline-color);
-  @include theme.property(border-color, border-color);
+@mixin raised() {
+  @include mdc-elevation-theme.elevation(1);
+  
+  border: none;
 }

package/styles/focus-indicator/_mixins.scss

@@ -0,0 +1,147 @@
+/**
+ * @license
+ * Copyright 2023 Tyler Technologies, Inc. 
+ * License: Apache-2.0
+ */
+@use 'sass:list';
+@use '../theme/theme-values';
+@use './variables';
+
+@mixin provide-theme($theme) {
+  @each $key, $value in $theme {
+    @if list.index(variables.$supported-theme-properties, $key) == null {
+      @error 'Invalid theme property: #{$key}';
+    }
+    @if $value {
+      --forge-focus-indicator-#{$key}: #{$value};
+    }
+  }
+}
+
+@mixin configuration {
+  --_active-width: var(--forge-focus-indicator-active-width, 6px);
+  --_color: var(--forge-focus-indicator-color, var(--mdc-theme-primary, #{theme-values.$primary}));
+  --_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); // stylelint-disable-line length-zero-no-unit
+  --_shape: var(--forge-focus-indicator-shape, 1px);
+  --_width: var(--forge-focus-indicator-width, 3px);
+  --_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);
+}
+
+@mixin core-styles {
+  .forge-focus-indicator {
+    @include configuration;
+    @include base;
+  }
+
+  @include reduced-motion-styles;
+  @include keyframes;
+}
+
+@mixin outward-styles {
+  .forge-focus-indicator {
+    @include outward;
+  }
+}
+
+@mixin inward-styles {
+  .forge-focus-indicator {
+    @include inward;
+  }
+}
+
+@mixin active-styles {
+  .forge-focus-indicator {
+    @include active;
+  }
+}
+
+@mixin circular-styles {
+  .forge-focus-indicator {
+    --_shape: 50%;
+  }
+}
+
+@mixin reduced-motion-styles {
+  @media (prefers-reduced-motion) {
+    .forge-focus-indicator {
+      animation: none;
+    }
+  }
+}
+
+@mixin base {
+  animation-delay: 0s, calc(var(--_duration) * 0.25);
+  animation-duration: calc(var(--_duration) * 0.25), calc(var(--_duration) * 0.75);
+  animation-timing-function: var(--_easing);
+  box-sizing: border-box;
+  color: var(--_color);
+  display: none;
+  pointer-events: none;
+  position: absolute;
+  margin-block: var(--_margin-block);
+  margin-inline: var(--_margin-inline);
+}
+
+@mixin active {
+  display: flex;
+}
+
+@mixin outward {
+  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;
+}
+
+@mixin inward {
+  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);
+}
+
+@mixin keyframes {
+  @keyframes outward-grow {
+    from {
+      outline-width: 0;
+    }
+    to {
+      outline-width: var(--_active-width);
+    }
+  }
+
+  @keyframes outward-shrink {
+    from {
+      outline-width: var(--_active-width);
+    }
+  }
+
+  @keyframes inward-grow {
+    from {
+      border-width: 0;
+    }
+    to {
+      border-width: var(--_active-width);
+    }
+  }
+
+  @keyframes inward-shrink {
+    from {
+      border-width: var(--_active-width);
+    }
+  }
+}

package/styles/focus-indicator/_variables.scss

@@ -0,0 +1,20 @@
+/**
+ * @license
+ * Copyright 2023 Tyler Technologies, Inc. 
+ * License: Apache-2.0
+ */
+$supported-theme-properties: (
+  'active-width',
+  'color',
+  'duration',
+  'outward-offset',
+  'inward-offset',
+  'shape',
+  'width',
+  'shape-start-start',
+  'shape-start-end',
+  'shape-end-end',
+  'shape-end-start',
+  'offset-block',
+  'offset-inline'
+);

package/styles/focus-indicator/focus-indicator.scss

@@ -0,0 +1,32 @@
+/**
+ * @license
+ * Copyright 2023 Tyler Technologies, Inc. 
+ * License: Apache-2.0
+ */
+@use './mixins';
+
+@include mixins.core-styles;
+
+:host {
+  display: contents;
+}
+
+:host([hidden]) {
+  display: none;
+}
+
+:host([active]) {
+  @include mixins.active-styles;
+}
+
+:host(:not([inward])) {
+  @include mixins.outward-styles;
+}
+
+:host([inward]) {
+  @include mixins.inward-styles;
+}
+
+:host([circular]) {
+  @include mixins.circular-styles;
+}

package/styles/slider/_mixins.scss

@@ -5,6 +5,7 @@
  */
 @use 'sass:list';
 @use '../core/style-layer/slider';
+@use '../focus-indicator/mixins' as focus-indicator;
 @use './variables';
 
 @mixin provide-theme($theme) {
@@ -24,4 +25,12 @@
 
 @mixin core-styles {
   @include slider.styles;
+
+  forge-focus-indicator {
+    /* stylelint-disable length-zero-no-unit */
+    @include focus-indicator.provide-theme((
+      shape: 50%,
+      outward-offset: 0px
+    ));
+  }
 }

package/styles/tabs/tab/_mixins.scss

@@ -4,6 +4,7 @@
  * License: Apache-2.0
  */
 @use '../../core/style-layer/tabs/tab';
+@use '../../focus-indicator/mixins' as focus-indicator;
 @use './variables';
 
 @mixin provide-theme($theme) {
@@ -19,6 +20,10 @@
 
 @mixin core-styles {
   @include tab.styles;
+
+  forge-focus-indicator {
+    @include focus-indicator.provide-theme(( shape: 8px ));
+  }
 }
 
 @mixin focus-styles {
@@ -44,6 +49,12 @@
 @mixin selected-styles {
   @include tab.selected-styles;
   @include tab.forced-colors-styles;
+
+  forge-focus-indicator {
+    @include focus-indicator.provide-theme((
+      'offset-block': 0 calc(var(--_active-indicator-height) + 1px)
+    ));
+  }
 }
 
 @mixin stacked-styles {

package/dist/esm/chunks/chunk.BWZKQ6WX.js

@@ -1,7 +0,0 @@
-/**
- * @license
- * Copyright 2023 Tyler Technologies, Inc. 
- * License: Apache-2.0
- */
-import{a as c,b as g}from"./chunk.DTZFWZPB.js";import{a as s,e as l,f as p,k as b}from"./chunk.NK7H3MMM.js";import{t as d,u as n}from"./chunk.CFDK4RCW.js";import{k as i}from"./chunk.J2M2MXP2.js";import{d as a}from"./chunk.M3QDAYD2.js";var h=`${g}card`,u={OUTLINED:"outlined"},f={OUTLINED:"forge-card--outlined"},x={ROOT:".forge-card"},e={elementName:h,attributes:u,classes:f,selectors:x};var v='<template><div class="forge-card" part="root"><slot></slot></div></template>',T=".forge-card{background-color:#fff;background-color:var(--mdc-theme-surface,#fff);border-radius:4px;border-radius:var(--mdc-shape-medium,4px);-webkit-box-shadow:0 2px 1px -1px rgba(0,0,0,.2),0 1px 1px 0 rgba(0,0,0,.14),0 1px 3px 0 rgba(0,0,0,.12);box-shadow:0 2px 1px -1px rgba(0,0,0,.2),0 1px 1px 0 rgba(0,0,0,.14),0 1px 3px 0 rgba(0,0,0,.12);height:100%;height:var(--forge-card-height,100%);width:100%;width:var(--forge-card-width,100%);padding:16px;padding:var(--forge-card-padding,16px);overflow:hidden;overflow:var(--forge-card-overflow,hidden);-webkit-box-sizing:border-box;box-sizing:border-box}.forge-card--outlined{-webkit-box-shadow:0 0 0 0 rgba(0,0,0,.2),0 0 0 0 rgba(0,0,0,.14),0 0 0 0 rgba(0,0,0,.12);box-shadow:0 0 0 0 rgba(0,0,0,.2),0 0 0 0 rgba(0,0,0,.14),0 0 0 0 rgba(0,0,0,.12);border-width:1px;border-style:solid;border-color:#e0e0e0;border-color:#e0e0e0;border-color:var(--forge-theme-border-color,#e0e0e0)}:host{display:block}:host([hidden]){display:none}",t=class extends b{constructor(){super();this._outlined=!1;l(this,v,T),this._rootElement=p(this,e.selectors.ROOT)}static get observedAttributes(){return[e.attributes.OUTLINED]}connectedCallback(){this._applyOutlined()}attributeChangedCallback(o,m,r){if(m!==r)switch(o){case e.attributes.OUTLINED:this.outlined=i(r);break}}_applyOutlined(){d(this._rootElement,this._outlined,e.classes.OUTLINED)}get outlined(){return this._outlined}set outlined(o){this._outlined!==o&&(this._outlined=!!o,n(this,this._outlined,e.attributes.OUTLINED,String(!!this._outlined)),this._applyOutlined())}};t=a([c({name:e.elementName})],t);function M(){s(t)}export{e as a,t as b,M as c};
-//# sourceMappingURL=chunk.BWZKQ6WX.js.map

package/dist/esm/chunks/chunk.BWZKQ6WX.js.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../src/card/card-constants.ts", "../../src/card/card.ts", "../../src/card/index.ts"],
-  "sourcesContent": ["import { COMPONENT_NAME_PREFIX } from '../constants';\n\nconst elementName: keyof HTMLElementTagNameMap = `${COMPONENT_NAME_PREFIX}card`;\n\nconst attributes = {\n  OUTLINED: 'outlined'\n};\n\nconst classes = {\n  OUTLINED: 'forge-card--outlined'\n};\n\nconst selectors = {\n  ROOT: '.forge-card'\n};\n\nexport const CARD_CONSTANTS = {\n  elementName,\n  attributes,\n  classes,\n  selectors\n};\n", "import { CustomElement, attachShadowTemplate, coerceBoolean, getShadowElement, toggleAttribute, toggleClass } from '@tylertech/forge-core';\nimport { BaseComponent, IBaseComponent } from '../core/base/base-component';\n\nimport { CARD_CONSTANTS } from './card-constants';\n\nconst template = '<template><div class=\\\"forge-card\\\" part=\\\"root\\\"><slot></slot></div></template>';\nconst styles = '.forge-card{background-color:#fff;background-color:var(--mdc-theme-surface,#fff);border-radius:4px;border-radius:var(--mdc-shape-medium,4px);-webkit-box-shadow:0 2px 1px -1px rgba(0,0,0,.2),0 1px 1px 0 rgba(0,0,0,.14),0 1px 3px 0 rgba(0,0,0,.12);box-shadow:0 2px 1px -1px rgba(0,0,0,.2),0 1px 1px 0 rgba(0,0,0,.14),0 1px 3px 0 rgba(0,0,0,.12);height:100%;height:var(--forge-card-height,100%);width:100%;width:var(--forge-card-width,100%);padding:16px;padding:var(--forge-card-padding,16px);overflow:hidden;overflow:var(--forge-card-overflow,hidden);-webkit-box-sizing:border-box;box-sizing:border-box}.forge-card--outlined{-webkit-box-shadow:0 0 0 0 rgba(0,0,0,.2),0 0 0 0 rgba(0,0,0,.14),0 0 0 0 rgba(0,0,0,.12);box-shadow:0 0 0 0 rgba(0,0,0,.2),0 0 0 0 rgba(0,0,0,.14),0 0 0 0 rgba(0,0,0,.12);border-width:1px;border-style:solid;border-color:#e0e0e0;border-color:#e0e0e0;border-color:var(--forge-theme-border-color,#e0e0e0)}:host{display:block}:host([hidden]){display:none}';\n\nexport interface ICardComponent extends IBaseComponent {\n  outlined: boolean;\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'forge-card': ICardComponent;\n  }\n}\n\n/**\n * The custom element class behind the `<forge-card>` component.\n * \n * @tag forge-card\n */\n@CustomElement({\n  name: CARD_CONSTANTS.elementName\n})\nexport class CardComponent extends BaseComponent implements ICardComponent {\n  public static get observedAttributes(): string[] {\n    return [\n      CARD_CONSTANTS.attributes.OUTLINED\n    ];\n  }\n\n  private _rootElement: HTMLElement;\n  private _outlined = false;\n\n  constructor() {\n    super();\n    attachShadowTemplate(this, template, styles);\n    this._rootElement = getShadowElement(this, CARD_CONSTANTS.selectors.ROOT);\n  }\n\n  public connectedCallback(): void {\n    this._applyOutlined();\n  }\n\n  public attributeChangedCallback(name: string, oldValue: string, newValue: string): void {\n    if (oldValue === newValue) {\n      return;\n    }\n    switch (name) {\n      case CARD_CONSTANTS.attributes.OUTLINED:\n        this.outlined = coerceBoolean(newValue);\n        break;\n    }\n  }\n\n  private _applyOutlined(): void {\n    toggleClass(this._rootElement, this._outlined, CARD_CONSTANTS.classes.OUTLINED);\n  }\n\n  /** Gets/sets whether the card is using the outlined style or not. */\n  public get outlined(): boolean {\n    return this._outlined;\n  }\n  public set outlined(value: boolean) {\n    if (this._outlined !== value) {\n      this._outlined = !!value;\n      toggleAttribute(this, this._outlined, CARD_CONSTANTS.attributes.OUTLINED, String(!!this._outlined));\n      this._applyOutlined();\n    }\n  }\n}\n", "import { defineCustomElement } from '@tylertech/forge-core';\n\nimport { CardComponent } from './card';\n\nexport * from './card-constants';\nexport * from './card';\n\nexport function defineCardComponent(): void {\n  defineCustomElement(CardComponent);\n}\n"],
-  "mappings": "2OAEA,IAAMA,EAA2C,GAAGC,QAE9CC,EAAa,CACjB,SAAU,UACZ,EAEMC,EAAU,CACd,SAAU,sBACZ,EAEMC,EAAY,CAChB,KAAM,aACR,EAEaC,EAAiB,CAC5B,YAAAL,EACA,WAAAE,EACA,QAAAC,EACA,UAAAC,CACF,EChBA,IAAME,EAAW,+EACXC,EAAS,k9BAoBFC,EAAN,cAA4BC,CAAwC,CAUzE,aAAc,CACZ,MAAM,EAHR,KAAQ,UAAY,GAIlBC,EAAqB,KAAMJ,EAAUC,CAAM,EAC3C,KAAK,aAAeI,EAAiB,KAAMC,EAAe,UAAU,IAAI,CAC1E,CAbA,WAAkB,oBAA+B,CAC/C,MAAO,CACLA,EAAe,WAAW,QAC5B,CACF,CAWO,mBAA0B,CAC/B,KAAK,eAAe,CACtB,CAEO,yBAAyBC,EAAcC,EAAkBC,EAAwB,CACtF,GAAID,IAAaC,EAGjB,OAAQF,EAAM,CACZ,KAAKD,EAAe,WAAW,SAC7B,KAAK,SAAWI,EAAcD,CAAQ,EACtC,KACJ,CACF,CAEQ,gBAAuB,CAC7BE,EAAY,KAAK,aAAc,KAAK,UAAWL,EAAe,QAAQ,QAAQ,CAChF,CAGA,IAAW,UAAoB,CAC7B,OAAO,KAAK,SACd,CACA,IAAW,SAASM,EAAgB,CAC9B,KAAK,YAAcA,IACrB,KAAK,UAAY,CAAC,CAACA,EACnBC,EAAgB,KAAM,KAAK,UAAWP,EAAe,WAAW,SAAU,OAAO,CAAC,CAAC,KAAK,SAAS,CAAC,EAClG,KAAK,eAAe,EAExB,CACF,EA9CaJ,EAANY,EAAA,CAHNC,EAAc,CACb,KAAMT,EAAe,WACvB,CAAC,GACYJ,GCnBN,SAASc,GAA4B,CAC1CC,EAAoBC,CAAa,CACnC",
-  "names": ["elementName", "COMPONENT_NAME_PREFIX", "attributes", "classes", "selectors", "CARD_CONSTANTS", "template", "styles", "CardComponent", "BaseComponent", "attachShadowTemplate", "getShadowElement", "CARD_CONSTANTS", "name", "oldValue", "newValue", "coerceBoolean", "toggleClass", "value", "toggleAttribute", "__decorateClass", "CustomElement", "defineCardComponent", "defineCustomElement", "CardComponent"]
-}

package/dist/esm/chunks/chunk.GWIVOPRO.js

@@ -1,7 +0,0 @@
-/**
- * @license
- * Copyright 2023 Tyler Technologies, Inc. 
- * License: Apache-2.0
- */
-import{b as u,c as z}from"./chunk.SZIM4KFZ.js";import{b as R}from"./chunk.NVMILGC2.js";import{a as d}from"./chunk.NVUMRW44.js";import{a as N}from"./chunk.5V5ABSHI.js";import{a as C,b as f}from"./chunk.DTZFWZPB.js";import{c as T,e as S,f as b,k as L}from"./chunk.NK7H3MMM.js";import{u as I}from"./chunk.CFDK4RCW.js";import{k as l}from"./chunk.J2M2MXP2.js";import{a as w,b as A,d as c}from"./chunk.M3QDAYD2.js";var D=`${f}tab`,H={DISABLED:"disabled",SELECTED:"selected",VERTICAL:"vertical",STACKED:"stacked",SECONDARY:"secondary",INVERTED:"inverted"},K={RIPPLE:".ripple-surface",INDICATOR:".indicator"},P={SELECTED:"selected"},V={SELECT:`${D}-select`},U={EASING:"cubic-bezier(0.4, 0, 0.2, 1)"},$={ANIMATION_DURATION:250},r={elementName:D,attributes:H,selectors:K,classes:P,events:V,strings:U,numbers:$};var O=`${f}tab-bar`,Y={DISABLED:"disabled",ACTIVE_TAB:"active-tab",VERTICAL:"vertical",STACKED:"stacked",CLUSTERED:"clustered",SECONDARY:"secondary",INVERTED:"inverted",AUTO_ACTIVATE:"auto-activate",SCROLL_BUTTONS:"scroll-buttons"},G={CONTAINER:".container",SCROLL_CONTAINER:".scroll-container",DEFAULT_SLOT:"slot:not([name])"},X={SCROLL_BUTTON:"scroll-button"},j={CHANGE:`${O}-change`},q={SCROLL_MARGIN:48},B={attributes:Y,elementName:O,events:j,selectors:G,classes:X,numbers:q},te=new Map([["default",new Set(["Home","End"])],["horizontal",new Set(["ArrowLeft","ArrowRight"])],["vertical",new Set(["ArrowUp","ArrowDown"])]]);var m=class{constructor(e,t){this._surfaceElement=e;this._buttonElement=t;let a=A(w({},u.createAdapter(this)),{registerInteractionHandler:(i,n)=>this._buttonElement.addEventListener(i,n,{passive:!0}),deregisterInteractionHandler:(i,n)=>this._buttonElement.removeEventListener(i,n,{passive:!0}),isSurfaceActive:()=>this._buttonElement.matches(":active"),isUnbounded:()=>this.unbounded,addClass:i=>this._surfaceElement.classList.add(i),removeClass:i=>this._surfaceElement.classList.remove(i),updateCssVariable:(i,n)=>this._surfaceElement.style.setProperty(i,n)}),o=new z(a);this.rippleInstance=new u(this._buttonElement,o)}destroy(){var e;(e=this.rippleInstance)==null||e.destroy(),this.rippleInstance=void 0}emulateFocus(){var e;(e=this.rippleInstance)==null||e.handleFocus()}get root(){return this._buttonElement}get unbounded(){return!1}get disabled(){return this._buttonElement.disabled}};var g=class extends N{constructor(t){super(t);this._rippleElement=b(this._component,r.selectors.RIPPLE),this._tabIndicatorElement=b(this._component,r.selectors.INDICATOR)}initialize(){this._deferRippleInitialization(),this._component.tabIndex=-1,this._component.setAttribute("role","tab"),this._component.setAttribute("aria-selected","false")}destroy(){var t;(t=this._rippleInstance)==null||t.destroy()}addInteractionListener(t,a){this._component.addEventListener(t,a)}setDisabled(t){this._component.tabIndex=t?-1:this._component.selected?0:-1,this._component.setAttribute("aria-disabled",String(t)),I(this._component,t,r.attributes.DISABLED,String(t))}setSelected(t){this._component.tabIndex=t?0:-1,this._component.setAttribute("aria-selected",String(t))}async _deferRippleInitialization(){let t=await R(this._component);this._rippleInstance=new m(this._rippleElement,this._component),t==="focusin"&&this._component.matches(":focus")&&this._rippleInstance.emulateFocus()}animateSelected(){this._tabIndicatorElement.getAnimations().forEach(a=>a.cancel());let t=this._getKeyframes();t&&this._tabIndicatorElement.animate(t,{duration:r.numbers.ANIMATION_DURATION,easing:r.strings.EASING})}_getKeyframes(){var k;let t=window.matchMedia("(prefers-reduced-motion: reduce)").matches;if(!this._component.selected)return t?[{opacity:1},{transform:"none"}]:null;let a={},o=this._component.vertical,i=this._getSelectedTabIndicator(),n=(k=i==null?void 0:i.getBoundingClientRect())!=null?k:{},_=o?n.top:n.left,M=o?n.height:n.width,p=this._tabIndicatorElement.getBoundingClientRect(),y=o?p.top:p.left,F=o?p.height:p.width,x=o?"Y":"X",E=M/F;return!t&&_!==void 0&&y!==void 0&&!isNaN(E)?a.transform=`translate${x}(${(_-y).toFixed(4)}px) scale${x}(${E.toFixed(4)})`:a.opacity=0,[a,{transform:"none"}]}_getSelectedTabIndicator(){let t=T(this._component,B.elementName);if(t){let o=Array.from(t.querySelectorAll(r.elementName)).find(i=>i.hasAttribute(r.attributes.SELECTED));if(o)return b(o,r.selectors.INDICATOR)}return null}};var h=class{constructor(e){this._adapter=e;this._selected=!1;this._disabled=!1;this._vertical=!1;this._stacked=!1;this._secondary=!1;this._inverted=!1;this._clickListener=()=>this._onClick(),this._keydownListener=t=>this._onKeydown(t)}initialize(){this._adapter.initialize(),this._adapter.addInteractionListener("click",this._clickListener),this._adapter.addInteractionListener("keydown",this._keydownListener)}destroy(){this._adapter.destroy()}_onClick(){this._disabled||this._selected||this._dispatchSelectEvent()}_onKeydown(e){if(this._disabled||this._selected)return;(e.key===" "||e.key==="Enter")&&(e.preventDefault(),this._dispatchSelectEvent())}_dispatchSelectEvent(){this._adapter.emitHostEvent(r.events.SELECT,{bubbles:!0,composed:!0})}get disabled(){return this._disabled}set disabled(e){this._disabled!==e&&(this._disabled=e,this._adapter.setDisabled(this._disabled),this._adapter.toggleHostAttribute(r.attributes.DISABLED,this._disabled))}get selected(){return this._selected}set selected(e){this._selected!==e&&(this._selected=e,this._adapter.setSelected(this._selected),this._adapter.animateSelected(),this._adapter.toggleHostAttribute(r.attributes.SELECTED,this._selected))}get vertical(){return this._vertical}set vertical(e){this._vertical!==e&&(this._vertical=e,this._adapter.toggleHostAttribute(r.attributes.VERTICAL,this._vertical))}get stacked(){return this._stacked}set stacked(e){this._stacked!==e&&(this._stacked=e,this._adapter.toggleHostAttribute(r.attributes.STACKED,this._stacked))}get secondary(){return this._secondary}set secondary(e){this._secondary!==e&&(this._secondary=e,this._adapter.toggleHostAttribute(r.attributes.SECONDARY,this._secondary))}get inverted(){return this._inverted}set inverted(e){this._inverted!==e&&(this._inverted=e,this._adapter.toggleHostAttribute(r.attributes.INVERTED,this._inverted))}};var J='<template><div class="forge-tab" part="container"><span class="content" part="content"><slot name="leading"></slot><span class="label" part="label"><slot></slot></span><slot name="trailing"></slot><span class="indicator" part="indicator"></span> </span><span class="ripple-surface"></span></div></template>',Q='@-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-tab{--_active-indicator-color:var(--forge-tab-indicator-color, var(--mdc-theme-primary, #3f51b5));--_active-indicator-height:var(--forge-tab-indicator-height, 3px);--_active-indicator-shape:var(--forge-tab-indicator-shape, 3px 3px 0 0);--_container-color:var(--forge-tab-container-color, var(--mdc-theme-surface, #ffffff));--_container-height:var(--forge-tab-container-height, 48px);--_container-shape:var(--forge-tab-shape, 0);--_content-height:var(--forge-tab-height, 48px);--_active-focus-icon-color:var(--forge-tab-active-focus-icon-color, var(--mdc-theme-primary, #3f51b5));--_active-hover-icon-color:var(--forge-tab-active-hover-icon-color, var(--mdc-theme-primary, #3f51b5));--_active-icon-color:var(--forge-tab-active-icon-color, var(--mdc-theme-primary, #3f51b5));--_active-pressed-icon-color:var(--forge-tab-active-pressed-icon-color, var(--mdc-theme-primary, #3f51b5));--_icon-size:var(--forge-tab-icon-size, 24px);--_focus-icon-color:var(--forge-tab-focus-icon-color, var(--mdc-theme-text-secondary-on-background, rgba(0, 0, 0, 0.54)));--_hover-icon-color:var(--forge-tab-hover-icon-color, var(--mdc-theme-text-secondary-on-background, rgba(0, 0, 0, 0.54)));--_icon-color:var(--forge-tab-icon-color, var(--mdc-theme-text-secondary-on-background, rgba(0, 0, 0, 0.54)));--_pressed-icon-color:var(--forge-tab-pressed-icon-color, var(--mdc-theme-text-secondary-on-background, rgba(0, 0, 0, 0.54)));--_active-focus-label-text-color:var(--forge-tab-active-focus-label-text-color, var(--mdc-theme-primary, #3f51b5));--_active-hover-label-text-color:var(--forge-tab-active-hover-label-text-color, var(--mdc-theme-primary, #3f51b5));--_active-label-text-color:var(--forge-tab-active-label-text-color, var(--mdc-theme-primary, #3f51b5));--_active-pressed-label-text-color:var(--forge-tab-active-pressed-label-text-color, var(--mdc-theme-primary, #3f51b5));--_focus-label-text-color:var(--forge-tab-focus-label-text-color, var(--mdc-theme-text-secondary-on-background, rgba(0, 0, 0, 0.54)));--_hover-label-text-color:var(--forge-tab-hover-label-text-color, var(--mdc-theme-text-secondary-on-background, rgba(0, 0, 0, 0.54)));--_label-text-color:var(--forge-tab-label-text-color, var(--mdc-theme-text-secondary-on-background, rgba(0, 0, 0, 0.54)));--_pressed-label-text-color:var(--forge-tab-pressed-label-text-color, var(--mdc-theme-text-secondary-on-background, rgba(0, 0, 0, 0.54)));-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:Roboto,sans-serif;font-family:var(--mdc-typography-button-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-size:.875rem;font-size:var(--mdc-typography-button-font-size, .875rem);line-height:2.25rem;line-height:var(--mdc-typography-button-line-height, 2.25rem);font-weight:500;font-weight:var(--mdc-typography-button-font-weight,500);letter-spacing:.0892857143em;letter-spacing:var(--mdc-typography-button-letter-spacing, .0892857143em);text-decoration:none;-webkit-text-decoration:var(--mdc-typography-button-text-decoration,none);text-decoration:var(--mdc-typography-button-text-decoration,none);text-transform:uppercase;text-transform:var(--mdc-typography-button-text-transform,uppercase);display:-webkit-inline-box;display:inline-flex;-webkit-box-align:center;align-items:center;-webkit-box-pack:center;justify-content:center;-webkit-box-sizing:border-box;box-sizing:border-box;border:none;outline:0;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-appearance:none;vertical-align:middle;background:0 0;text-decoration:none;width:100%;position:relative;padding:0;margin:0;z-index:0;background-color:var(--_container-color);color:var(--_label-text-color);min-height:var(--_container-height)}.forge-tab::-moz-focus-inner{padding:0;border:0}.forge-tab ::slotted([slot=leading]),.forge-tab ::slotted([slot=trailing]){display:-webkit-inline-box;display:inline-flex;position:relative;-webkit-writing-mode:horizontal-tb;-ms-writing-mode:lr-tb;writing-mode:horizontal-tb;fill:currentColor;color:var(--_icon-color);font-size:var(--_icon-size);width:var(--_icon-size);height:var(--_icon-size)}.forge-tab:hover{color:var(--_hover-label-text-color);cursor:pointer}.forge-tab:hover ::slotted([slot=leading]),.forge-tab:hover ::slotted([slot=trailing]){color:var(--_hover-icon-color)}.forge-tab .content{position:relative;-webkit-box-sizing:border-box;box-sizing:border-box;display:-webkit-inline-box;display:inline-flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;flex-direction:row;-webkit-box-align:center;align-items:center;-webkit-box-pack:center;justify-content:center;white-space:nowrap;-webkit-transition:150ms color linear;transition:150ms color linear;max-height:calc(var(--_content-height) + 16px);min-height:var(--_content-height);padding:8px 16px;gap:4px}.forge-tab .content .label{display:inline-block;line-height:1}.forge-tab .indicator{position:absolute;-webkit-box-sizing:border-box;box-sizing:border-box;z-index:-1;-webkit-transform-origin:bottom left;transform-origin:bottom left;background:var(--_active-indicator-color);border-radius:var(--_active-indicator-shape);height:var(--_active-indicator-height);inset:auto 0 0;opacity:0}.forge-tab .ripple-surface{--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;position:absolute;top:0;left:0;width:100%;height:100%;overflow:hidden;border-radius:var(--_container-shape)}.forge-tab .ripple-surface::after,.forge-tab .ripple-surface::before{position:absolute;border-radius:50%;opacity:0;pointer-events:none;content:""}.forge-tab .ripple-surface::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-tab .ripple-surface::after{z-index:0;z-index:var(--mdc-ripple-z-index,0)}.forge-tab .ripple-surface.mdc-ripple-upgraded::before{-webkit-transform:scale(var(--mdc-ripple-fg-scale,1));transform:scale(var(--mdc-ripple-fg-scale,1))}.forge-tab .ripple-surface.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-tab .ripple-surface.mdc-ripple-upgraded--unbounded::after{top:var(--mdc-ripple-top,0);left:var(--mdc-ripple-left,0)}.forge-tab .ripple-surface.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-tab .ripple-surface.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-tab .ripple-surface::after,.forge-tab .ripple-surface::before{top:calc(50% - 100%);left:calc(50% - 100%);width:200%;height:200%}.forge-tab .ripple-surface.mdc-ripple-upgraded::after{width:var(--mdc-ripple-fg-size,100%);height:var(--mdc-ripple-fg-size,100%)}.forge-tab .ripple-surface::after,.forge-tab .ripple-surface::before{background-color:#3f51b5;background-color:var(--mdc-ripple-color,var(--mdc-theme-primary,#3f51b5))}.forge-tab .ripple-surface.mdc-ripple-surface--hover::before,.forge-tab .ripple-surface:hover::before{opacity:.04;opacity:var(--mdc-ripple-hover-opacity, .04)}.forge-tab .ripple-surface.mdc-ripple-upgraded--background-focused::before,.forge-tab .ripple-surface:not(.mdc-ripple-upgraded):focus::before{-webkit-transition-duration:75ms;transition-duration:75ms;opacity:.12;opacity:var(--mdc-ripple-focus-opacity, .12)}.forge-tab .ripple-surface:not(.mdc-ripple-upgraded)::after{-webkit-transition:opacity 150ms linear;transition:opacity 150ms linear}.forge-tab .ripple-surface:not(.mdc-ripple-upgraded):active::after{-webkit-transition-duration:75ms;transition-duration:75ms;opacity:.12;opacity:var(--mdc-ripple-press-opacity, .12)}.forge-tab .ripple-surface.mdc-ripple-upgraded{--mdc-ripple-fg-opacity:var(--mdc-ripple-press-opacity, 0.12)}::slotted(*),host{white-space:nowrap}:host{display:-webkit-inline-box;display:inline-flex;outline:0;-webkit-tap-highlight-color:transparent;vertical-align:middle}:host([hidden]){display:none}:host(:focus) .forge-tab{color:var(--_focus-label-text-color)}:host(:focus) .forge-tab ::slotted([slot=leading]),:host(:focus) .forge-tab ::slotted([slot=trailing]){color:var(--_focus-icon-color)}:host(:active) .forge-tab{color:var(--_pressed-label-text-color);outline:0}:host(:active) .forge-tab ::slotted([slot=leading]),:host(:active) .forge-tab ::slotted([slot=trailing]){color:var(--_pressed-icon-color)}:host([disabled]){cursor:not-allowed;opacity:var(--forge-tab-disabled-opacity, .38)}:host([disabled]) .forge-tab{pointer-events:none}:host([selected]) .forge-tab{color:var(--_active-label-text-color)}:host([selected]) .forge-tab ::slotted([slot=leading]),:host([selected]) .forge-tab ::slotted([slot=trailing]){color:var(--_active-icon-color)}:host([selected]) .forge-tab:hover{color:var(--_active-hover-label-text-color)}:host([selected]) .forge-tab:hover ::slotted([slot=leading]),:host([selected]) .forge-tab:hover ::slotted([slot=trailing]){color:var(--_active-hover-icon-color)}:host([selected]) .indicator{opacity:1}@media (forced-colors:active){:host([selected]) .forge-tab{--_active-indicator-color:CanvasText}}:host([selected]:focus) .forge-tab{color:var(--_active-focus-label-text-color)}:host([selected]:focus) .forge-tab ::slotted([slot=leading]),:host([selected]:focus) .forge-tab ::slotted([slot=trailing]){color:var(--_active-focus-icon-color)}:host([selected]:active) .forge-tab{color:var(--_active-pressed-label-text-color)}:host([selected]:active) .forge-tab ::slotted([slot=leading]),:host([selected]:active) .forge-tab ::slotted([slot=trailing]){color:var(--_active-pressed-icon-color)}:host([stacked]) .forge-tab{--_container-height:64px;--_content-height:64px}:host([stacked]) .forge-tab .content{-webkit-box-orient:vertical;-webkit-box-direction:normal;flex-direction:column}:host([secondary]) .forge-tab{--_active-indicator-height:var(--forge-tab-active-indicator-height, 2px);--_active-indicator-shape:var(--forge-tab-indicator-shape, 0)}:host([secondary]) .content{width:100%}:host([secondary]) .indicator{min-width:100%}:host([vertical]) .forge-tab{width:100%;-webkit-box-orient:horizontal;-webkit-box-direction:normal;flex-direction:row;border-bottom:none}:host([vertical]) .content{width:100%}:host([vertical]) .indicator{height:100%;min-width:var(--_active-indicator-height);inset:0 0 0 auto}:host([vertical][secondary]) .content{min-height:100%}:host([vertical]:not([secondary])) .forge-tab{--_active-indicator-shape:3px 0 0 3px}:host([inverted]) .forge-tab{--_active-indicator-shape:var(--forge-tab-indicator-shape, 0 0 3px 3px)}:host([inverted]) .indicator{inset:0 0 auto;-webkit-transform-origin:top left;transform-origin:top left}:host([inverted][vertical]) .forge-tab{--_active-indicator-shape:var(--forge-tab-indicator-shape, 0 3px 3px 0)}:host([inverted][vertical]) .indicator{inset:0 auto 0 0}',s=class extends L{constructor(){super();S(this,J,Q),this._foundation=new h(new g(this))}static get observedAttributes(){return[r.attributes.DISABLED,r.attributes.SELECTED,r.attributes.VERTICAL,r.attributes.STACKED,r.attributes.SECONDARY,r.attributes.INVERTED]}connectedCallback(){this._foundation.initialize()}disconnectedCallback(){this._foundation.destroy()}attributeChangedCallback(t,a,o){switch(t){case r.attributes.DISABLED:this.disabled=l(o);break;case r.attributes.SELECTED:this.selected=l(o);break;case r.attributes.VERTICAL:this.vertical=l(o);break;case r.attributes.STACKED:this.stacked=l(o);break;case r.attributes.SECONDARY:this.secondary=l(o);break;case r.attributes.INVERTED:this.inverted=l(o);break}}};c([d()],s.prototype,"disabled",2),c([d()],s.prototype,"selected",2),c([d()],s.prototype,"vertical",2),c([d()],s.prototype,"stacked",2),c([d()],s.prototype,"secondary",2),c([d()],s.prototype,"inverted",2),s=c([C({name:r.elementName})],s);export{r as a,B as b,te as c,g as d,h as e,s as f};
-//# sourceMappingURL=chunk.GWIVOPRO.js.map