@ifsworld/granite-components 4.0.0-beta.10 → 4.0.0-beta.11

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (41) hide show
  1. package/bundles/ifsworld-granite-components.umd.js +63 -19
  2. package/bundles/ifsworld-granite-components.umd.js.map +1 -1
  3. package/bundles/ifsworld-granite-components.umd.min.js +2 -2
  4. package/bundles/ifsworld-granite-components.umd.min.js.map +1 -1
  5. package/esm2015/index.js +1 -0
  6. package/esm2015/index.js.map +1 -1
  7. package/esm2015/index.metadata.json +1 -1
  8. package/esm2015/lib/button/button.component.js +15 -9
  9. package/esm2015/lib/button/button.component.js.map +1 -1
  10. package/esm2015/lib/button/button.component.metadata.json +1 -1
  11. package/esm2015/lib/input-field/input-field.component.js.map +1 -1
  12. package/esm2015/lib/menu/menu-item.component.js +1 -1
  13. package/esm2015/lib/menu/menu-item.component.metadata.json +1 -1
  14. package/esm2015/lib/menu/menu-touch-close.component.js +1 -1
  15. package/esm2015/lib/menu/menu-touch-close.component.metadata.json +1 -1
  16. package/esm2015/lib/menu/menu-touch-title.component.js +1 -1
  17. package/esm2015/lib/menu/menu-touch-title.component.metadata.json +1 -1
  18. package/esm2015/lib/menu/menu-trigger-for.directive.js +14 -5
  19. package/esm2015/lib/menu/menu-trigger-for.directive.js.map +1 -1
  20. package/esm2015/lib/menu/menu-trigger-for.directive.metadata.json +1 -1
  21. package/esm2015/lib/menu/menu.component.js +11 -3
  22. package/esm2015/lib/menu/menu.component.js.map +1 -1
  23. package/esm2015/lib/menu/menu.component.metadata.json +1 -1
  24. package/esm2015/lib/menu/menu.module.js +3 -0
  25. package/esm2015/lib/menu/menu.module.js.map +1 -1
  26. package/esm2015/lib/menu/menu.module.metadata.json +1 -1
  27. package/esm2015/lib/menu/title.directive.js +13 -0
  28. package/esm2015/lib/menu/title.directive.js.map +1 -0
  29. package/esm2015/lib/menu/title.directive.metadata.json +1 -0
  30. package/esm2015/lib/toggle-switch/toggle-switch.component.js.map +1 -1
  31. package/fesm2015/ifsworld-granite-components.js +58 -21
  32. package/fesm2015/ifsworld-granite-components.js.map +1 -1
  33. package/ifsworld-granite-components.metadata.json +1 -1
  34. package/index.d.ts +1 -0
  35. package/lib/button/button.component.d.ts +7 -0
  36. package/lib/input-field/input-field.component.d.ts +1 -1
  37. package/lib/menu/menu-trigger-for.directive.d.ts +2 -0
  38. package/lib/menu/menu.component.d.ts +5 -2
  39. package/lib/menu/title.directive.d.ts +2 -0
  40. package/lib/toggle-switch/toggle-switch.component.d.ts +3 -3
  41. package/package.json +1 -1
@@ -1 +1 @@
1
- [{"__symbolic":"module","version":4,"metadata":{"GraniteMenuModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":14,"character":1},"arguments":[{"declarations":[{"__symbolic":"reference","module":"./menu.component","name":"GraniteMenuComponent","line":16,"character":4},{"__symbolic":"reference","module":"./menu-item.component","name":"GraniteMenuItemComponent","line":17,"character":4},{"__symbolic":"reference","module":"./menu-trigger-for.directive","name":"GraniteMenuTriggerForDirective","line":18,"character":4},{"__symbolic":"reference","module":"./menu-touch-close.component","name":"GraniteMenuTouchCloseComponent","line":19,"character":4},{"__symbolic":"reference","module":"./menu-touch-title.component","name":"GraniteMenuTouchTitleItemComponent","line":20,"character":4},{"__symbolic":"reference","module":"./divider.directive","name":"GraniteDividerDirective","line":21,"character":4}],"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule","line":23,"character":12},{"__symbolic":"reference","module":"@angular/cdk/overlay","name":"OverlayModule","line":23,"character":26},{"__symbolic":"reference","module":"@angular/cdk/portal","name":"PortalModule","line":23,"character":41},{"__symbolic":"reference","module":"../icon/icon.module","name":"GraniteIconModule","line":23,"character":55}],"exports":[{"__symbolic":"reference","module":"./menu.component","name":"GraniteMenuComponent","line":25,"character":4},{"__symbolic":"reference","module":"./menu-item.component","name":"GraniteMenuItemComponent","line":26,"character":4},{"__symbolic":"reference","module":"./menu-trigger-for.directive","name":"GraniteMenuTriggerForDirective","line":27,"character":4},{"__symbolic":"reference","module":"./menu-touch-close.component","name":"GraniteMenuTouchCloseComponent","line":28,"character":4},{"__symbolic":"reference","module":"./menu-touch-title.component","name":"GraniteMenuTouchTitleItemComponent","line":29,"character":4},{"__symbolic":"reference","module":"./divider.directive","name":"GraniteDividerDirective","line":30,"character":4}]}]}]}}}]
1
+ [{"__symbolic":"module","version":4,"metadata":{"GraniteMenuModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":15,"character":1},"arguments":[{"declarations":[{"__symbolic":"reference","module":"./menu.component","name":"GraniteMenuComponent","line":17,"character":4},{"__symbolic":"reference","module":"./menu-item.component","name":"GraniteMenuItemComponent","line":18,"character":4},{"__symbolic":"reference","module":"./menu-trigger-for.directive","name":"GraniteMenuTriggerForDirective","line":19,"character":4},{"__symbolic":"reference","module":"./menu-touch-close.component","name":"GraniteMenuTouchCloseComponent","line":20,"character":4},{"__symbolic":"reference","module":"./menu-touch-title.component","name":"GraniteMenuTouchTitleItemComponent","line":21,"character":4},{"__symbolic":"reference","module":"./divider.directive","name":"GraniteDividerDirective","line":22,"character":4},{"__symbolic":"reference","module":"./title.directive","name":"GraniteTitleDirective","line":23,"character":4}],"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule","line":25,"character":12},{"__symbolic":"reference","module":"@angular/cdk/overlay","name":"OverlayModule","line":25,"character":26},{"__symbolic":"reference","module":"@angular/cdk/portal","name":"PortalModule","line":25,"character":41},{"__symbolic":"reference","module":"../icon/icon.module","name":"GraniteIconModule","line":25,"character":55}],"exports":[{"__symbolic":"reference","module":"./menu.component","name":"GraniteMenuComponent","line":27,"character":4},{"__symbolic":"reference","module":"./menu-item.component","name":"GraniteMenuItemComponent","line":28,"character":4},{"__symbolic":"reference","module":"./menu-trigger-for.directive","name":"GraniteMenuTriggerForDirective","line":29,"character":4},{"__symbolic":"reference","module":"./menu-touch-close.component","name":"GraniteMenuTouchCloseComponent","line":30,"character":4},{"__symbolic":"reference","module":"./menu-touch-title.component","name":"GraniteMenuTouchTitleItemComponent","line":31,"character":4},{"__symbolic":"reference","module":"./divider.directive","name":"GraniteDividerDirective","line":32,"character":4},{"__symbolic":"reference","module":"./title.directive","name":"GraniteTitleDirective","line":33,"character":4}]}]}]}}}]
@@ -0,0 +1,13 @@
1
+ import { Directive } from '@angular/core';
2
+ export class GraniteTitleDirective {
3
+ }
4
+ GraniteTitleDirective.decorators = [
5
+ { type: Directive, args: [{
6
+ selector: '[graniteTitle]',
7
+ exportAs: 'graniteTitle',
8
+ host: {
9
+ '[class.granite-title]': 'true',
10
+ },
11
+ },] }
12
+ ];
13
+ //# sourceMappingURL=title.directive.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"title.directive.js","sourceRoot":"","sources":["../../../../../../libs/granite-components/src/lib/menu/title.directive.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AAS1C,MAAM,OAAO,qBAAqB;;;YAPjC,SAAS,SAAC;gBACT,QAAQ,EAAE,gBAAgB;gBAC1B,QAAQ,EAAE,cAAc;gBACxB,IAAI,EAAE;oBACJ,uBAAuB,EAAE,MAAM;iBAChC;aACF","sourcesContent":["import { Directive } from '@angular/core';\n\n@Directive({\n selector: '[graniteTitle]',\n exportAs: 'graniteTitle',\n host: {\n '[class.granite-title]': 'true',\n },\n})\nexport class GraniteTitleDirective {}\n"]}
@@ -0,0 +1 @@
1
+ [{"__symbolic":"module","version":4,"metadata":{"GraniteTitleDirective":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Directive","line":2,"character":1},"arguments":[{"selector":"[graniteTitle]","exportAs":"graniteTitle","host":{"[class.granite-title]":"true","$quoted$":["[class.granite-title]"]}}]}]}}}]
@@ -1 +1 @@
1
- {"version":3,"file":"toggle-switch.component.js","sourceRoot":"","sources":["../../../../../../libs/granite-components/src/lib/toggle-switch/toggle-switch.component.ts"],"names":[],"mappings":"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","sourcesContent":["import { FocusMonitor, FocusOrigin } from '@angular/cdk/a11y';\nimport { coerceBooleanProperty } from '@angular/cdk/coercion';\nimport {\n ChangeDetectionStrategy,\n Component,\n Input,\n Output,\n OnChanges,\n SimpleChanges,\n EventEmitter,\n ElementRef,\n ViewChild,\n} from '@angular/core';\n\nimport { Position } from '../core/types';\n\n@Component({\n selector: 'granite-toggle-switch',\n exportAs: 'graniteToggleSwitch',\n host: {\n class: 'granite-toggle-switch',\n '[class.granite-toggle-switch-checked]': 'checked',\n '[class.granite-toggle-switch-disabled]': 'disabled',\n '[class.granite-toggle-switch-readonly]': 'readonly',\n '[class.granite-toggle-switch-label-before]': '_positionBefore',\n },\n templateUrl: './toggle-switch.component.html',\n styleUrls: ['./toggle-switch.component.scss'],\n changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class GraniteToggleSwitchComponent implements OnChanges {\n @Input()\n id: string | null = null;\n\n @Input()\n checked: boolean = false;\n\n @Input()\n disabled: boolean = false;\n\n @Input()\n readonly: boolean = false;\n\n @Input()\n labelPosition: Position = 'after';\n\n @Input('aria-label')\n ariaLabel: string | null = null;\n\n @Input('aria-labelledby')\n ariaLabelledby: string | null = null;\n\n @Output()\n valueChange: EventEmitter<boolean> = new EventEmitter<boolean>();\n\n @Output()\n toggleChange: EventEmitter<void> = new EventEmitter<void>();\n\n @Output()\n toggleBlur: EventEmitter<void> = new EventEmitter<void>();\n\n @ViewChild('input')\n private _inputElement: ElementRef<HTMLInputElement>;\n\n _positionBefore: boolean = false;\n _toggleSwitchDisabled: boolean = false;\n\n constructor(private _focusMonitor: FocusMonitor) {}\n\n ngOnChanges(changes: SimpleChanges): void {\n if (changes.checked) {\n this.checked = coerceBooleanProperty(changes.checked.currentValue);\n }\n\n if (changes.disabled) {\n this.disabled = coerceBooleanProperty(changes.disabled.currentValue);\n }\n\n if (changes.readonly) {\n this.readonly = coerceBooleanProperty(changes.readonly.currentValue);\n }\n\n if (changes.labelPosition != null) {\n this._positionBefore =\n changes.labelPosition.currentValue != null &&\n changes.labelPosition.currentValue === 'before';\n }\n\n if (\n (changes.disabled || changes.readonly) &&\n (this.disabled || this.readonly)\n ) {\n this._toggleSwitchDisabled = true;\n }\n }\n\n focus(origin: FocusOrigin = 'program', options?: FocusOptions): void {\n this._focusMonitor.focusVia(this._getInputElement(), origin, options);\n }\n\n _onBlur(): void {\n this.toggleBlur.emit();\n }\n\n _toggleSwitchChange(): void {\n this.checked = this._getInputElement().checked;\n this.valueChange.emit(this.checked);\n }\n\n _toggleSwitchClick(): void {\n this.toggleChange.emit();\n }\n\n private _getInputElement(): HTMLInputElement {\n return this._inputElement.nativeElement;\n }\n}\n"]}
1
+ {"version":3,"file":"toggle-switch.component.js","sourceRoot":"","sources":["../../../../../../libs/granite-components/src/lib/toggle-switch/toggle-switch.component.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAe,MAAM,mBAAmB,CAAC;AAC9D,OAAO,EAAE,qBAAqB,EAAE,MAAM,uBAAuB,CAAC;AAC9D,OAAO,EACL,uBAAuB,EACvB,SAAS,EACT,KAAK,EACL,MAAM,EAGN,YAAY,EACZ,UAAU,EACV,SAAS,GACV,MAAM,eAAe,CAAC;AAkBvB,MAAM,OAAO,4BAA4B;IAqCvC,YAAoB,aAA2B;QAA3B,kBAAa,GAAb,aAAa,CAAc;QAnC/C,OAAE,GAAkB,IAAI,CAAC;QAGzB,YAAO,GAAY,KAAK,CAAC;QAGzB,aAAQ,GAAY,KAAK,CAAC;QAG1B,aAAQ,GAAY,KAAK,CAAC;QAG1B,kBAAa,GAAa,OAAO,CAAC;QAGlC,cAAS,GAAkB,IAAI,CAAC;QAGhC,mBAAc,GAAkB,IAAI,CAAC;QAG5B,gBAAW,GAA0B,IAAI,YAAY,EAAW,CAAC;QAGjE,iBAAY,GAAuB,IAAI,YAAY,EAAQ,CAAC;QAG5D,eAAU,GAAuB,IAAI,YAAY,EAAQ,CAAC;QAKnE,oBAAe,GAAY,KAAK,CAAC;QACjC,0BAAqB,GAAY,KAAK,CAAC;IAEW,CAAC;IAEnD,WAAW,CAAC,OAAsB;QAChC,IAAI,OAAO,CAAC,OAAO,EAAE;YACnB,IAAI,CAAC,OAAO,GAAG,qBAAqB,CAAC,OAAO,CAAC,OAAO,CAAC,YAAY,CAAC,CAAC;SACpE;QAED,IAAI,OAAO,CAAC,QAAQ,EAAE;YACpB,IAAI,CAAC,QAAQ,GAAG,qBAAqB,CAAC,OAAO,CAAC,QAAQ,CAAC,YAAY,CAAC,CAAC;SACtE;QAED,IAAI,OAAO,CAAC,QAAQ,EAAE;YACpB,IAAI,CAAC,QAAQ,GAAG,qBAAqB,CAAC,OAAO,CAAC,QAAQ,CAAC,YAAY,CAAC,CAAC;SACtE;QAED,IAAI,OAAO,CAAC,aAAa,IAAI,IAAI,EAAE;YACjC,IAAI,CAAC,eAAe;gBAClB,OAAO,CAAC,aAAa,CAAC,YAAY,IAAI,IAAI;oBAC1C,OAAO,CAAC,aAAa,CAAC,YAAY,KAAK,QAAQ,CAAC;SACnD;QAED,IACE,CAAC,OAAO,CAAC,QAAQ,IAAI,OAAO,CAAC,QAAQ,CAAC;YACtC,CAAC,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,QAAQ,CAAC,EAChC;YACA,IAAI,CAAC,qBAAqB,GAAG,IAAI,CAAC;SACnC;IACH,CAAC;IAED,KAAK,CAAC,SAAsB,SAAS,EAAE,OAAsB;QAC3D,IAAI,CAAC,aAAa,CAAC,QAAQ,CAAC,IAAI,CAAC,gBAAgB,EAAE,EAAE,MAAM,EAAE,OAAO,CAAC,CAAC;IACxE,CAAC;IAED,OAAO;QACL,IAAI,CAAC,UAAU,CAAC,IAAI,EAAE,CAAC;IACzB,CAAC;IAED,mBAAmB;QACjB,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC,gBAAgB,EAAE,CAAC,OAAO,CAAC;QAC/C,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;IACtC,CAAC;IAED,kBAAkB;QAChB,IAAI,CAAC,YAAY,CAAC,IAAI,EAAE,CAAC;IAC3B,CAAC;IAEO,gBAAgB;QACtB,OAAO,IAAI,CAAC,aAAa,CAAC,aAAa,CAAC;IAC1C,CAAC;;;YAnGF,SAAS,SAAC;gBACT,QAAQ,EAAE,uBAAuB;gBACjC,QAAQ,EAAE,qBAAqB;gBAC/B,IAAI,EAAE;oBACJ,KAAK,EAAE,uBAAuB;oBAC9B,uCAAuC,EAAE,SAAS;oBAClD,wCAAwC,EAAE,UAAU;oBACpD,wCAAwC,EAAE,UAAU;oBACpD,4CAA4C,EAAE,iBAAiB;iBAChE;gBACD,0xBAA6C;gBAE7C,eAAe,EAAE,uBAAuB,CAAC,MAAM;;aAChD;;;YA7BQ,YAAY;;;iBA+BlB,KAAK;sBAGL,KAAK;uBAGL,KAAK;uBAGL,KAAK;4BAGL,KAAK;wBAGL,KAAK,SAAC,YAAY;6BAGlB,KAAK,SAAC,iBAAiB;0BAGvB,MAAM;2BAGN,MAAM;yBAGN,MAAM;4BAGN,SAAS,SAAC,OAAO","sourcesContent":["import { FocusMonitor, FocusOrigin } from '@angular/cdk/a11y';\nimport { coerceBooleanProperty } from '@angular/cdk/coercion';\nimport {\n ChangeDetectionStrategy,\n Component,\n Input,\n Output,\n OnChanges,\n SimpleChanges,\n EventEmitter,\n ElementRef,\n ViewChild,\n} from '@angular/core';\n\nimport { Position } from '../core/types';\n\n@Component({\n selector: 'granite-toggle-switch',\n exportAs: 'graniteToggleSwitch',\n host: {\n class: 'granite-toggle-switch',\n '[class.granite-toggle-switch-checked]': 'checked',\n '[class.granite-toggle-switch-disabled]': 'disabled',\n '[class.granite-toggle-switch-readonly]': 'readonly',\n '[class.granite-toggle-switch-label-before]': '_positionBefore',\n },\n templateUrl: './toggle-switch.component.html',\n styleUrls: ['./toggle-switch.component.scss'],\n changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class GraniteToggleSwitchComponent implements OnChanges {\n @Input()\n id: string | null = null;\n\n @Input()\n checked: boolean = false;\n\n @Input()\n disabled: boolean = false;\n\n @Input()\n readonly: boolean = false;\n\n @Input()\n labelPosition: Position = 'after';\n\n @Input('aria-label')\n ariaLabel: string | null = null;\n\n @Input('aria-labelledby')\n ariaLabelledby: string | null = null;\n\n @Output()\n readonly valueChange: EventEmitter<boolean> = new EventEmitter<boolean>();\n\n @Output()\n readonly toggleChange: EventEmitter<void> = new EventEmitter<void>();\n\n @Output()\n readonly toggleBlur: EventEmitter<void> = new EventEmitter<void>();\n\n @ViewChild('input')\n private _inputElement: ElementRef<HTMLInputElement>;\n\n _positionBefore: boolean = false;\n _toggleSwitchDisabled: boolean = false;\n\n constructor(private _focusMonitor: FocusMonitor) {}\n\n ngOnChanges(changes: SimpleChanges): void {\n if (changes.checked) {\n this.checked = coerceBooleanProperty(changes.checked.currentValue);\n }\n\n if (changes.disabled) {\n this.disabled = coerceBooleanProperty(changes.disabled.currentValue);\n }\n\n if (changes.readonly) {\n this.readonly = coerceBooleanProperty(changes.readonly.currentValue);\n }\n\n if (changes.labelPosition != null) {\n this._positionBefore =\n changes.labelPosition.currentValue != null &&\n changes.labelPosition.currentValue === 'before';\n }\n\n if (\n (changes.disabled || changes.readonly) &&\n (this.disabled || this.readonly)\n ) {\n this._toggleSwitchDisabled = true;\n }\n }\n\n focus(origin: FocusOrigin = 'program', options?: FocusOptions): void {\n this._focusMonitor.focusVia(this._getInputElement(), origin, options);\n }\n\n _onBlur(): void {\n this.toggleBlur.emit();\n }\n\n _toggleSwitchChange(): void {\n this.checked = this._getInputElement().checked;\n this.valueChange.emit(this.checked);\n }\n\n _toggleSwitchClick(): void {\n this.toggleChange.emit();\n }\n\n private _getInputElement(): HTMLInputElement {\n return this._inputElement.nativeElement;\n }\n}\n"]}
@@ -2,7 +2,7 @@ import { Component, ChangeDetectionStrategy, ElementRef, Input, HostBinding, Con
2
2
  import { CommonModule, DOCUMENT } from '@angular/common';
3
3
  import { coerceNumberProperty, coerceBooleanProperty } from '@angular/cdk/coercion';
4
4
  import { Subject, BehaviorSubject, Subscription, merge, of, asapScheduler, fromEvent } from 'rxjs';
5
- import { takeUntil, startWith, switchMap, filter, take, delay } from 'rxjs/operators';
5
+ import { takeUntil, delay, startWith, switchMap, filter, take } from 'rxjs/operators';
6
6
  import { __awaiter } from 'tslib';
7
7
  import { ComponentHarness, HarnessPredicate, TestKey } from '@angular/cdk/testing';
8
8
  import { OverlayConfig, Overlay, OverlayModule } from '@angular/cdk/overlay';
@@ -534,7 +534,7 @@ GraniteMenuItemComponent.decorators = [
534
534
  //#endregion --- Touch device customizations ---
535
535
  '(mouseenter)': '_hovered.next(this)',
536
536
  },
537
- styles: [":host{display:block;position:relative;line-height:2rem;padding:0 var(--granite-spacing-s);width:100%;max-width:100%;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;cursor:pointer;outline:none;border:none;-webkit-tap-highlight-color:transparent;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:start;text-decoration:none;background-color:var(--granite-color-background-variant);color:var(--granite-color-text);font-size:var(--granite-font-size-body-small);font-family:inherit}@media (hover:hover) and (pointer:fine){:host:hover{background:var(--granite-color-background-active-hover);color:var(--granite-color-text-on-active)}}@media (hover:none) and (pointer:coarse){:host:active{background:var(--granite-color-background-active-hover);color:var(--granite-color-text-on-active)}}:host.cdk-keyboard-focused,:host.cdk-program-focused,:host.granite-menu-item-highlighted{background:var(--granite-color-background-active-hover);color:var(--granite-color-text-on-active)}:host granite-icon{position:absolute;font-size:var(--granite-font-size-body-small);color:inherit;top:50%;transform:translateY(-50%)}:host.granite-menu-item-submenu-trigger{-webkit-padding-end:var(--granite-spacing-l);padding-inline-end:var(--granite-spacing-l)}:host-context([dir=ltr]) :host.granite-menu-item-submenu-trigger granite-icon,html[dir=ltr] :host.granite-menu-item-submenu-trigger granite-icon{right:var(--granite-spacing-xs)}:host-context([dir=rtl]) :host.granite-menu-item-submenu-trigger granite-icon,html[dir=rtl] :host.granite-menu-item-submenu-trigger granite-icon{left:var(--granite-spacing-xs)}[dir=ltr] :host.granite-menu-item-submenu-trigger granite-icon.caret-left,[dir=rtl] :host.granite-menu-item-submenu-trigger granite-icon.caret-right{display:none}:host.granite-divider-top{border-top:.0625rem solid var(--granite-color-border-soft)}:host.granite-divider-bottom{border-bottom:.0625rem solid var(--granite-color-border-soft)}:host.granite-device-output-touch{line-height:2rem;font-size:var(--granite-font-size-body-small);text-align:center}:host.granite-device-output-touch,:host.granite-device-output-touch.granite-menu-item-back-trigger,:host.granite-device-output-touch.granite-menu-item-submenu-trigger{padding:0 var(--granite-spacing-l)}:host.granite-device-output-touch.granite-menu-item-title{line-height:2rem;height:2rem;font-size:var(--granite-font-size-micro);color:var(--granite-color-text-weak)}@media (hover:none) and (pointer:coarse){:host.granite-device-output-touch.granite-menu-item-title:active{background:var(--granite-color-background-active-hover);color:var(--granite-color-text-on-active)}}:host-context([dir=ltr]) :host.granite-device-output-touch.granite-menu-item-back-trigger granite-icon,html[dir=ltr] :host.granite-device-output-touch.granite-menu-item-back-trigger granite-icon{left:var(--granite-spacing-xs)}:host-context([dir=rtl]) :host.granite-device-output-touch.granite-menu-item-back-trigger granite-icon,html[dir=rtl] :host.granite-device-output-touch.granite-menu-item-back-trigger granite-icon{right:var(--granite-spacing-xs)}[dir=ltr] :host.granite-device-output-touch.granite-menu-item-back-trigger granite-icon.caret-right,[dir=rtl] :host.granite-device-output-touch.granite-menu-item-back-trigger granite-icon.caret-left{display:none}"]
537
+ styles: [":host{display:block;position:relative;line-height:2rem;padding:0 var(--granite-spacing-s);width:100%;max-width:100%;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;cursor:pointer;outline:none;border:none;-webkit-tap-highlight-color:transparent;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:start;text-decoration:none;background-color:var(--granite-color-background-variant);color:var(--granite-color-text);font-size:var(--granite-font-size-body-small);font-family:inherit}@media (hover:hover) and (pointer:fine){:host:hover:not(.granite-title){background:var(--granite-color-background-active-hover);color:var(--granite-color-text-on-active)}}@media (hover:none) and (pointer:coarse){:host:active:not(.granite-title){background:var(--granite-color-background-active-hover);color:var(--granite-color-text-on-active)}}:host.granite-title{-moz-user-select:none;-ms-user-select:none;-webkit-user-select:none;user-select:none;display:flex;align-items:center;height:var(--granite-spacing-l);width:100%;outline:0;border:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-decoration:none;color:var(--granite-color-text);font-size:var(--granite-font-size-micro);font-weight:var(--granite-font-weight-bold);cursor:default}:host.granite-title.center-align{text-align:center}:host.cdk-keyboard-focused,:host.cdk-program-focused,:host.granite-menu-item-highlighted{background:var(--granite-color-background-active-hover);color:var(--granite-color-text-on-active)}:host granite-icon{position:absolute;font-size:var(--granite-font-size-body-small);color:inherit;top:50%;transform:translateY(-50%)}:host.granite-menu-item-submenu-trigger{-webkit-padding-end:var(--granite-spacing-l);padding-inline-end:var(--granite-spacing-l)}:host-context([dir=ltr]) :host.granite-menu-item-submenu-trigger granite-icon,html[dir=ltr] :host.granite-menu-item-submenu-trigger granite-icon{right:var(--granite-spacing-xs)}:host-context([dir=rtl]) :host.granite-menu-item-submenu-trigger granite-icon,html[dir=rtl] :host.granite-menu-item-submenu-trigger granite-icon{left:var(--granite-spacing-xs)}[dir=ltr] :host.granite-menu-item-submenu-trigger granite-icon.caret-left,[dir=rtl] :host.granite-menu-item-submenu-trigger granite-icon.caret-right{display:none}:host.granite-divider-top{border-top:.0625rem solid var(--granite-color-border-soft)}:host.granite-divider-bottom{border-bottom:.0625rem solid var(--granite-color-border-soft)}:host.granite-device-output-touch{line-height:2rem;font-size:var(--granite-font-size-body-small);text-align:center}:host.granite-device-output-touch,:host.granite-device-output-touch.granite-menu-item-back-trigger,:host.granite-device-output-touch.granite-menu-item-submenu-trigger{padding:0 var(--granite-spacing-l)}:host.granite-device-output-touch.granite-menu-item-title{line-height:2rem;height:2rem;font-size:var(--granite-font-size-micro);color:var(--granite-color-text-weak)}@media (hover:none) and (pointer:coarse){:host.granite-device-output-touch.granite-menu-item-title:active{background:var(--granite-color-background-active-hover);color:var(--granite-color-text-on-active)}}:host-context([dir=ltr]) :host.granite-device-output-touch.granite-menu-item-back-trigger granite-icon,html[dir=ltr] :host.granite-device-output-touch.granite-menu-item-back-trigger granite-icon{left:var(--granite-spacing-xs)}:host-context([dir=rtl]) :host.granite-device-output-touch.granite-menu-item-back-trigger granite-icon,html[dir=rtl] :host.granite-device-output-touch.granite-menu-item-back-trigger granite-icon{right:var(--granite-spacing-xs)}[dir=ltr] :host.granite-device-output-touch.granite-menu-item-back-trigger granite-icon.caret-right,[dir=rtl] :host.granite-device-output-touch.granite-menu-item-back-trigger granite-icon.caret-left{display:none}"]
538
538
  },] }
539
539
  ];
540
540
  GraniteMenuItemComponent.ctorParameters = () => [
@@ -808,6 +808,11 @@ class _MenuBaseComponent {
808
808
  /** Emits whenever an animation on the menu completes. */
809
809
  // eslint-disable-next-line rxjs/no-exposed-subjects
810
810
  this._animationDone = new Subject();
811
+ // eslint-disable-next-line rxjs/no-exposed-subjects
812
+ this._isMenuEmpty$ = new BehaviorSubject(false);
813
+ this.isMenuEmpty$ = this._isMenuEmpty$
814
+ .asObservable()
815
+ .pipe(delay(0));
811
816
  /** Only the direct descendant menu items. */
812
817
  this._directDescendantItems = new QueryList();
813
818
  /** Subscription to tab events on the menu panel */
@@ -847,6 +852,9 @@ class _MenuBaseComponent {
847
852
  params: { xOffset: this.xOffset },
848
853
  });
849
854
  }
855
+ ngAfterContentChecked() {
856
+ this._isMenuEmpty$.next(this._allItems.length < 1 ? true : false);
857
+ }
850
858
  ngAfterContentInit() {
851
859
  this._updateDirectDescendants();
852
860
  this._keyManager = new FocusKeyManager(this._directDescendantItems).withWrap();
@@ -1092,7 +1100,7 @@ class GraniteMenuComponent extends _MenuBaseComponent {
1092
1100
  GraniteMenuComponent.decorators = [
1093
1101
  { type: Component, args: [{
1094
1102
  selector: 'granite-menu',
1095
- template: "<!--\n Using separate template part for desktop and touch output, because of\n animation triggers and slightly different content.\n-->\n<ng-template>\n <!-- Desktop -->\n <ng-container *ngIf=\"_clientOutput.device === 'desktop'\">\n <div\n #menu\n class=\"granite-menu\"\n tabindex=\"-1\"\n [id]=\"panelId\"\n [@transformMenuDesktop]=\"_transformMenu | async\"\n (@transformMenuDesktop.start)=\"_onAnimationStart($event)\"\n (@transformMenuDesktop.done)=\"_onAnimationDone($event)\"\n (click)=\"_handleClick()\"\n (keydown)=\"_handleKeydown($event)\"\n >\n <div class=\"granite-menu-content\">\n <ng-container [ngTemplateOutlet]=\"content\"></ng-container>\n </div>\n </div>\n </ng-container>\n\n <!-- Touch -->\n <ng-container *ngIf=\"_clientOutput?.device === 'touch'\">\n <div\n #menu\n class=\"granite-menu granite-device-output-touch\"\n tabindex=\"-1\"\n [id]=\"panelId\"\n [@transformMenuTouch]=\"_transformMenu | async\"\n (@transformMenuTouch.start)=\"_onAnimationStart($event)\"\n (@transformMenuTouch.done)=\"_onAnimationDone($event)\"\n (click)=\"_handleClick()\"\n (keydown)=\"_handleKeydown($event)\"\n >\n <div class=\"granite-menu-content\">\n <div *ngIf=\"showTitle\" class=\"header-container\">\n <button\n [disabled]=\"!showBackButton\"\n graniteMenuTouchTitleItem\n (click)=\"_handleBackClick($event)\"\n >\n {{ title }}\n </button>\n </div>\n\n <ng-container [ngTemplateOutlet]=\"content\"></ng-container>\n\n <div class=\"footer-container\"></div>\n </div>\n </div>\n\n <!-- Close button -->\n <div class=\"close\" [@transformCloseButton]=\"_transformMenu | async\">\n <button\n *ngIf=\"showCloseButton\"\n graniteMenuTouchCloseItem\n (click)=\"_handleCloseClick()\"\n >\n {{ closeLabel }}\n </button>\n </div>\n </ng-container>\n\n <!--\n Content template shared between desktop and touch parts, as <ng-content>\n can't be used in two places in the same template\n -->\n <ng-template #content>\n <ng-content></ng-content>\n </ng-template>\n</ng-template>\n",
1103
+ template: "<!--\n Using separate template part for desktop and touch output, because of\n animation triggers and slightly different content.\n-->\n<ng-template>\n <!-- Desktop -->\n <ng-container *ngIf=\"_clientOutput.device === 'desktop'\">\n <div\n #menu\n class=\"granite-menu\"\n [class.is-menu-empty]=\"isMenuEmpty$ | async\"\n tabindex=\"-1\"\n [id]=\"panelId\"\n [@transformMenuDesktop]=\"_transformMenu | async\"\n (@transformMenuDesktop.start)=\"_onAnimationStart($event)\"\n (@transformMenuDesktop.done)=\"_onAnimationDone($event)\"\n (click)=\"_handleClick()\"\n (keydown)=\"_handleKeydown($event)\"\n >\n <div class=\"granite-menu-content\">\n <ng-container [ngTemplateOutlet]=\"content\"></ng-container>\n </div>\n </div>\n </ng-container>\n\n <!-- Touch -->\n <ng-container *ngIf=\"_clientOutput?.device === 'touch'\">\n <div\n #menu\n class=\"granite-menu granite-device-output-touch\"\n tabindex=\"-1\"\n [id]=\"panelId\"\n [@transformMenuTouch]=\"_transformMenu | async\"\n (@transformMenuTouch.start)=\"_onAnimationStart($event)\"\n (@transformMenuTouch.done)=\"_onAnimationDone($event)\"\n (click)=\"_handleClick()\"\n (keydown)=\"_handleKeydown($event)\"\n >\n <div class=\"granite-menu-content\">\n <div *ngIf=\"showTitle\" class=\"header-container\">\n <button\n [disabled]=\"!showBackButton\"\n graniteMenuTouchTitleItem\n (click)=\"_handleBackClick($event)\"\n >\n {{ title }}\n </button>\n </div>\n\n <ng-container [ngTemplateOutlet]=\"content\"></ng-container>\n\n <div class=\"footer-container\"></div>\n </div>\n </div>\n\n <!-- Close button -->\n <div class=\"close\" [@transformCloseButton]=\"_transformMenu | async\">\n <button\n *ngIf=\"showCloseButton\"\n graniteMenuTouchCloseItem\n (click)=\"_handleCloseClick()\"\n >\n {{ closeLabel }}\n </button>\n </div>\n </ng-container>\n\n <!--\n Content template shared between desktop and touch parts, as <ng-content>\n can't be used in two places in the same template\n -->\n <ng-template #content>\n <ng-content></ng-content>\n </ng-template>\n</ng-template>\n",
1096
1104
  changeDetection: ChangeDetectionStrategy.OnPush,
1097
1105
  exportAs: 'graniteMenu',
1098
1106
  animations: [
@@ -1103,7 +1111,7 @@ GraniteMenuComponent.decorators = [
1103
1111
  providers: [
1104
1112
  { provide: GRANITE_MENU_PANEL, useExisting: GraniteMenuComponent },
1105
1113
  ],
1106
- styles: [".granite-menu:not(.granite-device-output-touch){background-color:var(--granite-color-background-variant);color:var(--granite-color-text);overflow:auto;-webkit-overflow-scrolling:touch;min-height:2rem;max-height:calc(100vh - 2rem);outline:0;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;filter:drop-shadow(0 16px 16px rgba(0,0,0,.08)) drop-shadow(0 4px 20px rgba(0,0,0,.1));min-width:7rem;overflow-x:hidden;overflow-y:hidden}.granite-menu:not(.granite-device-output-touch).ng-animating{pointer-events:none}.granite-menu:not(.granite-device-output-touch):hover{overflow-y:auto}.granite-menu:not(.granite-device-output-touch)::-webkit-scrollbar{width:var(--granite-spacing-xs)}.granite-menu:not(.granite-device-output-touch)::-webkit-scrollbar-thumb{background-color:var(--granite-color-border-hard);border-radius:calc(var(--granite-spacing-m) * .125)}.granite-menu:not(.granite-device-output-touch)::-webkit-scrollbar-track{background-color:var(--granite-color-background-hover)}.granite-menu.granite-device-output-touch{background-color:var(--granite-color-background-variant);color:var(--granite-color-text);overflow:auto;-webkit-overflow-scrolling:touch;min-height:2rem;max-height:calc(100vh - 2rem);outline:0;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;filter:drop-shadow(0 16px 16px rgba(0,0,0,.08)) drop-shadow(0 4px 20px rgba(0,0,0,.1));border-radius:.25rem;-webkit-margin-start:var(--granite-spacing-xs);margin-inline-start:var(--granite-spacing-xs);-webkit-margin-end:var(--granite-spacing-xs);margin-inline-end:var(--granite-spacing-xs);-webkit-margin-after:var(--granite-spacing-xs);margin-block-end:var(--granite-spacing-xs);max-height:calc(100% - ($granite-base-rem * 7))}.granite-menu.granite-device-output-touch.ng-animating{pointer-events:none}.granite-menu.granite-device-output-touch .header-container{position:-webkit-sticky;position:sticky;top:0;background-color:var(--granite-color-background-variant);z-index:1}.granite-menu.granite-device-output-touch .footer-container{position:-webkit-sticky;position:sticky;bottom:0;height:0}.close:not(:empty){background-color:var(--granite-color-background-variant);color:var(--granite-color-text);overflow:auto;-webkit-overflow-scrolling:touch;min-height:2rem;max-height:calc(100vh - 2rem);outline:0;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;filter:drop-shadow(0 16px 16px rgba(0,0,0,.08)) drop-shadow(0 4px 20px rgba(0,0,0,.1));border-radius:.25rem;-webkit-margin-start:var(--granite-spacing-xs);margin-inline-start:var(--granite-spacing-xs);-webkit-margin-end:var(--granite-spacing-xs);margin-inline-end:var(--granite-spacing-xs);-webkit-margin-after:var(--granite-spacing-xs);margin-block-end:var(--granite-spacing-xs)}.close:not(:empty).ng-animating{pointer-events:none}"]
1114
+ styles: [".granite-menu:not(.granite-device-output-touch){background-color:var(--granite-color-background-variant);color:var(--granite-color-text);overflow:auto;-webkit-overflow-scrolling:touch;max-height:calc(100vh - 2rem);outline:0;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;filter:drop-shadow(0 16px 16px rgba(0,0,0,.08)) drop-shadow(0 4px 20px rgba(0,0,0,.1));min-width:7rem;overflow-x:hidden;overflow-y:hidden}.granite-menu:not(.granite-device-output-touch):not(.is-menu-empty){min-height:2rem}.granite-menu:not(.granite-device-output-touch).ng-animating{pointer-events:none}.granite-menu:not(.granite-device-output-touch):hover{overflow-y:auto}.granite-menu:not(.granite-device-output-touch)::-webkit-scrollbar{width:var(--granite-spacing-xs)}.granite-menu:not(.granite-device-output-touch)::-webkit-scrollbar-thumb{background-color:var(--granite-color-border-hard);border-radius:calc(var(--granite-spacing-m) * .125)}.granite-menu:not(.granite-device-output-touch)::-webkit-scrollbar-track{background-color:var(--granite-color-background-hover)}.granite-menu.granite-device-output-touch{background-color:var(--granite-color-background-variant);color:var(--granite-color-text);overflow:auto;-webkit-overflow-scrolling:touch;max-height:calc(100vh - 2rem);outline:0;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;filter:drop-shadow(0 16px 16px rgba(0,0,0,.08)) drop-shadow(0 4px 20px rgba(0,0,0,.1));border-radius:.25rem;-webkit-margin-start:var(--granite-spacing-xs);margin-inline-start:var(--granite-spacing-xs);-webkit-margin-end:var(--granite-spacing-xs);margin-inline-end:var(--granite-spacing-xs);-webkit-margin-after:var(--granite-spacing-xs);margin-block-end:var(--granite-spacing-xs);max-height:calc(100% - ($granite-base-rem * 7))}.granite-menu.granite-device-output-touch:not(.is-menu-empty){min-height:2rem}.granite-menu.granite-device-output-touch.ng-animating{pointer-events:none}.granite-menu.granite-device-output-touch .header-container{position:-webkit-sticky;position:sticky;top:0;background-color:var(--granite-color-background-variant);z-index:1}.granite-menu.granite-device-output-touch .footer-container{position:-webkit-sticky;position:sticky;bottom:0;height:0}.close:not(:empty){background-color:var(--granite-color-background-variant);color:var(--granite-color-text);overflow:auto;-webkit-overflow-scrolling:touch;max-height:calc(100vh - 2rem);outline:0;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;filter:drop-shadow(0 16px 16px rgba(0,0,0,.08)) drop-shadow(0 4px 20px rgba(0,0,0,.1));border-radius:.25rem;-webkit-margin-start:var(--granite-spacing-xs);margin-inline-start:var(--granite-spacing-xs);-webkit-margin-end:var(--granite-spacing-xs);margin-inline-end:var(--granite-spacing-xs);-webkit-margin-after:var(--granite-spacing-xs);margin-block-end:var(--granite-spacing-xs)}.close:not(:empty):not(.is-menu-empty){min-height:2rem}.close:not(:empty).ng-animating{pointer-events:none}"]
1107
1115
  },] }
1108
1116
  ];
1109
1117
 
@@ -1165,6 +1173,7 @@ class GraniteMenuTriggerForDirective {
1165
1173
  this._menuItemInstance = _menuItemInstance;
1166
1174
  this._dir = _dir;
1167
1175
  this._focusMonitor = _focusMonitor;
1176
+ this.openOnHover = true;
1168
1177
  /** Whether the associated menu is open */
1169
1178
  this._isMenuOpen = false;
1170
1179
  // Tracking input type is necessary so it's possible to only auto-focus
@@ -1278,7 +1287,9 @@ class GraniteMenuTriggerForDirective {
1278
1287
  }
1279
1288
  }
1280
1289
  ngAfterContentInit() {
1281
- this._checkMenu();
1290
+ // removed checkMenu here to avoid errors in dynamically genarated menus
1291
+ // menu is checked when opening the menu
1292
+ // this._checkMenu();
1282
1293
  this._handleHover();
1283
1294
  }
1284
1295
  ngOnDestroy() {
@@ -1334,6 +1345,9 @@ class GraniteMenuTriggerForDirective {
1334
1345
  });
1335
1346
  }
1336
1347
  }
1348
+ isOpen() {
1349
+ return this._isMenuOpen;
1350
+ }
1337
1351
  /** Open the associated menu */
1338
1352
  openMenu() {
1339
1353
  var _a;
@@ -1643,7 +1657,8 @@ class GraniteMenuTriggerForDirective {
1643
1657
  */
1644
1658
  _openOnHover() {
1645
1659
  var _a, _b;
1646
- return (((_a = this._parentMenu._clientOutput) === null || _a === void 0 ? void 0 : _a.device) === 'desktop' && ((_b = this._parentMenu._clientInput) === null || _b === void 0 ? void 0 : _b.devices.includes('mouse')));
1660
+ return (this.openOnHover &&
1661
+ ((_a = this._parentMenu._clientOutput) === null || _a === void 0 ? void 0 : _a.device) === 'desktop' && ((_b = this._parentMenu._clientInput) === null || _b === void 0 ? void 0 : _b.devices.includes('mouse')));
1647
1662
  }
1648
1663
  /**
1649
1664
  * Whether to toggle submenus on click. This is true when showing desktop menus
@@ -1651,8 +1666,9 @@ class GraniteMenuTriggerForDirective {
1651
1666
  */
1652
1667
  _toggleOnSubmenuClick() {
1653
1668
  var _a, _b;
1654
- return (((_a = this._parentMenu._clientOutput) === null || _a === void 0 ? void 0 : _a.device) === 'desktop' &&
1655
- !((_b = this._parentMenu._clientInput) === null || _b === void 0 ? void 0 : _b.devices.includes('mouse')));
1669
+ return (!this.openOnHover ||
1670
+ (((_a = this._parentMenu._clientOutput) === null || _a === void 0 ? void 0 : _a.device) === 'desktop' &&
1671
+ !((_b = this._parentMenu._clientInput) === null || _b === void 0 ? void 0 : _b.devices.includes('mouse'))));
1656
1672
  }
1657
1673
  // ------------------------------------------- //
1658
1674
  // --- Here be touch device customizations --- //
@@ -1781,7 +1797,8 @@ GraniteMenuTriggerForDirective.ctorParameters = () => [
1781
1797
  { type: undefined, decorators: [{ type: Inject, args: [DOCUMENT,] }] }
1782
1798
  ];
1783
1799
  GraniteMenuTriggerForDirective.propDecorators = {
1784
- menu: [{ type: Input, args: ['graniteMenuTriggerFor',] }]
1800
+ menu: [{ type: Input, args: ['graniteMenuTriggerFor',] }],
1801
+ openOnHover: [{ type: Input }]
1785
1802
  };
1786
1803
 
1787
1804
  class GraniteMenuTouchCloseComponent {
@@ -1795,7 +1812,7 @@ GraniteMenuTouchCloseComponent.decorators = [
1795
1812
  host: {
1796
1813
  '[class.granite-device-output-touch]': 'true',
1797
1814
  },
1798
- styles: [":host{display:block;position:relative;line-height:2rem;padding:0 var(--granite-spacing-s);width:100%;max-width:100%;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;cursor:pointer;outline:none;border:none;-webkit-tap-highlight-color:transparent;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:start;text-decoration:none;background-color:var(--granite-color-background-variant);color:var(--granite-color-text);font-size:var(--granite-font-size-body-small);font-family:inherit}@media (hover:hover) and (pointer:fine){:host:hover{background:var(--granite-color-background-active-hover);color:var(--granite-color-text-on-active)}}@media (hover:none) and (pointer:coarse){:host:active{background:var(--granite-color-background-active-hover);color:var(--granite-color-text-on-active)}}:host.cdk-keyboard-focused,:host.cdk-program-focused,:host.granite-menu-item-highlighted{background:var(--granite-color-background-active-hover);color:var(--granite-color-text-on-active)}:host granite-icon{position:absolute;font-size:var(--granite-font-size-body-small);color:inherit;top:50%;transform:translateY(-50%)}:host.granite-menu-item-submenu-trigger{-webkit-padding-end:var(--granite-spacing-l);padding-inline-end:var(--granite-spacing-l)}:host-context([dir=ltr]) :host.granite-menu-item-submenu-trigger granite-icon,html[dir=ltr] :host.granite-menu-item-submenu-trigger granite-icon{right:var(--granite-spacing-xs)}:host-context([dir=rtl]) :host.granite-menu-item-submenu-trigger granite-icon,html[dir=rtl] :host.granite-menu-item-submenu-trigger granite-icon{left:var(--granite-spacing-xs)}[dir=ltr] :host.granite-menu-item-submenu-trigger granite-icon.caret-left,[dir=rtl] :host.granite-menu-item-submenu-trigger granite-icon.caret-right{display:none}:host.granite-divider-top{border-top:.0625rem solid var(--granite-color-border-soft)}:host.granite-divider-bottom{border-bottom:.0625rem solid var(--granite-color-border-soft)}:host.granite-device-output-touch{line-height:2rem;font-size:var(--granite-font-size-body-small);text-align:center}:host.granite-device-output-touch,:host.granite-device-output-touch.granite-menu-item-back-trigger,:host.granite-device-output-touch.granite-menu-item-submenu-trigger{padding:0 var(--granite-spacing-l)}:host.granite-device-output-touch.granite-menu-item-title{line-height:2rem;height:2rem;font-size:var(--granite-font-size-micro);color:var(--granite-color-text-weak)}@media (hover:none) and (pointer:coarse){:host.granite-device-output-touch.granite-menu-item-title:active{background:var(--granite-color-background-active-hover);color:var(--granite-color-text-on-active)}}:host-context([dir=ltr]) :host.granite-device-output-touch.granite-menu-item-back-trigger granite-icon,html[dir=ltr] :host.granite-device-output-touch.granite-menu-item-back-trigger granite-icon{left:var(--granite-spacing-xs)}:host-context([dir=rtl]) :host.granite-device-output-touch.granite-menu-item-back-trigger granite-icon,html[dir=rtl] :host.granite-device-output-touch.granite-menu-item-back-trigger granite-icon{right:var(--granite-spacing-xs)}[dir=ltr] :host.granite-device-output-touch.granite-menu-item-back-trigger granite-icon.caret-right,[dir=rtl] :host.granite-device-output-touch.granite-menu-item-back-trigger granite-icon.caret-left{display:none}"]
1815
+ styles: [":host{display:block;position:relative;line-height:2rem;padding:0 var(--granite-spacing-s);width:100%;max-width:100%;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;cursor:pointer;outline:none;border:none;-webkit-tap-highlight-color:transparent;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:start;text-decoration:none;background-color:var(--granite-color-background-variant);color:var(--granite-color-text);font-size:var(--granite-font-size-body-small);font-family:inherit}@media (hover:hover) and (pointer:fine){:host:hover:not(.granite-title){background:var(--granite-color-background-active-hover);color:var(--granite-color-text-on-active)}}@media (hover:none) and (pointer:coarse){:host:active:not(.granite-title){background:var(--granite-color-background-active-hover);color:var(--granite-color-text-on-active)}}:host.granite-title{-moz-user-select:none;-ms-user-select:none;-webkit-user-select:none;user-select:none;display:flex;align-items:center;height:var(--granite-spacing-l);width:100%;outline:0;border:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-decoration:none;color:var(--granite-color-text);font-size:var(--granite-font-size-micro);font-weight:var(--granite-font-weight-bold);cursor:default}:host.granite-title.center-align{text-align:center}:host.cdk-keyboard-focused,:host.cdk-program-focused,:host.granite-menu-item-highlighted{background:var(--granite-color-background-active-hover);color:var(--granite-color-text-on-active)}:host granite-icon{position:absolute;font-size:var(--granite-font-size-body-small);color:inherit;top:50%;transform:translateY(-50%)}:host.granite-menu-item-submenu-trigger{-webkit-padding-end:var(--granite-spacing-l);padding-inline-end:var(--granite-spacing-l)}:host-context([dir=ltr]) :host.granite-menu-item-submenu-trigger granite-icon,html[dir=ltr] :host.granite-menu-item-submenu-trigger granite-icon{right:var(--granite-spacing-xs)}:host-context([dir=rtl]) :host.granite-menu-item-submenu-trigger granite-icon,html[dir=rtl] :host.granite-menu-item-submenu-trigger granite-icon{left:var(--granite-spacing-xs)}[dir=ltr] :host.granite-menu-item-submenu-trigger granite-icon.caret-left,[dir=rtl] :host.granite-menu-item-submenu-trigger granite-icon.caret-right{display:none}:host.granite-divider-top{border-top:.0625rem solid var(--granite-color-border-soft)}:host.granite-divider-bottom{border-bottom:.0625rem solid var(--granite-color-border-soft)}:host.granite-device-output-touch{line-height:2rem;font-size:var(--granite-font-size-body-small);text-align:center}:host.granite-device-output-touch,:host.granite-device-output-touch.granite-menu-item-back-trigger,:host.granite-device-output-touch.granite-menu-item-submenu-trigger{padding:0 var(--granite-spacing-l)}:host.granite-device-output-touch.granite-menu-item-title{line-height:2rem;height:2rem;font-size:var(--granite-font-size-micro);color:var(--granite-color-text-weak)}@media (hover:none) and (pointer:coarse){:host.granite-device-output-touch.granite-menu-item-title:active{background:var(--granite-color-background-active-hover);color:var(--granite-color-text-on-active)}}:host-context([dir=ltr]) :host.granite-device-output-touch.granite-menu-item-back-trigger granite-icon,html[dir=ltr] :host.granite-device-output-touch.granite-menu-item-back-trigger granite-icon{left:var(--granite-spacing-xs)}:host-context([dir=rtl]) :host.granite-device-output-touch.granite-menu-item-back-trigger granite-icon,html[dir=rtl] :host.granite-device-output-touch.granite-menu-item-back-trigger granite-icon{right:var(--granite-spacing-xs)}[dir=ltr] :host.granite-device-output-touch.granite-menu-item-back-trigger granite-icon.caret-right,[dir=rtl] :host.granite-device-output-touch.granite-menu-item-back-trigger granite-icon.caret-left{display:none}"]
1799
1816
  },] }
1800
1817
  ];
1801
1818
 
@@ -1828,7 +1845,7 @@ GraniteMenuTouchTitleItemComponent.decorators = [
1828
1845
  '[class.granite-menu-item-back-trigger]': '_triggersBack',
1829
1846
  '[class.granite-device-output-touch]': 'true',
1830
1847
  },
1831
- styles: [":host{display:block;position:relative;line-height:2rem;padding:0 var(--granite-spacing-s);width:100%;max-width:100%;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;cursor:pointer;outline:none;border:none;-webkit-tap-highlight-color:transparent;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:start;text-decoration:none;background-color:var(--granite-color-background-variant);color:var(--granite-color-text);font-size:var(--granite-font-size-body-small);font-family:inherit}@media (hover:hover) and (pointer:fine){:host:hover{background:var(--granite-color-background-active-hover);color:var(--granite-color-text-on-active)}}@media (hover:none) and (pointer:coarse){:host:active{background:var(--granite-color-background-active-hover);color:var(--granite-color-text-on-active)}}:host.cdk-keyboard-focused,:host.cdk-program-focused,:host.granite-menu-item-highlighted{background:var(--granite-color-background-active-hover);color:var(--granite-color-text-on-active)}:host granite-icon{position:absolute;font-size:var(--granite-font-size-body-small);color:inherit;top:50%;transform:translateY(-50%)}:host.granite-menu-item-submenu-trigger{-webkit-padding-end:var(--granite-spacing-l);padding-inline-end:var(--granite-spacing-l)}:host-context([dir=ltr]) :host.granite-menu-item-submenu-trigger granite-icon,html[dir=ltr] :host.granite-menu-item-submenu-trigger granite-icon{right:var(--granite-spacing-xs)}:host-context([dir=rtl]) :host.granite-menu-item-submenu-trigger granite-icon,html[dir=rtl] :host.granite-menu-item-submenu-trigger granite-icon{left:var(--granite-spacing-xs)}[dir=ltr] :host.granite-menu-item-submenu-trigger granite-icon.caret-left,[dir=rtl] :host.granite-menu-item-submenu-trigger granite-icon.caret-right{display:none}:host.granite-divider-top{border-top:.0625rem solid var(--granite-color-border-soft)}:host.granite-divider-bottom{border-bottom:.0625rem solid var(--granite-color-border-soft)}:host.granite-device-output-touch{line-height:2rem;font-size:var(--granite-font-size-body-small);text-align:center}:host.granite-device-output-touch,:host.granite-device-output-touch.granite-menu-item-back-trigger,:host.granite-device-output-touch.granite-menu-item-submenu-trigger{padding:0 var(--granite-spacing-l)}:host.granite-device-output-touch.granite-menu-item-title{line-height:2rem;height:2rem;font-size:var(--granite-font-size-micro);color:var(--granite-color-text-weak)}@media (hover:none) and (pointer:coarse){:host.granite-device-output-touch.granite-menu-item-title:active{background:var(--granite-color-background-active-hover);color:var(--granite-color-text-on-active)}}:host-context([dir=ltr]) :host.granite-device-output-touch.granite-menu-item-back-trigger granite-icon,html[dir=ltr] :host.granite-device-output-touch.granite-menu-item-back-trigger granite-icon{left:var(--granite-spacing-xs)}:host-context([dir=rtl]) :host.granite-device-output-touch.granite-menu-item-back-trigger granite-icon,html[dir=rtl] :host.granite-device-output-touch.granite-menu-item-back-trigger granite-icon{right:var(--granite-spacing-xs)}[dir=ltr] :host.granite-device-output-touch.granite-menu-item-back-trigger granite-icon.caret-right,[dir=rtl] :host.granite-device-output-touch.granite-menu-item-back-trigger granite-icon.caret-left{display:none}"]
1848
+ styles: [":host{display:block;position:relative;line-height:2rem;padding:0 var(--granite-spacing-s);width:100%;max-width:100%;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;cursor:pointer;outline:none;border:none;-webkit-tap-highlight-color:transparent;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:start;text-decoration:none;background-color:var(--granite-color-background-variant);color:var(--granite-color-text);font-size:var(--granite-font-size-body-small);font-family:inherit}@media (hover:hover) and (pointer:fine){:host:hover:not(.granite-title){background:var(--granite-color-background-active-hover);color:var(--granite-color-text-on-active)}}@media (hover:none) and (pointer:coarse){:host:active:not(.granite-title){background:var(--granite-color-background-active-hover);color:var(--granite-color-text-on-active)}}:host.granite-title{-moz-user-select:none;-ms-user-select:none;-webkit-user-select:none;user-select:none;display:flex;align-items:center;height:var(--granite-spacing-l);width:100%;outline:0;border:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-decoration:none;color:var(--granite-color-text);font-size:var(--granite-font-size-micro);font-weight:var(--granite-font-weight-bold);cursor:default}:host.granite-title.center-align{text-align:center}:host.cdk-keyboard-focused,:host.cdk-program-focused,:host.granite-menu-item-highlighted{background:var(--granite-color-background-active-hover);color:var(--granite-color-text-on-active)}:host granite-icon{position:absolute;font-size:var(--granite-font-size-body-small);color:inherit;top:50%;transform:translateY(-50%)}:host.granite-menu-item-submenu-trigger{-webkit-padding-end:var(--granite-spacing-l);padding-inline-end:var(--granite-spacing-l)}:host-context([dir=ltr]) :host.granite-menu-item-submenu-trigger granite-icon,html[dir=ltr] :host.granite-menu-item-submenu-trigger granite-icon{right:var(--granite-spacing-xs)}:host-context([dir=rtl]) :host.granite-menu-item-submenu-trigger granite-icon,html[dir=rtl] :host.granite-menu-item-submenu-trigger granite-icon{left:var(--granite-spacing-xs)}[dir=ltr] :host.granite-menu-item-submenu-trigger granite-icon.caret-left,[dir=rtl] :host.granite-menu-item-submenu-trigger granite-icon.caret-right{display:none}:host.granite-divider-top{border-top:.0625rem solid var(--granite-color-border-soft)}:host.granite-divider-bottom{border-bottom:.0625rem solid var(--granite-color-border-soft)}:host.granite-device-output-touch{line-height:2rem;font-size:var(--granite-font-size-body-small);text-align:center}:host.granite-device-output-touch,:host.granite-device-output-touch.granite-menu-item-back-trigger,:host.granite-device-output-touch.granite-menu-item-submenu-trigger{padding:0 var(--granite-spacing-l)}:host.granite-device-output-touch.granite-menu-item-title{line-height:2rem;height:2rem;font-size:var(--granite-font-size-micro);color:var(--granite-color-text-weak)}@media (hover:none) and (pointer:coarse){:host.granite-device-output-touch.granite-menu-item-title:active{background:var(--granite-color-background-active-hover);color:var(--granite-color-text-on-active)}}:host-context([dir=ltr]) :host.granite-device-output-touch.granite-menu-item-back-trigger granite-icon,html[dir=ltr] :host.granite-device-output-touch.granite-menu-item-back-trigger granite-icon{left:var(--granite-spacing-xs)}:host-context([dir=rtl]) :host.granite-device-output-touch.granite-menu-item-back-trigger granite-icon,html[dir=rtl] :host.granite-device-output-touch.granite-menu-item-back-trigger granite-icon{right:var(--granite-spacing-xs)}[dir=ltr] :host.granite-device-output-touch.granite-menu-item-back-trigger granite-icon.caret-right,[dir=rtl] :host.granite-device-output-touch.granite-menu-item-back-trigger granite-icon.caret-left{display:none}"]
1832
1849
  },] }
1833
1850
  ];
1834
1851
  GraniteMenuTouchTitleItemComponent.ctorParameters = () => [
@@ -1910,6 +1927,18 @@ GraniteIconModule.decorators = [
1910
1927
  },] }
1911
1928
  ];
1912
1929
 
1930
+ class GraniteTitleDirective {
1931
+ }
1932
+ GraniteTitleDirective.decorators = [
1933
+ { type: Directive, args: [{
1934
+ selector: '[graniteTitle]',
1935
+ exportAs: 'graniteTitle',
1936
+ host: {
1937
+ '[class.granite-title]': 'true',
1938
+ },
1939
+ },] }
1940
+ ];
1941
+
1913
1942
  class GraniteMenuModule {
1914
1943
  }
1915
1944
  GraniteMenuModule.decorators = [
@@ -1921,6 +1950,7 @@ GraniteMenuModule.decorators = [
1921
1950
  GraniteMenuTouchCloseComponent,
1922
1951
  GraniteMenuTouchTitleItemComponent,
1923
1952
  GraniteDividerDirective,
1953
+ GraniteTitleDirective,
1924
1954
  ],
1925
1955
  imports: [CommonModule, OverlayModule, PortalModule, GraniteIconModule],
1926
1956
  exports: [
@@ -1930,6 +1960,7 @@ GraniteMenuModule.decorators = [
1930
1960
  GraniteMenuTouchCloseComponent,
1931
1961
  GraniteMenuTouchTitleItemComponent,
1932
1962
  GraniteDividerDirective,
1963
+ GraniteTitleDirective,
1933
1964
  ],
1934
1965
  },] }
1935
1966
  ];
@@ -2392,12 +2423,16 @@ const disabledMixin = (Base = class {
2392
2423
  return Derived;
2393
2424
  };
2394
2425
 
2395
- var ButtonSelectors;
2396
- (function (ButtonSelectors) {
2397
- ButtonSelectors["graniteButton"] = "granite-button";
2398
- ButtonSelectors["granitePrimaryButton"] = "granite-primary-button";
2399
- ButtonSelectors["graniteFlatButton"] = "granite-flat-button";
2400
- })(ButtonSelectors || (ButtonSelectors = {}));
2426
+ const BUTTON_CLASS = 'granite-button';
2427
+ const PRIMARY_BUTTON_CLASS = 'granite-primary-button';
2428
+ const FLAT_BUTTON_CLASS = 'granite-flat-button';
2429
+ const NAV_BUTTON_CLASS = 'granite-nav-button';
2430
+ const ButtonSelectors = {
2431
+ graniteButton: BUTTON_CLASS,
2432
+ granitePrimaryButton: PRIMARY_BUTTON_CLASS,
2433
+ graniteFlatButton: FLAT_BUTTON_CLASS,
2434
+ graniteNavButton: NAV_BUTTON_CLASS,
2435
+ };
2401
2436
  const ButtonComponentMixin = disabledMixin();
2402
2437
  class GraniteButtonComponent extends ButtonComponentMixin {
2403
2438
  constructor(_focusMonitor, _elementRef) {
@@ -2425,7 +2460,9 @@ GraniteButtonComponent.decorators = [
2425
2460
  // eslint-disable-next-line @angular-eslint/component-selector
2426
2461
  selector: `button[graniteButton],
2427
2462
  button[granitePrimaryButton],
2428
- button[graniteFlatButton]
2463
+ button[graniteFlatButton],
2464
+ button[graniteNavButton],
2465
+ button[graniteButtonBase]
2429
2466
  `,
2430
2467
  host: {
2431
2468
  class: 'granite-button-base',
@@ -2436,7 +2473,7 @@ GraniteButtonComponent.decorators = [
2436
2473
  template: '<ng-content></ng-content>',
2437
2474
  inputs: ['disabled'],
2438
2475
  changeDetection: ChangeDetectionStrategy.OnPush,
2439
- styles: [":host{box-sizing:border-box}:host *,:host :after,:host :before{box-sizing:inherit;cursor:pointer}button:host{background-color:inherit;-webkit-appearance:none;-moz-appearance:none;appearance:none;border:none;font:inherit;border-radius:inherit;height:inherit;font-weight:inherit;line-height:inherit;color:inherit;margin:inherit;cursor:pointer;padding:inherit}a:host,button:host{outline:none}:host.granite-button-base{border-radius:.25rem;font-size:var(--granite-font-size-body-small);font-weight:var(--granite-font-weight-regular);padding:var(--granite-spacing-s) var(--granite-spacing-s);position:relative;line-height:var(--granite-font-size-body-medium);display:flex;justify-content:center;align-items:center;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}:host:focus:not(.granite-button-disabled):not(:active){border:.0625rem solid var(--granite-color-focus)}button:host.granite-primary-button{background-color:var(--granite-color-background-active);color:var(--granite-color-text-on-active);border:.0625rem solid transparent}button:host.granite-primary-button:hover:not(.granite-button-disabled){background-color:var(--granite-color-background-active-hover);color:none}button:host.granite-primary-button:active:not(.granite-button-disabled){background-color:var(--granite-color-background-active-selected);color:none}button:host.granite-button{background-color:var(--granite-color-background-variant);color:var(--granite-color-text);border:.0625rem solid var(--granite-color-border-soft)}button:host.granite-button:hover:not(.granite-button-disabled){background-color:var(--granite-color-background-active-hover);color:var(--granite-color-text-on-active)}button:host.granite-button:active:not(.granite-button-disabled){background-color:var(--granite-color-background-active-selected);color:var(--granite-color-text-on-active)}button:host.granite-flat-button{background-color:transparent;color:var(--granite-color-text);border:.0625rem solid transparent}button:host.granite-flat-button:hover:not(.granite-button-disabled){background-color:var(--granite-color-background-hover);color:var(--granite-color-text)}button:host.granite-flat-button:active:not(.granite-button-disabled){background-color:var(--granite-color-background-selected);color:var(--granite-color-text)}button:host.granite-button-disabled,button:host.granite-button-disabled:active,button:host.granite-button-disabled:focus,button:host.granite-button-disabled:hover{opacity:.4;cursor:default}a:host.granite-button{background-color:var(--granite-color-background-variant);color:var(--granite-color-text-link);border:.0625rem solid var(--granite-color-border-soft)}a:host.granite-button:hover:not(.granite-button-disabled){background-color:var(--granite-color-background-active-hover);color:var(--granite-color-text-on-active)}a:host.granite-button:active:not(.granite-button-disabled){background-color:var(--granite-color-background-active-selected);color:var(--granite-color-text-on-active)}a:host.granite-button-disabled,a:host.granite-button-disabled:active,a:host.granite-button-disabled:focus,a:host.granite-button-disabled:hover{opacity:.4;text-decoration:none;cursor:default;border:.0625rem solid var(--granite-color-border-soft);pointer-events:none}"]
2476
+ styles: [":host{box-sizing:border-box}:host *,:host :after,:host :before{box-sizing:inherit;cursor:pointer}button:host{background-color:inherit;-webkit-appearance:none;-moz-appearance:none;appearance:none;border:none;font:inherit;border-radius:inherit;height:inherit;font-weight:inherit;line-height:inherit;color:inherit;margin:inherit;cursor:pointer;padding:inherit}a:host,button:host{outline:none}:host.granite-button-base{border-radius:.25rem;font-size:var(--granite-font-size-body-small);font-weight:var(--granite-font-weight-regular);padding:var(--granite-spacing-s) var(--granite-spacing-s);position:relative;line-height:var(--granite-font-size-body-medium);display:flex;justify-content:center;align-items:center;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}:host:focus:not(.granite-button-disabled):not(:active){border:2px solid #1a376d}button:host.granite-primary-button{background-color:var(--granite-color-background-active);color:var(--granite-color-text-on-active);border:2px solid transparent}button:host.granite-primary-button:hover:not(.granite-button-disabled){background-color:var(--granite-color-background-active-hover);color:none}button:host.granite-primary-button:active:not(.granite-button-disabled){background-color:var(--granite-color-background-active-selected);color:none}button:host.granite-button{background-color:var(--granite-color-background-variant);color:var(--granite-color-text);border:2px solid var(--granite-color-border-soft)}button:host.granite-button:hover:not(.granite-button-disabled){background-color:var(--granite-color-background-active-hover);color:var(--granite-color-text-on-active)}button:host.granite-button:active:not(.granite-button-disabled){background-color:var(--granite-color-background-active-selected);color:var(--granite-color-text-on-active)}button:host.granite-flat-button{background-color:transparent;color:var(--granite-color-text);border:2px solid transparent}button:host.granite-flat-button:hover:not(.granite-button-disabled){background-color:var(--granite-color-background-active-hover);color:var(--granite-color-text-on-active)}button:host.granite-flat-button:active:not(.granite-button-disabled){background-color:var(--granite-color-background-active-selected);color:var(--granite-color-text-on-active)}button:host.granite-nav-button{background-color:var(--granite-color-background-variant);color:var(--granite-color-text-link);border:2px solid var(--granite-color-border-soft)}button:host.granite-nav-button:hover:not(.granite-button-disabled){background-color:var(--granite-color-background-active-hover);color:var(--granite-color-text-on-active)}button:host.granite-nav-button:active:not(.granite-button-disabled){background-color:var(--granite-color-background-active-selected);color:var(--granite-color-text-on-active)}button:host.granite-nav-button:hover{text-decoration:underline}button:host.granite-button-disabled,button:host.granite-button-disabled:active,button:host.granite-button-disabled:focus,button:host.granite-button-disabled:hover{opacity:.4;cursor:default}a:host.granite-button{background-color:var(--granite-color-background-variant);color:var(--granite-color-text-link);border:2px solid var(--granite-color-border-soft)}a:host.granite-button:hover:not(.granite-button-disabled){background-color:var(--granite-color-background-active-hover);color:var(--granite-color-text-on-active)}a:host.granite-button:active:not(.granite-button-disabled){background-color:var(--granite-color-background-active-selected);color:var(--granite-color-text-on-active)}a:host.granite-button-disabled,a:host.granite-button-disabled:active,a:host.granite-button-disabled:focus,a:host.granite-button-disabled:hover{opacity:.4;text-decoration:none;cursor:default;border:2px solid var(--granite-color-border-soft);pointer-events:none}"]
2440
2477
  },] }
2441
2478
  ];
2442
2479
  GraniteButtonComponent.ctorParameters = () => [
@@ -2471,7 +2508,7 @@ GraniteAnchorComponent.decorators = [
2471
2508
  template: '<ng-content></ng-content>',
2472
2509
  inputs: ['disabled'],
2473
2510
  changeDetection: ChangeDetectionStrategy.OnPush,
2474
- styles: [":host{box-sizing:border-box}:host *,:host :after,:host :before{box-sizing:inherit;cursor:pointer}button:host{background-color:inherit;-webkit-appearance:none;-moz-appearance:none;appearance:none;border:none;font:inherit;border-radius:inherit;height:inherit;font-weight:inherit;line-height:inherit;color:inherit;margin:inherit;cursor:pointer;padding:inherit}a:host,button:host{outline:none}:host.granite-button-base{border-radius:.25rem;font-size:var(--granite-font-size-body-small);font-weight:var(--granite-font-weight-regular);padding:var(--granite-spacing-s) var(--granite-spacing-s);position:relative;line-height:var(--granite-font-size-body-medium);display:flex;justify-content:center;align-items:center;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}:host:focus:not(.granite-button-disabled):not(:active){border:.0625rem solid var(--granite-color-focus)}button:host.granite-primary-button{background-color:var(--granite-color-background-active);color:var(--granite-color-text-on-active);border:.0625rem solid transparent}button:host.granite-primary-button:hover:not(.granite-button-disabled){background-color:var(--granite-color-background-active-hover);color:none}button:host.granite-primary-button:active:not(.granite-button-disabled){background-color:var(--granite-color-background-active-selected);color:none}button:host.granite-button{background-color:var(--granite-color-background-variant);color:var(--granite-color-text);border:.0625rem solid var(--granite-color-border-soft)}button:host.granite-button:hover:not(.granite-button-disabled){background-color:var(--granite-color-background-active-hover);color:var(--granite-color-text-on-active)}button:host.granite-button:active:not(.granite-button-disabled){background-color:var(--granite-color-background-active-selected);color:var(--granite-color-text-on-active)}button:host.granite-flat-button{background-color:transparent;color:var(--granite-color-text);border:.0625rem solid transparent}button:host.granite-flat-button:hover:not(.granite-button-disabled){background-color:var(--granite-color-background-hover);color:var(--granite-color-text)}button:host.granite-flat-button:active:not(.granite-button-disabled){background-color:var(--granite-color-background-selected);color:var(--granite-color-text)}button:host.granite-button-disabled,button:host.granite-button-disabled:active,button:host.granite-button-disabled:focus,button:host.granite-button-disabled:hover{opacity:.4;cursor:default}a:host.granite-button{background-color:var(--granite-color-background-variant);color:var(--granite-color-text-link);border:.0625rem solid var(--granite-color-border-soft)}a:host.granite-button:hover:not(.granite-button-disabled){background-color:var(--granite-color-background-active-hover);color:var(--granite-color-text-on-active)}a:host.granite-button:active:not(.granite-button-disabled){background-color:var(--granite-color-background-active-selected);color:var(--granite-color-text-on-active)}a:host.granite-button-disabled,a:host.granite-button-disabled:active,a:host.granite-button-disabled:focus,a:host.granite-button-disabled:hover{opacity:.4;text-decoration:none;cursor:default;border:.0625rem solid var(--granite-color-border-soft);pointer-events:none}"]
2511
+ styles: [":host{box-sizing:border-box}:host *,:host :after,:host :before{box-sizing:inherit;cursor:pointer}button:host{background-color:inherit;-webkit-appearance:none;-moz-appearance:none;appearance:none;border:none;font:inherit;border-radius:inherit;height:inherit;font-weight:inherit;line-height:inherit;color:inherit;margin:inherit;cursor:pointer;padding:inherit}a:host,button:host{outline:none}:host.granite-button-base{border-radius:.25rem;font-size:var(--granite-font-size-body-small);font-weight:var(--granite-font-weight-regular);padding:var(--granite-spacing-s) var(--granite-spacing-s);position:relative;line-height:var(--granite-font-size-body-medium);display:flex;justify-content:center;align-items:center;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}:host:focus:not(.granite-button-disabled):not(:active){border:2px solid #1a376d}button:host.granite-primary-button{background-color:var(--granite-color-background-active);color:var(--granite-color-text-on-active);border:2px solid transparent}button:host.granite-primary-button:hover:not(.granite-button-disabled){background-color:var(--granite-color-background-active-hover);color:none}button:host.granite-primary-button:active:not(.granite-button-disabled){background-color:var(--granite-color-background-active-selected);color:none}button:host.granite-button{background-color:var(--granite-color-background-variant);color:var(--granite-color-text);border:2px solid var(--granite-color-border-soft)}button:host.granite-button:hover:not(.granite-button-disabled){background-color:var(--granite-color-background-active-hover);color:var(--granite-color-text-on-active)}button:host.granite-button:active:not(.granite-button-disabled){background-color:var(--granite-color-background-active-selected);color:var(--granite-color-text-on-active)}button:host.granite-flat-button{background-color:transparent;color:var(--granite-color-text);border:2px solid transparent}button:host.granite-flat-button:hover:not(.granite-button-disabled){background-color:var(--granite-color-background-active-hover);color:var(--granite-color-text-on-active)}button:host.granite-flat-button:active:not(.granite-button-disabled){background-color:var(--granite-color-background-active-selected);color:var(--granite-color-text-on-active)}button:host.granite-nav-button{background-color:var(--granite-color-background-variant);color:var(--granite-color-text-link);border:2px solid var(--granite-color-border-soft)}button:host.granite-nav-button:hover:not(.granite-button-disabled){background-color:var(--granite-color-background-active-hover);color:var(--granite-color-text-on-active)}button:host.granite-nav-button:active:not(.granite-button-disabled){background-color:var(--granite-color-background-active-selected);color:var(--granite-color-text-on-active)}button:host.granite-nav-button:hover{text-decoration:underline}button:host.granite-button-disabled,button:host.granite-button-disabled:active,button:host.granite-button-disabled:focus,button:host.granite-button-disabled:hover{opacity:.4;cursor:default}a:host.granite-button{background-color:var(--granite-color-background-variant);color:var(--granite-color-text-link);border:2px solid var(--granite-color-border-soft)}a:host.granite-button:hover:not(.granite-button-disabled){background-color:var(--granite-color-background-active-hover);color:var(--granite-color-text-on-active)}a:host.granite-button:active:not(.granite-button-disabled){background-color:var(--granite-color-background-active-selected);color:var(--granite-color-text-on-active)}a:host.granite-button-disabled,a:host.granite-button-disabled:active,a:host.granite-button-disabled:focus,a:host.granite-button-disabled:hover{opacity:.4;text-decoration:none;cursor:default;border:2px solid var(--granite-color-border-soft);pointer-events:none}"]
2475
2512
  },] }
2476
2513
  ];
2477
2514
  GraniteAnchorComponent.ctorParameters = () => [
@@ -2870,5 +2907,5 @@ GraniteCoreModule.decorators = [
2870
2907
  * Generated bundle index. Do not edit.
2871
2908
  */
2872
2909
 
2873
- export { ClientInputDesktopDirective, ClientInputTouchDirective, ClientOutputDesktopDirective, ClientOutputTouchDirective, GRANITE_CLIENT_INPUT, GRANITE_CLIENT_OUTPUT, GraniteAnchorComponent, GraniteArrangeGridComponent, GraniteArrangeGridItemComponent, GraniteArrangeGridModule, GraniteArrangeGridOrientation, GraniteBadgeComponent, GraniteBadgeHarness, GraniteBadgeModule, GraniteButtonComponent, GraniteButtonModule, GraniteCheckboxComponent, GraniteCheckboxModule, GraniteCoreModule, GraniteDividerDirective, GraniteGridComponent, GraniteGridItemComponent, GraniteGridModule, GraniteIconComponent, GraniteIconModule, GraniteInputFieldComponent, GraniteInputFieldModule, GraniteMenuComponent, GraniteMenuHarness, GraniteMenuItemComponent, GraniteMenuItemHarness, GraniteMenuModule, GraniteMenuTouchCloseComponent, GraniteMenuTouchTitleItemComponent, GraniteMenuTriggerForDirective, GraniteRadioButtonComponent, GraniteRadioButtonModule, GraniteTableColumnDirective, GraniteTableComponent, GraniteTableModule, GraniteToggleSwitchComponent, GraniteToggleSwitchModule, _MenuBaseComponent, deviceDesktop, deviceTouch, disabledMixin, graniteMenuDesktopAnimations, graniteMenuTouchAnimations, ɵ0$1 as ɵ0, GRANITE_MENU_PANEL as ɵa, getEaseOutSteep as ɵc, getEaseLinear as ɵd, GraniteTableDataCellComponent as ɵe, GraniteCell as ɵf, GraniteTableHeaderCellComponent as ɵg, PurePipesModule as ɵh, GraniteTitlePipe as ɵi };
2910
+ export { BUTTON_CLASS, ButtonSelectors, ClientInputDesktopDirective, ClientInputTouchDirective, ClientOutputDesktopDirective, ClientOutputTouchDirective, FLAT_BUTTON_CLASS, GRANITE_CLIENT_INPUT, GRANITE_CLIENT_OUTPUT, GraniteAnchorComponent, GraniteArrangeGridComponent, GraniteArrangeGridItemComponent, GraniteArrangeGridModule, GraniteArrangeGridOrientation, GraniteBadgeComponent, GraniteBadgeHarness, GraniteBadgeModule, GraniteButtonComponent, GraniteButtonModule, GraniteCheckboxComponent, GraniteCheckboxModule, GraniteCoreModule, GraniteDividerDirective, GraniteGridComponent, GraniteGridItemComponent, GraniteGridModule, GraniteIconComponent, GraniteIconModule, GraniteInputFieldComponent, GraniteInputFieldModule, GraniteMenuComponent, GraniteMenuHarness, GraniteMenuItemComponent, GraniteMenuItemHarness, GraniteMenuModule, GraniteMenuTouchCloseComponent, GraniteMenuTouchTitleItemComponent, GraniteMenuTriggerForDirective, GraniteRadioButtonComponent, GraniteRadioButtonModule, GraniteTableColumnDirective, GraniteTableComponent, GraniteTableModule, GraniteTitleDirective, GraniteToggleSwitchComponent, GraniteToggleSwitchModule, NAV_BUTTON_CLASS, PRIMARY_BUTTON_CLASS, _MenuBaseComponent, deviceDesktop, deviceTouch, disabledMixin, graniteMenuDesktopAnimations, graniteMenuTouchAnimations, ɵ0$1 as ɵ0, GRANITE_MENU_PANEL as ɵa, getEaseOutSteep as ɵc, getEaseLinear as ɵd, GraniteTableDataCellComponent as ɵe, GraniteCell as ɵf, GraniteTableHeaderCellComponent as ɵg, PurePipesModule as ɵh, GraniteTitlePipe as ɵi };
2874
2911
  //# sourceMappingURL=ifsworld-granite-components.js.map